Help with javascript photoalbum

espfutbol98

New Member
Messages
200
Reaction score
2
Points
0
I have found this really nice photo album here and I am wondering how to integrate it with my site. I have the exact source (except for my own css and js files) here but it is still not working. I figure some server-side scripting is required but I can't find anything (like ajax) that would hint to that. What do I need to do for it to work?


Edit:
The photos on the right, when clicked on, should occupy the main window but they don't. What the do that is interesting is: in the download button, the file size changes. Also if anyone is having trouble viewing my page click here for the unencrypted page; FireFox doesn't like my SSL certificate :(
 
Last edited:

misson

Community Paragon
Community Support
Messages
2,572
Reaction score
72
Points
48
Take a look at the error console in your browser. At page load in Firefox, you see:
Error: Object.extend is not a function
Source File: https://podaci.co.uk/design/style/lightbox.js Line: 129
Error: addEvent is not defined
Source File: https://podaci.co.uk/design/style/sweetTitles.js Line: 148

When you click an image, you get:
Error: Element.setSrc is not a function
Source File: https://podaci.co.uk/design/style/scroller.js Line: 277
Looking at the source for lightbox.js around line 129, you see that this is where Element.setSrc is defined, only it isn't because the call to Object.extend fails. Now we know the first error causes the third, but what causes the first? If you check Object.extend in Firebug's console, you find it is defined. From this we deduce that Object.extend is being defined too late. Looking at the source for the page, we see that lightbox.js is loaded before prototype.js and scriptaculous.js.

Solution: change the order of the <script> tags, putting the dependent scripts (e.g. lightbox.js) after the depended scripts (e.g. prototype.js and scriptaculous.js).
 

espfutbol98

New Member
Messages
200
Reaction score
2
Points
0
Alrignt, I ordered the scripts like the originating site but now I get the error: Effect not defined on line 286 of scroller.js which is
Code:
new Effect.Appear('fotoimg', { duration: 0.5, queue: 'end'});
and also Effect not defined on line 131 on scroller.js which is
Code:
new Effect.MoveBy(items_scroll, -page_size,0,
as well as Elemens setSrc is not a function on line 277 of scroller.js which is
Code:
Element.setSrc('fotoimg', url);
What should I do?
 
Last edited:

misson

Community Paragon
Community Support
Messages
2,572
Reaction score
72
Points
48
Anytime you get an error like "Foo is not defined" or "Can't find foo" or "Foo is not a function", it's the exact same problem: Foo isn't defined yet. Either the file defining Foo isn't loaded yet, or the file doesn't exist. Go through the same steps as I did earlier: find where Foo is defined, make sure it's being loaded and make sure it's being loaded at the right time.

If you look at the page source, you'll see you're loading a number of scripts from "/design/style/". Scripts aren't style sheets, so the first thing to do is move all scripts to a "js" or "script" directory and fix the links. Second, make sure there aren't any missing scripts. Head over to the Scriptaculous site, where you can read the documentation and get the current version. One thing of note is that Scriptaculous is broken up into a number of modules, which scriptaculous.js loads. Effect is defined in effect.js. In Firebug, open the Net tab and you'll see that effect.js has a 404 result.
 

espfutbol98

New Member
Messages
200
Reaction score
2
Points
0
IT WORKS!!!!! Thank you so much. I went to the script.aculo.us site and downloaded the effects.js file
 
Top