diff --git a/css/main.css b/css/main.css
index 320a3185cc235754b896f8826d62a4a21872364c..d6487f636c6fc04d4e80bf12fffecc26ff6c9c5a 100644
--- a/css/main.css
+++ b/css/main.css
@@ -413,7 +413,7 @@ label.colorSwatches>span.icons{
margin: 0 20px 0 -10px;
}
-.editComposite {
+.editComposite, .editMaterial {
margin-left:20px;
}
diff --git a/js/lattice/CompositeEditorLattice.js b/js/lattice/CompositeEditorLattice.js
index a3f9e4df7124a8b850efed93c29ead67814df968..b89c84c470aa242c7476089fb85ca0677451f76f 100644
--- a/js/lattice/CompositeEditorLattice.js
+++ b/js/lattice/CompositeEditorLattice.js
@@ -75,8 +75,7 @@ define(['underscore', 'backbone', 'appState', 'globals', 'plist', 'three', 'thre
},
deleteComposite: function(){
- var id = this.get("id");
- delete materials[id];//todo check if being used first
+ return materials.setMaterial(this.get("id"), null);
},
diff --git a/js/main.js b/js/main.js
index dc5028e242fe030b25eb2c04e1b5c3e3039470e5..4c47bc9622b49782e6309c53b8bb29cd458c39a1 100644
--- a/js/main.js
+++ b/js/main.js
@@ -110,6 +110,7 @@ require.config({
animateMenu: 'menus/AnimationMenuView',
sendMenu: 'menus/SendMenuView',
compositeMenu: 'menus/CompositeMenuView',
+ materialEditorMenu: 'menus/MaterialEditorMenuView',
setupCommMenu: 'menus/SetupCommMenuView',
discoveryMenu: 'menus/DiscoveryMenuView',
@@ -130,6 +131,7 @@ require.config({
animateMenuTemplate: 'menus/templates/AnimationMenuView.html',
sendMenuTemplate: 'menus/templates/SendMenuView.html',
compositeMenuTemplate: 'menus/templates/CompositeMenuView.html',
+ materialEditorMenuTemplate: 'menus/templates/MaterialEditorMenuView.html',
setupCommMenuTemplate: 'menus/templates/SetupCommMenuView.html',
discoveryMenuTemplate: 'menus/templates/DiscoveryMenuView.html',
diff --git a/js/materials/DMAMaterials.js b/js/materials/DMAMaterials.js
index b55e9d06cafb50b515d37bb0e61d635d5d05b079..5314cc344d6adc0c635b0b25c17830b89e3262dc 100644
--- a/js/materials/DMAMaterials.js
+++ b/js/materials/DMAMaterials.js
@@ -11,13 +11,20 @@ define(['underscore', 'three', 'appState', 'lattice', 'plist', 'threeModel'], fu
threeMaterial:new THREE.MeshLambertMaterial({color:"#ff0000", shading:THREE.FlatShading})
},
setMaterial: function(id, data){
+ if (id && data === null) return deleteMaterial(id);
if (!materials[id]) materials[id] = {};
var oldColor = materials[id].color;
_.extend(materials[id], data);//todo trigger change on all instances
if (materials[id].threeMaterial || oldColor != materials[id].color) changeSingleMaterialColorScheme(id);
+ return false;
}
};
+ function deleteMaterial(id){
+ delete materials[id];//todo check if being used first
+ return true;
+ }
+
var listener = {};
_.extend(listener, Backbone.Events);
diff --git a/js/menus/CompositeMenuView.js b/js/menus/CompositeMenuView.js
index bafc8fea7454e8b26c18a9206fdbe504048eb797..7f7867d3006c864d2dc511995fee8a35d332eead 100644
--- a/js/menus/CompositeMenuView.js
+++ b/js/menus/CompositeMenuView.js
@@ -32,10 +32,7 @@ define(['jquery', 'underscore', 'menuParent', 'plist', 'lattice', 'globals', 'ma
dimensions = lattice.compositeEditor.calculateBoundingBox();
},
- getPropertyOwner: function($target){
- if ($target.hasClass("compositeEditor")) return lattice.compositeEditor;
- return null;
- },
+
_changeRandomColor: function(e){
e.preventDefault();
diff --git a/js/menus/MaterialEditorMenuView.js b/js/menus/MaterialEditorMenuView.js
new file mode 100644
index 0000000000000000000000000000000000000000..8ad5e68d00b628c67f60da5873fd7b5c80bb9a4c
--- /dev/null
+++ b/js/menus/MaterialEditorMenuView.js
@@ -0,0 +1,29 @@
+/**
+ * Created by aghassaei on 6/24/15.
+ */
+
+
+define(['jquery', 'underscore', 'menuParent', 'plist', 'materials', 'text!materialEditorMenuTemplate'],
+ function($, _, MenuParentView, plist, materials, template){
+
+ return MenuParentView.extend({
+
+ events: {
+ "click #cancelMaterial": "_exit"
+ },
+
+ _initialize: function(){
+ //bind events
+ },
+
+ _exit: function(){
+ this.model.set("currentNav", "navDesign");
+ },
+
+ _makeTemplateJSON: function(){
+ return _.extend(plist, {name:"name", color:"#ffff00", altColor:"#00ffff"});
+ },
+
+ template: _.template(template)
+ });
+});
\ No newline at end of file
diff --git a/js/menus/MaterialMenuView.js b/js/menus/MaterialMenuView.js
index 99a90d744b3f86089b081a5a550655e8b3ead4dd..ffc17fb5ebff1e648b720686fb0df28f3a372e9f 100644
--- a/js/menus/MaterialMenuView.js
+++ b/js/menus/MaterialMenuView.js
@@ -10,7 +10,8 @@ define(['jquery', 'underscore', 'menuParent', 'plist', 'lattice', 'globals', 'ma
events: {
"click #navToCompositeMenu": "_navToCompositeMenu",
"click #compositeFromLattice": "_latticeToComposite",
- "click .editComposite": "_editComposite"
+ "click .editComposite": "_editComposite",
+ "click .editMaterial": "_editMaterial"
},
_initialize: function(){
@@ -31,6 +32,15 @@ define(['jquery', 'underscore', 'menuParent', 'plist', 'lattice', 'globals', 'ma
lattice.setToCompositeMode(id, materials[id]);
},
+ _editMaterial: function(e){
+ e.stopPropagation();
+ e.preventDefault();
+ var id = $(e.target).data("id");
+ this.model.set("currentTab", "materialEditor", {silent:true});
+ this.model.set("currentNav", "navMaterial");
+ },
+
+
_latticeToComposite: function(e){
lattice.setToCompositeMode(null, lattice.getCompositeData());
lattice.clearCells();
diff --git a/js/menus/templates/MaterialEditorMenuView.html b/js/menus/templates/MaterialEditorMenuView.html
new file mode 100644
index 0000000000000000000000000000000000000000..a2ca68fb57adb23a9ec81c8516162baafe84979b
--- /dev/null
+++ b/js/menus/templates/MaterialEditorMenuView.html
@@ -0,0 +1,12 @@
+<a href="#" class="btn btn-halfWidth btn-lg btn-default importJSON">Load Material</a>
+<a id="saveMaterial" href="#" class="btn btn-halfWidth btn-lg pull-right btn-default">Save Material</a><br/><br/>
+Name: <input id="materialName" data-property="name" value="<%= name %>" placeholder="Enter Name" class="seventyFiveWidth form-control textInput materialEditor" type="text"><br/><br/>
+Display Color:
+ <input id="materialColor" style="border-color: <%= altColor %> ;" data-property="altColor" value="<%= color %>" placeholder="Enter HEX" class="halfWidth materialEditor form-control hexInput" type="text"><br/><br/>
+<a id="newRandomColor" href="#" class="btn btn-block btn-lg btn-default">New Random Display Color</a><br/>
+Realistic Color:
+ <input id="materialAltColor" style="border-color: <%= color %> ;" data-property="color" value="<%= color %>" placeholder="Enter HEX" class="halfWidth materialEditor form-control hexInput" type="text"><br/><br/>
+Material Properties:<br/><br/>add properties here<br/><br/>
+<a id="finishMaterial" href="#" class="btn btn-block btn-lg btn-success">Save Material</a><br/>
+<a id="cancelMaterial" href="#" class="btn btn-halfWidth btn-lg btn-default">Cancel / Exit</a>
+<a id="deleteMaterial" href="#" class="btn btn-halfWidth pull-right btn-lg btn-default"><span class="fui-trash"></span> Delete</a><br/>
\ No newline at end of file
diff --git a/js/menus/templates/MaterialMenuView.html b/js/menus/templates/MaterialMenuView.html
index 7041cbcf7039b2a9240b72ac43e400a6a5defb17..92ccacb33a1a0f79bd9c89f0a3f16a6a89af4ca6 100644
--- a/js/menus/templates/MaterialMenuView.html
+++ b/js/menus/templates/MaterialMenuView.html
@@ -14,7 +14,7 @@ Material Class:
<input type="radio" <%if (key == materialType){ %>checked<%}%> name="materialType" value="<%= key %>" data-toggle="radio" class="custom-radio appState"><span class="icons"><span class="icon-unchecked"></span><span class="icon-checked"></span></span>
<div class="materialColorSwatch">
<div style="background-color:<% if(realisticColorScheme){ %><%= allMaterials[materialClass][key].color %><% }else{ %><%= allMaterials[materialClass][key].altColor %><% } %>"></div>
- <span><%= allMaterials[materialClass][key].name %></span></div>
+ <span><%= allMaterials[materialClass][key].name %><a data-id="<%= key %>" class="editMaterial">Settings...</a></span></div>
</label>
<% }); %><br/>
<label class="checkbox" for="realisticColorScheme">
@@ -32,7 +32,7 @@ Composite Materials:<br/>
<input type="radio" <%if (key == materialType){ %>checked<%}%> name="materialType" value="<%= key %>" data-toggle="radio" class="custom-radio appState"><span class="icons"><span class="icon-unchecked"></span><span class="icon-checked"></span></span>
<div class="materialColorSwatch">
<div style="background-color:<% if(realisticColorScheme){ %><%= materials[key].color %><% }else{ %><%= materials[key].altColor %><% } %>"></div>
- <span><%= materials[key].name %><a data-id="<%= key %>" class="editComposite">Settings...<a/></span></div>
+ <span><%= materials[key].name %><a data-id="<%= key %>" class="editComposite">Settings...</a></span></div>
</label>
<% }); %><br/>
<% if (_.filter(_.keys(materials), function(name){return name.substr(0,5) == "super"; }).length > 0) { %>
diff --git a/js/models/PList.js b/js/models/PList.js
index 6ac5e700d3f687c88d3378e4dfc562ade18ee45d..8239164f2c0ad0d1daf367687474303a0f8ae436 100644
--- a/js/models/PList.js
+++ b/js/models/PList.js
@@ -30,6 +30,9 @@ define(['three'], function(THREE){
navComm:{
setupComm: "Setup",
send: "Send"
+ },
+ navMaterial:{
+ materialEditor: "Material Editor"
}
},