forum.coppermine-gallery.net

No Support => Modifications/Add-Ons/Hacks => Mods: Visuals => Topic started by: kaptainkory on August 10, 2005, 04:55:19 am

Title: Mod - autoshift display image page according to context (i.e. skip headers)
Post by: kaptainkory on August 10, 2005, 04:55:19 am
What it does?

PART 1: When the display image page loads, it "jumps" to the actual image area (skipping the headers).  Focus is also shifted to the page, which is useful when pulling up pictures from locations outside of CPG (such as when using CPMFETCH).

PART 2: When the file information icon is clicked, it "jumps" to the file information area (provided it's visible).


Compatibility?

CPG: Tested on the very latest CVS 1.4 beta, but should work on 1.3 as well (I think).
CPG THEME: Tested on "classic" theme, but should work in others as well.
Browser: Tested in Firefox 1.0 and IE 6.0, but should work from IE 5+ (and hopefully degrade well).


Requirements?

Javascript in Browser must be enabled.


Difficulty of installation?

Pretty easy, I think.  Just a couple of lines of code in 2 files.


Known issues?

None.  (Previous reported issue has been corrected.)


PART 1 INSTALLATION:

Browse to your favorite CPG theme folder.  In template.html, find the text {GALLERY}, and REPLACE WITH:
Code: [Select]
<a name="nav_pic" id="nav_pic"></a>
{GALLERY}
<script language="javascript" type="text/javascript">
this.focus();
if (window.location.search.indexOf('pos=') != -1) {
window.location.href = '#nav_pic';
}
</script>


PART 2 INSTALLATION:

In include/themes.inc.php, FIND (around line 639):
Code: [Select]
                        <a href="javascript:;" class="navmenu_pic" onclick="blocking('picinfo','yes', 'block'); return false;" title="{PIC_INFO_TITLE}"><img src="{LOCATION}images/info.gif" border="0" align="middle" alt="{PIC_INFO_TITLE}" /></a>
REPLACE WITH:
Code: [Select]
                        <a href="javascript:;" class="navmenu_pic" onclick="blocking('picinfo','yes', 'block'); if (document.getElementById('picinfo') && document.getElementById('picinfo') != 'none') { window.location.href = '#nav_picinfo'; } return false;" title="{PIC_INFO_TITLE}"><img src="{LOCATION}images/info.gif" border="0" align="middle" alt="{PIC_INFO_TITLE}" /></a>
FIND (around line 1955):
Code: [Select]
    echo "<div id=\"picinfo\" style=\"display: $picinfo;\">\n";
REPLACE WITH:
Code: [Select]
    echo "<a name=\"nav_picinfo\" id=\"nav_picinfo\"></a><div id=\"picinfo\" style=\"display: $picinfo;\">\n";

Preview?

http://www.snakesofarkansas.com/galleries/


Your feedback is welcome.  Thanks.
Title: Re: Mod - autoshift display image page according to context (i.e. skip headers)
Post by: Rodinou on August 10, 2005, 01:16:31 pm
url preview ?
Title: Re: Mod - autoshift display image page according to context (i.e. skip headers)
Post by: snork13 on August 10, 2005, 04:19:07 pm
Nice mod ;D

i have encounter a few errors, the first being the

Code: [Select]
<body onLoad="this.focus(); if(window.location.href.split('?')[1].indexOf('pos=') != -1) {window.location.href = 'nav_pic';}">
it should be

Code: [Select]
<body onLoad="this.focus(); if(window.location.href.split('?')[1].indexOf('pos=') != -1) {window.location.href = '#nav_pic';}">
you need the "#" in front of the nav_pic to call the ID



@Rodinou

test account for seeing in action

test/test

http://www.snork13.net/gallery

-snork
Title: Re: Mod - autoshift display image page according to context (i.e. skip headers)
Post by: kaptainkory on August 10, 2005, 05:49:23 pm
Thanks for catching that typo.  (For reasons I won't explain, I had to retype the code rather than the preferred copy-n-paste.)

I've modified the original post with some changes.  These actually simply the code and improves functioning.  Now, the page doesn't have to completely load before the page "jumps" to the image.

Thanks for testing.
Title: Re: Mod - autoshift display image page according to context (i.e. skip headers)
Post by: Rodinou on August 10, 2005, 06:31:23 pm
I think I'm dumb : I see nothing. On the both sites.
Title: Re: Mod - autoshift display image page according to context (i.e. skip headers)
Post by: snork13 on August 10, 2005, 06:37:43 pm
I think I'm dumb : I see nothing. On the both sites.

@Rodinou

you need to get into the album to the normal photo view, it jump the image to the middle...you'll see when you use the prevs or next image navagation..

 ;D
-snork
Title: Re: Mod - autoshift display image page according to context (i.e. skip headers)
Post by: snork13 on August 11, 2005, 01:01:57 am
oh,, i also like the javascript in the </head> of the doc

so...

Code: [Select]
<script type="text/javascript" src="scripts.js"></script>
<script language="javascript" type="text/javascript">
this.focus();
if (window.location.search.indexOf('pos=') != -1) {
window.location.href = '#nav_pic';
} </script>

-snork
Title: Re: Mod - autoshift display image page according to context (i.e. skip headers)
Post by: kaptainkory on August 11, 2005, 01:13:14 am
The preference would be to put the script in the <head> tag, only it doesn't work in this case.  Notice that the element <a name="nav_pic" id="nav_pic"> has to be RENDERED by the browser BEFORE the script is called.  If the script is in the <head> section it is called too early.

Originally, I had the script in a function in the <head> tag and called it with <body onload="nav_pic();">.  This works fine EXCEPT the jump doesn't occur until after the entire image loads...so there is a definite lag with larger images loading.

Thanks.
Title: Re: Mod - autoshift display image page according to context (i.e. skip headers)
Post by: snork13 on August 11, 2005, 01:43:48 am
i hear ya, maybe it the fade-in mod, but it seams to load correctly for me and i left it in the head...regardless..it the coolest thing that takes minor change. thanks again :D

-snork
Title: autoshift display image for slideshow
Post by: Gephri on January 07, 2007, 12:30:40 pm
Would anyone be able to tell me how to mod this mod so that it will work with slideshow?
Thanks
Title: Re: Mod - autoshift display image page according to context (i.e. skip headers)
Post by: sharon1 on July 22, 2007, 11:49:41 am
Thanks for the great mod, kaptainkory.  It works great!

Sharon
Title: Re: Mod - autoshift display image page according to context (i.e. skip headers)
Post by: hassan784 on September 28, 2007, 12:26:49 am
How can I use  this link open in new window ?
Code: [Select]
'{LINK_TGT}' => "displayimage.php?album=$aid$cat_link&amp;pos={$thumb['pos']}$uid_link",
this link code will not work
Code: [Select]
'{LINK_TGT}' => "displayimage.php?pid={$thumb['pid']}&fullsize=1" target="_blank",
Give me some another Code
thank you
Title: Re: Mod - autoshift display image page according to context (i.e. skip headers)
Post by: Joachim Müller on October 03, 2007, 11:13:40 am
Stop spreading your question all over the board. Particularly, don't ask for unrelated things on mod announcement threads.