aboutsummaryrefslogtreecommitdiff
path: root/js/panels/binding/edit-binding-view.reel
diff options
context:
space:
mode:
Diffstat (limited to 'js/panels/binding/edit-binding-view.reel')
-rw-r--r--js/panels/binding/edit-binding-view.reel/edit-binding-view.css128
-rw-r--r--js/panels/binding/edit-binding-view.reel/edit-binding-view.html192
-rw-r--r--js/panels/binding/edit-binding-view.reel/edit-binding-view.js359
3 files changed, 679 insertions, 0 deletions
diff --git a/js/panels/binding/edit-binding-view.reel/edit-binding-view.css b/js/panels/binding/edit-binding-view.reel/edit-binding-view.css
new file mode 100644
index 00000000..0ca82179
--- /dev/null
+++ b/js/panels/binding/edit-binding-view.reel/edit-binding-view.css
@@ -0,0 +1,128 @@
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.edit-binding-view {
8 background: #474747;
9 color: #FFF;
10 font-size: 11px;
11 height: 100%;
12 left: 100%;
13 position: absolute;
14 top: 0;
15 width: 100%;
16 -webkit-transition-property: -webkit-transform;
17 -webkit-transition-duration: 550ms;
18 -webkit-transition-timing-function: cubic-bezier(.44,.19,0,.99);
19 -webkit-user-select: text;
20}
21
22/* -------------------
23 Object Editing Section
24 --------------------- */
25.edit-object-binding {
26 border-bottom: 1px solid #505050;
27 display: -webkit-box;
28 margin: 5px;
29 padding-bottom: 5px;
30 -webkit-box-orient: horizontal;
31}
32.object-container {
33 display: -webkit-box;
34 -webkit-box-orient: horizontal;
35 -webkit-box-flex: 1;
36}
37.object-container:first-child {
38 margin-right: 5px;
39}
40.object-icon-container {
41 background-color: #414141;
42 border-radius: 5px;
43 border: 1px solid #333;
44 box-shadow: inset 0 0 5px 0px #333, 0 1px 0 #585858;
45 height: 40px;
46 width: 40px;
47 -webkit-box-flex: 0;
48}
49
50.edit-object-binding .object-icon {
51 -webkit-transform: scale(.75);
52 height: 100%;
53 margin: 0;
54 width: 100%;
55 position:relative;
56 top: -1px;
57 left: -1px;
58 -webkit-transition: opacity 550ms linear;
59}
60.object-fields-container {
61 -webkit-box-flex: 1;
62 padding-top: 1px;
63 width: 1px;
64}
65.no-object {
66 opacity: 0;
67}
68
69.edit-binding-view ul {
70 padding: 0;
71 margin: 0;
72}
73
74.edit-binding-view li {
75 padding: 3px;
76 list-style-type: none;
77}
78
79.edit-binding-view label {
80 display: inline-block;
81 width: 50%;
82}
83
84.checkbox-container {
85 position: absolute;
86 left: 50%;
87}
88.checkbox-container label {
89 position: relative;
90 top: -3px;
91}
92
93.buttons-container {
94 background-color: #474747;
95 padding: 5px 0;
96 position: absolute;
97 bottom: 0;
98 width: 100%;
99}
100
101.edit-binding-view .btn-delete, .edit-binding-view .btn-cancel, .edit-binding-view .btn-save {
102 width: 72px;
103 display: inline-block;
104 margin: 0 5px;
105}
106.edit-binding-view .btn-cancel, .edit-binding-view .btn-save {
107 float:right;
108 margin: 0 5px 0 0;
109}
110/* hintable fields */
111
112.hintable-field {
113 background-color: #444;
114 border: 1px solid #313131;
115 display: block;
116 height: 13px;
117 margin: 0 0 5px 5px;
118 padding: 1px 4px;
119 width: 80%;
120}
121
122.hintable-field .hintable-hint {
123 color: #7C7C7C;
124}
125
126.hintable-field:focus {
127 border: 1px solid #313131;
128} \ No newline at end of file
diff --git a/js/panels/binding/edit-binding-view.reel/edit-binding-view.html b/js/panels/binding/edit-binding-view.reel/edit-binding-view.html
new file mode 100644
index 00000000..67d06132
--- /dev/null
+++ b/js/panels/binding/edit-binding-view.reel/edit-binding-view.html
@@ -0,0 +1,192 @@
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 lang="en">
8<head>
9 <meta http-equiv="content-type" content="text/html; charset=utf-8" />
10 <link rel="stylesheet" href="edit-binding-view.css" type="text/css">
11 <script type="text/montage-serialization">
12 {
13 "owner": {
14 "prototype": "js/panels/binding/edit-binding-view.reel",
15 "properties": {
16 "element": {"#": "edit-binding"},
17 "sourceObjectField" : {"@": "sourceObjectField" },
18 "boundObjectField" : {"@": "boundObjectField" },
19 "sourceObjectPropertyPathField" : {"@": "sourceObjectPropertyPathField" },
20 "boundObjectPropertyPathField" : {"@": "boundObjectPropertyPathField" },
21 "directionCheckbox" : {"@": "directionCheckbox" },
22 "saveButton":{ "@": "saveButton" },
23 "cancelButton":{ "@": "cancelButton" },
24 "deleteButton":{ "@": "deleteButton" },
25 "sourceObjectIconElement": {"#": "source-object-icon"},
26 "boundObjectIconElement": {"#": "bound-object-icon"}
27 }
28 },
29 "sourceObjectField": {
30 "prototype": "js/components/hintable.reel",
31 "properties": {
32 "startOnEvent": "click",
33 "element": {"#": "sourceObjectField"}
34 },
35 "bindings": {
36 "value": {"<->": "@owner.sourceObjectIdentifier"}
37 },
38 "listeners" : [
39 {
40 "type": "change",
41 "listener": {"@": "owner"}
42 }
43 ]
44 },
45 "boundObjectField": {
46 "prototype": "js/components/hintable.reel",
47 "properties": {
48 "startOnEvent": "click",
49 "element": {"#": "boundObjectField"}
50 },
51 "bindings": {
52 "value": {"<->": "@owner.boundObjectIdentifier"}
53 },
54 "listeners" : [
55 {
56 "type": "change",
57 "listener": {"@": "owner"}
58 }
59 ]
60 },
61 "sourceObjectPropertyPathField": {
62 "prototype": "js/components/hintable.reel",
63 "properties": {
64 "startOnEvent": "click",
65 "element": {"#": "so-pp"},
66 "identifier": "sourceProperty"
67 },
68 "bindings": {
69 "value": {"<->": "@owner.sourceObjectPropertyPath"}
70 },
71 "listeners" : [
72 {
73 "type": "change",
74 "listener": {"@": "owner"}
75 }
76 ]
77 },
78 "boundObjectPropertyPathField": {
79 "prototype": "js/components/hintable.reel",
80 "properties": {
81 "startOnEvent": "click",
82 "element": {"#": "bo-pp"},