From a8cf725312d245d8d1f1df0fff22718975ce249e Mon Sep 17 00:00:00 2001 From: erdgeist Date: Thu, 20 Aug 2026 12:50:30 +0200 Subject: Add redirect ui in in nodes#edit and apply some minor cleanup Also give search inputs a magnifier and a clear control: input_group wraps a field with an icon and, where clearing is meaningful, a button that empties it and any hidden companion named by data-clears. Clean up some inconistency between field hints presented as p and as span. Remove stray console.log. --- public/javascripts/admin_interface.js | 27 ++++++++++++++++++++- public/javascripts/admin_search.js | 14 +++++++++++ public/stylesheets/admin.css | 45 +++++++++++++++++++++++++++++++---- 3 files changed, 80 insertions(+), 6 deletions(-) (limited to 'public') diff --git a/public/javascripts/admin_interface.js b/public/javascripts/admin_interface.js index 994d3698..ffebb694 100644 --- a/public/javascripts/admin_interface.js +++ b/public/javascripts/admin_interface.js @@ -63,7 +63,6 @@ $(document).ready(function () { search_toggle.addEventListener('click', function (e) { admin_search.display_toggle(); e.preventDefault(); - console.log("Toggle"); }); } @@ -124,6 +123,32 @@ $(document).ready(function () { }); } + document.querySelectorAll('.field_clear').forEach(function (btn) { + btn.addEventListener('click', function () { + var wrap = btn.closest('.input_group'); + wrap.querySelector('input[type=text]').value = ''; + var hidden = wrap.dataset.clears; + if (hidden) { document.getElementById(hidden).value = ''; } + }); + }); + + if (document.getElementById('redirect_search_term')) { + redirect_search.initialize_search(); + + var mode = document.getElementById('page_redirect'); + var field = document.getElementById('redirect_target_field'); + mode.addEventListener('change', function () { + field.style.display = mode.checked ? '' : 'none'; + }); + + var term = document.getElementById('redirect_search_term'); + term.addEventListener('input', function () { + if (term.value === '') { + document.getElementById('page_redirect_node_id').value = ''; + } + }); + } + var metadata_details = document.getElementById('metadata_details'); if (metadata_details) { var desktop_mq = window.matchMedia('(min-width: 1016px)'); diff --git a/public/javascripts/admin_search.js b/public/javascripts/admin_search.js index e20e511a..746cecc1 100644 --- a/public/javascripts/admin_search.js +++ b/public/javascripts/admin_search.js @@ -263,6 +263,20 @@ move_to_search = { } }; +redirect_search = { + initialize_search : function() { + initSearchPicker({ + inputSelector: "#redirect_search_term", + resultsSelector: "#redirect_search_results", + showRestricted: true, + onSelect: function(node) { + $("#redirect_search_term").val(node.title); + $("#page_redirect_node_id").val(node.node_id); + } + }); + } +}; + restore_search = { initialize_search : function() { initSearchPicker({ diff --git a/public/stylesheets/admin.css b/public/stylesheets/admin.css index 923cac4b..63333d93 100644 --- a/public/stylesheets/admin.css +++ b/public/stylesheets/admin.css @@ -446,11 +446,8 @@ form.button_to.computation button[type="submit"]:disabled { pointer-events: none; } -/* Native (non-button_to) submit buttons -- Create/Save/Publish forms. - Lower specificity than form.button_to's own rule, so button_to forms - are correctly unaffected. If a button_to output ever loses its class - wrapper, it will silently fall through to this bordered style instead - of rendering as a plain link -- worth knowing, not necessarily fixing. */ +/* Native (non-button_to) submit buttons used for Create/Save/Publish + forms. */ input[type="submit"] { -webkit-appearance: none; appearance: none; @@ -470,6 +467,44 @@ input[type="submit"]:hover { background-color: var(--text); } +.input_group { + width: 100%; + position: relative; + display: inline-block; +} + +.input_group .field_search_icon { + position: absolute; + left: 0.5rem; + top: 55%; + transform: translateY(-50%); + color: var(--text-muted); + pointer-events: none; +} + +.input_group .field_search_icon svg { + width: 1em; + height: 1em; +} + +.input_group input[type="text"].clearable_input { + padding-left: 2rem; + padding-right: 1.75rem; +} + +.field_clear { + position: absolute; + right: 0.25rem; + top: 50%; + transform: translateY(-50%); + appearance: none; + background: none; + border: 0; + color: var(--text-muted); + cursor: pointer; + line-height: 1; +} + /* ============================================================ Admin dashboard ============================================================ */ -- cgit v1.3