Flyspray

At several places it could be useful to let the user view available tags:

1. When editing a task a toggle popup could show a list of selectable and existing tags.

I found several nice vanilla-js-multiselect-with-autocompletion scripts, but none yet that still works at a basic level when javascript is turned off.

My plan is now:

• Keep the current basic input text field for input tags and show current assigned tags like exampletag1;exampletag2;exampletag3 separated by ‘;’ that is sent to the server when saving the task and server handles evaluation of that string (validation, duplicates, removed, added, creating new tags if allowed for current user)
• A CSS only toggle that shows available tags that can be assigned (works even with js turned off), similiar to other places within Flyspray like advanced search toggle.
• If js turned off, the user must type the tag - not as fancy, but at least works. (I thought also about using a html select with multiple=”multiple” attribute, but was not convinced due styling not possible in modern browsers without js)
• If js is enabled, more fancier stuff is possible:
  • The input text field is hidden by display:none and instead the styled tags are shown.
  • The current added tags also get a little x to remove a tag by clicking it. The content of the hidden input text field is updated to reflect the current editing status. (click eventlistener)
  • A generated text input field for typing with autocompletion list shown of matching availbale tags. An unknown tag is added to the list if user is allowed to create tags. Clicking a item in the autocompletion list adds the tag and resets the autocompletion input text field for the next autocompletion action.
  • The tags within the toggle list with all available tags get also a click event listener, so clicking it adds them to the hidden text input.
  • Not sure yet if an added tag should be removed from the all available tags list or just make an CSS indication that a tag is still added, currently I tend to keep the list untouched, just highlight used tags of the task.

• Optionally make the all available tags sortable by:
  • list_position (default)
  • alphabetic
  • global or project level
  • popularity (count of tasks using a tag (n + unnumbered private)), requires adding a data attribute.
  • group by detected prefix like shape:triangle shape:circle shape:rectangle could show a group of tags as: shape: triangle circle rectangle

1. Make the list of tags searchable for the advanced search. added with FS1.0-rc10 by just using search key words also for searching list_tags table.