event hovering firing

src/common/GlobalContext.ts

@@ -2,6 +2,7 @@ import DateComponent from '../component/DateComponent'
 import DateClicking from '../interactions/DateClicking'
 import DateSelecting from '../interactions/DateSelecting'
 import EventClicking from '../interactions/EventClicking'
+import EventHovering from '../interactions/EventHovering'
 
 let componentCnt = 0
 let componentHash = {}
@@ -9,8 +10,6 @@ let listenerHash = {}
 
 export default {
 
-  // TODO: event hovering
-
   registerComponent(component: DateComponent) {
     componentHash[component.uid] = component
     componentCnt++
@@ -44,7 +43,8 @@ export default {
   bindComponent(component: DateComponent) {
     listenerHash[component.uid] = {
       dateClicking: new DateClicking(component),
-      eventClicking: new EventClicking(component)
+      eventClicking: new EventClicking(component),
+      eventHovering: new EventHovering(component)
     }
   },
 
@@ -52,6 +52,7 @@ export default {
     let listeners = listenerHash[component.uid]
     listeners.dateClicking.destroy()
     listeners.eventClicking.destroy()
+    listeners.eventHovering.destroy()
     delete listenerHash[component.uid]
   }
 

src/component/DateComponent.ts

@@ -992,9 +992,9 @@ export default abstract class DateComponent extends Component {
 
 
   isValidSegInteraction(evTarget: HTMLElement) {
-    return !elementClosest(evTarget, '.fc-helper') &&
-      !this.dragState &&
-      !this.eventResizeState
+    return !this.dragState &&
+      !this.eventResizeState &&
+      !elementClosest(evTarget, '.fc-helper')
   }
 
 

src/interactions/EventClicking.ts

@@ -8,11 +8,14 @@ export default class EventClicking {
 
   constructor(component: DateComponent) {
     this.component = component
-    this.destroy = listenBySelector(component.el, 'click', component.segSelector, this.onSegClick)
+    this.destroy = listenBySelector(
+      component.el,
+      'click',
+      component.segSelector,
+      this.onSegClick
+    )
   }
 
-  // PROBLEM: it's firing twice because dayGrid is within Month view
-
   onSegClick = (ev: UIEvent, segEl: HTMLElement) => {
     let { component } = this
     let seg = (segEl as any).fcSeg // put there by EventRenderer

src/interactions/EventHovering.ts

@@ -0,0 +1,34 @@
+import DateComponent from '../component/DateComponent'
+import { listenToHoverBySelector } from '../util/dom-event'
+
+export default class EventHovering {
+
+  component: DateComponent
+  destroy: () => void
+
+  constructor(component: DateComponent) {
+    this.component = component
+    this.destroy = listenToHoverBySelector(
+      component.el,
+      component.segSelector,
+      this.handleSegEv.bind(this, 'eventMouseover'),
+      this.handleSegEv.bind(this, 'eventMouseout')
+    )
+  }
+
+  handleSegEv(triggerType: string, ev: UIEvent, segEl: HTMLElement) {
+    let { component } = this
+    let seg = (segEl as any).fcSeg // put there by EventRenderer
+
+    if (component.isValidSegInteraction(segEl as HTMLElement)) {
+      component.publiclyTrigger(triggerType, [
+        {
+          event: seg.eventRange.eventInstance, // TODO: correct arg!
+          jsEvent: ev,
+          view: component.view
+        }
+      ])
+    }
+  }
+
+}