aboutsummaryrefslogtreecommitdiff
path: root/js/stage/objects-tray.reel
diff options
context:
space:
mode:
Diffstat (limited to 'js/stage/objects-tray.reel')
-rw-r--r--js/stage/objects-tray.reel/objects-tray.css41
-rw-r--r--js/stage/objects-tray.reel/objects-tray.html58
-rw-r--r--js/stage/objects-tray.reel/objects-tray.js98
3 files changed, 197 insertions, 0 deletions
diff --git a/js/stage/objects-tray.reel/objects-tray.css b/js/stage/objects-tray.reel/objects-tray.css
new file mode 100644
index 00000000..61d9ff1e
--- /dev/null
+++ b/js/stage/objects-tray.reel/objects-tray.css
@@ -0,0 +1,41 @@
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/*
8
9<section data-montage-id="objects-panel" class="objects-panel">
10 <ul data-montage-id="list" class="objects-list">
11 <li data-montage-id="list-item" class="list-item"></li>
12 </ul>
13</section>
14
15*/
16
17.objects-list {
18 font-size: 11px;
19 margin: 10px 0 0 0;
20 padding: 0;
21 text-shadow: -1px -1px 0 #4D4D4D;
22}
23
24.objects-tray {
25 background-color: rgba(0,0,0,.6);
26 border-top-right-radius: 8px;
27 border-top-left-radius: 8px;
28 box-shadow: inset 0 0 3px #333;
29 padding: 0 10px 5px;
30 margin: 0 auto;
31 overflow: hidden;
32 -webkit-box-flex: 0;
33 -webkit-transition: -webkit-transform .5s cubic-bezier(.44,.19,0,.99);
34 -webkit-transform-origin: center bottom;
35
36}
37
38.hide-objects-tray {
39 /*-webkit-transform: scale(0);*/
40 -webkit-transform: translate3d(0, 100px, 0) scale(.5);
41} \ No newline at end of file
diff --git a/js/stage/objects-tray.reel/objects-tray.html b/js/stage/objects-tray.reel/objects-tray.html
new file mode 100644
index 00000000..0fece3fe
--- /dev/null
+++ b/js/stage/objects-tray.reel/objects-tray.html
@@ -0,0 +1,58 @@
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="objects-tray.css">
11
12 <script type="text/montage-serialization">
13 {
14 "owner": {
15 "prototype": "js/stage/objects-tray.reel",
16 "properties": {
17 "element": {"#": "objects-tray"}
18 }
19 },
20 "repetition" : {
21 "prototype": "montage/ui/repetition.reel",
22 "properties": {
23 "element": {"#": "list"},
24 "contentController": {"@": "arrayController"}
25 }
26 },
27 "arrayController": {
28 "prototype": "montage/ui/controller/array-controller",
29 "bindings": {
30 "content": {"<-": "@owner.objects"}
31 }
32 },
33 "objectComponent": {
34 "prototype": "js/panels/objects/object.reel",
35 "properties": {
36 "element": {"#": "list-item"}
37 },
38 "bindings": {
39 "sourceObject" : {"<-": "@repetition.objectAtCurrentIteration"},
40 "identifier" : {"<-": "@repetition.objectAtCurrentIteration.identifier"}
41 }
42 }
43
44 }
45 </script>
46
47</head>
48<body>
49
50
51<section data-montage-id="objects-tray" class="objects-tray">
52 <ul data-montage-id="list" class="objects-list">
53 <li data-montage-id="list-item" class="list-item"></li>
54 </ul>
55</section>
56
57</body>
58</html>
diff --git a/js/stage/objects-tray.reel/objects-tray.js b/js/stage/objects-tray.reel/objects-tray.js
new file mode 100644
index 00000000..190abf57
--- /dev/null
+++ b/js/stage/objects-tray.reel/objects-tray.js
@@ -0,0 +1,98 @@
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/**
8 @requires montage/core/core
9 @requires montage/ui/component
10 */
11var Montage = require("montage/core/core").Montage,
12 Component = require("montage/ui/component").Component;
13
14exports.ObjectsTray = Montage.create(Component, {
15 hideClass : { value: 'hide-objects-tray'},
16 _empty : { value: null },
17 _workspaceMode : { value: null },
18 workspaceMode : {
19 get : function() { return this._workspaceMode; },
20 set : function(value) {
21 if(value === this._workspaceMode) { return; }
22
23 var toHide = (value !== 'binding');
24
25 setTimeout(function() {
26 this.hide = toHide;
27 }.bind(this), 200);
28
29 this._workspaceMode = value;
30
31 this.needsDraw = true;
32 }
33 },
34
35 _objects: { value: null },
36 objects: {
37 get: function() {
38 return this._objects;
39 },
40 set: function(value) {
41 this._objects = value;
42 this.needsDraw = true;
43 }
44 },
45
46 _hide : { value: null },
47 hide : {
48 get : function() { return this._hide; },
49 set : function(value) {
50 if(value === this._hide) { return; }
51
52 this._hide = value;
53
54 this.needsDraw = true;
55 }
56 },
57
58
59 templateDidLoad: {
60 value: function() {
61 console.log('objects panel loaded');
62 }
63 },
64
65 prepareForDraw : {
66 value: function() {
67
68 Object.defineBinding(this, 'workspaceMode', {
69 "boundObject": this.application.ninja,
70 "boundObjectPropertyPath": "workspaceMode",
71 "oneway": true
72 });
73
74 Object.defineBinding(this, 'objects', {
75 "boundObject": this.application.ninja.objectsController,
76 "boundObjectPropertyPath": "objects",
77 "oneway": true
78 });
79
80 if(this.objects) {
81 this.empty = !this.objects.length;
82 } else {
83 this.empty = true;
84 }
85
86 }
87 },
88 draw : {
89 value: function() {
90 if(this.hide || this._empty) {
91 this.element.classList.add(this.hideClass);
92 } else {
93 this.element.classList.remove(this.hideClass);
94 }
95 }
96 }
97
98}); \ No newline at end of file