Advanced search  

News:

cpg1.5.48 Security release - upgrade mandatory!
The Coppermine development team is releasing a security update for Coppermine in order to counter a recently discovered vulnerability. It is important that all users who run version cpg1.5.46 or older update to this latest version as soon as possible.
[more]

Pages: 1 [2] 3 4 5 6 ... 17   Go Down

Author Topic: LightBox JS for Fullsize Popup Image  (Read 436383 times)

0 Members and 1 Guest are viewing this topic.

rphMedia

  • Contributor
  • Coppermine addict
  • ***
  • Offline Offline
  • Gender: Male
  • Posts: 515
  • ***muvipix.com***
    • muvipix - Music | Video | Pictures
Re: LightBox JS for Fullsize Popup Image
« Reply #20 on: September 28, 2006, 04:34:52 pm »

Hey rphMedia,

Thanks and nice little patch there to allow closing on clicking the image. I was using a different fix but this one is only a single line change. Always better to change only one line when possible. ;)

Cheers,

Gizmo



NP, I actually found that at the discussion forum you referenced in the earlier post.  David9 PM"d me and I gave him the thread you referenced as well. 

PS, understand that the resize modified lightbox.js - Firefox ignores it.  Just info.

rphMedia

  • Contributor
  • Coppermine addict
  • ***
  • Offline Offline
  • Gender: Male
  • Posts: 515
  • ***muvipix.com***
    • muvipix - Music | Video | Pictures
Re: LightBox JS for Fullsize Popup Image
« Reply #21 on: September 28, 2006, 10:00:46 pm »

You're definitely going to want this mod after you see what IE7 does to the popup of the intermediate (attached).  The new browser is nice in some ways, but intrusive in others.

Gizmo

  • Dev Team member
  • Coppermine addict
  • ****
  • Offline Offline
  • Gender: Male
  • Posts: 1015
    • BullsEye Photos
Re: LightBox JS for Fullsize Popup Image
« Reply #22 on: September 29, 2006, 12:17:33 am »

Hey Ron,

I hate IE... just wish people would stop using it and move to anything else (I prefer FF myself).

Quote
PS, understand that the resize modified lightbox.js - Firefox ignores it.  Just info.
I have the resize script running with the "close on image click" and it's works fine on FF. What it won't do is resize the popup if I resize the browser window once it's up.
Logged
Did you read the manual first???? Taking 2 minutes to backup your files can save you hours of wondering what you screwed up.
Billy Bullock - BullsEyePhotos Blog of Indecision

rphMedia

  • Contributor
  • Coppermine addict
  • ***
  • Offline Offline
  • Gender: Male
  • Posts: 515
  • ***muvipix.com***
    • muvipix - Music | Video | Pictures
Re: LightBox JS for Fullsize Popup Image
« Reply #23 on: September 29, 2006, 09:08:20 am »

I have the resize script running with the "close on image click" and it's works fine on FF. What it won't do is resize the popup if I resize the browser window once it's up.

Oh yeah, I know that the "close on image click" works ;)

The resize portion doesn't. If the original image is 1024x768, when I click the intermediate with the new lightbox.js script in Firefox, the image is not scaled to fit at all.     

rphMedia

  • Contributor
  • Coppermine addict
  • ***
  • Offline Offline
  • Gender: Male
  • Posts: 515
  • ***muvipix.com***
    • muvipix - Music | Video | Pictures
Re: LightBox JS for Fullsize Popup Image
« Reply #24 on: October 03, 2006, 02:51:28 pm »

Hey Gizmo, just a heads up.  You have a typo in your first post modifying theme.php -

this line:

Code: [Select]
$pic_html  = '<object id="'.$player['id'].'" '.$player['classid'].$player['codebase'].$player['mime'].$image_size['whole'].'>';
should be   (( clsid )):

