From a40184e08a7ee2f189f133fd7bd83480e4bfc7f2 Mon Sep 17 00:00:00 2001
From: Eric Guzman
Date: Wed, 16 May 2012 22:19:34 -0700
Subject: Objects Panel - Add object component
---
js/panels/objects/object.reel/object.css | 28 ++++++
js/panels/objects/object.reel/object.html | 47 ++++++++++
js/panels/objects/object.reel/object.js | 101 +++++++++++++++++++++
.../objects/objects-panel.reel/objects-panel.css | 37 ++++++++
.../objects/objects-panel.reel/objects-panel.html | 70 ++++++++++++++
.../objects/objects-panel.reel/objects-panel.js | 53 +++++++++++
6 files changed, 336 insertions(+)
create mode 100644 js/panels/objects/object.reel/object.css
create mode 100644 js/panels/objects/object.reel/object.html
create mode 100644 js/panels/objects/object.reel/object.js
create mode 100644 js/panels/objects/objects-panel.reel/objects-panel.css
create mode 100644 js/panels/objects/objects-panel.reel/objects-panel.html
create mode 100644 js/panels/objects/objects-panel.reel/objects-panel.js
(limited to 'js/panels/objects')
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 @@
+/* <copyright>
+ This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
+ No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
+ (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
+ </copyright> */
+
+/*
+
+<section data-montage-id="objects-panel" class="objects-panel">
+ <ul data-montage-id="list" class="objects-list">
+ <li data-montage-id="list-item" class="list-item"></li>
+ </ul>
+</section>
+
+*/
+
+.objects-list {
+ margin: 0;
+ padding: 0;
+}
+.objects-list list-item {
+ width: 200px;
+ height: 200px;
+ float: left;
+ margin: 0 18px 18px;
+ border-radius: 20px;
+ box-shadow: inset 0 0 4px rgba(0,0,0,0.5);
+}
\ 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 @@
+<!DOCTYPE html>
+<!-- <copyright>
+ This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
+ No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
+ (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
+ </copyright> -->
+<html>
+<head>
+ <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+ <link rel="stylesheet" type="text/css" href="object.css">
+
+ <script type="text/montage-serialization">
+ {
+ "owner": {
+ "prototype": "js/panels/objects/object.reel",
+ "properties": {
+ "element": {"#": "object"}
+ }
+ },
+ "labelText": {
+ "prototype": "montage/ui/dynamic-text.reel",
+ "properties": {
+ "element": {"#": "label" }
+ },
+ "bindings": {
+ "value" : {
+ "boundObject": {"@": "owner"},
+ "boundObjectPropertyPath": "label",
+ "oneway": true
+ }
+ }
+ }
+
+ }
+ </script>
+
+</head>
+<body>
+
+
+<li data-montage-id="object">
+ <div class="object-icon"></div>
+ <span data-montage-id="label" class="object-label"></span>
+</li>
+
+</body>
+</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 @@
+/* <copyright>
+ This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
+ No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
+ (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
+ </copyright> */
+
+/**
+ @requires montage/core/core
+ @requires montage/ui/component
+ */
+var Montage = require("montage/core/core").Montage,
+ Component = require("montage/ui/component").Component;
+
+exports.Object = Montage.create(Component, {
+ _needsPropertyInspection : { value: null },
+
+ _sourceObject : { value: null },
+ sourceObject : {
+ get: function() {
+ return this._sourceObject;
+ },
+ set: function(object) {
+ if(this._sourceObject === object) { return false; }
+
+ if(object._montage_metadata) {
+ this.montageMetaData = object._montage_metadata;
+ }
+
+ this._needsPropertyInspection = this.needsDraw = true;
+ }
+
+ },
+
+ _identifier : {
+ value: null
+ },
+ identifier : {
+ get: function() {
+ return this._identifier;
+ },
+ set: function(value) {
+ if(this._identifier === value || !value) { return false; }
+
+ this._identifier = value;
+
+ this.label = value;
+
+ this.needsDraw = true;
+ }
+
+ },
+
+ _montageMetaData : {
+ value: null
+ },
+ montageMetaData : {
+ get: function() {
+ return this._montageLabel;
+ },
+ set: function(value) {
+ if(this._montageMetaData === value) { return false; }
+
+ this._montageMetaData = value;
+
+ if(!this.identifier && value.label) {
+ this.label = value.label;
+ this.needsDraw = true;
+ }
+ }
+
+ },
+
+ templateDidLoad: {
+ value: function() {
+ console.log('object loaded');
+ }
+ },
+
+ prepareForDraw : {
+ value: function() {
+
+ }
+ },
+
+ willDraw : {
+ value: function() {
+ if(this._needsPropertyInspection) {
+
+ }
+
+ console.log("This label ", this.label);
+ }
+ },
+
+ draw : {
+ value: function() {
+
+ }
+ }
+
+});
\ 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 @@
+/* <copyright>
+ This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
+ No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
+ (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
+ </copyright> */
+
+/*
+
+<section data-montage-id="objects-panel" class="objects-panel">
+ <ul data-montage-id="list" class="objects-list">
+ <li data-montage-id="list-item" class="list-item"></li>
+ </ul>
+</section>
+
+*/
+
+.objects-list {
+ margin: 10px 0 0 0;
+ padding: 0;
+}
+.objects-list .list-item {
+ list-style-type: none;
+ float: left;
+}
+.object-icon {
+ background-color: #fff;
+ border: 1px solid #353535;
+ border-radius: 5px;
+ height: 50px;
+ margin: 0 15px 5px;
+ width: 50px;
+}
+.object-label {
+ color: #fff;
+ display: block;
+ text-align: center;
+}
\ 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 @@
+<!DOCTYPE html>
+<!-- <copyright>
+ This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
+ No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
+ (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
+ </copyright> -->
+<html>
+<head>
+ <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+ <link rel="stylesheet" type="text/css" href="objects-panel.css">
+
+ <script type="text/montage-serialization">
+ {
+ "owner": {
+ "prototype": "js/panels/objects/objects-panel.reel",
+ "properties": {
+ "element": {"#": "objects-panel"}
+ }
+ },
+ "repetition" : {
+ "prototype": "montage/ui/repetition.reel",
+ "properties": {
+ "element": {"#": "list"},
+ "contentController": {"@": "arrayController"}
+ }
+ },
+ "arrayController": {
+ "prototype": "montage/ui/controller/array-controller",
+ "bindings": {
+ "content" : {
+ "boundObject": {"@": "owner"},
+ "boundObjectPropertyPath": "objects",
+ "oneway": true
+ }
+ }
+ },
+ "objectComponent": {
+ "prototype": "js/panels/objects/object.reel",
+ "properties": {
+ "element": {"#": "list-item"}
+ },
+ "bindings": {
+ "sourceObject" : {
+ "boundObject": {"@": "repetition"},
+ "boundObjectPropertyPath": "objectAtCurrentIteration",
+ "oneway": true
+ },
+ "identifier" : {
+ "boundObject": {"@": "repetition"},
+ "boundObjectPropertyPath": "objectAtCurrentIteration.identifier",
+ "oneway": true
+ }
+ }
+ }
+
+ }
+ </script>
+
+</head>
+<body>
+
+
+<section data-montage-id="objects-panel" class="objects-panel">
+ <ul data-montage-id="list" class="objects-list">
+ <li data-montage-id="list-item" class="list-item"></li>
+ </ul>
+</section>
+
+</body>
+</html>
diff --git a/js/panels/objects/objects-panel.reel/objects-panel.js b/js/panels/objects/objects-panel.reel/objects-panel.js
new file mode 100644
index 00000000..a1c381a2
--- /dev/null
+++ b/js/panels/objects/objects-panel.reel/objects-panel.js
@@ -0,0 +1,53 @@
+/* <copyright>
+ This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
+ No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
+ (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
+ </copyright> */
+
+/**
+ @requires montage/core/core
+ @requires montage/ui/component
+ */
+var Montage = require("montage/core/core").Montage,
+ Component = require("montage/ui/component").Component;
+
+exports.ObjectsPanel = Montage.create(Component, {
+ _objects: { value: null },
+ objects: {
+ get: function() {
+ return this._objects;
+ },
+ set: function(value) {
+ this._objects = value;
+ this.needsDraw = true;
+ }
+ },
+
+
+ templateDidLoad: {
+ value: function() {
+ console.log('objects panel loaded');
+ }
+ },
+
+ prepareForDraw : {
+ value: function() {
+
+ Object.defineBinding(this, 'objects', {
+ "boundObject": this.application.ninja.objectsController,
+ "boundObjectPropertyPath": "objects",
+ "oneway": true
+ });
+
+ }
+ },
+ draw : {
+ value: function() {
+ console.log("objects panel draw");
+ if(this.objects) {
+
+ }
+ }
+ }
+
+});
\ No newline at end of file
--
cgit v1.2.3