Update to release v1.0.1

Author: kartik-v

CHANGE.md

@@ -9,7 +9,6 @@ Change Log: `yii2-widget-colorinput`
 - (enh #10): Update to latest version of spectrum plugin.
 - (enh #11): Implement translations and locales.
 - (enh #12): Implement theming for Krajee style.
-- (enh #13): Eliminate `polyFill` property.
 
 ## Version 1.0.0
 

ColorInput.php

@@ -148,19 +148,12 @@ class ColorInput extends Html5Input
     /**
      * @inheritdoc
      */
-    public function init()
+    public function run()
     {
         $this->type = 'color';
         $this->width = '60px';
-        parent::init();
-    }
-
-    /**
-     * @inheritdoc
-     */
-    public function run()
-    {
         $this->_msgCat = 'kvcolor';
+        $this->html5Options['value'] = $this->hasModel() ? Html::getAttributeValue($this->model, $this->attribute) : $this->value;
         $this->initI18N(__DIR__);
         if (substr($this->language, 0, 2) !== 'en') {
             $this->_defaultOptions += [
@@ -177,8 +170,9 @@ public function run()
         Html::addCssClass($this->options, 'spectrum-input');
         if (!$this->useNative) {
             Html::addCssClass($this->html5Container, 'input-group-sp');
-            $this->pluginOptions = ArrayHelper::merge($this->_defaultOptions, $this->pluginOptions);
+            $this->pluginOptions = array_replace_recursive($this->_defaultOptions, $this->pluginOptions);
         }
+        $this->initInput();
         $this->registerColorInput();
     }
 
@@ -188,8 +182,6 @@ public function run()
     public function registerColorInput()
     {
         $view = $this->getView();
-        $value = $this->hasModel() ? Html::getAttributeValue($this->model, $this->attribute) : $this->value;
-        $this->html5Options['value'] = $value;
         ColorInputAsset::register($view);
         if ($this->useNative) {
             return;
@@ -202,6 +194,7 @@ public function registerColorInput()
         }
         Html5InputAsset::register($view);
         $input = 'jQuery("#' . $this->html5Options['id'] . '")';
-        $this->registerPlugin('spectrum', $input);
+        $el = 'jQuery("#' . $this->options['id'] . '")';
+        $this->registerPlugin('spectrum', $input, "function(){{$input}.spectrum('set',{$el}.val());}");
     }
 }

assets/js/spectrum-kv.js

@@ -12,12 +12,12 @@
     "use strict";
     $(document).on('ready', function () {
         $('.spectrum-group').on('change', 'input', function (e, color) {
-            var $el = $(this), $group = $el.closest('.spectrum-group');
+            var $el = $(this), $group = $el.closest('.spectrum-group'), val = $el.val();
             if ($el.is('.spectrum-source')) {
                 $group.find('.spectrum-input').val(color.toString());
-            } else {
-                $group.find('.spectrum-source').spectrum('set', $el.val());
+                val = color.toHslString();
             }
+            $group.find('.spectrum-source').spectrum('set', val);
         });
     });
 })(window.jQuery);