mirrors
/
TiddlyWiki5
mirror of https://github.com/Jermolene/TiddlyWiki5
1
0
Fork 0
Code Issues Releases Wiki Activity

Reveal widget: add option to avoid clamping popup position 

Fixes #4041
This commit is contained in:
Jeremy Ruston 2019-07-04 15:58:27 +01:00
parent d489f61f2a
commit 3edaa652ee
2 changed files with 23 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
core/modules/widgets/reveal.js
View File

@ -56,32 +56,39 @@ RevealWidget.prototype.render = function(parent,nextSibling) {
RevealWidget.prototype.positionPopup = function(domNode) {
domNode.style.position = "absolute";
domNode.style.zIndex = "1000";
var left,top;
switch(this.position) {
case "left":
domNode.style.left = Math.max(0, this.popup.left - domNode.offsetWidth) + "px";
domNode.style.top = this.popup.top + "px";
left = this.popup.left - domNode.offsetWidth;
top = this.popup.top;
break;
case "above":
domNode.style.left = this.popup.left + "px";
domNode.style.top = Math.max(0, this.popup.top - domNode.offsetHeight) + "px";
left = this.popup.left;
top = this.popup.top - domNode.offsetHeight;
break;
case "aboveright":
domNode.style.left = (this.popup.left + this.popup.width) + "px";
domNode.style.top = Math.max(0, this.popup.top + this.popup.height - domNode.offsetHeight) + "px";
left = this.popup.left + this.popup.width;
top = this.popup.top + this.popup.height - domNode.offsetHeight;
break;
case "right":
domNode.style.left = (this.popup.left + this.popup.width) + "px";
domNode.style.top = this.popup.top + "px";
left = this.popup.left + this.popup.width;
top = this.popup.top;
break;
case "belowleft":
domNode.style.left = Math.max(0, this.popup.left + this.popup.width - domNode.offsetWidth) + "px";
domNode.style.top = (this.popup.top + this.popup.height) + "px";
left = this.popup.left + this.popup.width - domNode.offsetWidth;
top = this.popup.top + this.popup.height;
break;
default: // Below
domNode.style.left = this.popup.left + "px";
domNode.style.top = (this.popup.top + this.popup.height) + "px";
left = this.popup.left;
top = this.popup.top + this.popup.height;
break;
}
if(!this.positionAllowNegative) {
left = Math.max(0,left);
top = Math.max(0,top);
}
domNode.style.left = left + "px";
domNode.style.top = top + "px";
};
/*
@ -94,6 +101,7 @@ RevealWidget.prototype.execute = function() {
this.type = this.getAttribute("type");
this.text = this.getAttribute("text");
this.position = this.getAttribute("position");
this.positionAllowNegative = this.getAttribute("positionAllowNegative") === "yes";
this["class"] = this.getAttribute("class","");
this.style = this.getAttribute("style","");
this["default"] = this.getAttribute("default","");
@ -191,7 +199,7 @@ Selectively refreshes the widget if needed. Returns true if the widget or any of
*/
RevealWidget.prototype.refresh = function(changedTiddlers) {
var changedAttributes = this.computeAttributes();
if(changedAttributes.state || changedAttributes.type || changedAttributes.text || changedAttributes.position || changedAttributes["default"] || changedAttributes.animate || changedAttributes.stateTitle || changedAttributes.stateField || changedAttributes.stateIndex) {
if(changedAttributes.state || changedAttributes.type || changedAttributes.text || changedAttributes.position || changedAttributes.positionAllowNegative || changedAttributes["default"] || changedAttributes.animate || changedAttributes.stateTitle || changedAttributes.stateField || changedAttributes.stateIndex) {
this.refreshSelf();
return true;
} else {

3
editions/tw5.com/tiddlers/widgets/RevealWidget.tid
View File

@ -1,7 +1,7 @@
caption: reveal
created: 20131024141900000
jeremy: tiddlywiki
modified: 20181007231748909
modified: 20190704145627537
tags: Widgets
title: RevealWidget
type: text/vnd.tiddlywiki
@ -34,6 +34,7 @@ The content of the `<$reveal>` widget is displayed according to the rules given
|class |An optional CSS class name to be assigned to the HTML element<br/>&raquo; Set to `tc-popup-keep` to make a popup "sticky", so it won't close when you click inside of it|
|style |An optional CSS style attribute to be assigned to the HTML element |
|position |The position used for the popup when the type is ''popup''. Can be ''left'', ''above'', ''aboveright'', ''right'', ''belowleft'' or ''below'' |
|positionAllowNegative |Set to "yes" to prevent computed popup positions from being clamped to be above zero |
|default |Default value to use when the state tiddler is missing |
|animate |Set to "yes" to animate opening and closure (defaults to "no") |
|retain |Set to "yes" to force the content to be retained even when hidden (defaults to "no") |