js Ultimate & bretteleben slideshows doesn't run from inside x-cart 4.4.3

frontliner · #1 06-08-2011, 06:46 AM

Hi,

I have tried to install two different javascript slidshows but they are not working when placed inside x-cart directories.

1. I first tried to run the ultimate slideshow v2.4 from Dynamic Drive onto the customer homepage without success then i even contacted John Davenport (developer of the script) on his forum. I gave him the link to my homepage and after having examined the code from the browser side, John had no answer about this behaviour.

2. Then i decided to try another fade slideshow same kind from another developer to see if this one would work better. So, i tried the bretteleben.de slideshow.

3. In order to see if the problem was coming from the hosting configuration or from x-cart, i set up the bretteleben script demo without modifications directly in the www directory outside of x-cart.

4. Then, in order to keep the demo code as the original one while still run it under x-cart for testing, i cloned be_slide.html in a static page and stored all the files from the demo in the same directory (same as i did outside of x-cart, all files stored in the same dir without calls to external paths).

Conclusion : the same script runs successfully outside of x-cart environment in www dir but doesn't work when run from under x-cart directories (homepage & demo cloned static page).

Initially i need to run the script on the homepage, so the code that refers to be_slide.js is placed between headers in /common_files/customer/home.tpl
and the call to the script where should the slideshow take place in /2-columns/customer/main/welcome.tpl

Is this could be a problem with Javascript or Smarty or with x-cart 4.4.3 ?

More about those two slideshows configuration and files below :

http://www.bretteleben.de/lang-en/javascript/slideshow.html

http://www.dynamicdrive.com/dynamicindex14/fadeinslideshow.htm

I can't understand why those js slideshows are not working at all from under x-cart.

Do someone can help ? Do i have to refer for a possible bug in 4.4.3 ?

I can post the links pointing to my store if you need...

Thanks.

balinor · #2 06-08-2011, 06:50 AM

Be sure to surround any JavaScript code with {literal} tags:

{literal}
javascript here
{/literal}

frontliner · #3 06-08-2011, 07:03 AM

Hi Balinor,

I already did it, it doesn't change anything for the homepage and for the static pages which is html {literal) is appearing as text (just tried it now)

I've read already a lot of posts in this forum referring to ultimate fade-in script (older versions) and even tried those versions without success.

I'm on this for almost 4 days.

Also, i used the bretteleben script as it was less complicated to avoid configuration errors....

Any other idea ?

balinor · #4 06-08-2011, 07:36 AM

You need to tick the 'parse smarty' box for static pages or else it won't read it.

Perhaps you can post some more info about how you have the code implemented, I'm guessing you probably just have the directory structure wrong.

frontliner · #5 06-08-2011, 09:17 AM

Thanks Balinor,

As what i really need your help for is to be able to run the Dynamic Drive fade-in slide show v2.4 onto the homepage, i've reconfigured again for it.

So, here is the code that is set inside the heads section in /common_files/customer/home.tpl :

Code:

<head>

  {include file="customer/service_head.tpl"}
{literal}
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

<script type="text/javascript" src="fadeslideshow.js">

/***********************************************
* Ultimate Fade In Slideshow v2.0- (c) 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 this script and 100s more
***********************************************/

</script>

<script type="text/javascript">

var mygallery=new fadeSlideShow({
	wrapperid: "fadeshow1", //ID of blank DIV on page to house Slideshow
	dimensions: [650, 433], //width/height of gallery in pixels. Should reflect dimensions of largest image
	imagearray: [
		["skin/common_files/images/familycar_s.jpg", "", "", "Nothing beats relaxing next to the pool when the weather is hot."],
		["skin/common_files/images/familybeach_s.jpg", "http://en.wikipedia.org/wiki/Cave", "_new", "Some day I'd like to explore these caves!"],
		["skin/common_files/images/4kids_s.jpg"],
		["skin/common_files/images/familysofa_s.jpg", "", "", "What a beautiful scene with everything changing colors."] //<--no trailing comma after very last image element!
	],
	displaymode: {type:'auto', pause:2500, cycles:0, wraparound:false},
	persist: false, //remember last viewed slide and recall within same session?
	fadeduration: 1000, //transition duration (milliseconds)
	descreveal: "ondemand",
	togglerid: ""
})



{/literal}
</script>
  
</head>

Below the code that has been placed where the slideshow should be displayed in /2-columns/customer/main/welcome.tpl :

Code:

{*
$Id: welcome.tpl,v 1.1.2.2 2010/08/09 06:39:52 aim Exp $
vim: set ts=2 sw=2 sts=2 et:
*}

{include file="customer/news.tpl"}

{if $display_greet_visitor_name}

  <h1>{$lng.lbl_welcome_back|substitute:"name":$display_greet_visitor_name} </h1>

{elseif $lng.lbl_site_title}

  <h1>{$lng.lbl_welcome_to|substitute:"company":$lng.lbl_site_title|amp}</h1>

{else}

  <h1>{$lng.lbl_welcome_to|substitute:"company":$config.Company.company_name|amp}</h1>

{/if}


slideshow goes below this line
{literal}

<div id="fadeshow1"></div> 
 

{/literal} 



