remove isInteractive for a system with settings

src/core/Calendar.ts

@@ -34,7 +34,7 @@ import DateComponent from './component/DateComponent'
 import { PointerDragEvent } from './interactions/pointer'
 import EventClicking from './interactions/EventClicking'
 import EventHovering from './interactions/EventHovering'
-import { componentHash } from './common/browser-context'
+import { InteractionSettingsInput, parseInteractionSettings, Interaction, interactionSettingsStore } from './interactions/interaction'
 import DateClicking from './interactions/DateClicking'
 import DateSelecting from './interactions/DateSelecting'
 import EventDragging from './interactions/EventDragging'
@@ -89,7 +89,7 @@ export default class Calendar {
   defaultAllDayEventDuration: Duration
   defaultTimedEventDuration: Duration
 
-  componentListeners: { [componentUid: string]: { destroy: () => void }[] } = {}
+  interactionsStore: { [componentUid: string]: Interaction[] } = {}
 
   removeNavLinkListener: any
   documentPointer: PointerDragging // for unfocusing
@@ -852,29 +852,30 @@ export default class Calendar {
   // -----------------------------------------------------------------------------------------------------------------
 
 
-  registerComponent(component: DateComponent<any>) {
-    componentHash[component.uid] = component
+  registerInteractiveComponent(component: DateComponent<any>, settingsInput: InteractionSettingsInput) {
+    let settings = parseInteractionSettings(component, settingsInput)
 
-    this.componentListeners[component.uid] = [
-      new EventClicking(component),
-      new EventHovering(component),
-      new EventDragging(component),
-      new EventResizing(component),
-      new DateClicking(component),
-      new DateSelecting(component)
+    this.interactionsStore[component.uid] = [
+      new EventClicking(settings),
+      new EventHovering(settings),
+      new EventDragging(settings),
+      new EventResizing(settings),
+      new DateClicking(settings),
+      new DateSelecting(settings)
     ]
+
+    interactionSettingsStore[component.uid] = settings
   }
 
 
-  unregisterComponent(component: DateComponent<any>) {
-    let { componentListeners } = this
+  unregisterInteractiveComponent(component: DateComponent<any>) {
 
-    for (let listener of componentListeners[component.uid]) {
+    for (let listener of this.interactionsStore[component.uid]) {
       listener.destroy()
     }
 
-    delete componentListeners[component.uid]
-    delete componentHash[component.uid]
+    delete this.interactionsStore[component.uid]
+    delete interactionSettingsStore[component.uid]
   }
 
 

src/core/component/DateComponent.ts

@@ -39,8 +39,6 @@ PURPOSES:
 export default class DateComponent<PropsType> extends Component<PropsType> {
 
   // self-config, overridable by subclasses. must set on prototype
-  isInteractable: boolean
-  useEventCenter: boolean // for dragging geometry
   fgSegSelector: string // lets eventRender produce elements without fc-event class
   bgSegSelector: string
   // IN SCHEDULER: allowAcrossResources
@@ -62,20 +60,12 @@ export default class DateComponent<PropsType> extends Component<PropsType> {
     super(context, isView)
 
     this.el = el
-
-    if (this.isInteractable) {
-      context.calendar.registerComponent(this)
-    }
   }
 
   destroy() {
     super.destroy()
 
     removeElement(this.el)
-
-    if (this.isInteractable) {
-      this.calendar.unregisterComponent(this)
-    }
   }
 
 
@@ -282,7 +272,5 @@ export default class DateComponent<PropsType> extends Component<PropsType> {
 
 }
 
-DateComponent.prototype.isInteractable = false
-DateComponent.prototype.useEventCenter = true
 DateComponent.prototype.fgSegSelector = '.fc-event-container > *'
 DateComponent.prototype.bgSegSelector = '.fc-bgevent:not(.fc-nonbusiness)'

src/core/interactions-external/ExternalElementDragging.ts

@@ -1,7 +1,7 @@
 import ElementDragging from '../dnd/ElementDragging'
 import { Hit } from '../interactions/hit'
 import HitDragging from '../interactions/HitDragging'
-import { componentHash } from '../common/browser-context'
+import { interactionSettingsStore } from '../interactions/interaction'
 import { PointerDragEvent } from '../interactions/pointer'
 import { parseEventDef, createEventInstance, EventTuple } from '../structs/event'
 import { createEmptyEventStore, eventTupleToStore } from '../structs/event-store'
@@ -41,7 +41,7 @@ export default class ExternalElementDragging {
 
   constructor(dragging: ElementDragging, suppliedDragMeta?: DragMetaGenerator) {
 
-    let hitDragging = this.hitDragging = new HitDragging(dragging, componentHash)
+    let hitDragging = this.hitDragging = new HitDragging(dragging, interactionSettingsStore)
     hitDragging.requireInitial = false // will start outside of a component
     hitDragging.emitter.on('dragstart', this.handleDragStart)
     hitDragging.emitter.on('hitupdate', this.handleHitUpdate)

src/core/interactions/DateClicking.ts

@@ -1,26 +1,26 @@
-import DateComponent from '../component/DateComponent'
 import FeaturefulElementDragging from '../dnd/FeaturefulElementDragging'
 import HitDragging, { isHitsEqual } from './HitDragging'
 import { PointerDragEvent } from '../interactions/pointer'
+import { Interaction, InteractionSettings, interactionSettingsToStore } from './interaction'
 
 /*
 Monitors when the user clicks on a specific date/time of a component.
 A pointerdown+pointerup on the same "hit" constitutes a click.
 */
-export default class DateClicking {
+export default class DateClicking extends Interaction {
 
-  component: DateComponent<any>
   dragging: FeaturefulElementDragging
   hitDragging: HitDragging
 
-  constructor(component: DateComponent<any>) {
-    this.component = component
+  constructor(settings: InteractionSettings) {
+    super(settings)
+    let { component } = settings
 
     // we DO want to watch pointer moves because otherwise finalHit won't get populated
     this.dragging = new FeaturefulElementDragging(component.el)
     this.dragging.autoScroller.isEnabled = false
 
-    let hitDragging = this.hitDragging = new HitDragging(this.dragging, component)
+    let hitDragging = this.hitDragging = new HitDragging(this.dragging, interactionSettingsToStore(settings))
     hitDragging.emitter.on('pointerdown', this.handlePointerDown)
     hitDragging.emitter.on('dragend', this.handleDragEnd)
   }

src/core/interactions/DateSelecting.ts

@@ -7,27 +7,28 @@ import { PointerDragEvent } from '../interactions/pointer'
 import FeaturefulElementDragging from '../dnd/FeaturefulElementDragging'
 import { __assign } from 'tslib'
 import { dateSelectionJoinTransformer } from './date-selecting'
+import { Interaction, InteractionSettings, interactionSettingsToStore } from './interaction'
 
 /*
 Tracks when the user selects a portion of time of a component,
 constituted by a drag over date cells, with a possible delay at the beginning of the drag.
 */
-export default class DateSelecting {
+export default class DateSelecting extends Interaction {
 
-  component: DateComponent<any>
   dragging: FeaturefulElementDragging
   hitDragging: HitDragging
   dragSelection: DateSpan | null = null
 
-  constructor(component: DateComponent<any>) {
-    this.component = component
+  constructor(settings: InteractionSettings) {
+    super(settings)
+    let { component } = settings
 
     let dragging = this.dragging = new FeaturefulElementDragging(component.el)
     dragging.touchScrollAllowed = false
     dragging.minDistance = component.opt('selectMinDistance') || 0
     dragging.autoScroller.isEnabled = component.opt('dragScroll')
 
-    let hitDragging = this.hitDragging = new HitDragging(this.dragging, component)
+    let hitDragging = this.hitDragging = new HitDragging(this.dragging, interactionSettingsToStore(settings))
     hitDragging.emitter.on('pointerdown', this.handlePointerDown)
     hitDragging.emitter.on('dragstart', this.handleDragStart)
     hitDragging.emitter.on('hitupdate', this.handleHitUpdate)

src/core/interactions/EventClicking.ts

@@ -1,19 +1,17 @@
-import DateComponent from '../component/DateComponent'
 import { listenBySelector } from '../util/dom-event'
 import EventApi from '../api/EventApi'
 import { elementClosest } from '../util/dom-manip'
 import { getElSeg } from '../component/event-rendering'
+import { Interaction, InteractionSettings } from './interaction'
 
 /*
 Detects when the user clicks on an event within a DateComponent
 */
-export default class EventClicking {
+export default class EventClicking extends Interaction {
 
-  component: DateComponent<any>
-  destroy: () => void
-
-  constructor(component: DateComponent<any>) {
-    this.component = component
+  constructor(settings: InteractionSettings) {
+    super(settings)
+    let { component } = settings
 
     this.destroy = listenBySelector(
       component.el,

src/core/interactions/EventDragging.ts

@@ -3,7 +3,6 @@ import { PointerDragEvent } from '../interactions/pointer'
 import { Hit } from './hit'
 import HitDragging, { isHitsEqual } from './HitDragging'
 import { EventMutation, applyMutationToEventStore } from '../structs/event-mutation'
-import { componentHash } from '../common/browser-context'
 import { startOfDay } from '../datelib/marker'
 import { elementClosest } from '../util/dom-manip'
 import FeaturefulElementDragging from '../dnd/FeaturefulElementDragging'
@@ -17,12 +16,12 @@ import { __assign } from 'tslib'
 import { ExternalDropApi } from '../interactions-external/ExternalElementDragging'
 import View from '../View'
 import { eventDragMutationMassager } from './event-dragging'
+import { Interaction, InteractionSettings, interactionSettingsStore } from './interaction'
 
-export default class EventDragging { // TODO: rename to EventSelectingAndDragging
+export default class EventDragging extends Interaction { // TODO: rename to EventSelectingAndDragging
 
   static SELECTOR = '.fc-draggable, .fc-resizable' // TODO: test this in IE11
 
-  component: DateComponent<any>
   dragging: FeaturefulElementDragging
   hitDragging: HitDragging
 
@@ -35,16 +34,17 @@ export default class EventDragging { // TODO: rename to EventSelectingAndDraggin
   validMutation: EventMutation | null = null
   mutatedRelevantEvents: EventStore | null = null
 
-  constructor(component: DateComponent<any>) {
-    this.component = component
+  constructor(settings: InteractionSettings) {
+    super(settings)
+    let { component } = this
 
     let dragging = this.dragging = new FeaturefulElementDragging(component.el)
     dragging.pointer.selector = EventDragging.SELECTOR
     dragging.touchScrollAllowed = false
     dragging.autoScroller.isEnabled = component.opt('dragScroll')
 
-    let hitDragging = this.hitDragging = new HitDragging(this.dragging, componentHash)
-    hitDragging.useSubjectCenter = component.useEventCenter
+    let hitDragging = this.hitDragging = new HitDragging(this.dragging, interactionSettingsStore)
+    hitDragging.useSubjectCenter = settings.useEventCenter
     hitDragging.emitter.on('pointerdown', this.handlePointerDown)
     hitDragging.emitter.on('dragstart', this.handleDragStart)
     hitDragging.emitter.on('hitupdate', this.handleHitUpdate)

src/core/interactions/EventHovering.ts

@@ -1,20 +1,20 @@
-import DateComponent from '../component/DateComponent'
 import { listenToHoverBySelector } from '../util/dom-event'
 import EventApi from '../api/EventApi'
 import { getElSeg } from '../component/event-rendering'
+import { Interaction, InteractionSettings } from './interaction'
 
 /*
 Triggers events and adds/removes core classNames when the user's pointer
 enters/leaves event-elements of a component.
 */
-export default class EventHovering {
+export default class EventHovering extends Interaction {
 
-  component: DateComponent<any>
   removeHoverListeners: () => void
   currentSegEl: HTMLElement
 
-  constructor(component: DateComponent<any>) {
-    this.component = component
+  constructor(settings: InteractionSettings) {
+    super(settings)
+    let { component } = settings
 
     this.removeHoverListeners = listenToHoverBySelector(
       component.el,

src/core/interactions/EventResizing.ts

@@ -1,4 +1,4 @@
-import { default as DateComponent, Seg } from '../component/DateComponent'
+import { Seg } from '../component/DateComponent'
 import { Hit } from './hit'
 import HitDragging, { isHitsEqual } from './HitDragging'
 import { EventMutation, applyMutationToEventStore } from '../structs/event-mutation'
@@ -14,10 +14,10 @@ import { createDuration } from '../datelib/duration'
 import { EventInteractionState } from './event-interaction-state'
 import { __assign } from 'tslib'
 import { EventResizeJoinTransforms } from './event-resizing'
+import { Interaction, InteractionSettings, interactionSettingsToStore } from './interaction'
 
-export default class EventDragging {
+export default class EventDragging extends Interaction {
 
-  component: DateComponent<any>
   dragging: FeaturefulElementDragging
   hitDragging: HitDragging
 
@@ -28,15 +28,16 @@ export default class EventDragging {
   validMutation: EventMutation | null = null
   mutatedRelevantEvents: EventStore | null = null
 
-  constructor(component: DateComponent<any>) {
-    this.component = component
+  constructor(settings: InteractionSettings) {
+    super(settings)
+    let { component } = settings
 
     let dragging = this.dragging = new FeaturefulElementDragging(component.el)
     dragging.pointer.selector = '.fc-resizer'
     dragging.touchScrollAllowed = false
     dragging.autoScroller.isEnabled = component.opt('dragScroll')
 
-    let hitDragging = this.hitDragging = new HitDragging(this.dragging, component)
+    let hitDragging = this.hitDragging = new HitDragging(this.dragging, interactionSettingsToStore(settings))
     hitDragging.emitter.on('pointerdown', this.handlePointerDown)
     hitDragging.emitter.on('dragstart', this.handleDragStart)
     hitDragging.emitter.on('hitupdate', this.handleHitUpdate)