X-Cart forums - X-Cart X-Mas Lights

X-Cart forums (https://forum.x-cart.com/index.php)

- Dev Questions (https://forum.x-cart.com/forumdisplay.php?f=20)

- - X-Cart X-Mas Lights (https://forum.x-cart.com/showthread.php?t=17695)

Tis the season to give so... Here's last years Macromedia Flash Christmas Lights I had up on cart-lab.com, you can put atop of your site transparently.

:arrow: http://www.cart-lab.com/lab/files/freebies/cart-lab_xmaslights.zip

\:D/

mighty nice of you BOOMER!

merry xmas to you too

It's in action now on www.leverger.co.uk

:lol:

Hrmm doesn't seem to be going 100% width. I beleive it should fit across all the way. Maybe need to duplicate the object and place it on the right side of the work area in flash. :-k

i thought that was just me! It seems to work on up to 1280x1024 but anything more than that and you get a gap on the left hand side.

fab; let us know if you get it updated to span across as well :)

I just viewed it on my screen in Mozilla 1680x1050 and it's full across the screen. Although in IE it leaves a big gap on the right (goes about half way across). Seems to be a browser issue.

Carrie

after tinkering a little i have it displaying the same in both firefox and internet exploder but the problem with the gap on the left remain so i guess it's a code issue somewhere

Don,

It looks good over here now to me in FF and IE. I see part of a green light, so that may be the gap your seeing (just the "wire" first?) :)

Carrie

i still have a gap on the left Carrie,

I'm not too concerned as for the most part, the users of the 'net aren't browsing on anything more than 1600x1200 as an absolute maximum and those of us on higher resolutions are used to the odd quirk here and there!!!

Thanks for the heads up though - on IE that was a huge error where it was filling only half the screen.

It's the placement of the code that's important here, people. I put the flash code (to be found in the readme file from BOOMER) right after the following code in home.tpl to make it work 'correctly':

Quote:

</HEAD>

<BODY leftmargin="0" topmargin="0" rightmargin="0" bottommargin="0" marginwidth="0" marginheight="0">

Not christmas lights... but I was just wondering if anyone wanted to comment on my "Snow"... hehe

www.AngelaCarol.com

:!: ALERT: Possible Adult Material - Possible not appropriate for work (depending on where you work).

nice site! could look at that all day long..!

care to post the snow?

Sure... just a little something I found out there.

Step 1:

Create a file in your /skin1/ directory named snow.js with this content:

Code:

  //Configure below to change URL path to the snow image

  var snowsrc="/snow3.gif"

  // Configure below to change number of snow to render

  var no = 10;



  var ns4up = (document.layers) ? 1 : 0;  // browser sniffer

  var ie4up = (document.all) ? 1 : 0;

  var ns6up = (document.getElementById&&!document.all) ? 1 : 0;



  var dx, xp, yp;    // coordinate and position variables

  var am, stx, sty;  // amplitude and step variables

  var i, doc_width = 800, doc_height = 600;

  

  if (ns4up||ns6up) {

    doc_width = self.innerWidth;

    doc_height = self.innerHeight;

  } else if (ie4up) {

    doc_width = document.body.clientWidth;

    doc_height = document.body.clientHeight;

  }



  dx = new Array();

  xp = new Array();

  yp = new Array();

  am = new Array();

  stx = new Array();

  sty = new Array();

  

  for (i = 0; i < no; ++ i) {  

    dx[i] = 0;                        // set coordinate variables

    xp[i] = Math.random()*(doc_width-50);  // set position variables

    yp[i] = Math.random()*doc_height;

    am[i] = Math.random()*20;         // set amplitude variables

    stx[i] = 0.02 + Math.random()/10; // set step variables

    sty[i] = 0.7 + Math.random();     // set step variables

    if (ns4up) {                      // set layers

      if (i == 0) {

        document.write("<layer name=\"dot"+ i +"\" left=\"15\" top=\"15\" visibility=\"show\"><a href=\"http://dynamicdrive.com/\">[img]"+snowsrc+"[/img]</a></layer>");

      } else {

        document.write("<layer name=\"dot"+ i +"\" left=\"15\" top=\"15\" visibility=\"show\">[img]"+snowsrc+"[/img]</layer>");

      }

    } else if (ie4up||ns6up) {

      if (i == 0) {

        document.write("<div id=\"dot"+ i +"\" style=\"POSITION: absolute; Z-INDEX: "+ i +"; VISIBILITY: visible; TOP: 15px; LEFT: 15px;\"><a href=\"http://dynamicdrive.com\">[img]"+snowsrc+"[/img]</a></div>");

      } else {

        document.write("<div id=\"dot"+ i +"\" style=\"POSITION: absolute; Z-INDEX: "+ i +"; VISIBILITY: visible; TOP: 15px; LEFT: 15px;\">[img]"+snowsrc+"[/img]</div>");

      }

    }

  }

  

  function snowNS() {  // Netscape main animation function

    for (i = 0; i < no; ++ i) {  // iterate for every dot

      yp[i] += sty[i];

      if (yp[i] > doc_height-50) {

        xp[i] = Math.random()*(doc_width-am[i]-30);

        yp[i] = 0;

        stx[i] = 0.02 + Math.random()/10;

        sty[i] = 0.7 + Math.random();

        doc_width = self.innerWidth;

        doc_height = self.innerHeight;

      }

      dx[i] += stx[i];

      document.layers["dot"+i].top = yp[i];

      document.layers["dot"+i].left = xp[i] + am[i]*Math.sin(dx[i]);

    }

    setTimeout("snowNS()", 10);

  }



  function snowIE_NS6() {  // IE and NS6 main animation function

    for (i = 0; i < no; ++ i) {  // iterate for every dot

      yp[i] += sty[i];

      if (yp[i] > doc_height-50) {

        xp[i] = Math.random()*(doc_width-am[i]-30);

        yp[i] = 0;

        stx[i] = 0.02 + Math.random()/10;

        sty[i] = 0.7 + Math.random();

        doc_width = ns6up?window.innerWidth : document.body.clientWidth;

        doc_height = ns6up?window.innerHeight : document.body.clientHeight;

      }

      dx[i] += stx[i];

      if (ie4up){

      document.all["dot"+i].style.pixelTop = yp[i];

      document.all["dot"+i].style.pixelLeft = xp[i] + am[i]*Math.sin(dx[i]);

      }

      else if (ns6up){

      document.getElementById("dot"+i).style.top=yp[i];

      document.getElementById("dot"+i).style.left=xp[i] + am[i]*Math.sin(dx[i]);

      }   

    }

    setTimeout("snowIE_NS6()", 10);

  }



  if (ns4up) {

    snowNS();

  } else if (ie4up||ns6up) {

    snowIE_NS6();

  }

Step 2:

Download this image (or create your own snow GIF) and upload it to the root of your website:

http://www.angelacarol.com/snow3.gif

Step 3:

Add this line to the <BODY> section of your /skin1/customer/home.tpl file

Code:

<script language="JavaScript" src="{$SkinDir}/snow.js" type="text/javascript"></script>

Alternatively, if you only want this displayed on your home page (and not on every page) add these lines to the <BODY> section instead

Code:

{if $main eq "catalog" and $current_category.category eq ""}

<script language="JavaScript" src="{$SkinDir}/snow.js" type="text/javascript"></script>

{/if}

I've discovered the problem with the flash xmas lights not filling the screen...
I have modified BOOMER's code and it now works in FF and IE and reaches right across the screen.

Quote:

Here's a test.html file I used to get the lights to spread at 100% with no cut ups.

Code:

<HTML>

<TITLE></TITLE>

<style>

BODY {

        padding: 0px 0px 0px 0px;

        margin: 0px;

}

</style>        

<BODY>

<DIV id="top" style="position: absolute;top:0;left:0;width:100%;" width="100%">

<OBJECT classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0" WIDTH="100%" HEIGHT="60" id="lights" ALIGN="">

<PARAM NAME=wmode VALUE=transparent> <PARAM NAME=movie VALUE="lights.swf">

<PARAM NAME=menu VALUE=false>

<PARAM NAME=quality VALUE=high>

<PARAM NAME=bgcolor VALUE=#FFFFFF>

<EMBED src="lights.swf" menu=false quality=high bgcolor=#FFFFFF wmode="transparent" WIDTH="100%" HEIGHT="60" NAME="lights" ALIGN="" TYPE="application/x-shockwave-flash" PLUGINSPAGE="http://www.macromedia.com/go/getflashplayer"></EMBED>

</OBJECT>

</DIV>

</BODY>

</HTML>

:!: Note I removed the {$ImagesDir}/ call before the lights.swf file for local testing. Think the <style> will fix the issue. 8)

