From d6508a13271bd81ef86e6d520fe74438cb16c7c3 Mon Sep 17 00:00:00 2001
From: MuK IT GmbH <mathias.markl@mukit.at>
Date: Sun, 4 Nov 2018 11:30:15 +0000
Subject: [PATCH] publish muk_web_utils - 12.0

---
 muk_web_utils/__manifest__.py                 |  3 +-
 muk_web_utils/doc/changelog.rst               |  7 +-
 .../static/src/js/editor/snippets/options.js  | 93 +++++++++++++++++++
 muk_web_utils/static/src/scss/editor.scss     | 22 +++++
 muk_web_utils/template/assets.xml             | 12 ++-
 muk_web_utils/template/editor.xml             | 33 +++++++
 6 files changed, 167 insertions(+), 3 deletions(-)
 create mode 100644 muk_web_utils/static/src/js/editor/snippets/options.js
 create mode 100644 muk_web_utils/static/src/scss/editor.scss
 create mode 100644 muk_web_utils/template/editor.xml

diff --git a/muk_web_utils/__manifest__.py b/muk_web_utils/__manifest__.py
index 666484f..4fbbf10 100644
--- a/muk_web_utils/__manifest__.py
+++ b/muk_web_utils/__manifest__.py
@@ -20,7 +20,7 @@
 {
     "name": "MuK Web Utils",
     "summary": """Utility Features""",
-    "version": "12.0.2.2.1",
+    "version": "12.0.2.3.0",
     "category": "Extra Tools",
     "license": "AGPL-3",
     "author": "MuK IT",
@@ -35,6 +35,7 @@
     ],
     "data": [
         "template/assets.xml",
+        "template/editor.xml",
     ],
     "qweb": [
         "static/src/xml/*.xml",
diff --git a/muk_web_utils/doc/changelog.rst b/muk_web_utils/doc/changelog.rst
index 8576dd3..c0b8c16 100644
--- a/muk_web_utils/doc/changelog.rst
+++ b/muk_web_utils/doc/changelog.rst
@@ -1,4 +1,9 @@
-`2.1.0`
+`2.3.0`
+-------
+
+- Added custom colors to snippet options
+
+`2.2.0`
 -------
 
 - Added widget to share text fields
diff --git a/muk_web_utils/static/src/js/editor/snippets/options.js b/muk_web_utils/static/src/js/editor/snippets/options.js
new file mode 100644
index 0000000..3f4a400
--- /dev/null
+++ b/muk_web_utils/static/src/js/editor/snippets/options.js
@@ -0,0 +1,93 @@
+/**********************************************************************************
+* 
+*    Copyright (C) 2017 MuK IT GmbH
+*
+*    This program is free software: you can redistribute it and/or modify
+*    it under the terms of the GNU Affero General Public License as
+*    published by the Free Software Foundation, either version 3 of the
+*    License, or (at your option) any later version.
+*
+*    This program is distributed in the hope that it will be useful,
+*    but WITHOUT ANY WARRANTY; without even the implied warranty of
+*    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+*    GNU Affero General Public License for more details.
+*
+*    You should have received a copy of the GNU Affero General Public License
+*    along with this program.  If not, see <http://www.gnu.org/licenses/>.
+*
+**********************************************************************************/
+
+odoo.define('muk_web_utils.snippet_options', function (require) {
+"use strict";
+
+var core = require('web.core');
+var colorpicker = require('web.colorpicker');
+var options = require('web_editor.snippets.options');
+
+var _t = core._t;
+var QWeb = core.qweb;
+
+options.registry.colorpicker.include({
+	events: _.extend({}, options.registry.colorpicker.prototype.events || {}, {
+        'click .mk_add_custom_color': '_onCustomColorButtonClick',
+    }),
+    start: function () {
+        var res = this._super.apply(this, arguments);
+        this._renderPickedColors();
+        return res;
+    },
+    onFocus: function () {
+        this._renderPickedColors();
+    },
+    _renderPickedColors: function () {
+    	var $editable = window.__EditorMenuBar_$editable;
+    	if (this.$el.find('.colorpicker').length && $editable.length) {
+    		var $snippets = $editable.find('.mk_custom_background');
+    		var colors = _.map($snippets, function ($el) {
+                return $el.style.backgroundColor;
+            });
+            this.$el.find('.colorpicker .mk_custom_color').remove();
+            this.$el.find('.colorpicker button.selected').removeClass('selected');
+    		_.each( _.uniq(colors), function (color) {
+    			var classes = ['mk_custom_color'];
+    			if (this.$target.css('background-color') === color) {
+    				classes.push('selected');
+                }
+                var $colorButton = $('<button/>', {
+                    style: 'background-color:' + color + ';',
+                    class: classes.join(' '),
+                });
+                this.$el.find('.mk_add_custom_color').before($colorButton);
+            }, this);
+        }
+    },
+    _onColorButtonEnter: function (event) {
+    	this._super.apply(this, arguments);
+    	if ($(event.target).hasClass('mk_custom_color')) {
+    		var color = event.currentTarget.style.backgroundColor;
+            this.$target.removeClass(this.classes);
+            this.$target.css('background-color', color);
+            this.$target.trigger('background-color-event', true);
+        }
+    },
+    _onColorButtonClick: function (event) {
+    	this._super.apply(this, arguments);
+    	var isCustomColor = $(event.target).hasClass('mk_custom_color');
+    	this.$target.toggleClass('mk_custom_background', isCustomColor);
+        this._renderPickedColors();
+    },
+    _onCustomColorButtonClick: function () {
+        var ColorpickerDialog = new colorpicker(this, {});
+        ColorpickerDialog.on('colorpicker:saved', this, function (event) {
+        	this.$target.removeClass(this.classes);
+        	this.$target.addClass('mk_custom_background');
+        	this.$target.css('background-color', event.data.cssColor);
+            this.$target.closest('.o_editable').trigger('content_changed');
+            this.$target.trigger('background-color-event', false);
+            this._renderPickedColors();
+        });
+        ColorpickerDialog.open();
+    },
+});
+
+});
\ No newline at end of file
diff --git a/muk_web_utils/static/src/scss/editor.scss b/muk_web_utils/static/src/scss/editor.scss
new file mode 100644
index 0000000..49aadc2
--- /dev/null
+++ b/muk_web_utils/static/src/scss/editor.scss
@@ -0,0 +1,22 @@
+/**********************************************************************************
+* 
+*    Copyright (C) 2017 MuK IT GmbH
+*
+*    This program is free software: you can redistribute it and/or modify
+*    it under the terms of the GNU Affero General Public License as
+*    published by the Free Software Foundation, either version 3 of the
+*    License, or (at your option) any later version.
+*
+*    This program is distributed in the hope that it will be useful,
+*    but WITHOUT ANY WARRANTY; without even the implied warranty of
+*    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+*    GNU Affero General Public License for more details.
+*
+*    You should have received a copy of the GNU Affero General Public License
+*    along with this program.  If not, see <http://www.gnu.org/licenses/>.
+*
+**********************************************************************************/
+	
+.mk_add_custom_color {
+	padding: 0 ! important;
+}
\ No newline at end of file
diff --git a/muk_web_utils/template/assets.xml b/muk_web_utils/template/assets.xml
index 12bb6a3..80e4594 100644
--- a/muk_web_utils/template/assets.xml
+++ b/muk_web_utils/template/assets.xml
@@ -18,7 +18,17 @@
 -->
 
 <odoo>
-
+	
+	<template id="assets_editor" name="Editor Assets" inherit_id="web_editor.assets_editor">
+		<xpath expr="//link[last()]" position="after">
+			<link rel="stylesheet" type="text/scss" href="/muk_web_utils/static/src/scss/variables.scss" />
+			<link rel="stylesheet" type="text/scss" href="/muk_web_utils/static/src/scss/editor.scss" />
+		</xpath>
+		<xpath expr="//script[last()]" position="after">
+			<script type="text/javascript" src="/muk_web_utils/static/src/js/editor/snippets/options.js" />
+		</xpath>
+	</template>
+	
 	<template id="assets_backend" name="Backend Assets" inherit_id="web.assets_backend">
 		<xpath expr="//link[last()]" position="after">
 			<link rel="stylesheet" type="text/scss" href="/muk_web_utils/static/src/scss/variables.scss" />
diff --git a/muk_web_utils/template/editor.xml b/muk_web_utils/template/editor.xml
new file mode 100644
index 0000000..f853dd5
--- /dev/null
+++ b/muk_web_utils/template/editor.xml
@@ -0,0 +1,33 @@
+<?xml version="1.0" encoding="UTF-8"?>
+
+<!--     
+	Copyright (C) 2018 MuK IT GmbH
+	
+    This program is free software: you can redistribute it and/or modify
+    it under the terms of the GNU Affero General Public License as
+    published by the Free Software Foundation, either version 3 of the
+    License, or (at your option) any later version.
+
+    This program is distributed in the hope that it will be useful,
+    but WITHOUT ANY WARRANTY; without even the implied warranty of
+    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+    GNU Affero General Public License for more details.
+
+    You should have received a copy of the GNU Affero General Public License
+    along with this program.  If not, see <http://www.gnu.org/licenses/>. 
+-->
+
+<odoo>
+	
+	<template id="colorpicker" name="Color Picker" inherit_id="web_editor.colorpicker">
+	    <xpath expr="//colorpicker/div[@data-name='common']" position="after">
+	    	<div class="o_colorpicker_section" data-name="custom" data-display="Custom Colors">
+	            <a class="btn w-100 d-block mt-2 float-left mk_add_custom_color">
+	                <i class="fa fa-plus"></i> 
+	                Add Custom Color
+	            </a>
+	        </div>
+		</xpath>
+	</template>
+
+</odoo>
\ No newline at end of file