There is my jQuery Color Picker Sliders plugin you can access on jsFiddle:

http://jsfiddle.net/styu/5H8cA/

I want to access some of the methods from outside of the plugins scope, namely showPopup(), hidePopup() and updateColor(newcolor).

Initialization

<span class="cp"></span>

<script>
    var cp = $(".cp").ColorPickerSliders({
        flat: true,
        order: {
            hsl: 1,
            preview: 2
        }
    });
</script>

What I want to do

Something like

cp.updateColor('red');

or

$(".cp").ColorPickerSliders('updateColor', 'red');

Which one is the preferred way, and how to refactor the code to accompish it?

Any other suggestions are welcome!

Update

I achieved it using triggers, but don't know if it has any downsides or is a good way to do these kind of interaction. So I registered a custom event handler inside the plugin's code (Line 320, triggerelement is the original element the plugin is called on):

triggerelement.on('jquerycolorpickersliders.updateColor', function(e, newcolor) {
    updateColor(newcolor);
});

And call it using this code (where cp is the element the plugin is called on):

cp.trigger('jquerycolorpickersliders.updateColor', 'red');

Updated jsFiddle: http://jsfiddle.net/styu/5H8cA/3/

What do you think of it? Is it an acceptable solution for the problem? Or there is a better one?

I want to access some of the methods from outside of the plugins scope, namely showPopup(), hidePopup() and updateColor(newcolor).

Initialization

<span class="cp"></span>

<script>
    var cp = $(".cp").ColorPickerSliders({
        flat: true,
        order: {
            hsl: 1,
            preview: 2
        }
    });
</script>

What I want to do

Something like

cp.updateColor('red');

or

$(".cp").ColorPickerSliders('updateColor', 'red');

Which one is the preferred way, and how to refactor the code to accomplish it?

I achieved it using triggers, but don't know if it has any downsides or is a good way to do these kind of interaction. So I registered a custom event handler inside the plugin's code (Line 320, triggerelement is the original element the plugin is called on):

triggerelement.on('jquerycolorpickersliders.updateColor', function(e, newcolor) {
    updateColor(newcolor);
});

And call it using this code (where cp is the element the plugin is called on):

cp.trigger('jquerycolorpickersliders.updateColor', 'red');

jsFiddle.

What do you think of it? Is it an acceptable solution for the problem, or is there a better one?

There is my jQuery Color Picker Sliders plugin you can access on jsFiddle:

http://jsfiddle.net/styu/5H8cA/

I want to access some of the methods from outside of the plugins scope, namely showPopup(), hidePopup() and updateColor(newcolor).

Initialization

<span class="cp"></span>

<script>
    var cp = $(".cp").ColorPickerSliders({
        flat: true,
        order: {
            hsl: 1,
            preview: 2
        }
    });
</script>

What I want to do

Something like

cp.updateColor('red');

or

$(".cp").ColorPickerSliders('updateColor', 'red');

Which one is the preferred way, and how to refactor the code to accompish it?

Any other suggestions are welcome!

There is my jQuery Color Picker Sliders plugin you can access on jsFiddle:

http://jsfiddle.net/styu/5H8cA/

I want to access some of the methods from outside of the plugins scope, namely showPopup(), hidePopup() and updateColor(newcolor).

Initialization

<span class="cp"></span>

<script>
    var cp = $(".cp").ColorPickerSliders({
        flat: true,
        order: {
            hsl: 1,
            preview: 2
        }
    });
</script>

What I want to do

Something like

cp.updateColor('red');

or

$(".cp").ColorPickerSliders('updateColor', 'red');

Which one is the preferred way, and how to refactor the code to accompish it?

Any other suggestions are welcome!

Update

I achieved it using triggers, but don't know if it has any downsides or is a good way to do these kind of interaction. So I registered a custom event handler inside the plugin's code (Line 320, triggerelement is the original element the plugin is called on):

triggerelement.on('jquerycolorpickersliders.updateColor', function(e, newcolor) {
    updateColor(newcolor);
});

And call it using this code (where cp is the element the plugin is called on):

cp.trigger('jquerycolorpickersliders.updateColor', 'red');

Updated jsFiddle: http://jsfiddle.net/styu/5H8cA/3/

What do you think of it? Is it an acceptable solution for the problem? Or there is a better one?