sanitize tags while they are being typed
	
		
			
	
		
	
	
		
	
		
			All checks were successful
		
		
	
	
		
			
				
	
				continuous-integration/drone/push Build is passing
				
			
		
		
	
	
				
					
				
			
		
			All checks were successful
		
		
	
	continuous-integration/drone/push Build is passing
				
			This commit is contained in:
		| @@ -30,6 +30,7 @@ import topbar from 'topbar' | |||||||
| import CtrlEnter from './ctrlenter' | import CtrlEnter from './ctrlenter' | ||||||
| import Date from './date' | import Date from './date' | ||||||
| import DateTime from './datetime' | import DateTime from './datetime' | ||||||
|  | import SanitizeTags from './sanitizetags' | ||||||
| import SanitizeTitles from './sanitizetitles' | import SanitizeTitles from './sanitizetitles' | ||||||
|  |  | ||||||
| const csrfTokenElement = document.querySelector("meta[name='csrf-token']") | const csrfTokenElement = document.querySelector("meta[name='csrf-token']") | ||||||
| @@ -37,7 +38,7 @@ let csrfToken | |||||||
| if (csrfTokenElement) { csrfToken = csrfTokenElement.getAttribute('content') } | if (csrfTokenElement) { csrfToken = csrfTokenElement.getAttribute('content') } | ||||||
| const liveSocket = new LiveSocket('/live', Socket, { | const liveSocket = new LiveSocket('/live', Socket, { | ||||||
|   params: { _csrf_token: csrfToken }, |   params: { _csrf_token: csrfToken }, | ||||||
|   hooks: { CtrlEnter, Date, DateTime, SanitizeTitles } |   hooks: { CtrlEnter, Date, DateTime, SanitizeTags, SanitizeTitles } | ||||||
| }) | }) | ||||||
|  |  | ||||||
| // Show progress bar on live navigation and form submits | // Show progress bar on live navigation and form submits | ||||||
|   | |||||||
							
								
								
									
										11
									
								
								assets/js/sanitizetags.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										11
									
								
								assets/js/sanitizetags.js
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,11 @@ | |||||||
|  | export default { | ||||||
|  |   SanitizeTags (context) { | ||||||
|  |     context.el.addEventListener('keyup', (e) => { | ||||||
|  |       e.target.value = e.target.value | ||||||
|  |         .replace(' ', ',') | ||||||
|  |         .replace(',,', ',') | ||||||
|  |         .replace(/[^a-zA-Z0-9,]/, '') | ||||||
|  |     }) | ||||||
|  |   }, | ||||||
|  |   mounted () { this.SanitizeTags(this) } | ||||||
|  | } | ||||||
| @@ -1,5 +1,6 @@ | |||||||
| # v0.1.15 | # v0.1.15 | ||||||
| - Sanitize titles while they are being typed | - Sanitize titles while they are being typed | ||||||
|  | - Sanitize tags while they are being typed | ||||||
| - Remove requirement for note and content to have content | - Remove requirement for note and content to have content | ||||||
| - Prevent possible additional submissions | - Prevent possible additional submissions | ||||||
| - Fix content being displayed when blank | - Fix content being displayed when blank | ||||||
|   | |||||||
| @@ -31,11 +31,12 @@ | |||||||
|     <%= error_tag(f, :content) %> |     <%= error_tag(f, :content) %> | ||||||
|  |  | ||||||
|     <%= text_input(f, :tags_string, |     <%= text_input(f, :tags_string, | ||||||
|       id: "tags-input", |  | ||||||
|       class: "input input-primary", |  | ||||||
|       placeholder: gettext("tag1,tag2"), |  | ||||||
|       aria_label: gettext("tag1,tag2"), |       aria_label: gettext("tag1,tag2"), | ||||||
|       phx_debounce: 300 |       class: "input input-primary", | ||||||
|  |       id: "tags-input", | ||||||
|  |       phx_debounce: 300, | ||||||
|  |       phx_hook: "SanitizeTags", | ||||||
|  |       placeholder: gettext("tag1,tag2") | ||||||
|     ) %> |     ) %> | ||||||
|     <%= error_tag(f, :tags_string) %> |     <%= error_tag(f, :tags_string) %> | ||||||
|  |  | ||||||
|   | |||||||
| @@ -29,11 +29,12 @@ | |||||||
|     <%= error_tag(f, :content) %> |     <%= error_tag(f, :content) %> | ||||||
|  |  | ||||||
|     <%= text_input(f, :tags_string, |     <%= text_input(f, :tags_string, | ||||||
|       id: "tags-input", |  | ||||||
|       class: "input input-primary", |  | ||||||
|       placeholder: gettext("tag1,tag2"), |  | ||||||
|       aria_label: gettext("tag1,tag2"), |       aria_label: gettext("tag1,tag2"), | ||||||
|       phx_debounce: 300 |       class: "input input-primary", | ||||||
|  |       id: "tags-input", | ||||||
|  |       phx_debounce: 300, | ||||||
|  |       phx_hook: "SanitizeTags", | ||||||
|  |       placeholder: gettext("tag1,tag2") | ||||||
|     ) %> |     ) %> | ||||||
|     <%= error_tag(f, :tags_string) %> |     <%= error_tag(f, :tags_string) %> | ||||||
|  |  | ||||||
|   | |||||||
| @@ -35,11 +35,12 @@ | |||||||
|     <%= error_tag(f, :description) %> |     <%= error_tag(f, :description) %> | ||||||
|  |  | ||||||
|     <%= text_input(f, :tags_string, |     <%= text_input(f, :tags_string, | ||||||
|       id: "tags-input", |  | ||||||
|       class: "input input-primary", |  | ||||||
|       placeholder: gettext("tag1,tag2"), |  | ||||||
|       aria_label: gettext("tag1,tag2"), |       aria_label: gettext("tag1,tag2"), | ||||||
|       phx_debounce: 300 |       class: "input input-primary", | ||||||
|  |       id: "tags-input", | ||||||
|  |       phx_debounce: 300, | ||||||
|  |       phx_hook: "SanitizeTags", | ||||||
|  |       placeholder: gettext("tag1,tag2") | ||||||
|     ) %> |     ) %> | ||||||
|     <%= error_tag(f, :tags_string) %> |     <%= error_tag(f, :tags_string) %> | ||||||
|  |  | ||||||
|   | |||||||
| @@ -108,10 +108,10 @@ msgstr "" | |||||||
| msgid "register" | msgid "register" | ||||||
| msgstr "" | msgstr "" | ||||||
|  |  | ||||||
| #: lib/memex_web/live/context_live/form_component.html.heex:50 | #: lib/memex_web/live/context_live/form_component.html.heex:51 | ||||||
| #: lib/memex_web/live/invite_live/form_component.html.heex:47 | #: lib/memex_web/live/invite_live/form_component.html.heex:47 | ||||||
| #: lib/memex_web/live/note_live/form_component.html.heex:48 | #: lib/memex_web/live/note_live/form_component.html.heex:49 | ||||||
| #: lib/memex_web/live/pipeline_live/form_component.html.heex:54 | #: lib/memex_web/live/pipeline_live/form_component.html.heex:55 | ||||||
| #: lib/memex_web/live/step_live/form_component.html.heex:38 | #: lib/memex_web/live/step_live/form_component.html.heex:38 | ||||||
| #, elixir-autogen, elixir-format | #, elixir-autogen, elixir-format | ||||||
| msgid "save" | msgid "save" | ||||||
|   | |||||||
| @@ -108,10 +108,10 @@ msgstr "" | |||||||
| msgid "register" | msgid "register" | ||||||
| msgstr "" | msgstr "" | ||||||
|  |  | ||||||
| #: lib/memex_web/live/context_live/form_component.html.heex:50 | #: lib/memex_web/live/context_live/form_component.html.heex:51 | ||||||
| #: lib/memex_web/live/invite_live/form_component.html.heex:47 | #: lib/memex_web/live/invite_live/form_component.html.heex:47 | ||||||
| #: lib/memex_web/live/note_live/form_component.html.heex:48 | #: lib/memex_web/live/note_live/form_component.html.heex:49 | ||||||
| #: lib/memex_web/live/pipeline_live/form_component.html.heex:54 | #: lib/memex_web/live/pipeline_live/form_component.html.heex:55 | ||||||
| #: lib/memex_web/live/step_live/form_component.html.heex:38 | #: lib/memex_web/live/step_live/form_component.html.heex:38 | ||||||
| #, elixir-autogen, elixir-format | #, elixir-autogen, elixir-format | ||||||
| msgid "save" | msgid "save" | ||||||
|   | |||||||
| @@ -237,20 +237,20 @@ msgstr "" | |||||||
| msgid "report bugs or request features" | msgid "report bugs or request features" | ||||||
| msgstr "" | msgstr "" | ||||||
|  |  | ||||||
| #: lib/memex_web/live/context_live/form_component.html.heex:51 | #: lib/memex_web/live/context_live/form_component.html.heex:52 | ||||||
| #: lib/memex_web/live/note_live/form_component.html.heex:49 | #: lib/memex_web/live/note_live/form_component.html.heex:50 | ||||||
| #: lib/memex_web/live/pipeline_live/form_component.html.heex:55 | #: lib/memex_web/live/pipeline_live/form_component.html.heex:56 | ||||||
| #: lib/memex_web/live/step_live/form_component.html.heex:39 | #: lib/memex_web/live/step_live/form_component.html.heex:39 | ||||||
| #, elixir-autogen, elixir-format | #, elixir-autogen, elixir-format | ||||||
| msgid "saving..." | msgid "saving..." | ||||||
| msgstr "" | msgstr "" | ||||||
|  |  | ||||||
| #: lib/memex_web/live/context_live/form_component.html.heex:45 |  | ||||||
| #: lib/memex_web/live/context_live/form_component.html.heex:46 | #: lib/memex_web/live/context_live/form_component.html.heex:46 | ||||||
| #: lib/memex_web/live/note_live/form_component.html.heex:43 | #: lib/memex_web/live/context_live/form_component.html.heex:47 | ||||||
| #: lib/memex_web/live/note_live/form_component.html.heex:44 | #: lib/memex_web/live/note_live/form_component.html.heex:44 | ||||||
| #: lib/memex_web/live/pipeline_live/form_component.html.heex:49 | #: lib/memex_web/live/note_live/form_component.html.heex:45 | ||||||
| #: lib/memex_web/live/pipeline_live/form_component.html.heex:50 | #: lib/memex_web/live/pipeline_live/form_component.html.heex:50 | ||||||
|  | #: lib/memex_web/live/pipeline_live/form_component.html.heex:51 | ||||||
| #, elixir-autogen, elixir-format | #, elixir-autogen, elixir-format | ||||||
| msgid "select privacy" | msgid "select privacy" | ||||||
| msgstr "" | msgstr "" | ||||||
| @@ -266,12 +266,12 @@ msgstr "" | |||||||
| msgid "settings" | msgid "settings" | ||||||
| msgstr "" | msgstr "" | ||||||
|  |  | ||||||
| #: lib/memex_web/live/context_live/form_component.html.heex:36 | #: lib/memex_web/live/context_live/form_component.html.heex:34 | ||||||
| #: lib/memex_web/live/context_live/form_component.html.heex:37 | #: lib/memex_web/live/context_live/form_component.html.heex:39 | ||||||
| #: lib/memex_web/live/note_live/form_component.html.heex:34 | #: lib/memex_web/live/note_live/form_component.html.heex:32 | ||||||
| #: lib/memex_web/live/note_live/form_component.html.heex:35 | #: lib/memex_web/live/note_live/form_component.html.heex:37 | ||||||
| #: lib/memex_web/live/pipeline_live/form_component.html.heex:40 | #: lib/memex_web/live/pipeline_live/form_component.html.heex:38 | ||||||
| #: lib/memex_web/live/pipeline_live/form_component.html.heex:41 | #: lib/memex_web/live/pipeline_live/form_component.html.heex:43 | ||||||
| #, elixir-autogen, elixir-format | #, elixir-autogen, elixir-format | ||||||
| msgid "tag1,tag2" | msgid "tag1,tag2" | ||||||
| msgstr "" | msgstr "" | ||||||
|   | |||||||
| @@ -235,20 +235,20 @@ msgstr "" | |||||||
| msgid "report bugs or request features" | msgid "report bugs or request features" | ||||||
| msgstr "" | msgstr "" | ||||||
|  |  | ||||||
| #: lib/memex_web/live/context_live/form_component.html.heex:51 | #: lib/memex_web/live/context_live/form_component.html.heex:52 | ||||||
| #: lib/memex_web/live/note_live/form_component.html.heex:49 | #: lib/memex_web/live/note_live/form_component.html.heex:50 | ||||||
| #: lib/memex_web/live/pipeline_live/form_component.html.heex:55 | #: lib/memex_web/live/pipeline_live/form_component.html.heex:56 | ||||||
| #: lib/memex_web/live/step_live/form_component.html.heex:39 | #: lib/memex_web/live/step_live/form_component.html.heex:39 | ||||||
| #, elixir-autogen, elixir-format | #, elixir-autogen, elixir-format | ||||||
| msgid "saving..." | msgid "saving..." | ||||||
| msgstr "" | msgstr "" | ||||||
|  |  | ||||||
| #: lib/memex_web/live/context_live/form_component.html.heex:45 |  | ||||||
| #: lib/memex_web/live/context_live/form_component.html.heex:46 | #: lib/memex_web/live/context_live/form_component.html.heex:46 | ||||||
| #: lib/memex_web/live/note_live/form_component.html.heex:43 | #: lib/memex_web/live/context_live/form_component.html.heex:47 | ||||||
| #: lib/memex_web/live/note_live/form_component.html.heex:44 | #: lib/memex_web/live/note_live/form_component.html.heex:44 | ||||||
| #: lib/memex_web/live/pipeline_live/form_component.html.heex:49 | #: lib/memex_web/live/note_live/form_component.html.heex:45 | ||||||
| #: lib/memex_web/live/pipeline_live/form_component.html.heex:50 | #: lib/memex_web/live/pipeline_live/form_component.html.heex:50 | ||||||
|  | #: lib/memex_web/live/pipeline_live/form_component.html.heex:51 | ||||||
| #, elixir-autogen, elixir-format | #, elixir-autogen, elixir-format | ||||||
| msgid "select privacy" | msgid "select privacy" | ||||||
| msgstr "" | msgstr "" | ||||||
| @@ -264,12 +264,12 @@ msgstr "" | |||||||
| msgid "settings" | msgid "settings" | ||||||
| msgstr "" | msgstr "" | ||||||
|  |  | ||||||
| #: lib/memex_web/live/context_live/form_component.html.heex:36 | #: lib/memex_web/live/context_live/form_component.html.heex:34 | ||||||
| #: lib/memex_web/live/context_live/form_component.html.heex:37 | #: lib/memex_web/live/context_live/form_component.html.heex:39 | ||||||
| #: lib/memex_web/live/note_live/form_component.html.heex:34 | #: lib/memex_web/live/note_live/form_component.html.heex:32 | ||||||
| #: lib/memex_web/live/note_live/form_component.html.heex:35 | #: lib/memex_web/live/note_live/form_component.html.heex:37 | ||||||
| #: lib/memex_web/live/pipeline_live/form_component.html.heex:40 | #: lib/memex_web/live/pipeline_live/form_component.html.heex:38 | ||||||
| #: lib/memex_web/live/pipeline_live/form_component.html.heex:41 | #: lib/memex_web/live/pipeline_live/form_component.html.heex:43 | ||||||
| #, elixir-autogen, elixir-format | #, elixir-autogen, elixir-format | ||||||
| msgid "tag1,tag2" | msgid "tag1,tag2" | ||||||
| msgstr "" | msgstr "" | ||||||
|   | |||||||
| @@ -109,10 +109,10 @@ msgstr "" | |||||||
| msgid "register" | msgid "register" | ||||||
| msgstr "" | msgstr "" | ||||||
|  |  | ||||||
| #: lib/memex_web/live/context_live/form_component.html.heex:50 | #: lib/memex_web/live/context_live/form_component.html.heex:51 | ||||||
| #: lib/memex_web/live/invite_live/form_component.html.heex:47 | #: lib/memex_web/live/invite_live/form_component.html.heex:47 | ||||||
| #: lib/memex_web/live/note_live/form_component.html.heex:48 | #: lib/memex_web/live/note_live/form_component.html.heex:49 | ||||||
| #: lib/memex_web/live/pipeline_live/form_component.html.heex:54 | #: lib/memex_web/live/pipeline_live/form_component.html.heex:55 | ||||||
| #: lib/memex_web/live/step_live/form_component.html.heex:38 | #: lib/memex_web/live/step_live/form_component.html.heex:38 | ||||||
| #, elixir-autogen, elixir-format | #, elixir-autogen, elixir-format | ||||||
| msgid "save" | msgid "save" | ||||||
|   | |||||||
| @@ -236,20 +236,20 @@ msgstr "" | |||||||
| msgid "report bugs or request features" | msgid "report bugs or request features" | ||||||
| msgstr "" | msgstr "" | ||||||
|  |  | ||||||
| #: lib/memex_web/live/context_live/form_component.html.heex:51 | #: lib/memex_web/live/context_live/form_component.html.heex:52 | ||||||
| #: lib/memex_web/live/note_live/form_component.html.heex:49 | #: lib/memex_web/live/note_live/form_component.html.heex:50 | ||||||
| #: lib/memex_web/live/pipeline_live/form_component.html.heex:55 | #: lib/memex_web/live/pipeline_live/form_component.html.heex:56 | ||||||
| #: lib/memex_web/live/step_live/form_component.html.heex:39 | #: lib/memex_web/live/step_live/form_component.html.heex:39 | ||||||
| #, elixir-autogen, elixir-format | #, elixir-autogen, elixir-format | ||||||
| msgid "saving..." | msgid "saving..." | ||||||
| msgstr "" | msgstr "" | ||||||
|  |  | ||||||
| #: lib/memex_web/live/context_live/form_component.html.heex:45 |  | ||||||
| #: lib/memex_web/live/context_live/form_component.html.heex:46 | #: lib/memex_web/live/context_live/form_component.html.heex:46 | ||||||
| #: lib/memex_web/live/note_live/form_component.html.heex:43 | #: lib/memex_web/live/context_live/form_component.html.heex:47 | ||||||
| #: lib/memex_web/live/note_live/form_component.html.heex:44 | #: lib/memex_web/live/note_live/form_component.html.heex:44 | ||||||
| #: lib/memex_web/live/pipeline_live/form_component.html.heex:49 | #: lib/memex_web/live/note_live/form_component.html.heex:45 | ||||||
| #: lib/memex_web/live/pipeline_live/form_component.html.heex:50 | #: lib/memex_web/live/pipeline_live/form_component.html.heex:50 | ||||||
|  | #: lib/memex_web/live/pipeline_live/form_component.html.heex:51 | ||||||
| #, elixir-autogen, elixir-format | #, elixir-autogen, elixir-format | ||||||
| msgid "select privacy" | msgid "select privacy" | ||||||
| msgstr "" | msgstr "" | ||||||
| @@ -265,12 +265,12 @@ msgstr "" | |||||||
| msgid "settings" | msgid "settings" | ||||||
| msgstr "" | msgstr "" | ||||||
|  |  | ||||||
| #: lib/memex_web/live/context_live/form_component.html.heex:36 | #: lib/memex_web/live/context_live/form_component.html.heex:34 | ||||||
| #: lib/memex_web/live/context_live/form_component.html.heex:37 | #: lib/memex_web/live/context_live/form_component.html.heex:39 | ||||||
| #: lib/memex_web/live/note_live/form_component.html.heex:34 | #: lib/memex_web/live/note_live/form_component.html.heex:32 | ||||||
| #: lib/memex_web/live/note_live/form_component.html.heex:35 | #: lib/memex_web/live/note_live/form_component.html.heex:37 | ||||||
| #: lib/memex_web/live/pipeline_live/form_component.html.heex:40 | #: lib/memex_web/live/pipeline_live/form_component.html.heex:38 | ||||||
| #: lib/memex_web/live/pipeline_live/form_component.html.heex:41 | #: lib/memex_web/live/pipeline_live/form_component.html.heex:43 | ||||||
| #, elixir-autogen, elixir-format | #, elixir-autogen, elixir-format | ||||||
| msgid "tag1,tag2" | msgid "tag1,tag2" | ||||||
| msgstr "" | msgstr "" | ||||||
|   | |||||||
		Reference in New Issue
	
	Block a user