Using not depended to codemirror.js

[zortext]

Without loading codemirror, color picker cannot be initiated

//include colorpicker js file and css file then=>

var ColorPicker = CodeMirrorColorPicker.ColorPicker;
var colorpicker = new ColorPicker({
    color: 'blue', // init color code 
    type : 'palette' // or 'sketch',  default type is 'chromedevtool'
})

this throws an error "Uncaught ReferenceError: CodeMirrorColorPicker is not defined"

To make it accessible I added one line to the end of ColorPicker method in the js file.

var index = _extends({}, Util, ColorPicker);
// added this line -->
window.CMColorPicker=ColorPicker.ColorPicker;
//--
return index;

and then tried

 var colorpicker = new CMColorPicker({
        color: 'blue',  
        position: 'inline',   
        container : $('color-container'),
        type : 'ring'
    });

This makes it work, But some types displayed distorted.
please see attached file. This is how "ring" type is displayed.

By the way I think this is one of the best color picker tool on the web. Great job!

[easylogic]

hi @zortext
It seems to be a bug. I'll check and contact you.

[easylogic]

i fixed this problem.

please install lastest release v1.9.35

[zortext]

Thanks... Now picker can be loaded by the following code without loading codemirror.

var colorpicker = new CodeMirrorColorPicker.ColorPicker({
        color: 'blue', // init color code
        position: 'inline',   // default show
        container :$element,
        type : 'ring'
    });

But still appearance have some issues.

Default, sketch and palette type picker does not have any issues. Only other types have (xd, ring, macos ...)

You can run this plunk to regenerate the issue
http://plnkr.co/edit/i66DSpcUk21WDWFOj0e0

[easylogic]

hi @zortext

please see to https://codepen.io/easylogic/pen/ZqBBWd

The codepen.io works normally.

Something is wrong with the plunker, but I do not know if it is based on angularjs.

I have never played angularjs.

[zortext]

I found the issue.
new CodeMirrorColorPicker.create() works fine
new CodeMirrorColorPicker.ColorPicker() causes the issue.

https://codepen.io/anon/pen/EdNbEQ

[easylogic]

@zortext

haha my mistake.

see to below code

        var picker = CodeMirrorColorPicker.create({
            type: 'ring', 
            ......
        });

you must use function named by create to making for multi type colorpicker.

CodeMirrorColorPicker.ColorPicker is default colorpicker that has a 'chromedevtool' type