I really like those lights, but since my sites have menus right up at the top of the screen, the lights overlay them and you can not click on them :(

I normally just add padding-top: and push the content down 10-15 pixels so its not completely overlapping just barely over the content. Not always easy for some site designs though. :?

Ahhh with all these lights and snow it puts me in the singing mood

Everybody come on :D

1

2

3

Oh the weather outside is frightful

But the fire is so delightful

And since we've no place to go

Let It Snow! Let It Snow! Let It Snow!

It doesn't show signs of stopping

And I've bought some corn for popping

The lights are turned way down low

Let It Snow! Let It Snow! Let It Snow!

When we finally kissgoodnight

How I'll hate going out in the storm!

But if you'll really hold me tight

All the way home I'll be warm

The fire is slowly dying

And, my dear, we're still goodbying

But as long as you love me so

Let It Snow! Let It Snow! Let It Snow! :P

I've got a gun and im not afraid of using it!!!!

Bah Humbug and all that stuff.

Quote:

Originally Posted by cotc2001

I've got a gun and im not afraid of using it!!!!

Bah Humbug and all that stuff.

:lol: It is a BIT too early for that Groovico!! I might side on Cotc on this one. ;)

Carrie

On a side note....
Did you know that the Film "A Christmas Carol" by Charles Dickens was shot entirely in my town and we still have the grave of Ebeneezer Scrooge in the church graveyard as the props people thought it would be funny to leave it where it was.
http://www.search.secretshropshire.org.uk/engine/theme/default.asp?theme=1972&text=0
Pix here (and even though they have fake snow, our town really does look like this)

