Advanced search  

News:

CPG Release 1.6.26
Correct PHP8.2 issues with user and language managers.
Additional fixes for PHP 8.2
Correct PHP8 error with SMF 2.0 bridge.
Correct IPTC supplimental category parsing.
Download and info HERE

Pages: [1]   Go Down

Author Topic: [Solved]: Resizing image on intermediate image page  (Read 4799 times)

0 Members and 1 Guest are viewing this topic.

bbsd

  • Coppermine newbie
  • Offline Offline
  • Posts: 10
[Solved]: Resizing image on intermediate image page
« on: May 12, 2008, 06:30:59 pm »

I'm not interested in creating intermediate images, and I'm also not interested in having the thumbnail link directly to the full-size pic because I regularly use several of the features on the intermediate image page.  However, most images are too large to fit into a regular-sized browser window, necessitating both horizontal and vertical scrolling, which is annoying.

So what I'd like is to resize the full-size image on the intermediate image page to a fixed width (in my case 680 px) making it look like an intermediate image. Any help would be appreciated!
« Last Edit: May 13, 2008, 08:17:31 am by Joachim Müller »
Logged

Hein Traag

  • Dev Team member
  • Coppermine addict
  • ****
  • Country: nl
  • Offline Offline
  • Gender: Male
  • Posts: 2166
  • A, B, Cpg
    • Personal website - Spintires.nl
Re: Resizing image on intermediate image page
« Reply #1 on: May 12, 2008, 07:01:38 pm »

Resize the pictures locally on your dekstop/laptop to the prefered size before uploading them to the gallery using ftp. Resizing on the server is very resource consuming and not as good in quality.
Logged

Stramm

  • Dev Team member
  • Coppermine addict
  • ****
  • Country: 00
  • Offline Offline
  • Gender: Male
  • Posts: 6006
    • Bettis Wollwelt
Re: Resizing image on intermediate image page
« Reply #2 on: May 12, 2008, 07:25:43 pm »

Set
Files and thumbnails settings -> Max width or height for uploaded pictures (pixels) -> the same as your intermediate image size
then
Files and thumbnails settings -> Auto resize images that are larger than max width or height -> Yes:Everyone

bbsd

  • Coppermine newbie
  • Offline Offline
  • Posts: 10
Re: Resizing image on intermediate image page
« Reply #3 on: May 12, 2008, 07:31:24 pm »

But I don't want the full-size image resized, I only want it to look resized on the intermediate image page.

Maybe I'm doing a really poor job of explaining this...

Hmmm...

Sort of how this: http://forum.coppermine-gallery.net/index.php/topic,49377.0.html works to resize the thumbnails on the page without resizing the actual thumbnails. That's what I want, except I want it for the main image on the intermediate image page.
Logged

Stramm

  • Dev Team member
  • Coppermine addict
  • ****
  • Country: 00
  • Offline Offline
  • Gender: Male
  • Posts: 6006
    • Bettis Wollwelt
Re: Resizing image on intermediate image page
« Reply #4 on: May 12, 2008, 08:03:08 pm »

The theme 'Blix' makes use of html resize. Download it and see how it's done in its theme.php

bbsd

  • Coppermine newbie
  • Offline Offline
  • Posts: 10
Re: Resizing image on intermediate image page
« Reply #5 on: May 12, 2008, 09:08:12 pm »

Okay, I'm not very good (understatement of the year) at this stuff, but it looks to me like this is the pertinent bit of code:

Code: [Select]
function theme_display_image($nav_menu, $picture, $votes, $pic_info, $comments, $film_strip)
{
    global $CONFIG,$lang_picinfo;

//    $width = $CONFIG['picture_table_width'];
    $width = '455px';
   
    echo $nav_menu;

    echo $picture;
   
    if ($CONFIG['display_film_strip'] == 1) {
        echo $film_strip;
    }

    echo $votes;

    $picinfo = isset($_COOKIE['picinfo']) ? $_COOKIE['picinfo'] : ($CONFIG['display_pic_info'] ? 'block' : 'none');
    echo "<div id=\"picinfo\" style=\"display: $picinfo;\">\n\t\t<h2>{$lang_picinfo['title']}</h2>\n";
    starttable();
    echo $pic_info;
    endtable();
    echo "</div>\n";

    echo "<div id=\"comments\">\n";
    echo $comments;
    echo "</div>\n";

}

