From f3bb56925b57bcaeda50c594077552cab9423599 Mon Sep 17 00:00:00 2001
From: ClemDee <clement.desableau@xwiki.com>
Date: Thu, 25 Jul 2019 14:13:14 +0200
Subject: [PATCH 1/3] Change browser color picker to jscolor picker for cursor
 color

---
 www/settings/app-settings.less | 10 ++++++++--
 www/settings/inner.js          | 29 +++++++++++++++++++++--------
 2 files changed, 29 insertions(+), 10 deletions(-)

diff --git a/www/settings/app-settings.less b/www/settings/app-settings.less
index 0c21bfed0..185b22741 100644
--- a/www/settings/app-settings.less
+++ b/www/settings/app-settings.less
@@ -111,8 +111,14 @@
                 vertical-align: middle;
                 margin-right: 5px;
             }
-            input[type="color"] {
-                width: 100px;
+            .cp-settings-cursor-color-picker {
+                display: inline-block;
+                vertical-align: middle;
+                height: 25px;
+                width: 70px;
+                margin-right: 10px;
+                cursor: pointer;
+                border: 1px solid black;
             }
             .cp-settings-language-selector {
                 button.btn {
diff --git a/www/settings/inner.js b/www/settings/inner.js
index d785391d0..73b48f871 100644
--- a/www/settings/inner.js
+++ b/www/settings/inner.js
@@ -15,6 +15,7 @@ define([
     '/settings/make-backup.js',
     '/common/common-feedback.js',
 
+    '/common/jscolor.js',
     '/bower_components/file-saver/FileSaver.min.js',
     'css!/bower_components/bootstrap/dist/css/bootstrap.min.css',
     'css!/bower_components/components-font-awesome/css/font-awesome.min.css',
@@ -1191,13 +1192,13 @@ define([
 
         var $inputBlock = $('<div>').appendTo($div);
 
+        var $colorPicker = $("<div>", { class: "cp-settings-cursor-color-picker"});
         var $ok = $('<span>', {'class': 'fa fa-check', title: Messages.saved});
         var $spinner = $('<span>', {'class': 'fa fa-spinner fa-pulse'});
 
-        var $input = $('<input>', {
-            type: 'color',
-        }).on('change', function () {
-            var val = $input.val();
+        // when jscolor picker value change
+        var onchange = function (colorL) {
+            var val = "#" + colorL.toString();
             if (!/^#[0-9a-fA-F]{6}$/.test(val)) { return; }
             $spinner.show();
             $ok.hide();
@@ -1205,15 +1206,27 @@ define([
                 $spinner.hide();
                 $ok.show();
             });
-        }).appendTo($inputBlock);
+            $colorPicker.css('bakcground-color', val);
+        };
 
-        $ok.hide().appendTo($inputBlock);
-        $spinner.hide().appendTo($inputBlock);
+        // jscolor picker
+        var jscolorL = new window.jscolor($colorPicker[0],{showOnClick: false, onFineChange: onchange, valueElement:undefined});
+        $colorPicker.click(function () {
+            jscolorL.show();
+        });
 
+        // set default color
         common.getAttribute(['general', 'cursor', 'color'], function (e, val) {
             if (e) { return void console.error(e); }
-            $input.val(val || '');
+            val = val || "#000";
+            $colorPicker.css('bakcground-color', val);
+            jscolorL.fromString(val);
         });
+
+        $colorPicker.appendTo($inputBlock);
+        $ok.hide().appendTo($inputBlock);
+        $spinner.hide().appendTo($inputBlock);
+
         return $div;
     };
 

From aceff466b99fe4f56423babffa09294aa6ab082a Mon Sep 17 00:00:00 2001
From: ClemDee <clement.desableau@xwiki.com>
Date: Thu, 25 Jul 2019 14:15:44 +0200
Subject: [PATCH 2/3] Remove useless jscolor picker import

---
 www/drive/inner.js | 2 --
 1 file changed, 2 deletions(-)

diff --git a/www/drive/inner.js b/www/drive/inner.js
index fd7723bca..b5e851891 100644
--- a/www/drive/inner.js
+++ b/www/drive/inner.js
@@ -17,8 +17,6 @@ define([
     '/bower_components/chainpad-listmap/chainpad-listmap.js',
     '/customize/messages.js',
 
-    '/common/jscolor.js',
-
     'css!/bower_components/bootstrap/dist/css/bootstrap.min.css',
     'css!/bower_components/components-font-awesome/css/font-awesome.min.css',
     'less!/drive/app-drive.less',

From ce6e4b083899cff57233730390c4629063d4f29b Mon Sep 17 00:00:00 2001
From: ClemDee <clement.desableau@xwiki.com>
Date: Thu, 8 Aug 2019 14:46:28 +0200
Subject: [PATCH 3/3] Remove useless code

---
 www/settings/inner.js | 2 --
 1 file changed, 2 deletions(-)

diff --git a/www/settings/inner.js b/www/settings/inner.js
index 73b48f871..e8e22a027 100644
--- a/www/settings/inner.js
+++ b/www/settings/inner.js
@@ -1206,7 +1206,6 @@ define([
                 $spinner.hide();
                 $ok.show();
             });
-            $colorPicker.css('bakcground-color', val);
         };
 
         // jscolor picker
@@ -1219,7 +1218,6 @@ define([
         common.getAttribute(['general', 'cursor', 'color'], function (e, val) {
             if (e) { return void console.error(e); }
             val = val || "#000";
-            $colorPicker.css('bakcground-color', val);
             jscolorL.fromString(val);
         });