From 166b602887e9c7f7d51b75aa1932eb03e78c2298 Mon Sep 17 00:00:00 2001
From: Agriya Dev5 <agriya.dev5@agriya.in>
Date: Fri, 5 Feb 2021 19:31:12 +0530
Subject: [PATCH] #46 paintbox and current element color set issue fixed

---
 src/editor/components/PaintBox.js      | 7 +++----
 src/editor/components/seColorPicker.js | 6 +++---
 2 files changed, 6 insertions(+), 7 deletions(-)

diff --git a/src/editor/components/PaintBox.js b/src/editor/components/PaintBox.js
index ae604c6d..0f7bb392 100644
--- a/src/editor/components/PaintBox.js
+++ b/src/editor/components/PaintBox.js
@@ -1,4 +1,3 @@
-/* globals $ */
 import {jGraduate} from './jgraduate/jQuery.jGraduate.js';
 /**
  *
@@ -21,7 +20,7 @@ class PaintBox {
 
     let docElem = svgdocbox.documentElement;
     docElem = document.importNode(docElem, true);
-    container.append(docElem);
+    container.appendChild(docElem);
 
     this.rect = docElem.firstElementChild;
     this.defs = docElem.getElementsByTagName('defs')[0];
@@ -49,7 +48,7 @@ class PaintBox {
     case 'radialGradient': {
       this.grad.remove();
       this.grad = paint[ptype];
-      this.defs.append(this.grad);
+      this.defs.appendChild(this.grad);
       const id = this.grad.id = 'gradbox_' + this.type;
       fillAttr = 'url(#' + id + ')';
       break;
@@ -71,7 +70,7 @@ class PaintBox {
     const opts = {alpha: opac};
     if (color.startsWith('url(#')) {
       let refElem = svgCanvas.getRefElem(color);
-      refElem = (refElem) ? refElem.cloneNode(true) : $('#' + type + '_color defs *')[0];
+      refElem = (refElem) ? refElem.cloneNode(true) : document.querySelectorAll('#' + type + '_color defs *')[0];
       opts[refElem.tagName] = refElem;
     } else if (color.startsWith('#')) {
       opts.solidColor = color.substr(1);
diff --git a/src/editor/components/seColorPicker.js b/src/editor/components/seColorPicker.js
index 49b8ce58..c527b1a7 100644
--- a/src/editor/components/seColorPicker.js
+++ b/src/editor/components/seColorPicker.js
@@ -170,13 +170,13 @@ export class SeColorPicker extends HTMLElement {
    */
   connectedCallback () {
     this.paintBox = new PaintBox(this.$block, this.type);
-    let {paint} = this.paintBox;
     $(this.$picker).click(() => {
       /* $(this.$color_picker)
         .draggable({
           cancel: '.jGraduate_tabs, .jGraduate_colPick, .jGraduate_gradPick, .jPicker',
           containment: 'window'
         }); */
+      let {paint} = this.paintBox;
       jGraduateMethod(
         this.$color_picker,
         {
@@ -192,10 +192,10 @@ export class SeColorPicker extends HTMLElement {
             paint
           }});
           this.dispatchEvent(changeEvent);
-          $('#color_picker').hide();
+          this.$color_picker.style.display = 'none';
         },
         () => {
-          $('#color_picker').hide();
+          this.$color_picker.style.display = 'none';
         }
       );
     });