Autocompleting Links: How to pull a list of all (non-system) tiddlers into a JavaScript tiddler

[Vaughn Papenhausen]

Building on a recent question of mine: https://groups.google.com/forum/#!topic/tiddlywikidev/8GcocOUuwMU

As before: I am the noobiest of noobs, and have no idea what I'm doing when it comes to code, but am attempting to muddle my way through anyway.

SnowGoon has an awesome plugin that allows you to simply type "[[" and pop up a list of tiddlers, and search through it by simply continuing to type. I'm trying to get the same sort of functionality within the CodeMirror editor. CodeMirror has an autocomplete extension, which can do things like pop up a list of all the words in the current text field and autocomplete from that. What I'm trying to do is push a different list to that autocomplete popup: instead of a list of all the words in the current text field, I want it to pop up a list of all (non-system) tiddler titles, just like SnowGoon's plugin. The CodeMirror plugin would handle everything like making the popup show up at the cursor and everything, I just need to pass a different list to it.

I'm pretty sure the filter I need is: [all[tiddlers]!is[system]]. But what I'm not sure of is how to make use of this filter. CodeMirror is written in JavaScript, not WikiText, so I have to be able to use this filter from within a JavaScript tiddler. But most of the documentation I've found is for how to do things in WikiText, not JavaScript.

Here's the closest thing I've been able to cobble together:

var allTiddlers = $tw.wiki.filterTiddlers("[all[tiddlers]!is[system]]")

But I'm pretty sure I'm still doing something wrong, since it's not doing what I want yet. Would this be the way to create a variable called "allTiddlers" whose contents is an array of the titles of the non-system tiddlers in the current wiki? I.e. if the wiki contains 3 tiddlers, "Test 1", "Test 2" and "Test 3", I want an array like this:

allTiddlers == ["Test 1", "Test 2", "Test 3"]

Am I on the right track? If not, how would I do this?

[Saq Imtiaz]

Vaughn:

That line of code to get all the tiddlers looks correct. I actually did, a while ago, modify the anywords hint in codemirror to autocomplete tiddler titles. It wasn't shared as it overrides the behaviour of autocompleting words already in the text area, instead of adding a new autocomplete.

I've uploaded it for you here:

https://saqimtiaz.github.io/sq-tw/code-mirror-autocomplete-demo.html

You should be able to use it as is, or compare to your code to see where you went wrong.

A good way to test your code is to use a hardcoded array like 

var allTiddlers = ["Test 1", "Test 2", "Test 3"];

and see if you can get those values to show in the autocomplete.

Also, the dev tools in your browser, and the sources tab, lets you set breakpoints and examine what is going on in the code as it runs (values of variables etc).

Regards,

Saq

[Vaughn Papenhausen]

Thanks Saq! That's incredibly helpful!

[Vaughn Papenhausen]

Turns out mine was working better than I thought! I thought it wasn't working because I was hitting ctrl-space and nothing was happening, but the same thing happened with yours, and so that got me to try putting in a couple characters before hitting ctrl-space, which worked both for yours and for mine. Thanks again so much for putting this up! It will be really helpful as I continue to tinker with this.

On Tuesday, May 5, 2020 at 6:46:24 AM UTC-4, Saq Imtiaz wrote:

[Saq Imtiaz]

Happy it helped. You should probably exclude drafts as well.

[Vaughn Papenhausen]

Good idea, thanks