aboutsummaryrefslogtreecommitdiff
path: root/js/panels/binding-panel.reel
diff options
context:
space:
mode:
Diffstat (limited to 'js/panels/binding-panel.reel')
-rw-r--r--js/panels/binding-panel.reel/binding-panel.css22
-rw-r--r--js/panels/binding-panel.reel/binding-panel.html80
-rw-r--r--js/panels/binding-panel.reel/binding-panel.js78
3 files changed, 180 insertions, 0 deletions
diff --git a/js/panels/binding-panel.reel/binding-panel.css b/js/panels/binding-panel.reel/binding-panel.css
new file mode 100644
index 00000000..a1d5be0f
--- /dev/null
+++ b/js/panels/binding-panel.reel/binding-panel.css
@@ -0,0 +1,22 @@
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.binding-panel {
8 position: relative;
9 height: 100%;
10 display: -webkit-box;
11 overflow: hidden;
12 -webkit-box-orient: vertical;
13}
14
15.bindings-list {
16 -webkit-box-flex: 1;
17 padding: 0;
18 margin: 0;
19}
20.binding-panel-toolbar-container {
21 -webkit-box-flex: 0;
22}
diff --git a/js/panels/binding-panel.reel/binding-panel.html b/js/panels/binding-panel.reel/binding-panel.html
new file mode 100644
index 00000000..9a2834c7
--- /dev/null
+++ b/js/panels/binding-panel.reel/binding-panel.html
@@ -0,0 +1,80 @@
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="binding-panel.css" type="text/css">
11 <script type="text/montage-serialization">
12 {
13 "owner": {
14 "prototype": "js/panels/binding-panel.reel",
15 "properties": {
16 "element": {"#": "binding"},
17 "editView": {"@": "editBinding"}
18 }
19 },
20 "arrayController": {
21 "prototype": "montage/ui/controller/array-controller",
22 "bindings": {
23 "content" : {"<-": "@owner.bindings" }
24 }
25 },
26 "repetition": {
27 "prototype": "montage/ui/repetition.reel",
28 "properties": {
29 "element": {"#": "bindings-list"},
30 "contentController": {"@": "arrayController"}
31 }
32 },
33 "bindingItem": {
34 "prototype": "js/panels/binding/binding-item.reel",
35 "properties": {
36 "element": {"#": "binding-item"}
37 },
38 "bindings": {
39 "bindingArgs": {"<-": "@repetition.objectAtCurrentIteration"},
40 "sourceObjectPropertyPath": {"<-": "@repetition.objectAtCurrentIteration.sourceObjectPropertyPath"},
41 "sourceObject": {"<-": "@repetition.objectAtCurrentIteration.sourceObject"},
42 "boundObjectPropertyPath": {"<-": "@repetition.objectAtCurrentIteration.boundObjectPropertyPath"},
43 "boundObject": {"<-": "@repetition.objectAtCurrentIteration.boundObject"},
44 "oneway": {"<-": "@repetition.objectAtCurrentIteration.oneway"}
45 }
46 },
47 "editBinding": {
48 "prototype": "js/panels/binding/edit-binding-view.reel",
49 "properties": {
50 "element": {"#": "edit-binding-view" }
51 }
52 },
53 "toolbar": {
54 "prototype": "js/components/toolbar.reel",
55 "properties": {
56 "element": {"#": "binding-panel-toolbar"},
57 "delegate": {"@": "owner" },
58 "buttons": [
59 {
60 "title": "Add",
61 "identifier": "add"
62 }
63 ]
64 }
65 }
66 }
67 </script>
68 </head>
69<body>
70 <div data-montage-id="binding" class="binding-panel">
71 <ul data-montage-id="bindings-list" class="bindings-list">
72 <li data-montage-id="binding-item" class="binding-item"></li>
73 </ul>
74 <div data-montage-id="binding-panel-toolbar-container" class="binding-panel-toolbar-container">
75 <div data-montage-id="binding-panel-toolbar"></div>
76 </div>
77 <div data-montage-id="edit-binding-view" class="edit-binding-view"></div>
78 </div>
79</body>
80</html> \ No newline at end of file
diff --git a/js/panels/binding-panel.reel/binding-panel.js b/js/panels/binding-panel.reel/binding-panel.js
new file mode 100644
index 00000000..0641ecf5
--- /dev/null
+++ b/js/panels/binding-panel.reel/binding-panel.js
@@ -0,0 +1,78 @@
1var Montage = require("montage/core/core").Montage,
2 Component = require("montage/ui/component").Component;
3
4
5exports.BindingPanel = Montage.create(Component, {
6
7 bindings : { value: null },
8 editView : { value: null },
9 _editing: { value: null },
10 editing: {
11 get: function() {
12 return this._editing;
13 },
14 set: function(value) {
15 if(value === this._editing) { return; }
16 this._editing = value;
17 this.needsDraw = true;
18 }
19 },
20 _translateDistance : {
21 value: null
22 },
23
24 displayEditView : {
25 value: function(bindingArgs) {
26 this.editView.bindingArgs = bindingArgs;
27 this.editing = true;
28 }
29 },
30
31 /* -------------------------
32 Toolbar Button Actions
33 ------------------------- */
34
35 handleAddAction : {
36 value: function(e) {
37 var newBindingArgs = {
38 sourceObject : this.application.ninja.objectsController.currentObject
39 };
40
41 this.displayEditView(newBindingArgs);
42 }
43 },
44
45
46
47 templateDidLoad : {
48 value: function() {
49 Object.defineBinding(this, 'bindings', {
50 boundObject: this.application.ninja.objectsController,
51 boundObjectPropertyPath: "currentObjectBindings",
52 oneway: true
53 });
54 }
55 },
56
57 willDraw: {
58 value: function() {
59 if(this.editing) {
60 this._translateDistance = this.element.offsetWidth;
61 }
62 }
63 },
64
65 draw : {
66 value: function() {
67 var transStr = '-webkit-transform';
68
69 if(this.editing) {
70 this.editView.element.style.setProperty(transStr, 'translate3d(-'+ this._translateDistance + 'px,0,0)');
71 this.editView.element.style.setProperty('box-shadow', '0 0 10px rgba(0,0,0,0.2)')
72 } else {
73 this.editView.element.style.removeProperty(transStr);
74 this.editView.element.style.removeProperty('box-shadow');
75 }
76 }
77 }
78}); \ No newline at end of file
generated by cgit v1.2.3 (git 2.25.1) at 2024-08-25 07:56:26 +0000