From bb4dfeb5edb9cf882e69a8634287f74115edf687 Mon Sep 17 00:00:00 2001
From: Yohei Shimomae <yohei.shimomae@gmail.com>
Date: Thu, 17 Oct 2013 19:51:49 -0700
Subject: [PATCH] updated crocodile 2 demo

---
 demos/snap-mascot/crocodile-2.html | 30 +++++++-----------------------
 1 file changed, 7 insertions(+), 23 deletions(-)

diff --git a/demos/snap-mascot/crocodile-2.html b/demos/snap-mascot/crocodile-2.html
index 6f0fc00..cad8ae6 100644
--- a/demos/snap-mascot/crocodile-2.html
+++ b/demos/snap-mascot/crocodile-2.html
@@ -33,10 +33,11 @@
                 if (animating[key]) return;
                 clearTimeout(cleartimers[key]);
                 animating[key] = true;
-                var element = elements[key];
+                var element = elements[key],
+                x = element[0].getBBox().x,
+                offset = x/2 + 25;
                 element[0].attr({
-                    opacity: 0,
-                    transform: "translate(50,50) scale(0.5, 0.5)"
+                    transform: "translate("+offset+",80) scale(0.5, 0.5)"
                 });
                 setTimeout(function() {
                     element[0].animate({opacity:1,transform:""}, 500, mina.elastic);
@@ -50,30 +51,13 @@
                 function cycle() {
                     show(elementkeys[j]);
                     j++;
-                    if (j < elementkeys.length) setTimeout(cycle, 300);
+                    if (j < elementkeys.length) setTimeout(cycle, 200);
                 }
                 cycle();
             }
 
-            function hide(key) {
-                if (animating[key]) return;
-                animating[key] = true;
-                var element = elements[key];
-                element[0].animate({opacity:0}, 200);
-                element[1].animate({opacity:0}, 200);
-                setTimeout(function(){animating[key] = false}, 200);
-            }
-
             function hoverIn() {
-                hide( this.node.id.replace('hit-', '') );
-            }
-
-            function hoverOut() {
-                var key = this.node.id.replace('hit-', '');
-                show(key);
-                cleartimers[key] = setTimeout(function() {
-                    show( key );
-                }, 200);
+                show( this.node.id.replace('hit-', '') );
             }
 
 
@@ -82,7 +66,7 @@
                 diagram = diagramgroup.select("#diagram-" + key).attr({opacity:0}),
                 path = diagramgroup.select("#path-" + key).attr({opacity:0}),
                 hitarea = diagramgroup.select("#hit-" + key);
-                hitarea.hover(hoverIn, hoverOut);
+                hitarea.hover(hoverIn);
                 elements[key] = [diagram, path];
             }