how to implement move/shift left/right effect

[Dmitry Trunikov]

Dear colleagues,

At https://github.com/sstephenson/prototype/tree/2a6914089ad6f0b398d9f4ef7032e6bab818dd51
I've seen spectacular effect when pane with list of directories/files
effectively shifted left/right during navigation between directories.
Can you give me a clue how it can be implemented with Prototype 1.6.X
and script.aculo.us?

Thanks,
Dmitry

[Phil Petree]

I looked at that once for a project I was working on.. they weren't really shifting left/right what they were doing was inserting a new listbox to the right of the previous box.

 

So:  listbox A has the drives and you click on one, you then insert another listbox B to the right of A and then use an ajax call to populate listbox B with the files/folders on the clicked drive.  When you click on a folder in listbox B you insert listbox C to the right of B and so on and so on...

 

That was the problem with the implementation I saw, you could have 10 listboxes and the screen got too crowded.  I suppose though, that now that I have a minisucle of experience that one could always place the listboxes in a carosel so that only 3 were shown at once.

--
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-s...@googlegroups.com.
To unsubscribe from this group, send email to prototype-scripta...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en.

[Victor]

Do you talking about visual effects in Chrome while browsing the source tree? This is special effect somewhere in bundle_github.js (look for CSS class "js-slide-to").

1. You can download that JS file and look into it for concrete working example.

2. With Prototype you can set global event observer for "click" event on "a.js-slide-to" selector, then inside of event handler read URL from anchor, make some fading/rolling effect with current content wrapper, then create new content wrapper, fill it via AJAX request to URL mentioned above, and finally show it with some effect.

I think event observing/delegation will be made better with the latest Prototype version (1.7).