sanitize titles while they are being typed

This commit is contained in:
shibao 2024-02-23 22:31:15 -05:00
parent 362c406471
commit 22ccea893c
13 changed files with 116 additions and 100 deletions

View File

@ -30,13 +30,14 @@ import topbar from 'topbar'
import CtrlEnter from './ctrlenter'
import Date from './date'
import DateTime from './datetime'
import SanitizeTitles from './sanitizetitles'
const csrfTokenElement = document.querySelector("meta[name='csrf-token']")
let csrfToken
if (csrfTokenElement) { csrfToken = csrfTokenElement.getAttribute('content') }
const liveSocket = new LiveSocket('/live', Socket, {
params: { _csrf_token: csrfToken },
hooks: { CtrlEnter, Date, DateTime }
hooks: { CtrlEnter, Date, DateTime, SanitizeTitles }
})
// Show progress bar on live navigation and form submits

View File

@ -0,0 +1,10 @@
export default {
SanitizeTitles (context) {
context.el.addEventListener('keyup', (e) => {
e.target.value = e.target.value
.replace(' ', '-')
.replace(/[^a-zA-Z0-9-]/, '')
})
},
mounted () { this.SanitizeTitles(this) }
}

View File

@ -1,4 +1,5 @@
# v0.1.15
- Sanitize titles while they are being typed
- Fix content being displayed when blank
# v0.1.14

View File

@ -10,10 +10,11 @@
class="flex flex-col justify-start items-stretch space-y-4"
>
<%= text_input(f, :slug,
class: "input input-primary",
placeholder: gettext("slug"),
aria_label: gettext("slug"),
phx_debounce: 300
class: "input input-primary",
phx_debounce: 300,
phx_hook: "SanitizeTitles",
placeholder: gettext("slug")
) %>
<%= error_tag(f, :slug) %>

View File

@ -10,10 +10,11 @@
class="flex flex-col justify-start items-stretch space-y-4"
>
<%= text_input(f, :slug,
class: "input input-primary",
placeholder: gettext("slug"),
aria_label: gettext("slug"),
phx_debounce: 300
class: "input input-primary",
phx_debounce: 300,
phx_hook: "SanitizeTitles",
placeholder: gettext("slug")
) %>
<%= error_tag(f, :slug) %>

View File

@ -10,10 +10,11 @@
class="flex flex-col justify-start items-stretch space-y-4"
>
<%= text_input(f, :slug,
class: "input input-primary",
placeholder: gettext("slug"),
aria_label: gettext("slug"),
phx_debounce: 300
class: "input input-primary",
phx_debounce: 300,
phx_hook: "SanitizeTitles",
placeholder: gettext("slug")
) %>
<%= error_tag(f, :slug) %>

View File

@ -10,10 +10,11 @@
class="flex flex-col justify-start items-stretch space-y-4"
>
<%= text_input(f, :title,
class: "input input-primary",
placeholder: gettext("title"),
aria_label: gettext("title"),
phx_debounce: 300
class: "input input-primary",
phx_debounce: 300,
phx_hook: "SanitizeTitles",
placeholder: gettext("title")
) %>
<%= error_tag(f, :title) %>

View File

@ -108,11 +108,11 @@ msgstr ""
msgid "register"
msgstr ""
#: lib/memex_web/live/context_live/form_component.html.heex:49
#: lib/memex_web/live/context_live/form_component.html.heex:50
#: lib/memex_web/live/invite_live/form_component.html.heex:47
#: lib/memex_web/live/note_live/form_component.html.heex:47
#: lib/memex_web/live/pipeline_live/form_component.html.heex:53
#: lib/memex_web/live/step_live/form_component.html.heex:37
#: lib/memex_web/live/note_live/form_component.html.heex:48
#: lib/memex_web/live/pipeline_live/form_component.html.heex:54
#: lib/memex_web/live/step_live/form_component.html.heex:38
#, elixir-autogen, elixir-format
msgid "save"
msgstr ""

View File

