Using TiddlyWiki in Node WebKit

279 views
Skip to first unread message

Arlen Beiler

unread,
Jan 19, 2015, 8:10:00 PM1/19/15
to tiddl...@googlegroups.com
Hi Everyone,
As you may be aware, single file TiddlyWiki does not seem to work on Node-WebKit. Anyway, here is a solution which will allow it to work. You still need to use the file save dialog that pops up when you click save changes, but I've got a solution to that as well, which I will try to post later. 


-Arlen Beiler

Arlen Beiler

unread,
Jan 19, 2015, 8:16:35 PM1/19/15
to tiddl...@googlegroups.com
Ok, here's the saver: https://gist.github.com/Arlen22/3ff06f8a2f9f7e6b740c

Make sure you set the module-type and type fields.

Tobias Beer

unread,
Jan 19, 2015, 8:37:54 PM1/19/15
to tiddl...@googlegroups.com
As you may be aware, single file TiddlyWiki does not seem to work on Node-WebKit.

I'm not. What's the workflow here?
It would be nice of you to provide some pointers.

Best wishes, Tobias.

Arlen Beiler

unread,
Jan 20, 2015, 8:43:33 AM1/20/15
to tiddl...@googlegroups.com
Well, if you download Node-Webkit and open a TW5 file in it, it detects that node is available and tries to load everything from the file system. This of course does not work. So what I did as a workaround, was to add a line to bootprefix.js "if( $tw.nodeWebKit ) $tw.node = null;". This took care of the problem. Then I made a save handler based off TiddlyFoxSaver to save to the file system using NodeWebKit. 

--
You received this message because you are subscribed to the Google Groups "TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email to tiddlywiki+...@googlegroups.com.
To post to this group, send email to tiddl...@googlegroups.com.
Visit this group at http://groups.google.com/group/tiddlywiki.
For more options, visit https://groups.google.com/d/optout.

Tobias Beer

unread,
Jan 20, 2015, 10:10:47 AM1/20/15
to tiddl...@googlegroups.com
Does this mean that one could write an admin / dev ui in TiddlyWiki to handle the build process / parameters / configuration / etc...?

Best wishes, Tobias.

Arlen Beiler

unread,
Jan 20, 2015, 10:39:08 AM1/20/15
to tiddl...@googlegroups.com
Sure looks like it. I've finally got the other format working as well where you have all the tiddlers in separate files. That was a little harder, but it works. Basically I had to use tiddlywiki.js and modify it a bit.

On Tue, Jan 20, 2015 at 10:10 AM, Tobias Beer <beert...@gmail.com> wrote:
Does this mean that one could write an admin / dev ui in TiddlyWiki to handle the build process / parameters / configuration / etc...?

Best wishes, Tobias.

--

Danielo Rodríguez

unread,
Jan 20, 2015, 1:17:29 PM1/20/15
to tiddl...@googlegroups.com
Hello Arlen,

What do you need is a sync module that uses Node-webkit. I think you can base your work on the FS syncer.

What is the difference between your first post instructions and tiddlydesktop or the instructions to make TW work on node webkit described here: http://tiddlywiki.com/dev/#TiddlyWiki%20on%20node-webkit ?

PMario

unread,
Jan 20, 2015, 3:41:40 PM1/20/15
to tiddl...@googlegroups.com
On Tuesday, January 20, 2015 at 4:10:47 PM UTC+1, Tobias Beer wrote:
Does this mean that one could write an admin / dev ui in TiddlyWiki to handle the build process / parameters / configuration / etc...?

Yes.
Have a look here https://github.com/Jermolene/TiddlyDesktop/releases at "New Architecture"
-m

Arlen Beiler

unread,
Jan 20, 2015, 9:48:09 PM1/20/15
to tiddl...@googlegroups.com

What do you need is a sync module that uses Node-webkit. I think you can base your work on the FS syncer.

I actually think I got it working for both single file and "node.js style". The single file one needed a hack to bootprefix.js (in order to work right) and a Saver module which I based off the tiddlyfox saver. I guess that's the same thing as a syncer. If you're running the Node.JS version (like you download from GitHub), you don't even need the browser-server sync, because the server and the browser are one. Literally. So all changes in the browser go directly to the Node FileSystemSaver or whatever it is. 

What is the difference between your first post instructions and tiddlydesktop or the instructions to make TW work on node webkit described here: http://tiddlywiki.com/dev/#TiddlyWiki%20on%20node-webkit ?

That I don't know. Those instructions didn't work for me (because of the bootprefix.js problem), and all you need to do is just paste the file url into node-webkit and it loads it like a regular file. You don't actually need the package.json. 

TiddlyDesktop sounded a bit complicated, and I wanted to see if there was an easier way. I don't know what features it has beyond a regular tiddlywiki, though.

-Arlen

Danielo Rodríguez

unread,
Jan 21, 2015, 4:49:43 AM1/21/15
to tiddl...@googlegroups.com


El martes, 20 de enero de 2015, 16:39:08 (UTC+1), Arlen Beiler escribió:
Sure looks like it. I've finally got the other format working as well where you have all the tiddlers in separate files. That was a little harder, but it works. Basically I had to use tiddlywiki.js and modify it a bit.

Could you share this modification? I'm quite interested on it 

Danielo Rodríguez

unread,
Jan 21, 2015, 4:53:22 AM1/21/15
to tiddl...@googlegroups.com


El miércoles, 21 de enero de 2015, 3:48:09 (UTC+1), Arlen Beiler escribió:

What do you need is a sync module that uses Node-webkit. I think you can base your work on the FS syncer.

I actually think I got it working for both single file and "node.js style". The single file one needed a hack to bootprefix.js (in order to work right) and a Saver module which I based off the tiddlyfox saver. I guess that's the same thing as a syncer.

No. A syncer is responsible of sync single tiddlers as single files to the file system. The saver just saves the whole file.
 
If you're running the Node.JS version (like you download from GitHub), you don't even need the browser-server sync, because the server and the browser are one. Literally. So all changes in the browser go directly to the Node FileSystemSaver or whatever it is. 

Could you elaborate this? What do you mean "running the Node.JS version" ? The tiddlywiki version for node? How do you mate it running inside node-webkit?
 
 
That I don't know. Those instructions didn't work for me (because of the bootprefix.js problem), and all you need to do is just paste the file url into node-webkit and it loads it like a regular file. You don't actually need the package.json. 

It worked for me in the past. I did not check recently.

 
TiddlyDesktop sounded a bit complicated, and I wanted to see if there was an easier way. I don't know what features it has beyond a regular tiddlywiki, though.

Complicated? Why is complicated? Is just download and run. Nothing else. How are you trying to use it? 

Arlen Beiler

unread,
Jan 21, 2015, 10:58:01 AM1/21/15
to tiddl...@googlegroups.com
Here is my modification. It is basically a second JS file in the root tiddlywiki folder. You put it beside tiddlywiki.js. https://gist.github.com/Arlen22/d7ad0b6a108fa3cedf72  And it actually uses the same file system syncer. The index.html is just there to get the browser side started, and Tiddlywiki detects that it has a browser AND node, and away it goes. I don't know if this was by design or not, but it works well. 

Here is what I mean by "Running the Node.JS version" (which is as opposed to a single file TiddlyWiki in the browser). TiddlyWiki is designed to run on Node.JS, and all single-file TiddlyWikis are generated this way. These instructions are on windows, but other platforms are similar. 
  1. Go to http://github.com/Jermolene/TiddlyWiki5 and select any branch or tag you want (or just use the master). 
  2. At the bottom of the right sidebar there is a button that says "Download Zip". Click it.
  3. Unpack the zip file into any directory. 
  4. (Optional) If you are using windows, copy node.exe into the directory beside tiddlywiki.js. If you have node.js installed globally that works too. 
  5. Shift + Right Click in the folder (Windows Vista and newer) and click "Open command window here".
  6. Type path/to/node.exe tiddlywiki.js editions/tw5.com-server --server (http://tiddlywiki.com/#Using%20TiddlyWiki%20on%20Node.js)
  7. If it works, it will say "Serving on 8080" or something like that. Open your browser and navigate to 127.0.0.1:8080.
That is what I do if I am wanting to work with the latest GitHub code. I don't usually use NPM. So that's the idea behind my modification. That same code can also run on node-webkit if you start it a little different.

What is the difference between your first post instructions and tiddlydesktop or the instructions to make TW work on node webkit described here: http://tiddlywiki.com/dev/#TiddlyWiki%20on%20node-webkit ?

I guess my first post instructions accomplish the same thing as tiddlydesktop, except that nothing is sandboxed, so TiddlyDesktop is safer. And TiddlyDesktop isn't as complicated as I first thought.

-Arlen

--

Tobias Beer

unread,
Jan 21, 2015, 11:32:17 AM1/21/15
to tiddl...@googlegroups.com
I'd really like to know more about your intentions on running node webkit.
Was it just a proof-of-concept or are you pursuing something with all that?
If so, what?

Best wishes, Tobias.

Arlen Beiler

unread,
Jan 21, 2015, 2:46:11 PM1/21/15
to tiddl...@googlegroups.com
The biggest reason was just to have an easy way to use TiddlyWiki, since I usually use Chrome, and both Chrome and Firefox feel pretty heavy on my old computer. I wasn't even planning to get into the Node.JS version, but I got to thinking about it and decided to take on the challenge. I really don't have any goal in mind. 

-Arlen

--

Danielo Rodríguez

unread,
Jan 22, 2015, 12:46:18 PM1/22/15
to tiddl...@googlegroups.com
Arlen,

I'm following your instructions to try the node version on node-webkit and I'm getting this errors on the dev console:

Uncaught ReferenceError: require is not defined
Not allowed to load local resource:

What I'm doing wrong?

Arlen Beiler

unread,
Jan 22, 2015, 1:14:52 PM1/22/15
to tiddl...@googlegroups.com
I'm sorry, those 7 steps are for running TiddlyWiki on Node.JS as a webserver. And you open it in a regular browser. The way it is there, with each tiddler in a separate file, is what I'm calling the Node.JS version, since I don't know what else to call it. Sorry for the confusion.

Now in order to run those files in node-webkit, the code you need is here: https://gist.github.com/Arlen22/d7ad0b6a108fa3cedf72
  1. Open that link and copy index.htm and nodewebkit.js into the root of the tiddlywiki folder. 
  2. Open package.json, and copy the two objects in the gist's package.json into it. 
  3. Package.json already has a "main" object farther down which you will need to remove. 
  4. Drag the entire tiddlywiki folder onto the node-webkit executable.  
That should work. It does seem like there are still a few glitches, but it at least runs for me.
-Arlen

--

Arlen Beiler

unread,
Jan 22, 2015, 1:28:48 PM1/22/15
to tiddl...@googlegroups.com
Ok, I just discovered something. The body tag needs the class tc-body for it to look right. I think that's what the "few glitches" were from. I've updated my gist.

Danielo Rodríguez

unread,
Jan 22, 2015, 3:43:32 PM1/22/15
to tiddl...@googlegroups.com


El jueves, 22 de enero de 2015, 19:28:48 (UTC+1), Arlen Beiler escribió:
Ok, I just discovered something. The body tag needs the class tc-body for it to look right. I think that's what the "few glitches" were from. I've updated my gist.

Ok, that was the only thing left to make it working on my laptop (windows 7).

I would say "copy the content of the tw folder" instead of copy the TW folder. Some people may think they have to copy the TW folder as a subfolder of their node-webkit folder.

This is awesome!! Works like a charm. Thank you very much for this. 

There is something left... It does not work if I open just the nw.exe. I have to drop the index.html file into the window to make it working. Does the same happen to you?

Arlen Beiler

unread,
Jan 22, 2015, 4:42:49 PM1/22/15
to tiddl...@googlegroups.com
No, the way I do it is keep the two folders entirely separate (TiddlyWiki and Node-Webkit), and then run node-webkit with the tiddlywiki folder path as its first argument. In Windows, you just drag the entire folder onto nw.exe itself and it does the same thing. 

Hope that helps.
-Arlen

--

Danielo Rodríguez

unread,
Jan 23, 2015, 5:12:16 AM1/23/15
to tiddl...@googlegroups.com
Hello Arlen


El jueves, 22 de enero de 2015, 22:42:49 (UTC+1), Arlen Beiler escribió:
No, the way I do it is keep the two folders entirely separate (TiddlyWiki and Node-Webkit), and then run node-webkit with the tiddlywiki folder path as its first argument. In Windows, you just drag the entire folder onto nw.exe itself and it does the same thing. 

Doing it that way node-webkit just opens and then closes. I would like to know if you have tested this on windows. Having everything on the same folder works, but not on different folders. I even tried from the command line with nw.exe tw5folder and it does not throw any error.

Danielo Rodríguez

unread,
Jan 23, 2015, 5:38:00 AM1/23/15
to tiddl...@googlegroups.com
Ok

I followed the first instructions again. Now it works using different folders BUT with the same problem as before: When I open the nw.exe program it throws the require is not define errors. But, If I navigate to the root folder from within node-webkit and then I click on index.html it works as expected. I would love to know why.

Arlen Beiler

unread,
Jan 23, 2015, 6:48:07 PM1/23/15
to tiddl...@googlegroups.com
Doing it that way node-webkit just opens and then closes. I would like to know if you have tested this on windows. Having everything on the same folder works, but not on different folders. I even tried from the command line with nw.exe tw5folder and it does not throw any error.

I remember that happening, but I'm not quite sure what the problem was. Yes, Windows is all I use. 

I followed the first instructions again. Now it works using different folders BUT with the same problem as before: When I open the nw.exe program it throws the require is not define errors. But, If I navigate to the root folder from within node-webkit and then I click on index.html it works as expected. I would love to know why.

Could you quote the instructions you are referring to so I know which ones you mean for sure. Also, make sure that the file name in package.json is correct, and not html vs htm or vice versa. 

On Fri, Jan 23, 2015 at 5:38 AM, Danielo Rodríguez <rdan...@gmail.com> wrote:
Ok

I followed the first instructions again. Now it works using different folders BUT with the same problem as before: When I open the nw.exe program it throws the require is not define errors. But, If I navigate to the root folder from within node-webkit and then I click on index.html it works as expected. I would love to know why.

--

Arlen Beiler

unread,
Jan 23, 2015, 6:56:31 PM1/23/15
to tiddl...@googlegroups.com
Actually, I just read over your emails again, and finally saw the second line that you posted ( "Not allowed to load local resource:" ). Definitely check that index.htm is set right in package.json. I just tried changing the name to something wrong, and that is the error I get. Hope that helps.  :)
-Arlen

Danielo Rodríguez

unread,
Jan 24, 2015, 6:29:32 AM1/24/15
to tiddl...@googlegroups.com


El sábado, 24 de enero de 2015, 0:56:31 (UTC+1), Arlen Beiler escribió:
Actually, I just read over your emails again, and finally saw the second line that you posted ( "Not allowed to load local resource:" ). Definitely check that index.htm is set right in package.json. I just tried changing the name to something wrong, and that is the error I get. Hope that helps.  :)
-Arlen

I feel so dumb!!! Stupid, stupid boy!
That was the problem. In this case, the lack of L at the end of the extension. After that, it worked like a charm. I have very bad eye for details like this. Thank you so much, for both, helping my making this working AND creating the instructions for  using the NODE.JS version of TW as a single application. 

Now it's time to see how can we have multiple wikis without having multiple copies of the TW5 repo or node-webkit.

THANK YOU!

Arlen Beiler

unread,
Jan 24, 2015, 8:37:49 AM1/24/15
to tiddl...@googlegroups.com
You can have multiple wikis if you use different editions. Each edition folder is a wiki. In nodewebkit.js, that's what  $tw.boot.argv = ['./editions/server']; is. You could possibly add a command line argument. That'd be something to explore on the node-webkit side. Running at the same time? Not right now I don't think. Well, maybe. You'd still have to run it as a second instance. 

--

Arlen Beiler

unread,
Jan 24, 2015, 10:19:00 AM1/24/15
to tiddl...@googlegroups.com
Not to confuse things, but here is a simpler way of running the github files which does not require any modifications to package.json, and only uses index.htm. https://gist.github.com/Arlen22/45f1a460c9e348fa50ad

Jeremy Ruston

unread,
Jan 28, 2015, 3:19:15 PM1/28/15
to TiddlyWiki, Arlen Beiler
Hi Arlen

> As you may be aware, single file TiddlyWiki does not seem to work on Node-WebKit. Anyway, here is a solution which will allow it to work. You still need to use the file save dialog that pops up when you click save changes, but I've got a solution to that as well, which I will try to post later. 

I've done quite a lot of work on the platform handling for 5.1.8 in order to get the new version of TiddlyDesktop up and running. I haven't paid attention to the standalone nwjs configuration, but would welcome suggestions for core mods to make it work better.
I had no idea there were tiddlywiki questions on stackoverflow. I'd better dust off my account and start watching - many thanks for stepping up to provide an answer.

Best wishes

Jeremy.


--
Jeremy Ruston
mailto:jeremy...@gmail.com
Reply all
Reply to author
Forward
0 new messages