How to write and register a new Saver

[J. Heuer]

Hi, I am looking for help on writing and installing a new Saver for TiddlyWiki. 

I think I have the "writing" bit figured out (never be certain, I know), but I have no idea how to plug that piece of code into TiddlyWiki and the list of savers.

Could you help me, or point to the right docu?

Many thanks.

[PMario]

Hi J.

May be this helps: https://tiddlywiki.com/dev/#Saver:Saver%20HelloThere

also see:

HangOut_023 video

0:09:05 J- Control panel - tiddlyspot saver tab. link to backup folder.

1:51:00 about the savers/ modules

1:52:50 TiddlyFox saver ... .saverInit()

HangOut_010 video

1:54:10 /core/modules/savers - folder

where Jeremy talks about savers.  May be this helps. The videos have a SHOW MORE section, where you have direct links to the timestamp.

have fun!

mario

[J. Heuer]

Hi Mario,

and thank you for this helpful information.

I am now wondering: how do I get my own saver installed in TiddlyWiki? Don't want to make it GA, as it will only work in a very specific context... Can I introduce it as an extension or how does that work?

 J

[Jeremy Ruston]

Hi J

If I understand correctly from our earlier Twitter conversation [1], you're writing a container app for TiddlyWiki, along the lines of TiddlyDesktop but written to use Microsoft's UWP APIs for Windows 10.

If so, you may be able to avoid writing a new saver by instead implementing the protocol used by the "tiddlyfox" saver [2], which is used by TiddlyDesktop and several other adaptors.

The tiddlyfox protocol is DOM-based because typically container apps don't have access to the JavaScript environment of the hosted TiddlyWiki page. The protocol goes like this:

First the setup:

1. The container app instantiates a webview and loads the TiddlyWiki file

2. Once the page has completed loading (the webview usually provides an event for this), the container app must insert into the DOM a new DIV as a child of the body with the ID "tiddlyfox-message-box"

3. The container app must also register a custom event handler on the message box DIV for the message "tiddlyfox-save-file"

Then, to handle a save operation triggered from within the wiki:

4. TW creates a new DIV as a child of the message box DIV that we call the message DIV. It must have the following attributes:

* data-tiddlyfox-path: the local pathname to the file

* data-tiddlyfox-content: the content to be saved to the file

5. TW also adds to the message DIV an event handler for the custom event "tiddlyfox-have-saved-file"

6. Then TW triggers the custom "tiddlyfox-save-file" event on the message DIV

7. The container app picks up the "tiddlyfox-save-file" event via the handler set up in (3) and responds by:

7a. Saving the file

7b. Removing the message DIV from the DOM

7c. Triggering the "tiddlyfox-have-saved-file" custom event on the message DIV

You may find it helpful to refer to the source of the original TiddlyFox FireFox extension [3] and of TiddlyDesktop [4].

Best wishes

Jeremy

[1] https://twitter.com/jhwheuer/status/1229734995104800768
[2] https://github.com/Jermolene/TiddlyWiki5/blob/master/core/modules/savers/tiddlyfox.js

[3] https://github.com/TiddlyWiki/TiddlyFox/blob/master/data/tab-content.js

[4] https://github.com/Jermolene/TiddlyDesktop/blob/master/source/js/utils/saving.js#L11-L46

--

Jeremy Ruston

jer...@jermolene.com

https://jermolene.com

On 19 Feb 2020, at 17:24, 'J. Heuer' via TiddlyWikiDev <tiddly...@googlegroups.com> wrote:



--
You received this message because you are subscribed to the Google Groups "TiddlyWikiDev" group.
To unsubscribe from this group and stop receiving emails from it, send an email to tiddlywikide...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywikidev/6797bd31-eafb-46c5-9d34-1f711dec4768%40googlegroups.com.

[J. Heuer]

Right, culled the script at https://github.com/Jermolene/TiddlyDesktop/blob/master/source/js/utils/saving.js#L11-L46 (that looked like the most promising one) down to this:

(function () {
    try {
        exports.enableSaving = function (doc, areBackupsEnabledFn, loadFileTextFn) {
            // Create the message box
            var messageBox = doc.createElement("div");
            messageBox.id = "tiddlyfox-message-box";
            doc.body.appendChild(messageBox);
            // Listen for save events
            messageBox.addEventListener("tiddlyfox-save-file", function (event) {
                // Get the details from the message
                var message = event.target,
                    filepath = message.getAttribute("data-tiddlyfox-path"),
                    content = message.getAttribute("data-tiddlyfox-content");
                // Save the file
                window.UWPWikiHandler.wikiSaved(content);

                // Remove the message element from the message box
                message.parentNode.removeChild(message);

                // Send a confirmation message
                var event = doc.createEvent("Events");
                event.initEvent("tiddlyfox-have-saved-file", true, false);
                event.savedFilePath = filepath;
                message.dispatchEvent(event);
                return false;
            }, false);
        }
    } catch (e) {
    }
})();

The Tie into the UWP app is window.UWPWikiHandler.wikiSaved(content); where the app is passed the content string...

Fireworks in the app when I try to inject that chunk into the TiddlyWiki page after navigation has succeeded. =Hard= Crash down to the OS inside the debugger, not even a wink and a nod, just dies... I love UWP!

Too tired to keep trying with a teething girl, will see why that happens next week.

THANKS JEREMY for all your help, much obliged!