From 978b9049d057d2a0995758275f68da8641193201 Mon Sep 17 00:00:00 2001 From: Nivesh Rajbhandari Date: Wed, 27 Jun 2012 14:21:27 -0700 Subject: Integrating Materials UI changes. Squashed commit of the following: commit 89ccb55130e67c4516e616ccc56d2a649a2b9160 Author: Nivesh Rajbhandari Date: Wed Jun 27 14:20:01 2012 -0700 Position Materials Editor popup and change buttons' text color. Signed-off-by: Nivesh Rajbhandari commit 89bca82adc781f4913f8d302a49a8baa907631c5 Author: Nivesh Rajbhandari Date: Wed Jun 27 12:00:51 2012 -0700 Support deleting and editing custom materials. Signed-off-by: Nivesh Rajbhandari commit 5be5160c4786beb70e8ad4d75562adb135718c6c Merge: 1d9d9f6 2ebf3e3 Author: Nivesh Rajbhandari Date: Wed Jun 27 11:11:37 2012 -0700 Merge branch 'refs/heads/ninja-internal' into WebGLMaterials Conflicts: js/data/panels-data.js Signed-off-by: Nivesh Rajbhandari commit 1d9d9f6e66ea7585f07ed461cebba99e71f65de0 Author: Nivesh Rajbhandari Date: Tue Jun 26 22:01:22 2012 -0700 "Save as" support to duplicate material with modified settings. Also removed Add button and disabled Reset button for now. Signed-off-by: Nivesh Rajbhandari commit bf1037508dbc686f2884765344832f906cbf06d0 Author: Nivesh Rajbhandari Date: Tue Jun 26 17:23:31 2012 -0700 Added UI for duplicating and deleting materials in the Materials Library. Signed-off-by: Nivesh Rajbhandari commit 54930792f9c417df5f739831164aa1f96a41d67a Author: Nivesh Rajbhandari Date: Tue Jun 26 14:29:17 2012 -0700 Added preview of material in materials editor popup and fixed some styling. Signed-off-by: Nivesh Rajbhandari Signed-off-by: Nivesh Rajbhandari --- js/panels/Materials/materials-data.json | 5 + .../materials-library-panel.css | 18 +- .../materials-library-panel.html | 25 +- .../materials-library-panel.js | 109 ++++++- .../materials-popup.reel/materials-popup.css | 36 ++- .../materials-popup.reel/materials-popup.html | 26 +- .../materials-popup.reel/materials-popup.js | 333 +++++++-------------- 7 files changed, 297 insertions(+), 255 deletions(-) (limited to 'js/panels') diff --git a/js/panels/Materials/materials-data.json b/js/panels/Materials/materials-data.json index a5d8997b..fde82d3d 100644 --- a/js/panels/Materials/materials-data.json +++ b/js/panels/Materials/materials-data.json @@ -101,6 +101,11 @@ "id" : "Z-Invert" } ] + }, + { + "label": "Custom Materials", + "children": [ + ] } ] } \ No newline at end of file diff --git a/js/panels/Materials/materials-library-panel.reel/materials-library-panel.css b/js/panels/Materials/materials-library-panel.reel/materials-library-panel.css index bed3acfe..b5d36108 100755 --- a/js/panels/Materials/materials-library-panel.reel/materials-library-panel.css +++ b/js/panels/Materials/materials-library-panel.reel/materials-library-panel.css @@ -15,6 +15,12 @@ margin: 4px 0 4px 0; } +.materials_library_panel .ml_tree_holder { + height: 200px; + min-height: 200px; + max-height: 200px; + overflow-y: scroll; +} .ml_buttons { clear:both; @@ -30,9 +36,19 @@ cursor: pointer; margin: 0 1px; float: left; + width: 40px; +} + +.ml_buttons .ml_duplicate_btn { width: 60px; } -.ml_buttons .nj-skinned:last-child { +.ml_buttons .ml_delete_btn { + width: 50px; float: right; +} + +.ml_buttons .nj-skinned:hover, +.ml_buttons .nj-skinned:active { + color: white; } \ No newline at end of file diff --git a/js/panels/Materials/materials-library-panel.reel/materials-library-panel.html b/js/panels/Materials/materials-library-panel.reel/materials-library-panel.html index 6fa54495..3adb2108 100755 --- a/js/panels/Materials/materials-library-panel.reel/materials-library-panel.html +++ b/js/panels/Materials/materials-library-panel.reel/materials-library-panel.html @@ -10,12 +10,12 @@ - + } + +
- -

