aboutsummaryrefslogtreecommitdiff
path: root/js/components/ui/color-chip.reel/color-chip.js
blob: e51bdd8ad50239e38d0432f3a01ce839f483ba0b (plain)
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
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
/* <copyright>
 This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
 No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
 (c) Copyright 2011 Motorola Mobility, Inc.  All Rights Reserved.
 </copyright> */

var Montage = require("montage/core/core").Montage,
    Component = require("montage/ui/component").Component;

var ColorChip = exports.ColorChip = Montage.create(Component, {

    chip: {
        value: false
    },

    hasIcon: {
        value: true
    },

    iconType: {
        value: null
    },

    mode: {
        value: "stroke"
    },

    offset: {
        value: 20
    },

    initialColor: {
        value: false
    },

    changeDelegate: {
        value: null
    },

    prepareForDraw: {
        value: function() {
            this.addEventListener("firstDraw", this, false);
        }
    },

    draw: {
        value: function() {
            if(this.hasIcon) {
                var icon = this.iconType || this.mode + "Icon";
                this.application.ninja.colorController.addButton(icon, this.icon);
            }

            this.chipBtn.props = {side: 'right', align: 'top', wheel: true, palette: true, gradient: true, image: true, offset: this.offset};
            this.application.ninja.colorController.addButton(this.mode, this.chipBtn);

        }
    },

    handleFirstDraw: {
        value: function(evt) {
            if(this.chip) {
                // This is a single chip - Not related to the color panel -- Set the initial color if found
                var mode = "rgb", r = 0, g = 0, b = 0, a = 1, css = "rgb(255,0,0)";

                if(this.initialColor) {
                    var colorObj = this.application.ninja.colorController.getColorObjFromCss(this.initialColor);
                    mode = colorObj.mode;
                    r = colorObj.value.r;
                    g = colorObj.value.g;
                    b = colorObj.value.b;
                    a = colorObj.value.a;
                    css = colorObj.css;
                }

                this.chipBtn.color(mode, {wasSetByCode: true, type: 'change', color: {r: r, g: g, b: b}, css: css});
                this.chipBtn.addEventListener("change", this, false);
            }
        }
    },

    handleChange: {
        value: function(evt) {
            if(this.changeDelegate && typeof(this.changeDelegate === "function")) {
                this.changeDelegate(evt);
            }
        }
    }

});