mirror of
https://github.com/Jermolene/TiddlyWiki5
synced 2024-11-23 10:07:19 +00:00
Share plugin: Add warning prompt
This commit is contained in:
Jeremy Ruston
parent
04c28ba5f2
commit
07c2c21dbf
@ -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);
|
||||
}
|
||||
|
||||
})();
|
||||
|
||||
@ -2,5 +2,7 @@ title: $:/plugins/tiddlywiki/share/rawmarkup
|
||||
tags: $:/tags/RawMarkupWikified
|
||||
|
||||
`<script>`
|
||||
`var tiddlywikiSharePluginStartupWarningHtml = "`<$view tiddler="$:/plugins/tiddlywiki/share/startup-warning.html" format="jsencoded"/>`";`
|
||||
`var tiddlywikiSharePluginStartupWarningCss = "`<$view tiddler="$:/plugins/tiddlywiki/share/startup-warning.css" format="jsencoded"/>`";`
|
||||
{{$:/plugins/tiddlywiki/share/rawmarkup.js}}
|
||||
`</script>`
|
||||
|
||||
87
plugins/tiddlywiki/share/startup-warning.css
Normal file
87
plugins/tiddlywiki/share/startup-warning.css
Normal file
@ -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% } }
|
||||
|
||||
2
plugins/tiddlywiki/share/startup-warning.css.meta
Normal file
2
plugins/tiddlywiki/share/startup-warning.css.meta
Normal file
@ -0,0 +1,2 @@
|
||||
title: $:/plugins/tiddlywiki/share/startup-warning.css
|
||||
type: text/css
|
||||
47
plugins/tiddlywiki/share/startup-warning.html
Normal file
47
plugins/tiddlywiki/share/startup-warning.html
Normal file
@ -0,0 +1,47 @@
|
||||
<div class="startup-warning-wrapper">
|
||||
<h1>
|
||||
Warning: This site is designed to share untrusted content
|
||||
</h1>
|
||||
<h2>
|
||||
Please do not proceed unless you are certain you understand the warnings below
|
||||
</h2>
|
||||
<p>
|
||||
This is a special site that allows users to share content for <a href="https://tiddlywiki.com/" target="_blank" rel="noopener noreferrer">TiddlyWiki</a> 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.
|
||||
</p>
|
||||
<p>
|
||||
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.
|
||||
</p>
|
||||
|
||||
<details>
|
||||
<summary>
|
||||
Click here to see the tiddlers that are being shared
|
||||
</summary>
|
||||
<ul id="startup-warning-preview">
|
||||
</ul>
|
||||
</details>
|
||||
|
||||
<p>
|
||||
<strong><em>Only continue if you understand the risks</em></strong>
|
||||
</p>
|
||||
|
||||
<p>
|
||||
<button id="startup-warning-proceed">
|
||||
Proceed
|
||||
</button>
|
||||
<button id="startup-warning-cancel">
|
||||
Cancel
|
||||
</button>
|
||||
</p>
|
||||
|
||||
<h2>
|
||||
Technical details
|
||||
</h2>
|
||||
|
||||
<p>
|
||||
This web page is a <a href="https://tiddlywiki.com/" target="_blank" rel="noopener noreferrer">TiddlyWiki</a> loaded with the <a href="https://github.com/Jermolene/TiddlyWiki5/tree/master/plugins/tiddlywiki/share" target="_blank" rel="noopener noreferrer">Share plugin</a>. 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).
|
||||
</p>
|
||||
<p>
|
||||
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.
|
||||
</p>
|
||||
|
||||
</div>
|
||||
2
plugins/tiddlywiki/share/startup-warning.html.meta
Normal file
2
plugins/tiddlywiki/share/startup-warning.html.meta
Normal file
@ -0,0 +1,2 @@
|
||||
title: $:/plugins/tiddlywiki/share/startup-warning.html
|
||||
type: text/html
|
||||
Loading…
Reference in New Issue
Block a user