diff --git a/assets/css/article.css b/assets/css/article.css index d9a2fa2..d6a7029 100644 --- a/assets/css/article.css +++ b/assets/css/article.css @@ -15,6 +15,14 @@ @apply hover:bg-gray-700; } +.article .tunit[current="yes"] { + @apply bg-amber-300 text-stone-700 hover:bg-amber-200 hover:text-red-900; +} + +.dark .article .tunit[current="yes"] { + @apply bg-amber-500/70 text-white hover:bg-amber-500/70 hover:text-red-900; +} + .article a.hide-link { display: none; } diff --git a/assets/js/app.js b/assets/js/app.js index 9fee884..6f8953d 100644 --- a/assets/js/app.js +++ b/assets/js/app.js @@ -23,11 +23,14 @@ import {LiveSocket} from "phoenix_live_view" import topbar from "../vendor/topbar" import {DarkModeHook} from './dark-mode-widget' +import {TranslationFormHook} from "./translation-form" let csrfToken = document.querySelector("meta[name='csrf-token']").getAttribute("content") let liveSocket = new LiveSocket("/live", Socket, { params: {_csrf_token: csrfToken}, - hooks: {dark_mode_widget: DarkModeHook}, + hooks: {translation_form: TranslationFormHook, + // tunit_editor: TunitEditorHook, + dark_mode_widget: DarkModeHook}, }) // Show progress bar on live navigation and form submits diff --git a/assets/js/translation-form.js b/assets/js/translation-form.js new file mode 100644 index 0000000..cfc0b5a --- /dev/null +++ b/assets/js/translation-form.js @@ -0,0 +1,38 @@ +let TranslationFormHook = { + + mounted() { + this.el.addEventListener("keyup", this.keyupHandler.bind(this)) + this.title_input = this.el.querySelector("#translation-form_title") + this.tunit_editor = this.el.querySelector("#tunit-editor-content") + }, + keyupHandler(e) { + var preaction = () => { } + var postaction = () => { } + var payload = {} + if (e.altKey){ + if (e.key == "ArrowDown"){ + preaction = () => { this.title_input.focus() } + postaction = () => { this.tunit_editor.focus() } + var handler = "select_next_tunit" + } else if (e.key == "ArrowUp"){ + preaction = () => { this.title_input.focus() } + postaction = () => { this.tunit_editor.focus() } + var handler = "select_previous_tunit" + } else if (e.key == "u") { + var handler = "tunit_status" + payload = {status: "untranslated"} + } else if (e.key == "p") { + var handler = "tunit_status" + payload = {status: "passable"} + } else if (e.key == "o") { + var handler = "tunit_status" + payload = {status: "done"} + } + preaction.call() + this.pushEventTo(this.el, handler, payload, postaction) + } + // console.info(["keyupHandler", e, this]) + }, +} + +export {TranslationFormHook} diff --git a/lib/outlook_web/components/tunit_editor_component.ex b/lib/outlook_web/components/tunit_editor_component.ex index ab7c630..202dddf 100644 --- a/lib/outlook_web/components/tunit_editor_component.ex +++ b/lib/outlook_web/components/tunit_editor_component.ex @@ -14,7 +14,7 @@ defmodule OutlookWeb.TunitEditorComponent do <%= @current_tunit.content |> raw %> --%>
<.status_selector target={@target} disabled={!@current_tunit.status} tunit={@current_tunit} /> diff --git a/lib/outlook_web/live/translation_live/form_component.ex b/lib/outlook_web/live/translation_live/form_component.ex index c79ce1d..b183d68 100644 --- a/lib/outlook_web/live/translation_live/form_component.ex +++ b/lib/outlook_web/live/translation_live/form_component.ex @@ -8,7 +8,7 @@ defmodule OutlookWeb.TranslationLive.FormComponent do def render(assigns) do ~H"""