Rewrite carousel without jquery

js/src/dom/data.js

@@ -39,6 +39,7 @@ const mapData = (() => {
       const keyProperties = element.key
       if (keyProperties.key === key) {
         delete storeData[keyProperties.id]
+        delete element.key
       }
     }
   }

js/src/dom/eventHandler.js

@@ -1,3 +1,5 @@
+import Util from '../util'
+
 /**
  * --------------------------------------------------------------------------
  * Bootstrap (v4.0.0-beta): dom/eventHandler.js
@@ -60,6 +62,7 @@ if (!window.Event || typeof window.Event !== 'function') {
 
 const namespaceRegex = /[^.]*(?=\..*)\.|.*/
 const stripNameRegex = /\..*/
+const keyEventRegex  = /^key/
 
 // Events storage
 const eventRegistry = {}
@@ -87,14 +90,29 @@ const nativeEvents = [
   'error', 'abort', 'scroll'
 ]
 
+const customEvents = {
+  mouseenter: 'mouseover',
+  mouseleave: 'mouseout'
+}
+
+function fixEvent(event) {
+  // Add which for key events
+  if (event.which === null && keyEventRegex.test(event.type)) {
+    event.which = event.charCode !== null ? event.charCode : event.keyCode
+  }
+  return event
+}
+
 function bootstrapHandler(element, fn) {
   return function (event) {
+    event = fixEvent(event)
     return fn.apply(element, [event])
   }
 }
 
 function bootstrapDelegationHandler(selector, fn) {
   return function (event) {
+    event = fixEvent(event)
     const domElements = document.querySelectorAll(selector)
     for (let target = event.target; target && target !== this; target = target.parentNode) {
       for (let i = domElements.length; i--;) {
@@ -117,8 +135,15 @@ const EventHandler = {
 
     const delegation      = typeof handler === 'string'
     const originalHandler = delegation ? delegationFn : handler
+
     // allow to get the native events from namespaced events ('click.bs.button' --> 'click')
     let typeEvent = originalTypeEvent.replace(stripNameRegex, '')
+
+    const custom = customEvents[typeEvent]
+    if (custom) {
+      typeEvent = custom
+    }
+
     const isNative = nativeEvents.indexOf(typeEvent) > -1
     if (!isNative) {
       typeEvent = originalTypeEvent
@@ -131,20 +156,17 @@ const EventHandler = {
     }
 
     const fn = !delegation ? bootstrapHandler(element, handler) : bootstrapDelegationHandler(handler, delegationFn)
+    fn.isDelegation = delegation
     handlers[uid] = fn
     originalHandler.uidEvent = uid
+    fn.originalHandler = originalHandler
     element.addEventListener(typeEvent, fn, delegation)
   },
 
   one(element, event, handler) {
     function complete(e) {
-      const typeEvent = event.replace(stripNameRegex, '')
-      const events = getEvent(element)
-      if (!events || !events[typeEvent]) {
-        return
-      }
-      handler.apply(element, [e])
       EventHandler.off(element, event, complete)
+      handler.apply(element, [e])
     }
     EventHandler.on(element, event, complete)
   },
@@ -155,16 +177,46 @@ const EventHandler = {
       return
     }
 
-    const typeEvent = originalTypeEvent.replace(stripNameRegex, '')
-    const events = getEvent(element)
-    if (!events || !events[typeEvent]) {
-      return
+    const events      = getEvent(element)
+    let typeEvent     = originalTypeEvent.replace(stripNameRegex, '')
+    const inNamespace = typeEvent !== originalTypeEvent
+    const custom      = customEvents[typeEvent]
+    if (custom) {
+      typeEvent = custom
+    }
+    const isNative = nativeEvents.indexOf(typeEvent) > -1
+    if (!isNative) {
+      typeEvent = originalTypeEvent
     }
 
-    const uidEvent = handler.uidEvent
-    const fn = events[typeEvent][uidEvent]
-    element.removeEventListener(typeEvent, fn, false)
-    delete events[typeEvent][uidEvent]
+    if (typeof handler === 'undefined') {
+      for (const elementEvent in events) {
+        if (!Object.prototype.hasOwnProperty.call(events, elementEvent)) {
+          continue
+        }
+
+        const storeElementEvent = events[elementEvent]
+        for (const keyHandlers in storeElementEvent) {
+          if (!Object.prototype.hasOwnProperty.call(storeElementEvent, keyHandlers)) {
+            continue
+          }
+          // delete all the namespaced listeners
+          if (inNamespace && keyHandlers.indexOf(originalTypeEvent) > -1) {
+            const handlerFn = events[elementEvent][keyHandlers]
+            EventHandler.off(element, elementEvent, handlerFn.originalHandler)
+          }
+        }
+      }
+    } else {
+      if (!events || !events[typeEvent]) {
+        return
+      }
+
+      const uidEvent = handler.uidEvent
+      const fn = events[typeEvent][uidEvent]
+      element.removeEventListener(typeEvent, fn, fn.delegation)
+      delete events[typeEvent][uidEvent]
+    }
   },
 
   trigger(element, event, args) {
@@ -172,24 +224,27 @@ const EventHandler = {
         (typeof element === 'undefined' || element === null)) {
       return null
     }
-    const typeEvent = event.replace(stripNameRegex, '')
-    const isNative = nativeEvents.indexOf(typeEvent) > -1
-    let returnedEvent = null
+
+    const typeEvent   = event.replace(stripNameRegex, '')
+    const isNative    = nativeEvents.indexOf(typeEvent) > -1
+    let evt           = null
+
     if (isNative) {
-      const evt = document.createEvent('HTMLEvents')
-      evt.initEvent(typeEvent, true, true, typeof args !== 'undefined' ? args : {})
-      element.dispatchEvent(evt)
-      returnedEvent = evt
+      evt = document.createEvent('HTMLEvents')
+      evt.initEvent(typeEvent, true, true)
     } else {
-      const eventToDispatch = new CustomEvent(event, {
+      evt = new CustomEvent(event, {
         bubbles: true,
-        cancelable: true,
-        detail: typeof args !== 'undefined' ? args : {}
+        cancelable: true
       })
-      element.dispatchEvent(eventToDispatch)
-      returnedEvent = eventToDispatch
     }
-    return returnedEvent
+
+    // merge custom informations in our event
+    if (typeof args !== 'undefined') {
+      evt = Util.extend(evt, args)
+    }
+    element.dispatchEvent(evt)
+    return evt
   }
 }