{$lng.txt_welcome}<br />

<div class="clearing"></div>

Also, fadeslideshow.js, x.png, restore.png and loading.gif has been placed in /common_files/customer directory together near home.tpl

...and now, i just don't know what more can i do to have it working

Your help is highly appreciated

gb2world · #6 06-08-2011, 10:44 AM

It appears you might have files in the wrong places? The script actually runs in the directory where you have x-cart installed - not in the template directories.

So, when you say you put all the javascript files in /common_files/customer, that could be a problem unless you are pointing there.

For example, if you say: <script type="text/javascript" src="fadeslideshow.js">
then fadeslideshow.js needs to be where the x-cart script executes, not inside a template directory.

Paths are defined a little differently in the html part of things vs inside the javascript code, so you do have to take care.

This is true of all your files - the paths need to be defined correctly. If you can run your test files outside of x-cart successfully in the directory where x-cart is running (not inside a template directory), then they should work in x-cart.

Other issues that could crop up have to do with javascript conflicts of your code with the javascript that already exists in x-cart. For example, you are calling ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js, and xcart already calls its own version of jquery. So at a minimum, you may have redundant code, or, it could actually conflict and cause issues.

If you post the links, people here can look partially at the paths to the files you are calling and see if that is the problem.

---

balinor · #7 06-08-2011, 11:50 AM

Yep, that does indeed look like the issue. Scripts all go in the root directory, and you also have to be careful how you reference the images.

frontliner · #8 06-08-2011, 12:15 PM

Thank you very much gb2world to take the time for those explanations. I appreciate very much.

Quote:

Originally Posted by gb2world

It appears you might have files in the wrong places? The script actually runs in the directory where you have x-cart installed - not in the template directories.
So, when you say you put all the javascript files in /common_files/customer, that could be a problem unless you are pointing there.

For example, if you say: <script type="text/javascript" src="fadeslideshow.js">
then fadeslideshow.js needs to be where the x-cart script executes, not inside a template directory.

I was using the same dir as i expected that way to avoid wrong path errors as it is usually done in usual programming. I was wrong then.

So, if i have to consider templates dir as outside of the x-cart script running environment, where do those scripts are really running and where should i store those files fy default ? In this case, if i keep the code as it is in home.tp without defining a path to fadeslideshow.js where should i move fadeslideshow.js to run it correctly then ?

Quote:

Originally Posted by gb2world

This is true of all your files - the paths need to be defined correctly. If you can run your test files outside of x-cart successfully in the directory where x-cart is running (not inside a template directory), then they should work in x-cart.

I have not tested the Ultimate slideshow outside of x-cart, only bretteleben script.

Quote:

Originally Posted by gb2world

Other issues that could crop up have to do with javascript conflicts of your code with the javascript that already exists in x-cart. For example, you are calling ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js, and xcart already calls its own version of jquery. So at a minimum, you may have redundant code, or, it could actually conflict and cause issues.

I have tried this afternoon to replace that path by pointing to lib/jqueryui/jquery.ui.core.min.js

Don't ask me why, just tried for experiment as it was the named path that was corresponding the best with the original one.

It resulted as i lost all x-cart templates display from browser side (text style only displayed).

Quote:

Originally Posted by gb2world

If you post the links, people here can look partially at the paths to the files you are calling and see if that is the problem.

---

Link to the homepage is : http://www.skytracker.eu/store/home.php?shopkey=guest

Thank you again for your help.

frontliner · #9 06-08-2011, 12:22 PM

Quote:

Originally Posted by balinor

Yep, that does indeed look like the issue. Scripts all go in the root directory, and you also have to be careful how you reference the images.

Balinor,

I replied to gb2world without seeing your answer.

So, i have to consider the x-cart root dir as the default dir where to store scripts...

I'll try it. Maybe it is the only problem ?

Concerning the right path to images, i tried everyting possible without better results.

Thanks

gb2world · #10 06-08-2011, 05:59 PM

Quote:

where do those scripts are really running and where should i store those files fy default ? In this case, if i keep the code as it is in home.tp without defining a path to fadeslideshow.js where should i move fadeslideshow.js to run it correctly then ?

X-cart php script is running in the directory where you installed it - in your case: http://www.skytracker.eu/store

You can do a "view source" in your browser and see this:
<script type="text/javascript" src="fadeslideshow.js">

That means, the script is looking for this file here: http://www.skytracker.eu/store/fadeslideshow.js - but it is not there. You can either change this to point to where you want to have this file, or you could define it more precisely to avoid issues:
<script type="text/javascript" src="/store/skin/common_files/customer/fadeslideshow.js">

The paths for every file referenced has to be correct - including the images.

Quote:

I have not tested the Ultimate slideshow outside of x-cart, only bretteleben script.

When I say outside of x-cart, I don't mean outside of the x-cart directory. So - if you have a test file running properly in the same directory as http://www.skytracker.eu/store/ - then you know you have all the paths to files correct before you try to integrate it with x-cart.

Once you have it working in x-cart (I'm still worried about your calling the jquery libraries twice) - you may want to consider adding it using the methods QT uses - see this post by Shamun: http://forum.x-cart.com/showpost.php?p=314599&postcount=2

----