-
- Stylesheets -

+ +

+
+ Stylesheets +

-
    +
      +
      + -
      - Add Rule -
      - -

      -
      - Styles - - 0 elements selected - -

      -
      + +

      +
      + Styles + + 0 elements selected + +

      +
      - + +
      + -
      diff --git a/js/panels/CSSPanel/ComputedStyleSubPanel.reel/ComputedStyleSubPanel.html b/js/panels/CSSPanel/ComputedStyleSubPanel.reel/ComputedStyleSubPanel.html index a65fd32f..3298ece5 100755 --- a/js/panels/CSSPanel/ComputedStyleSubPanel.reel/ComputedStyleSubPanel.html +++ b/js/panels/CSSPanel/ComputedStyleSubPanel.reel/ComputedStyleSubPanel.html @@ -30,9 +30,9 @@ POSSIBILITY OF SUCH DAMAGE. --> - - ComputedStyleSubPanel - + + ComputedStyleSubPanel + + } + -
      -
      - - -
      -
      -
      -
      -
      +
      +
      + + +
      +
      +
      +
      +
      diff --git a/js/panels/Materials/MaterialsPanel.js b/js/panels/Materials/MaterialsPanel.js index 9d7f447a..4291f39b 100755 --- a/js/panels/Materials/MaterialsPanel.js +++ b/js/panels/Materials/MaterialsPanel.js @@ -29,8 +29,8 @@ POSSIBILITY OF SUCH DAMAGE. */ var Montage = require("montage/core/core").Montage, - PanelBase = require("js/panels/PanelBase").PanelBase, - MaterialsLibraryPanel = require("js/panels/Materials/materials-library-panel.reel").MaterialsLibraryPanel; + PanelBase = require("js/panels/PanelBase").PanelBase, + MaterialsLibraryPanel = require("js/panels/Materials/materials-library-panel.reel").MaterialsLibraryPanel; exports.MaterialsPanel = Montage.create(PanelBase, { id : {value : "materialsPanel", writable:true, enumerable:true, configurable:true}, diff --git a/js/panels/Materials/materials-library-panel.reel/materials-library-panel.html b/js/panels/Materials/materials-library-panel.reel/materials-library-panel.html index f77d3186..3204ce50 100755 --- a/js/panels/Materials/materials-library-panel.reel/materials-library-panel.html +++ b/js/panels/Materials/materials-library-panel.reel/materials-library-panel.html @@ -29,16 +29,16 @@ ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. --> - - - + + + - - - + } + + + + -
      +
      @@ -125,7 +125,7 @@ POSSIBILITY OF SUCH DAMAGE.
      -
      + diff --git a/js/panels/Materials/materials-library-panel.reel/materials-library-panel.js b/js/panels/Materials/materials-library-panel.reel/materials-library-panel.js index b5d6bb96..1cf3cec7 100755 --- a/js/panels/Materials/materials-library-panel.reel/materials-library-panel.js +++ b/js/panels/Materials/materials-library-panel.reel/materials-library-panel.js @@ -40,8 +40,8 @@ exports.MaterialsLibraryPanel = Montage.create(Component, { }, _hasFocus: { - enumerable: false, - value: false + enumerable: false, + value: false }, didCreate: { @@ -98,10 +98,10 @@ exports.MaterialsLibraryPanel = Montage.create(Component, { }, _showMaterialPopup: { - enumerable: false, - value: function (materialObj) { + enumerable: false, + value: function (materialObj) { - if(!this._materialPopup) + if(!this._materialPopup) { this._materialPopup = Popup.create(); this._materialPopup.content = this._materialInfo; @@ -113,15 +113,15 @@ exports.MaterialsLibraryPanel = Montage.create(Component, { materialID = materialObj.materialId; this._materialInfo.loadMaterials(materialID, materialObj.useSelection, materialObj.whichMaterial); - } + } }, handleHideMaterialPopup: { - enumerable: false, - value: function (event) { + enumerable: false, + value: function (event) { if(this._materialPopup){ this._materialPopup.hide(); } - } + } } }); diff --git a/js/panels/Materials/materials-popup.reel/materials-popup.css b/js/panels/Materials/materials-popup.reel/materials-popup.css index a5362615..3ddc8a98 100755 --- a/js/panels/Materials/materials-popup.reel/materials-popup.css +++ b/js/panels/Materials/materials-popup.reel/materials-popup.css @@ -105,8 +105,8 @@ POSSIBILITY OF SUCH DAMAGE. .mp_properties_list > .mp_property > .colortoolbar { - width: 27px !important; - height: 27px !important; + width: 27px !important; + height: 27px !important; overflow:hidden !important; margin-top: -6px; } diff --git a/js/panels/Materials/materials-popup.reel/materials-popup.html b/js/panels/Materials/materials-popup.reel/materials-popup.html index b377fa2d..eb2433e3 100755 --- a/js/panels/Materials/materials-popup.reel/materials-popup.html +++ b/js/panels/Materials/materials-popup.reel/materials-popup.html @@ -29,13 +29,13 @@ ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. --> - + - + - + - - + - -
      + +
      Material Name

      -
      Preview Pane
      +
      Preview Pane

      @@ -125,6 +125,6 @@ POSSIBILITY OF SUCH DAMAGE.
      -
      - +
      + diff --git a/js/panels/Materials/materials-popup.reel/materials-popup.js b/js/panels/Materials/materials-popup.reel/materials-popup.js index 7c5493c6..cecb0a71 100755 --- a/js/panels/Materials/materials-popup.reel/materials-popup.js +++ b/js/panels/Materials/materials-popup.reel/materials-popup.js @@ -51,26 +51,26 @@ exports.MaterialsPopup = Montage.create(Component, { serializable: true }, - // Material Properties + // Material Properties _materialName: { enumerable: true, value: "" }, - _useSelection: { value: false, enumerable: true }, - _whichMaterial: { value: "fill", enumerable: true }, - _originalValues: {value: null, enumerable: true }, - - captureAction: { - value:function(event) { - switch(event._currentTarget.label) - { - case "Cancel": - console.log("Cancel material edit"); - this.revertToOriginalValues(); - break; - case "OK": - console.log("Committing material with the following values:"); + _useSelection: { value: false, enumerable: true }, + _whichMaterial: { value: "fill", enumerable: true }, + _originalValues: {value: null, enumerable: true }, + + captureAction: { + value:function(event) { + switch(event._currentTarget.label) + { + case "Cancel": + console.log("Cancel material edit"); + this.revertToOriginalValues(); + break; + case "OK": + console.log("Committing material with the following values:"); for(var i=0, len=this.materialsProperties.childComponents.length; i< len; i++) { var childControl = this.materialsProperties.childComponents[i]; @@ -88,53 +88,53 @@ exports.MaterialsPopup = Montage.create(Component, { console.log("--------------"); } - break; - } + break; + } // Notify Materials Library to close popup NJevent("hideMaterialPopup"); - } - }, - - revertToOriginalValues: - { - value: function() - { - if (this._originalValues) - { - this._material.importJSON( this._originalValues ); - - if (this._useSelection) - { - var selection = this.application.ninja.selectedElements; - if (selection && (selection.length > 0)) - { - var nObjs = selection.length; - for (var iObj=0; iObj