Move to coordinates

Made in The Wall

Ok, The Wall moves, repositions, makes everything by itself... but what if I want to move it to a particular coordinate? This tutorial shows how to make it.
Setting remains the one you have defined, you just need a few lines of JavaScript to instruct The Wall and move it to the coordinate you want.



CONFIGURATION


Snippet code Css

                var maxLength    = 100;
                var counterFluid = 1;
                var wall = new Wall("wall", {
                                "draggable":true,
            					"autoposition":true,
                                "inertia":true,
                                "width":150,
                                "height":150,
            					"preload":true,
                                "rangex":[-6,6],
                                "rangey":[-6,6],
                                callOnUpdate: function(items){
                                    items.each(function(e, i){
                                        var a = new Element("img[src=/path/your/images/"+counterFluid+".jpg]");
                                            a.inject(e.node);
                                        counterFluid++;
                                        // Azzera counter
                                        if( counterFluid > maxLength ) counterFluid = 1;
                                    })
                                }
                            });
                // Init Fluid Wall
                wall.initWall();

                // Behaviors
                $("mv-top").addEvent("click", function(e){
                    e.stop();
                    wall.moveTo(wall.getCoordinatesFromId(wall.getActiveItem()).c, -6);
                }.bind( this ))

                $("mv-bottom").addEvent("click", function(e){
                    e.stop();
                    wall.moveTo(wall.getCoordinatesFromId(wall.getActiveItem()).c, 5);
                }.bind( this ))

                $("mv-left").addEvent("click", function(e){
                    e.stop();
                    wall.moveTo(-6,wall.getCoordinatesFromId(wall.getActiveItem()).r);
                }.bind( this ))

                $("mv-right").addEvent("click", function(e){
                   e.stop();
                   wall.moveTo(5,wall.getCoordinatesFromId(wall.getActiveItem()).r);            
                }.bind( this ))

                $("mv-center").addEvent("click", function(e){
                   e.stop();
                   wall.moveTo(0,0);            
                }.bind( this ))