Especially the $width = '455px'; part.

However, inputting this into my own theme.php does absolutely nothing to the image size, which leads me to the inescapable fact that there's more to it than this. A search for "455" (since that's the size they're going for) leads to this bit of code at the very bottom:

Code: [Select]
function compute_img_size_blix($width, $height)
{
    global $CONFIG;
    $max = 455;
    $thumb_use=$CONFIG['thumb_use'];

    $ratio = $width / $max;

    if ($ratio > 1.0) {
        $image_size['reduced'] = true;
    }
    $ratio = max($ratio, 1.0);
    $image_size['width'] = ceil($width / $ratio);
    $image_size['height'] = ceil($height / $ratio);
    $image_size['whole'] = 'width="'.$image_size['width'].'" height="'.$image_size['height'].'"';
    $image_size['geom'] = 'width="'.$image_size['width'].'"';

    return $image_size;
}


Which I guess is what helps the image keep its aspect ratio, but at this point I'm hopelessly lost and can't even begin to contemplate recreating this for my own gallery.

I can't help but think that there should be some easier way to do this. But as you can probably tell, I'm very much a beginner when it comes to this stuff, so that might not be the case at all.
Logged

Stramm

  • Dev Team member
  • Coppermine addict
  • ****
  • Country: 00
  • Offline Offline
  • Gender: Male
  • Posts: 6006
    • Bettis Wollwelt
Re: Resizing image on intermediate image page
« Reply #6 on: May 12, 2008, 09:22:58 pm »

from looking at it I'd say you'll need the functions theme_html_picture(), theme_display_image() and compute_img_size_blix() in your theme.php

bbsd

  • Coppermine newbie
  • Offline Offline
  • Posts: 10
Re: Resizing image on intermediate image page
« Reply #7 on: May 12, 2008, 09:50:26 pm »

Thanks for all your help, I think I got it to work (unless I find some bugs that are not readily apparent). For anyone else interested in this, here's the code I added to my theme.php:

Code: [Select]
function theme_display_image($nav_menu, $picture, $votes, $pic_info, $comments, $film_strip)
{
    global $CONFIG;

//    $width = $CONFIG['picture_table_width'];
    $width = '680px';

    starttable();
    echo $nav_menu;
    endtable();

    starttable();
    echo $picture;
    endtable();
    if ($CONFIG['display_film_strip'] == 1) {
        echo $film_strip;
    }


    echo $votes;



    $picinfo = isset($_COOKIE['picinfo']) ? $_COOKIE['picinfo'] : ($CONFIG['display_pic_info'] ? 'block' : 'none');
    echo "<div id=\"picinfo\" style=\"display: $picinfo;\">\n";
    starttable();
    echo $pic_info;
    endtable();
    echo "</div>\n";

    echo "<div id=\"comments\">\n";
        echo $comments;
        echo "</div>\n";

}

function theme_html_picture()
{
    global $CONFIG, $CURRENT_PIC_DATA, $CURRENT_ALBUM_DATA, $USER;
    global $album, $comment_date_fmt, $template_display_media;
    global $lang_display_image_php, $lang_picinfo;

    $pid = $CURRENT_PIC_DATA['pid'];
    $pic_title = '';

    if (!isset($USER['liv']) || !is_array($USER['liv'])) {
        $USER['liv'] = array();
    }
    // Add 1 to hit counter
    if (!USER_IS_ADMIN && !in_array($pid, $USER['liv']) && isset($_COOKIE[$CONFIG['cookie_name'] . '_data'])) {
        add_hit($pid);
        if (count($USER['liv']) > 4) array_shift($USER['liv']);
        array_push($USER['liv'], $pid);
    }

    if($CURRENT_PIC_DATA['pwidth'] > $CONFIG['picture_width']){
      $condition = true;
    }else{
     $condition = false;
    }

    if ($CURRENT_PIC_DATA['title'] != '') {
        $pic_title .= $CURRENT_PIC_DATA['title'] . "\n";
    }
    if ($CURRENT_PIC_DATA['caption'] != '') {
        $pic_title .= $CURRENT_PIC_DATA['caption'] . "\n";
    }
    if ($CURRENT_PIC_DATA['keywords'] != '') {
        $pic_title .= $lang_picinfo['Keywords'] . ": " . $CURRENT_PIC_DATA['keywords'];
    }

    if (!$CURRENT_PIC_DATA['title'] && !$CURRENT_PIC_DATA['caption']) {
        template_extract_block($template_display_media, 'img_desc');
    } else {
        if (!$CURRENT_PIC_DATA['title']) {
            template_extract_block($template_display_media, 'title');
        }
        if (!$CURRENT_PIC_DATA['caption']) {
            template_extract_block($template_display_media, 'caption');
        }
    }

    $CURRENT_PIC_DATA['menu'] = html_picture_menu(); //((USER_ADMIN_MODE && $CURRENT_ALBUM_DATA['category'] == FIRST_USER_CAT + USER_ID) || ($CONFIG['users_can_edit_pics'] && $CURRENT_PIC_DATA['owner_id'] == USER_ID && USER_ID != 0) || GALLERY_ADMIN_MODE) ? html_picture_menu($pid) : '';

    if ($CONFIG['make_intermediate'] && $condition ) {
        $picture_url = get_pic_url($CURRENT_PIC_DATA, 'normal');
    } else {
        $picture_url = get_pic_url($CURRENT_PIC_DATA, 'fullsize');
    }

    $image_size = compute_img_size_blix($CURRENT_PIC_DATA['pwidth'], $CURRENT_PIC_DATA['pheight']);

    $pic_title = '';
    $mime_content = cpg_get_type($CURRENT_PIC_DATA['filename']);


    if ($mime_content['content']=='movie' || $mime_content['content']=='audio') {

        if ($CURRENT_PIC_DATA['pwidth']==0 || $CURRENT_PIC_DATA['pheight']==0) {
            $CURRENT_PIC_DATA['pwidth']  = 320; // Default width

            // Set default height; if file is a movie
            if ($mime_content['content']=='movie') {
                $CURRENT_PIC_DATA['pheight'] = 240; // Default height
            }
        }

        $ctrl_offset['mov']=15;
        $ctrl_offset['wmv']=45;
        $ctrl_offset['swf']=0;
        $ctrl_offset['rm']=0;
        $ctrl_offset_default=45;
        $ctrl_height = (isset($ctrl_offset[$mime_content['extension']]))?($ctrl_offset[$mime_content['extension']]):$ctrl_offset_default;
        $image_size['whole']='width="'.$CURRENT_PIC_DATA['pwidth'].'" height="'.($CURRENT_PIC_DATA['pheight']+$ctrl_height).'"';
    }

    if ($mime_content['content']=='image') {
        if (isset($image_size['reduced'])) {
            $winsizeX = $CURRENT_PIC_DATA['pwidth']+5;  //the +'s are the mysterious FF and IE paddings
            $winsizeY = $CURRENT_PIC_DATA['pheight']+3; //the +'s are the mysterious FF and IE paddings
            $pic_html = "<a href=\"javascript:;\" onclick=\"MM_openBrWindow('displayimage.php?pid=$pid&amp;fullsize=1','" . uniqid(rand()) . "','scrollbars=yes,toolbar=no,status=no,resizable=yes,width=$winsizeX,height=$winsizeY')\">";
            $pic_title = $lang_display_image_php['view_fs'] . "\n==============\n" . $pic_title;
            $pic_html .= "<img src=\"" . $picture_url . "\" {$image_size['geom']} class=\"image\" border=\"0\" alt=\"{$lang_display_image_php['view_fs']}\" /><br />";
            $pic_html .= "</a>\n";
        } else {
            $pic_html = "<img src=\"" . $picture_url . "\" {$image_size['geom']} class=\"image\" border=\"0\" alt=\"\" /><br />\n";
        }
    } elseif ($mime_content['content']=='document') {
        $pic_thumb_url = get_pic_url($CURRENT_PIC_DATA,'thumb');
        $pic_html = "<a href=\"{$picture_url}\" target=\"_blank\" class=\"document_link\"><img src=\"".$pic_thumb_url."\" border=\"0\" class=\"image\" /></a>\n<br />";
    } else {
        $autostart = ($CONFIG['media_autostart']) ? ('true'):('false');

        $players['WMP'] = array('id' => 'MediaPlayer',
                                'clsid' => 'classid="" ',
                                'codebase' => 'codebase="http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=5,1,52,701" ',
                                'mime' => 'type="application/x-mplayer2" ',
                               );
        $players['RMP'] = array('id' => 'RealPlayer',
                                'clsid' => 'classid="clsid:CFCDAA03-8BE4-11cf-B84B-0020AFBBCCFA" ',
                                'codebase' => '',
                                'mime' => 'type="audio/x-pn-realaudio-plugin" '
                               );
        $players['QT']  = array('id' => 'QuickTime',
                                'clsid' => 'classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" ',
                                'codebase' => 'codebase="http://www.apple.com/qtactivex/qtplugin.cab" ',
                                'mime' => 'type="video/x-quicktime" '
                               );
        $players['SWF'] = array('id' => 'SWFlash',
                                'clsid' => ' classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" ',
                                'codebase' => 'codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0" ',
                                'mime' => 'type="application/x-shockwave-flash" '
                               );
        $players['UNK'] = array('id' => 'DefaultPlayer',
                                'clsid' => '',
                                'codebase' => '',
                                'mime' => ''
                               );

        if (isset($_COOKIE[$CONFIG['cookie_name'].'_'.$mime_content['extension'].'player'])) {
            $user_player = $_COOKIE[$CONFIG['cookie_name'].'_'.$mime_content['extension'].'player'];
        } else {
            $user_player = $mime_content['player'];
        }

                // There isn't a player selected or user wants client-side control
        if (!$user_player) {
            $user_player = 'UNK';
        }

        $player = $players[$user_player];

        $pic_html  = '<object id="'.$player['id'].'" '.$player['clsid'].$player['codebase'].$player['mime'].$image_size['whole'].'>';
        $pic_html .= "<param name=\"autostart\" value=\"$autostart\" /><param name=\"src\" value=\"". $picture_url . "\" />";
        $pic_html .= '<embed '.$image_size['whole'].' src="'. $picture_url . '" autostart="'.$autostart.'" '.$player['mime'].'></embed>';
        $pic_html .= "</object><br />\n";
    }

    $CURRENT_PIC_DATA['html'] = $pic_html;
    $CURRENT_PIC_DATA['header'] = '';
    $CURRENT_PIC_DATA['footer'] = '';

    $CURRENT_PIC_DATA = CPGPluginAPI::filter('file_data',$CURRENT_PIC_DATA);

    $params = array('{CELL_HEIGHT}' => '100',
        '{IMAGE}' => $CURRENT_PIC_DATA['header'].$CURRENT_PIC_DATA['html'].$CURRENT_PIC_DATA['footer'],
        '{ADMIN_MENU}' => $CURRENT_PIC_DATA['menu'],
        '{TITLE}' => bb_decode($CURRENT_PIC_DATA['title']),
        '{CAPTION}' => bb_decode($CURRENT_PIC_DATA['caption']),
        );

    return template_eval($template_display_media, $params);
}


function compute_img_size_blix($width, $height)
{
    global $CONFIG;
    $max = 680;
    $thumb_use=$CONFIG['thumb_use'];

    $ratio = $width / $max;

    if ($ratio > 1.0) {
        $image_size['reduced'] = true;
    }
    $ratio = max($ratio, 1.0);
    $image_size['width'] = ceil($width / $ratio);
    $image_size['height'] = ceil($height / $ratio);
    $image_size['whole'] = 'width="'.$image_size['width'].'" height="'.$image_size['height'].'"';
    $image_size['geom'] = 'width="'.$image_size['width'].'"';

    return $image_size;
}

Do a search/replace of "680", unless that's the size you want to resize to as well.
Logged
Pages: [1]   Go Up
 

Page created in 0.024 seconds with 19 queries.