Skip to main content

show and hide functions in closure

I'm a huge fan of jQuery and while closure is new, its pretty interesting, there are things that are easier to do in jQuery like showing or hiding DOM or DOM manipulations. $ in jQuery is goog.dom.query in closure (they used dojo, i hope they just used sizzle instead). So in order to do something like $("img .oldImages").hide() you have to include third party deps.js
<script src="third_party/closure/goog/deps.js"></script>

We need to import the following:
goog.require('goog.fx');
goog.require('goog.fx.dom');
goog.require('goog.dom.query');
goog.require('goog.fx.AnimationQueue');


function hide(dom){
var anims = new goog.fx.AnimationParallelQueue();
var items = goog.dom.query(dom);
goog.array.forEach(items,function(item){
var anim = new goog.fx.dom.FadeOutAndHide(item, 1000);
anims.add(anim);
});
anims.play();
}

function show(dom){
var anims = new goog.fx.AnimationParallelQueue();
var items = goog.dom.query(dom);
goog.array.forEach(items,function(item){
var anim = new goog.fx.dom.FadeInAndShow(item, 1000);
anims.add(anim);
});
anims.play();
}


Explanation
Use the animation queue (use the one that execute in parallel)
var anims = new goog.fx.AnimationParallelQueue();

Query for our css selector query
var items = goog.dom.query(dom);

Loop through the items create either fadeIn or fadeOut animation on each item, then add that animation to the animation queue.
goog.array.forEach(items,function(item){ ....
anims.add(anim);
});


Play our animation queue
anims.play();

Demo
http://monmonja.com/closure/showHide.html

Comments

Popular posts from this blog

Unlockd Android Auto Open

Now that Unlockd has reached its doomed. Here is a script where i just downloaded android tools and automatically have my phone open, I believe you can use this for games that requires constant tapping of the screen (as long as it's not one of the fast tap one as adb has a delay). for i in `seq 1 50`; do # open the phone adb shell input keyevent 26 # keep the phone open for 8 seconds sleep 8 # close the phone adb shell input keyevent 26 # randomised sleep to make it look real sleep $[ ( $RANDOM % 10 ) + 1 ]s done if your phone has passcode for i in `seq 1 50`; do adb shell input keyevent 26 sleep 1 # swipe from bottom to up adb shell input touchscreen swipe 530 1280 1030 480 # enter your passcode adb shell input text <Your passcode> # check button adb shell input keyevent 66 sleep 8 adb shell input keyevent 26 sl…