Code: [Select]
$pic_html  = '<object id="'.$player['id'].'" '.$player['clsid'].$player['codebase'].$player['mime'].$image_size['whole'].'>';
Symptoms: Flash Files in your gallery are inoperable in Firefox ! (which, I didn't know that FF reads the '<object>' tag  ???

Spent about 3 hours figuring this one out :)





Gizmo

  • Dev Team member
  • Coppermine addict
  • ****
  • Offline Offline
  • Gender: Male
  • Posts: 1015
    • BullsEye Photos
Re: LightBox JS for Fullsize Popup Image
« Reply #25 on: October 03, 2006, 04:05:24 pm »

Oppss... I used sample>theme.php version 1.4.4 to grab that code. I just downloaded the latest sample theme folder and it's correct as you state. I have too 3 computers that I work from so it's time to go and make sure they all have the latest Coppermine files on them. Sorry.... I owe you a beer or two.  :P
Logged
Did you read the manual first???? Taking 2 minutes to backup your files can save you hours of wondering what you screwed up.
Billy Bullock - BullsEyePhotos Blog of Indecision

ppeter

  • Coppermine novice
  • *
  • Offline Offline
  • Gender: Male
  • Posts: 36
Re: LightBox JS for Fullsize Popup Image
« Reply #26 on: October 21, 2006, 09:09:38 pm »

hi!

LightBox JS is not working in the k2 theme!

regards
peter
Logged

Joachim Müller

  • Dev Team member
  • Coppermine addict
  • ****
  • Offline Offline
  • Gender: Male
  • Posts: 47843
  • aka "GauGau"
    • gaugau.de
Re: LightBox JS for Fullsize Popup Image
« Reply #27 on: October 22, 2006, 12:57:00 am »

Fine. Great report. Did you actually bother to read th thread you're replying to? If not, do so now. The mod is experimental and known not to work with all themes.
Logged

Gizmo

  • Dev Team member
  • Coppermine addict
  • ****
  • Offline Offline
  • Gender: Male
  • Posts: 1015
    • BullsEye Photos
Re: LightBox JS for Fullsize Popup Image
« Reply #28 on: October 22, 2006, 03:45:55 am »

Sorry to hear you're having problems but following the instructions I've posted, I was able to get LightBox running with K2 in 5 minutes. If you'd like help then you'll have to ask... a bit more nice this time!
Logged
Did you read the manual first???? Taking 2 minutes to backup your files can save you hours of wondering what you screwed up.
Billy Bullock - BullsEyePhotos Blog of Indecision

Sami

  • VIP
  • Coppermine addict
  • ***
  • Offline Offline
  • Gender: Male
  • Posts: 3686
  • BMossavari
    • My Project
Re: LightBox JS for Fullsize Popup Image
« Reply #29 on: October 22, 2006, 06:54:33 am »

Maybe we could create a plugin for this one too ;)
Logged
‍I don't answer to PM with support question
Please post your issue to related board

Gizmo

  • Dev Team member
  • Coppermine addict
  • ****
  • Offline Offline
  • Gender: Male
  • Posts: 1015
    • BullsEye Photos
Re: LightBox JS for Fullsize Popup Image
« Reply #30 on: October 22, 2006, 12:44:44 pm »

I was hoping you'd ask so please do. :D
Logged
Did you read the manual first???? Taking 2 minutes to backup your files can save you hours of wondering what you screwed up.
Billy Bullock - BullsEyePhotos Blog of Indecision

Sami

  • VIP
  • Coppermine addict
  • ***
  • Offline Offline
  • Gender: Male
  • Posts: 3686
  • BMossavari
    • My Project
Re: LightBox JS for Fullsize Popup Image
« Reply #31 on: October 22, 2006, 01:31:04 pm »

Okey , let see what can do ... ;)
Logged
‍I don't answer to PM with support question
Please post your issue to related board

prhodan

  • Coppermine newbie
  • Offline Offline
  • Posts: 4
Re: LightBox JS for Fullsize Popup Image
« Reply #32 on: November 02, 2006, 05:42:49 am »

hello

do you know of any bugs with the theme eyeball ?
I have installed everything, but if I click the pic it pops up in a normal IE screen, when using IE 7
It pops up in a new screen also when using FF 1.5

When I click "home" the links that use to be there are now gone. Links like "upload pictures"

I used winmerge to add your codes to theme.php.
I have "filetypes" plugin installed and I have a hack in the theme.php for using a flashplayer (flv).

Thank you!

here follows the //Displays a picture:

Code: [Select]
// 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'])) {
        $picfull_url = get_pic_url($CURRENT_PIC_DATA, 'fullsize');
        $pic_title = $CURRENT_PIC_DATA['title'];
            $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=\"$picfull_url\" rel=\"lightbox\" title=\"$pic_title\">";
            $pic_html .= "<img src=\"" . $picture_url . "\" 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="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';
        }

        if ($mime_content['content']=='movie' && $mime_content['extension']=='flv') {
    $flv =  $CONFIG['fullpath'] . $CURRENT_PIC_DATA['filepath'] . $CURRENT_PIC_DATA['filename'];
    $pic_html  = "<object type=\"application/x-shockwave-flash\" width=\"320\" height=\"260\" wmode=\"transparent\" data=\"flvplayer.swf?file=$flv?autoStart=false\">";
    $pic_html .= "<param name=\"movie\" value=\"flvplayer.swf?file=$flv?autoStart=false\" />";
    $pic_html .= "<param name=\"wmode\" value=\"transparent\" />";
            $pic_html .= "</object><br />\n";

        } else {

        $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);
}

[Edit by Sami]: put php under code block
« Last Edit: November 02, 2006, 05:45:05 am by Sami »
Logged

prhodan

  • Coppermine newbie
  • Offline Offline
  • Posts: 4
Re: LightBox JS for Fullsize Popup Image
« Reply #33 on: November 02, 2006, 12:57:17 pm »

I didnt realise the code thingy.

Okay I found out what was "wrong".
Apparently in the template.html it is important in what sequence you paste the 4 lines in.
First I had the 4 lines you have to paste in below the 3 last lines you see below. and the lightbox didnt work.
Then i pasted the 4 lines above the last 3 lines, like you see below, and lightbox functions fine.

Code: [Select]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html dir="{LANG_DIR}">
<head>
<meta http-equiv="Content-Type" content="text/html; charset={CHARSET}" />
<meta http-equiv="Pragma" content="no-cache" />
<title>{TITLE}</title>
{META}
<link rel="stylesheet" href="themes/eyeball/lightbox/css/lightbox.css" type="text/css" media="screen" />
<script type="text/javascript" src="themes/eyeball/lightbox/js/prototype.js"></script>
<script type="text/javascript" src="themes/eyeball/lightbox/js/scriptaculous.js?load=effects"></script>
<script type="text/javascript" src="themes/eyeball/lightbox/js/lightbox.js"></script>

<link rel="stylesheet" href="themes/eyeball/style.css" type="text/css" />
<script type="text/javascript" src="scripts.js"></script>
<script language="JavaScript" type="text/JavaScript">
<!--
Logged

Shelia

  • Coppermine novice
  • *
  • Offline Offline
  • Posts: 26
Re: LightBox JS for Fullsize Popup Image
« Reply #34 on: November 06, 2006, 03:05:15 am »

I have Lightbox working on my site using the information I found here, but it will not process .gif's. I am using the andreas09 them and 1.4.10. When I include <meta http-equiv="imagetoolbar" content="no"> nothing works using Lightbox. I realize that "rightclick" protection" is useless but visitors uploading pictures ask that I use any method to slow down the image stealing. Is there any part of the lightbox.js code or my template code that deals with the image extention or image size or am I just not aware of limitations of Coppermine using Lightbox?

Logged

Gizmo

  • Dev Team member
  • Coppermine addict
  • ****
  • Offline Offline
  • Gender: Male
  • Posts: 1015
    • BullsEye Photos
