mirrors/TiddlyWiki5
1
0
Fork 0
mirror of https://github.com/Jermolene/TiddlyWiki5 synced 2025-04-06 10:46:57 +00:00
Code Issues Releases Wiki Activity

feat(eventcatcher): provide access to event properties as JSON

Browse Source
This commit is contained in:
saqimtiaz 2025-01-30 13:03:58 +01:00
parent f7043f6d43
commit a8a8867506
2 changed files with 107 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

80
core/modules/utils/dom/dom.js
View File

@ -311,6 +311,48 @@ exports.getLocationPath = function() {
return window.location.toString().split("#")[0];
};
exports.copyEventProperties = function(event) {
var seen = new Set();
function isDOMElement(value) {
return value instanceof Node || value instanceof Window;
}
function safeCopy(obj) {
//skip ciruclar references
if(seen.has(obj)) {
return "[Circular reference]";
}
//skip functions
if(typeof obj !== "object" || obj === null) {
return obj;
}
//skip DOM elements
if(isDOMElement(obj)) {
return "[DOM Element]";
}
//copy each element of the array
if(Array.isArray(obj)) {
return obj.map(safeCopy);
}
seen.add(obj);
var copy = {}, key;
for(key in obj) {
try{
copy[key] = safeCopy(obj[key]);
} catch(e) {
copy[key] = "[Unserializable]";
}
}
return copy;
}
var result = safeCopy(event);
seen.clear();
return result;
};
/*
Collect DOM variables
*/
@ -352,25 +394,29 @@ exports.collectDOMVariables = function(selectedNode,domNode,event) {
variables["tv-widgetnode-width"] = domNode.offsetWidth.toString();
variables["tv-widgetnode-height"] = domNode.offsetHeight.toString();
}
if(event) {
var eventProperties = $tw.utils.copyEventProperties(event);
variables["event-properties"] = JSON.stringify(eventProperties,null,2);
if(event && ("clientX" in event) && ("clientY" in event)) {
if(selectedNode) {
// Add variables for event X and Y position relative to selected node
selectedNodeRect = selectedNode.getBoundingClientRect();
variables["event-fromselected-posx"] = (event.clientX - selectedNodeRect.left).toString();
variables["event-fromselected-posy"] = (event.clientY - selectedNodeRect.top).toString();
}
if(domNode) {
// Add variables for event X and Y position relative to event catcher node
domNodeRect = domNode.getBoundingClientRect();
variables["event-fromcatcher-posx"] = (event.clientX - domNodeRect.left).toString();
variables["event-fromcatcher-posy"] = (event.clientY - domNodeRect.top).toString();
}
if(("clientX" in event) && ("clientY" in event)) {
if(selectedNode) {
// Add variables for event X and Y position relative to selected node
selectedNodeRect = selectedNode.getBoundingClientRect();
variables["event-fromselected-posx"] = (event.clientX - selectedNodeRect.left).toString();
variables["event-fromselected-posy"] = (event.clientY - selectedNodeRect.top).toString();
}
// Add variables for event X and Y position relative to the viewport
variables["event-fromviewport-posx"] = event.clientX.toString();
variables["event-fromviewport-posy"] = event.clientY.toString();
if(domNode) {
// Add variables for event X and Y position relative to event catcher node
domNodeRect = domNode.getBoundingClientRect();
variables["event-fromcatcher-posx"] = (event.clientX - domNodeRect.left).toString();
variables["event-fromcatcher-posy"] = (event.clientY - domNodeRect.top).toString();
}
// Add variables for event X and Y position relative to the viewport
variables["event-fromviewport-posx"] = event.clientX.toString();
variables["event-fromviewport-posy"] = event.clientY.toString();
}
}
return variables;
};

50
core/modules/widgets/eventcatcher.js
View File

@ -23,6 +23,49 @@ Inherit from the base widget class
*/
EventWidget.prototype = new Widget();
function getEventPropertiesJSON(event) {
var seen = new Set();
function isDOMElement(value) {
return value instanceof Node || value instanceof Window;
}
function safeCopy(obj) {
//skip ciruclar references
if(seen.has(obj)) {
return "[Circular reference]";
}
//skip functions
if(typeof obj !== "object" || obj === null) {
return obj;
}
//skip DOM elements
if(isDOMElement(obj)) {
return "[DOM Element]";
}
//copy each element of the array
if(Array.isArray(obj)) {
return obj.map(safeCopy);
}
seen.add(obj);
var copy = {}, key;
for(key in obj) {
try{
copy[key] = safeCopy(obj[key]);
} catch(e) {
copy[key] = "[Unserializable]";
}
}
return copy;
}
var result = safeCopy(event);
seen.clear();
return result;
};
/*
Render this widget into the DOM
*/
@ -50,8 +93,6 @@ EventWidget.prototype.render = function(parent,nextSibling) {
actions = self.getAttribute("$"+type) || self.getAttribute("actions-"+type),
stopPropagation = self.getAttribute("stopPropagation","onaction"),
selectedNode = event.target,
selectedNodeRect,
catcherNodeRect,
variables = {};
// Firefox can fire dragover and dragenter events on text nodes instead of their parents
if(selectedNode.nodeType === 3) {
@ -70,13 +111,10 @@ EventWidget.prototype.render = function(parent,nextSibling) {
if(selectedNode === domNode) {
return false;
}
// Only set up variables if we have actions to invoke
if(actions) {
variables = $tw.utils.collectDOMVariables(selectedNode,self.domNode,event);
}
}
// Execute our actions with the variables
if(actions) {
variables = $tw.utils.collectDOMVariables(selectedNode,self.domNode,event);
// Add a variable for the modifier key
variables.modifier = $tw.keyboardManager.getEventModifierKeyDescriptor(event);
// Add a variable for the mouse button