Color picker window toggles

[zea726]

Hi,

I was trying to use the color picker for the input box. If you press on input box the color palate will appear but as soon as you click on the tab like advance its just disappearing. Is it a bug or you did it intentionally.

Pleas let me know how can I solve this.

Regards
Zea

[alanhartless]

I had the same issue which I solved by changing these lines around https://github.com/lauren/pick-a-color/blob/master/src/js/pick-a-color.js#L1001-L1013

            // Prevent blur from not applying color selection
            var menuClicked = false;
            myElements.colorMenu.on(startEvent, function (e) {
                menuClicked = true;
            });

            myElements.thisEl.focus(function () {
                var $thisEl = $(this);
                myColorVars.typedColor = $thisEl.val(); // update with the current
                if (!settings.allowBlank) {
                    $thisEl.val(""); //clear the field on focus
                }
                methods.toggleDropdown(myElements.colorPreviewButton, myElements.ColorMenu);
            }).blur(function (event) {
                if (menuClicked) {
                    menuClicked = false;
                    return false;
                }

[zea726]

Thank you.

Yes it worked for the click function but if you click on tabs (advance, saved) and click outside without changing any value the previous value just disappeared or empty.

Regards
Zea

[zea726]

I just modify this... may be you also meant this but I did'nt get at first glance

myElements.thisEl.focus(function () {
          var $thisEl = $(this);
          myColorVars.typedColor = $thisEl.val(); // update with the current
          if (!settings.allowBlank) {
            $thisEl.val(""); //clear the field on focus
          }
          methods.toggleDropdown(myElements.colorPreviewButton,myElements.ColorMenu);
        }).blur(function (event) {
            var $thisEl = $(this);
            myColorVars.newValue = $thisEl.val(); // on blur, check the field's value
            // if the field is empty, put the original value back in the field
            if (menuClicked) {
                menuClicked = false;
                if (myColorVars.newValue.match(/^\s+$|^$/)) {
                    if (!settings.allowBlank) {
                        $thisEl.val(myColorVars.typedColor);
                    }
                }
                return false;
            }