aboutsummaryrefslogtreecommitdiff
path: root/js/panels/properties.reel/sections/position-size.reel
diff options
context:
space:
mode:
authorArmen Kesablyan2012-05-15 16:34:46 -0700
committerArmen Kesablyan2012-05-15 16:34:46 -0700
commitc8d61c8e72e0eba266575f9df54325fa77fde73d (patch)
tree556cafd76ab9b2cf4cc2b4cc3ea17b12ce690b69 /js/panels/properties.reel/sections/position-size.reel
parent15a3aaebb56cb2c9409bfe55c862868726c7fd44 (diff)
parent46bd3712329cd3c9311e50ed9ee4c2245bd1be5a (diff)
downloadninja-c8d61c8e72e0eba266575f9df54325fa77fde73d.tar.gz
Merge branch 'dom-architecture' of github.com:Motorola-Mobility/ninja-internal into binding
Diffstat (limited to 'js/panels/properties.reel/sections/position-size.reel')
-rwxr-xr-xjs/panels/properties.reel/sections/position-size.reel/position-size.css40
-rwxr-xr-xjs/panels/properties.reel/sections/position-size.reel/position-size.html126
-rwxr-xr-xjs/panels/properties.reel/sections/position-size.reel/position-size.js276
3 files changed, 442 insertions, 0 deletions
diff --git a/js/panels/properties.reel/sections/position-size.reel/position-size.css b/js/panels/properties.reel/sections/position-size.reel/position-size.css
new file mode 100755
index 00000000..7f8fdbc2
--- /dev/null
+++ b/js/panels/properties.reel/sections/position-size.reel/position-size.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.fieldCol .hide {
8 display: none;
9}
10
11.fieldCol .disabled {
12 color:#999999;
13}
14
15
16#posBound {
17 position: absolute;
18 left: 105px;
19 border: none;
20 background-color: transparent;
21 top: 2px;
22 opacity: 0.7;
23 width: 17px;
24 height: 18px;
25 margin-right: 10px;
26}
27
28#posBound:hover {
29 opacity: 1;
30}
31
32.unlock{
33 background: url("../../../../../images/optionsbar/unlinked.png") no-repeat;
34
35}
36
37.lockUp {
38 background: url("../../../../../images/optionsbar/link.png") no-repeat;
39}
40
diff --git a/js/panels/properties.reel/sections/position-size.reel/position-size.html b/js/panels/properties.reel/sections/position-size.reel/position-size.html
new file mode 100755
index 00000000..5d1a805a
--- /dev/null
+++ b/js/panels/properties.reel/sections/position-size.reel/position-size.html
@@ -0,0 +1,126 @@
1<!DOCTYPE html>
2<!-- <copyright>
3This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
4No 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 lang="en">
8<head>
9 <link rel="stylesheet" href="position-size.css" type="text/css">
10 <script type="text/montage-serialization">
11 {
12 "owner": {
13 "prototype" : "js/panels/properties.reel/sections/position-size.reel",
14 "properties" : {
15 "element" : {"#": "section"},
16 "position": {"#": "position"},
17 "leftLabel": {"#": "labelX"},
18 "leftControl": {"@": "PosX"},
19 "topLabel": {"#": "labelY"},
20 "topControl": {"@": "PosY"},
21 "heightControl": {"@": "PosH"},
22 "widthControl": {"@": "PosW"},
23 "bindButton": {"@": "bindButton"}
24 }
25 },
26
27 "PosX": {
28 "prototype": "js/components/hottextunit.reel[HotTextUnit]",
29 "properties": {
30 "element": {"#": "PosX"},
31 "maxValue": 10000,
32 "minValue": -10000
33 },
34 "bindings": {
35 "value": {"<<->": "@owner.leftPosition"}
36 }
37 },
38 "PosY": {
39 "prototype": "js/components/hottextunit.reel[HotTextUnit]",
40 "properties": {
41 "element": {"#": "PosY"},
42 "maxValue": 10000,
43 "minValue": -10000
44 },
45 "bindings": {
46 "value": {"<<->": "@owner.topPosition"}
47 }
48 },
49
50 "PosH": {
51 "prototype": "js/components/hottextunit.reel[HotTextUnit]",
52 "properties": {
53 "element": {"#": "PosH"}
54 },
55 "bindings": {
56 "value": {"<<->": "@owner.heightSize"}
57 }
58 },
59
60 "PosW": {
61 "prototype": "js/components/hottextunit.reel[HotTextUnit]",
62 "properties": {
63 "element": {"#": "PosW"},
64 "acceptableUnits" : ["px", "%"],
65 "units": "px"
66 },
67 "bindings": {
68 "value": {"<<->": "@owner.widthSize"}
69 }
70
71 },
72 "bindButton": {
73 "prototype": "montage/ui/toggle-button.reel",
74 "properties": {
75 "element": {"#": "posBound"},
76 "pressedClass": "lockUp",
77 "preventFocus": true,
78 "identifier": "ratio"
79 }
80 }
81 }
82 </script>
83</head>
84<body>
85 <div data-montage-id="section" class="sectional">
86 <section data-montage-id="position" class="fieldCol">
87 <label data-montage-id="labelX">Left:</label>
88 <article class="fieldRow twoCol">
89 <div>
90 <div class="inputField">
91 <div data-montage-id="PosX"></div>
92 </div>
93 </div>
94 <div>
95 <div>
96 <label data-montage-id="labelY">Top:</label>
97 </div>
98 <div class="inputField">
99 <div data-montage-id="PosY"></div>
100 </div>
101 </div>
102 </article>
103 </section>
104 <hr />
105 <section class="fieldCol">
106 <button data-montage-id="posBound" id="posBound" class="unlock"></button>
107 <label>Width:</label>
108 <article class="fieldRow twoCol">
109 <div>
110 <div class="inputField">
111 <div data-montage-id="PosW"></div>
112 </div>
113 </div>
114 <div>
115 <div>
116 <label>Height:</label>
117 </div>
118 <div class="inputField">
119 <div data-montage-id="PosH"></div>
120 </div>
121 </div>
122 </article>
123 </section>
124 </div>
125</body>
126</html> \ No newline at end of file
diff --git a/js/panels/properties.reel/sections/position-size.reel/position-size.js b/js/panels/properties.reel/sections/position-size.reel/position-size.js
new file mode 100755
index 00000000..10e084be
--- /dev/null
+++ b/js/panels/properties.reel/sections/position-size.reel/position-size.js
@@ -0,0 +1,276 @@
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;
8var Component = require("montage/ui/component").Component;
9
10exports.PositionSize = Montage.create(Component, {
11 leftPosition: {
12 value: 0
13 },
14
15 topPosition: {
16 value: 0
17 },
18
19 heightSize: {
20 value: 0
21 },
22
23 widthSize: {
24 value: 0