From 7e02a94b5cc37446bc1623a1577b31bdccc6c06e Mon Sep 17 00:00:00 2001 From: Bjarne Fyrstenborg Date: Mon, 17 Aug 2020 15:03:19 +0200 Subject: [PATCH 01/10] Pass in value to preventEnterSubmit directive --- .../forms/prevententersubmit.directive.js | 2 +- .../components/forms/umb-search-filter.html | 31 ++++++------------- 2 files changed, 10 insertions(+), 23 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/forms/prevententersubmit.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/forms/prevententersubmit.directive.js index 355b02216f5f..62334387cb38 100644 --- a/src/Umbraco.Web.UI.Client/src/common/directives/components/forms/prevententersubmit.directive.js +++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/forms/prevententersubmit.directive.js @@ -17,7 +17,7 @@ angular.module("umbraco.directives") } $(element).on("keypress", function (event) { - if (event.which === 13) { + if (event.which === 13 && enabled === true) { event.preventDefault(); } }); diff --git a/src/Umbraco.Web.UI.Client/src/views/components/forms/umb-search-filter.html b/src/Umbraco.Web.UI.Client/src/views/components/forms/umb-search-filter.html index 0879f9b72cc0..1cef83dfa502 100644 --- a/src/Umbraco.Web.UI.Client/src/views/components/forms/umb-search-filter.html +++ b/src/Umbraco.Web.UI.Client/src/views/components/forms/umb-search-filter.html @@ -2,27 +2,14 @@
- - - +
From 536ce855c4545ead82cea77b4013bf9010a8687b Mon Sep 17 00:00:00 2001 From: Bjarne Fyrstenborg Date: Mon, 17 Aug 2020 15:47:09 +0200 Subject: [PATCH 02/10] Set enabled similar to preventDefault and preventEnterSubmit directives --- .../components/forms/umbautofocus.directive.js | 17 +++++++++++++---- 1 file changed, 13 insertions(+), 4 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/forms/umbautofocus.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/forms/umbautofocus.directive.js index eb3503f799b3..f53cddbc9873 100644 --- a/src/Umbraco.Web.UI.Client/src/common/directives/components/forms/umbautofocus.directive.js +++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/forms/umbautofocus.directive.js @@ -1,18 +1,27 @@ angular.module("umbraco.directives") .directive('umbAutoFocus', function($timeout) { - return function(scope, element, attr){ + return function (scope, element, attrs) { var update = function() { //if it uses its default naming - if(element.val() === "" || attr.focusOnFilled){ + if (element.val() === "" || attrs.focusOnFilled){ element.trigger("focus"); } }; - if (attr.umbAutoFocus !== "false") { + var enabled = true; + //check if there's a value for the attribute, if there is and it's false then we conditionally don't + //use auto focus. + if (attrs.umbAutoFocus) { + attrs.$observe("umbAutoFocus", function (newVal) { + enabled = (newVal === "false" || newVal === 0 || newVal === false) ? false : true; + }); + } + + if (enabled) { $timeout(function() { update(); }); } - }; + }; }); From d3162fd6694e7e5df653ec1d05d7d3adb9c66560 Mon Sep 17 00:00:00 2001 From: Bjarne Fyrstenborg Date: Mon, 17 Aug 2020 15:52:30 +0200 Subject: [PATCH 03/10] Update prevent enter submit value --- .../src/views/components/forms/umb-search-filter.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/Umbraco.Web.UI.Client/src/views/components/forms/umb-search-filter.html b/src/Umbraco.Web.UI.Client/src/views/components/forms/umb-search-filter.html index 1cef83dfa502..1bd0997f7e48 100644 --- a/src/Umbraco.Web.UI.Client/src/views/components/forms/umb-search-filter.html +++ b/src/Umbraco.Web.UI.Client/src/views/components/forms/umb-search-filter.html @@ -9,7 +9,7 @@ class="umb-search-field search-query search-input input-block-level" placeholder="{{vm.text}}" umb-auto-focus="{{vm.autoFocus === true}}" - prevent-enter-submit="vm.preventSubmitOnEnter" + prevent-enter-submit="{{vm.preventSubmitOnEnter === true}}" no-dirty-check /> From f6969c39c30296514dcf0898243daa6a26ff2f13 Mon Sep 17 00:00:00 2001 From: Bjarne Fyrstenborg Date: Mon, 17 Aug 2020 16:11:01 +0200 Subject: [PATCH 04/10] Init value from controller --- .../components/forms/umbsearchfilter.directive.js | 6 ++++-- .../src/views/components/forms/umb-search-filter.html | 4 ++-- 2 files changed, 6 insertions(+), 4 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/forms/umbsearchfilter.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/forms/umbsearchfilter.directive.js index 792931627575..f7f9ae21cdc0 100644 --- a/src/Umbraco.Web.UI.Client/src/common/directives/components/forms/umbsearchfilter.directive.js +++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/forms/umbsearchfilter.directive.js @@ -43,12 +43,14 @@ function onInit() { vm.inputId = vm.inputId || "umb-check_" + String.CreateGuid(); + vm.autoFocus = vm.autoFocus === true; + vm.preventSubmitOnEnter = vm.preventSubmitOnEnter === true; // If a labelKey is passed let's update the returned text if it's does not contain an opening square bracket [ if (vm.labelKey) { localizationService.localize(vm.labelKey).then(function (data) { - if(data.indexOf('[') === -1){ - vm.text = data; + if (data.indexOf('[') === -1){ + vm.text = data; } }); } diff --git a/src/Umbraco.Web.UI.Client/src/views/components/forms/umb-search-filter.html b/src/Umbraco.Web.UI.Client/src/views/components/forms/umb-search-filter.html index 1bd0997f7e48..8d71107911cd 100644 --- a/src/Umbraco.Web.UI.Client/src/views/components/forms/umb-search-filter.html +++ b/src/Umbraco.Web.UI.Client/src/views/components/forms/umb-search-filter.html @@ -8,8 +8,8 @@ ng-model="vm.model" class="umb-search-field search-query search-input input-block-level" placeholder="{{vm.text}}" - umb-auto-focus="{{vm.autoFocus === true}}" - prevent-enter-submit="{{vm.preventSubmitOnEnter === true}}" + umb-auto-focus="{{vm.autoFocus}}" + prevent-enter-submit="{{vm.preventSubmitOnEnter}}" no-dirty-check /> From 8cbb2137cdca70e714887502fc122b772607211c Mon Sep 17 00:00:00 2001 From: Bjarne Fyrstenborg Date: Mon, 17 Aug 2020 16:12:54 +0200 Subject: [PATCH 05/10] Use a different default input id prefix for umb-search-filter --- .../directives/components/forms/umbsearchfilter.directive.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/forms/umbsearchfilter.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/forms/umbsearchfilter.directive.js index f7f9ae21cdc0..cbca9bf410bc 100644 --- a/src/Umbraco.Web.UI.Client/src/common/directives/components/forms/umbsearchfilter.directive.js +++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/forms/umbsearchfilter.directive.js @@ -42,7 +42,7 @@ vm.change = change; function onInit() { - vm.inputId = vm.inputId || "umb-check_" + String.CreateGuid(); + vm.inputId = vm.inputId || "umb-search-filter_" + String.CreateGuid(); vm.autoFocus = vm.autoFocus === true; vm.preventSubmitOnEnter = vm.preventSubmitOnEnter === true; From 929e94f36454f1bad6342c30435eb807afd03107 Mon Sep 17 00:00:00 2001 From: Bjarne Fyrstenborg Date: Tue, 1 Sep 2020 12:01:20 +0200 Subject: [PATCH 06/10] Fix typo --- .../directives/components/forms/umbsearchfilter.directive.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/forms/umbsearchfilter.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/forms/umbsearchfilter.directive.js index cbca9bf410bc..2864d3f82737 100644 --- a/src/Umbraco.Web.UI.Client/src/common/directives/components/forms/umbsearchfilter.directive.js +++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/forms/umbsearchfilter.directive.js @@ -24,7 +24,7 @@ @param {boolean} model Set to true or false to set the checkbox to checked or unchecked. @param {string} inputId Set the id of the checkbox. @param {string} text Set the text for the checkbox label. -@param {string} labelKey Set a dictinary/localization string for the checkbox label +@param {string} labelKey Set a dictionary/localization string for the checkbox label @param {callback} onChange Callback when the value of the checkbox change by interaction. @param {boolean} autoFocus Add autofocus to the input field @param {boolean} preventSubmitOnEnter Set the enter prevent directive or not From ad18fc66a0ec6f4f9d08bfd7f144a18b8282adfb Mon Sep 17 00:00:00 2001 From: Bjarne Fyrstenborg Date: Tue, 1 Sep 2020 12:03:24 +0200 Subject: [PATCH 07/10] Check for truthly value --- .../directives/components/forms/umbsearchfilter.directive.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/forms/umbsearchfilter.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/forms/umbsearchfilter.directive.js index 2864d3f82737..3066c3bf2f8c 100644 --- a/src/Umbraco.Web.UI.Client/src/common/directives/components/forms/umbsearchfilter.directive.js +++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/forms/umbsearchfilter.directive.js @@ -43,8 +43,8 @@ function onInit() { vm.inputId = vm.inputId || "umb-search-filter_" + String.CreateGuid(); - vm.autoFocus = vm.autoFocus === true; - vm.preventSubmitOnEnter = vm.preventSubmitOnEnter === true; + vm.autoFocus = Object.toBoolean(vm.autoFocus) === true; + vm.preventSubmitOnEnter = Object.toBoolean(vm.preventSubmitOnEnter) === true; // If a labelKey is passed let's update the returned text if it's does not contain an opening square bracket [ if (vm.labelKey) { From 05b164345e5bff7b2e3725a13aaf2d24e130b61c Mon Sep 17 00:00:00 2001 From: Bjarne Fyrstenborg Date: Wed, 2 Sep 2020 11:39:16 +0200 Subject: [PATCH 08/10] Revert "Set enabled similar to preventDefault and preventEnterSubmit directives" This reverts commit 536ce855c4545ead82cea77b4013bf9010a8687b. --- .../components/forms/umbautofocus.directive.js | 17 ++++------------- 1 file changed, 4 insertions(+), 13 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/forms/umbautofocus.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/forms/umbautofocus.directive.js index f53cddbc9873..eb3503f799b3 100644 --- a/src/Umbraco.Web.UI.Client/src/common/directives/components/forms/umbautofocus.directive.js +++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/forms/umbautofocus.directive.js @@ -1,27 +1,18 @@ angular.module("umbraco.directives") .directive('umbAutoFocus', function($timeout) { - return function (scope, element, attrs) { + return function(scope, element, attr){ var update = function() { //if it uses its default naming - if (element.val() === "" || attrs.focusOnFilled){ + if(element.val() === "" || attr.focusOnFilled){ element.trigger("focus"); } }; - var enabled = true; - //check if there's a value for the attribute, if there is and it's false then we conditionally don't - //use auto focus. - if (attrs.umbAutoFocus) { - attrs.$observe("umbAutoFocus", function (newVal) { - enabled = (newVal === "false" || newVal === 0 || newVal === false) ? false : true; - }); - } - - if (enabled) { + if (attr.umbAutoFocus !== "false") { $timeout(function() { update(); }); } - }; + }; }); From 43adbd7d38b7f1889f21e76622a91201d5f9083c Mon Sep 17 00:00:00 2001 From: Bjarne Fyrstenborg Date: Tue, 30 Mar 2021 17:19:17 +0200 Subject: [PATCH 09/10] None pointer events when clicking icon --- .../src/less/components/umb-search-filter.less | 1 + 1 file changed, 1 insertion(+) diff --git a/src/Umbraco.Web.UI.Client/src/less/components/umb-search-filter.less b/src/Umbraco.Web.UI.Client/src/less/components/umb-search-filter.less index b96d3e856917..109210812d50 100644 --- a/src/Umbraco.Web.UI.Client/src/less/components/umb-search-filter.less +++ b/src/Umbraco.Web.UI.Client/src/less/components/umb-search-filter.less @@ -27,5 +27,6 @@ html .umb-search-filter { bottom: 0; left: 10px; margin: auto 0; + pointer-events: none; } } From e3e99471b1f33c85441517efc51dd3e09adf07aa Mon Sep 17 00:00:00 2001 From: Bjarne Fyrstenborg Date: Tue, 30 Mar 2021 17:20:54 +0200 Subject: [PATCH 10/10] Use color variable --- .../src/less/components/umb-search-filter.less | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/Umbraco.Web.UI.Client/src/less/components/umb-search-filter.less b/src/Umbraco.Web.UI.Client/src/less/components/umb-search-filter.less index 109210812d50..b38f5937c727 100644 --- a/src/Umbraco.Web.UI.Client/src/less/components/umb-search-filter.less +++ b/src/Umbraco.Web.UI.Client/src/less/components/umb-search-filter.less @@ -21,7 +21,7 @@ html .umb-search-filter { // "icon-search" class it kept for backward compatibility .umb-icon, .icon-search { - color: #d8d7d9; + color: @gray-8; position: absolute; top: 0; bottom: 0;