List Info

Thread: Scriptaculous Effects Queues




Scriptaculous Effects Queues
country flaguser name
United States
2007-04-17 20:36:39
Hello,
like many others I'm attempting to create a custom effect by
chaining
multiple other effects together, one after another.  I'm
having some
trouble getting the behavior I expect from the EffectQueues
page in
the wiki:
http://wiki.script.aculo.us/scriptaculous/show/Effect
Queues

I have two effects here, a Grow and a Pulsate:

Effect.MyEffect = function(element) {
  element = $(element);
  Effect.Grow(element,
  { direction: 'top-left',
    duration: 5.0,
    queue: 'end'
  });

  Effect.Pulsate(element,
  {
    queue: 'end'
  });
}

With this code I only see the Grow and not the Pulsate.  It
doesn't
make a difference if I switch the order of the two Effect
declarations.  If I add an alert as an 'afterFinish' event
for the
Pulsate effect, I see it as the page finishes loading,
before the Grow
happens, again independent of the order of the
declarations.

If I change "queue: 'end'" to, "queue:
{position: 'end'}", which the
wiki says is equivalent, I get this error:
"Effect.Queues.get(typeof this.options.queue ==
"string" ? "global" :
this.options.queue.scope) has no properties"
which seems to indicate that the 'scope' variable has to be
there if
you define the 'queue' option as a hash.

If I do specify the scope either as 'global' or as another
value, I
get the same behavior as in the first case.  Am I missing
something
about the use of the queue?

I tried the alternative method of including the second
effect as the
first effect's "afterFinish" callback, and that
works as it should.
If I'm not mistaken, this method, despite its drawbacks, is
still in
use in the Scriptaculous source code, for example in
Effect.Shake,
consisting of several Effect.Move's chained together in this
manner.
Perhaps there's a reason for that.

Lastly, can someone set me straight on
"Effect.Grow" vs. "new
Effect.Grow"?  I've seen conflicting information, some
of which is
probably out of date.  And does this have anything to do
with some
effects being defined like this:
Effect.Shake = function(element) { ...
and some like this:
Effect.Morph = Class.create();
Object.extend(Object.extend(Effect.Morph.prototype,
Effect.Base.prototype), { ...

Thanks for any help you can offer.  I'm using Scriptaculous
1.7.0 and
Prototype 1.5.0.
-Jay


--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the
Google Groups "Ruby on Rails: Spinoffs" group.
To post to this group, send email to
rubyonrails-spinoffsgooglegroups.com
To unsubscribe from this group, send email to
rubyonrails-spinoffs-unsubscribegooglegroups.com
For more options, visit this group at http://groups.google.com/group/rubyonrails-spinoffs?hl=
en
-~----------~----~----~----~------~----~------~--~---


Re: Scriptaculous Effects Queues
country flaguser name
France
2007-04-18 01:30:19
Hey Jay,

Use the "new" operator for creating your effects,
otherwise they won't
be able to run properly when combined.  As for the queues,
you *should*
use a custom queue indeed, instead of the global queue.  But
then, you
need not only the position, but also the scope (the name of
the queue).

Here's a per-element queue that should work:

Effect.myEffect = function(elt) {
  new Effect.Grow(elt, { direction: 'top-left', duration:
5,
    queue: { scope: elt.id, position: 'end' });
  new Effect.Pulsate(elt, {queue: { scope: elt.id, position:
'end' });
}

-- 
Christophe Porteneuve a.k.a. TDD
"[They] did not know it was impossible, so they did
it." --Mark Twain
Email: tddtddsworld.com

--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the
Google Groups "Ruby on Rails: Spinoffs" group.
To post to this group, send email to
rubyonrails-spinoffsgooglegroups.com
To unsubscribe from this group, send email to
rubyonrails-spinoffs-unsubscribegooglegroups.com
For more options, visit this group at http://groups.google.com/group/rubyonrails-spinoffs?hl=
en
-~----------~----~----~----~------~----~------~--~---


[1-2]

about | contact  Other archives ( Real Estate discussion Medical topics )