From 14f28d0031dc9d522b4ae7d1dbff192b8d8a670e Mon Sep 17 00:00:00 2001 From: François Frisch Date: Sat, 17 Mar 2012 11:58:58 -0700 Subject: Adding components to PI --- .../ComponentsPanelBase.js | 22 +++++++++++++++++++++- 1 file changed, 21 insertions(+), 1 deletion(-) (limited to 'js/panels') diff --git a/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js b/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js index b4eec771..981e666f 100755 --- a/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js +++ b/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js @@ -22,6 +22,26 @@ var ComponentsPanelBase = exports.ComponentsPanelBase = Montage.create(Component value: { "text": "styles", "children": [ + { + "text": "Widgets", + "children": [ + { + "text": "Map", + "dataFile" : "node_modules/components-data/map.json", + "component": "map" + }, + { + "text": "Feed Reader", + "dataFile" : "node_modules/components-data/feed-reader.json", + "component": "feedreader" + }, + { + "text": "Search Bar", + "dataFile" : "node_modules/components-data/searchfield.json", + "component": "searchfield" + } + ] + }, { "text": "Montage Components", "children": [ @@ -50,7 +70,7 @@ var ComponentsPanelBase = exports.ComponentsPanelBase = Montage.create(Component "dataFile" : "node_modules/components-data/number-input.json", "component": "numberInput" }, - { + { "text": "Select Input", "dataFile" : "node_modules/components-data/select.json", "component": "select" -- cgit v1.2.3 From 11afad994a9ff5e3c8c43d8ad9cd2cf7d0147797 Mon Sep 17 00:00:00 2001 From: Valerio Virgillito Date: Sat, 17 Mar 2012 15:38:29 -0700 Subject: adding element creation for the map and feedreader components. Signed-off-by: Valerio Virgillito --- .../ComponentsPanelBase.reel/ComponentsPanelBase.js | 11 +++++++++++ 1 file changed, 11 insertions(+) (limited to 'js/panels') diff --git a/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js b/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js index 981e666f..92d21bc3 100755 --- a/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js +++ b/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js @@ -333,6 +333,7 @@ var ComponentsPanelBase = exports.ComponentsPanelBase = Montage.create(Component el.setAttribute("type", "range"); break; case "textfield": + case "searchfield": el = NJUtils.makeNJElement("input", "Textfield", "component"); el.elementModel.pi = "TextfieldPi"; el.setAttribute("type", "text"); @@ -346,6 +347,16 @@ var ComponentsPanelBase = exports.ComponentsPanelBase = Montage.create(Component el.elementModel.pi = "ToggleButtonPi"; el.innerHTML = "Off"; break; + case "map": + el = NJUtils.makeNJElement("div", "Map", "component"); + el.elementModel.pi = "MapPi"; + el.elementModel.isComponent = true; + break; + case "feedreader": + el = NJUtils.makeNJElement("div", "Feed Reader", "component"); + el.elementModel.pi = "FeedReaderPi"; + el.elementModel.isComponent = true; + } return el; -- cgit v1.2.3 From 09852e9b9b8e64f003bed5aa57630d8b42c8ac95 Mon Sep 17 00:00:00 2001 From: François Frisch Date: Sat, 17 Mar 2012 19:28:30 -0700 Subject: Integrating picasa carousel and youtube channel --- .../ComponentsPanelBase.reel/ComponentsPanelBase.js | 16 +++++++++++++--- 1 file changed, 13 insertions(+), 3 deletions(-) (limited to 'js/panels') diff --git a/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js b/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js index 92d21bc3..49d1179a 100755 --- a/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js +++ b/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js @@ -25,20 +25,30 @@ var ComponentsPanelBase = exports.ComponentsPanelBase = Montage.create(Component { "text": "Widgets", "children": [ + { + "text": "Feed Reader", + "dataFile" : "node_modules/components-data/feed-reader.json", + "component": "feedreader" + }, { "text": "Map", "dataFile" : "node_modules/components-data/map.json", "component": "map" }, { - "text": "Feed Reader", - "dataFile" : "node_modules/components-data/feed-reader.json", - "component": "feedreader" + "text": "Picasa Carousel", + "dataFile" : "node_modules/components-data/picasa-carousel.json", + "component": "picasa-carousel" }, { "text": "Search Bar", "dataFile" : "node_modules/components-data/searchfield.json", "component": "searchfield" + }, + { + "text": "Youtube Channel", + "dataFile" : "node_modules/components-data/youtube-channel.json", + "component": "youtube-channel" } ] }, -- cgit v1.2.3 From 6b1467535198f6b85bd2bf045d2c354b812616c2 Mon Sep 17 00:00:00 2001 From: François Frisch Date: Sat, 17 Mar 2012 20:03:18 -0700 Subject: Youtube video is droppable still getting errors with the carousel Signed-off-by: Valerio Virgillito --- .../ComponentsPanelBase.reel/ComponentsPanelBase.js | 11 +++++++++++ 1 file changed, 11 insertions(+) (limited to 'js/panels') diff --git a/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js b/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js index 49d1179a..dcb69255 100755 --- a/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js +++ b/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js @@ -366,6 +366,17 @@ var ComponentsPanelBase = exports.ComponentsPanelBase = Montage.create(Component el = NJUtils.makeNJElement("div", "Feed Reader", "component"); el.elementModel.pi = "FeedReaderPi"; el.elementModel.isComponent = true; + break; + case "picasa-carousel": + el = NJUtils.makeNJElement("div", "Picasa Carousel", "component"); + el.elementModel.pi = "PicasaCarouselPi"; + el.elementModel.isComponent = true; + break; + case "youtube-channel": + el = NJUtils.makeNJElement("div", "Youtube Channel", "component"); + el.elementModel.pi = "YoutubeChannelPi"; + el.elementModel.isComponent = true; + break; } -- cgit v1.2.3 From 3056d540f32bb24927d06bfc516240cc6a0001f8 Mon Sep 17 00:00:00 2001 From: Valerio Virgillito Date: Sun, 18 Mar 2012 15:13:25 -0700 Subject: looping through both branches of the components tree Signed-off-by: Valerio Virgillito --- .../ComponentsPanelBase.js | 22 +++++++++++++--------- 1 file changed, 13 insertions(+), 9 deletions(-) (limited to 'js/panels') diff --git a/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js b/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js index dcb69255..87c68a52 100755 --- a/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js +++ b/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js @@ -159,15 +159,19 @@ var ComponentsPanelBase = exports.ComponentsPanelBase = Montage.create(Component _loadComponents: { value: function() { - this.componentsToLoad = this.components.children[0].children.length; - - for(var i = 0, component; component = this.components.children[0].children[i]; i++) { - var req = new XMLHttpRequest(); - //req.identifier = "searchRequest"; - req.open("GET", component.dataFile); - req.addEventListener("load", this, false); - req.addEventListener("error", this, false); - req.send(); + for(var cat in this.components.children) { + + this.componentsToLoad += this.components.children[cat].children.length; + + for(var i = 0, component; component = this.components.children[cat].children[i]; i++) { + var req = new XMLHttpRequest(); + //req.identifier = "searchRequest"; + req.open("GET", component.dataFile); + req.addEventListener("load", this, false); + req.addEventListener("error", this, false); + req.send(); + } + } } }, -- cgit v1.2.3 From ea439c4471948cb7e1dbb98bfa9c2ddc374d48e7 Mon Sep 17 00:00:00 2001 From: Nivesh Rajbhandari Date: Mon, 19 Mar 2012 14:19:48 -0700 Subject: Maps - Apply default width and height styles to components if specified. Change default location to Sunnyvale. Signed-off-by: Nivesh Rajbhandari --- .../Components/ComponentsPanelBase.reel/ComponentsPanelBase.js | 7 +++++++ 1 file changed, 7 insertions(+) (limited to 'js/panels') diff --git a/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js b/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js index 87c68a52..599eeda3 100755 --- a/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js +++ b/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js @@ -291,6 +291,13 @@ var ComponentsPanelBase = exports.ComponentsPanelBase = Montage.create(Component '-webkit-transform' : 'perspective(1400) matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)' }; + var defaultStyles = component.defaultStyles; + if(defaultStyles) { + for(var n in defaultStyles) { + styles[n] = defaultStyles[n]; + } + } + that.application.ninja.currentDocument.setComponentInstance(instance, element); NJevent("elementAdding", {"el": element, "data":styles}); -- cgit v1.2.3 From 313354a8ff9ed21b826ab5f280bcf1095a64a7f4 Mon Sep 17 00:00:00 2001 From: Valerio Virgillito Date: Mon, 19 Mar 2012 18:11:50 -0700 Subject: fully removing our old button component from Ninja Signed-off-by: Valerio Virgillito --- js/panels/properties.reel/properties.css | 13 --------- .../position-and-size.reel/position-and-size.css | 32 ++++++++++++++++++++-- .../position-and-size.reel/position-and-size.html | 13 ++++----- .../position-and-size.reel/position-and-size.js | 10 +++---- 4 files changed, 40 insertions(+), 28 deletions(-) (limited to 'js/panels') diff --git a/js/panels/properties.reel/properties.css b/js/panels/properties.reel/properties.css index f8d37984..f82d3660 100755 --- a/js/panels/properties.reel/properties.css +++ b/js/panels/properties.reel/properties.css @@ -230,23 +230,10 @@ padding-right:6px; clear:none; } -.propertiesPanel .LockToolUp, .propertiesPanel .UnLockToolUp { - position: absolute; - left: 105px; - border: none; - background-color: transparent; - top: 2px; - opacity: 0.7; -} - .propertiesPanel .button:active { outline: none; } -.propertiesPanel .LockToolUp:hover, .propertiesPanel .UnLockToolUp:hover { - opacity: 1; -} - .propertiesPanel input[type="checkbox"].nj-skinned, .propertiesPanel input[type="radio"].nj-skinned { position: relative; overflow: visible; diff --git a/js/panels/properties.reel/sections/position-and-size.reel/position-and-size.css b/js/panels/properties.reel/sections/position-and-size.reel/position-and-size.css index 227a232b..7f8fdbc2 100755 --- a/js/panels/properties.reel/sections/position-and-size.reel/position-and-size.css +++ b/js/panels/properties.reel/sections/position-and-size.reel/position-and-size.css @@ -8,7 +8,33 @@ display: none; } -.fieldCol .disabled -{ +.fieldCol .disabled { color:#999999; -} \ No newline at end of file +} + + +#posBound { + position: absolute; + left: 105px; + border: none; + background-color: transparent; + top: 2px; + opacity: 0.7; + width: 17px; + height: 18px; + margin-right: 10px; +} + +#posBound:hover { + opacity: 1; +} + +.unlock{ + background: url("../../../../../images/optionsbar/unlinked.png") no-repeat; + +} + +.lockUp { + background: url("../../../../../images/optionsbar/link.png") no-repeat; +} + diff --git a/js/panels/properties.reel/sections/position-and-size.reel/position-and-size.html b/js/panels/properties.reel/sections/position-and-size.reel/position-and-size.html index 6e355f31..f50724c5 100755 --- a/js/panels/properties.reel/sections/position-and-size.reel/position-and-size.html +++ b/js/panels/properties.reel/sections/position-and-size.reel/position-and-size.html @@ -85,13 +85,12 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot } }, "bindButton": { - "module": "js/components/button.reel", - "name": "Button", + "prototype": "montage/ui/toggle-button.reel", "properties": { - "element": {"#" :"posBound"}, - "isToggleButton": true, - "onState": "LockToolUp", - "offState": "UnLockToolUp" + "element": {"#": "posBound"}, + "pressedClass": "lockUp", + "preventFocus": true, + "identifier": "ratio" } } } @@ -119,7 +118,7 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
- +
diff --git a/js/panels/properties.reel/sections/position-and-size.reel/position-and-size.js b/js/panels/properties.reel/sections/position-and-size.reel/position-and-size.js index 49117090..1e47916f 100755 --- a/js/panels/properties.reel/sections/position-and-size.reel/position-and-size.js +++ b/js/panels/properties.reel/sections/position-and-size.reel/position-and-size.js @@ -100,7 +100,7 @@ exports.PosSize = Montage.create(Component, { */ handleRatioAction: { value: function() { - if(this.bindButton.value) { + if(this.bindButton.pressed) { this.aspectRatioWidth = this.heightControl.value / this.widthControl.value; if(isNaN(this.aspectRatioWidth) || !isFinite(this.aspectRatioWidth) || this.aspectRatioWidth === 0) this.aspectRatioWidth = 1; @@ -148,7 +148,7 @@ exports.PosSize = Montage.create(Component, { this.application.ninja.selectedElements.length ? items = this.application.ninja.selectedElements : items = [this.application.ninja.currentDocument.documentRoot]; - if(this.bindButton.value) { + if(this.bindButton.pressed) { var newWidth = Math.round(this.aspectRatioHeight * this.heightControl.value); @@ -173,7 +173,7 @@ exports.PosSize = Montage.create(Component, { this.application.ninja.selectedElements.length ? items = this.application.ninja.selectedElements : items = [this.application.ninja.currentDocument.documentRoot]; - if(this.bindButton.value) { + if(this.bindButton.pressed) { var newHeight = Math.round(this.aspectRatioWidth * this.widthControl.value); @@ -221,7 +221,7 @@ exports.PosSize = Montage.create(Component, { this.application.ninja.selectedElements.length ? items = this.application.ninja.selectedElements : items = [this.application.ninja.currentDocument.documentRoot]; - if(this.bindButton.value) { + if(this.bindButton.pressed) { var newWidth = Math.round(this.aspectRatioHeight * this.heightControl.value); @@ -246,7 +246,7 @@ exports.PosSize = Montage.create(Component, { this.application.ninja.selectedElements.length ? items = this.application.ninja.selectedElements : items = [this.application.ninja.currentDocument.documentRoot]; - if(this.bindButton.value) { + if(this.bindButton.pressed) { var newHeight = Math.round(this.aspectRatioWidth * this.widthControl.value); if(!isFinite(newHeight)) newHeight = this.widthControl.value; -- cgit v1.2.3 From 24fd82f555d0e3e591acceb0322bc514b87e95fb Mon Sep 17 00:00:00 2001 From: Eric Guzman Date: Tue, 20 Mar 2012 14:15:34 -0700 Subject: Presets - Animation update --- js/panels/presets/default-animation-presets.js | 79 ++++++++++++++++++++------ 1 file changed, 62 insertions(+), 17 deletions(-) (limited to 'js/panels') diff --git a/js/panels/presets/default-animation-presets.js b/js/panels/presets/default-animation-presets.js index 10a3e906..2e656e86 100644 --- a/js/panels/presets/default-animation-presets.js +++ b/js/panels/presets/default-animation-presets.js @@ -18,23 +18,23 @@ exports.animationPresets = { "-webkit-animation": "border-morph 2s infinite" } }, - { - "isKeyFrameRule": true, - "keys" : [{ - "keyText": "0%", - "styles": { "border-radius": "0" } - }, { - "keyText": "50%", - "styles": { - "border-radius": "100%" - } - }, { - "keyText": "100%", - "styles": { - "border-radius": "0%" - } + { + "isKeyFrameRule": true, + "keys" : [{ + "keyText": "0%", + "styles": { "border-radius": "0" } + }, { + "keyText": "50%", + "styles": { + "border-radius": "100%" + } + }, { + "keyText": "100%", + "styles": { + "border-radius": "0%" + } + }] }] - }] }] }, { "text": "3D Animations", @@ -50,7 +50,7 @@ exports.animationPresets = { "-webkit-animation-iteration-count": "infinite", "-webkit-animation-direction": "normal", "-webkit-animation-timing-function": "ease-out", - "-webkit-transform-origin": "200% 50%", + "-webkit-transform-origin": "100% 50%", "-webkit-transform-style": "preserve-3d", "-webkit-transform": "perspective(1000)", "-webkit-animation-delay": "0s" @@ -89,6 +89,51 @@ exports.animationPresets = { } }] }] + }, + { + "text": "Rotate with Fade In", + "selectorBase" : "rotate-with-fade-in", + "rules" : [{ + "selectorSuffix" : "", + "styles" : { + "-webkit-animation-name": "rotate-with-fade-in", + "-webkit-animation-duration": "5s", + "-webkit-animation-iteration-count": "infinite", + "-webkit-animation-direction": "normal", + "-webkit-animation-timing-function": "ease-out", + "-webkit-transform-origin": "100% 50%", + "-webkit-transform-style": "preserve-3d", + "-webkit-transform": "perspective(1000)", + "-webkit-animation-delay": "0s" + } + },{ + "isKeyFrameRule": true, + "keys" : [{ + "keyText": "0%", + "styles": { + "opacity": "0", + "-webkit-transform": "perspective(1000) rotateY(-90deg)" + } + }, { + "keyText": "15%", + "styles": { + "opacity": "1", + "-webkit-transform": "perspective(1000) rotateY(0deg)" + } + }, { + "keyText": "85%", + "styles": { + "opacity": "1", + "-webkit-transform": "perspective(1000) rotateY(0deg)" + } + }, { + "keyText": "100%", + "styles": { + "opacity": "0", + "-webkit-transform": "perspective(1000) rotateY(95deg)" + } + }] + }] }] }] }; \ No newline at end of file -- cgit v1.2.3 From 0a601adc97f58673c2a720ee61f4c7d7e7bfb68f Mon Sep 17 00:00:00 2001 From: Eric Guzman Date: Wed, 21 Mar 2012 12:26:45 -0700 Subject: Presets Panel - Add Font style preset --- js/panels/presets/default-style-presets.js | 18 ++++++++++++++++++ 1 file changed, 18 insertions(+) (limited to 'js/panels') diff --git a/js/panels/presets/default-style-presets.js b/js/panels/presets/default-style-presets.js index 3677d976..82bec34f 100644 --- a/js/panels/presets/default-style-presets.js +++ b/js/panels/presets/default-style-presets.js @@ -67,6 +67,24 @@ exports.stylePresets = { "text-shadow": "1px 1px 3px #333" } }] + }, + { + "text": "White Sans-Serif", + "selectorBase" : "white-sans-serif", + "rules" : [{ + "selectorSuffix" : "", + "styles" : { + "color": "#FFFFFF", + "font-family": "helvetica,arial,sans-serif" + } + }, + { + "selectorSuffix" : " h2", + "styles" : { + "color": "#C1C1C1", + "font-family": "helvetica,arial,sans-serif" + } + }] }] }] }; \ No newline at end of file -- cgit v1.2.3 From efcec76362a652033254fc6465dd127e8bebc04c Mon Sep 17 00:00:00 2001 From: Jose Antonio Marquez Date: Thu, 22 Mar 2012 09:57:32 -0700 Subject: Adding firstDraw event to components added This will allow us to re-parse the document for styles added dynamically. --- .../Components/ComponentsPanelBase.reel/ComponentsPanelBase.js | 8 ++++++++ 1 file changed, 8 insertions(+) (limited to 'js/panels') diff --git a/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js b/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js index 599eeda3..3505393c 100755 --- a/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js +++ b/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js @@ -297,6 +297,8 @@ var ComponentsPanelBase = exports.ComponentsPanelBase = Montage.create(Component styles[n] = defaultStyles[n]; } } + + instance.addEventListener('firstDraw', that, false); that.application.ninja.currentDocument.setComponentInstance(instance, element); @@ -305,6 +307,12 @@ var ComponentsPanelBase = exports.ComponentsPanelBase = Montage.create(Component } }, + + handleFirstDraw: { + value: function (e) { + NJevent("addComponentFirstDraw"); + } + }, makeComponent: { value: function(name) { -- cgit v1.2.3 From fea875906664f12feaad0f282901fa8d9a8b054a Mon Sep 17 00:00:00 2001 From: Eric Guzman Date: Thu, 22 Mar 2012 11:52:44 -0700 Subject: Presets Panel - Adding presets controller and removing functionality from panel code --- .../animations-presets.reel/animations-presets.js | 47 +-------------------- js/panels/presets/default-animation-presets.js | 2 - js/panels/presets/default-style-presets.js | 11 ++--- js/panels/presets/default-transition-presets.js | 8 ---- .../presets/style-presets.reel/style-presets.js | 49 +--------------------- .../transitions-presets.js | 20 +-------- 6 files changed, 9 insertions(+), 128 deletions(-) (limited to 'js/panels') diff --git a/js/panels/presets/animations-presets.reel/animations-presets.js b/js/panels/presets/animations-presets.reel/animations-presets.js index ab200212..6a16da54 100644 --- a/js/panels/presets/animations-presets.reel/animations-presets.js +++ b/js/panels/presets/animations-presets.reel/animations-presets.js @@ -22,52 +22,7 @@ exports.AnimationsLibrary = Montage.create(Component, { }, handleNodeActivation: { value: function(presetData) { - //debugger; - var selection = this.application.ninja.selectedElements, - stylesController = this.application.ninja.stylesController, - selectorBase = presetData.selectorBase, - self = this; - - if(!selection || !selection.length || selection.length === 0) { - return false; - } - - selectorBase = stylesController.generateClassName(selectorBase); - - presetData.rules.forEach(function(rule) { - if(rule.isKeyFrameRule) { - this.application.ninja.stylesController.addRule( - '@-webkit-keyframes ' + presetData.selectorBase, - this.stringifyKeys(rule.keys) - ); - } else { - this.application.ninja.stylesController.addRule('.' + selectorBase + rule.selectorSuffix, rule.styles); - } - - }, this); - - selection.forEach(function(el) { - el._element.classList.add(selectorBase); - }, this); - - } - }, - - stringifyKeys : { - value: function(keysArray) { - var keysString = ''; - - keysArray.forEach(function(key) { - var styles = '', style; - - for(style in key.styles) { - styles += style + ':' + key.styles[style] + '; '; - } - - keysString += key.keyText + ' {' + styles + ' }'; - }); - - return keysString; + this.application.ninja.presetsController.applyPreset(presetData); } } }); diff --git a/js/panels/presets/default-animation-presets.js b/js/panels/presets/default-animation-presets.js index 10a3e906..fa0127c2 100644 --- a/js/panels/presets/default-animation-presets.js +++ b/js/panels/presets/default-animation-presets.js @@ -13,7 +13,6 @@ exports.animationPresets = { "text": "Border Morph", "selectorBase" : "border-morph", "rules" : [{ - "selectorSuffix" : "", "styles" : { "-webkit-animation": "border-morph 2s infinite" } @@ -43,7 +42,6 @@ exports.animationPresets = { "text": "Rotater", "selectorBase" : "rotate-with-alpha-keyframes", "rules" : [{ - "selectorSuffix" : "", "styles" : { "-webkit-animation-name": "rotate-with-alpha-keyframes", "-webkit-animation-duration": "5s", diff --git a/js/panels/presets/default-style-presets.js b/js/panels/presets/default-style-presets.js index 3677d976..109faae2 100644 --- a/js/panels/presets/default-style-presets.js +++ b/js/panels/presets/default-style-presets.js @@ -11,9 +11,9 @@ exports.stylePresets = { "children": [ { "text": "Border-Radius", + "id": "njBorderRadius", "selectorBase" : "border-radius-preset", "rules" : [{ - "selectorSuffix" : "", "styles" : { "border-radius": "100px", "border" : "1px solid #333" @@ -22,9 +22,9 @@ exports.stylePresets = { }, { "text": "Drop Shadow", + "id": "njDropShadow", "selectorBase" : "drop-shadow", "rules" : [{ - "selectorSuffix" : "", "styles" : { "box-shadow": "2px 2px 50px rgba(0,0,0,0.5)", "border" : "1px solid #CCC" @@ -33,9 +33,10 @@ exports.stylePresets = { }, { "text": "Fancy Box", + "id": "njFancyBox", "selectorBase" : "fancy-box", "rules" : [{ - "selectorSuffix" : "", + "selectorSuffix": "", "styles" : { "box-shadow": "inset 0 0 0 1px #666, inset 0 0 0 2px rgba(225, 225, 225, 0.4), 0 0 20px -10px #333", "border" : "1px solid #FFF", @@ -50,9 +51,9 @@ exports.stylePresets = { "children": [ { "text": "Italic", + "id": "njItalic", "selectorBase" : "italicize", "rules" : [{ - "selectorSuffix" : "", "styles" : { "font-style": "italic" } @@ -60,9 +61,9 @@ exports.stylePresets = { }, { "text": "Text Shadow", + "id": "njTextShadow", "selectorBase" : "italicize", "rules" : [{ - "selectorSuffix" : "", "styles" : { "text-shadow": "1px 1px 3px #333" } diff --git a/js/panels/presets/default-transition-presets.js b/js/panels/presets/default-transition-presets.js index 15f4882f..f8968085 100644 --- a/js/panels/presets/default-transition-presets.js +++ b/js/panels/presets/default-transition-presets.js @@ -13,7 +13,6 @@ exports.transitionPresets = { "text": "Fade In", "selectorBase" : "fade-in", "rules" : [{ - "selectorSuffix": "", "styles" : { "opacity": "0.25", "-webkit-transition": "all 0.4s ease-in" @@ -29,7 +28,6 @@ exports.transitionPresets = { "text": "Fade Out", "selectorBase" : "fade-out", "rules" : [{ - "selectorSuffix": "", "styles" : { "opacity": "1", "-webkit-transition": "all 0.4s ease-in" @@ -48,7 +46,6 @@ exports.transitionPresets = { "text": "Slide Right", "selectorBase" : "slide-right", "rules" : [{ - "selectorSuffix": "", "styles" : { "-webkit-transition": "all 0.4s ease-in" } @@ -63,7 +60,6 @@ exports.transitionPresets = { "text": "Slide Left", "selectorBase" : "slide-left", "rules" : [{ - "selectorSuffix": "", "styles" : { "-webkit-transition": "all 0.4s ease-in" } @@ -78,7 +74,6 @@ exports.transitionPresets = { "text": "Rotate", "selectorBase" : "rotate", "rules" : [{ - "selectorSuffix" : "", "styles" : { "-webkit-transition": "all 0.4s ease-in" } @@ -92,7 +87,6 @@ exports.transitionPresets = { "text": "Scale Up", "selectorBase" : "scale-up", "rules" : [{ - "selectorSuffix" : "", "styles" : { "-webkit-transition": "-webkit-transform 0.4s ease-in" } @@ -107,7 +101,6 @@ exports.transitionPresets = { "text": "Scale Down", "selectorBase" : "scale-down", "rules" : [{ - "selectorSuffix" : "", "styles" : { "-webkit-transition": "-webkit-transform 0.4s ease-in" } @@ -122,7 +115,6 @@ exports.transitionPresets = { "text": "Remove 3D", "selectorBase" : "remove-3d", "rules" : [{ - "selectorSuffix": "", "styles" : { "-webkit-transition": "all 0.4s ease-in" } diff --git a/js/panels/presets/style-presets.reel/style-presets.js b/js/panels/presets/style-presets.reel/style-presets.js index 11f41822..6a28e069 100644 --- a/js/panels/presets/style-presets.reel/style-presets.js +++ b/js/panels/presets/style-presets.reel/style-presets.js @@ -22,60 +22,13 @@ exports.StylesLibrary = Montage.create(Component, { }, handleNodeActivation: { value: function(presetData) { - var selection = this.application.ninja.selectedElements, - stylesController = this.application.ninja.stylesController, - selectorBase = presetData.selectorBase, - self = this, className; - - if(!selection || !selection.length || selection.length === 0) { - return false; - } - - function setStopRuleSelector(selector) { - self.application.ninja - .currentDocument.documentRoot - .elementModel.controller - .changeSelector(self.application.ninja.currentDocument.documentRoot, null, selector); - } - - selectorBase = stylesController.generateClassName(selectorBase); - - presetData.rules.forEach(function(rule) { - stylesController.addRule('.'+selectorBase + rule.selectorSuffix, rule.styles); - }, this); - - selection.forEach(function(el) { - el._element.style.webkitTransition = "all 450ms linear"; - - el._element.addEventListener("webkitTransitionEnd", function presetTransition(e) { - el._element.style.webkitTransition = ''; - setStopRuleSelector("*"); - this.removeEventListener("webkitTransitionEnd", presetTransition, true); - - }, true); - setStopRuleSelector("transitionStopRule"); - el._element.classList.add(selectorBase); - - //// Keep track of elements with presets and don't add duplicates - - }, this); - - + this.application.ninja.presetsController.applyPreset(presetData, true); } }, handleDragEnd : { value: function(sourceObject) { console.log(sourceObject); } - }, - shouldChangeSelection : { - value : function(controller, newSelection, oldSelection) { - // - //debugger; - console.log('1Handle should change selection'); - return false; - } } - }); diff --git a/js/panels/presets/transitions-presets.reel/transitions-presets.js b/js/panels/presets/transitions-presets.reel/transitions-presets.js index f7d84085..ace38dbb 100644 --- a/js/panels/presets/transitions-presets.reel/transitions-presets.js +++ b/js/panels/presets/transitions-presets.reel/transitions-presets.js @@ -22,25 +22,7 @@ exports.TransitionsLibrary = Montage.create(Component, { }, handleNodeActivation: { value: function(presetData) { - var selection = this.application.ninja.selectedElements, - stylesController = this.application.ninja.stylesController, - selectorBase = presetData.selectorBase, - self = this; - - if(!selection || !selection.length || selection.length === 0) { - return false; - } - - selectorBase = stylesController.generateClassName(selectorBase); - - presetData.rules.forEach(function(rule) { - this.application.ninja.stylesController.addRule('.' + selectorBase + rule.selectorSuffix, rule.styles); - }, this); - - selection.forEach(function(el) { - el._element.classList.add(selectorBase); - }, this); - + this.application.ninja.presetsController.applyPreset(presetData); } } }); -- cgit v1.2.3 From 49596f2a6b518ed0ee945006787d3c69e40a5757 Mon Sep 17 00:00:00 2001 From: Armen Kesablyan Date: Thu, 22 Mar 2012 14:31:12 -0700 Subject: Updated Resizers for Panels and timeline Signed-off-by: Armen Kesablyan --- js/panels/Splitter.js | 2 +- js/panels/resize-composer.js | 23 +++++++++++++++++++++-- 2 files changed, 22 insertions(+), 3 deletions(-) (limited to 'js/panels') diff --git a/js/panels/Splitter.js b/js/panels/Splitter.js index e92cb2dd..6791e0d5 100755 --- a/js/panels/Splitter.js +++ b/js/panels/Splitter.js @@ -55,7 +55,7 @@ exports.Splitter = Montage.create(Component, { }, set: function(value) { this._collapsed = value; - + this.needsDraw = true; this.application.localStorage.setItem(this.element.getAttribute("data-montage-id"), {"version": this.version, "value": value}); } }, diff --git a/js/panels/resize-composer.js b/js/panels/resize-composer.js index 6e5e89f8..450dc7b6 100644 --- a/js/panels/resize-composer.js +++ b/js/panels/resize-composer.js @@ -9,6 +9,14 @@ var Composer = require("montage/ui/composer/composer").Composer; exports.ResizeComposer = Montage.create(Composer, { + xAxis: { + value: true + }, + + yAxis: { + value: true + }, + enabled : { enumerable: false, value: true @@ -104,8 +112,19 @@ exports.ResizeComposer = Montage.create(Composer, { captureMousemove: { value: function(e) { - this._deltaX = e.clientX - this._startX; - this._deltaY = e.clientY - this._startY; + + if (this.xAxis) { + this._deltaX = e.clientX - this._startX; + } + else { + this._deltaX = 0; + } + if (this.yAxis) { + this._deltaY = e.clientY - this._startY; + } + else { + this._deltaY = 0; + } this._executeEvent("resizeMove"); } }, -- cgit v1.2.3 From f2371c4a5a18a4dadb2e76f0275b90ac541e889d Mon Sep 17 00:00:00 2001 From: Nivesh Rajbhandari Date: Thu, 22 Mar 2012 21:20:44 -0700 Subject: Adding enabled/disabled support for PI's checkbox control. Signed-off-by: Nivesh Rajbhandari --- js/panels/properties.reel/sections/custom.reel/custom.js | 13 +++++++++++++ 1 file changed, 13 insertions(+) (limited to 'js/panels') diff --git a/js/panels/properties.reel/sections/custom.reel/custom.js b/js/panels/properties.reel/sections/custom.reel/custom.js index 703ef950..ac316907 100755 --- a/js/panels/properties.reel/sections/custom.reel/custom.js +++ b/js/panels/properties.reel/sections/custom.reel/custom.js @@ -328,6 +328,19 @@ exports.CustomSection = Montage.create(Component, { if (aField.value) obj.label = aField.value; if (aField.prop) obj.prop = aField.prop; + if (aField.enabled) { + if(aField.enabled.boundObject) { + // TODO - For now, always bind to this.controls[someProperty] + Object.defineBinding(obj, "enabled", { + boundObject: this.controls, + boundObjectPropertyPath: aField.enabled.boundProperty, + oneway: false + }); + } else { + obj.enabled = aField.enabled; + } + } + //Initiate onChange Events obj.addEventListener("change", this, false); -- cgit v1.2.3 From 72b0468221d599f64d563214573273607e38c993 Mon Sep 17 00:00:00 2001 From: Eric Guzman Date: Fri, 23 Mar 2012 12:00:07 -0700 Subject: Presets Panel - Add slide/fade out animation --- js/panels/presets/default-animation-presets.js | 48 ++++++++++++++++++++++++++ 1 file changed, 48 insertions(+) (limited to 'js/panels') diff --git a/js/panels/presets/default-animation-presets.js b/js/panels/presets/default-animation-presets.js index 2e656e86..0730c2ef 100644 --- a/js/panels/presets/default-animation-presets.js +++ b/js/panels/presets/default-animation-presets.js @@ -36,6 +36,54 @@ exports.animationPresets = { }] }] }] + }, { + "text": "3D Animations", + "children": [ + { + "text": "Slide Out with Fade", + "selectorBase": "slide-fade-out", + "rules" : [{ + "selectorSuffix" : "", + "styles" : { + "-webkit-animation-name": "slide-fade-out", + "-webkit-animation-duration": "5s", + "-webkit-animation-iteration-count": "infinite", + "-webkit-animation-direction": "normal", + "-webkit-animation-timing-function": "ease", + "-webkit-transform-style": "preserve-3d", + "-webkit-transform": "perspective(1000)", + "-webkit-animation-delay": "0s" + } + },{ + "isKeyFrameRule": true, + "keys" : [{ + "keyText": "0%", + "styles": { + "opacity": "0", + "-webkit-transform": "translate3d(0, 0, 0)" + } + }, { + "keyText": "10%", + "styles": { + "opacity": "1", + "-webkit-transform": "translate3d(0, 0, 0)" + } + }, { + "keyText": "86%", + "styles": { + "opacity": "1", + "-webkit-transform": "translate3d(0, 0, 0)" + + } + }, { + "keyText": "100%", + "styles": { + "opacity": "0", + "-webkit-transform": "translate3d(540px, 0, 0)" + } + }] + }] + }] }, { "text": "3D Animations", "children": [ -- cgit v1.2.3 From 14bf5e88417fbbc1bfd3823a278cd759ff8a0897 Mon Sep 17 00:00:00 2001 From: Eric Guzman Date: Fri, 23 Mar 2012 13:15:43 -0700 Subject: Presets - fixed preset group name ("2D") --- js/panels/presets/default-animation-presets.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'js/panels') diff --git a/js/panels/presets/default-animation-presets.js b/js/panels/presets/default-animation-presets.js index 0730c2ef..64f91ea6 100644 --- a/js/panels/presets/default-animation-presets.js +++ b/js/panels/presets/default-animation-presets.js @@ -37,7 +37,7 @@ exports.animationPresets = { }] }] }, { - "text": "3D Animations", + "text": "2D Animations", "children": [ { "text": "Slide Out with Fade", -- cgit v1.2.3 From 94a4be4b7b77f4c1498e8fb65e00d73ccbd56813 Mon Sep 17 00:00:00 2001 From: Armen Kesablyan Date: Fri, 23 Mar 2012 14:33:41 -0700 Subject: Resizers updated Signed-off-by: Armen Kesablyan --- js/panels/Timeline/TimelinePanel.reel/css/TimelinePanel.css | 4 ++-- js/panels/resize-composer.js | 13 +++++++------ 2 files changed, 9 insertions(+), 8 deletions(-) (limited to 'js/panels') diff --git a/js/panels/Timeline/TimelinePanel.reel/css/TimelinePanel.css b/js/panels/Timeline/TimelinePanel.reel/css/TimelinePanel.css index 129b9771..067285ae 100644 --- a/js/panels/Timeline/TimelinePanel.reel/css/TimelinePanel.css +++ b/js/panels/Timeline/TimelinePanel.reel/css/TimelinePanel.css @@ -10,12 +10,12 @@ height: 100%; } .maintimeline{ - border-style: double; -webkit-box-flex: 1; display: -webkit-box; - -webkit-box-orient: horizontal + -webkit-box-orient: horizontal; height : 100%; position: relative; + margin-top:1px; } .leftinside{ height: 100%; diff --git a/js/panels/resize-composer.js b/js/panels/resize-composer.js index 450dc7b6..0d1774cd 100644 --- a/js/panels/resize-composer.js +++ b/js/panels/resize-composer.js @@ -77,6 +77,7 @@ exports.ResizeComposer = Montage.create(Composer, { load: { value: function() { this.element.addEventListener("mousedown", this, true); + this.element.addEventListener("dblclick", this, true); } }, @@ -112,7 +113,6 @@ exports.ResizeComposer = Montage.create(Composer, { captureMousemove: { value: function(e) { - if (this.xAxis) { this._deltaX = e.clientX - this._startX; } @@ -129,12 +129,13 @@ exports.ResizeComposer = Montage.create(Composer, { } }, - deserializedFromTemplate: { - value: function() { - if (this.component) { - this.component.addComposer(this); - } + captureDblclick: { + value:function(e) { + this._reset(); + this._executeEvent("resizeReset"); } } + + }); \ No newline at end of file -- cgit v1.2.3 From 89e1bd46b03c38a8f95a87a0c95a127f149cfd86 Mon Sep 17 00:00:00 2001 From: Jose Antonio Marquez Date: Mon, 26 Mar 2012 13:36:41 -0700 Subject: Fix: IKNINJA-1362 --- js/panels/color/colorpopup-manager.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'js/panels') diff --git a/js/panels/color/colorpopup-manager.js b/js/panels/color/colorpopup-manager.js index a4c9a8c2..d6d94807 100755 --- a/js/panels/color/colorpopup-manager.js +++ b/js/panels/color/colorpopup-manager.js @@ -68,7 +68,7 @@ exports.ColorPopupManager = Montage.create(Component, { this.application.ninja.colorController.colorPopupManager.hideColorPopup(); }.bind(this)); // - document.addEventListener('click', function (e) { + document.addEventListener('mousedown', function (e) { // if (e._event.srcElement.id === 'stageCanvas' || e._event.srcElement.id === 'mainContainer' || e._event.srcElement.id === 'drawingCanvas') { this.application.ninja.colorController.colorPopupManager.hideColorPopup(); -- cgit v1.2.3