1
0
mirror of https://github.com/Jermolene/TiddlyWiki5 synced 2025-01-23 15:36:52 +00:00

Refactor image-to-dom to be a separate plugin

This commit is contained in:
Jeremy Ruston 2024-12-11 13:58:50 +00:00
parent 6e1b58fca7
commit 42b79213dd
9 changed files with 92 additions and 6 deletions

View File

@ -8,7 +8,7 @@
"tiddlywiki/confetti",
"tiddlywiki/dynannotate",
"tiddlywiki/tour",
"tiddlywiki/geospatial"
"tiddlywiki/dom-to-image"
],
"themes": [
"tiddlywiki/vanilla",

View File

@ -1,6 +1,5 @@
title: $:/plugins/tiddlywiki/geospatial/docs/save-dom-to-image
title: $:/plugins/tiddlywiki/dom-to-image/docs
caption: tm-save-dom-to-image message
tags: $:/tags/GeospatialDocs
!! `tm-save-dom-to-image` message

View File

@ -4,7 +4,7 @@
"file": "dom-to-image-more.min.js",
"fields": {
"type": "application/javascript",
"title": "$:/plugins/tiddlywiki/geospatial/dom-to-image-more.js",
"title": "$:/plugins/tiddlywiki/dom-to-image/dom-to-image-more.js",
"module-type": "library",
"url": "https://github.com/1904labs/dom-to-image-more",
"version": "3.5.0"
@ -14,7 +14,7 @@
"file": "LICENSE",
"fields": {
"type": "text/plain",
"title": "$:/plugins/tiddlywiki/geospatial/dom-to-image-more/LICENSE"
"title": "$:/plugins/tiddlywiki/dom-to-image/dom-to-image-more/LICENSE"
}
}
]

View File

@ -0,0 +1,7 @@
{
"title": "$:/plugins/tiddlywiki/dom-to-image",
"name": "Dom-to-image",
"description": "Save DOM nodes as images",
"list": "readme docs",
"stability": "STABILITY_1_EXPERIMENTAL"
}

View File

@ -0,0 +1,3 @@
title: $:/plugins/tiddlywiki/dom-to-image/readme
* [[dom-to-image-more|https://github.com/1904labs/dom-to-image-more]], an open source library for saving web content as images

View File

@ -0,0 +1,78 @@
/*\
title: $:/plugins/tiddlywiki/dom-to-image/startup.js
type: application/javascript
module-type: startup
dom-to-image initialisation
\*/
(function(){
/*jslint node: true, browser: true */
/*global $tw: false */
"use strict";
// Export name and synchronous status
exports.name = "dom-to-image";
exports.after = ["rootwidget"];
exports.before = ["render"];
exports.synchronous = true;
exports.startup = function() {
$tw.rootWidget.addEventListener("tm-save-dom-to-image",function(event) {
var params = event.paramObject || {},
domToImage = require("$:/plugins/tiddlywiki/dom-to-image/dom-to-image-more.js"),
domNode = document.querySelector(params.selector || "body.tc-body");
if(domNode) {
var method = "toPng";
switch(params.format) {
case "jpeg":
// Intentional fallthrough
case "jpg":
method = "toJpeg";
break;
case "svg":
method = "toSvg";
break;
}
domToImage[method](domNode,{
height: $tw.utils.parseInt(params.height) || domNode.offsetHeight,
width: $tw.utils.parseInt(params.width) || domNode.offsetWidth,
quality: $tw.utils.parseNumber(params.quality),
scale: $tw.utils.parseNumber(params.scale) || 1
})
.then(function(dataUrl) {
// Save the image
if(params["save-file"]) {
var link = document.createElement("a");
link.download = params["save-file"];
link.href = dataUrl;
link.click();
}
// Save the tiddler
if(params["save-title"]) {
if(dataUrl.indexOf("data:image/svg+xml;") === 0) {
var commaIndex = dataUrl.indexOf(",");
$tw.wiki.addTiddler(new $tw.Tiddler({
title: params["save-title"],
type: "image/svg+xml",
"text": decodeURIComponent(dataUrl.substring(commaIndex + 1))
}));
} else {
var parts = dataUrl.split(";base64,");
$tw.wiki.addTiddler(new $tw.Tiddler({
title: params["save-title"],
type: parts[0].split(":")[1],
"text": parts[1]
}));
}
}
})
.catch(function(error) {
console.error('oops, something went wrong!', error);
});
}
});
};
})();

View File

@ -11,4 +11,3 @@ The Geospatial Plugin incorporates a number of third party libraries and online
* [[TravelTime|https://traveltime.com/]], a commercial API for [[geocoding|https://traveltime.com/features/geocoding]], [[routing|https://traveltime.com/features/multi-modal-routing]] and [[isochrones|https://traveltime.com/features/isochrones]]
* [[Flickr|https://www.flickr.com/services/api/]], a free API for retrieving geotagged photographs
* [[OpenLocationCode|https://github.com/google/open-location-code]], Google's open source library for converting to and from Open Location Codes (also known as [[PlusCodes|https://maps.google.com/pluscodes/]])
* [[dom-to-image-more|https://github.com/1904labs/dom-to-image-more]], an open source library for saving web content as images