diff --git a/Assets/StreamingAssets/ScrollView_Server/build/Drop_facts.js b/Assets/StreamingAssets/ScrollView_Server/build/Drop_facts.js
index 06e13dbf50a7ef63292a5c9d023b2309974d4e81..91cdd624860f44abac90a7b29adc11df96f2379b 100644
--- a/Assets/StreamingAssets/ScrollView_Server/build/Drop_facts.js
+++ b/Assets/StreamingAssets/ScrollView_Server/build/Drop_facts.js
@@ -1,45 +1,20 @@
"use strict";
-/**
- * @typedef point
- * @type {object}
- * @property {number} x
- * @property {number} y
- * @property {number} z
- */
-/**
- * @typedef {Object} fact
- * @property {string} id Fact id
- * @property {string} s_type Fact type
- * @property {string} label used in unity
- * @property {string | null} _CustomLabel Custom label
- * @property {boolean} hasCustomLabel
- * @property {number} labelId
- */
-/**
- * @property {Point} point
- * @property {Point} normal
- * @property {string} s_type
- * @property {string} label
- * @property {string|null} _CustomLabel
- * @property {boolean} hasCustomLabel
- * @property {number} labelId
- */
-var assignment;
-/** @param {DragEvent} event */
function dropHandler(event) {
// ignore
- if (event.dataTransfer === null
- || event.target === null
- || !(event.target instanceof HTMLElement)) {
+ console.log("dropHandler", event);
+ if (event.originalEvent === undefined
+ || event.originalEvent.dataTransfer === null
+ || event.target === undefined
+ || !(event.target instanceof HTMLElement
+ || event.target instanceof MathMLElement)) {
console.log("Ignored illegal DragEvent");
return;
}
event.preventDefault();
- console.log("dropHandler", event);
- const data = event.dataTransfer.getData("application/json");
+ const data = event.originalEvent.dataTransfer;
//const data = event.dataTransfer.getData("text/plain")
- console.log(`Dropped data: '${event.dataTransfer.types}'`, event.dataTransfer.types);
- const fact = JSON.parse(data);
+ console.log(`Dropped data: '${data.types}'`, data.types);
+ const fact = JSON.parse(data.getData("application/json"));
console.warn(`Dropped Fact '${fact.label}':`, fact);
const target = event.target;
if (target.dataset.allowedTypes !== undefined) {
@@ -65,26 +40,25 @@ function dropHandler(event) {
}
/** @param {MouseEvent} event */
function clickHandler(event) {
- // ignore
- if (event.target == null
- || !(event.target instanceof HTMLElement)) {
- console.warn("Ignored illegal DragEvent");
+ // ignore. Cannot happen if the event is triggered normally
+ console.log("clickHandler", event);
+ if (!(event.target instanceof HTMLElement
+ || event.target instanceof MathMLElement)) {
+ console.warn("Ignored illegal ClickEvent");
return;
}
event.preventDefault();
- console.log("clickHandler");
- console.log("clickHandler", event);
const target = event.target;
- switch (event.button) {
- case 0:
+ switch (event.which) {
+ case 1:
console.log("Left button clicked");
target.dataset.factId = undefined;
target.dispatchEvent(new Event("factUnassigned"));
break;
- case 1:
+ case 2:
console.log("Middle button clicked");
break;
- case 2:
+ case 3:
console.log("Right button clicked");
if (target.dataset.slotId) {
getHint(target.dataset.slotId);
@@ -94,33 +68,30 @@ function clickHandler(event) {
console.log("Unknown button clicked");
}
}
+/** register the drag event listener. Otherwise drop events don't work */
+document.addEventListener("dragover", ev => ev.preventDefault());
+/** select all dropzones and add drop event listeners */
+function addDropZoneEventListeners() {
+ console.log("addDropZoneEventListeners");
+ $('[dropzone="copy"]')
+ .on({
+ drop: dropHandler,
+ mousedown: clickHandler,
+ contextmenu: event => event.preventDefault()
+ });
+}
+//#region Commented out Archive
/*
* register the drag event listeners
*/
//document.addEventListener("dragstart", ev => printHandler(ev, "DragStartEvent"))
//document.addEventListener("dragenter", ev => printHandler(ev, "DragEnterEvent"))
//document.addEventListener("drag", ev => printHandler(ev, "DragEvent"))
-document.addEventListener("dragover", ev => ev.preventDefault());
+//document.addEventListener("dragover", ev => ev.preventDefault())
//document.addEventListener("dragover", ev => printPreventDefaultHandler(ev, "DragOverEvent"))
//document.addEventListener("dragleave", ev => printHandler(ev, "DragLeaveEvent"))
//document.addEventListener("dragend", ev => printHandler(ev, "DragEndEvent"))
// select all dropzones and add drop event listeners
//let dropZones = document.querySelectorAll('[dropzone="copy"]')
//dropZones.forEach( dropZone => dropZone.addEventListener("drop", ev => dropHandler(ev, "DropEvent")) )
-/** select all dropzones and add drop event listeners */
-function addDropZoneEventListeners() {
- console.log("addDropZoneEventListeners");
- document.querySelectorAll('[dropzone="copy"]')
- .forEach(dropZone => {
- if (dropZone instanceof HTMLElement) {
- dropZone.removeEventListener("drop", dropHandler);
- dropZone.removeEventListener("click", clickHandler);
- dropZone.removeEventListener("contextmenu", clickHandler);
- //dropZone.addEventListener("dragover", ev => ev.preventDefault())
- dropZone.addEventListener("drop", dropHandler);
- dropZone.addEventListener("click", clickHandler);
- dropZone.addEventListener("contextmenu", clickHandler);
- }
- });
-}
-//addDropZoneEventListeners()
+//#endregion Commented out Archive
diff --git a/Assets/StreamingAssets/ScrollView_Server/src/Drop_facts.ts b/Assets/StreamingAssets/ScrollView_Server/src/Drop_facts.ts
index d39fc608e92824bdf3022569d3e52b4398cc4176..10683fcf9419b9de48ddb6189c2511f99e2a59cf 100644
--- a/Assets/StreamingAssets/ScrollView_Server/src/Drop_facts.ts
+++ b/Assets/StreamingAssets/ScrollView_Server/src/Drop_facts.ts
@@ -1,21 +1,27 @@
+function dropHandler(event: JQuery.DropEvent) {
// ignore
- if (event.dataTransfer === null
- || event.target === null
- || !(event.target instanceof HTMLElement)) {
+ console.log("dropHandler", event)
+ if (event.originalEvent === undefined
+ || event.originalEvent.dataTransfer === null
+ || event.target === undefined
+ || !(event.target instanceof HTMLElement
+ || event.target instanceof MathMLElement)
+ ) {
console.log("Ignored illegal DragEvent")
return
}
+
event.preventDefault()
- console.log("dropHandler", event)
+ const data = event.originalEvent.dataTransfer
- const data = event.dataTransfer.getData("application/json")
+
//const data = event.dataTransfer.getData("text/plain")
- console.log(`Dropped data: '${event.dataTransfer.types}'`, event.dataTransfer.types)
+ console.log(`Dropped data: '${data.types}'`, data.types)
- const fact: Fact = JSON.parse(data)
+ const fact: Fact = JSON.parse(data.getData("application/json"))
console.warn(`Dropped Fact '${fact.label}':`, fact)
- const target: HTMLElement = event.target
+ const target = event.target
if (target.dataset.allowedTypes !== undefined) {
//const allowedTypesStr = element.dataset["allowed-types"]
@@ -44,27 +50,27 @@
}
/** @param {MouseEvent} event */
-function clickHandler(event: MouseEvent) {
- // ignore
- if (event.target == null
- || !(event.target instanceof HTMLElement)) {
- console.warn("Ignored illegal DragEvent")
+function clickHandler(event: JQuery.MouseDownEvent) {
+ // ignore. Cannot happen if the event is triggered normally
+ console.debug("clickHandler", event)
+ if (!(event.target instanceof HTMLElement
+ || event.target instanceof MathMLElement)
+ ) {
+ console.warn("Ignored illegal ClickEvent")
return
}
event.preventDefault()
- console.log("clickHandler")
- console.log("clickHandler", event)
- const target: HTMLElement = event.target
- switch (event.button) {
- case 0:
+ const target: MathMLElement = event.target
+ switch (event.which) {
+ case 1:
console.log("Left button clicked")
target.dataset.factId = undefined
target.dispatchEvent(new Event("factUnassigned"))
break
- case 1:
+ case 2:
console.log("Middle button clicked")
break
- case 2:
+ case 3:
console.log("Right button clicked")
if (target.dataset.slotId) {
getHint(target.dataset.slotId)
@@ -75,13 +81,30 @@ function clickHandler(event: MouseEvent) {
}
}
+/** register the drag event listener. Otherwise drop events don't work */
+document.addEventListener("dragover", ev => ev.preventDefault())
+
+/** select all dropzones and add drop event listeners */
+function addDropZoneEventListeners() {
+ console.log("addDropZoneEventListeners")
+ $('[dropzone="copy"]')
+ .on({
+ drop: dropHandler,
+ mousedown: clickHandler,
+ contextmenu: event => event.preventDefault()
+ })
+}
+
+declare function getHint(slotId: string): void;
+
+//#region Commented out Archive
/*
* register the drag event listeners
*/
//document.addEventListener("dragstart", ev => printHandler(ev, "DragStartEvent"))
//document.addEventListener("dragenter", ev => printHandler(ev, "DragEnterEvent"))
//document.addEventListener("drag", ev => printHandler(ev, "DragEvent"))
-document.addEventListener("dragover", ev => ev.preventDefault())
+//document.addEventListener("dragover", ev => ev.preventDefault())
//document.addEventListener("dragover", ev => printPreventDefaultHandler(ev, "DragOverEvent"))
//document.addEventListener("dragleave", ev => printHandler(ev, "DragLeaveEvent"))
//document.addEventListener("dragend", ev => printHandler(ev, "DragEndEvent"))
@@ -89,24 +112,4 @@ document.addEventListener("dragover", ev => ev.preventDefault())
// select all dropzones and add drop event listeners
//let dropZones = document.querySelectorAll('[dropzone="copy"]')
//dropZones.forEach( dropZone => dropZone.addEventListener("drop", ev => dropHandler(ev, "DropEvent")) )
-
-/** select all dropzones and add drop event listeners */
-function addDropZoneEventListeners() {
- console.log("addDropZoneEventListeners")
- document.querySelectorAll('[dropzone="copy"]')
- .forEach(dropZone => {
- if (dropZone instanceof HTMLElement) {
- dropZone.removeEventListener("drop", dropHandler)
- dropZone.removeEventListener("click", clickHandler)
- dropZone.removeEventListener("contextmenu", clickHandler)
- //dropZone.addEventListener("dragover", ev => ev.preventDefault())
- dropZone.addEventListener("drop", dropHandler)
- dropZone.addEventListener("click", clickHandler)
- dropZone.addEventListener("contextmenu", clickHandler)
- }
- })
-}
-
-declare function getHint(slotId: string): void;
-//addDropZoneEventListeners()
//#endregion Commented out Archive
diff --git a/Assets/StreamingAssets/ScrollView_Server/src/SetScrollContent.ts b/Assets/StreamingAssets/ScrollView_Server/src/SetScrollContent.ts
index 50ceb10314f8407b383481c0da52b1ccbf175628..10e09f9ded9f421697b4a183cb047dc0ecb84eca 100644
--- a/Assets/StreamingAssets/ScrollView_Server/src/SetScrollContent.ts
+++ b/Assets/StreamingAssets/ScrollView_Server/src/SetScrollContent.ts
@@ -52,7 +52,9 @@ function RenderScroll() {
.html(fact.label)
.attr("data-allowed-types", fact.type)
})
+
console.log('Scroll rendered', scroll.label.textContent)
+ addDropZoneEventListeners()
}