From 3828e079593a2f79fb86bb12f4c930be543c57a2 Mon Sep 17 00:00:00 2001
From: Felix Hayashi <ninshinobi@msn.com>
Date: Mon, 4 Jan 2016 18:47:52 +0100
Subject: [PATCH] fixes positioning of colorpicker BUT ALSO HAS A BUG

not sure but for some reason, once the colorpicker is open, the buttons won't work correctly and the huecircle jumps back.
---
 lib/network/css/network-colorpicker.css | 13 ++++++++-----
 lib/shared/ColorPicker.js               | 10 +++-------
 lib/shared/Configurator.js              |  9 +++------
 3 files changed, 14 insertions(+), 18 deletions(-)

diff --git a/lib/network/css/network-colorpicker.css b/lib/network/css/network-colorpicker.css
index db1d49c6..07406fa8 100644
--- a/lib/network/css/network-colorpicker.css
+++ b/lib/network/css/network-colorpicker.css
@@ -1,14 +1,17 @@
 
 div.vis-color-picker {
   position:absolute;
+  top: 0px;
+  left: 30px;
   margin-top:-140px;
   margin-left:30px;
-  width:293px;
-  height:425px;
+  width:310px;
+  height:444px;
+  z-index: 1;
   padding: 10px;
   border-radius:15px;
   background-color:#ffffff;
-  display:none;
+  display: none;
   box-shadow: rgba(0,0,0,0.5) 0px 0px 10px 0px;
 }
 
@@ -18,8 +21,8 @@ div.vis-color-picker div.vis-arrow {
   left:5px;
 }
 
-div.vis-color-picker div.vis-arrow:after,
-div.vis-color-picker div.vis-arrow:before {
+div.vis-color-picker div.vis-arrow::after,
+div.vis-color-picker div.vis-arrow::before {
   right: 100%;
   top: 50%;
   border: solid transparent;
diff --git a/lib/shared/ColorPicker.js b/lib/shared/ColorPicker.js
index a0d81b12..f6ac4d7c 100644
--- a/lib/shared/ColorPicker.js
+++ b/lib/shared/ColorPicker.js
@@ -119,19 +119,15 @@ class ColorPicker {
 
 
   /**
-   * this shows the color picker at a location. The hue circle is constructed once and stored.
-   * @param x
-   * @param y
+   * this shows the color picker.
+   * The hue circle is constructed once and stored.
    */
-  show(x,y) {
+  show() {
     this.applied = false;
     this.frame.style.display = 'block';
-    this.frame.style.top = y + 'px';
-    this.frame.style.left = x + 'px';
     this._generateHueCircle();
   }
 
-
   // ------------------------------------------ PRIVATE ----------------------------- //
 
   /**
diff --git a/lib/shared/Configurator.js b/lib/shared/Configurator.js
index 8a1528e6..5398654e 100644
--- a/lib/shared/Configurator.js
+++ b/lib/shared/Configurator.js
@@ -163,7 +163,7 @@ class Configurator {
     }
 
     this._push();
-    this.colorPicker.insertTo(this.container);
+    //~ this.colorPicker.insertTo(this.container);
   }
 
 
@@ -530,11 +530,8 @@ class Configurator {
    * @private
    */
   _showColorPicker(value, div, path) {
-    let rect = div.getBoundingClientRect();
-    let bodyRect = document.body.getBoundingClientRect();
-    let pickerX = rect.left + rect.width + 5;
-    let pickerY = rect.top - bodyRect.top + rect.height +2;
-    this.colorPicker.show(pickerX,pickerY);
+    this.colorPicker.insertTo(div);
+    this.colorPicker.show();
     this.colorPicker.setColor(value);
     this.colorPicker.setCallback((color) => {
       let colorString = 'rgba(' + color.r + ',' + color.g + ',' + color.b + ',' + color.a + ')';