Explorar el Código

sniff transitionend event

Evan You hace 12 años
padre
commit
cd80fe4bbb
Se han modificado 1 ficheros con 30 adiciones y 19 borrados
  1. 30 19
      src/transition.js

+ 30 - 19
src/transition.js

@@ -1,6 +1,5 @@
 var config   = require('./config'),
 var config   = require('./config'),
-    // TODO: sniff proper transitonend event name
-    endEvent = 'transitionend'
+    endEvent = sniffTransitionEndEvent()
 
 
 /**
 /**
  *  stage:
  *  stage:
@@ -9,29 +8,23 @@ var config   = require('./config'),
  */
  */
 module.exports = function (el, stage, changeState, init) {
 module.exports = function (el, stage, changeState, init) {
 
 
-    // TODO: directly return if IE9
-
-    var className         = el.sd_trans_class,
-        classList         = el.classList,
-        lastLeaveCallback = el.sd_trans_cb
-
-    // in sd-repeat, the sd-transition directive
-    // might not have been processed yet
-    if (!className) {
-        className = el.getAttribute(config.transClassAttr)
+    if (!endEvent || init) {
+        return changeState()
     }
     }
 
 
-    // TODO: optional duration which
-    //       can override the default transitionend event
+    var className =
+        el.sd_trans_class ||
+        // in sd-repeat, the sd-transition directive
+        // might not have been processed yet
+        el.getAttribute(config.transClassAttr)
 
 
-    // if no transition, just call changeState sync.
-    // this is internal API and the changeState callback
-    // will always contain only dom manipulations that
-    // doesn't care about the sync/async-ness of this method.
-    if (init || !className) {
+    if (!className) {
         return changeState()
         return changeState()
     }
     }
 
 
+    var classList         = el.classList,
+        lastLeaveCallback = el.sd_trans_cb
+
     if (stage > 0) { // enter
     if (stage > 0) { // enter
 
 
         // cancel unfinished leave transition
         // cancel unfinished leave transition
@@ -66,4 +59,22 @@ module.exports = function (el, stage, changeState, init) {
         el.sd_trans_cb = onEnd
         el.sd_trans_cb = onEnd
         
         
     }
     }
+}
+
+/**
+ *  Sniff proper transition end event name
+ */
+function sniffTransitionEndEvent () {
+    var el = document.createElement('div'),
+        defaultEvent = 'transitionend',
+        events = {
+            'transition'       : defaultEvent,
+            'MozTransition'    : defaultEvent,
+            'WebkitTransition' : 'webkitTransitionEnd'
+        }
+    for (var name in events) {
+        if (el.style[name] !== undefined) {
+            return events[name]
+        }
+    }
 }
 }