From 928fe09f279765a5eec73f5c85df9dceb85a43c8 Mon Sep 17 00:00:00 2001 From: Andrii Nugged Date: Thu, 16 Nov 2023 18:20:55 +0200 Subject: [PATCH] Bug 35425: Optimize UX when dragging a Tag or Subfield To reproduce: 1. Open any biblio and edit that record. (select "Edit record" from the "Edit" drop-down menu). 2. Check that selecting the text in any draggable block input/textarea fields with a mouse is not possible - it starts dragging instantly. 3. Apply the patch 4. Make sure that draging is activated only when you click on the "::" icon in front of the dragged item. And text selection works correctly. --- .../intranet-tmpl/prog/css/addbiblio.css | 14 ++++------- .../prog/en/modules/cataloguing/addbiblio.tt | 24 +++++++++++-------- koha-tmpl/intranet-tmpl/prog/js/cataloging.js | 2 ++ 3 files changed, 21 insertions(+), 19 deletions(-) diff --git a/koha-tmpl/intranet-tmpl/prog/css/addbiblio.css b/koha-tmpl/intranet-tmpl/prog/css/addbiblio.css index 40dc457193..acfae906bf 100644 --- a/koha-tmpl/intranet-tmpl/prog/css/addbiblio.css +++ b/koha-tmpl/intranet-tmpl/prog/css/addbiblio.css @@ -40,20 +40,16 @@ ul li.tag::before { top: 0; } -ul li.tag.sortable_tag::before, -ul li.tag li.subfield_line::before { +ul .handle { color: #999; - content: "\f58e"; cursor: move; font-family: "Font Awesome 6 Free"; - font-size: .8em; - left: 10px; - position: absolute; - top: -3px; + font-size: 1em; + padding-right: 3px; } -ul li.tag li.subfield_line::before { - top: 3px; +ul li.subfield_line .handle { + font-size: .8em; } li.sortable-ghost { diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/cataloguing/addbiblio.tt b/koha-tmpl/intranet-tmpl/prog/en/modules/cataloguing/addbiblio.tt index 68cb3126ce..3f09598fa1 100644 --- a/koha-tmpl/intranet-tmpl/prog/en/modules/cataloguing/addbiblio.tt +++ b/koha-tmpl/intranet-tmpl/prog/en/modules/cataloguing/addbiblio.tt @@ -78,17 +78,17 @@ selectTab( "#tab0XX_panel" ); } - $("#addbibliotabs ul.sortable_field").each( (i, e) => { - Sortable.create(e, { - animation: 150 + function initializeSortable(selector) { + $(selector).each((i, e) => { + Sortable.create(e, { + handle: '.handle', + direction: 'vertical', + animation: 150, + }); }); - }); - - $("#addbibliotabs ul.sortable_subfield").each( (i, e) => { - Sortable.create(e, { - animation: 150 - }); - }); + } + initializeSortable("#addbibliotabs ul.sortable_field"); + initializeSortable("#addbibliotabs ul.sortable_subfield"); [% IF tab %] hash = "#[% tab | html %]"; @@ -1089,6 +1089,9 @@ $(document).ready(function(){
  • [% END %]
    + [% IF ( innerloo.repeatable ) %] + + [% END %] [% IF advancedMARCEditor %] [% innerloo.tag | html %] [% ELSE %] @@ -1151,6 +1154,7 @@ $(document).ready(function(){
  • + { Sortable.create(e, { + handle: '.handle', + direction: 'vertical', animation: 150, }); }); -- 2.43.0