that reminds me also of my wifes response to someone who was pretending to be well read.

the person said to my wife "Do you like Dickens"
to which my wife naughtily responded " I don't know i've never been to one"[/url]

Quote:

Originally Posted by cotc2001

the person said to my wife "Do you like Dickens"
to which my wife naughtily responded " I don't know i've never been to one"

LOL That reminds me of that old fake radio ad for Dickens Cider...

*NOTE: Gonna be a bad boy and post the URL...

Dickens Cider

And then when somebody asked her if she remembered Muffin the Mule , she goes and says "thats illegal isn't it"....... There is no stopping her :D

Quote:

Originally Posted by cotc2001

I live in Shropshire and never knew that, im trying to delay Christmas spirit until december but the wifes gets all excited.

Wow Boomer, this is great! What a difference it makes to my store! :D Very Christmas like and easy to install too! Thank you very much!

However, I now get that message "This page contains secure and nonsecure items" message whenever anyone tries to register or go to the checkout. Is there anything that can be done to fix this?

I noticed in the code that there are a couple of "http://" links which I gather is causing the problem.

I'm also wondering how I can exclude the lights from appearing if the browser happens to be FF. The reason I ask is because the lights look terrible in FireFox even with tinkering here and there. No matter what I do, the lights don't stretch all the way (even when the width is set to 1920px) and the background is always white regardless of the colour I choose. So it seems easier to just exclude the Christmas lights code from FF browsers and be done with it. Btw, the lights look awesome in IE.

So, is it possible to switch on/off the lights depending on the browser used? I'm just guessing, but something like this perhaps....

{if $browser="Internet Explorer"}
Christmas lights code here
{else}
{/if}

Yes, you'll need to remove the codebase http:// and make it https:// as well as activeX will try and connect to the codebase via http:// causing the same error as well.

Personally I'd disable the lights at checkout, no need to confuse customers more :)

works fine in FF here

Thanks Boomer, works great.

Quote:

Originally Posted by donavichi

works fine in FF here

I just checked your web site using FF, and it shows up exactly the same way as mine did - BADLY (white background, gaps on either side).

The only explaination I can come up with regarding how we see the lights so differently may have something to do with the version of FireFox we are using. I'm using 1.0.7. Other than that, it's got me stumped! :-k

Im using FF 1.0.7 and everything looks great to me on those sites.

i am truly humbled by your critique TelaFirma!

:)

Ok.. Ok.. so I took my happy pill this morning...

If anyone wants to easily snow up their logo, download the alienskin eyecandy nature photoshop plugin, its a 14 free trial and it does it nice n easy

see our site.

Re: X-Cart X-Mas Lights

hey guys, im wondering if you could help me?

im currently using this mod and its working great but i want to add something else that builds onto this.

and it got me thinking if i can alter certain parts of the site design for these ocasions that would be great so for instance:

X-mas
Valentines day
Mothers day
fathers day
holloween

ect ect.

you get my point now i have tried to insert this code so that it calls up the specific graphic:

Code:

{if $smarty.now|date_format:"%m" > 10}<!--November countdown to x-mas -->

<table align="left" background="{$ImagesDir}/head_linebg.gif" width="100%" style="background-repeat:no-repeat">

{else if $smarty.now|date_format:"%m" > 9}

<table align="left" background="{$ImagesDir}/head_linebgstd.gif" width="100%" style="background-repeat:no-repeat">

{/if}

but if i decide to add more months to that it does not work?
is there a limit to the "else if" statement?

help would be great on this

Re: X-Cart X-Mas Lights

ok correct me if im wrong but i think i have it:

Code:

{if $smarty.now|date_format:"%m" == 11}

<!--November -->

<span style="color:#00c000; margin-left:25px; font-family: Consolas; font-size:12px"><script language="JavaScript" src="{$SkinDir}/daystochristmas.js" type="text/javascript"></script></span>        

{else}

        <!--DEC -->

        {if $smarty.now|date_format:"%m" == 12}

<span style="color:#00c000; margin-left:25px; font-family: Consolas; font-size:12px"><script language="JavaScript" src="{$SkinDir}/daystochristmas.js" type="text/javascript"></script></span>

        {else}

            <!--FEB -->

            {if $smarty.now|date_format:"%m" == 02}

                <span style="color:#00c000; margin-left:25px; font-family: Consolas; font-size:12px">

                <script language="JavaScript" src="{$SkinDir}/daystochristmas.js" type="text/javascript"></script>

        </span>

        {else}<!--STANDARD -->

        <span style="margin-left:25px">{include file="today_newsbar.tpl"}</span>

        {/if}

    {/if}

{/if}

i tried {else if} statements and that did not work as soon as 1 statement was correct it would show all data in the other if statements