Rails spinoffs - Jul 2007 - Using Effect.Move() while maintaining the elements DOM order

Hi there,

is it possible to maintain the elements order in DOM when using
Effect.Move()? Currently the Move effect will
change the element position (using top and left style attrs), this
works quite well too, but what I''d like is
to change the elements position as well.
Consider the following example:

html:
...
<div id="a">First</div>
<div id="b">Second</div>
...

JS:

// switch two divs positions using DOM
function switchPositionsWithDOM(first, second) {
    var parentElem = first.up();
    var secondId = second.id;
    var s = second.remove();
    parentElem.insertBefore(s, first);
}

// switch positions using Effect.Move
function switchPositionsWithMove(first, second) {
    var delta = Position.cumulativeOffset(first)[1] -
Position.cumulativeOffset(second)[1];
    new Effect.Fade(first, {from: 1.0, to: 0.3});
    new Effect.Fade(second, {from: 1.0, to: 0.3});
    new Effect.Move(second, {x: 0, y: delta});
    new Effect.Move(first, {x: 0, y: -delta});
    new Effect.Appear(second, {from: 0.3, to: 1.0});
    new Effect.Appear(first, {from: 0.3, to: 1.0});
}

after calling switchPositionsWithDOM($(''a''),
$(''b'')); I''ll end up with
...
<div id="b">Second</div>
<div id="a">First</div>
...
However, switchPositionsWithMove($(''a''),
$(''b'')); will obviously
produce
...
<div id="a" style="top: xxx; left:
xxx;">First</div>
<div id="b" style="top: xxx; left:
xxx;">Second</div>
...

What I''d like to do is - create the nice visual effect as defined in
switchPositionsWithMove(), but
reorder the DOM structure as in switchPositionsWithDOM(). Ideas
anyone?

TIA,
jenner


--~--~---------~--~----~------------~-------~--~----~
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-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---

Hello,

jenner a écrit :
> is it possible to maintain the elements order in DOM when using
> Effect.Move()? Currently the Move effect will
> change the element position (using top and left style attrs), this
Er, DOM document order is entirely unrelated to styling and positioning. 
  Effects never touch your DOM document order, because they''re 
CSS-based.  What exactly are you trying to achieve?

-- 
Christophe Porteneuve aka TDD
tdd-x+CfDp/qHev2eFz/2MeuCQ@public.gmane.org

--~--~---------~--~----~------------~-------~--~----~
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-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---

jenner wrote:
> ...
> What I''d like to do is - create the nice visual effect as defined
in
> switchPositionsWithMove(), but
> reorder the DOM structure as in switchPositionsWithDOM(). Ideas
> anyone?
>
> TIA,
> jenner
>
>   
You _could_ call switchPositionsWithDOM() inside of 
switchPositionsWithMove(), but why on earth would you need the DOM order 
a certain way?  DOM order is somewhat like an object properties--the 
object {a: ''first'', b: ''second''} is
effectively the same as {b:
''second'', a: ''first''}.  Maybe I''m
missing something.

- Ken Snyder


--~--~---------~--~----~------------~-------~--~----~
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-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---

On Jul 31, 4:27 pm, Ken Snyder
<kendsny...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org>
wrote:
> jenner wrote:
> > ...
> > What I''d like to do is - create the nice visual effect as
defined in
> > switchPositionsWithMove(), but
> > reorder the DOM structure as in switchPositionsWithDOM(). Ideas
> > anyone?
>
> > TIA,
> > jenner
>
> You _could_ call switchPositionsWithDOM() inside of
> switchPositionsWithMove(), but why on earth would you need the DOM order
> a certain way?  DOM order is somewhat like an object properties--the
> object {a: ''first'', b: ''second''} is
effectively the same as {b:
> ''second'', a: ''first''}.  Maybe
I''m missing something.
Actually, I''m just being lazy here - the DOM order is responsible for
the correct list member ordering (those DIVs contain form elements).
So after I''ve swapped the DIVs I''m "reindexing" all
contained form
elements depending on their DOM order (s.th. like
container.getElementsBySelector(''div.containing-divs-
class'').each(<reassign indices for form elements here>); see
[1]).
I mean, sure, I could take care of those indices manually, but that
seems to be quite error prone, since I also can add and remove new
DIVs on the fly...

Cheers,
jenner

[1]: that''s for a spring MVC app, where you can bind to your form
objects'' Collection properties by referencing them through an array
index, like <input type="text"
name="formObject.myListProp[$index].someStringProp" />. The $index
part is the one I need to recalculate each time I''m swapping the DIVs
(i.e. moving a DIV up or down)


--~--~---------~--~----~------------~-------~--~----~
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-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---

jenner wrote:
>> ...You _could_ call switchPositionsWithDOM() inside of
>> switchPositionsWithMove(), but why on earth would you need the DOM
order
>> a certain way?  DOM order is somewhat like an object properties--the
>> object {a: ''first'', b: ''second''} is
effectively the same as {b:
>> ''second'', a: ''first''}.  Maybe
I''m missing something.
>>     
>
> Actually, I''m just being lazy here - the DOM order is responsible
for
> the correct list member ordering (those DIVs contain form elements).
> So after I''ve swapped the DIVs I''m "reindexing"
all contained form
> elements depending on their DOM order (s.th. like
> container.getElementsBySelector(''div.containing-divs-
> class'').each(<reassign indices for form elements here>);
> ...
>   
So calling switchPositionsWithDOM() inside of switchPositionsWithMove() 
should work for this, or no?

- Ken

--~--~---------~--~----~------------~-------~--~----~
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-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---

On Jul 31, 4:07 pm, Christophe Porteneuve
<t...-x+CfDp/qHev2eFz/2MeuCQ@public.gmane.org>
wrote:
> Hello,
>
> jenner a écrit :
>
> > is it possible to maintain the elements order in DOM when using
> > Effect.Move()? Currently the Move effect will
> > change the element position (using top and left style attrs), this
>
> Er, DOM document order is entirely unrelated to styling and positioning.
>   Effects never touch your DOM document order, because they''re
> CSS-based.
Right. That''s exactly what I wrote in my first mail.
> What exactly are you trying to achieve?
Have neat effects and maintain the DOM order at the same time... I
think I wrote that in my first mail too :)

Cheers,
jenner


--~--~---------~--~----~------------~-------~--~----~
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-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---

On Aug 1, 5:50 am, Ken Snyder
<kendsny...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org>
wrote:
> jenner wrote:
> >> ...You _could_ call switchPositionsWithDOM() inside of
> >> switchPositionsWithMove(), but why on earth would you need the DOM
order
> >> a certain way?  DOM order is somewhat like an object
properties--the
> >> object {a: ''first'', b:
''second''} is effectively the same as {b:
> >> ''second'', a: ''first''}.  Maybe
I''m missing something.
>
> > Actually, I''m just being lazy here - the DOM order is
responsible for
> > the correct list member ordering (those DIVs contain form elements).
> > So after I''ve swapped the DIVs I''m
"reindexing" all contained form
> > elements depending on their DOM order (s.th. like
> > container.getElementsBySelector(''div.containing-divs-
> > class'').each(<reassign indices for form elements
here>);
> > ...
>
> So calling switchPositionsWithDOM() inside of switchPositionsWithMove()
> should work for this, or no?
Yeah, tried that already, looks a bit funny though, I guess I''ll go
for the manual list member reindexing and forget the DOM stuff for the
moment.

On a totally unrelated note - for some reason element.relativize()
doesn''t reset/remove the "top"/"left" styles from
the element, any
ideas why?

Cheers,
jenner


--~--~---------~--~----~------------~-------~--~----~
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-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---