@ -108,11 +108,11 @@ msgstr ""
msgid "register"
msgstr ""
#: lib/memex_web/live/context_live/form_component.html.heex:49
#: lib/memex_web/live/context_live/form_component.html.heex:50
#: lib/memex_web/live/invite_live/form_component.html.heex:47
#: lib/memex_web/live/note_live/form_component.html.heex:47
#: lib/memex_web/live/pipeline_live/form_component.html.heex:53
#: lib/memex_web/live/step_live/form_component.html.heex:37
#: lib/memex_web/live/note_live/form_component.html.heex:48
#: lib/memex_web/live/pipeline_live/form_component.html.heex:54
#: lib/memex_web/live/step_live/form_component.html.heex:38
#, elixir-autogen, elixir-format
msgid "save"
msgstr ""

View File

@ -237,20 +237,20 @@ msgstr ""
msgid "report bugs or request features"
msgstr ""
#: lib/memex_web/live/context_live/form_component.html.heex:50
#: lib/memex_web/live/note_live/form_component.html.heex:48
#: lib/memex_web/live/pipeline_live/form_component.html.heex:54
#: lib/memex_web/live/step_live/form_component.html.heex:38
#: lib/memex_web/live/context_live/form_component.html.heex:51
#: lib/memex_web/live/note_live/form_component.html.heex:49
#: lib/memex_web/live/pipeline_live/form_component.html.heex:55
#: lib/memex_web/live/step_live/form_component.html.heex:39
#, elixir-autogen, elixir-format
msgid "saving..."
msgstr ""
#: lib/memex_web/live/context_live/form_component.html.heex:44
#: lib/memex_web/live/context_live/form_component.html.heex:45
#: lib/memex_web/live/note_live/form_component.html.heex:42
#: 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/pipeline_live/form_component.html.heex:48
#: 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/pipeline_live/form_component.html.heex:50
#, elixir-autogen, elixir-format
msgid "select privacy"
msgstr ""
@ -266,12 +266,12 @@ msgstr ""
msgid "settings"
msgstr ""
#: lib/memex_web/live/context_live/form_component.html.heex:35
#: lib/memex_web/live/context_live/form_component.html.heex:36
#: lib/memex_web/live/note_live/form_component.html.heex:33
#: lib/memex_web/live/context_live/form_component.html.heex:37
#: lib/memex_web/live/note_live/form_component.html.heex:34
#: lib/memex_web/live/pipeline_live/form_component.html.heex:39
#: lib/memex_web/live/note_live/form_component.html.heex:35
#: lib/memex_web/live/pipeline_live/form_component.html.heex:40
#: lib/memex_web/live/pipeline_live/form_component.html.heex:41
#, elixir-autogen, elixir-format
msgid "tag1,tag2"
msgstr ""
@ -379,12 +379,12 @@ msgstr ""
#: lib/memex_web/components/contexts_table_component.ex:47
#: lib/memex_web/components/notes_table_component.ex:47
#: lib/memex_web/components/pipelines_table_component.ex:47
#: lib/memex_web/live/context_live/form_component.html.heex:14
#: lib/memex_web/live/context_live/form_component.html.heex:15
#: lib/memex_web/live/note_live/form_component.html.heex:14
#: lib/memex_web/live/note_live/form_component.html.heex:15
#: lib/memex_web/live/pipeline_live/form_component.html.heex:14
#: lib/memex_web/live/pipeline_live/form_component.html.heex:15
#: lib/memex_web/live/context_live/form_component.html.heex:13
#: lib/memex_web/live/context_live/form_component.html.heex:17
#: lib/memex_web/live/note_live/form_component.html.heex:13
#: lib/memex_web/live/note_live/form_component.html.heex:17
#: lib/memex_web/live/pipeline_live/form_component.html.heex:13
#: lib/memex_web/live/pipeline_live/form_component.html.heex:17
#, elixir-autogen, elixir-format
msgid "slug"
msgstr ""
@ -457,8 +457,8 @@ msgstr ""
msgid "steps:"
msgstr ""
#: lib/memex_web/live/step_live/form_component.html.heex:14
#: lib/memex_web/live/step_live/form_component.html.heex:15
#: lib/memex_web/live/step_live/form_component.html.heex:13
#: lib/memex_web/live/step_live/form_component.html.heex:17
#, elixir-autogen, elixir-format
msgid "title"
msgstr ""
@ -692,22 +692,22 @@ msgstr ""
msgid "reset your password"
msgstr ""
#: lib/memex_web/live/pipeline_live/form_component.html.heex:25
#: lib/memex_web/live/pipeline_live/form_component.html.heex:29
#: lib/memex_web/live/step_live/form_component.html.heex:25
#: lib/memex_web/live/step_live/form_component.html.heex:29
#: lib/memex_web/live/pipeline_live/form_component.html.heex:26
#: lib/memex_web/live/pipeline_live/form_component.html.heex:30
#: lib/memex_web/live/step_live/form_component.html.heex:26
#: lib/memex_web/live/step_live/form_component.html.heex:30
#, elixir-autogen, elixir-format
msgid "use [[[note-slug]]] to link to a note or use [[context-slug]] to link to a context or [pipeline-slug] to link to a pipeline"
msgstr ""
#: lib/memex_web/live/context_live/form_component.html.heex:25
#: lib/memex_web/live/context_live/form_component.html.heex:27
#: lib/memex_web/live/context_live/form_component.html.heex:26
#: lib/memex_web/live/context_live/form_component.html.heex:28
#, elixir-autogen, elixir-format, fuzzy
msgid "use [[note-slug]] to link to a note or [context-slug] to link to a context"
msgstr ""
#: lib/memex_web/live/note_live/form_component.html.heex:24
#: lib/memex_web/live/note_live/form_component.html.heex:25
#: lib/memex_web/live/note_live/form_component.html.heex:26
#, elixir-autogen, elixir-format, fuzzy
msgid "use [note-slug] to link to a note"
msgstr ""

