aboutsummaryrefslogtreecommitdiff
path: root/js/components/tools-properties/rect-properties.reel
diff options
context:
space:
mode:
Diffstat (limited to 'js/components/tools-properties/rect-properties.reel')
-rw-r--r--js/components/tools-properties/rect-properties.reel/rect-properties.css40
-rw-r--r--js/components/tools-properties/rect-properties.reel/rect-properties.html84
-rw-r--r--js/components/tools-properties/rect-properties.reel/rect-properties.js128
3 files changed, 252 insertions, 0 deletions
diff --git a/js/components/tools-properties/rect-properties.reel/rect-properties.css b/js/components/tools-properties/rect-properties.reel/rect-properties.css
new file mode 100644
index 00000000..f50a9873
--- /dev/null
+++ b/js/components/tools-properties/rect-properties.reel/rect-properties.css
@@ -0,0 +1,40 @@
1/* <copyright>
2 This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
3 No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
4 (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
5 </copyright> */
6
7.button {
8 border:none;
9 cursor:default;
10 text-align:center;
11 -webkit-user-select:none;
12 opacity:0.8;
13 display:table-cell;
14 vertical-align:middle;
15 width:100%;
16 height:100%;
17 background-color:#333333;
18 color:white;
19}
20
21.button:hover
22{
23 opacity:1;
24}
25
26.button:active
27{
28 outline:solid 1px black;
29}
30
31.button.on
32{
33 background-color: #333333;
34}
35
36.button.off
37{
38 background-color: #cccccc;
39 color:black;
40} \ No newline at end of file
diff --git a/js/components/tools-properties/rect-properties.reel/rect-properties.html b/js/components/tools-properties/rect-properties.reel/rect-properties.html
new file mode 100644
index 00000000..e5c52466
--- /dev/null
+++ b/js/components/tools-properties/rect-properties.reel/rect-properties.html
@@ -0,0 +1,84 @@
1<!DOCTYPE HTML>
2<!-- <copyright>
3 This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
4 No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
5 (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
6 </copyright> -->
7<html>
8 <head>
9 <meta http-equiv="content-type" content="text/html; charset=utf-8" />
10 <link rel="stylesheet" type="text/css" href="rect-properties.css">
11
12 <script type="text/montage-serialization">
13 {
14 "hottext1": {
15 "module": "js/components/hottextunit.reel",
16 "name": "HotTextUnit",
17 "properties": {
18 "element": {"#": "TLRadiusControl"},
19 "acceptableUnits" : ["px", "pt", "%"]
20 }
21 },
22
23 "hottext2": {
24 "module": "js/components/hottextunit.reel",
25 "name": "HotTextUnit",
26 "properties": {
27 "element": {"#": "TRRadiusControl"},
28 "acceptableUnits" : ["px", "pt", "%"],
29 "enabled": false
30 }
31 },
32
33 "hottext3": {
34 "module": "js/components/hottextunit.reel",
35 "name": "HotTextUnit",
36 "properties": {
37 "element": {"#": "BLRadiusControl"},
38 "acceptableUnits" : ["px", "pt", "%"],
39 "enabled": false
40 }
41 },
42
43 "hottext4": {
44 "module": "js/components/hottextunit.reel",
45 "name": "HotTextUnit",
46 "properties": {
47 "element": {"#": "BRRadiusControl"},
48 "acceptableUnits" : ["px", "pt", "%"],
49 "enabled": false
50 }
51 },
52
53 "owner": {
54 "module": "js/components/tools-properties/rect-properties.reel",
55 "name": "RectProperties",
56 "properties": {
57 "element": {"#": "rectProperties"},
58 "lockButton": {"#": "lockButton"},
59 "TLRadiusControl": {"@": "hottext1"},
60 "TRRadiusControl": {"@": "hottext2"},
61 "BLRadiusControl": {"@": "hottext3"},
62 "BRRadiusControl": {"@": "hottext4"}
63 }
64 }
65 }
66 </script>
67
68 </head>
69
70 <body>
71 <div id="rectProperties">
72 <button id="lockButton" class="unselectable subToolButton button LockToolUp" style=" margin-left:20px"></button>
73 <div id="TLRadiusLabel" class="unselectable subToolButton cornerRadius topLeft"></div>
74 <div id="TLRadiusControl" class="label"></div>
75 <div id="TRRadiusLabel" class="unselectable subToolButton cornerRadius topRight"></div>
76 <div id="TRRadiusControl" class="label"></div>
77 <div id="BLRadiusLabel" class="unselectable subToolButton cornerRadius bottomLeft"></div>
78 <div id="BLRadiusControl" class="label"></div>
79 <div id="BRRadiusLabel" class="unselectable subToolButton cornerRadius bottomRight"></div>
80 <div id="BRRadiusControl" class="label"></div>
81 </div>
82 </body>
83
84</html> \ No newline at end of file
diff --git a/js/components/tools-properties/rect-properties.reel/rect-properties.js b/js/components/tools-properties/rect-properties.reel/rect-properties.js
new file mode 100644
index 00000000..8d0cd21f
--- /dev/null
+++ b/js/components/tools-properties/rect-properties.reel/rect-properties.js
@@ -0,0 +1,128 @@
1/* <copyright>
2This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
3No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
4(c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
5</copyright> */
6
7var Montage = require("montage/core/core").Montage,
8 ToolProperties = require("js/components/tools-properties/tool-properties").ToolProperties;
9
10exports.RectProperties = Montage.create(ToolProperties, {
11 base: { value: null },
12 lockButton: { value: null, enumerable: false},
13 TLRadiusControl: { value: null, enumerable: false },
14 TRRadiusControl: { value: null, enumerable: false },
15 BLRadiusControl: { value: null, enumerable: false },
16 BRRadiusControl: { value: null, enumerable: false },
17
18 _unlocked: { value: false, enumerable: false},
19
20 _subPrepare: {
21 value: function() {
22 this.lockButton.addEventListener("click", this, false);
23
24 this._setBindings([this.TRRadiusControl, this.BLRadiusControl, this.BRRadiusControl]);
25 this._setCap([this.TLRadiusControl,this.TRRadiusControl, this.BLRadiusControl, this.BRRadiusControl]);
26
27 }
28 },
29
30 handleClick: {
31 value: function(event) {
32 this._unlocked = !this._unlocked;
33
34 this.TRRadiusControl.enabled = this.BLRadiusControl.enabled = this.BRRadiusControl.enabled = this._unlocked;
35
36 if(this._unlocked) {
37 this.lockButton.classList.remove("LockToolUp");
38 this.lockButton.classList.add("UnLockToolUp");
39 this._removeBindings([this.TRRadiusControl, this.BLRadiusControl, this.BRRadiusControl]);
40 } else {
41 this.lockButton.classList.remove("UnLockToolUp");
42 this.lockButton.classList.add("LockToolUp");
43 this._setBindings([this.TRRadiusControl, this.BLRadiusControl, this.BRRadiusControl]);
44 }
45 }
46 },
47
48 // Public API
49 use3D: {
50 get: function() { return this.base._use3D; }
51 },
52
53 strokeSize: {
54 get: function() { return this.base._strokeSize; }
55 },
56
57 strokeStyle : {
58 get: function() { return this.base._strokeStyle.options[this.base._strokeStyle.value].text; }
59 },
60
61 strokeStyleIndex : {
62 get: function() { return this.base._strokeStyle.options[this.base._strokeStyle.value].value; }
63 },
64
65 strokeMaterial: {
66 get: function() { return this.base._strokeMaterial.options[this.base._strokeMaterial.value].value; }
67 },
68
69 fillMaterial: {
70 get: function() { return this.base._fillMaterial.options[this.base._fillMaterial.value].value; }
71 },
72