mirror of
https://github.com/Jermolene/TiddlyWiki5
synced 2024-09-28 15:08:46 +00:00
New popup cancelling mechanism
This commit is contained in:
parent
08d7a12d04
commit
5103f1585b
@ -30,34 +30,34 @@ exports.dispatchMessage = function(event) {
|
|||||||
};
|
};
|
||||||
|
|
||||||
exports.triggerPopup = function(event,cancel) {
|
exports.triggerPopup = function(event,cancel) {
|
||||||
// Get the title of the popup state tiddler
|
// Get the textref of the popup state tiddler
|
||||||
var title = this.params.popup;
|
var textRef = this.params.popup;
|
||||||
if(this.hasParameter("qualifyTiddlerTitles") && this.params.qualifyTiddlerTitles === "yes") {
|
if(this.hasParameter("qualifyTiddlerTitles") && this.params.qualifyTiddlerTitles === "yes") {
|
||||||
title = "(" + this.parents.join(",") + "," + this.tiddlerTitle + ")" + title;
|
textRef = "(" + this.parents.join(",") + "," + this.tiddlerTitle + ")" + textRef;
|
||||||
}
|
}
|
||||||
// Get the popup state tiddler and the the text value
|
|
||||||
var tiddler = this.wiki.getTiddler(title),
|
|
||||||
value = tiddler ? tiddler.fields.text : "";
|
|
||||||
// Check for cancelling
|
// Check for cancelling
|
||||||
if(cancel) {
|
if(cancel) {
|
||||||
value = "";
|
this.wiki.deleteTextReference(textRef,this.tiddlerTitle);
|
||||||
} else {
|
} else {
|
||||||
|
// Get the current popup state tiddler
|
||||||
|
var value = this.wiki.getTextReference(textRef,"",this.tiddlerTitle);
|
||||||
// Check if the popup is open by checking whether it matches "(<x>,<y>)"
|
// Check if the popup is open by checking whether it matches "(<x>,<y>)"
|
||||||
var popupLocationRegExp = /^\((-?[0-9\.E]+),(-?[0-9\.E]+),(-?[0-9\.E]+),(-?[0-9\.E]+)\)$/;
|
var popupLocationRegExp = /^\((-?[0-9\.E]+),(-?[0-9\.E]+),(-?[0-9\.E]+),(-?[0-9\.E]+)\)$/;
|
||||||
if(popupLocationRegExp.test(value)) {
|
if(popupLocationRegExp.test(value)) {
|
||||||
value = "";
|
this.wiki.deleteTextReference(textRef,this.tiddlerTitle);
|
||||||
} else {
|
} else {
|
||||||
// Set the position if we're opening it
|
// Set the position if we're opening it
|
||||||
value = "(" + this.child.domNode.offsetLeft + "," + this.child.domNode.offsetTop + "," + this.child.domNode.offsetWidth + "," + this.child.domNode.offsetHeight + ")";
|
this.wiki.setTextReference(textRef,
|
||||||
|
"(" + this.child.domNode.offsetLeft + "," + this.child.domNode.offsetTop + "," +
|
||||||
|
this.child.domNode.offsetWidth + "," + this.child.domNode.offsetHeight + ")",
|
||||||
|
this.tiddlerTitle,true);
|
||||||
|
$tw.popupper.popup(textRef);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
// Update the state tiddler
|
|
||||||
this.wiki.addTiddler(new $tw.Tiddler(tiddler,{title: title, text: value}),true);
|
|
||||||
};
|
};
|
||||||
|
|
||||||
exports.handleEvent = function(event) {
|
exports.handleEvent = function(event) {
|
||||||
switch(event.type) {
|
if(event.type === "click") {
|
||||||
case "click":
|
|
||||||
if(this.hasParameter("message")) {
|
if(this.hasParameter("message")) {
|
||||||
this.dispatchMessage(event);
|
this.dispatchMessage(event);
|
||||||
}
|
}
|
||||||
@ -66,11 +66,6 @@ exports.handleEvent = function(event) {
|
|||||||
}
|
}
|
||||||
event.preventDefault();
|
event.preventDefault();
|
||||||
return false;
|
return false;
|
||||||
case "tw-cancel-popup":
|
|
||||||
if(this.hasParameter("popup") && this.child.domNode !== event.targetOfCancel && !$tw.utils.domContains(this.child.domNode,event.targetOfCancel)) {
|
|
||||||
this.triggerPopup(event,true);
|
|
||||||
}
|
|
||||||
break;
|
|
||||||
}
|
}
|
||||||
return true;
|
return true;
|
||||||
};
|
};
|
||||||
@ -87,7 +82,7 @@ exports.executeMacro = function() {
|
|||||||
this.content[t].execute(this.parents,this.tiddlerTitle);
|
this.content[t].execute(this.parents,this.tiddlerTitle);
|
||||||
}
|
}
|
||||||
return $tw.Tree.Element("button",attributes,this.content,{
|
return $tw.Tree.Element("button",attributes,this.content,{
|
||||||
events: ["click","tw-cancel-popup"],
|
events: ["click"],
|
||||||
eventHandler: this
|
eventHandler: this
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
@ -30,17 +30,14 @@ exports.readState = function() {
|
|||||||
this.isOpen = this.params["default"] === "open";
|
this.isOpen = this.params["default"] === "open";
|
||||||
}
|
}
|
||||||
// Read the information from the state tiddler
|
// Read the information from the state tiddler
|
||||||
if(this.stateTitle) {
|
if(this.stateTextRef) {
|
||||||
var stateTiddler = this.wiki.getTiddler(this.stateTitle);
|
var state = this.wiki.getTextReference(this.stateTextRef,"",this.tiddlerTitle);
|
||||||
if(stateTiddler) {
|
|
||||||
var state = stateTiddler ? stateTiddler.fields.text : "";
|
|
||||||
switch(this.params.type) {
|
switch(this.params.type) {
|
||||||
case "popup":
|
case "popup":
|
||||||
this.readPopupState(state);
|
this.readPopupState(state);
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
};
|
};
|
||||||
|
|
||||||
exports.readPopupState = function(state) {
|
exports.readPopupState = function(state) {
|
||||||
@ -66,15 +63,16 @@ exports.readPopupState = function(state) {
|
|||||||
exports.handleEvent = function(event) {
|
exports.handleEvent = function(event) {
|
||||||
if(event.type === "click") {
|
if(event.type === "click") {
|
||||||
// Cancel the popup if we get a click on it
|
// Cancel the popup if we get a click on it
|
||||||
var tiddler = this.wiki.getTiddler(this.stateTitle);
|
if(this.stateTextRef) {
|
||||||
this.wiki.addTiddler(new $tw.Tiddler(tiddler,{title: this.stateTitle, text: ""}),true);
|
this.wiki.deleteTextReference(this.stateTextRef);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
exports.executeMacro = function() {
|
exports.executeMacro = function() {
|
||||||
this.stateTitle = this.params.state;
|
this.stateTextRef = this.params.state;
|
||||||
if(this.hasParameter("qualifyTiddlerTitles")) {
|
if(this.hasParameter("qualifyTiddlerTitles")) {
|
||||||
this.stateTitle = "(" + this.parents.join(",") + "," + this.tiddlerTitle + ")" + this.stateTitle;
|
this.stateTextRef = "(" + this.parents.join(",") + "," + this.tiddlerTitle + ")" + this.stateTextRef;
|
||||||
}
|
}
|
||||||
this.readState();
|
this.readState();
|
||||||
var attributes = {
|
var attributes = {
|
||||||
@ -105,10 +103,8 @@ exports.executeMacro = function() {
|
|||||||
exports.refreshInDom = function(changes) {
|
exports.refreshInDom = function(changes) {
|
||||||
var needChildrenRefresh = true, // Avoid refreshing the children nodes if we don't need to
|
var needChildrenRefresh = true, // Avoid refreshing the children nodes if we don't need to
|
||||||
t;
|
t;
|
||||||
// If the state tiddler has changed then reset the open state
|
// Re-read the open state
|
||||||
if($tw.utils.hop(changes,this.stateTitle)) {
|
|
||||||
this.readState();
|
this.readState();
|
||||||
}
|
|
||||||
// Render the children if we're open and we don't have any children yet
|
// Render the children if we're open and we don't have any children yet
|
||||||
if(this.isOpen && this.child.children.length === 0) {
|
if(this.isOpen && this.child.children.length === 0) {
|
||||||
// Install the children and execute them
|
// Install the children and execute them
|
||||||
|
49
core/modules/popupper.js
Normal file
49
core/modules/popupper.js
Normal file
@ -0,0 +1,49 @@
|
|||||||
|
/*\
|
||||||
|
title: $:/core/modules/popupper.js
|
||||||
|
type: application/javascript
|
||||||
|
module-type: utils
|
||||||
|
|
||||||
|
Plugin that creates a $tw.utils.Popupper object prototype that manages popups in the browser
|
||||||
|
|
||||||
|
\*/
|
||||||
|
(function(){
|
||||||
|
|
||||||
|
/*jslint node: true, browser: true */
|
||||||
|
/*global $tw: false */
|
||||||
|
"use strict";
|
||||||
|
|
||||||
|
/*
|
||||||
|
Creates a Popupper object with these options:
|
||||||
|
wiki: the wiki to use for resolving tiddler titles
|
||||||
|
rootElement: the DOM element to which the popup zapper should be attached
|
||||||
|
*/
|
||||||
|
var Popupper = function(options) {
|
||||||
|
options = options || {};
|
||||||
|
this.wiki = options.wiki;
|
||||||
|
this.rootElement = options.rootElement || document.body;
|
||||||
|
this.popupTextRef = null;
|
||||||
|
};
|
||||||
|
|
||||||
|
Popupper.prototype.popup = function(stateTextRef) {
|
||||||
|
var popupState;
|
||||||
|
this.cancel();
|
||||||
|
this.popupTextRef = stateTextRef;
|
||||||
|
this.rootElement.addEventListener("click",this,true);
|
||||||
|
};
|
||||||
|
|
||||||
|
Popupper.prototype.handleEvent = function(event) {
|
||||||
|
if(event.type === "click") {
|
||||||
|
this.cancel();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
Popupper.prototype.cancel = function() {
|
||||||
|
if(this.popupTextRef) {
|
||||||
|
this.wiki.deleteTextReference(this.popupTextRef);
|
||||||
|
this.popupTextRef = null;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
exports.Popupper = Popupper;
|
||||||
|
|
||||||
|
})();
|
@ -48,35 +48,18 @@ exports.startup = function() {
|
|||||||
$tw.Commander.initCommands();
|
$tw.Commander.initCommands();
|
||||||
// Host-specific startup
|
// Host-specific startup
|
||||||
if($tw.browser) {
|
if($tw.browser) {
|
||||||
// Install the popup zapper
|
// Install the popupper
|
||||||
// document.body.addEventListener("click",function(event) {
|
$tw.popupper = new $tw.utils.Popupper({
|
||||||
// // Is the click within a popup?
|
wiki: $tw.wiki,
|
||||||
// var inPopup = false,
|
rootElement: document.body
|
||||||
// e = event.target;
|
});
|
||||||
// while(e !== document) {
|
|
||||||
// if($tw.utils.hasClass(e,"tw-popup")) {
|
|
||||||
// inPopup = true;
|
|
||||||
// }
|
|
||||||
// e = e.parentNode;
|
|
||||||
// }
|
|
||||||
// // If we're not in a popup, then send out an event to cancel all popups
|
|
||||||
// if(!inPopup) {
|
|
||||||
// var cancelPopupEvent = document.createEvent("Event");
|
|
||||||
// cancelPopupEvent.initEvent("tw-cancel-popup",true,true);
|
|
||||||
// cancelPopupEvent.targetOfCancel = event.target;
|
|
||||||
// var controllers = document.querySelectorAll(".tw-popup-controller");
|
|
||||||
// for(var t=0; t<controllers.length; t++) {
|
|
||||||
// controllers[t].dispatchEvent(cancelPopupEvent);
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
// });
|
|
||||||
// Display the PageTemplate
|
// Display the PageTemplate
|
||||||
var template = "$:/templates/PageTemplate",
|
var template = "$:/templates/PageTemplate";
|
||||||
renderer = $tw.wiki.parseTiddler(template);
|
$tw.renderer = $tw.wiki.parseTiddler(template);
|
||||||
renderer.execute([],template);
|
$tw.renderer.execute([],template);
|
||||||
renderer.renderInDom(document.body);
|
$tw.renderer.renderInDom(document.body);
|
||||||
$tw.wiki.addEventListener("",function(changes) {
|
$tw.wiki.addEventListener("",function(changes) {
|
||||||
renderer.refreshInDom(changes);
|
$tw.renderer.refreshInDom(changes);
|
||||||
});
|
});
|
||||||
console.log("$tw",$tw);
|
console.log("$tw",$tw);
|
||||||
} else {
|
} else {
|
||||||
|
Loading…
Reference in New Issue
Block a user