Page 1 of 1
Shadowbox and domready event
Posted: 11 Dec 2008, 01:26
by tclark
Firstly I just wanted to say Phoca Gallery is really great and has suited my needs for a personal blog/photo site perfectly. Keep up the great work. I had finished my site but during testing I noticed that if I clicked on an image too quickly shadowbox would not load but instead the image would open on a blank page. When I waited for the page to load shadowbox would load normally.
On viewing the output of my webpage I noticed Shadowbox is being called with the window.onload function see below:
Code: Select all
<script type="text/javascript">
Shadowbox.loadSkin("classic", "/components/com_phocagallery/assets/js/shadowbox/src/skin");
Shadowbox.loadLanguage("en", "/components/com_phocagallery/assets/js/shadowbox/src/lang");
Shadowbox.loadPlayer(["img"], "/components/com_phocagallery/assets/js/shadowbox/src/player");
window.onload = function(){
Shadowbox.init();
}
</script>
I want to be able to use the domready event instead. I am hoping the code below would do the trick??
Code: Select all
<script type="text/javascript">
Shadowbox.loadSkin("classic", "/components/com_phocagallery/assets/js/shadowbox/src/skin");
Shadowbox.loadLanguage("en", "/components/com_phocagallery/assets/js/shadowbox/src/lang");
Shadowbox.loadPlayer(["img"], "/components/com_phocagallery/assets/js/shadowbox/src/player");
window.addEvent('domready', function() {
Shadowbox.init();
}
</script>
My question is where in the phoca gallery component can I change this, which php/js file is this coming from? I would also like to load additional shadowbox players, my guess is it is in the same php file? Any help would be greatly appreciated.
Re: Shadowbox and domready event
Posted: 12 Dec 2008, 04:05
by tclark
I fixed this by modifying the
components/com_phocagallery/views/category/view.html.php file
replaced this:
Code: Select all
window.onload = function(){
Shadowbox.init();
}
with this:
Code: Select all
window.addEvent(\'domready\', function(){
Shadowbox.init();
});
See my original post for a larger code snippet to help you find the section of code within the file.
Re: Shadowbox and domready event
Posted: 12 Dec 2008, 20:24
by Jan
Great, thank you for this info, I think, this is good idea, so I will change it in the next version...
Jan
Re: Shadowbox and domready event
Posted: 13 Dec 2008, 01:52
by gerilla
good idea. it was really bothering. thanks...
Re: Shadowbox and domready event
Posted: 13 Dec 2008, 20:05
by blablast
Hi,
I'd like to ask how can I show first image in gallery in Shadowbox after page load.
I've add code:
Code: Select all
if (document.getElementById(\'firstImageInGallery\') <> null) {
var linkToFirstImageInGallery=document.getElementById(\'firstImageInGallery\').href;
window.location.href=linkToFirstImageInGallery;
};
after:
and next in gallery description I've put:
Code: Select all
<a rel="shadowbox[PhocaGallery];options={slideshowDelay:3}" href="images/phocagallery/Category1/thumbs/phoca_thumb_l_image1.jpg" id="firstImageInGallery" class="shadowbox-button">___</a>
but this doesn't work.
So my idea is to add first element in gallery id='firstImageInGallery' and next open this link immedietly after load page.
How to do this?
Blazej
Re: Shadowbox and domready event
Posted: 16 Dec 2008, 18:59
by Jan
Hi, shadowbox only displays images which are listed on the site... so it displays the first image of listed images (thumbnails)
Jan
Re: Shadowbox and domready event
Posted: 17 Dec 2008, 02:25
by blablast
Thank you for your reply.
I've done what I would in that way (but without Phoca Gallery
)in that way:
I've added code my template:
Code: Select all
<script type="text/javascript">
window.addEvent('domready',function() {
if (document.getElementById('firstImageInGallery')==null) {
} else {
var openShadowbox = function(myImage) {
Shadowbox.open ( {
content: myImage,
gallery:'myGallery',
type: 'img'
})
};
if(window.onload) {
var temp = window.onload;
window.onload=function(e) {
temp(e);
openShadowbox(document.getElementById('firstImageInGallery').href);
};
} else {
window.onload=function(e) {
openShadowbox(document.getElementById('firstImageInGallery').href);
};
}
}
})
</script>
So I need to name gallery to myGallery and give to first image id='firstImageInGallery'.
That's all. Now after loading page I can see first image in gallery on top.
Look at this:
http://www.strus.com.pl/nadruki-sitodru ... jalne.html
Think about putting this "usability" into your great component.
Blazej
Re: Shadowbox and domready event
Posted: 17 Dec 2008, 17:34
by Jan
Ok, thank your for this code, I will take a look at it...
Jan