View File

@ -235,20 +235,20 @@ msgstr ""
msgid "report bugs or request features"
msgstr ""
#: lib/memex_web/live/context_live/form_component.html.heex:50
#: lib/memex_web/live/note_live/form_component.html.heex:48
#: lib/memex_web/live/pipeline_live/form_component.html.heex:54
#: lib/memex_web/live/step_live/form_component.html.heex:38
#: lib/memex_web/live/context_live/form_component.html.heex:51
#: lib/memex_web/live/note_live/form_component.html.heex:49
#: lib/memex_web/live/pipeline_live/form_component.html.heex:55
#: lib/memex_web/live/step_live/form_component.html.heex:39
#, elixir-autogen, elixir-format
msgid "saving..."
msgstr ""
#: lib/memex_web/live/context_live/form_component.html.heex:44
#: lib/memex_web/live/context_live/form_component.html.heex:45
#: lib/memex_web/live/note_live/form_component.html.heex:42
#: 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/pipeline_live/form_component.html.heex:48
#: 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/pipeline_live/form_component.html.heex:50
#, elixir-autogen, elixir-format
msgid "select privacy"
msgstr ""
@ -264,12 +264,12 @@ msgstr ""
msgid "settings"
msgstr ""
#: lib/memex_web/live/context_live/form_component.html.heex:35
#: lib/memex_web/live/context_live/form_component.html.heex:36
#: lib/memex_web/live/note_live/form_component.html.heex:33
#: lib/memex_web/live/context_live/form_component.html.heex:37
#: lib/memex_web/live/note_live/form_component.html.heex:34
#: lib/memex_web/live/pipeline_live/form_component.html.heex:39
#: lib/memex_web/live/note_live/form_component.html.heex:35
#: lib/memex_web/live/pipeline_live/form_component.html.heex:40
#: lib/memex_web/live/pipeline_live/form_component.html.heex:41
#, elixir-autogen, elixir-format
msgid "tag1,tag2"
msgstr ""
@ -377,12 +377,12 @@ msgstr ""
#: lib/memex_web/components/contexts_table_component.ex:47
#: lib/memex_web/components/notes_table_component.ex:47
#: lib/memex_web/components/pipelines_table_component.ex:47
#: lib/memex_web/live/context_live/form_component.html.heex:14
#: lib/memex_web/live/context_live/form_component.html.heex:15
#: lib/memex_web/live/note_live/form_component.html.heex:14
#: lib/memex_web/live/note_live/form_component.html.heex:15
#: lib/memex_web/live/pipeline_live/form_component.html.heex:14
#: lib/memex_web/live/pipeline_live/form_component.html.heex:15
#: lib/memex_web/live/context_live/form_component.html.heex:13
#: lib/memex_web/live/context_live/form_component.html.heex:17
#: lib/memex_web/live/note_live/form_component.html.heex:13
#: lib/memex_web/live/note_live/form_component.html.heex:17
#: lib/memex_web/live/pipeline_live/form_component.html.heex:13
#: lib/memex_web/live/pipeline_live/form_component.html.heex:17
#, elixir-autogen, elixir-format
msgid "slug"
msgstr ""
@ -455,8 +455,8 @@ msgstr ""
msgid "steps:"
msgstr ""
#: lib/memex_web/live/step_live/form_component.html.heex:14
#: lib/memex_web/live/step_live/form_component.html.heex:15
#: lib/memex_web/live/step_live/form_component.html.heex:13
#: lib/memex_web/live/step_live/form_component.html.heex:17
#, elixir-autogen, elixir-format
msgid "title"
msgstr ""
@ -690,22 +690,22 @@ msgstr ""
msgid "reset your password"
msgstr ""
#: lib/memex_web/live/pipeline_live/form_component.html.heex:25
#: lib/memex_web/live/pipeline_live/form_component.html.heex:29
#: lib/memex_web/live/step_live/form_component.html.heex:25
#: lib/memex_web/live/step_live/form_component.html.heex:29
#: lib/memex_web/live/pipeline_live/form_component.html.heex:26
#: lib/memex_web/live/pipeline_live/form_component.html.heex:30
#: lib/memex_web/live/step_live/form_component.html.heex:26
#: lib/memex_web/live/step_live/form_component.html.heex:30
#, elixir-autogen, elixir-format
msgid "use [[[note-slug]]] to link to a note or use [[context-slug]] to link to a context or [pipeline-slug] to link to a pipeline"
msgstr ""
#: lib/memex_web/live/context_live/form_component.html.heex:25
#: lib/memex_web/live/context_live/form_component.html.heex:27
#: lib/memex_web/live/context_live/form_component.html.heex:26
#: lib/memex_web/live/context_live/form_component.html.heex:28
#, elixir-autogen, elixir-format
msgid "use [[note-slug]] to link to a note or [context-slug] to link to a context"
msgstr ""
#: lib/memex_web/live/note_live/form_component.html.heex:24
#: lib/memex_web/live/note_live/form_component.html.heex:25
#: lib/memex_web/live/note_live/form_component.html.heex:26
#, elixir-autogen, elixir-format
msgid "use [note-slug] to link to a note"
msgstr ""

