aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorArmen Kesablyan2012-06-15 16:28:58 -0700
committerArmen Kesablyan2012-06-15 16:28:58 -0700
commit2fcb74d0b204ce2999b70fa9a46fc58a558344d8 (patch)
tree951a3814b8b9303163271d76c53d213ac0487481
parentd7456b5d8f5231b7cb6df31081474cfcd5900a84 (diff)
parent057afac9e7b99a3c4339003cca19ec3962d5fa13 (diff)
downloadninja-2fcb74d0b204ce2999b70fa9a46fc58a558344d8.tar.gz
Merge pull request #15 from ericguzman/binding
Binding
-rwxr-xr-xjs/ninja.reel/ninja.js2
-rw-r--r--js/stage/objects-tray.reel/objects-tray.css8
-rw-r--r--js/stage/objects-tray.reel/objects-tray.js44
3 files changed, 50 insertions, 4 deletions
diff --git a/js/ninja.reel/ninja.js b/js/ninja.reel/ninja.js
index fe20447a..4127e59a 100755
--- a/js/ninja.reel/ninja.js
+++ b/js/ninja.reel/ninja.js
@@ -47,7 +47,7 @@ exports.Ninja = Montage.create(Component, {
47 47
48 workspaceMode: { 48 workspaceMode: {
49 get: function() { 49 get: function() {
50 return this.workspaceMode; 50 return this._workspaceMode;
51 }, 51 },
52 set: function(val) { 52 set: function(val) {
53 if(this._workspaceMode !== val ) { 53 if(this._workspaceMode !== val ) {
diff --git a/js/stage/objects-tray.reel/objects-tray.css b/js/stage/objects-tray.reel/objects-tray.css
index 422d6a8f..61d9ff1e 100644
--- a/js/stage/objects-tray.reel/objects-tray.css
+++ b/js/stage/objects-tray.reel/objects-tray.css
@@ -30,4 +30,12 @@
30 margin: 0 auto; 30 margin: 0 auto;
31 overflow: hidden; 31 overflow: hidden;
32 -webkit-box-flex: 0; 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);
33} \ No newline at end of file 41} \ No newline at end of file
diff --git a/js/stage/objects-tray.reel/objects-tray.js b/js/stage/objects-tray.reel/objects-tray.js
index ee1ecd06..c046a3bb 100644
--- a/js/stage/objects-tray.reel/objects-tray.js
+++ b/js/stage/objects-tray.reel/objects-tray.js
@@ -12,6 +12,25 @@ var Montage = require("montage/core/core").Montage,
12 Component = require("montage/ui/component").Component; 12 Component = require("montage/ui/component").Component;
13 13
14exports.ObjectsTray = Montage.create(Component, { 14exports.ObjectsTray = Montage.create(Component, {
15 hideClass : { value: 'hide-objects-tray'},
16 _workspaceMode : { value: null },
17 workspaceMode : {
18 get : function() { return this._workspaceMode; },
19 set : function(value) {
20 if(value === this._workspaceMode) { return; }
21
22 var toHide = (value !== 'binding');
23
24 setTimeout(function() {
25 this.hide = toHide;
26 }.bind(this), 200);
27
28 this._workspaceMode = value;
29
30 this.needsDraw = true;
31 }
32 },
33
15 _objects: { value: null }, 34 _objects: { value: null },
16 objects: { 35 objects: {
17 get: function() { 36 get: function() {
@@ -23,6 +42,18 @@ exports.ObjectsTray = Montage.create(Component, {
23 } 42 }
24 }, 43 },
25 44
45 _hide : { value: null },
46 hide : {
47 get : function() { return this._hide; },
48 set : function(value) {
49 if(value === this._hide) { return; }
50
51 this._hide = value;
52
53 this.needsDraw = true;
54 }
55 },
56
26 57
27 templateDidLoad: { 58 templateDidLoad: {
28 value: function() { 59 value: function() {
@@ -33,6 +64,12 @@ exports.ObjectsTray = Montage.create(Component, {
33 prepareForDraw : { 64 prepareForDraw : {
34 value: function() { 65 value: function() {
35 66
67 Object.defineBinding(this, 'workspaceMode', {
68 "boundObject": this.application.ninja,
69 "boundObjectPropertyPath": "workspaceMode",
70 "oneway": true
71 });
72
36 Object.defineBinding(this, 'objects', { 73 Object.defineBinding(this, 'objects', {
37 "boundObject": this.application.ninja.objectsController, 74 "boundObject": this.application.ninja.objectsController,
38 "boundObjectPropertyPath": "objects", 75 "boundObjectPropertyPath": "objects",
@@ -43,9 +80,10 @@ exports.ObjectsTray = Montage.create(Component, {
43 }, 80 },
44 draw : { 81 draw : {
45 value: function() { 82 value: function() {
46 console.log("objects panel draw"); 83 if(this.hide) {
47 if(this.objects) { 84 this.element.classList.add(this.hideClass);
48 85 } else {
86 this.element.classList.remove(this.hideClass);
49 } 87 }
50 } 88 }
51 } 89 }