[TWC] [NEW Plugin] AutoSuggestPlugin

[Albert Riedinger]

Hi all,

a few days ago Ramnath requested[1] a tiddler link suggestion feature in edit mode, so I wrote a quick-and-dirty commands plugin[2] for the good old TWC. It is just an implementation of At.js[3], which allows word suggestions in textareas. After activating this feature with the toolbar command, typing double square brackets "[[" in edit text field will suggest tiddler names, while left-angle brackets(?) "<<" will suggest you installed macros.
I'm not a programmer and it is my first public plugin, but I think that your TW won't explode using this little hack :P

Have fun and let me know if you find it useful!

Cheers,
Albert


[1] https://groups.google.com/d/topic/tiddlywiki/b5xYteF6U9c/discussion
[2] http://autosuggest.tiddlyspace.com/#AutoSuggestPlugin
[3] https://github.com/ichord/At.js/ (see also: https://github.com/ichord/Caret.js/)

[Ramnath Babu T.J]

Thanks Albert!

:)
Ramnath

[PMario]

Hi Albert,

.. That's brilliant :)

... but I'd change the default button texts. The button has to show "autosuggest off" that the plugin works. ... and it would be nice, if the command could save it's state to the tiddler, which is kind of tricky ...

I did something similar for the codemirror editor plugin, to save the F11 "full size mode". The save custom field code is part of ExtraKeysAddOn [1]. So  you'd need the

Story.prototype.hasTiddlerField = function(title,field) function.

and this "save value part" from the toggleMaxHeight function

            var f = story.hasTiddlerField(title,'cm.height'); 
            if (!f ) {
                story.addCustomFields(tidEl, 'cm.height:'+cmHeight);
            }
            else {
                f.setAttribute('value', cmHeight);      
            }
            ed.refresh();


so you'd neeed to replace "cm.height" with your auto suggest status. .... 

Reading the code could be in your command

    // doesn't set tid if title is a shadow tiddler
    var tid = store.getTiddler(title);   // title is defined as a handler() param. 

    if (tid.fields['cm.height']) { ... do stuff

have fun!
mario

[1] http://codemirror.tiddlyspace.com/#ExtraKeysAddOn

[Albert Riedinger]

Thank you both!

@Mario

Your per-tiddler-approach is nice! But as you mentioned in the TiddlersBar-scroll-position-thread it would affect the modification date. Maybe setting chkForceMinorUpdate temporary to true could help?

I've just implemented a cookie based query in the new version[1] which saves the state globally. Hijacking editTiddler command is probably a bit too much, but I don't know an easier way.
In the next version I would try your solution.

[1] http://autosuggest.tiddlyspace.com/#AutoSuggestPlugin

--
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.

[PMario]

On Thursday, March 27, 2014 4:24:29 PM UTC+1, Albert Riedinger wrote:

@Mario

Your per-tiddler-approach is nice! But as you mentioned in the TiddlersBar-scroll-position-thread it would affect the modification date. Maybe setting chkForceMinorUpdate temporary to true could help?

Yes, that's true, but if you need autocomplete, you modify the tiddler anyway. So I don't see a problem there, since you enter edit mode.

The tab autoscroll plugin, modifies tidders in view mode. ...

-m

[Yakov]

Wow, Albert,

great stuff! Do you plan to implement suggestions for the [[some text| syntax (to complete it to [[some text|target tiddler]])? Also, it would be nice if adding the space symbol after ]] is optional.

This approach surely have potential for different applications, thanks for that.

Best regards,
Yakov.

среда, 26 марта 2014 г., 20:52:02 UTC+4 пользователь Albert Riedinger написал:

[Albert Riedinger]

Hi Yakov,

Thank you, I'm glad you like it.

Initially this plugin was an experiment, but I also think that it has more potential. I'm a novice in JavaScript and especially in RegExp so it's hard for me to achieve progress. But it's fun and I'll try my best :)

Unfortunately At.js doesn't support unicode (and won't in near future), so now I try to work around this issue without using more dependencies like XRegExp library. I'm german so support for diacritics (like äöü) is critical for me. I already tested some solutions and it worked more or less, but I had no time to implement it yet. Does it work for you using kyrillic characters (if you use any at all)?

Implementing support for pretty links should be my next challenge. As I said, I'm new to all of this and it's kind of complicated to write a RegExp for such a case. Maybe you have some ideas[1]? Matching "[[..." is easy, but I don't really know how to match simultaneously this: "[[some text|...".

Making space symbol after suffix ("]]") an option should be easy. I will implement this right now and release it on tiddlyspace soon.

Spasiba Yakov for your interest and your suggestions!

Albert

