From 3984082b2b1a6c57255783c40482ad1e77a6d8a0 Mon Sep 17 00:00:00 2001
From: John Cardinal <support@ayanova.com>
Date: Mon, 4 Oct 2021 20:58:43 +0000
Subject: [PATCH] Partial revert back to original schedule after finding out
 what the issues really were, faster this way

---
 ayanova/devdocs/todo.txt            |   6 +
 ayanova/src/views/home-schedule.vue | 288 +++++++++-------------------
 2 files changed, 92 insertions(+), 202 deletions(-)

diff --git a/ayanova/devdocs/todo.txt b/ayanova/devdocs/todo.txt
index e0b9b69d..2c71c9c1 100644
--- a/ayanova/devdocs/todo.txt
+++ b/ayanova/devdocs/todo.txt
@@ -38,6 +38,12 @@
 					on event mousedown capture time or mouse coords
 					on event mouseup check if too little time or too short distance occured to be a drag and process as showmore else it's a drag
 					On mouse up or down outside event then it's a new event
+			Attempt is not saving anything, but does point to solution so modify prior code 
+				don't use event click, use the mouseup event instead
+				dont' use the timer, port the isitaclick stuff instead
+				Use dialog for moreinfo
+
+
 
 
 		should there be a day view at all in svc sched?
diff --git a/ayanova/src/views/home-schedule.vue b/ayanova/src/views/home-schedule.vue
index d7e35724..9d41adcd 100644
--- a/ayanova/src/views/home-schedule.vue
+++ b/ayanova/src/views/home-schedule.vue
@@ -70,21 +70,14 @@
         @click:more="viewDay"
         @click:date="viewDay"
         @change="fetchEvents"
-        @mousedown:event="onMouseDownEvent"
-        @mousedown:time="onMouseDownTime"
-        @mouseup:day="onMouseUpDay"
-        @mouseup:time="onMouseUpTime"
-        @mouseleave.native="onMouseLeave"
-        @mousemove:time="onMouseMoveTime"
-        @mousemove:day="onMouseMoveDay"
+        @mousedown:event="startDrag"
+        @mousedown:time="startTime"
+        @mousemove:time="mouseMoveDayView"
+        @mousemove:day="mouseMoveMonthView"
+        @mouseup:day="endDragExtend"
+        @mouseup:time="endDragExtend"
+        @mouseleave.native="cancelDrag"
       >
-        <!-- 
-          todo: for svc-schedule also mouseup:time-category mouseup:day-category (which is a bit odd needs investigation)
-          @click:event="showMoreInfo" 
-        
-         
-       
-        -->
         <template v-slot:event="{ event, timed, eventSummary }">
           <div class="v-event-draggable">
             <v-icon small :color="event.textColor" class="mr-1">{{
@@ -145,7 +138,7 @@
       <template>
         <v-row justify="center">
           <v-dialog max-width="600px" v-model="moreInfoDialog">
-            <v-card color="grey lighten-4" flat>
+            <v-card color="grey lighten-4" min-width="350px" flat>
               <v-toolbar>
                 <v-btn icon @click="openScheduledItem()">
                   <v-icon color="primary">{{ iconForSelectedEvent() }}</v-icon>
@@ -470,142 +463,10 @@ export default {
       hour12: window.$gz.locale.getHour12(),
       formUserOptions: {},
       tempFirstTime: null,
-      //new refactor event stuff
-      activeMouseDownEvent: null,
-      activeMouseDownNewEvent: null,
       lastMouseDownMS: null
     };
   },
   methods: {
-    onMouseDownEvent(o) {
-      if (!this.activeMouseDownEvent) {
-        //capture time to see if it's a click or a drag/extend
-        this.lastMouseDownMS = new Date().getTime();
-        this.activeMouseDownEvent = o;
-        //this is so the popup dialog is centered around the event clicked on
-        this.selectedElement = o.nativeEvent.target;
-        //console.log("onMouseDownEvent o", o);
-      }
-    },
-    onMouseDownTime(o) {
-      //NOTE: Mouse down DAY is *NOT* supported, new events only in time / day view
-
-      //check if there is an active event, if there is then this has fired after mouse down event and we don't want to mess with it
-      //if there is no active event then this is fired on it's own and user is trying to make a new event
-      if (!this.activeMouseDownEvent) {
-        //capture x,y..actually I don't 5really need to here I think, this is for new events
-        //and they go by actual times and shit so...
-        this.activeMouseDownNewEvent = o;
-        console.log("onMouseDownTime", o);
-      }
-    },
-    async onMouseUpDay(o) {
-      // console.log(
-      //   "onMouseUpDay handling active event:",
-      //   JSON.stringify({ o: o, activeEvent: this.activeMouseDownEvent })
-      // );
-      //this event contains the day month but no time that I need to modify the event to another day
-      if (this.activeMouseDownEvent) {
-        if (this.itWasAClickNotADrag()) {
-          //console.log("onMouseUpDay STUB: SHOW MORE INFO");
-          await this.showMoreInfo(this.activeMouseDownEvent.event);
-        } else {
-          console.log("onMouseUpDay STUB: HANDLE DRAG");
-        }
-      }
-      this.activeMouseDownEvent = null;
-    },
-    async onMouseUpTime(o) {
-      //we could be here due to three reasons
-      //1. end drag existing event
-      //2. end drag new event
-      //3. click to open more info on existing event
-
-      //Existing event handler either more info or modify
-      if (this.activeMouseDownEvent) {
-        if (this.itWasAClickNotADrag()) {
-          // console.log(
-          //   "onMouseUpTime STUB: SHOW EVENT MORE INFO",
-          //   this.activeMouseDownEvent
-          // );
-
-          await this.showMoreInfo(this.activeMouseDownEvent.event);
-        } else {
-          console.log("onMouseUpTime STUB: HANDLE EXISTING EVENT DRAG");
-        }
-        //console.log("onMouseUpTime handling active event:", o);
-        this.activeMouseDownEvent = null;
-        return;
-      }
-      //New event handler
-      if (this.activeMouseDownNewEvent) {
-        console.log("onMouseUpTime STUB: HANDLE NEW EVENT CREATE");
-      }
-    },
-    onMouseLeave(o) {
-      //The user dragged or moved off the control so nothing should be actively happening with events
-      // if (this.activeMouseDownEvent) {
-      //   // console.log("onMouseLeave", JSON.stringify(o));
-      //   console.log(
-      //     "onMouseLeave handling active event:",
-      //     JSON.stringify(this.activeMouseDownEvent)
-      //   );
-      // }
-      this.activeMouseDownEvent = null;
-      this.activeMouseDownNewEvent = null;
-      this.lastMouseDownMS = null;
-    },
-    onMouseMoveTime(o) {
-      //this event is only relevant to painting during drag/extend
-      // if (this.activeMouseDownEvent) {
-      //   console.log("onMouseMoveTime", JSON.stringify(o));
-      // }
-    },
-    onMouseMoveDay(o) {
-      //this event is only relevant to painting during drag extend
-      // if (this.activeMouseDownEvent) {
-      //   console.log("onMouseMoveDay", JSON.stringify(o));
-      // }
-    },
-    itWasAClickNotADrag() {
-      if (this.lastMouseDownMS == null) {
-        //return;
-        throw new Error("lastMouseMS is null!");
-      }
-      const elapsed = new Date().getTime() - this.lastMouseDownMS;
-      this.lastMouseDownMS = null;
-      // console.log("itWasAClickNotADrag elapsed:", elapsed);
-      return elapsed < 200;
-    },
-    async showMoreInfo(ayevent) {
-      this.selectedEvent = ayevent;
-      let route = null;
-      this.evInfo = {};
-      switch (ayevent.type) {
-        case window.$gz.type.WorkOrderItemScheduledUser:
-          route = `workorder/items/scheduled-users/sched-info/${ayevent.id}`;
-          break;
-        case window.$gz.type.Reminder:
-          route = `reminder/sched-info/${ayevent.id}`;
-          break;
-        case window.$gz.type.Review:
-          route = `review/sched-info/${ayevent.id}`;
-          break;
-      }
-      if (route) {
-        const res = await window.$gz.api.get(route);
-        if (!res.error) {
-          this.evInfo = res.data;
-          this.moreInfoDialog = true;
-        } else {
-          this.formState.serverError = res.error;
-          window.$gz.form.setErrorBoxErrors(this);
-        }
-      }
-    },
-    ////////////////////////////////////////////////////////////////////////////////
-    ////////////////////////////////////////////////////////////////////////////////
-    ////////////////////////////////////////////////////////////////////////////////
     openObject: function(type, id) {
       window.$gz.eventBus.$emit("openobject", {
         type: type,
@@ -665,12 +526,13 @@ export default {
     extendBottom(event) {
       if (event.editable) {
         //My work around to disambiguate extending and clicking
-        clearTimeout(this.dragTimeout);
-        this.dragged = false;
-        this.dragTimeout = setTimeout(() => {
-          this.dragged = true;
-        }, CLICK_DETECT_TIMEOUT); // Min delay to be regarded as extend instead of click, also affects click time to display more info, too short needs faster click
-
+        // clearTimeout(this.dragTimeout);
+        // this.dragged = false;
+        // this.dragTimeout = setTimeout(() => {
+        //   this.dragged = true;
+        // }, CLICK_DETECT_TIMEOUT); // Min delay to be regarded as extend instead of click, also affects click time to display more info, too short needs faster click
+        //capture time to see if it's a click or a drag/extend
+        this.lastMouseDownMS = new Date().getTime();
         this.extendEvent = event;
         this.createStart = event.start;
         this.extendOriginal = event.end;
@@ -687,11 +549,17 @@ export default {
         //NEW, prompt for deets and create or if cancelled then just remove this faux event from events list (it will be the last one in the array)
         this.newItemDialog = true;
       } else {
-        if (!this.dragged) {
-          //we're here due to mouse up but it's not a drag or an extend so it's a More Info mouse up click so bail out now
+        // if (!this.dragged) {
+        //   //we're here due to mouse up but it's not a drag or an extend so it's a More Info mouse up click so bail out now
+        //   this.dragEvent = null; //this needs to be set or it will keep dragging off an editable event even as the moreinfo dialog show
+        //   return;
+        // }
+        if (this.itWasAClickNotADrag()) {
+          await this.showMoreInfo(this.dragEvent);
           this.dragEvent = null; //this needs to be set or it will keep dragging off an editable event even as the moreinfo dialog show
           return;
         }
+
         //MODIFY existing event, drag or extend
         if (this.dragEvent || this.extendEvent) {
           const param = { type: null, id: null, start: null, end: null };
@@ -753,20 +621,22 @@ export default {
       this.createStart = null;
       this.dragTime = null;
       this.dragEvent = null;
+      this.lastMouseDownMS = null;
     },
     startDrag({ event }) {
       //# mouse down on an event triggers this call
       console.log("StartDrag, event:", JSON.stringify(event));
       if (event) {
         if (event.editable) {
+          this.lastMouseDownMS = new Date().getTime();
           //My work around to disambiguate dragging and clicking
-          clearTimeout(this.dragTimeout);
+          //clearTimeout(this.dragTimeout);
           console.log("startDrag in editable set dragged false");
           this.dragged = false;
-          this.dragTimeout = setTimeout(() => {
-            this.dragged = true;
-            console.log("startDrag event timer fired, dragged set to true");
-          }, CLICK_DETECT_TIMEOUT); // Min delay to be regarded as extend instead of click, also affects click time to display more info, too short needs faster click
+          // this.dragTimeout = setTimeout(() => {
+          //   this.dragged = true;
+          //   console.log("startDrag event timer fired, dragged set to true");
+          // }, CLICK_DETECT_TIMEOUT); // Min delay to be regarded as extend instead of click, also affects click time to display more info, too short needs faster click
 
           this.dragEvent = event;
           this.dragTime = null;
@@ -779,6 +649,16 @@ export default {
         }
       }
     },
+    itWasAClickNotADrag() {
+      if (this.lastMouseDownMS == null) {
+        //return;
+        throw new Error("lastMouseMS is null!");
+      }
+      const elapsed = new Date().getTime() - this.lastMouseDownMS;
+      this.lastMouseDownMS = null;
+      // console.log("itWasAClickNotADrag elapsed:", elapsed);
+      return elapsed < 200;
+    },
     mouseMoveDayView(tms) {
       //no event being dragged or exgtended?
       if (!this.dragEvent && !this.extendEvent) {
@@ -924,48 +804,52 @@ export default {
         id: this.selectedEvent.id
       });
     },
-    // async showMoreInfo({ nativeEvent, event }) {
-    //   console.log("showMoreInfo click event fired");
-    //   //workaround to disambiguate drag click from view more info click
-    //   if (this.dragged) {
-    //     return;
-    //   }
-    //   console.log("showMoreINfo not dragged, popping up");
-    //   let route = null;
-    //   this.evInfo = {};
-    //   switch (event.type) {
-    //     case window.$gz.type.WorkOrderItemScheduledUser:
-    //       route = `workorder/items/scheduled-users/sched-info/${event.id}`;
-    //       break;
-    //     case window.$gz.type.Reminder:
-    //       route = `reminder/sched-info/${event.id}`;
-    //       break;
-    //     case window.$gz.type.Review:
-    //       route = `review/sched-info/${event.id}`;
-    //       break;
-    //   }
-    //   if (route) {
-    //     const res = await window.$gz.api.get(route);
-    //     if (!res.error) {
-    //       this.evInfo = res.data;
-    //     }
-    //   }
-    //   const open = () => {
-    //     this.selectedEvent = event;
-    //     this.selectedElement = nativeEvent.target;
-    //     requestAnimationFrame(() =>
-    //       requestAnimationFrame(() => (this.moreInfoDialog = true))
-    //     );
-    //   };
-    //   if (this.moreInfoDialog) {
-    //     this.moreInfoDialog = false;
-    //     requestAnimationFrame(() => requestAnimationFrame(() => open()));
-    //   } else {
-    //     open();
-    //   }
-    //   console.log("show more info stopping propagation");
-    //   nativeEvent.stopPropagation();
-    // },
+    async showMoreInfo(event) {
+      console.log("showMoreInfo click event fired");
+      //workaround to disambiguate drag click from view more info click
+      if (this.dragged) {
+        return;
+      }
+      console.log("showMoreINfo not dragged, popping up");
+      let route = null;
+      this.evInfo = {};
+      switch (event.type) {
+        case window.$gz.type.WorkOrderItemScheduledUser:
+          route = `workorder/items/scheduled-users/sched-info/${event.id}`;
+          break;
+        case window.$gz.type.Reminder:
+          route = `reminder/sched-info/${event.id}`;
+          break;
+        case window.$gz.type.Review:
+          route = `review/sched-info/${event.id}`;
+          break;
+      }
+      if (route) {
+        const res = await window.$gz.api.get(route);
+        if (!res.error) {
+          this.evInfo = res.data;
+          this.moreInfoDialog = true;
+        } else {
+          this.formState.serverError = res.error;
+          window.$gz.form.setErrorBoxErrors(this);
+        }
+      }
+      // const open = () => {
+      //   this.selectedEvent = event;
+      //   this.selectedElement = nativeEvent.target;
+      //   requestAnimationFrame(() =>
+      //     requestAnimationFrame(() => (this.moreInfoDialog = true))
+      //   );
+      // };
+      // if (this.moreInfoDialog) {
+      //   this.moreInfoDialog = false;
+      //   requestAnimationFrame(() => requestAnimationFrame(() => open()));
+      // } else {
+      //   open();
+      // }
+      // console.log("show more info stopping propagation");
+      // nativeEvent.stopPropagation();
+    },
     async fetchEvents({ start, end }) {
       try {
         window.$gz.form.deleteAllErrorBoxErrors(this);