diff options
author | Valerio Virgillito | 2012-07-09 12:15:26 -0700 |
---|---|---|
committer | Valerio Virgillito | 2012-07-09 12:15:26 -0700 |
commit | 1839f24e8dcbad38d1381bbcd65c17a9caa45987 (patch) | |
tree | 516a29ca99d4aae0d5228223fff438c1a3c4e0d3 /js/panels | |
parent | aedd14b18695d031f695d27dfbd94df5614495bb (diff) | |
parent | febfdb18042d1c73ac58ee4e35c5f176428dee00 (diff) | |
download | ninja-1839f24e8dcbad38d1381bbcd65c17a9caa45987.tar.gz |
Merge pull request #346 from mqg734/MaterialsUI
UI support for preview, edit, duplicate and delete of WebGL Materials.
Diffstat (limited to 'js/panels')
7 files changed, 388 insertions, 281 deletions
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 @@ | |||
101 | "id" : "Z-Invert" | 101 | "id" : "Z-Invert" |
102 | } | 102 | } |
103 | ] | 103 | ] |
104 | }, | ||
105 | { | ||
106 | "label": "Custom Materials", | ||
107 | "children": [ | ||
108 | ] | ||
104 | } | 109 | } |
105 | ] | 110 | ] |
106 | } \ No newline at end of file | 111 | } \ 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 d73134ae..39294779 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 | |||
@@ -39,6 +39,12 @@ POSSIBILITY OF SUCH DAMAGE. | |||
39 | margin: 4px 0 4px 0; | 39 | margin: 4px 0 4px 0; |
40 | } | 40 | } |
41 | 41 | ||
42 | .materials_library_panel .ml_tree_holder { | ||
43 | height: 200px; | ||
44 | min-height: 200px; | ||
45 | max-height: 200px; | ||
46 | overflow-y: scroll; | ||
47 | } | ||
42 | 48 | ||
43 | .ml_buttons { | 49 | .ml_buttons { |
44 | clear:both; | 50 | clear:both; |
@@ -54,9 +60,19 @@ POSSIBILITY OF SUCH DAMAGE. | |||
54 | cursor: pointer; | 60 | cursor: pointer; |
55 | margin: 0 1px; | 61 | margin: 0 1px; |
56 | float: left; | 62 | float: left; |
63 | width: 40px; | ||
64 | } | ||
65 | |||
66 | .ml_buttons .ml_duplicate_btn { | ||
57 | width: 60px; | 67 | width: 60px; |
58 | } | 68 | } |
59 | 69 | ||
60 | .ml_buttons .nj-skinned:last-child { | 70 | .ml_buttons .ml_delete_btn { |
71 | width: 50px; | ||
61 | float: right; | 72 | float: right; |
62 | } | 73 | } |
74 | |||
75 | .ml_buttons .nj-skinned:hover, | ||
76 | .ml_buttons .nj-skinned:active { | ||
77 | color: white; | ||
78 | } \ 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 f77d3186..e9a2d20d 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 | |||
@@ -34,12 +34,12 @@ POSSIBILITY OF SUCH DAMAGE. | |||
34 | <link rel="stylesheet" type="text/css" href="materials-library-panel.css"> | 34 | <link rel="stylesheet" type="text/css" href="materials-library-panel.css"> |
35 | <script type="text/montage-serialization"> | 35 | <script type="text/montage-serialization"> |
36 | { | 36 | { |
37 | "addButton": { | 37 | "duplicateButton": { |
38 | "prototype": "montage/ui/button.reel", | 38 | "prototype": "montage/ui/button.reel", |
39 | "properties": { | 39 | "properties": { |
40 | "element": {"#": "ml_add_btn"}, | 40 | "element": {"#": "ml_duplicate_btn"}, |
41 | "enabled": false | 41 | "enabled": true |
42 | }, | 42 | }, |
43 | "listeners": [ | 43 | "listeners": [ |
44 | { | 44 | { |
45 | "type": "action", | 45 | "type": "action", |
@@ -47,11 +47,10 @@ POSSIBILITY OF SUCH DAMAGE. | |||
47 | } | 47 | } |
48 | ] | 48 | ] |
49 | }, | 49 | }, |
50 | "copyButton": { | 50 | "editButton": { |
51 | "prototype": "montage/ui/button.reel", | 51 | "prototype": "montage/ui/button.reel", |
52 | "properties": { | 52 | "properties": { |
53 | "element": {"#": "ml_copy_btn"}, | 53 | "element": {"#": "ml_edit_btn"} |
54 | "enabled": false | ||
55 | }, | 54 | }, |
56 | "listeners": [ | 55 | "listeners": [ |
57 | { | 56 | { |
@@ -106,7 +105,9 @@ POSSIBILITY OF SUCH DAMAGE. | |||
106 | "prototype": "js/panels/Materials/materials-library-panel.reel[MaterialsLibraryPanels]", | 105 | "prototype": "js/panels/Materials/materials-library-panel.reel[MaterialsLibraryPanels]", |
107 | "properties": { | 106 | "properties": { |
108 | "element": {"#": "materials_library_panel"}, | 107 | "element": {"#": "materials_library_panel"}, |
109 | "_materialInfo": {"@": "materialInfo"} | 108 | "_materialInfo": {"@": "materialInfo"}, |
109 | "materialsController": {"@": "materialsController"}, | ||
110 | "deleteButton": {"@": "deleteButton"} | ||
110 | } | 111 | } |
111 | } | 112 | } |
112 | } | 113 | } |
@@ -116,14 +117,14 @@ POSSIBILITY OF SUCH DAMAGE. | |||
116 | <body> | 117 | <body> |
117 | 118 | ||
118 | <div data-montage-id="materials_library_panel" class="materials_library_panel"> | 119 | <div data-montage-id="materials_library_panel" class="materials_library_panel"> |
119 | <section data-montage-id="ml_tree_holder" class="animationsLibrary"> | 120 | <section data-montage-id="ml_tree_holder" class="ml_tree_holder"> |
120 | <div data-montage-id="materials_library_tree"></div> | 121 | <div data-montage-id="materials_library_tree"></div> |
121 | </section> | 122 | </section> |
122 | <hr /> | 123 | <hr /> |
123 | <div data-montage-id="ml_buttons" class="ml_buttons"> | 124 | <div data-montage-id="ml_buttons" class="ml_buttons"> |
124 | <button data-montage-id="ml_add_btn" class="nj-skinned">Add</button> | 125 | <button data-montage-id="ml_duplicate_btn" class="nj-skinned ml_duplicate_btn">Duplicate</button> |
125 | <button data-montage-id="ml_copy_btn" class="nj-skinned">Copy</button> | 126 | <button data-montage-id="ml_edit_btn" class="nj-skinned ml_edit_btn">Edit</button> |
126 | <button data-montage-id="ml_delete_btn" class="nj-skinned">Delete</button> | 127 | <button data-montage-id="ml_delete_btn" class="nj-skinned ml_delete_btn">Delete</button> |
127 | </div> | 128 | </div> |
128 | </div> | 129 | </div> |
129 | 130 | ||
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..d6df8229 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 | |||
@@ -31,14 +31,36 @@ POSSIBILITY OF SUCH DAMAGE. | |||
31 | var Montage = require("montage/core/core").Montage, | 31 | var Montage = require("montage/core/core").Montage, |
32 | Component = require("montage/ui/component").Component, | 32 | Component = require("montage/ui/component").Component, |
33 | MaterialsData = require("js/panels/Materials/materials-data.json"), | 33 | MaterialsData = require("js/panels/Materials/materials-data.json"), |
34 | Popup = require("montage/ui/popup/popup.reel").Popup; | 34 | Popup = require("montage/ui/popup/popup.reel").Popup, |
35 | MaterialsModel = require("js/models/materials-model").MaterialsModel, | ||
36 | LeafNode = require("js/components/treeview/ninja-leaf.reel").Leaf; | ||
35 | 37 | ||
36 | exports.MaterialsLibraryPanel = Montage.create(Component, { | 38 | exports.MaterialsLibraryPanel = Montage.create(Component, { |
37 | 39 | ||
40 | deleteButton: { | ||
41 | value: null | ||
42 | }, | ||
43 | |||
38 | materialsData: { | 44 | materialsData: { |
39 | value: null | 45 | value: null |
40 | }, | 46 | }, |
41 | 47 | ||
48 | materialId: { | ||
49 | value: null | ||
50 | }, | ||
51 | |||
52 | selectedMaterialNode: { | ||
53 | value: null | ||
54 | }, | ||
55 | |||
56 | customMaterialsBranch: { | ||
57 | value: null | ||
58 | }, | ||
59 | |||
60 | customMaterialsCounter: { | ||
61 | value: 2 | ||
62 | }, | ||
63 | |||
42 | _hasFocus: { | 64 | _hasFocus: { |
43 | enumerable: false, | 65 | enumerable: false, |
44 | value: false | 66 | value: false |
@@ -60,21 +82,32 @@ exports.MaterialsLibraryPanel = Montage.create(Component, { | |||
60 | value:function(event) { | 82 | value:function(event) { |
61 | switch(event._currentTarget.label) | 83 | switch(event._currentTarget.label) |
62 | { | 84 | { |