[1] see matcher function of At.js > https://github.com/ichord/At.js/blob/master/dist/js/jquery.atwho.js#L616

--

[PMario]

On Thursday, April 3, 2014 10:03:22 AM UTC+2, Albert Riedinger wrote:

Initially this plugin was an experiment, but I also think that it has more potential. I'm a novice in JavaScript and especially in RegExp so it's hard for me to achieve progress.

IMO you should not add 3rd party regExp libraries. I'm not sure, why you wanted to do that?
One of the best regexp related sites I know is: http://www.regular-expressions.info/
 

Unfortunately At.js doesn't support unicode (and won't in near future), so now I try to work around this issue without using more dependencies like XRegExp library.

 

I'm german so support for diacritics (like äöü) is critical for me.

The default built in regexp handler, works very well with öä. But may be the used libraries don't.
 

-m

[Yakov]

Hello Albert,

четверг, 3 апреля 2014 г., 12:03:22 UTC+4 пользователь Albert Riedinger написал:

Hi Yakov,

Thank you, I'm glad you like it.

Initially this plugin was an experiment, but I also think that it has more potential. I'm a novice in JavaScript and especially in RegExp so it's hard for me to achieve progress. But it's fun and I'll try my best :)

Unfortunately At.js doesn't support unicode (and won't in near future), so now I try to work around this issue without using more dependencies like XRegExp library. I'm german so support for diacritics (like äöü) is critical for me. I already tested some solutions and it worked more or less, but I had no time to implement it yet. Does it work for you using kyrillic characters (if you use any at all)?

