aboutsummaryrefslogtreecommitdiff
path: root/js/panels/objects
diff options
context:
space:
mode:
authorEric Guzman2012-05-16 22:19:34 -0700
committerEric Guzman2012-05-16 22:19:34 -0700
commita40184e08a7ee2f189f133fd7bd83480e4bfc7f2 (patch)
tree1860f29af10fe27ead2eb6b8e2ec5a811abbfc5d /js/panels/objects
parentab7f00cdf7941bd788fcf44e70e4d2a6ad8b2012 (diff)
downloadninja-a40184e08a7ee2f189f133fd7bd83480e4bfc7f2.tar.gz
Objects Panel - Add object component
Diffstat (limited to 'js/panels/objects')
-rw-r--r--js/panels/objects/object.reel/object.css28
-rw-r--r--js/panels/objects/object.reel/object.html47
-rw-r--r--js/panels/objects/object.reel/object.js101
-rw-r--r--js/panels/objects/objects-panel.reel/objects-panel.css37
-rw-r--r--js/panels/objects/objects-panel.reel/objects-panel.html70
-rw-r--r--js/panels/objects/objects-panel.reel/objects-panel.js53
6 files changed, 336 insertions, 0 deletions
diff --git a/js/panels/objects/object.reel/object.css b/js/panels/objects/object.reel/object.css
new file mode 100644
index 00000000..6ca759ba
--- /dev/null
+++ b/js/panels/objects/object.reel/object.css
@@ -0,0 +1,28 @@
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 margin: 0;
19 padding: 0;
20}
21.objects-list list-item {
22 width: 200px;
23 height: 200px;
24 float: left;
25 margin: 0 18px 18px;
26 border-radius: 20px;
27 box-shadow: inset 0 0 4px rgba(0,0,0,0.5);
28} \ No newline at end of file
diff --git a/js/panels/objects/object.reel/object.html b/js/panels/objects/object.reel/object.html
new file mode 100644
index 00000000..efc66d79
--- /dev/null
+++ b/js/panels/objects/object.reel/object.html
@@ -0,0 +1,47 @@
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="object.css">
11
12 <script type="text/montage-serialization">
13 {
14 "owner": {
15 "prototype": "js/panels/objects/object.reel",
16 "properties": {
17 "element": {"#": "object"}
18 }
19 },
20 "labelText": {
21 "prototype": "montage/ui/dynamic-text.reel",
22 "properties": {
23 "element": {"#": "label" }
24 },
25 "bindings": {
26 "value" : {
27 "boundObject": {"@": "owner"},
28 "boundObjectPropertyPath": "label",
29 "oneway": true
30 }
31 }
32 }
33
34 }
35 </script>
36
37</head>
38<body>
39
40
41<li data-montage-id="object">
42 <div class="object-icon"></div>
43 <span data-montage-id="label" class="object-label"></span>
44</li>
45
46</body>
47</html>
diff --git a/js/panels/objects/object.reel/object.js b/js/panels/objects/object.reel/object.js
new file mode 100644
index 00000000..953c1baf
--- /dev/null
+++ b/js/panels/objects/object.reel/object.js
@@ -0,0 +1,101 @@
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.Object = Montage.create(Component, {
15 _needsPropertyInspection : { value: null },
16
17 _sourceObject : { value: null },
18 sourceObject : {
19 get: function() {
20 return this._sourceObject;
21 },
22 set: function(object) {
23 if(this._sourceObject === object) { return false; }
24
25 if(object._montage_metadata) {
26 this.montageMetaData = object._montage_metadata;
27 }
28
29 this._needsPropertyInspection = this.needsDraw = true;
30 }
31
32 },
33
34 _identifier : {
35 value: null
36 },
37 identifier : {
38 get: function() {
39 return this._identifier;
40 },
41 set: function(value) {
42 if(this._identifier === value || !value) { return false; }
43
44 this._identifier = value;
45
46 this.label = value;
47
48 this.needsDraw = true;
49 }
50
51 },
52
53 _montageMetaData : {
54 value: null
55 },
56 montageMetaData : {
57 get: function() {
58 return this._montageLabel;
59 },
60 set: function(value) {
61 if(this._montageMetaData === value) { return false; }
62
63 this._montageMetaData = value;
64
65 if(!this.identifier && value.label) {
66 this.label = value.label;
67 this.needsDraw = true;
68 }
69 }
70
71 },
72
73 templateDidLoad: {
74 value: function() {
75 console.log('object loaded');
76 }
77 },
78
79 prepareForDraw : {
80 value: function() {
81
82 }
83 },
84
85 willDraw : {
86 value: function() {
87 if(this._needsPropertyInspection) {
88
89 }
90
91 console.log("This label ", this.label);
92 }
93 },
94
95 draw : {
96 value: function() {
97
98 }
99 }
100
101}); \ No newline at end of file
diff --git a/js/panels/objects/objects-panel.reel/objects-panel.css b/js/panels/objects/objects-panel.reel/objects-panel.css
new file mode 100644
index 00000000..3fa3c479
--- /dev/null
+++ b/js/panels/objects/objects-panel.reel/objects-panel.css
@@ -0,0 +1,37 @@
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 margin: 10px 0 0 0;
19 padding: 0;
20}
21.objects-list .list-item {
22 list-style-type: none;
23 float: left;
24}
25.object-icon {
26 background-color: #fff;
27 border: 1px solid #353535;
28 border-radius: 5px;
29 height: 50px;
30 margin: 0 15px 5px;
31 width: 50px;
32}
33.object-label {
34 color: #fff;
35 display: block;
36 text-align: center;
37} \ No newline at end of file
diff --git a/js/panels/objects/objects-panel.reel/objects-panel.html b/js/panels/objects/objects-panel.reel/objects-panel.html
new file mode 100644
index 00000000..d68a59c0
--- /dev/null
+++ b/js/panels/objects/objects-panel.reel/objects-panel.html
@@ -0,0 +1,70 @@
1<!DOCTYPE html>