On Nov 12, 4:46 am, treadmill <[EMAIL PROTECTED]> wrote:
> Hi kangax,
>
> Wow, thank you so much for that extremely prompt reply. And thank you
> very much for the advice, it now works perfectly! :)
>
> If anyone is interested in my code, here's the full working classes
> and how to call it.  I've decided to only call the loading of the
> images, after the initial page load, so as not to make the user wait
> any longer than is necessary.
>
> Best regards,
> Kevin
>
> Event.observe(window, "load", function() {
>         var imr = new ImageRotator(0,'imgTran');
>         imr.imgFadeOut();
>
> });
>
> var ImageRotator = Class.create({
>         initialize: function(i,d) {
>                 this.step=0;
>                 this.fadestep=0;
>                 this.timer;
>                 this.fotimer;
>                 this.fitimer;
>                 this.l=d;

// try to only extend element once:
this.l = $(d);

>                 this.im;
>                 this.imgLoad(i);
>   },
>         imgFadeOut: function() {
>                 clearInterval(this.fotimer);
>                 this.fadestep = $(this.l).getStyle('opacity');
>                 if (this.fadestep <= 0) { this.imgTrans(); }
>                 else { this.fadestep -= 0.02; 
> $(this.l).setOpacity(this.fadestep);

// and then don't call `$` anymore:
else {
  this.fadestep -= 0.02;
  this.l.setOpacity(this.fadestep);
}

> this.fotimer = setInterval(this.imgFadeOut.bind(this),50); }
>         },
>         imgTrans: function() {
>                 clearInterval(this.timer);
>                 if (this.step >= this.im.length) this.step=0;
>                 $(this.l).setOpacity(0.0); 
> $(this.l).src=this.im[this.step].src; $
> (this.l).show(); this.step++; this.imgFadeIn();

Same here. Try to get rid of all the redundant `$`.

>         },
>         imgFadeIn: function() {
>                 clearInterval(this.fitimer);
>                 this.fadestep = $(this.l).getStyle('opacity');
>                 if (this.fadestep >= 1) { this.timer = setInterval
> (this.imgFadeOut.bind(this),5000); }
>                 else { this.fadestep += 0.02; 
> $(this.l).setOpacity(this.fadestep);
> this.fitimer = setTimeout(this.imgFadeIn.bind(this),50); }
>         },
>         imgLoad:function(l) {
>                 this.im = new Array();
>
>                 if (l == 0) {
>                         this.im[0]=new Image(388,336); 
> this.im[0].src="/images/homepage/
> waitress.jpg";
>                         this.im[1]=new Image(388,336); 
> this.im[1].src="/images/homepage/
> wineshop_till.jpg";
>                         this.im[2]=new Image(388,336); 
> this.im[2].src="/images/homepage/
> vintage_wines.jpg";
>                         this.im[3]=new Image(388,336); 
> this.im[3].src="/images/homepage/
> dessert.jpg";
>                         this.im[4]=new Image(388,336); 
> this.im[4].src="/images/homepage/
> home_page_landscape.jpg";
>                 }
>                 else if (l == 1) {
>                         this.im[0]=new Image(388,291); 
> this.im[0].src="/images/winebars/
> transitions/transition_10.jpg";
>                         this.im[1]=new Image(388,291); 
> this.im[1].src="/images/winebars/
> transitions/transition_2.jpg";
>                         this.im[2]=new Image(388,291); 
> this.im[2].src="/images/winebars/
> transitions/transition_3.jpg";
>                         this.im[3]=new Image(388,291); 
> this.im[3].src="/images/winebars/
> transitions/transition_4.jpg";
>                         this.im[4]=new Image(388,291); 
> this.im[4].src="/images/winebars/
> transitions/transition_5.jpg";
>                         this.im[5]=new Image(388,291); 
> this.im[5].src="/images/winebars/
> transitions/transition_6.jpg";
>                         this.im[6]=new Image(388,291); 
> this.im[6].src="/images/winebars/
> transitions/transition_7.jpg";
>                         this.im[7]=new Image(388,291); 
> this.im[7].src="/images/winebars/
> transitions/transition_8.jpg";
>                         this.im[8]=new Image(388,291); 
> this.im[8].src="/images/winebars/
> transitions/transition_9.jpg";
>                         this.im[9]=new Image(388,291); 
> this.im[9].src="/images/winebars/
> transitions/transition_1.jpg";
>                 }

You could actually remove some duplication in `imgLoad`:

...
imgLoad: function() {

  var fileNames1 = $w(
    'waitress wineshop_till vintage_wines ' +
    'dessert home_page_landscape'
  );

  var fileNames2 = $w(
    'transition_10 transition_2 ' +
    'transition_3 transition_4 ' +
    'transition_5 transition_6 ' +
    'transition_7 transition_8 ' +
    'transition_9 transition_1'
  );

  var currentNames,
      height,
      basePath,
      width = 388;

  if (l == 0) {
    currentNames = fileNames1;
    height = 336;
    basePath = '/images/homepage/';
  }
  else if (l == 1) {
    currentNames = fileNames2;
    height = 291;
    basePath = '/images/winebars/transitions/';
  };

  this.im = currentNames.inject([], function(all, name) {
    var image = new Image(width, height);
    image.src = basePath + name + '.jpg';
    all.push(image);
    return all;
  });
}
...



>         }
>
> });

--
kangax
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups 
"Prototype & script.aculo.us" group.
To post to this group, send email to prototype-scriptaculous@googlegroups.com
To unsubscribe from this group, send email to [EMAIL PROTECTED]
For more options, visit this group at 
http://groups.google.com/group/prototype-scriptaculous?hl=en
-~----------~----~----~----~------~----~------~--~---

Reply via email to