From 07c2c21dbf9bc6411b1f8d05c9243522f50b2ca5 Mon Sep 17 00:00:00 2001 From: Jeremy Ruston Date: Fri, 14 Feb 2020 15:01:45 +0000 Subject: [PATCH] Share plugin: Add warning prompt --- plugins/tiddlywiki/share/rawmarkup.js | 81 +++++++++++++++-- plugins/tiddlywiki/share/rawmarkup.tid | 2 + plugins/tiddlywiki/share/startup-warning.css | 87 +++++++++++++++++++ .../tiddlywiki/share/startup-warning.css.meta | 2 + plugins/tiddlywiki/share/startup-warning.html | 47 ++++++++++ .../share/startup-warning.html.meta | 2 + 6 files changed, 216 insertions(+), 5 deletions(-) create mode 100644 plugins/tiddlywiki/share/startup-warning.css create mode 100644 plugins/tiddlywiki/share/startup-warning.css.meta create mode 100644 plugins/tiddlywiki/share/startup-warning.html create mode 100644 plugins/tiddlywiki/share/startup-warning.html.meta diff --git a/plugins/tiddlywiki/share/rawmarkup.js b/plugins/tiddlywiki/share/rawmarkup.js index 697e949ed..c0ab77659 100644 --- a/plugins/tiddlywiki/share/rawmarkup.js +++ b/plugins/tiddlywiki/share/rawmarkup.js @@ -19,7 +19,7 @@ if(rawHash.charAt(0) === "#") { try{ hash = decodeURIComponent(rawHash.substring(1)); } catch(ex) { - console.log("Error decoding location hash",ex); + console.log("Share plugin: Error decoding location hash",ex); } // Try to parse the hash as JSON if(hash) { @@ -27,17 +27,88 @@ if(rawHash.charAt(0) === "#") { try { tiddlers= JSON.parse(hash); } catch(ex) { - console.log("Error parsing JSON from location hash",ex); + console.log("Share plugin: Error parsing JSON from location hash",ex); } if(tiddlers) { // Need to initialise these because we run before bootprefix.js and boot.js window.$tw = window.$tw || {}; $tw.boot = $tw.boot || {}; $tw.preloadTiddlers = $tw.preloadTiddlers || []; - // Load our tiddlers - $tw.preloadTiddlers = $tw.preloadTiddlers.concat(tiddlers); - } + // Prevent TiddlyWiki from booting + $tw.boot.suppressBoot = true; + // Load our styles + var stylesWrapper = document.createElement("style"); + stylesWrapper.innerHTML = tiddlywikiSharePluginStartupWarningCss; + document.documentElement.appendChild(stylesWrapper); + // Display the warning banner + var warningWrapper = document.createElement("div"); + warningWrapper.innerHTML = tiddlywikiSharePluginStartupWarningHtml; + document.documentElement.appendChild(warningWrapper); + // Add our event handlers + document.getElementById("startup-warning-proceed").addEventListener("click",actionProceed,false); + document.getElementById("startup-warning-cancel").addEventListener("click",actionCancel,false); + // Sort the incoming tiddlers by title + tiddlers = tiddlers.sort(function(a,b) { + if(a.title < b.title) { + return -1; + } else if(a.title > b.title) { + return +1; + } else { + return 0; + } + }); + // Load the tiddler preview + var previewWrapper = document.getElementById("startup-warning-preview"); + for(var index=0; index < tiddlers.length; index++) { + var tiddler = tiddlers[index], + tiddlerWrapper = document.createElement("li"), + titleTextWrapper = document.createElement("span"), + titleText = document.createTextNode(tiddler.title), + fieldsTable = document.createElement("table"), + fieldsTableBody = document.createElement("tbody"); + titleTextWrapper.appendChild(titleText); + titleTextWrapper.className = "tiddler-title"; + tiddlerWrapper.appendChild(titleTextWrapper); + fieldsTable.appendChild(fieldsTableBody); + var fields = Object.keys(tiddler).sort(); + for(var fieldIndex = 0; fieldIndex < fields.length; fieldIndex++) { + var fieldName = fields[fieldIndex], + fieldValue = tiddler[fieldName]; + if(fieldName !== "title") { + var fieldRow = document.createElement("tr"), + fieldRowHeader = document.createElement("th"), + fieldRowValue = document.createElement("td"); + fieldRowHeader.appendChild(document.createTextNode(fieldName)); + fieldRowValue.appendChild(document.createTextNode(fieldValue)); + fieldRow.appendChild(fieldRowHeader); + fieldRow.appendChild(fieldRowValue); + fieldsTableBody.appendChild(fieldRow); + } + } + tiddlerWrapper.appendChild(fieldsTable); + previewWrapper.appendChild(tiddlerWrapper); + } + } } } +function actionProceed() { + // Remove the banner, load our tiddlers, and boot TiddlyWiki + removeWarningBanner(); + $tw.preloadTiddlers = $tw.preloadTiddlers.concat(tiddlers); + $tw.boot.boot(); +} + +function actionCancel() { + // Remove the banner, clear the location hash, and boot TiddlyWiki + removeWarningBanner(); + document.location.hash = "#"; + $tw.boot.boot(); +} + +function removeWarningBanner() { + warningWrapper.parentNode.removeChild(warningWrapper); + stylesWrapper.parentNode.removeChild(stylesWrapper); +} + })(); diff --git a/plugins/tiddlywiki/share/rawmarkup.tid b/plugins/tiddlywiki/share/rawmarkup.tid index 8130757ad..05d8c5d0e 100644 --- a/plugins/tiddlywiki/share/rawmarkup.tid +++ b/plugins/tiddlywiki/share/rawmarkup.tid @@ -2,5 +2,7 @@ title: $:/plugins/tiddlywiki/share/rawmarkup tags: $:/tags/RawMarkupWikified `` diff --git a/plugins/tiddlywiki/share/startup-warning.css b/plugins/tiddlywiki/share/startup-warning.css new file mode 100644 index 000000000..87805f399 --- /dev/null +++ b/plugins/tiddlywiki/share/startup-warning.css @@ -0,0 +1,87 @@ + +.startup-warning-wrapper { + font-family: sans-serif; + line-height: 1.4; + width: 50%; + margin: 1em auto 0 auto; + padding: 0 1em; + border: 6px solid transparent; + border-radius: 8px; + background: linear-gradient(white, white) padding-box, repeating-linear-gradient(-45deg, red 0, red 25%, transparent 0, transparent 50%) 0 / .6em .6em; + animation: marching-ants 20s linear infinite; +} + +@media (max-width: 600px) { + .startup-warning-wrapper { + width: 85%; + } +} + +#startup-warning-preview { + list-style-type: none; + padding-left: 0; +} + +#startup-warning-preview .tiddler-title { + font-weight: bold; + font-size: 1.2em; +} + +#startup-warning-preview table { + margin-left: 1em; +} + +#startup-warning-preview th { + vertical-align: top; + font-weight: normal; +} + +#startup-warning-preview td { + font-family: monospace; + white-space: pre-wrap; + background: #f8f8f8; +} + +.startup-warning-wrapper button { + padding: 0.3em; + border-radius: 4px; + font-size: 1.5em; +} + +#startup-warning-cancel { + background: #DB2828; + color: #fff; +} + +#startup-warning-cancel:hover { + background: #E75C60; + color: #fff; +} + +#startup-warning-cancel:active { + background: #ec8d8d; + color: #fff; +} + +#startup-warning-proceed { + background: #24BA4C; + color: #fff; +} + +#startup-warning-proceed:hover { + background: #59e27e; + color: #fff; +} + +#startup-warning-proceed:active { + background: #ABF5BD; + color: #fff; +} + +.startup-warning-wrapper h1, +.startup-warning-wrapper h2 { + font-weight: bold; +} + +@keyframes marching-ants { to { background-position: 100% 100% } } + diff --git a/plugins/tiddlywiki/share/startup-warning.css.meta b/plugins/tiddlywiki/share/startup-warning.css.meta new file mode 100644 index 000000000..5972681f8 --- /dev/null +++ b/plugins/tiddlywiki/share/startup-warning.css.meta @@ -0,0 +1,2 @@ +title: $:/plugins/tiddlywiki/share/startup-warning.css +type: text/css diff --git a/plugins/tiddlywiki/share/startup-warning.html b/plugins/tiddlywiki/share/startup-warning.html new file mode 100644 index 000000000..8be493fee --- /dev/null +++ b/plugins/tiddlywiki/share/startup-warning.html @@ -0,0 +1,47 @@ +
+

+Warning: This site is designed to share untrusted content +

+

+Please do not proceed unless you are certain you understand the warnings below +

+

+This is a special site that allows users to share content for TiddlyWiki without needing conventional hosting. Instead, the content is encoded in the URL used to access the site. This means that there are no controls or protections on the content that is shared, and as such it may contain malicious links or any kind of content. +

+

+Viewing links to this site in the browser is generally safe because web pages are designed to run in a sandbox that prevents them from accessing or harming your data. However, please exercise caution before downloading content to your own computer, or importing content into your own TiddlyWiki. +

+ +
+ +Click here to see the tiddlers that are being shared + +
    +
+
+ +

+Only continue if you understand the risks +

+ +

+ + +

+ +

+Technical details +

+ +

+This web page is a TiddlyWiki loaded with the Share plugin. It has the special capability that at startup it can load raw tiddlers from a block of JSON encoded into the location hash part of the URL (ie the part after the # character). +

+

+This is useful because it enables people to share working examples of TiddlyWikis without needing to arrange special hosting. The only restriction is that browsers and other Internet infrastructure frequently limit the length of URLs to a few tens of kilobytes. +

+ +
diff --git a/plugins/tiddlywiki/share/startup-warning.html.meta b/plugins/tiddlywiki/share/startup-warning.html.meta new file mode 100644 index 000000000..b3898d250 --- /dev/null +++ b/plugins/tiddlywiki/share/startup-warning.html.meta @@ -0,0 +1,2 @@ +title: $:/plugins/tiddlywiki/share/startup-warning.html +type: text/html