Re: LightBox JS for Fullsize Popup Image
« Reply #35 on: November 06, 2006, 01:02:42 pm »

I got it to work first time using the below header setup and with .gif's. Also, <meta http-equiv="imagetoolbar" content="no"> only disables the IE image toolbar that pops up when hovering over an image and does nothing for "right clicking".

Code: [Select]
<head>
<meta http-equiv="Content-Type" content="text/html; charset={CHARSET}" />
<meta name="mssmarttagspreventparsing" content="true" />
<meta http-equiv="imagetoolbar" content="no">
<title>{TITLE}</title>
{META}
<link rel="stylesheet" href="themes/andreas09_lightbox/cpg_style.css" type="text/css" />
<link rel="stylesheet" href="themes/andreas09_lightbox/wp_style.css" type="text/css" />

<link rel="stylesheet" href="themes/andreas09_lightbox/lightbox/css/lightbox.css" type="text/css" media="screen" />
<script type="text/javascript" src="themes/andreas09_lightbox/lightbox/js/prototype.js"></script>
<script type="text/javascript" src="themes/andreas09_lightbox/lightbox/js/scriptaculous.js?load=effects"></script>
<script type="text/javascript" src="themes/andreas09_lightbox/lightbox/js/lightbox.js"></script>

<script type="text/javascript" src="scripts.js"></script> 
<script type="text/javascript" src="themes/andreas09_lightbox/changeStyle.js"></script>

</head>
Logged
Did you read the manual first???? Taking 2 minutes to backup your files can save you hours of wondering what you screwed up.
Billy Bullock - BullsEyePhotos Blog of Indecision

arlon

  • Coppermine novice
  • *
  • Offline Offline
  • Posts: 26
Re: LightBox JS for Fullsize Popup Image
« Reply #36 on: November 07, 2006, 12:27:40 am »

Everything seems to work fine, except the image on the "displayimage", which suddenly became "normal sized" instead of the intermediate.. really strange

EXAMPLE PAGE

I followed all the instructions, now I'm stuck (not being a programmer at all, sorry)

Any help would be sincerely appreciated
Logged

arlon

  • Coppermine novice
  • *
  • Offline Offline
  • Posts: 26
Re: LightBox JS for Fullsize Popup Image
« Reply #37 on: November 07, 2006, 12:35:40 am »

sorry, I forgot to say that my version is "modded by stramm" .. maybe this is what messes it up? :(
Logged

aldonc

  • Coppermine newbie
  • Offline Offline
  • Posts: 1
Re: LightBox JS for Fullsize Popup Image
« Reply #38 on: November 12, 2006, 06:04:48 am »

HI,

I have this working and love it. In the popup, the title of the picture at the bottom is either transparent or white (on the white border/background). I can highlight it and see it in reverse text but it is not visible otherwise. THe close button and label are there and fine. I got this working fine on one theme but then applied it to the eyeball theme which is my normal one and the title disappeared. I've checked and rechecked the mods and even created a second one from scratch to see if it was my fingers but same results.

Any direction on where to look for this?

thanks,
aldon
Logged

Gizmo

  • Dev Team member
  • Coppermine addict
  • ****
  • Offline Offline
  • Gender: Male
  • Posts: 1015
    • BullsEye Photos
Re: LightBox JS for Fullsize Popup Image
« Reply #39 on: November 14, 2006, 12:52:13 pm »

Find in your style.css file
Code: [Select]
#imageData #caption{ font-weight: bold; }
Add a color property to the text to meet your needs such as
Code: [Select]
#imageData #caption{ font-weight: bold; color: red;}
Logged
Did you read the manual first???? Taking 2 minutes to backup your files can save you hours of wondering what you screwed up.
Billy Bullock - BullsEyePhotos Blog of Indecision
Pages: 1 [2] 3 4 5 6 ... 17   Go Up
 

Page created in 0.048 seconds with 20 queries.