diff --git a/app/helpers/application_helper.rb b/app/helpers/application_helper.rb index 396a6f1..64c08b1 100644 --- a/app/helpers/application_helper.rb +++ b/app/helpers/application_helper.rb @@ -102,8 +102,10 @@ module ApplicationHelper tag.tr tag.td t('.no_items'), colspan: 10, class: 'hint' end - def turbo_stream_handler(partial) - "Turbo.renderStreamMessage('#{j(render partial: partial)}'); return false;" + def render_turbo_stream(partial, locals) + # TODO: extend with smth like "if outside of rendering, render; otherwise + # appendChild() template within current render" + "Turbo.renderStreamMessage('#{j(render partial: partial, locals: locals)}'); return false;" end private diff --git a/app/javascript/application.js b/app/javascript/application.js index d5a0d13..cf3f536 100644 --- a/app/javascript/application.js +++ b/app/javascript/application.js @@ -1,4 +1,5 @@ -// Configure your import map in config/importmap.rb. Read more: https://github.com/rails/importmap-rails +// Configure your import map in config/importmap.rb. Read more: +// https://github.com/rails/importmap-rails import "@hotwired/turbo-rails" function showPage(event) { @@ -6,6 +7,31 @@ function showPage(event) { } document.addEventListener('turbo:load', showPage) +/* +function beforeStreamRender(event) { + console.log(event.target) +} +document.addEventListener('turbo:before-stream-render', beforeStreamRender) +*/ + +Turbo.session.streamMessageRenderer.appendFragment = async function (fragment) { + for (let child of [...fragment.children]) { + document.documentElement.appendChild(child) + if (child.action == "click") { + await new Promise((resolve) => { + new MutationObserver((mutations, observer) => { + mutations.forEach((m) => { + if ([...m.removedNodes].includes(child)) { + resolve(child) + observer.disconnect() + } + }) + }).observe(document.documentElement, {childList: true}) + }) + } + } +} + Turbo.StreamActions.disable = function() { this.targetElements.forEach((e) => { @@ -24,6 +50,15 @@ Turbo.StreamActions.enable = function() { }) } +Turbo.StreamActions.blur = function() { + blur() +} + Turbo.StreamActions.focus = function() { + // NOTE: call blur() before setting focus? this.targetElements[0].focus({focusVisible: true}) } + +Turbo.StreamActions.click = function() { + this.targetElements.forEach((e) => { e.click() }) +} diff --git a/app/views/units/_form.html.erb b/app/views/units/_form.html.erb index 454ee3f..6b7d7f7 100644 --- a/app/views/units/_form.html.erb +++ b/app/views/units/_form.html.erb @@ -19,7 +19,7 @@