mirror of
https://github.com/Jermolene/TiddlyWiki5
synced 2024-11-27 03:57:21 +00:00
Add support for resize tracking
This commit is contained in:
parent
d7b8c1c298
commit
4f39e69e9d
@ -27,6 +27,13 @@ The background task detects the tiddler at the top of the viewport and sets the
|
||||
|
||||
! Viewport Size Features
|
||||
|
||||
!! Resize Tracking
|
||||
|
||||
Some widgets require re-rendering or refreshing if the size of the viewport changes. This can be accomplished using "resize counting" in two steps:
|
||||
|
||||
* Ensure that a DOM element with the class `tc-dynaview-request-refresh-on-resize` is present in the DOM to enable resize counting
|
||||
* Have the widget check for changes to the tiddler $:/state/DynaView/ViewportDimensions/ResizeCount to detect viewport resizes
|
||||
|
||||
!! Viewport Size Tracking
|
||||
|
||||
The background task can optionally dynamically update a pair of state tiddlers with the dimensions of the browser viewport.
|
||||
|
@ -158,10 +158,20 @@ function checkTopmost() {
|
||||
}
|
||||
}
|
||||
|
||||
var previousViewportWidth, previousViewportHeight;
|
||||
|
||||
function saveViewportDimensions() {
|
||||
var viewportWidth = window.innerWidth || document.documentElement.clientWidth,
|
||||
viewportHeight = window.innerHeight || document.documentElement.clientHeight;
|
||||
if(document.querySelector(".tc-dynaview-request-refresh-on-resize")) {
|
||||
if(previousViewportWidth !== viewportWidth || previousViewportHeight !== viewportHeight) {
|
||||
var count = parseInt($tw.wiki.getTiddlerText("$:/state/DynaView/ViewportDimensions/ResizeCount","0"),10) || 0;
|
||||
$tw.wiki.addTiddler(new $tw.Tiddler({title: "$:/state/DynaView/ViewportDimensions/ResizeCount", text: (count + 1) + ""}));
|
||||
previousViewportWidth = viewportWidth;
|
||||
previousViewportHeight = viewportHeight;
|
||||
}
|
||||
}
|
||||
if($tw.wiki.getTiddlerText("$:/config/DynaView/ViewportDimensions") === "yes") {
|
||||
var viewportWidth = window.innerWidth || document.documentElement.clientWidth,
|
||||
viewportHeight = window.innerHeight || document.documentElement.clientHeight;
|
||||
if($tw.wiki.getTiddlerText("$:/state/DynaView/ViewportDimensions/Width") !== viewportWidth.toString()) {
|
||||
$tw.wiki.setText("$:/state/DynaView/ViewportDimensions/Width",undefined,undefined,viewportWidth.toString(),undefined);
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user