aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorArmen Kesablyan2012-05-30 15:30:38 -0700
committerArmen Kesablyan2012-05-30 15:30:38 -0700
commita581fb3c544ee2faeafbb75f7a3f5719f53cf323 (patch)
treec0c1c8354a9422a52f8bf322a56c94cf9a8ba526
parent81239571c538f72e398fafa5b07725bf1bbb2d5d (diff)
downloadninja-a581fb3c544ee2faeafbb75f7a3f5719f53cf323.tar.gz
Visual Bindings Initial generate from Array.
Signed-off-by: Armen Kesablyan <armen@motorola.com>
-rw-r--r--images/panels/horizontal-resize.pngbin0 -> 1031 bytes
-rwxr-xr-xjs/stage/binding-view.reel/binding-hud-option.reel/binding-hud-option.html18
-rwxr-xr-xjs/stage/binding-view.reel/binding-hud-option.reel/binding-hud-option.js2
-rwxr-xr-xjs/stage/binding-view.reel/binding-hud.reel/binding-hud.css57
-rwxr-xr-xjs/stage/binding-view.reel/binding-hud.reel/binding-hud.html16
-rwxr-xr-xjs/stage/binding-view.reel/binding-hud.reel/binding-hud.js18
-rwxr-xr-xjs/stage/binding-view.reel/binding-view.css7
-rwxr-xr-xjs/stage/binding-view.reel/binding-view.html5
-rwxr-xr-xjs/stage/binding-view.reel/binding-view.js25
-rwxr-xr-xjs/stage/binding-view.reel/non-visual-component.reel/non-visual-component.html2
-rw-r--r--js/tools/bindingTool.js4
11 files changed, 140 insertions, 14 deletions
diff --git a/images/panels/horizontal-resize.png b/images/panels/horizontal-resize.png
new file mode 100644
index 00000000..7b2cf8a5
--- /dev/null
+++ b/images/panels/horizontal-resize.png
Binary files differ
diff --git a/js/stage/binding-view.reel/binding-hud-option.reel/binding-hud-option.html b/js/stage/binding-view.reel/binding-hud-option.reel/binding-hud-option.html
index 6b670455..6af26f7c 100755
--- a/js/stage/binding-view.reel/binding-hud-option.reel/binding-hud-option.html
+++ b/js/stage/binding-view.reel/binding-hud-option.reel/binding-hud-option.html
@@ -7,21 +7,33 @@
7<html> 7<html>
8<head> 8<head>
9 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 9 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
10 <link rel="stylesheet" type="text/css" href="binding-view.css"> 10 <link rel="stylesheet" type="text/css" href="binding-hud-option.css">
11 11
12 <script type="text/montage-serialization"> 12 <script type="text/montage-serialization">
13 { 13 {
14 "owner": { 14 "owner": {
15 "prototype": "js/stage/binding-view.reel/binding-hud.reel", 15 "prototype": "js/stage/binding-view.reel/binding-hud-option.reel",
16 "properties": { 16 "properties": {
17 "element": {"#": "hudOption"} 17 "element": {"#": "hudOption"}
18 } 18 }
19 },
20 "label": {
21 "prototype": "montage/ui/dynamic-text.reel",
22 "properties": {
23 "element": {"#": "hudLabel"}
24 },
25 "bindings": {
26 "value": {"<-": "@owner.title"}
27 }
19 } 28 }
20 } 29 }
21 </script> 30 </script>
22 31
23</head> 32</head>
24<body> 33<body>
25 <div class="hudOption">Label for options</div> 34 <div data-montage-id="hudOption" class="hudOption">
35 <label data-montage-id="hudLabel" class="hudLabel">Label</label>
36 <div class="connectorBubble"></div>
37 </div>
26</body> 38</body>
27</html> 39</html>
diff --git a/js/stage/binding-view.reel/binding-hud-option.reel/binding-hud-option.js b/js/stage/binding-view.reel/binding-hud-option.reel/binding-hud-option.js
index 91a0564e..58f4175e 100755
--- a/js/stage/binding-view.reel/binding-hud-option.reel/binding-hud-option.js
+++ b/js/stage/binding-view.reel/binding-hud-option.reel/binding-hud-option.js
@@ -11,7 +11,7 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
11var Montage = require("montage/core/core").Montage, 11var Montage = require("montage/core/core").Montage,
12 Component = require("montage/ui/component").Component; 12 Component = require("montage/ui/component").Component;
13 13
14exports.bindingHud = Montage.create(Component, { 14exports.BindingHudOption = Montage.create(Component, {
15 title: { 15 title: {
16 value: "value" 16 value: "value"
17 } 17 }
diff --git a/js/stage/binding-view.reel/binding-hud.reel/binding-hud.css b/js/stage/binding-view.reel/binding-hud.reel/binding-hud.css
index 018448f1..626706ed 100755
--- a/js/stage/binding-view.reel/binding-hud.reel/binding-hud.css
+++ b/js/stage/binding-view.reel/binding-hud.reel/binding-hud.css
@@ -3,3 +3,60 @@
3 No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<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. 4 (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
5 </copyright> */ 5 </copyright> */
6
7.bindingHud {
8 position: absolute;
9 background: #282828;
10 padding: 0px;
11 color: #FFF;
12 font-size: 11px;
13 box-shadow: 2px 2px 3px black;
14 border-radius: 3px;
15 padding: 3px;
16 padding-top:0px;
17 border:1px solid #000;
18}
19
20.bindingHud .bindingTitle {
21 font-weight:bold;
22 background: url('/images/panels/horizontal-resize.png') no-repeat;
23 padding-left: 10px;
24 line-height: 20px;
25 background-position: left center;
26 padding-top: 2px;
27}
28
29.bindingHud .hudRepetition {
30 background: #555;
31 padding:1px 9px;
32 line-height:16px;
33 border:1px solid #000;
34 box-shadow: inset 0px 0px 4px #333, 1px 1px 0px #3A3A3A;
35 min-width: 65px;
36}
37
38.bindingHud .hudOption {
39 position:relative;
40 border-bottom:1px solid #505050;
41 line-height:16px;
42}
43
44.bindingHud .hudOption:last-child {
45 border-bottom: 0px;
46}
47
48.bindingHud .hudOption .connectorBubble {
49 position: absolute;
50 right: -20px;
51 top: 2px;
52 background: #555;
53 border: 1px solid black;
54 border-radius: 0px;
55 width: 12px;
56 height: 12px;
57 border-left: 0px;
58 /*border-bottom-right-radius: 50%;
59 border-top-right-radius: 50%;*/
60
61
62} \ No newline at end of file
diff --git a/js/stage/binding-view.reel/binding-hud.reel/binding-hud.html b/js/stage/binding-view.reel/binding-hud.reel/binding-hud.html
index 1c73fd77..1f3b181c 100755
--- a/js/stage/binding-view.reel/binding-hud.reel/binding-hud.html
+++ b/js/stage/binding-view.reel/binding-hud.reel/binding-hud.html
@@ -7,7 +7,7 @@
7<html> 7<html>
8<head> 8<head>
9 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 9 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
10 <link rel="stylesheet" type="text/css" href="binding-view.css"> 10 <link rel="stylesheet" type="text/css" href="binding-hud.css">
11 11
12 <script type="text/montage-serialization"> 12 <script type="text/montage-serialization">
13 { 13 {
@@ -32,7 +32,16 @@
32 "element": {"#" : "hudOption"} 32 "element": {"#" : "hudOption"}
33 }, 33 },
34 "bindings": { 34 "bindings": {
35 "title": {"<-": "@repeater.objectAtCurrentIteration.title"} 35 "title": {"<-": "@repeater.objectAtCurrentIteration.title"}
36 }
37 },
38 "Title": {
39 "prototype": "montage/ui/dynamic-text.reel",
40 "properties": {
41 "element": {"#": "title"}
42 },
43 "bindings": {
44 "value": {"<-": "@owner.title"}
36 } 45 }
37 } 46 }
38 } 47 }
@@ -40,9 +49,8 @@
40 49
41</head> 50</head>
42<body> 51<body>
43
44
45 <section data-montage-id="bindingHud" class="bindingHud"> 52 <section data-montage-id="bindingHud" class="bindingHud">
53 <div data-montage-id="title" class="bindingTitle"></div>
46 <div data-montage-id="hudRepetition" class="hudRepetition"> 54 <div data-montage-id="hudRepetition" class="hudRepetition">
47 <div data-montage-id="hudOption" class="hudOption"></div> 55 <div data-montage-id="hudOption" class="hudOption"></div>
48 </div> 56 </div>
diff --git a/js/stage/binding-view.reel/binding-hud.reel/binding-hud.js b/js/stage/binding-view.reel/binding-hud.reel/binding-hud.js
index a63f2775..029a1a39 100755
--- a/js/stage/binding-view.reel/binding-hud.reel/binding-hud.js
+++ b/js/stage/binding-view.reel/binding-hud.reel/binding-hud.js
@@ -12,10 +12,28 @@ var Montage = require("montage/core/core").Montage,
12 Component = require("montage/ui/component").Component; 12 Component = require("montage/ui/component").Component;
13 13
14exports.BindingHud = Montage.create(Component, { 14exports.BindingHud = Montage.create(Component, {
15 title: {
16 value: "default"
17 },
15 properties: { 18 properties: {
16 value: [ 19 value: [
17 {"title": "myProperty1"}, 20 {"title": "myProperty1"},
18 {"title":"myproperty2"} 21 {"title":"myproperty2"}
19 ] 22 ]
23 },