checkpoint before re-code event system for personal schedule to be cleaner and work better

This commit is contained in:
2021-10-04 16:37:46 +00:00
parent 0f38e1d2fa
commit 87f8dabf4a
2 changed files with 20 additions and 3 deletions

View File

@@ -26,7 +26,17 @@
Issues in svc-schedule
day or category view once moreinfo then subsequent drags or extend causes moreinfo again, something isn't being cleared out on moreinfo I think
click event and drag stepping on each other
potential solution:
dont' use event click at all, use enddrag extend which fires on mouse up of event
this can check and then do moreinfo as it's already handling dragging
see if it detects non vs drag and do accordingly?
Start drag and end drag should handle it all
on start capture time or mouse coords
on stop check if too little time or too short distance occured to be a drag and process as showmore else it's a drag
should there be a day view at all in svc sched?

View File

@@ -67,7 +67,6 @@
:locale="languageName"
:event-more-text="$ay.t('More')"
:first-time="formUserOptions.firstTime"
@click:event="showMoreInfo"
@click:more="viewDay"
@click:date="viewDay"
@change="fetchEvents"
@@ -79,6 +78,7 @@
@mouseup:time="endDragExtend"
@mouseleave.native="cancelDrag"
>
<!-- @click:event="showMoreInfo" -->
<template v-slot:event="{ event, timed, eventSummary }">
<div class="v-event-draggable">
<v-icon small :color="event.textColor" class="mr-1">{{
@@ -403,7 +403,7 @@
</template>
<script>
const FORM_KEY = "home-schedule";
const CLICK_DETECT_TIMEOUT = 200; //100 is a bit too fast to recognize a click
const CLICK_DETECT_TIMEOUT = 100; //100 is a bit too fast to recognize a click
export default {
async created() {
const vm = this;
@@ -529,6 +529,7 @@ export default {
}
},
async endDragExtend() {
console.log("endDragExtend fired");
//On drag then dragged is set to true and dragEvent and dragTime are set
//on extend then dragged is set to true extendEvent (actual event), extendOriginal and createStart are set, dragEvent is null
//on create then dragged is set to false and createStart is only value set, dragEvent is null and extendEvent is null
@@ -607,13 +608,16 @@ export default {
},
startDrag({ event }) {
//# mouse down on an event triggers this call
console.log("StartDrag, event:", JSON.stringify(event));
if (event) {
if (event.editable) {
//My work around to disambiguate dragging and clicking
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.dragEvent = event;
@@ -773,10 +777,12 @@ export default {
});
},
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) {
@@ -809,6 +815,7 @@ export default {
} else {
open();
}
console.log("show more info stopping propagation");
nativeEvent.stopPropagation();
},
async fetchEvents({ start, end }) {