View File

@ -109,11 +109,11 @@ msgstr ""
msgid "register"
msgstr ""
#: lib/memex_web/live/context_live/form_component.html.heex:49
#: lib/memex_web/live/context_live/form_component.html.heex:50
#: lib/memex_web/live/invite_live/form_component.html.heex:47
#: lib/memex_web/live/note_live/form_component.html.heex:47
#: lib/memex_web/live/pipeline_live/form_component.html.heex:53
#: lib/memex_web/live/step_live/form_component.html.heex:37
#: lib/memex_web/live/note_live/form_component.html.heex:48
#: lib/memex_web/live/pipeline_live/form_component.html.heex:54
#: lib/memex_web/live/step_live/form_component.html.heex:38
#, elixir-autogen, elixir-format
msgid "save"
msgstr ""

View File

@ -236,20 +236,20 @@ msgstr ""
msgid "report bugs or request features"
msgstr ""
#: lib/memex_web/live/context_live/form_component.html.heex:50
#: lib/memex_web/live/note_live/form_component.html.heex:48
#: lib/memex_web/live/pipeline_live/form_component.html.heex:54
#: lib/memex_web/live/step_live/form_component.html.heex:38
#: lib/memex_web/live/context_live/form_component.html.heex:51
#: lib/memex_web/live/note_live/form_component.html.heex:49
#: lib/memex_web/live/pipeline_live/form_component.html.heex:55
#: lib/memex_web/live/step_live/form_component.html.heex:39
#, elixir-autogen, elixir-format
msgid "saving..."
msgstr ""
#: lib/memex_web/live/context_live/form_component.html.heex:44
#: lib/memex_web/live/context_live/form_component.html.heex:45
#: lib/memex_web/live/note_live/form_component.html.heex:42
#: 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/pipeline_live/form_component.html.heex:48
#: 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/pipeline_live/form_component.html.heex:50
#, elixir-autogen, elixir-format
msgid "select privacy"
msgstr ""
@ -265,12 +265,12 @@ msgstr ""
msgid "settings"
msgstr ""
#: lib/memex_web/live/context_live/form_component.html.heex:35
#: lib/memex_web/live/context_live/form_component.html.heex:36
#: lib/memex_web/live/note_live/form_component.html.heex:33
#: lib/memex_web/live/context_live/form_component.html.heex:37
#: lib/memex_web/live/note_live/form_component.html.heex:34
#: lib/memex_web/live/pipeline_live/form_component.html.heex:39
#: lib/memex_web/live/note_live/form_component.html.heex:35
#: lib/memex_web/live/pipeline_live/form_component.html.heex:40
#: lib/memex_web/live/pipeline_live/form_component.html.heex:41
#, elixir-autogen, elixir-format
msgid "tag1,tag2"
msgstr ""
@ -378,12 +378,12 @@ msgstr ""
#: lib/memex_web/components/contexts_table_component.ex:47
#: lib/memex_web/components/notes_table_component.ex:47
#: lib/memex_web/components/pipelines_table_component.ex:47
#: lib/memex_web/live/context_live/form_component.html.heex:14
#: lib/memex_web/live/context_live/form_component.html.heex:15
#: lib/memex_web/live/note_live/form_component.html.heex:14
#: lib/memex_web/live/note_live/form_component.html.heex:15
#: lib/memex_web/live/pipeline_live/form_component.html.heex:14
#: lib/memex_web/live/pipeline_live/form_component.html.heex:15
#: lib/memex_web/live/context_live/form_component.html.heex:13
#: lib/memex_web/live/context_live/form_component.html.heex:17
#: lib/memex_web/live/note_live/form_component.html.heex:13
#: lib/memex_web/live/note_live/form_component.html.heex:17
#: lib/memex_web/live/pipeline_live/form_component.html.heex:13
#: lib/memex_web/live/pipeline_live/form_component.html.heex:17
#, elixir-autogen, elixir-format
msgid "slug"
msgstr ""
@ -456,8 +456,8 @@ msgstr ""
msgid "steps:"
msgstr ""
#: lib/memex_web/live/step_live/form_component.html.heex:14
#: lib/memex_web/live/step_live/form_component.html.heex:15
#: lib/memex_web/live/step_live/form_component.html.heex:13
#: lib/memex_web/live/step_live/form_component.html.heex:17
#, elixir-autogen, elixir-format
msgid "title"
msgstr ""
@ -691,22 +691,22 @@ msgstr ""
msgid "reset your password"
msgstr ""
#: lib/memex_web/live/pipeline_live/form_component.html.heex:25
#: lib/memex_web/live/pipeline_live/form_component.html.heex:29
#: lib/memex_web/live/step_live/form_component.html.heex:25
#: lib/memex_web/live/step_live/form_component.html.heex:29
#: lib/memex_web/live/pipeline_live/form_component.html.heex:26
#: lib/memex_web/live/pipeline_live/form_component.html.heex:30
#: lib/memex_web/live/step_live/form_component.html.heex:26
#: lib/memex_web/live/step_live/form_component.html.heex:30
#, elixir-autogen, elixir-format
msgid "use [[[note-slug]]] to link to a note or use [[context-slug]] to link to a context or [pipeline-slug] to link to a pipeline"
msgstr ""
#: lib/memex_web/live/context_live/form_component.html.heex:25
#: lib/memex_web/live/context_live/form_component.html.heex:27
#: lib/memex_web/live/context_live/form_component.html.heex:26
#: lib/memex_web/live/context_live/form_component.html.heex:28
#, elixir-autogen, elixir-format, fuzzy
msgid "use [[note-slug]] to link to a note or [context-slug] to link to a context"
msgstr ""
#: lib/memex_web/live/note_live/form_component.html.heex:24
#: lib/memex_web/live/note_live/form_component.html.heex:25
#: lib/memex_web/live/note_live/form_component.html.heex:26
#, elixir-autogen, elixir-format, fuzzy
msgid "use [note-slug] to link to a note"
msgstr ""