Support Forum Project Downloads FAQ Documentation About Demo Tutorials Blog Plugins
November 21, 2009, 09:03:09 am *
Welcome, Guest. Please login or register.
Did you miss your activation email?

Login with username, password and session length
News: cpg1.5.2 beta released
The brand new cpg1.5.x series that comes with a lot of new features finally has reached the release stage: a first public beta release cpg1.5.2 has been released that is mainly aimed at translators, testers and community members that have contributed in the past. The beta release is not meant to be used in a production environment, but only on testbeds and for evaluation purposes. There is currently no support for cpg1.5.x yet!
[more]
   Home   Help Search Board rules Login Register  
Pages: 1 2 3 [4] 5 6 7 8 ... 17   Go Down
  Print  
Author Topic: LightBox JS for Fullsize Popup Image  (Read 148311 times)
0 Members and 1 Guest are viewing this topic.
m@rk
Contributor
***
Gender: Male
Posts: 39


« Reply #60 on: January 27, 2007, 05:07:59 pm »

Hey SaWey,

thanks for your quick reply.

I already tried this: then the image in the CPG "display single image" is displayed in "_normal", just as it should by default, but also in the lightbox popup.

Without changing, both are displayed in full size.

How can we handle it, that an image in the CPG "display single image" is displayed in "_normal", but in full size in the lightbox popup? ...

With kind regards
Logged
SaWey
Dev Team member
****
Gender: Male
Belgium Belgium

Posts: 1119



WWW
« Reply #61 on: January 27, 2007, 05:36:00 pm »

To that, there is a simple solution by just adding a variable like $picture_url_fullsize like i did in the following code:

Code:
function lightbox_list($picId)
{
$i = 0;
$pid = $picId;
$pic_data = get_pic_data($_GET['album'], $pic_count, $album_name, -1, -1, false);
foreach ($pic_data as $picture) {
if($CONFIG['thumb_use']=='ht' && $picture['pheight'] > $CONFIG['picture_width'] ){
  $condition = true;
}elseif($CONFIG['thumb_use']=='wd' && $picture['pwidth'] > $CONFIG['picture_width']){
  $condition = true;
}elseif($CONFIG['thumb_use']=='any' && max($picture['pwidth'], $picture['pheight']) > $CONFIG['picture_width']){
  $condition = true;
}else{
$condition = false;
}
if (is_image($picture['filename'])) {
if ($CONFIG['make_intermediate'] && $condition ) {
$picture_url = get_pic_url($picture, 'normal');
} else {
$picture_url = get_pic_url($picture, 'normal');
}
$picture_url_fullsize = get_pic_url($picture, 'fullsize');
$pic_title = ($picture['title'] ? $picture['title'] : strtr(preg_replace("/(.+)\..*?\Z/", "\\1", htmlspecialchars($picture['filename'])), "_", " "));
if ($picture['pid'] == $pid) {
$picList .= "<a href=\"$picture_url_fullsize\" rel=\"lightbox[list]\" title=\"$pic_title\">";
            $picList .= "<img src=\"$picture_url\" class=\"image\" border=\"0\" alt=\"Klik op de foto om originele grootte te bekijken\" /><br />";
            $picList .= "</a>\n";
}else{
$picList .= "<a href=\"$picture_url_fullsize\" rel=\"lightbox[list]\" title=\"$pic_title\"></a>\n";
}
$i++;
}
}
return $picList;
}

If you want, you can simply replace the old function with this one.

I hope this time I got it right  Smiley
Logged
m@rk
Contributor
***
Gender: Male
Posts: 39


« Reply #62 on: January 27, 2007, 07:30:37 pm »

SaWey,

fantastic, absolutely fantastic, that's exactly what I was talking about.

There are still 2 bugs I can't get rid of:
  • The alternate text when hovering over the image won't change so i hard coded it in the alt="" tag

The solution is simple: just add global $lang_display_image_php to the lightbox_list($picId) function

Code:
function lightbox_list($picId) {
    global $lang_display_image_php;

and change the corresponding line in that function:

Code:
$picList .= "<img src=\"$picture_url\" class=\"image\" border=\"0\" alt=\"$lang_display_image_php[view_fs]\" /><br />";

  • When you click on a random image, there is a fault caused by the get_pic_data-function in functions.inc.php
    can someone help??

Please, a developer must fix this  Roll Eyes

... 'cause with the new lightbox script contributed by Gizmo - not only viewing all the images in a selected album, even the lightbox slideshow is possible!

I'm preparing a post to summarize what we have reached so far ...
Logged
m@rk
Contributor
***
Gender: Male
Posts: 39


« Reply #63 on: January 27, 2007, 09:42:14 pm »

EDIT: Be aware of problems caused by Step 7 and read the posts below first!

Summary of what we reached so far
- enclosing all contributions of this thread -

(Note: attachment and install-guide based on new lightbox/ slideshow script contributed in the link on http://www.huddletogether.com/forum/comments.php?DiscussionID=307&page=1#Item_0)

Step 1. Backup your theme folder!

Step 2. If you haven't done already, create a folder called scripts in your gallery root directory.

Step 3. Download slideshow.zip from http://ahavriluk.home.comcast.net/slideshow.zip.

Step 4. Extract the whole slideshow folder into your (newly created) scripts folder.

Step 5. Download the attached lightbox_s.js.zip and replace scripts/slideshow/js/lightbox_s.js with the included file.

Step 6. Add this code to the head section of your template.html file:

Code:
<link rel="stylesheet" href="scripts/slideshow/css/lightbox.css" type="text/css" media="screen" />
<script type="text/javascript" src="scripts/slideshow/js/prototype.js"></script>
<script type="text/javascript" src="scripts/slideshow/js/scriptaculous.js?load=effects"></script>
<script type="text/javascript" src="scripts/slideshow/js/lightbox_s.js"></script>

Step 7. Paste this code before the ?> at the end of your theme.php file:

Code:
// Displays a picture
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($CONFIG['thumb_use']=='ht' && $CURRENT_PIC_DATA['pheight'] > $CONFIG['picture_width'] ){ // The wierd comparision is because only picture_width is stored
      $condition = true;
    }elseif($CONFIG['thumb_use']=='wd' && $CURRENT_PIC_DATA['pwidth'] > $CONFIG['picture_width']){
      $condition = true;
    }elseif($CONFIG['thumb_use']=='any' && max($CURRENT_PIC_DATA['pwidth'], $CURRENT_PIC_DATA['pheight']) > $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($CURRENT_PIC_DATA['pwidth'], $CURRENT_PIC_DATA['pheight'], $CONFIG['picture_width']);

    $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'])) {
#################################################
        //First part of lightbox update
$pic_html = lightbox_list($CURRENT_PIC_DATA['pid']);
//End of first part
#################################################
        } 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="clsid:6BF52A52-394A-11D3-B153-00C04F79FAA6" ',
                                '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['classid'].$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);
}

#################################################
 //Second part of lightbox update
 
function lightbox_list($picId) {
    global $lang_display_image_php;

$i = 0;
$pid = $picId;
$pic_data = get_pic_data($_GET['album'], $pic_count, $album_name, -1, -1, false);
foreach ($pic_data as $picture) {
if($CONFIG['thumb_use']=='ht' && $picture['pheight'] > $CONFIG['picture_width'] ){
  $condition = true;
}elseif($CONFIG['thumb_use']=='wd' && $picture['pwidth'] > $CONFIG['picture_width']){
  $condition = true;
}elseif($CONFIG['thumb_use']=='any' && max($picture['pwidth'], $picture['pheight']) > $CONFIG['picture_width']){
  $condition = true;
}else{
$condition = false;
}
if (is_image($picture['filename'])) {
if ($CONFIG['make_intermediate'] && $condition ) {
$picture_url = get_pic_url($picture, 'normal');
} else {
$picture_url = get_pic_url($picture, 'normal');
}
$picture_url_fullsize = get_pic_url($picture, 'fullsize');
$pic_title = ($picture['title'] ? $picture['title'] : strtr(preg_replace("/(.+)\..*?\Z/", "\\1", htmlspecialchars($picture['filename'])), "_", " "));
if ($picture['pid'] == $pid) {
$picList .= "<a href=\"$picture_url_fullsize\" rel=\"lightbox[list]\" title=\"$pic_title\">";
            $picList .= "<img src=\"$picture_url\" class=\"image\" border=\"0\" alt=\"$lang_display_image_php[view_fs]\" /><br />";
            $picList .= "</a>\n";
}else{
$picList .= "<a href=\"$picture_url_fullsize\" rel=\"lightbox[list]\" title=\"$pic_title\"></a>\n";
}
$i++;
}
}
return $picList;
}//End of second part
#################################################

Step 8. Upload.

Step 9. Relax  Cool

Step 10. Pay attention/ developers request:

  • When you click on a random image, there is a fault caused by the get_pic_data-function in functions.inc.php
    can someone help??

(And a few images lightbox doesn't seem to like, they are simply not loaded - i can't specify the problem exactly atm...)

If someone could fix that, the world would be perfect ...
« Last Edit: January 28, 2007, 09:08:29 am by m@rk » Logged
Nibbler
Dev Team member
****
Gender: Male
United Kingdom United Kingdom

Posts: 19445



WWW
« Reply #64 on: January 27, 2007, 10:38:55 pm »

I don't know if this is a bug or not, doesn't cause problems on its own.

Code:
$query = "SELECT $select_columns FROM {$CONFIG['TABLE_PICTURES']} WHERE approved = 'YES' $META_ALBUM_SET ORDER BY RAND() LIMIT $limit2";

change to

Code:
$query = "SELECT $select_columns FROM {$CONFIG['TABLE_PICTURES']} WHERE approved = 'YES' $META_ALBUM_SET ORDER BY RAND() $limit";

Also, $CONFIG needs to be global in the lightbox_list function.

Code:
function lightbox_list($picId) {
    global $lang_display_image_php, $CONFIG;

This mod will not work well on large albums, bear that in mind.

Another also is this code

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

 Huh Sad Wink
Logged

I don't care about what they say, I won't live or die that way.
m@rk
Contributor
***
Gender: Male
Posts: 39


« Reply #65 on: January 27, 2007, 11:01:42 pm »

... another problem:

Static links (like http://www.my_gallery.net/displayimage.php?pos=-411) don't work ("Error: The selected album/file does not exist !") while they do with Gizmo's contribution?

Until these problems are solved, the original mod by Gizmo is to prefer ...

That's kind of sad 'cause viewing all the images in a selected album and the lightbox slideshow would be great features in my opinion Cry
« Last Edit: January 27, 2007, 11:06:53 pm by m@rk » Logged
SaWey
Dev Team member
****
Gender: Male
Belgium Belgium

Posts: 1119



WWW
« Reply #66 on: January 27, 2007, 11:08:43 pm »

Hey Nibbler,

First of all, thank you for taking the notice.

For the big albums, tomorow i'll look into the code to make it possible
to set a limit to the amount of pics loaded.

The change of the first code you put above, in which file is this?
And what's the problem with the last part?
Code:
if ($CONFIG['make_intermediate'] && $condition ) {
$picture_url = get_pic_url($picture, 'normal');
} else {
$picture_url = get_pic_url($picture, 'normal');
}


And for you Mark, i'll also look into that one,
this has to work Smiley
Logged
Nibbler
Dev Team member
****
Gender: Male
United Kingdom United Kingdom

Posts: 19445



WWW
« Reply #67 on: January 27, 2007, 11:13:12 pm »

For the absolute link:

Change

Code:
$pic_html = lightbox_list($CURRENT_PIC_DATA['pid']);

to

Code:
$pic_html = lightbox_list($CURRENT_PIC_DATA);

and adjust here

Code:
function lightbox_list($picId) {
    global $lang_display_image_php, $CONFIG;

$i = 0;
$pid = $picId['pid'];
$aid = empty($_GET['album']) ? $picId['aid'] : $_GET['album'];


$pic_data = get_pic_data($aid, $pic_count, $album_name, -1, -1, false);

The code in the previous post was a correction to include/functions.inc.php inside get_pic_data().

There is no point in using a conditional statement if both parts are identical.
Logged

I don't care about what they say, I won't live or die that way.
m@rk
Contributor
***
Gender: Male
Posts: 39


« Reply #68 on: January 27, 2007, 11:57:48 pm »

Thanks Nibbler, that actually solved the problem with static links.

There is no point in using a conditional statement if both parts are identical

... just the heat i guess ...  Roll Eyes

And for you Mark, i'll also look into that one, this has to work Smiley

We are on our way!
Thanks & good night for today
Logged
SaWey
Dev Team member
****
Gender: Male
Belgium Belgium

Posts: 1119



WWW
« Reply #69 on: January 28, 2007, 02:03:31 pm »

I made the changes so it is possible to set a max amount of pics shown in the slideshow.
You have to update the whole 'lightbox_list' function as following:

Code:
#################################################
 //Second part of lightbox update
 
function lightbox_list($picId) {
################################################
//Set max number of images
$max = 10; //(-1 for all pics in album)
################################################
    global $lang_display_image_php, $CONFIG;
$i = 0;
$pid = $picId['pid'];
$aid = empty($_GET['album']) ? $picId['aid'] : $_GET['album'];
$pic_data = get_pic_data($aid, $pic_count, $album_name, -1, -1, false);
$imax = 0; //counter
$max = $max/2;
foreach ($pic_data as $picture){
if ($picture['pid'] == $pid) {
//the number of the picture in  order
$picnumber = $imax;
}
$imax++;
}
//Check beginning and ending of album
if(! ($max == ((-1)/2))){
if ($imax > $max){
if ($picnumber < $max || $picnumber == 0){
$down = 0;
$up = 0 + ($max*2);
}elseif (($picnumber + $max) > $imax){
$down = $imax - ($max*2);
$up = $imax;
}else{
$down = $picnumber - $max;
$up = $picnumber + $max;
}
}else{
$down = 0;
$up = $imax;
}
}else{
$down = 0;
$up = $imax;
}

foreach ($pic_data as $picture) {
if ($i >= $down && $i <= $up){
if($CONFIG['thumb_use']=='ht' && $picture['pheight'] > $CONFIG['picture_width'] ){
  $condition = true;
}elseif($CONFIG['thumb_use']=='wd' && $picture['pwidth'] > $CONFIG['picture_width']){
  $condition = true;
}elseif($CONFIG['thumb_use']=='any' && max($picture['pwidth'], $picture['pheight']) > $CONFIG['picture_width']){
  $condition = true;
}else{
$condition = false;
}
if (is_image($picture['filename'])) {
if ($CONFIG['make_intermediate'] && $condition ) {
$picture_url = get_pic_url($picture, 'normal');
} else {
$picture_url = get_pic_url($picture, 'fullsize');
}
$picture_url_fullsize = get_pic_url($picture, 'fullsize');
$pic_title = ($picture['title'] ? $picture['title'] : strtr(preg_replace("/(.+)\..*?\Z/", "\\1", htmlspecialchars($picture['filename'])), "_", " "));
if ($picture['pid'] == $pid) {
$picList .= "<a href=\"$picture_url_fullsize\" rel=\"lightbox[list]\" title=\"$pic_title\">";
$picList .= "<img src=\"$picture_url\" class=\"image\" border=\"0\" alt=\"$lang_display_image_php[view_fs]\" /><br />";
$picList .= "</a>\n";
}else{
$picList .= "<a href=\"$picture_url_fullsize\" rel=\"lightbox[list]\" title=\"$pic_title\"></a>\n";
}
}
}
$i++;
}
return $picList;
}//End of second part
#################################################

I think this solves all the problems.
Please test it.... (I haven't found any bugs yet)

Grz
Logged
m@rk
Contributor
***
Gender: Male
Posts: 39


« Reply #70 on: January 28, 2007, 07:13:55 pm »

Seems to work fine. Good work so far.

If we only could fix the "random image" problem ...  Wink
Logged
Nibbler
Dev Team member
****
Gender: Male
United Kingdom United Kingdom

Posts: 19445



WWW
« Reply #71 on: January 28, 2007, 07:43:13 pm »

I don't know if this is a bug or not, doesn't cause problems on its own.

Code:
$query = "SELECT $select_columns FROM {$CONFIG['TABLE_PICTURES']} WHERE approved = 'YES' $META_ALBUM_SET ORDER BY RAND() LIMIT $limit2";

change to

Code:
$query = "SELECT $select_columns FROM {$CONFIG['TABLE_PICTURES']} WHERE approved = 'YES' $META_ALBUM_SET ORDER BY RAND() $limit";

That fixes it for me, not you?
Logged

I don't care about what they say, I won't live or die that way.
m@rk
Contributor
***
Gender: Male
Posts: 39


« Reply #72 on: January 28, 2007, 08:12:25 pm »

Sorry, I don't get that -

this results in permanent "critical error while processing a database query"?


ooops - I didn't follow your instruction properly - seems we finally got it  Grin
Logged
SaWey
Dev Team member
****
Gender: Male
Belgium Belgium

Posts: 1119



WWW
« Reply #73 on: January 28, 2007, 09:11:30 pm »

Summary of how to get the Lightbox thingy working:
- enclosing all contributions of this thread -

(Note: attachment and install-guide based on new lightbox/ slideshow script contributed in the link on http://www.huddletogether.com/forum/comments.php?DiscussionID=307&page=1#Item_0)

Step 1. Backup your theme folder!

Step 2. If you haven't done already, create a folder called scripts in your gallery root directory.

Step 3. Download slideshow.zip from http://ahavriluk.home.comcast.net/slideshow.zip.

Step 4. Extract the whole slideshow folder into your (newly created) scripts folder.

Step 5. Download the attached lightbox_s.js.zip and replace scripts/slideshow/js/lightbox_s.js with the included file.

Step 6. Add this code to the head section of your template.html file:

Code:
<link rel="stylesheet" href="scripts/slideshow/css/lightbox.css" type="text/css" media="screen" />
<script type="text/javascript" src="scripts/slideshow/js/prototype.js"></script>
<script type="text/javascript" src="scripts/slideshow/js/scriptaculous.js?load=effects"></script>
<script type="text/javascript" src="scripts/slideshow/js/lightbox_s.js"></script>

Step 7. Paste this code before the ?> at the end of your theme.php file:

Code:
// Displays a picture
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($CONFIG['thumb_use']=='ht' && $CURRENT_PIC_DATA['pheight'] > $CONFIG['picture_width'] ){ // The wierd comparision is because only picture_width is stored
      $condition = true;
    }elseif($CONFIG['thumb_use']=='wd' && $CURRENT_PIC_DATA['pwidth'] > $CONFIG['picture_width']){
      $condition = true;
    }elseif($CONFIG['thumb_use']=='any' && max($CURRENT_PIC_DATA['pwidth'], $CURRENT_PIC_DATA['pheight']) > $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($CURRENT_PIC_DATA['pwidth'], $CURRENT_PIC_DATA['pheight'], $CONFIG['picture_width']);

    $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'])) {
#################################################
        //First part of lightbox update
        $pic_html = lightbox_list($CURRENT_PIC_DATA['pid']);
        //End of first part
#################################################
        } 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="clsid:6BF52A52-394A-11D3-B153-00C04F79FAA6" ',
                                '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['classid'].$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);
}

#################################################
 //Second part of lightbox update
 
function lightbox_list($picId) {
################################################
//Set max number of images
$max = 10; //(-1 for all pics in album)
################################################
    global $lang_display_image_php, $CONFIG;
$i = 0;
$pid = $picId['pid'];
$aid = empty($_GET['album']) ? $picId['aid'] : $_GET['album'];
$pic_data = get_pic_data($aid, $pic_count, $album_name, -1, -1, false);
$imax = 0; //counter
$max = $max/2;
foreach ($pic_data as $picture){
if ($picture['pid'] == $pid) {
//the number of the picture in  order
$picnumber = $imax;
}
$imax++;
}
//Check beginning and ending of album
if(! ($max == ((-1)/2))){
if ($imax > $max){
if ($picnumber < $max || $picnumber == 0){
$down = 0;
$up = 0 + ($max*2);
}elseif (($picnumber + $max) > $imax){
$down = $imax - ($max*2);
$up = $imax;
}else{
$down = $picnumber - $max;
$up = $picnumber + $max;
}
}else{
$down = 0;
$up = $imax;
}
}else{
$down = 0;
$up = $imax;
}

foreach ($pic_data as $picture) {
if ($i >= $down && $i <= $up){
if($CONFIG['thumb_use']=='ht' && $picture['pheight'] > $CONFIG['picture_width'] ){
  $condition = true;
}elseif($CONFIG['thumb_use']=='wd' && $picture['pwidth'] > $CONFIG['picture_width']){
  $condition = true;
}elseif($CONFIG['thumb_use']=='any' && max($picture['pwidth'], $picture['pheight']) > $CONFIG['picture_width']){
  $condition = true;
}else{
$condition = false;
}
if (is_image($picture['filename'])) {
if ($CONFIG['make_intermediate'] && $condition ) {
$picture_url = get_pic_url($picture, 'normal');
} else {
$picture_url = get_pic_url($picture, 'fullsize');
}
$picture_url_fullsize = get_pic_url($picture, 'fullsize');
$pic_title = ($picture['title'] ? $picture['title'] : strtr(preg_replace("/(.+)\..*?\Z/", "\\1", htmlspecialchars($picture['filename'])), "_", " "));
if ($picture['pid'] == $pid) {
$picList .= "<a href=\"$picture_url_fullsize\" rel=\"lightbox[list]\" title=\"$pic_title\">";
$picList .= "<img src=\"$picture_url\" class=\"image\" border=\"0\" alt=\"$lang_display_image_php[view_fs]\" /><br />";
$picList .= "</a>\n";
}else{
$picList .= "<a href=\"$picture_url_fullsize\" rel=\"lightbox[list]\" title=\"$pic_title\"></a>\n";
}
}
}
$i++;
}
return $picList;
}//End of second part
#################################################

Step 8. Making sure the random images are shown:

I don't know if this is a bug or not, doesn't cause problems on its own.

Code:
$query = "SELECT $select_columns FROM {$CONFIG['TABLE_PICTURES']} WHERE approved = 'YES' $META_ALBUM_SET ORDER BY RAND() LIMIT $limit2";

change to

Code:
$query = "SELECT $select_columns FROM {$CONFIG['TABLE_PICTURES']} WHERE approved = 'YES' $META_ALBUM_SET ORDER BY RAND() $limit";

Step 9. Upload

Step 10. Relax  Cool
Logged
olti
Coppermine regular visitor
**
Posts: 68


WWW
« Reply #74 on: January 30, 2007, 12:22:59 pm »

For me it doesnt work, the image opens up in a new page!
Logged
Ben.Hahlen
Coppermine newbie

Gender: Male
Posts: 3


WWW
« Reply #75 on: January 30, 2007, 12:27:30 pm »

For me the latest code of the theme.php doesn't work either, ie the pictures are not shown. When using the code for theme.php a few posts up, it does work properly, but I'm not enough of a coder to find what the difference is.
Another question I have is in which file the following code
Code:
$query = "SELECT $select_columns FROM {$CONFIG['TABLE_PICTURES']} WHERE approved = 'YES' $META_ALBUM_SET ORDER BY RAND() LIMIT $limit2";
should be changed to
Code:
$query = "SELECT $select_columns FROM {$CONFIG['TABLE_PICTURES']} WHERE approved = 'YES' $META_ALBUM_SET ORDER BY RAND() $limit";
Thanks in advance
Logged
m@rk
Contributor
***
Gender: Male
Posts: 39


« Reply #76 on: January 30, 2007, 12:59:15 pm »

The code in the previous post was a correction to include/functions.inc.php inside get_pic_data().
Logged
SaWey
Dev Team member
****
Gender: Male
Belgium Belgium

Posts: 1119



WWW
« Reply #77 on: January 30, 2007, 06:20:54 pm »

For those where it won't work,
be absolutly sertain the paths to the corresponding files are right!

maybe you put in the code:
Code:
<script type="text/javascript" src="scripts/slideshow/js/prototype.js"></script>

When actualy you putted the file in:
Code:
<script type="text/javascript" src="scripts/js/prototype.js"></script>

Check that and if it still won't work, give all info you can so we can help.

Grz
Logged
Ben.Hahlen
Coppermine newbie

Gender: Male
Posts: 3


WWW
« Reply #78 on: January 30, 2007, 10:58:04 pm »

Whoops, missed that one, sorry for that.
Logged
olti
Coppermine regular visitor
**
Posts: 68


WWW
« Reply #79 on: January 30, 2007, 11:55:08 pm »

I think I know where is the problem for me.

I found this:

Quote
It doesn't work at all. The image opens up in a new page. What's wrong?
    This is commonly caused by a conflict between JS scripts. Check your body tag and look for an onload attribute. Example:
    <body onload="MM_preloadImages(‘/images/menu_on.gif’)…;">
    A quick fix to this problem is to append the initLightbox() to the onload attribute as so:
    <body onload="MM_preloadImages(‘/images/menu_on.gif’)…;initLightbox()">

The problem is I don't know where to put …;initLightbox()">. Which is the file that should be modified?
Logged
Pages: 1 2 3 [4] 5 6 7 8 ... 17   Go Up
  Print  
 
Jump to:  

Powered by SMF 1.1.10 | SMF © 2006-2009, Simple Machines LLC
Page created in 0.14 seconds with 16 queries.