Importing a JSON file as text

I have a JSON file which is a valid dump of tiddlers. When I want to import it as text into a single HTML file wiki, I have to:

  • create a new tiddler
  • set its content type to text
  • open the JSON file in a text editor, select everything, copy, then paste it into the text field of the new tiddler, then save the tiddler

If I try to import it via TiddlyWiki’s Import button, it makes the assumption for me and only suggests importing the JSON content as separate tiddlers. There’s nothing like an “Import as plain text” checkbox in the Import tiddler dialog.

Is there an easier way than the described above to import a JSON file as a piece of text?

  • Open the JSON file in a text editor
  • At the top of the file insert
title: youTitleComesHere
type: text/plain

[{your json data comes here}]
  • The new-line between type and the first json character is important
  • Rename the file to abc.json.tid
  • Import into TW.

That should be it

This still involves manual intervention, but thanks for the idea! I can just write a shell script that will perform this file transformation :+1:

Here’s a bit of wikitext that adds a “Save as JSON” interface to the bottom of the $:/Import tiddler:

First, create a tiddler (e.g “SaveImportAsJSON”), tagged with $:/tags/ViewTemplate, containing:

<%if [<currentTiddler>match[$:/Import]] %>
Save as JSON: <$edit-text field="newtitle" default="New JSON Tiddler"/>
<$button>save
<$let newtitle={{{ [{!!newtitle}!match[]else[New JSON Tiddler]] }}}>
<$action-deletefield plugin-type status newtitle/>
<$action-setfield title=<<newtitle>>/>
<$action-deletetiddler $tiddler="$:/Import"/>
<$action-sendmessage $message="tm-close-tiddler" $param="$:/Import"/>
<$action-navigate $to=<<newtitle>>/>
</$let>
</$button>
<%endif%>

Then:

  • Drag-and-drop your JSON file into your TiddlyWiki (or use the “import” button from the sidebar “Tools” tab)
  • The $:/Import tiddler will be displayed with the added “SaveImportAsJSON” controls at the bottom
  • Enter a tiddler name (or use the default “New JSON Tiddler”)
  • Press the “save” button, which performs the following actions:
    • Remove the plugin-type, status and newtitle fields from the $:/Import tiddler
    • Copy the $:/Import tiddler to the title you have entered
    • Delete and close the $:/Import tiddler
    • Open the newly created JSON tiddler in the StoryRiver

enjoy,
-e

I like this method because it seems like an easy way to intercept the import process and perform my own custom import. I could be wrong but it seems to miss a step.

The new JSON tiddler created is using $:/Import format like this

{
   "tiddlers": {
        "..<title>…” : { "title": "..<title>...", "text": "..<text>..." ... } 
         ...
   }
}

which is different from the original tiddlers JSON format [ { "title": "..<title>...", "text": "..<text>...", …} ... ]. So IF the original tiddlers JSON format is required, another step is needed to extract from “tiddlers” ?

I tried an alternate approach using dropzone, which is how I do custom import :

<style>
.jsontiddler-dropzone{
	margin:4px auto;
	border:2px dotted green;
	text-align:center;
}
.jsontiddler-dropzone:focus {
	background: #fffedd;
}
</style>

<$dropzone
			importTitle="json_imported_as_text"
            deserializer="text/plain"
            files only="yes"
		>
			<div class="jsontiddler-dropzone" tabindex=1>Drop your JSON file here</div>
</$dropzone>

This seems to work as the content of the JSON tiddlers are indeed imported into the text field of the new tiddler, but the type is “application/json” ?