forked from voidlabs/mosaico
-
Notifications
You must be signed in to change notification settings - Fork 13
/
colorpicker.js
58 lines (47 loc) · 1.67 KB
/
colorpicker.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
"use strict";
/* global global: false */
require("evol-colorpicker");
var $ = require("jquery");
var ko = require("knockout");
var kojqui = require("knockout-jqueryui");
var ColorPicker = function() {
kojqui.BindingHandler.call(this, 'colorpicker');
};
ColorPicker.prototype = kojqui.utils.createObject(kojqui.BindingHandler.prototype);
ColorPicker.prototype.constructor = ColorPicker;
ColorPicker.prototype.init = function(element, valueAccessor, allBindings) {
var va = valueAccessor();
var value = va.color;
// In order to have a correct dependency tracking in "ifSubs" we have to ensure we use a single "computed" for each editable
// property. Given this binding needs 2 of them, we create a new wrapping computed so to "proxy" the dependencies.
var newDO = ko.computed({
read: value,
write: value,
disposeWhenNodeIsRemoved: element
});
var newVA = function() {
return newDO;
};
ko.bindingHandlers.value.init(element, newVA, allBindings);
var changePropagator = function(event, color) {
if (typeof color !== 'undefined') newDO(color);
};
$(element).on('change.color', changePropagator);
ko.computed({
read: function() {
var opt = {
color: ko.utils.unwrapObservable(newDO),
showOn: 'button'
};
for (var prop in va)
if (prop !== 'color' && va.hasOwnProperty(prop)) opt[prop] = ko.utils.unwrapObservable(va[prop]);
$(element).colorpicker(opt);
},
disposeWhenNodeIsRemoved: element
});
ko.utils.domNodeDisposal.addDisposeCallback(element, function() {
$(element).off('change.color', changePropagator);
$(element).colorpicker('destroy');
});
};
kojqui.utils.register(ColorPicker);