forum.coppermine-gallery.net

No Support => Modifications/Add-Ons/Hacks => Mods: Visuals => Topic started by: ZPrime on June 08, 2005, 07:34:01 am

Title: Image description popups and Firefox...
Post by: ZPrime on June 08, 2005, 07:34:01 am
When you hover over a thumbnail, you get a popup showing size, date uploaded, etc.  (I'm guessing this is coming from an ALT tag or something similar, but I didn't actually look at the source).

In IE, these items are on multiple lines in the popup.

In Firefox, all of the items appear on one line with some extended ASCII character between them (instead of a proper cr/lf).  This is incredibly minor as far as bugs go, but it looks pretty silly and is fairly annoying too.
Title: Re: Image description popups and Firefox...
Post by: Joachim Müller on June 08, 2005, 07:50:24 am
you're right, but I have no idea how to accomplish the line breaks in tool tips for Firefox. In case someone knows, I'll gladly add it to the code.
Title: Re: Image description popups and Firefox...
Post by: ZPrime on June 08, 2005, 08:32:46 am
I found a bit more info here (http://www.hill-kleerup.org/blog/mtarchive/006902.html), although the site is out of date.  Apparently you can do some javascript or CSS mojo to make it work...

It looks like line breaks may not actually be part of the W3C standard for "TITLE" tags, which is what you must be using with cumine for Firefox to natively support it.  (IE will tooltip the ALT tag as well but Firefox doesn't do this without an extension IIRC.)

This guy (http://victr.lm85.com/Design/css/fancytooltips-a-la-victr.php) came up with a wordpress "addon" that gives fancy CSS/JS type tooltips - they're really nifty, but you'd have to go through his code to figure out how to impliment it with cumine, since his stuff is wordpress-specific I think.

It looks like this is considered a Mozilla bug (https://bugzilla.mozilla.org/show_bug.cgi?id=45375) as well, no idea when they're going to fix it.  I'm going to give the Popup ALT Attributes plugin (http://piro.sakura.ne.jp/xul/_popupalt.html.en) a try to see if this "fixes" it for me...
Title: Re: Image description popups and Firefox...
Post by: Tranz on June 08, 2005, 08:47:01 am
...what you must be using with cumine
I was like, what is cumine? My first thought was that it had something to do with porn... Then I realized... Cu = Copper. Very clever, ZPrime. Probably confusing to those who haven't studied chemistry recently or ever, but still clever. :D
Title: Re: Image description popups and Firefox...
Post by: Joachim Müller on June 08, 2005, 09:55:46 am
Recommended library for JavaScript tool-tips: overLib (http://www.bosrup.com/web/overlib/). Never checked if it actually works with Coppermine though.
Title: Re: Image description popups and Firefox...
Post by: RatKing on July 28, 2005, 11:02:10 am
 ;D

Well overlib does work with coppermine.... I have it working now for my tumbnails views and it took no time at all to implement (most time was spend trying to find the right part of the code to make the change to  ;)

So how does it work?

Well put the overlib.js script in you coppermine root.

Modify your template file to include the following line in the head element:
Code: [Select]
<script type="text/javascript" src="overlib.js"><!-- overLIB (c) Erik Bosrup --></script>And the body of that same template file:
Code: [Select]
<div id="overDiv" style="position:absolute; visibility:hidden; z-index:1000;"></div>
The in functions.inc.php look fot the follwoing code:
Code: [Select]
                        $pic_title =$lang_display_thumbnails['filename'].$row['filename']."\n".
                                $lang_display_thumbnails['filesize'].($row['filesize'] >> 10).$lang_byte_units[1]."\n".
                                $lang_display_thumbnails['dimensions'].$row['pwidth']."x".$row['pheight']."\n".
                                $lang_display_thumbnails['date_added'].localised_date($row['ctime'], $album_date_fmt);

                        $pic_url =  get_pic_url($row, 'thumb');
                        if (!is_image($row['filename'])) {
                                $image_info = getimagesize($pic_url);
                                $row['pwidth'] = $image_info[0];
                                $row['pheight'] = $image_info[1];
                        }

                        $image_size = compute_img_size($row['pwidth'], $row['pheight'], $CONFIG['thumb_width']);

                        $thumb_list[$i]['pos'] = $key < 0 ? $key : $i - 1 + $lower_limit;
                        $thumb_list[$i]['image'] = "<img src=\"" . $pic_url . "\" class=\"image\" {$image_size['geom']} border=\"0\" alt=\"{$row['filename']}\" title=\"$pic_title\">";
                        $thumb_list[$i]['caption'] = $row['caption_text'];
                        $thumb_list[$i]['admin_menu'] = '';
                        $thumb_list[$i]['aid'] = $row['aid'];

and replace with:
Code: [Select]
                        $pic_title =$lang_display_thumbnails['filename'].$row['filename']."<br />".
                                $lang_display_thumbnails['filesize'].($row['filesize'] >> 10).$lang_byte_units[1]."<br />".
                                $lang_display_thumbnails['dimensions'].$row['pwidth']."x".$row['pheight']."<br />".
                                $lang_display_thumbnails['date_added'].localised_date($row['ctime'], $album_date_fmt);

                        $pic_url =  get_pic_url($row, 'thumb');
                        if (!is_image($row['filename'])) {
                                $image_info = getimagesize($pic_url);
                                $row['pwidth'] = $image_info[0];
                                $row['pheight'] = $image_info[1];
                        }

                        $image_size = compute_img_size($row['pwidth'], $row['pheight'], $CONFIG['thumb_width']);

                        $thumb_list[$i]['pos'] = $key < 0 ? $key : $i - 1 + $lower_limit;
                        $thumb_list[$i]['image'] = "<img ".'onmouseover="return overlib(\''.$pic_title.'\');" onmouseout="return nd();"'." src=\"" . $pic_url . "\" class=\"image\" {$image_size['geom']} border=\"0\" alt=\"\" title=\"\"/>";
                        $thumb_list[$i]['caption'] = $row['caption_text'];
                        $thumb_list[$i]['admin_menu'] = '';
                        $thumb_list[$i]['aid'] = $row['aid'];

For an example look at: http://www.ratking.net
Title: Re: Image description popups and Firefox...
Post by: NevilleX on July 31, 2005, 10:17:01 pm
Hi! I have installed this mod and it's working great, however I would like to change tooltips to show this:

- Title (instead of filename, if the title isn't set then show "untitled")
- Views
- Rating
- Number of votes
- Date added

I would also like this to show this in all other screens (Last uploads, Last comments, Most viewed, Top Rated, My Favorites)

I have tried to do this myself, I've changed part of display_thumbnails function to this:

Code: [Select]
                        if( $row['title'] != "") {
                            $pic_title ="<b>".$row['title']."</b><br />".
                            $lang_display_thumbnails['date_added'].localised_date($row['ctime'], $album_date_fmt);
                          } else {
                            $pic_title =$lang_display_thumbnails['date_added'].localised_date($row['ctime'], $album_date_fmt);
                          }

If...else is there because Title doesn't show in other screns, only in album view, so in other screen it will show only date. :( I have absolutely no idea how to add views and rating.

If anybody know how to accomplish to get tooltip like this in all screens, please help!
Title: Re: Image description popups and Firefox...
Post by: Rodinou on August 01, 2005, 05:48:33 am
Overlib is so powerful you can load INTERMEDIATE pics on the fly ... and so more .... but in my memories, it's a quite heavy script (about 30 ko ?)
Title: Re: Image description popups and Firefox...
Post by: RatKing on August 01, 2005, 10:15:20 am
The script is quite big but when you put it as an include on the top of your theme like I did the script will only be donwloaded once and after that be greped from local cache.

If you still feel the need to you could of course have a look at the script it self and modify it a little. I.o.w. cut out the bits that are not used, this should reduce the size dramaticly. Not sure though how the creator of the OverLib script would feel about that....  :-\\
Title: Re: Image description popups and Firefox...
Post by: RatKing on August 01, 2005, 10:17:26 am
The other changes added are not to hard I didn't put them in because of lazyness. I'll post them later today or tomorrow.

The extra fields to display well I'll see about including that code, should not be so difficult (I think)
Title: Re: Image description popups and Firefox...
Post by: RatKing on August 01, 2005, 11:31:16 am
Ok, for the missing overlib bit (this will as far as I can tell make all tumbnails shown anywhere have the overlib image description).

Open <CPG_ROOT>/include/functions.inc.php

And look for the following text:
Code: [Select]
                        $pic_title =$lang_display_thumbnails['filename'].$row['filename']."<br />".
                                $lang_display_thumbnails['filesize'].($row['filesize'] >> 10).$lang_byte_units[1]."<br />".
                                $lang_display_thumbnails['dimensions'].$row['pwidth']."x".$row['pheight']."<br />".
                                $lang_display_thumbnails['date_added'].localised_date($row['ctime'], $album_date_fmt);

                        $pic_url =  get_pic_url($row, 'thumb');
                        if (!is_image($row['filename'])) {
                                $image_info = getimagesize($pic_url);
                                $row['pwidth'] = $image_info[0];
                                $row['pheight'] = $image_info[1];
                        }

                        $image_size = compute_img_size($row['pwidth'], $row['pheight'], $CONFIG['thumb_width']);

                        $p=$i - 1;
                        $p=($p < 0 ? 0 : $p);
                        $thumb_list[$i]['pos'] = $key < 0 ? $key : $p;
                        $thumb_list[$i]['image'] = "<img src=\"" . $pic_url . "\" class=\"image\" {$image_size['geom']} border=\"0\" alt=\"{$row['filename']}\" title=\"$pic_title\">";
                        $thumb_list[$i]['caption'] = $row['caption_text'];
                        $thumb_list[$i]['admin_menu'] = '';


Replace this with:
Code: [Select]
                        $pic_title =$lang_display_thumbnails['filename'].$row['filename']."<br />".
                                $lang_display_thumbnails['filesize'].($row['filesize'] >> 10).$lang_byte_units[1]."<br />".
                                $lang_display_thumbnails['dimensions'].$row['pwidth']."x".$row['pheight']."<br />".
                                $lang_display_thumbnails['date_added'].localised_date($row['ctime'], $album_date_fmt);

                        $pic_url =  get_pic_url($row, 'thumb');
                        if (!is_image($row['filename'])) {
                                $image_info = getimagesize($pic_url);
                                $row['pwidth'] = $image_info[0];
                                $row['pheight'] = $image_info[1];
                        }

                        $image_size = compute_img_size($row['pwidth'], $row['pheight'], $CONFIG['thumb_width']);

                        $p=$i - 1 + $lower_limit;
                        $p=($p < 0 ? 0 : $p);
                        $thumb_list[$i]['pos'] = $key < 0 ? $key : $p;
                        $thumb_list[$i]['image'] = "<img ".'onmouseover="return overlib(\''.$pic_title.'\');" onmouseout="return nd();"'." src=\"" . $pic_url . "\" class=\"image\" {$image_size['geom']} border=\"0\" alt=\"\" title=\"\"/>";
                        $thumb_list[$i]['caption'] = $row['caption_text'];
                        $thumb_list[$i]['admin_menu'] = '';

Combined with the first part all thumbnails shown should now have the overlib popup description.... Should you find a part where the tumbnails don't have the overlib popup but just the plain old version let me know how you ended up on that page and I will make a change for that as well.
Title: Re: Image description popups and Firefox...
Post by: RatKing on August 01, 2005, 12:27:04 pm
Ok, and now for the adding of the extra fields....

First of all we need to modify all language files that are used on your site in this example I'll change the english:

Look for in lang/<your language>.php:
Code: [Select]
$lang_display_thumbnails = array(
  'filename'   => 'Filename : ',
  'filesize'   => 'Filesize : ',
  'dimensions' => 'Dimensions : ',
  'date_added' => 'Date added : ', //cpg1.3.0
);
Change to:
Code: [Select]
$lang_display_thumbnails = array(
  'filename'   => 'Filename : ',
  'title'      => 'Title : ',
  'filesize'   => 'Filesize : ',
  'hits'       => 'Views : ',
  'pic_rating' => 'Current rating : ',
  'votes'      => 'Number of votes : ',
  'dimensions' => 'Dimensions : ',
  'date_added' => 'Date added : ', //cpg1.3.0
);

Done that? Great no harm done no one will see anything happening just jet on your site.

Now we are going to add an extra function to functions.inc.php just to make it simpler for us to maintain should we want to make changes in the future:

So lets open CPG_ROOT/include/functions.inc.php and add the fllowing function:
Code: [Select]
// Return the popup info for a picture
function get_pic_popup(&$pic_row)
{
  global $album_date_fmt, $lang_display_thumbnails, $lang_byte_units;

  if ( $pic_row['title'] == '' ) {
    $title = $lang_display_thumbnails['filename'].$pic_row['filename']."<br />";
  } else {
    $title = $lang_display_thumbnails['title'].$pic_row['title']."<br />";
  }
  if ( $pic_row['hits'] ) {
    $hits = $lang_display_thumbnails['hits'].$pic_row['hits']."<br />";
  }
  if ( $pic_row['pic_rating'] ) {
    $pic_rating = $lang_display_thumbnails['pic_rating'].$pic_row['pic_rating']."<br />";
  }
  if ( $pic_row['votes'] ) {
    $votes = $lang_display_thumbnails['votes'].$pic_row['votes']."<br />";
  }
  $popup_text=$title.$hits.$pic_rating.$votes.
              $lang_display_thumbnails['filesize'].($pic_row['filesize'] >> 10).$lang_byte_units[1]."<br />".
              $lang_display_thumbnails['dimensions'].$pic_row['pwidth']."x".$pic_row['pheight']."<br />".
              $lang_display_thumbnails['date_added'].localised_date($pic_row['ctime'], $album_date_fmt);

  return $popup_text;
}

Now lets look for the two parts we changed before also in functions.inc.php:
Code: [Select]
                        $pic_title=$lang_display_thumbnails['filename'].$row['filename']."<br />".
                                $lang_display_thumbnails['filesize'].($row['filesize'] >> 10).$lang_byte_units[1]."<br />".
                                $lang_display_thumbnails['dimensions'].$row['pwidth']."x".$row['pheight']."<br />".
                                $lang_display_thumbnails['date_added'].localised_date($row['ctime'], $album_date_fmt);

And replace that with:
Code: [Select]
                        $pic_title = get_pic_popup($row);

Now we need to make one small change again in functions.inc.php:

Look for:
Code: [Select]
        if ($limit2 == 1) {
            $select_columns = '*';
        } else {
            $select_columns = 'pid, filepath, filename, url_prefix, filesize, pwidth, pheight, ctime, aid, title';
        }

And replace with:
Code: [Select]
        $select_columns = '*';

Then you will have it all working.  :)
Title: Re: Image description popups and Firefox...
Post by: RatKing on August 01, 2005, 12:36:02 pm
One last thing in the new function change the following:
Code: [Select]
    $pic_rating = $lang_display_thumbnails['pic_rating'].$pic_row['pic_rating']."<br />";

to:
Code: [Select]
    $pic_rating = $lang_display_thumbnails['pic_rating'].round($pic_row['pic_rating']/2000)."<br />";

Or the vores will look well stragne......  ::)
Title: Re: Image description popups and Firefox...
Post by: NevilleX on August 01, 2005, 08:44:43 pm
Thank you! It was much harder then I thougth. I couldn't do it myself.  :)
I got one problem now. In the Last comments section caption doesn't show comment, instead it shows this text - 01/01/70 at 00:00.
Take a look, please: http://neville.x05host.com
Title: Re: Image description popups and Firefox...
Post by: Rodinou on August 02, 2005, 12:21:28 am
I use another script for popup infos ... about 5ko ...

http://www.sortons.net/test-nucleus.html : see Last Articles, and mouse over the links ... more graphics than Overlib, and very quick to install. However Overlib was for me for years THE reference. But with time ... dhtml has progressed :)
Title: Re: Image description popups and Firefox...
Post by: Joachim Müller on August 02, 2005, 09:34:25 am
OMG, please don't post another DHTML rant ;)
Title: Re: Image description popups and Firefox...
Post by: RatKing on August 02, 2005, 11:10:09 am
NevilleX - You are right :o  I see that same problem and I have a solution for it as well.

Remember where we did this:
Now we need to make one small change again in functions.inc.php:

Look for:
Code: [Select]
        if ($limit2 == 1) {
            $select_columns = '*';
        } else {
            $select_columns = 'pid, filepath, filename, url_prefix, filesize, pwidth, pheight, ctime, aid, title';
        }

And replace with:
Code: [Select]
        $select_columns = '*';

Then you will have it all working.  :)

Well that is where we went wrong move that $select_columns = '*'; a little lower and the issue is solved. See below for an example of how this should look.
Code: [Select]
        $limit = ($limit1 != -1) ? ' LIMIT '. $limit1 : '';
        $limit .= ($limit2 != -1) ? ' ,'. $limit2 : '';

        if ($limit2 == 1) {
            $select_columns = '*';
        } else {
            $select_columns = 'pid, filepath, filename, url_prefix, filesize, pwidth, pheight, ctime, aid, title';
        }
        // Keyword
        if (!empty($CURRENT_ALBUM_KEYWORD)){
                $keyword = "OR keywords like '%$CURRENT_ALBUM_KEYWORD%'";
        } else $keyword = '';

        // Regular albums
        if ((is_numeric($album))) {
                $select_columns = '*';
                $album_name_keyword = get_album_name($album);
                $album_name = $album_name_keyword['title'];
                $album_keyword = $album_name_keyword['keyword'];

Sorry for that one it seems I missed that in testing it.  :-\\
Title: Re: Image description popups and Firefox...
Post by: NevilleX on August 02, 2005, 01:01:22 pm
Thank you RatKing!  :D :D :D
This is working great!
Title: Re: Image description popups and Firefox...
Post by: Rodinou on August 03, 2005, 12:17:22 pm
Hummmm ... I'll test your php code on my script ... why ? I have downloaded the recent version of overlib and ... the script is 50 KO !!!! Imagine a "simple popup info" = 50 ko ?!
Title: Re: Image description popups and Firefox...
Post by: Joachim Müller on August 04, 2005, 09:51:07 pm
the js get's cached of course  ::)
Title: Re: Image description popups and Firefox...
Post by: Rodinou on August 04, 2005, 10:57:31 pm
the problem is not here gaugau !

The problem is 50ko for only replace ALT ... it's abused. That's all.

Other scripts do the SAME thing but there do only 5 ko ! With the 45ko ... you can do other things ... that's all.
Title: Re: Image description popups and Firefox...
Post by: Joachim Müller on August 05, 2005, 05:56:00 am
I agree that there are other scripts that can do the same, however with having overlib on your page, you can do loads of other things with it. Why don't you post the alternatives (i.e. let's see some actual code from you instead of lame nagging)?
Title: Re: Image description popups and Firefox...
Post by: Rodinou on August 05, 2005, 12:54:44 pm
I have begun to work on it ... the script I use is ... 3,3 ko ... for the same thing

I have put this on functions.inc.php but I have a parsed error ... and the line said is 1845 ... so the end of the script : not very practice to find the error :)

Code: [Select]

//////////////////////////////////////////////// CHANGE DHTML POPUP /////////////////////////////////////////////////

                       
                        $pic_title = get_pic_popup($row);
                       

                        $pic_url =  get_pic_url($row, 'thumb');
                        if (!is_image($row['filename'])) {
                                $image_info = getimagesize($pic_url);
                                $row['pwidth'] = $image_info[0];
                                $row['pheight'] = $image_info[1];
                        }

                        $image_size = compute_img_size($row['pwidth'], $row['pheight'], $CONFIG['thumb_width']);

                        $p=$i - 1 + $lower_limit;
                        $p=($p < 0 ? 0 : $p);
                        $thumb_list[$i]['pos'] = $key < 0 ? $key : $p;
                        $thumb_list[$i]['image'] = "<img ".' onMouseover="ddrivetip(\''.$pic_title.'\');" onmouseout="hideddrivetip()"'." src=\"" . $pic_url . "\" class=\"image\" {$image_size['geom']} border=\"0\" alt=\"\" title=\"\"/>";
                        $thumb_list[$i]['caption'] = $row['caption_text'];
                        $thumb_list[$i]['admin_menu'] = '';

//////////////////////////////////////////////// CHANGE DHTML POPUP /////////////////////////////////////////////////                       
   

Code: [Select]
//////////////////////////////////////////////// CHANGE DHTML POPUP /////////////////////////////////////////////////

                          // Return the popup info for a picture
                          function get_pic_popup(&$pic_row)
                          {
                            global $album_date_fmt, $lang_display_thumbnails, $lang_byte_units;
                         
                            if ( $pic_row['title'] == '' ) {
                              $title = $lang_display_thumbnails['filename'].$pic_row['filename']."<br />";
                            } else {
                              $title = $lang_display_thumbnails['title'].$pic_row['title']."<br />";
                            }
                            if ( $pic_row['hits'] ) {
                              $hits = $lang_display_thumbnails['hits'].$pic_row['hits']."<br />";
                            }
                            if ( $pic_row['pic_rating'] ) {
                              $pic_rating = $lang_display_thumbnails['pic_rating'].round($pic_row['pic_rating']/2000)."<br />";
                            }
                            if ( $pic_row['votes'] ) {
                              $votes = $lang_display_thumbnails['votes'].$pic_row['votes']."<br />";
                            }
                            $popup_text=$title.$hits.$pic_rating.$votes.
                                        $lang_display_thumbnails['filesize'].($pic_row['filesize'] >> 10).$lang_byte_units[1]."<br />".
                                        $lang_display_thumbnails['dimensions'].$pic_row['pwidth']."x".$pic_row['pheight']."<br />".
                                        $lang_display_thumbnails['date_added'].localised_date($pic_row['ctime'], $album_date_fmt);
                         
                            return $popup_text;
                          }
                         
//////////////////////////////////////////////// CHANGE DHTML POPUP //////////////////////////////////////////////////


Title: Re: Image description popups and Firefox...
Post by: RatKing on August 06, 2005, 12:31:33 pm
 ;D GauGau calm down man if people want to whinch about this stuff its fine by me  ;)

I exchanged some pm's with Rodinou and see here the code that will make him happy.

Ok, it's just a short bit of code and I am not going to write the fully detailed description of how to do it as I have limited time today and it is the same as above....

The new code (this is the new function part that goes into the functions.inc.php file):

Code: [Select]
// Return the popup info for a picture
function get_pic_popup(&$pic_row)
{
  global $album_date_fmt, $lang_display_thumbnails, $lang_byte_units;

  if ( $pic_row['title'] == '' ) {
    $title = $lang_display_thumbnails['filename'].$pic_row['filename']."<br />";
  } else {
    $title = $lang_display_thumbnails['title'].$pic_row['title']."<br />";
  }
  if ( $pic_row['hits'] ) {
    $hits = $lang_display_thumbnails['hits'].$pic_row['hits']."<br />";
  }
  if ( $pic_row['pic_rating'] ) {
    $pic_rating = $lang_display_thumbnails['pic_rating'].$pic_row['pic_rating']."<br />";
  }
  if ( $pic_row['votes'] ) {
    $votes = $lang_display_thumbnails['votes'].$pic_row['votes']."<br />";
  }
  $popup_text="<dl>" .
              "<dt>" . $title.$hits.$pic_rating.$votes."</dt>".
              "<dt>" . $lang_display_thumbnails['filesize'].($pic_row['filesize'] >> 10).$lang_byte_units[1]."</dt>".
              "<dt>" . $lang_display_thumbnails['dimensions'].$pic_row['pwidth']."x".$pic_row['pheight']."</dt>".
              "<dt>" . $lang_display_thumbnails['date_added'].localised_date($pic_row['ctime'], $album_date_fmt)."</dt></dl>";
  return $popup_text;
}

Insert in the template file that you are using the following code:
Code: [Select]
<script type="text/javascript">

/***********************************************
* Cool DHTML tooltip script II- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/

var offsetfromcursorX=12 //Customize x offset of tooltip
var offsetfromcursorY=10 //Customize y offset of tooltip

var offsetdivfrompointerX=10 //Customize x offset of tooltip DIV relative to pointer image
var offsetdivfrompointerY=14 //Customize y offset of tooltip DIV relative to pointer image. Tip: Set it to (height_of_pointer_image-1).

document.write('<div id="dhtmltooltip"></div>') //write out tooltip DIV
document.write('<img id="dhtmlpointer" src="arrow2.gif">') //write out pointer image

var ie=document.all
var ns6=document.getElementById && !document.all
var enabletip=false
if (ie||ns6)
var tipobj=document.all? document.all["dhtmltooltip"] : document.getElementById? document.getElementById("dhtmltooltip") : ""

var pointerobj=document.all? document.all["dhtmlpointer"] : document.getElementById? document.getElementById("dhtmlpointer") : ""

function ietruebody(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}

function ddrivetip(thetext, thewidth, thecolor){
if (ns6||ie){
if (typeof thewidth!="undefined") tipobj.style.width=thewidth+"px"
if (typeof thecolor!="undefined" && thecolor!="") tipobj.style.backgroundColor=thecolor
tipobj.innerHTML=thetext
enabletip=true
return false
}
}

function positiontip(e){
if (enabletip){
var nondefaultpos=false
var curX=(ns6)?e.pageX : event.clientX+ietruebody().scrollLeft;
var curY=(ns6)?e.pageY : event.clientY+ietruebody().scrollTop;
//Find out how close the mouse is to the corner of the window
var winwidth=ie&&!window.opera? ietruebody().clientWidth : window.innerWidth-20
var winheight=ie&&!window.opera? ietruebody().clientHeight : window.innerHeight-20

var rightedge=ie&&!window.opera? winwidth-event.clientX-offsetfromcursorX : winwidth-e.clientX-offsetfromcursorX
var bottomedge=ie&&!window.opera? winheight-event.clientY-offsetfromcursorY : winheight-e.clientY-offsetfromcursorY

var leftedge=(offsetfromcursorX<0)? offsetfromcursorX*(-1) : -1000

//if the horizontal distance isn't enough to accomodate the width of the context menu
if (rightedge<tipobj.offsetWidth){
//move the horizontal position of the menu to the left by it's width
tipobj.style.left=curX-tipobj.offsetWidth+"px"
nondefaultpos=true
}
else if (curX<leftedge)
tipobj.style.left="5px"
else{
//position the horizontal position of the menu where the mouse is positioned
tipobj.style.left=curX+offsetfromcursorX-offsetdivfrompointerX+"px"
pointerobj.style.left=curX+offsetfromcursorX+"px"
}

//same concept with the vertical position
if (bottomedge<tipobj.offsetHeight){
tipobj.style.top=curY-tipobj.offsetHeight-offsetfromcursorY+"px"
nondefaultpos=true
}
else{
tipobj.style.top=curY+offsetfromcursorY+offsetdivfrompointerY+"px"
pointerobj.style.top=curY+offsetfromcursorY+"px"
}
tipobj.style.visibility="visible"
if (!nondefaultpos)
pointerobj.style.visibility="visible"
else
pointerobj.style.visibility="hidden"
}
}

function hideddrivetip(){
if (ns6||ie){
enabletip=false
tipobj.style.visibility="hidden"
pointerobj.style.visibility="hidden"
tipobj.style.left="-1000px"
tipobj.style.backgroundColor=''
tipobj.style.width=''
}
}

document.onmousemove=positiontip

</script>

Of course a simple:
Code: [Select]
<script type="text/javascript" src="tooltip.js"></script> would look better but that is upto you.

Drop the following picture in the images directory: http://www.dynamicdrive.com/dynamicindex5/arrow2.gif
Title: Re: Image description popups and Firefox...
Post by: Rodinou on August 06, 2005, 12:38:16 pm
I test it as now :)

But warning

Code: [Select]
  $popup_text="<dl>" .
              "<dt>" . $title.$hits.$pic_rating.$votes."</dt>".
              "<dt>" . $lang_display_thumbnails['filesize'].($pic_row['filesize'] >> 10).$lang_byte_units[1]."</dt>".
              "<dt>" . $lang_display_thumbnails['dimensions'].$pic_row['pwidth']."x".$pic_row['pheight']."</dt>".
              "<dt>" . $lang_display_thumbnails['date_added'].localised_date($pic_row['ctime'], $album_date_fmt)."</dt></dl>";
  return $popup_text;
}

The "Good" Code would be

Code: [Select]
  $popup_text="<dl>" .
              "<dd>" . $title.$hits.$pic_rating.$votes."</dt>".
              "<dd>" . $lang_display_thumbnails['filesize'].($pic_row['filesize'] >> 10).$lang_byte_units[1]."</dd>".
              "<dd>" . $lang_display_thumbnails['dimensions'].$pic_row['pwidth']."x".$pic_row['pheight']."</dd>".
              "<dd>" . $lang_display_thumbnails['date_added'].localised_date($pic_row['ctime'], $album_date_fmt)."</dd></dl>";
  return $popup_text;
}

<dt></dt> is used for example, if you want to put a title (or the filename) as title of your popup.

However, I have a parsed error ... the "TOP" (even if I have understood, today, you have no time) to put "in a "SAME POST" all the updated code : it prevents from having errors :). At least, you have forgotten the CSS code :)
Title: Re: Image description popups and Firefox...
Post by: MillieJOBarreto on September 30, 2005, 01:33:54 am
I'd like to know how to GET RID of the image description popups (on any browser).

I am unable to post a new topic here, so this topic seemed a little more appropriated than the others...
Title: Re: Image description popups and Firefox...
Post by: Joachim Müller on September 30, 2005, 08:25:26 am
this board is for actual mods, not for support or mod requests, that's why you can't start new threads here. Go to the support board and re-post your question there. Reading the sub-board description and the sticky thread would have told you so as well.