From c4a7ae3164d293549ffc3016b8a6b3ada399344e Mon Sep 17 00:00:00 2001 From: "jeremy@jermolene.com" Date: Thu, 3 Jun 2021 14:14:11 +0100 Subject: [PATCH] Add demo of drag and drop from a standalone HTML file --- drag-and-drop-interop.html | 35 +++++++++++++++++++ editions/dev/tiddlers/HelloThere.tid | 1 + .../new/TiddlyWiki Drag and Drop Interop.tid | 15 ++++++++ .../dev/tiddlers/new/dragndropinterop.html | 35 +++++++++++++++++++ .../tiddlers/new/dragndropinterop.html.meta | 3 ++ .../tiddlers/new/save-dragndropinterop.tid | 3 ++ 6 files changed, 92 insertions(+) create mode 100644 drag-and-drop-interop.html create mode 100644 editions/dev/tiddlers/new/TiddlyWiki Drag and Drop Interop.tid create mode 100644 editions/dev/tiddlers/new/dragndropinterop.html create mode 100644 editions/dev/tiddlers/new/dragndropinterop.html.meta create mode 100644 editions/dev/tiddlers/new/save-dragndropinterop.tid diff --git a/drag-and-drop-interop.html b/drag-and-drop-interop.html new file mode 100644 index 000000000..ecd7aba12 --- /dev/null +++ b/drag-and-drop-interop.html @@ -0,0 +1,35 @@ + + + + + Drag and Drop Interoperability with TiddlyWiki Demo + + + +
+ Drag me to a TiddlyWiki window +
+ + + \ No newline at end of file diff --git a/editions/dev/tiddlers/HelloThere.tid b/editions/dev/tiddlers/HelloThere.tid index 8afc1b22c..021e0ad47 100644 --- a/editions/dev/tiddlers/HelloThere.tid +++ b/editions/dev/tiddlers/HelloThere.tid @@ -13,6 +13,7 @@ Welcome to the developer documentation for TiddlyWiki (https://tiddlywiki.com/). ** HookMechanism ** [[Using ES2016 for Writing Plugins]] ** [[Adding Babel Polyfill to TiddlyWiki]] +** [[TiddlyWiki Drag and Drop Interoperability]] * The original developer documentation from https://tiddlywiki.com: ** [[TiddlyWiki for Developers]] ** [[TiddlyWiki Coding Style Guidelines]] diff --git a/editions/dev/tiddlers/new/TiddlyWiki Drag and Drop Interop.tid b/editions/dev/tiddlers/new/TiddlyWiki Drag and Drop Interop.tid new file mode 100644 index 000000000..6808de4dd --- /dev/null +++ b/editions/dev/tiddlers/new/TiddlyWiki Drag and Drop Interop.tid @@ -0,0 +1,15 @@ +title: TiddlyWiki Drag and Drop Interoperability + +It is straightforward to allow any HTML file to interoperate with TiddlyWiki's drag and drop implementation. + +This example shows how to attach draggable data to a DOM element. The data is provided in two different forms: + +* the string data is used if the element is dragged onto a text editing area +* the tiddler data is used if the element is dragged into TiddlyWiki's import area + +<$button> +<$action-sendmessage $message="tm-download-file" $param="$:/dev/save/dragndropinterop" filename="index.html"/> +Download this sample code + + +<$codeblock code={{DragAndDropInterop}} language="text/html"/> diff --git a/editions/dev/tiddlers/new/dragndropinterop.html b/editions/dev/tiddlers/new/dragndropinterop.html new file mode 100644 index 000000000..ecd7aba12 --- /dev/null +++ b/editions/dev/tiddlers/new/dragndropinterop.html @@ -0,0 +1,35 @@ + + + + + Drag and Drop Interoperability with TiddlyWiki Demo + + + +
+ Drag me to a TiddlyWiki window +
+ + + \ No newline at end of file diff --git a/editions/dev/tiddlers/new/dragndropinterop.html.meta b/editions/dev/tiddlers/new/dragndropinterop.html.meta new file mode 100644 index 000000000..d4adb96b9 --- /dev/null +++ b/editions/dev/tiddlers/new/dragndropinterop.html.meta @@ -0,0 +1,3 @@ +title: DragAndDropInterop +type: text/html + diff --git a/editions/dev/tiddlers/new/save-dragndropinterop.tid b/editions/dev/tiddlers/new/save-dragndropinterop.tid new file mode 100644 index 000000000..3e9eab89f --- /dev/null +++ b/editions/dev/tiddlers/new/save-dragndropinterop.tid @@ -0,0 +1,3 @@ +title: $:/dev/save/dragndropinterop + +<$view tiddler="DragAndDropInterop" field="text"/>