From 25727df6491cc05785a5a8480620e36a3af8a391 Mon Sep 17 00:00:00 2001 From: Jermolene Date: Wed, 29 Aug 2018 14:47:57 +0100 Subject: [PATCH] DynaView: Remove optisizer functionality It was slow and clunky, and turned out to be easier to do in CSS. --- plugins/tiddlywiki/dynaview/config.multids | 2 - plugins/tiddlywiki/dynaview/docs.tid | 17 ------- plugins/tiddlywiki/dynaview/dynaview.js | 51 ------------------- .../dynaview/examples/font-optisizer.tid | 17 ------- .../dynaview/optisizer-maquette.tid | 24 --------- plugins/tiddlywiki/dynaview/readme.tid | 1 - 6 files changed, 112 deletions(-) delete mode 100644 plugins/tiddlywiki/dynaview/examples/font-optisizer.tid delete mode 100644 plugins/tiddlywiki/dynaview/optisizer-maquette.tid diff --git a/plugins/tiddlywiki/dynaview/config.multids b/plugins/tiddlywiki/dynaview/config.multids index e85dbab96..e54201569 100644 --- a/plugins/tiddlywiki/dynaview/config.multids +++ b/plugins/tiddlywiki/dynaview/config.multids @@ -1,6 +1,4 @@ title: $:/config/DynaView/ -Optisizer: no -Optisizer/Text: ABCDEFGHIJKLMnopqrstuvwxyzABCDEFGHIJKLMnopqrstuvwxyz ViewportDimensions: no UpdateAddressBar: no diff --git a/plugins/tiddlywiki/dynaview/docs.tid b/plugins/tiddlywiki/dynaview/docs.tid index 822b10cfc..ff569a0d2 100644 --- a/plugins/tiddlywiki/dynaview/docs.tid +++ b/plugins/tiddlywiki/dynaview/docs.tid @@ -34,23 +34,6 @@ The background task can optionally dynamically update a pair of state tiddlers w * Set the configuration tiddler $:/config/DynaView/ViewportDimensions to the text "yes" to enable this feature * The viewport dimensions can be found in $:/state/DynaView/ViewportDimensions/Width and $:/state/DynaView/ViewportDimensions/Height -!! Font "Optisizer" - -The background task can optionally dynamically optimise the font size of a passage of text to match a desired line length. - -* Set the configuration tiddler $:/config/DynaView/Optisizer to the text "yes" to enable this feature -* Optionally, update the configuration tiddler $:/config/DynaView/Optisizer/Text with the "maquette" -- a character string matchng the desired length (this string should not include spaces). -* Assign the following CSS classes to appropriate elements on the page: -** `.tc-dynaview-optisizer-site` for an HTML element whose `offsetWidth` property gives the desired output width -** `.tc-dynaview-optisizer-maquette` for an HTML element that will contain the maquette -* The computed optimum font size can be found in the tiddler $:/state/DynaView/Optisizer/FontSize - -The tiddler $:/plugins/tiddlywiki/dynaview/optisizer-maquette contains an example configuration that can be used to adjust the size of tiddler body text. To use it: - -* Set $:/config/DynaView/Optisizer to the text "yes" -* Set $:/themes/tiddlywiki/vanilla/metrics/bodyfontsize to `{{$:/state/DynaView/Optisizer/FontSize}}` -* Set $:/themes/tiddlywiki/vanilla/metrics/bodylineheight to `1.5` to ensure that the line height matches the font size - ! Zoom Features !! Document Body Zoom Classes diff --git a/plugins/tiddlywiki/dynaview/dynaview.js b/plugins/tiddlywiki/dynaview/dynaview.js index 0272ac0d8..605b05516 100644 --- a/plugins/tiddlywiki/dynaview/dynaview.js +++ b/plugins/tiddlywiki/dynaview/dynaview.js @@ -28,7 +28,6 @@ exports.startup = function() { window.addEventListener("scroll",onScroll,false); window.addEventListener("resize",onResize,false); $tw.hooks.addHook("th-page-refreshed",function() { - optisizeFonts(); checkTopmost(); checkVisibility(); saveViewportDimensions(); @@ -58,7 +57,6 @@ function onResize(event) { function worker() { if(isWaitingForAnimationFrame & (ANIM_FRAME_CAUSED_BY_RESIZE | ANIM_FRAME_CAUSED_BY_LOAD)) { - optisizeFonts(); saveViewportDimensions(); } setZoomClasses(); @@ -67,55 +65,6 @@ function worker() { isWaitingForAnimationFrame = 0; } -var lastSiteWidth, lastMaquetteString; - -function optisizeFonts() { - if($tw.wiki.getTiddlerText("$:/config/DynaView/Optisizer") === "yes") { - var domSite = document.querySelector(".tc-dynaview-optisizer-site"), - domMaquette = document.querySelector(".tc-dynaview-optisizer-maquette"); - if(domSite && domMaquette) { - // Check that we're not at the same size as last time - if(domSite.offsetWidth === lastSiteWidth && $tw.wiki.getTiddlerText("$:/config/DynaView/Optisizer/Text") === lastMaquetteString) { - return; - } - // Get the current font size - domMaquette.style.fontSize = ""; - var initialFontSize = parseInt(window.getComputedStyle(domMaquette).fontSize,10), - minFontSize = 1, - maxFontSize = 100, - adjustFontSize = maxFontSize, - newFontSize = initialFontSize, - maquetteWidth; - lastSiteWidth = domSite.offsetWidth; - lastMaquetteString = $tw.wiki.getTiddlerText("$:/config/DynaView/Optisizer/Text"); - while(domMaquette.firstChild) { - domMaquette.removeChild(domMaquette.firstChild); - } - domMaquette.appendChild(document.createTextNode(lastMaquetteString)); - // We use a binary search algorithm to find the optimum size - do { - // Apply the size we're considering - domMaquette.style.fontSize = newFontSize + "px"; - // Measure the width of the maquette - maquetteWidth = domMaquette.offsetWidth; - // Adjust bigger or smaller - if(maquetteWidth < lastSiteWidth) { - newFontSize += adjustFontSize; - } else { - newFontSize -= adjustFontSize; - } - newFontSize = Math.min(newFontSize,maxFontSize); - newFontSize = Math.max(newFontSize,minFontSize); - adjustFontSize = adjustFontSize / 2; - } while (adjustFontSize > 0.5); - var newFontSizeString = newFontSize + "px"; - if($tw.wiki.getTiddlerText("$:/state/DynaView/Optisizer/FontSize") !== newFontSizeString) { - $tw.wiki.setText("$:/state/DynaView/Optisizer/FontSize",undefined,undefined,newFontSizeString,undefined); - } - } - } -} - function setZoomClasses() { var zoomFactor = document.body.scrollWidth / window.innerWidth, classList = document.body.classList; diff --git a/plugins/tiddlywiki/dynaview/examples/font-optisizer.tid b/plugins/tiddlywiki/dynaview/examples/font-optisizer.tid deleted file mode 100644 index ff11db6aa..000000000 --- a/plugins/tiddlywiki/dynaview/examples/font-optisizer.tid +++ /dev/null @@ -1,17 +0,0 @@ -title: $:/plugins/tiddlywiki/dynaview/examples/font-optisizer -tags: $:/tags/dynaviewExamples -caption: Font Optisizer - -<$button> -<$action-setfield $tiddler="$:/config/DynaView/Optisizer" $value="yes"/> -<$action-setfield $tiddler="$:/themes/tiddlywiki/vanilla/metrics/bodyfontsize" $value="{{$:/state/DynaView/Optisizer/FontSize}}"/> -<$action-setfield $tiddler="$:/themes/tiddlywiki/vanilla/metrics/bodylineheight" $value="1.5"/> -Enable font optisizer for tiddler body text - - -<$button> -<$action-setfield $tiddler="$:/config/DynaView/Optisizer" $value="no"/> -<$action-setfield $tiddler="$:/themes/tiddlywiki/vanilla/metrics/bodyfontsize" $value="14px"/> -<$action-setfield $tiddler="$:/themes/tiddlywiki/vanilla/metrics/bodylineheight" $value="20px"/> -Disable font optisizer - diff --git a/plugins/tiddlywiki/dynaview/optisizer-maquette.tid b/plugins/tiddlywiki/dynaview/optisizer-maquette.tid deleted file mode 100644 index 127259e61..000000000 --- a/plugins/tiddlywiki/dynaview/optisizer-maquette.tid +++ /dev/null @@ -1,24 +0,0 @@ -title: $:/plugins/tiddlywiki/dynaview/optisizer-maquette -tags: $:/tags/AboveStory - -
- - - -
- -
- -
- -
- -
- -
- -
diff --git a/plugins/tiddlywiki/dynaview/readme.tid b/plugins/tiddlywiki/dynaview/readme.tid index ae23cbe2d..684492ead 100644 --- a/plugins/tiddlywiki/dynaview/readme.tid +++ b/plugins/tiddlywiki/dynaview/readme.tid @@ -7,7 +7,6 @@ This plugin makes it possible to build user interfaces that dynamically respond * CSS classes that allow rendering to be deferred until the output is scrolled into view * CSS classes that allow the opacity of DOM elements to vary according to the current zoom level * A daemon that can dynamically update a pair of state tiddlers with the current dimensions of the browser viewport -* A daemon that can dynamically adjust the size of text to yield a particular number of characters per line * A daemon that can dynamically update the address bar with the title of the tiddler at the top of the viewport Some points to note about the zoom features: