VS Code Extension to edit tiddler through web api

1

Inspired by TiddlyWiki5 VS Code Extension: Save content to TiddlyWiki, I quickly put an VS Code extension with helping of AI.

This vscode-tiddlyedit extension is used to edit tiddlers configured with Node.js.

The main features now are

  • Search Tiddlers: Search for tiddlers using a search bar.
  • Syntax Highlighting: Enhanced readability for TiddlyWiki markup using TiddlyWiki5 Syntax.
  • Edit Tiddlers: Quickly edit and save tiddlers.
  • Auto Completion: Auto complete using Auto Complete plugin for TiddlyWiki. Triggered by Ctrl+Space.

It is in very early stage of development. Welcome for any suggestions.

This VS Code extension will modify tidders in Tiddlywiki. Use it with caution. Test it in the non-production environment and create a backup.

2

After developing and testing in this week, this extension is working well for me. I released a version v 0.1.0 on github (Release v0.1.0 · byzheng/vscode-tiddlyedit · GitHub). Welcome to test and comments it.

A small TiddlyWiki plugin can be used to bidirectional communications between browser and VS Code through a websocker server attached to TiddlyWiki http server (GitHub - byzheng/tw-livebridge).

You can

  • click a button in VS Code to view a tiddler in browser if Tiddlywiki is opening.
  • click a button in the view bar in Tiddlywiki to edit a tiddler in VS Code.
3

Very interesting. I’ll definitely test this this weekend.

4

Found your plugin today, looks promising!
Running local tiddlywiki via node, did some quick tests but ran into som initial issues with API filter blocking that I quickly found how to solve, at least the default filter, by looking at: https://tiddlywiki.com/static/WebServer%20API%3A%20Get%20All%20Tiddlers.html and then adding a filter matching the default in the plugin.

I have two questions:
When I now tried to search for a custom term I notice that
#1 Seems like I will have to configure more filters to get it to work
#1.1 I turned on all external filters and it worked, but is there a better way to just allow the search?

node log output:
Blocked attempt to GET /recipes/default/tiddlers.json with filter: [all[tiddlers]!is[system]search:title[mysearchterm]limit[10]]

Feature request: :slight_smile:
Create(edit and save) a new tiddler from the plugin

5

See TiddlyWiki WebAPI documentation for more detail.

For my best knowledge, I don’t think I can allow just search without enabling all external filters as I just use webAPI to query tiddlers.

About create a new tiddler, I also plan to have this feature but not sure how to implement it.

6

I release a new version 0.2.3 for this VS extension with two new features

  • add and remove tags
  • clickable links in the VS Code to open tiddler in the browser

Can find it on github or vs code market

7

I update a new version of tiddlyedit v0.2.8 with two changes with tw-livebridge.

  • Edit the system tiddler. Thanks contributions from @ LovelyShaun

  • Edit in vscode, and live preview in browser. The editing line will highlight for 1s. But preview might delay a for few second depending the config about frequency of auto saving (my config is 1s).

See example below

preview