Not sure what do you mean here by "doesn't support". I've tried to type tiddler names starting from cyrillics ([[До) and got the proper suggestions; I've even created a tiddler which name starts from ASCII letters and contain cyrillics (New Tiddler Ъ) and if I type [[Ъ or even [[ъ (not capital letter), I get the right suggestion listed. What exactly didn't work for you?

By the way, I've noticed that I have to click the "autosuggest off" button twice to make it switch to "on", this is a small bug, I'd say. Not sure what's the cause.
Also, I'd either omit the hideReadOnly param (to keep the code clean) or set it to true (no reason for a guest to get the suggestions for editing as he or she won't be any editing anyway). By the way, in TiddlySpace, the "view instead of edit" mode for guests doesn't allow to type any letters, so this doesn't work as demo. If you'd like to show some demo directly in the space, you have to manually create a tiddler with some <html>...</html> containing a textarea where a guest can type and (s)he gets the suggestions.
 

Implementing support for pretty links should be my next challenge. As I said, I'm new to all of this and it's kind of complicated to write a RegExp for such a case. Maybe you have some ideas[1]? Matching "[[..." is easy, but I don't really know how to match simultaneously this: "[[some text|...".

Well, the easiest RegExp the matches [[some text| would probably be /\[\[[^\|\]]+?\|/, but I'm not sure how this should be passed to .. is it .atwho method that sets the autoSuggestions?

Making space symbol after suffix ("]]") an option should be easy. I will implement this right now and release it on tiddlyspace soon.

I'll add a couple of ideas just see some perspectives. One this is replacing html-entities (special symbols) with actual symbols like this:
* let's imagine I'd like to add a left-to-right arrow (&rarr;)
* I start to type &r
* I get a "→" suggestion -- not "&rarr;"
* I chose it and get much clearer wiki-code, without that unreadable "&rarr;" stuff
Though, I don't know if there's an interface to get a list of all these "abbriviations" (rarr, larr, uarr, darr, harr, times, bull, .......................) and an interface to get there unicode equivalent.
Also, "--" -> &nash;/&mdash; could be processed in this manner.

A similar thing can be used with MathJax plugin to turn \rho to ρ etc. (though, just autoreplacing can be done instead of autosuggesting replacement, but autosuggesting seems to be more flexible)

Another possible application is to combine this with CodeMirror for TiddlyWiki (see [1] for the latest release and discussion). This can be another huge step in turning TW into a dev environment. Fortunately, Mario is here and probably can comment this somehow.

Finally, autoSuggestions can be used in the tags line which seems to be more beatiful and faster than Udo's interface [2] (although, Udo's solution implements some smart algorithm for ranging suggestions).
 

Spasiba Yakov for your interest and your suggestions!

You are welcome (it's acually "spasibo" ;)

Best regards,
Yakov.

[1] https://groups.google.com/forum/#!topic/tiddlywiki/KRnQvzazULE
[2] http://tiddlywiki.abego-software.de/#IntelliTaggerPlugin
 

[Yakov]

Hello Albert,

This may be of interest:

in the current snapshot (0.2.2) there's

config.options.chkAutoSuggestGlobal

option that is defined in your code, but which is not used anyhow;
at the same time there's

chkAutoSuggestScope

option which is used but is not defined. Looks like it was the same option and you renamed it in some parts of the code, but forgot to do so in others (or some other mistake took place).

By the way, the tag suggestion feature works nicely! First, I've suspected that it can interact poorly with transclusions when one wants to transclude a section:
<<tiddler [[some tiddler##
or with second level of numbered lists
## list item
but tests showed that the workflow is quite reasonable: in the first case there's no suggestion at all, and also if one uses AutoSuggestion to get the tiddler, (s)he will get
<<tiddler [[some tiddler]]
first and then go add the section part. And in the second case when a space is added after ##, the suggestions are hidden.

These made me think, though..
* one more idea: autosuggestions of sections/slices can be added! below are some use-cases, "l" represents the cursor:
<<tiddler [[some tiddler##l
<<tiddler [[some tiddler::l
<<tiddler [[some tiddler##l]]
<<tiddler [[some tiddler::l]]
* there's one more case where tag suggestions are useful: filters there are two cases:
** tag filter. Examples of use-cases (obviously, there's no need for the ## addition in this cases):
<<list filter '[tag[l
<<list filter '... [tag[l
<<list filter '[tag[l]]'>>
<<list filter '[tag[l]] ...'>>
<<list filter '... [tag[l]]'>>
    as you can see, these can be described as /\[tag\[([^\]]*)($|\])/m if I'm not mistaking
** other filters that can "eat" tags:
<<list filter '[filterName[##|
    (and versions with or without smth before/after as well)
In these two cases, of'course, instead of [[tagName]], either tagName]] or tagName should be inserted.

Great work!

Best regards,
Yakov.

четверг, 3 апреля 2014 г., 17:01:50 UTC+4 пользователь Yakov написал:

[Yakov]

By the way, the results of testing with CodeMirror. in CodeMirror editor, the suggestions are shown without any changes of AutoSuggestPlugin (!), and if I click a suggesion with the cursor, it is inserted as expected. However, the behaviour of up/down arrows and enter key is not what is expected: when I press enter (after, say, I've typed [[To and the first suggestion is ToolbarCommands), I get both linebreak and the suggestion inserted, resulting in
[[To
olbarCommands
A similar thing happens with arrows: when I press "down" to select another suggestion, the cursor goes down as well, making the suggestion dropdown disappear.

I'll report when I test this with the View Mode/Inline Editing plugins [1] (presumably it's enough to add the autoSuggest command to the ViewToolbar slice..)

Best regards,
Yakov.

[1] https://groups.google.com/forum/#!topic/tiddlywiki/0FT6iBneYOk

среда, 9 апреля 2014 г., 0:21:43 UTC+4 пользователь Yakov написал:

[Leo Staley]

This is really nifty! I'm gonna keep an eye on this as it develops. Would it be possible for it to also auto suggest sections and slices? 

I mean, if I type [[TiddlerName## could it be made to also auto suggest the possible sections/headers from within that tiddler? How about for slices? 

[Albert Riedinger]

Sorry for my very late reply, but currently I'm very busy.

Thank you all for all the detailed feedback. This motivates me a lot!

@Mario

The default built in regexp handler, works very well with öä. But may be the used libraries don't.

The used AtWho libraries doesn't support diacritics out of the box, but I fixed this in the current release without using any 3rd party libraries.

@Yakov

Not sure what do you mean here by "doesn't support". I've tried to type tiddler names starting from cyrillics ([[До) and got the proper suggestions; I've even created a tiddler which name starts from ASCII letters and contain cyrillics (New Tiddler Ъ) and if I type [[Ъ or even [[ъ (not capital letter), I get the right suggestion listed. What exactly didn't work for you?

You see, I'm totally new to RegExp :) The default AtWho matcher[1] matches only "A-Za-z0-9" but no diacritic[2] characters like äöü?é etc. I've added a small RegExp hack in the current release ("\x7f-\xff"), so now it works. I should also modify the highlighter function[3] in a next version.

By the way, I've noticed that I have to click the "autosuggest off" button twice to make it switch to "on", this is a small bug, I'd say. Not sure what's the cause.

Hmm, this is strange as it works for me as expected. Does this bug still occur in the current release (0.2.4)?

Also, I'd either omit the hideReadOnly param (to keep the code clean) or set it to true (no reason for a guest to get the suggestions for editing as he or she won't be any editing anyway).

FIXED

By the way, in TiddlySpace, the "view instead of edit" mode for guests doesn't allow to type any letters, so this doesn't work as demo. If you'd like to show some demo directly in the space, you have to manually create a tiddler with some <html>...</html> containing a textarea where a guest can type and (s)he gets the suggestions.

I wasn't aware of it. I've added a small example tiddler for guests just to show them how it works (tiddler suggestion only).

Well, the easiest RegExp the matches [[some text| would probably be /\[\[[^\|\]]+?\|/, but I'm not sure how this should be passed to .. is it .atwho method that sets the autoSuggestions? 

Well, this is more tricky for a novice like me. I tried several RegExps but without luck. I don't have enough time at the moment to get into it, but it is indeed the most important feature to make this plugin (more) usable. I have to take more time to dive deeper into RegExp stuff. Hope to fix this soon (#1 on my wishlist). If you like to help, you could read the documentation about custom callbacks[4] of ".atwho" method. These callbacks can be passed to ".atwho" with the "callbacks" property. You can see my custom callback for the matcher function ("cbMatcher") in the source code of AutoSuggestPlugin. Hope that helps a bit.

I'll add a couple of ideas just see some perspectives. One this is replacing html-entities (special symbols) with actual symbols like this:
* let's imagine I'd like to add a left-to-right arrow (&rarr;)
* I start to type &r
* I get a "→" suggestion -- not "&rarr;"
* I chose it and get much clearer wiki-code, without that unreadable "&rarr;" stuff
Though, I don't know if there's an interface to get a list of all these "abbriviations" (rarr, larr, uarr, darr, harr, times, bull, .......................) and an interface to get there unicode equivalent.
Also, "--" -> &nash;/&mdash; could be processed in this manner.

A similar thing can be used with MathJax plugin to turn \rho to ρ etc. (though, just autoreplacing can be done instead of autosuggesting replacement, but autosuggesting seems to be more flexible)

Very nice ideas Yakov. I think that those suggestion patterns shouldn't be implemented by default as every AtWho listener affects the overall editing performance (especially on mobile devices). Recently I thought about user defined suggestion patterns which are defined in a separate config tiddler. Maybe this could meet your need?

Another possible application is to combine this with CodeMirror for TiddlyWiki (see [1] for the latest release and discussion). This can be another huge step in turning TW into a dev environment. Fortunately, Mario is here and probably can comment this somehow.

I had the same idea as I started writing this plugin, but this is probably beyond my skills :) I also use CodeMirror with TW a lot and would love to see this combination. @Mario, what do you think?

Finally, autoSuggestions can be used in the tags line which seems to be more beatiful and faster than Udo's interface [2] (although, Udo's solution implements some smart algorithm for ranging suggestions).

FIXED in 0.2.2

I also thougt about an additional suggestion pattern (maybe ##* or the like) which uses smart tag suggestions like "tiddlers that uses these tags also use ...". I have to study Udo's algorithm ;)

in the current snapshot (0.2.2) there's

config.options.chkAutoSuggestGlobal

option that is defined in your code, but which is not used anyhow;
at the same time there's

chkAutoSuggestScope

option which is used but is not defined. Looks like it was the same option and you renamed it in some parts of the code, but forgot to do so in others (or some other mistake took place).

FIXED

You're right, I renamed "chkAutoSuggestScope" to "chkAutoSuggestGlobal" and forgot to do this in some parts. BTW, this option will be used in future for switching between cookie-based (globally) and per-tiddler -based (locally in custom field) saving of autosuggest status (on/off) like Mario proposed before.

By the way, the tag suggestion feature works nicely! First, I've suspected that it can interact poorly with transclusions when one wants to transclude a section:
<<tiddler [[some tiddler##
or with second level of numbered lists
## list item
but tests showed that the workflow is quite reasonable: in the first case there's no suggestion at all, and also if one uses AutoSuggestion to get the tiddler, (s)he will get
<<tiddler [[some tiddler]]
first and then go add the section part. And in the second case when a space is added after ##, the suggestions are hidden.

This behaviour wasn't intended by me, as I left the regexp matcher of AtWho at the default value (except for the diacritics hack mentioned above). But good to know that it works well in most cases :)

These made me think, though..
* one more idea: autosuggestions of sections/slices can be added! below are some use-cases, "l" represents the cursor:
<<tiddler [[some tiddler##l
<<tiddler [[some tiddler::l
<<tiddler [[some tiddler##l]]
<<tiddler [[some tiddler::l]]
* there's one more case where tag suggestions are useful: filters there are two cases:
** tag filter. Examples of use-cases (obviously, there's no need for the ## addition in this cases):
<<list filter '[tag[l
<<list filter '... [tag[l
<<list filter '[tag[l]]'>>
<<list filter '[tag[l]] ...'>>
<<list filter '... [tag[l]]'>>
    as you can see, these can be described as /\[tag\[([^\]]*)($|\])/m if I'm not mistaking
** other filters that can "eat" tags:
<<list filter '[filterName[##|
    (and versions with or without smth before/after as well)
In these two cases, of'course, instead of [[tagName]], either tagName]] or tagName should be inserted.

Very usefull ideas! I've put it on my feature wishlist. As you can see I've implemented several experimental suggestions for sections, slices and fields in 0.2.4, but they only work with the current tiddler. It is just a test and serves more as a basis for further implementations.

By the way, the results of testing with CodeMirror. in CodeMirror editor, the suggestions are shown without any changes of AutoSuggestPlugin (!), and if I click a suggesion with the cursor, it is inserted as expected. However, the behaviour of up/down arrows and enter key is not what is expected: when I press enter (after, say, I've typed [[To and the first suggestion is ToolbarCommands), I get both linebreak and the suggestion inserted, resulting in
[[To
olbarCommands
A similar thing happens with arrows: when I press "down" to select another suggestion, the cursor goes down as well, making the suggestion dropdown disappear.

Thank you for testing! And nice that it works more or less out of the box. Obviously this behaviour should be related to a conflict with CodeMirrors handling of keyboard events, but actually I don't know how to fix this.

 

I'll report when I test this with the View Mode/Inline Editing plugins [1] (presumably it's enough to add the autoSuggest command to the ViewToolbar slice..)

Thank you Yakov, hope it works without any conflicts.

@Leo

This is really nifty! I'm gonna keep an eye on this as it develops. Would it be possible for it to also auto suggest sections and slices? 

I mean, if I type [[TiddlerName## could it be made to also auto suggest the possible sections/headers from within that tiddler? How about for slices?

Thank you Leo, nice to hear that you like it. I've implemented a temporary solution for section, slice and field suggestion, but currently it only supports suggestions for the current tiddler only. If I have more time soon I will fix this in the next release. Stay tuned ...

Best regards,
Albert

[1] https://github.com/ichord/At.js/blob/master/dist/js/jquery.atwho.js#L640
[2] http://en.wikipedia.org/wiki/Diacritic
[3] https://github.com/ichord/At.js/blob/master/dist/js/jquery.atwho.js#L694
[4] https://github.com/ichord/At.js/wiki/Callbacks

[Albert Riedinger]

Today I worked out a temporary solution for pretty links, so it is possible now to type "[[SOME_LABEL|" which gives you tiddler title suggestions.
It was a tough nut to crack for a regex newbie like me, but it works :)

Try it out and have fun[1]!
Albert

[1] http://autosuggest.tiddlyspace.com/#AutoSuggestPlugin

[Yakov]

Hello Albert,

@Yakov

Not sure what do you mean here by "doesn't support". I've tried to type tiddler names starting from cyrillics ([[До) and got the proper suggestions; I've even created a tiddler which name starts from ASCII letters and contain cyrillics (New Tiddler Ъ) and if I type [[Ъ or even [[ъ (not capital letter), I get the right suggestion listed. What exactly didn't work for you?

You see, I'm totally new to RegExp :) The default AtWho matcher[1] matches only "A-Za-z0-9" but no diacritic[2] characters like äöü?é etc. I've added a small RegExp hack in the current release ("\x7f-\xff"), so now it works. I should also modify the highlighter function[3] in a next version.

Ah, ok, now I've found this code bit. May be some [^...] solution is also of interest, see [1] for example (I guess, we don't need to exclude all the special symbols). PS actually, see below in this post.

By the way, I've noticed that I have to click the "autosuggest off" button twice to make it switch to "on", this is a small bug, I'd say. Not sure what's the cause.

Hmm, this is strange as it works for me as expected. Does this bug still occur in the current release (0.2.4)?

Now this is fixed for existing tiddlers. Once I create a new tiddler, this behaviour takes place (until it is saved and opened again).

By the way, in TiddlySpace, the "view instead of edit" mode for guests doesn't allow to type any letters, so this doesn't work as demo. If you'd like to show some demo directly in the space, you have to manually create a tiddler with some <html>...</html> containing a textarea where a guest can type and (s)he gets the suggestions.

I wasn't aware of it. I've added a small example tiddler for guests just to show them how it works (tiddler suggestion only).

The demo works nicely. However, I've noticed that you "reimplement" the autosuggesion engine in the script element. What do you think about implementing a general function, sort of suggestAt(element,mode), which can be applied to a textarea or an input element and adds autosuggesting to that element? (I'm not sure if it can be implemented in such a way, can it?) Once it is implemented, you don't have to worry much about Inline Editing or PasteUp helper or other alternative editors, as one can write a little snippet that applies suggestAt to the editor, and it's done (except for CodeMirror, which is not actually a simple textarea). Likewise, you can apply this to your demo (hence, for quick testing one will have to just open the demo page using their browser). The mode param here is to distinguish "ordinary editor", "tags editor" and may be others.

Well, the easiest RegExp the matches [[some text| would probably be /\[\[[^\|\]]+?\|/, but I'm not sure how this should be passed to .. is it .atwho method that sets the autoSuggestions? 

Well, this is more tricky for a novice like me. I tried several RegExps but without luck. I don't have enough time at the moment to get into it, but it is indeed the most important feature to make this plugin (more) usable. I have to take more time to dive deeper into RegExp stuff. Hope to fix this soon (#1 on my wishlist). If you like to help, you could read the documentation about custom callbacks[4] of ".atwho" method. These callbacks can be passed to ".atwho" with the "callbacks" property. You can see my custom callback for the matcher function ("cbMatcher") in the source code of AutoSuggestPlugin. Hope that helps a bit.

Ok, in your current implementation, try this: instead of the line
regexp = new RegExp(flag+"([^\\x00-\\xff]*)$|"+flag+"(["+chars+"]*[^|\\]])$|"+flag+"["+chars+"]*\\|(["+chars+"]*[^|\\]])$", "gi");
insert
regexp = new RegExp(flag+ "([^\\|\\n\\]]*)$|"+ flag+"[^\\|\\n\\]]+\\|([^\\|\\n\\]]*)$", "gi");

Test results: your version supports
[[text|
[[some text|
but doesn't support
[[текст|
(which is using cyrillics). Mine supports all this "syntaxes".

Explanation: by creating the "chars" variable you're trying to count all the possible symbols. What I propose (and proposed earlier in the citation above) is to use "all except" regexp ([^...] syntax: in the link name we're expecting any symbol except linebreak, pipe or ], so I used [^\\|\\n\\]]. In the link target, the situation is the same, so I use this thrice. In fact, you can create a variable for this part and write something like:

var linkSymbol = "[^\\|\\n\\]]"
regexp = new RegExp(flag+"("+linkSymbol+"*)$|"+ flag+linkSymbol+"+\\|("+linkSymbol+"*)$", "gi");

don't forget to turn
return match[3] || match[2] || match[1];
into
return match[2] || match[1];
as there's only two situations in this case.

If you'd like to have a RegExp exercice, try to implement the same idea in the cbMatch (and get rid of the chars variables).

I'll add a couple of ideas just see some perspectives. One this is replacing html-entities (special symbols) with actual symbols like this:
* let's imagine I'd like to add a left-to-right arrow (&rarr;)
* I start to type &r
* I get a "→" suggestion -- not "&rarr;"
* I chose it and get much clearer wiki-code, without that unreadable "&rarr;" stuff
Though, I don't know if there's an interface to get a list of all these "abbriviations" (rarr, larr, uarr, darr, harr, times, bull, .......................) and an interface to get there unicode equivalent.
Also, "--" -> &nash;/&mdash; could be processed in this manner.

A similar thing can be used with MathJax plugin to turn \rho to ρ etc. (though, just autoreplacing can be done instead of autosuggesting replacement, but autosuggesting seems to be more flexible)

Very nice ideas Yakov. I think that those suggestion patterns shouldn't be implemented by default as every AtWho listener affects the overall editing performance (especially on mobile devices). Recently I thought about user defined suggestion patterns which are defined in a separate config tiddler. Maybe this could meet your need?

Yes, that's good thinking -- especailly for MathJax which is brought by a plugin itself.

Another possible application is to combine this with CodeMirror for TiddlyWiki (see [1] for the latest release and discussion). This can be another huge step in turning TW into a dev environment. Fortunately, Mario is here and probably can comment this somehow.

I had the same idea as I started writing this plugin, but this is probably beyond my skills :) I also use CodeMirror with TW a lot and would love to see this combination. @Mario, what do you think?

Yeap, this would require some digging of the CodeMirror editor DOM. Let's finish "simple" features first.
 

Finally, autoSuggestions can be used in the tags line which seems to be more beatiful and faster than Udo's interface [2] (although, Udo's solution implements some smart algorithm for ranging suggestions).

FIXED in 0.2.2

I'd say "implemented" ;) The workflow shows, however, that ## is a bit awkward solution for the tags edit area (especially in Russian: Russian keyboard layout doesn't contain the # symbol -- it contains № instead). What I can imagine as a really good solution is:

...]] [[here I started some text -> brings suggestions containing "here I started some text"
... oneWordTag [[here I started some text -> brings suggestions containing "here I started some text"
...]] here -> brings suggestions containing "here"
[[here I started some text -> brings suggestions containing "here I started some text"
[[here -> brings suggestions containing "here"

I also thougt about an additional suggestion pattern (maybe ##* or the like) which uses smart tag suggestions like "tiddlers that uses these tags also use ...". I have to study Udo's algorithm ;)

Yeah, the area for creativity is huge :) I guess, this "smart suggesting" doesn't need a separate syntax; instead, you can just create a smart order of the suggestions by default.

* one more idea: autosuggestions of sections/slices can be added! below are some use-cases, "l" represents the cursor:
<<tiddler [[some tiddler##l
<<tiddler [[some tiddler::l
<<tiddler [[some tiddler##l]]
<<tiddler [[some tiddler::l]]

Wow, what I really like in current implementation is the preview of the slice values.
I guess, the tricky part for supporting this for an arbitrary tiddler is to catch the matched value (tiddler name), right?

* there's one more case where tag suggestions are useful: filters there are two cases:
** tag filter. Examples of use-cases (obviously, there's no need for the ## addition in this cases):
<<list filter '[tag[l
<<list filter '... [tag[l
<<list filter '[tag[l]]'>>
<<list filter '[tag[l]] ...'>>
<<list filter '... [tag[l]]'>>
    as you can see, these can be described as /\[tag\[([^\]]*)($|\])/m if I'm not mistaking
** other filters that can "eat" tags:
<<list filter '[filterName[##|
    (and versions with or without smth before/after as well)
In these two cases, of'course, instead of [[tagName]], either tagName]] or tagName should be inserted.

Very usefull ideas! I've put it on my feature wishlist. As you can see I've implemented several experimental suggestions for sections, slices and fields in 0.2.4, but they only work with the current tiddler. It is just a test and serves more as a basis for further implementations.

By the way, the results of testing with CodeMirror. in CodeMirror editor, the suggestions are shown without any changes of AutoSuggestPlugin (!), and if I click a suggesion with the cursor, it is inserted as expected. However, the behaviour of up/down arrows and enter key is not what is expected: when I press enter (after, say, I've typed [[To and the first suggestion is ToolbarCommands), I get both linebreak and the suggestion inserted, resulting in
[[To
olbarCommands
A similar thing happens with arrows: when I press "down" to select another suggestion, the cursor goes down as well, making the suggestion dropdown disappear.

Thank you for testing! And nice that it works more or less out of the box. Obviously this behaviour should be related to a conflict with CodeMirrors handling of keyboard events, but actually I don't know how to fix this.

 

I'll report when I test this with the View Mode/Inline Editing plugins [1] (presumably it's enough to add the autoSuggest command to the ViewToolbar slice..)

Thank you Yakov, hope it works without any conflicts.

Haven't tested this yet; may be I'll wait until we discuss the suggestAt idea..

Finally, I'd like to share a tweak which I use not to modify ToolbarCommands. This is especially useful when I share AutoSuggestPlugin via SharedTiddlersPlugin:

if(!config.autoSuggest_orig_toolbarHandler) {
    config.autoSuggest_orig_toolbarHandler = config.macros.toolbar.handler;
    if(true) // an option param may be inserted here
        config.macros.toolbar.handler = function(place,macroName,params,wikifier,paramString,tiddler) {
        // warning: paramString is not changed as /currently/ it's not used by config.macros.toolbar.handler

            var i, ind;
            for(i = 0; i < params.length; i++)
                if(params[i].match(/saveTiddler/)) // locate the save/done command
                    ind = i;
            if(ind || ind === 0)
                params.splice(ind,0,"autoSuggest"); // add after save/done
            config.autoSuggest_orig_toolbarHandler.apply(this,arguments);
        };
}

It hijacks the toolbar macro so that before "done" ("saveTiddler" command) I always have the "autoSuggest" command.

By the way, this may be of interest [2] (it's an example of usage, the main link is [3], of'course). And may be this little article, too [4]. It's short and have some interactive examples, so.. yeap. There's also a number of useful tools out there, like regexpal [5] and those mentioned in the footer.

Best regards,
Yakov.

[1] http://stackoverflow.com/questions/2949861/net-regular-expression-to-match-any-kind-of-letter-from-any-language/15587135
[2] http://www.regexper.com/#%5C%5B%5C%5B(%5B%5EA-Z%5D*)%24%7C%5C%5B%5C%5B(%5B%5CwB-Z%5C-%5C%2B%5Cs%5D*%5B%5E%7C%5C%5D%5D)%24%7C%5C%5B%5C%5B%5B%5CwB-Z%5C-%5C%2B%5C%5Cs%5D*%5C%7C(%5B%5CwB-Z%5C-%5C%2B%5Cs%5D*%5B%5E%7C%5C%5D%5D)%24
[3] http://www.regexper.com/
[4] http://www.web-wise-wizard.com/javascript-tutorials/javascript-regular-expressions-regexp.html
[5] http://regexpal.com/

[Yakov]

Hello Albert,

I've stubled upon an issue -- when AutoSuggestPlugin is included (eval'ed without importing) via SharedTiddlersPlugin [1], the styles are not applied -- and made a quick fix for it: added the
refreshStyles("StyleSheetAutoSuggest");
line before the
store.addNotification("StyleSheetAutoSuggest", refreshStyles);
line, which seems to be worth including in the main plugin.

Also, in my tweaked version, I've substituted the "chars" with the [^\\|\\n\\]] thing, but didn't get what ([^\\x00-\\xff]*) stands for, so could you point what's the purpose of this piece (so that I can turn it into some more readable RegExp?

For the reference, I attach my tweaked snapshot of the plugin.

Best regards,
Yakov.

[1] http://yakovl.bplaced.net/TW/STP/STP.html

среда, 16 апреля 2014 г., 0:47:59 UTC+4 пользователь Albert Riedinger написал:

[Albert Riedinger]

Hello Yakov,

I'm very sorry for my delayed answer, but I'm currently very busy ("waiting" for birth of my son in the next few days :)

Thank you for all your tips and tweaks, but currently, I don't have the time to work on a new release (but worked on a rewrite of my plugin about 2 weeks ago > v0.3 [not published yet]) or answer all your questions in a detailled way. But I promise to get back in a few weeks ... I hope so :)

... |"+flag+"([^\\x00-\\xff]*)$ ...

is a part of the original[1] regexp (see also [2]). I guess it is not required because removing it doesn't make any difference. But I'm not really sure. Hope that helps a bit.

Best regards,
Albert

[1] https://github.com/ichord/At.js/blob/master/dist/js/jquery.atwho.js#L657
[2] http://regex101.com/r/lN2wG9

--

[Yakov]

Hello Albert,

I see, take your time and good luck :) Health to the boy!

понедельник, 19 мая 2014 г., 15:14:12 UTC+4 пользователь Albert Riedinger написал:

Hello Yakov,

I'm very sorry for my delayed answer, but I'm currently very busy ("waiting" for birth of my son in the next few days :)

Thank you for all your tips and tweaks, but currently, I don't have the time to work on a new release (but worked on a rewrite of my plugin about 2 weeks ago > v0.3 [not published yet]) or answer all your questions in a detailled way. But I promise to get back in a few weeks ... I hope so :)

Right, I hope you'll incorporate my tweaks in the future versions, so I wouldn't need to change the plugin each time ;)
 

... |"+flag+"([^\\x00-\\xff]*)$ ...

is a part of the original[1] regexp (see also [2]). I guess it is not required because removing it doesn't make any difference. But I'm not really sure. Hope that helps a bit.

Ok, I'll take a look at this.
 

[Yakov]

Ok, here's what I think: now we have this RegExp:
regexp = new RegExp(flag+"([^\\|\\n\\]]*)$|"+flag+"([^\\x00-\\xff]*)$", "gi");
and this use of match:

return match[2] || match[1];

As this is two alternative matches and my [^\\|\\n\\]] version is general enough, looks like the second part may be omitted like this:
regexp = new RegExp(flag+"([^\\|\\n\\]]*)$", "gi");
and
return match[1];

I'll let you know if this causes any side-effects in tests, but it shouldn't.

Best regards,
Yakov.

вторник, 20 мая 2014 г., 15:55:52 UTC+4 пользователь Yakov написал:

[Yakov]

PS one more tweak to add: the

.replace(/[\-\[\]\/\{\}\(\)\*\+\?\.\\\^\$\|]/g, "\\$&");

part does what

.escapeRegExp();

TW String utitity is supposed to do, and for better readability, I suggest to write those lines as following:

flag = flag.escapeRegExp();

One, however, should be aware, that this method is slower and is not totally "accurate" [1], but again, in this case it is ok.

[1] https://groups.google.com/forum/#!topic/tiddlywikidev/bZOI6X-AOvU

вторник, 20 мая 2014 г., 16:52:07 UTC+4 пользователь Yakov написал:

[Yakov]

Hello Albert,

any progress so far?

Best regards,
Yakov.

вторник, 20 мая 2014 г., 19:34:44 UTC+4 пользователь Yakov написал: