From 8f05c156563b882f3e843df54dbd46f142b804a3 Mon Sep 17 00:00:00 2001 From: Pedro Pinto Silva Date: Thu, 23 Apr 2020 14:11:42 +0200 Subject: [PATCH] Mobile: mWizard: disabled input fields: make sure both image and spinfield controls do not stay active And make sure the js listener is only added when the inputfield is enabled (fixing useless callbacks and changes on html) Change-Id: I4f4f2b4430b1c43143f95ab9d9fe075c8e1f49b8 Reviewed-on: https://gerrit.libreoffice.org/c/online/+/92763 Tested-by: Jenkins CollaboraOffice Tested-by: Pedro Pinto da Silva Reviewed-by: Pedro Pinto da Silva --- loleaflet/css/mobilewizard.css | 8 +++++- .../src/control/Control.JSDialogBuilder.js | 26 ++++++++++++------- 2 files changed, 24 insertions(+), 10 deletions(-) diff --git a/loleaflet/css/mobilewizard.css b/loleaflet/css/mobilewizard.css index 1a8919e4e..d2b7d73b6 100644 --- a/loleaflet/css/mobilewizard.css +++ b/loleaflet/css/mobilewizard.css @@ -540,8 +540,11 @@ input.spinfield:disabled ~ .spinfieldcontrols * { background-color: #f9f9f9; } -input.spinfield:disabled ~ .spinfieldcontrols *:active { +input.spinfield:disabled ~ .spinfieldcontrols *:active, input.spinfield:disabled ~ .spinfieldcontrols *:hover, input.spinfield:disabled ~ .spinfieldcontrols *:focus { background-color: #f9f9f9 !important; + filter: none; + font-size: 100%; + font-weight: normal; } /*insert table special layout*/ @@ -701,6 +704,9 @@ div#mobile-wizard-content .spinfieldcontainer .spinfieldimage { div#mobile-wizard-content .spinfieldcontainer:active .spinfieldimage, div#mobile-wizard-content .spinfieldcontainer:focus .spinfieldimage, div#mobile-wizard-content .spinfieldcontainer:hover .spinfieldimage { opacity: 1 !important; } +div#mobile-wizard-content .spinfieldcontainer .spinfieldimage.disabled { + opacity: 0.5 !important; +} #buttonbefore, #buttonafter, #buttonoptimal, #buttonparallel, #buttonnone, #buttonthrough, #bottom, #top, #standard, #Bold, #Italic, #Underline, #Strikeout{ margin: 0; padding: 0; diff --git a/loleaflet/src/control/Control.JSDialogBuilder.js b/loleaflet/src/control/Control.JSDialogBuilder.js index 323f69bd7..c9a410feb 100644 --- a/loleaflet/src/control/Control.JSDialogBuilder.js +++ b/loleaflet/src/control/Control.JSDialogBuilder.js @@ -1044,8 +1044,10 @@ L.Control.JSDialogBuilder = L.Control.extend({ if (data.max != undefined) $(spinfield).attr('max', data.max); - if (data.enabled == 'false') + if (data.enabled == 'false') { $(spinfield).attr('disabled', 'disabled'); + $(image).addClass('disabled'); + } if (data.readOnly === true) $(spinfield).attr('readOnly', 'true'); @@ -1081,17 +1083,23 @@ L.Control.JSDialogBuilder = L.Control.extend({ }); plus.addEventListener('click', function() { - if (customCallback) - customCallback('spinfield', 'plus', div, this.value, builder); - else - builder.callback('spinfield', 'plus', div, this.value, builder); + var attrdisabled = $(spinfield).attr('disabled'); + if (attrdisabled !== 'disabled') { + if (customCallback) + customCallback('spinfield', 'plus', div, this.value, builder); + else + builder.callback('spinfield', 'plus', div, this.value, builder); + } }); minus.addEventListener('click', function() { - if (customCallback) - customCallback('spinfield', 'minus', div, this.value, builder); - else - builder.callback('spinfield', 'minus', div, this.value, builder); + var attrdisabled = $(spinfield).attr('disabled'); + if (attrdisabled !== 'disabled') { + if (customCallback) + customCallback('spinfield', 'minus', div, this.value, builder); + else + builder.callback('spinfield', 'minus', div, this.value, builder); + } }); if (data.hidden)