Ability to change the color without triggering the changed event

[Ape]

I would like to have a method for changing the current color so that this change would not trigger the color:change event. This would be useful for example when you want to set the color inside the color:change handler function in response to some changes. Otherwise it might create even an infinite event loop.

[jaames]

Thanks for the suggestion! I agree that this would be useful, so I shall try to add it when possible.

It will be a little difficult, since right now it works like this:

1. User interacts with the color picker
2. Color picker gives the color object a new value
3. Color object checks which channels (h/s/v) have changed
4. If there were changes, the color object tells the color picker to update the UI
5. Color picker updates the UI then fires the color:change event

I'll see what I can do though :)

[jaames]

Just pushed changes; now you can manually change the current color value without firing the color:change event by using color.set() with a HSV object.

Example:

var example = new iro.ColorPicker("#example");

example.on("color:change", function(color) {
     // get the current hsv value
     var hsv = color.hsv;
     // make changes to it
     hsv.h = 360;
     // set the color without triggering color:change
     color.set(hsv);
     // manually force the UI to update if you want
     color.forceUpdate();
});

color.set docs: https://github.com/jaames/iro.js/blob/master/docs/color_api.md#set

--

I should say this solution is rather hacky, I'll see if I can find a better way to solve this problem in the future.

[Ape]

Thanks!

[ibalaji777]

above code

Just pushed changes; now you can manually change the current color value without firing the color:change event by using color.set() with a HSV object.

Example:

var example = new iro.ColorPicker("#example");

example.on("color:change", function(color) {
     // get the current hsv value
     var hsv = color.hsv;
     // make changes to it
     hsv.h = 360;
     // set the color without triggering color:change
     color.set(hsv);
     // manually force the UI to update if you want
     color.forceUpdate();
});

color.set docs: https://github.com/jaames/iro.js/blob/master/docs/color_api.md#set

--

I should say this solution is rather hacky, I'll see if I can find a better way to solve this problem in the future.

i used below syntax but i am getting error
color.forceUpdate()
code is working but i get error forceUpdate is not a function !

[jaames]

@ibalaji777 This answer is outdated; you can now change the color in an event callback without any extra steps:

Updated example:

var example = new iro.ColorPicker("#example");

example.on("color:change", function(color) {
     // get the current hsv value
     var hsv = color.hsv;
     // make changes to it
     hsv.h = 360;
     // set the color without triggering color:change
     color.set(hsv);
});