From fdeed8051c3af538d28ca3bc599121cea483c22c Mon Sep 17 00:00:00 2001 From: Valerio Virgillito Date: Thu, 22 Mar 2012 15:47:56 -0700 Subject: Squashed commit of the following GL integration Signed-off-by: Valerio Virgillito --- .../ui/tree-basic/treeItem.reel/treeItem.js | 35 ++- js/controllers/selection-controller.js | 9 + js/document/html-document.js | 108 +++++--- js/helper-classes/RDGE/rdge-compiled.js | 6 +- js/helper-classes/RDGE/src/core/script/engine.js | 7 +- js/io/system/ninjalibrary.json | 2 +- js/lib/drawing/world.js | 147 ++++++++++ js/lib/geom/circle.js | 54 +++- js/lib/geom/geom-obj.js | 154 ++++++++--- js/lib/geom/line.js | 44 ++- js/lib/geom/rectangle.js | 63 ++++- js/lib/rdge/materials/bump-metal-material.js | 40 +++ js/lib/rdge/materials/cloud-material.js | 300 +++++++++++++++++++++ js/lib/rdge/materials/flat-material.js | 21 ++ js/lib/rdge/materials/julia-material.js | 6 +- js/lib/rdge/materials/linear-gradient-material.js | 53 ++++ js/lib/rdge/materials/mandel-material.js | 6 +- js/lib/rdge/materials/plasma-material.js | 18 ++ js/lib/rdge/materials/pulse-material.js | 44 ++- js/lib/rdge/materials/radial-blur-material.js | 57 +++- js/lib/rdge/materials/radial-gradient-material.js | 54 +++- js/lib/rdge/materials/taper-material.js | 27 ++ js/lib/rdge/materials/twist-vert-material.js | 28 ++ js/lib/rdge/materials/uber-material.js | 180 ++++++++++++- js/lib/rdge/materials/water-material.js | 103 +++++++ js/models/materials-model.js | 90 +++++-- 26 files changed, 1503 insertions(+), 153 deletions(-) create mode 100644 js/lib/rdge/materials/cloud-material.js (limited to 'js') diff --git a/js/components/ui/tree-basic/treeItem.reel/treeItem.js b/js/components/ui/tree-basic/treeItem.reel/treeItem.js index a67dad43..13e278e9 100755 --- a/js/components/ui/tree-basic/treeItem.reel/treeItem.js +++ b/js/components/ui/tree-basic/treeItem.reel/treeItem.js @@ -107,8 +107,8 @@ exports.TreeItem = Montage.create(Component, { //icon or text click sends selection event var contentEls = this.element.querySelectorAll(".atreeItemContent"); for(var i=0;i" + "Modified date: "+ this.formatTimestamp(this.treeItemData.modifiedDate);} if((this.treeItemData.type === "directory") && (this.expandAfterDraw === true)){ - this.toggleContent(this.treeArrow); + this.expand(this.treeArrow); } if(this.treeItemData.uri === this.highlightedUri){ this.itemName.classList.add("selected"); @@ -171,6 +171,35 @@ exports.TreeItem = Montage.create(Component, { } }, + expand:{ + writable:false, + enumerable:true, + value:function(el){ + //if children already drawn then just hide/show + if(this.element.getElementsByTagName("ul").length > 0){ + var theParent = this.element.getElementsByTagName("ul")[0].parentNode; + if(theParent.classList.contains("hideTree")){//collapsed + theParent.classList.remove("hideTree");//expand + el.innerHTML = "▼"; + } + } + //else send event to draw the children + else{ + var treeClickEvent = document.createEvent("Events"); + treeClickEvent.initEvent("drawTree", false, false); + treeClickEvent.uri = this.treeItemData.uri; + treeClickEvent.uriType = this.treeItemData.type; + var divEl = document.createElement("div"); + this.element.appendChild(divEl); + treeClickEvent.subTreeContainer = divEl; + this.element.dispatchEvent(treeClickEvent); + + el.innerHTML = "▼"; + } + } + }, + + /** * Event Listeners */ diff --git a/js/controllers/selection-controller.js b/js/controllers/selection-controller.js index 9b0e638a..53cca029 100755 --- a/js/controllers/selection-controller.js +++ b/js/controllers/selection-controller.js @@ -112,6 +112,15 @@ exports.SelectionController = Montage.create(Component, { if(!this._isDocument) { if(this.findSelectedElement(event.detail) !== -1) { this.executeSelectElement(); + var element = event.detail; + if (element) { + if (element.elementModel) { + if (element.elementModel.shapeModel) { + if (element.elementModel.shapeModel.GLWorld) + element.elementModel.shapeModel.GLWorld.clearTree(); + } + } + } } } } diff --git a/js/document/html-document.js b/js/document/html-document.js index be1f89e2..aa57d848 100755 --- a/js/document/html-document.js +++ b/js/document/html-document.js @@ -9,7 +9,8 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot var Montage = require("montage/core/core").Montage, TextDocument = require("js/document/text-document").TextDocument, NJUtils = require("js/lib/NJUtils").NJUtils, - GLWorld = require("js/lib/drawing/world").World; + GLWorld = require("js/lib/drawing/world").World, + MaterialsModel = require("js/models/materials-model").MaterialsModel; //////////////////////////////////////////////////////////////////////// // exports.HTMLDocument = Montage.create(TextDocument, { @@ -193,12 +194,9 @@ exports.HTMLDocument = Montage.create(TextDocument, { var elt = this.iframe.contentWindow.document.getElementById("UserContent"); // if (elt) { - this._glData = []; - //if (path) { - //this.collectGLData(elt, this._glData, path); - //} else { - this.collectGLData(elt, this._glData ); - //} + var matLib = MaterialsModel.exportMaterials(); + this._glData = [matLib]; + this.collectGLData(elt, this._glData ); } else { this._glData = null } @@ -219,29 +217,74 @@ exports.HTMLDocument = Montage.create(TextDocument, { */ // /* + // get the data for the next canvas var importStr = value[i]; - var startIndex = importStr.indexOf( "id: " ); - if (startIndex >= 0) { - var endIndex = importStr.indexOf( "\n", startIndex ); - if (endIndex > 0) { - var id = importStr.substring( startIndex+4, endIndex ); - if (id) { - var canvas = this.findCanvasWithID( id, elt ); - if (canvas) { - if (!canvas.elementModel) { - NJUtils.makeElementModel(canvas, "Canvas", "shape", true); - } - if (canvas.elementModel) { - if (canvas.elementModel.shapeModel.GLWorld) { - canvas.elementModel.shapeModel.GLWorld.clearTree(); - } - var index = importStr.indexOf( "webGL: " ); - var useWebGL = (index >= 0) - var world = new GLWorld( canvas, useWebGL ); - world.import( importStr ); - this.buildShapeModel( canvas.elementModel, world ); - } + + // determine if it is the new (JSON) or old style format + var id = null; + var jObj = null; + var index = importStr.indexOf( ';' ); + if ((importStr[0] === 'v') && (index < 24)) + { + // JSON format. pull off the + importStr = importStr.substr( index+1 ); + jObj = jObj = JSON.parse( importStr ); + id = jObj.id; + } + else + { + // at this point the data could be either the materials library or + // an old style world. We can determine which by converting the string + // to an object via JSON.parse. That operation will fail if the string + // is an old style world. + var matLibStr = 'materialLibrary;'; + index = importStr.indexOf( matLibStr ); + if (index == 0) + { + importStr = importStr.substr( matLibStr.length ); + var matLibObj = JSON.parse( importStr ); + MaterialsModel.importMaterials( matLibObj ); + } + else + { + var startIndex = importStr.indexOf( "id: " ); + if (startIndex >= 0) { + var endIndex = importStr.indexOf( "\n", startIndex ); + if (endIndex > 0) + id = importStr.substring( startIndex+4, endIndex ); + } + } + } + + if (id != null) + { + var canvas = this.findCanvasWithID( id, elt ); + if (canvas) + { + if (!canvas.elementModel) + { + NJUtils.makeElementModel(canvas, "Canvas", "shape", true); + } + if (canvas.elementModel) + { + if (canvas.elementModel.shapeModel.GLWorld) + canvas.elementModel.shapeModel.GLWorld.clearTree(); + + if (jObj) + { + var useWebGL = jObj.webGL; + var world = new GLWorld( canvas, useWebGL ); + world.importJSON( jObj ); + } + else + { + var index = importStr.indexOf( "webGL: " ); + var useWebGL = (index >= 0); + var world = new GLWorld( canvas, useWebGL ); + world.import( importStr ); } + + this.buildShapeModel( canvas.elementModel, world ); } } } @@ -265,7 +308,7 @@ exports.HTMLDocument = Montage.create(TextDocument, { shapeModel.GLGeomObj = root; shapeModel.strokeSize = root._strokeWidth; shapeModel.stroke = root._strokeColor.slice(); - shapeModel.strokeMaterial = root._strokeMaterial.dup(); + shapeModel.strokeMaterial = root._strikeMaterial ? root._strokeMaterial.dup() : null; shapeModel.strokeStyle = "solid"; //shapeModel.strokeStyleIndex //shapeModel.border @@ -276,7 +319,7 @@ exports.HTMLDocument = Montage.create(TextDocument, { elementModel.selection = "Rectangle"; elementModel.pi = "RectanglePi"; shapeModel.fill = root._fillColor.slice(); - shapeModel.fillMaterial = root._fillMaterial.dup(); + shapeModel.fillMaterial = root._fillMaterial ? root._fillMaterial.dup() : null; shapeModel.tlRadius = root._tlRadius; shapeModel.trRadius = root._trRadius; shapeModel.blRadius = root._blRadius; @@ -287,7 +330,7 @@ exports.HTMLDocument = Montage.create(TextDocument, { elementModel.selection = "Oval"; elementModel.pi = "OvalPi"; shapeModel.fill = root._fillColor.slice(); - shapeModel.fillMaterial = root._fillMaterial.dup(); + shapeModel.fillMaterial = root._fillMaterial ? root._fillMaterial.dup() : null; shapeModel.innerRadius = root._innerRadius; break; @@ -382,7 +425,8 @@ exports.HTMLDocument = Montage.create(TextDocument, { { if (elt.elementModel && elt.elementModel.shapeModel && elt.elementModel.shapeModel.GLWorld) { - var data = elt.elementModel.shapeModel.GLWorld.export(); + var data = elt.elementModel.shapeModel.GLWorld.exportJSON(); + //var data = elt.elementModel.shapeModel.GLWorld.export(); dataArray.push( data ); } diff --git a/js/helper-classes/RDGE/rdge-compiled.js b/js/helper-classes/RDGE/rdge-compiled.js index d1040d73..caf58147 100755 --- a/js/helper-classes/RDGE/rdge-compiled.js +++ b/js/helper-classes/RDGE/rdge-compiled.js @@ -235,15 +235,15 @@ input.onMouseMove=function(a){for(var b=0,f=input.eventHandlers.length;b0?this.stateTop-1:0;this.stateStack[this.stateTop]&&this.stateStack[this.stateTop].ReInit()};this.PopAll=function(){for(;this.stateStack[this.stateTop]!=null;)this.PopState()};this.tick=function(a){this.stateStack[this.stateTop]!=null&&(this.stateStack[this.stateTop].Update(a),this.stateStack[this.stateTop].Resize(),this.stateStack[this.stateTop].Draw())}};g_enableBenchmarks=!0; function Engine(){this._assetPath="assets/";this.sceneMap=[];this.stateTop=void 0;this.lastWindowWidth=window.innerWidth;this.lastWindowHeight=window.innerHeight;this.lightManager=this.defaultContext=null;clearColor=[0,0,0,0];panelObjectManager=new objectManager;this.initializeComplete=!1;this.RDGECanvas=null;this.canvasToRendererMap={};this.canvasNameToStateStack={};this.canvasCtxList=[];invalidObj=/([()]|function)/;isValidObj=function(a){return invalidObj.test(a)?(window.console.error("invalid object name passed to RDGE, "+ a+" - looks like a function"),!1):!0};contextDef=function(){this.startUpState=this.ctxStateManager=this.renderer=this.id=null;this.sceneGraphMap=[];this.currentScene=null;this.getScene=function(){return this.sceneGraphMap[this.currentScene]};this.debug={frameCounter:0,mat4CallCount:0}};this.ctxMan=contextManager=new objectManager;contextManager.currentCtx=null;contextManager._addObject=contextManager.addObject;contextManager.contextMap={};contextManager.addObject=function(a){this.contextMap[a.id]= -a;return this._addObject(a)};contextManager.start=function(){for(var a=this.objects.length,b=0;b=0&&(f=a.substr(b+7),f=this._assetPath+f);return f}} +a;return this._addObject(a)};contextManager.start=function(){for(var a=this.objects.length,b=0;b=0&&(f=a.substr(b+7),f=this._assetPath+f);return f}} Engine.prototype.init=function(a,b,f){this.GlInit(f);globalParamFuncSet=function(a){this.data=a.data;this.type=a.type;this.set=function(a){for(var b=this.data?this.data.length:0,f=0;f */ var MaterialsModel = require("js/models/materials-model").MaterialsModel; -var FlatMaterial = require("js/lib/rdge/materials/flat-material").FlatMaterial; -var LinearGradientMaterial = require("js/lib/rdge/materials/linear-gradient-material").LinearGradientMaterial; -var RadialGradientMaterial = require("js/lib/rdge/materials/radial-gradient-material").RadialGradientMaterial; -var BumpMetalMaterial = require("js/lib/rdge/materials/bump-metal-material").BumpMetalMaterial; -var UberMaterial = require("js/lib/rdge/materials/uber-material").UberMaterial; -var RadialBlurMaterial = require("js/lib/rdge/materials/radial-blur-material").RadialBlurMaterial; -var PlasmaMaterial = require("js/lib/rdge/materials/plasma-material").PlasmaMaterial; -var PulseMaterial = require("js/lib/rdge/materials/pulse-material").PulseMaterial; -var TunnelMaterial = require("js/lib/rdge/materials/tunnel-material").TunnelMaterial; -var ReliefTunnelMaterial = require("js/lib/rdge/materials/relief-tunnel-material").ReliefTunnelMaterial; -var SquareTunnelMaterial = require("js/lib/rdge/materials/square-tunnel-material").SquareTunnelMaterial; -var FlyMaterial = require("js/lib/rdge/materials/fly-material").FlyMaterial; -var WaterMaterial = require("js/lib/rdge/materials/water-material").WaterMaterial; -var ZInvertMaterial = require("js/lib/rdge/materials/z-invert-material").ZInvertMaterial; -var DeformMaterial = require("js/lib/rdge/materials/deform-material").DeformMaterial; -var StarMaterial = require("js/lib/rdge/materials/star-material").StarMaterial; -var TwistMaterial = require("js/lib/rdge/materials/twist-material").TwistMaterial; -var JuliaMaterial = require("js/lib/rdge/materials/julia-material").JuliaMaterial; -var KeleidoscopeMaterial = require("js/lib/rdge/materials/keleidoscope-material").KeleidoscopeMaterial; -var MandelMaterial = require("js/lib/rdge/materials/mandel-material").MandelMaterial; /////////////////////////////////////////////////////////////////////// // Class GLGeomObj @@ -265,6 +245,96 @@ var GeomObj = function GLGeomObj() { return fillMaterial; }; + this.exportMaterialsJSON = function() + { + var jObj; + if (this._materialArray && this._materialNodeArray) + { + var nMats = this._materialArray.length; + if (nMats > 0) + { + var arr = []; + + for (var i=0; i + This file contains proprietary software owned by Motorola Mobility, Inc.
+ No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.
+ (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. + */ + +var MaterialParser = require("js/lib/rdge/materials/material-parser").MaterialParser; +var Material = require("js/lib/rdge/materials/material").Material; +/////////////////////////////////////////////////////////////////////// +// Class GLMaterial +// RDGE representation of a material. +/////////////////////////////////////////////////////////////////////// +var CloudMaterial = function CloudMaterial() { + /////////////////////////////////////////////////////////////////////// + // Instance variables + /////////////////////////////////////////////////////////////////////// + this._name = "CloudMaterial"; + this._shaderName = "cloud"; + + this._texMap = 'assets/images/cloud2.jpg'; + this._diffuseColor = [0.5, 0.5, 0.5, 0.5]; + + this._time = 0.0; + this._dTime = 0.01; + + /////////////////////////////////////////////////////////////////////// + // Property Accessors + /////////////////////////////////////////////////////////////////////// + this.getName = function() { return this._name; }; + this.getShaderName = function() { return this._shaderName; }; + + this.getTextureMap = function() { return this._propValues[this._propNames[0]] ? this._propValues[this._propNames[0]].slice() : null }; + this.setTextureMap = function(m) { this._propValues[this._propNames[0]] = m ? m.slice(0) : null; this.updateTexture(); }; + + this.setDiffuseColor = function(c) { this._propValues[this._propNames[1]] = c.slice(0); this.updateColor(); }; + this.getDiffuseColor = function() { return this._propValues[this._propNames[1]] ? this._propValues[this._propNames[1]].slice() : null; }; + + this.isAnimated = function() { return true; }; + + /////////////////////////////////////////////////////////////////////// + // Material Property Accessors + /////////////////////////////////////////////////////////////////////// + this._propNames = ["texmap", "diffusecolor"]; + this._propLabels = ["Texture map", "Diffuse Color"]; + this._propTypes = ["file", "color"]; + this._propValues = []; + + this._propValues[ this._propNames[0] ] = this._texMap.slice(0); + this._propValues[ this._propNames[1] ] = this._diffuseColor.slice(); + + this.setProperty = function( prop, value ) + { + if (prop === 'color') prop = 'diffusecolor'; + + // make sure we have legitimate imput + var ok = this.validateProperty( prop, value ); + if (!ok) { + console.log( "invalid property in Radial Gradient Material:" + prop + " : " + value ); + } + + switch (prop) + { + case "texmap": + this.setTextureMap(value); + break; + + case "diffusecolor": + this.setDiffuseColor( value ); + break; + + case "color": + break; + } + }; + /////////////////////////////////////////////////////////////////////// + + + /////////////////////////////////////////////////////////////////////// + // Methods + /////////////////////////////////////////////////////////////////////// + // duplcate method requirde + this.dup = function( world ) + { + // save the world + if (world) this.setWorld( world ); + + // allocate a new uber material + var newMat = new CloudMaterial(); + + // copy over the current values; + var propNames = [], propValues = [], propTypes = [], propLabels = []; + this.getAllProperties( propNames, propValues, propTypes, propLabels); + var n = propNames.length; + for (var i=0; i 200.0) this._time = 0.0; + } + } + }; + + // JSON export + this.exportJSON = function() + { + var jObj = + { + 'material' : this.getShaderName(), + 'name' : this.getName(), + 'texture' : this._propValues[this._propNames[0]] + }; + + return jObj; + }; + + this.importJSON = function( jObj ) + { + if (this.getShaderName() != jObj.material) throw new Error( "ill-formed material" ); + this.setName( jObj.name ); + + try { + this._propValues[this._propNames[0]] = jObj.texture; + } + catch (e) + { + throw new Error( "could not import material: " + jObj ); + } + } + + + this.export = function() { + // every material needs the base type and instance name + var exportStr = "material: " + this.getShaderName() + "\n"; + exportStr += "name: " + this.getName() + "\n"; + + var world = this.getWorld(); + if (!world) + throw new Error( "no world in material.export, " + this.getName() ); + + var texMapName = this._propValues[this._propNames[0]]; + exportStr += "texture: " +texMapName + "\n"; + + // every material needs to terminate like this + exportStr += "endMaterial\n"; + + return exportStr; + }; + + this.import = function( importStr ) { + var pu = new MaterialParser( importStr ); + var material = pu.nextValue( "material: " ); + if (material != this.getShaderName()) throw new Error( "ill-formed material" ); + this.setName( pu.nextValue( "name: ") ); + + var rtnStr; + try { + this._propValues[this._propNames[0]] = pu.nextValue( "texture: " ); + + var endKey = "endMaterial\n"; + var index = importStr.indexOf( endKey ); + index += endKey.length; + rtnStr = importStr.substr( index ); + } + catch (e) + { + throw new Error( "could not import material: " + importStr ); + } + + return rtnStr; + } +}; + +/////////////////////////////////////////////////////////////////////////////////////// +// RDGE shader + +// shader spec (can also be loaded from a .JSON file, or constructed at runtime) +var cloudMaterialDef = +{'shaders': + { + 'defaultVShader':"assets/shaders/Cloud.vert.glsl", + 'defaultFShader':"assets/shaders/Cloud.frag.glsl" + }, + 'techniques': + { + 'default': + [ + { + 'vshader' : 'defaultVShader', + 'fshader' : 'defaultFShader', + // attributes + 'attributes' : + { + 'vert' : { 'type' : 'vec3' }, + 'normal' : { 'type' : 'vec3' }, + 'texcoord' : { 'type' : 'vec2' } + }, + // parameters + 'params' : + { + 'u_tex0': { 'type' : 'tex2d' }, + 'u_time' : { 'type' : 'float' }, + 'u_DiffuseColor' : { 'type' : 'vec4' } + }, + + // render states + 'states' : + { + 'depthEnable' : true, + 'offset':[1.0, 0.1] + } + } + ] + } +}; + + + + +CloudMaterial.prototype = new Material(); + +if (typeof exports === "object") { + exports.CloudMaterial = CloudMaterial; +} + diff --git a/js/lib/rdge/materials/flat-material.js b/js/lib/rdge/materials/flat-material.js index fff0e68e..5030cc88 100755 --- a/js/lib/rdge/materials/flat-material.js +++ b/js/lib/rdge/materials/flat-material.js @@ -112,6 +112,27 @@ var FlatMaterial = function FlatMaterial() { return rtnStr; }; + this.exportJSON = function() + { + var jObj = + { + 'material' : this.getShaderName(), + 'name' : this.getName(), + 'color' : this._propValues["color"] + }; + + return jObj; + } + + this.importJSON = function( jObj ) + { + if (this.getShaderName() != jObj.material) throw new Error( "ill-formed material" ); + this.setName( jObj.name ); + + var color = jObj.color; + this.setProperty( "color", color); + } + this.update = function( time ) { }; diff --git a/js/lib/rdge/materials/julia-material.js b/js/lib/rdge/materials/julia-material.js index 976dfad3..a85bd6f7 100644 --- a/js/lib/rdge/materials/julia-material.js +++ b/js/lib/rdge/materials/julia-material.js @@ -21,11 +21,7 @@ var JuliaMaterial = function JuliaMaterial() { /////////////////////////////////////////////////////////////////////// // Properties /////////////////////////////////////////////////////////////////////// - // no properties - this._propNames = []; - this._propLabels = []; - this._propTypes = []; - this._propValues = []; + // properties inherited from PulseMaterial /////////////////////////////////////////////////////////////////////// // Methods diff --git a/js/lib/rdge/materials/linear-gradient-material.js b/js/lib/rdge/materials/linear-gradient-material.js index 8e05e23d..0db6fc90 100755 --- a/js/lib/rdge/materials/linear-gradient-material.js +++ b/js/lib/rdge/materials/linear-gradient-material.js @@ -249,6 +249,59 @@ var LinearGradientMaterial = function LinearGradientMaterial() { } }; + this.exportJSON = function() + { + var jObj = + { + 'material' : this.getShaderName(), + 'name' : this.getName(), + 'color1' : this.getColor1(), + 'color2' : this.getColor2(), + 'color3' : this.getColor3(), + 'color4' : this.getColor4(), + 'colorStop1' : this.getColorStop1(), + 'colorStop2' : this.getColorStop2(), + 'colorStop3' : this.getColorStop3(), + 'colorStop4' : this.getColorStop4(), + 'angle' : this.getAngle() + }; + + return jObj; + }; + + this.importJSON = function( jObj ) + { + if (this.getShaderName() != jObj.material) throw new Error( "ill-formed material" ); + this.setName( jObj.name ); + + try + { + var color1 = jObj.color1, + color2 = jObj.color2, + color3 = jObj.color3, + color4 = jObj.color4, + colorStop1 = jObj.colorStop1, + colorStop2 = jObj.colorStop2, + colorStop3 = jObj.colorStop3, + colorStop4 = jObj.colorStop4, + angle = jObj.angle; + + this.setProperty( "color1", color1 ); + this.setProperty( "color2", color2 ); + this.setProperty( "color3", color3 ); + this.setProperty( "color4", color4 ); + this.setProperty( "colorStop1", colorStop1 ); + this.setProperty( "colorStop2", colorStop2 ); + this.setProperty( "colorStop3", colorStop3 ); + this.setProperty( "colorStop4", colorStop4 ); + this.setProperty( "angle", angle ); + } + catch (e) + { + throw new Error( "could not import material: " + importStr ); + } + }; + this.export = function() { // every material needs the base type and instance name var exportStr = "material: " + this.getShaderName() + "\n"; diff --git a/js/lib/rdge/materials/mandel-material.js b/js/lib/rdge/materials/mandel-material.js index d9f00383..e7b105e1 100644 --- a/js/lib/rdge/materials/mandel-material.js +++ b/js/lib/rdge/materials/mandel-material.js @@ -21,11 +21,7 @@ var MandelMaterial = function MandelMaterial() { /////////////////////////////////////////////////////////////////////// // Properties /////////////////////////////////////////////////////////////////////// - // no properties - this._propNames = []; - this._propLabels = []; - this._propTypes = []; - this._propValues = []; + // properties inherited from PulseMaterial /////////////////////////////////////////////////////////////////////// // Material Property Accessors diff --git a/js/lib/rdge/materials/plasma-material.js b/js/lib/rdge/materials/plasma-material.js index 86b1a93c..b04d8451 100644 --- a/js/lib/rdge/materials/plasma-material.js +++ b/js/lib/rdge/materials/plasma-material.js @@ -67,6 +67,24 @@ var PlasmaMaterial = function PlasmaMaterial() { this._time += this._dTime; } + this.exportJSON = function() + { + var jObj = + { + 'material' : this.getShaderName(), + 'name' : this.getName(), + 'speed' : this._speed, + 'dTime' : this._dTime + } + + return jObj; + } + + this.importJSON = function( jObj ) + { + this._speed = jObj.speed; + this._dTime = jObj.dTime; + } }; /////////////////////////////////////////////////////////////////////////////////////// diff --git a/js/lib/rdge/materials/pulse-material.js b/js/lib/rdge/materials/pulse-material.js index 81db36c6..2075d1ff 100644 --- a/js/lib/rdge/materials/pulse-material.js +++ b/js/lib/rdge/materials/pulse-material.js @@ -125,18 +125,6 @@ var PulseMaterial = function PulseMaterial() { var texMapName = this._propValues[this._propNames[0]]; var wrap = 'REPEAT', mips = true; var tex = this.loadTexture( texMapName, wrap, mips ); - - /* - var glTex = new GLTexture( this.getWorld() ); - var prevWorld = this.findPreviousWorld(); - if (prevWorld) - { - var srcCanvas = prevWorld.getCanvas(); - tex = glTex.loadFromCanvas( srcCanvas ); - } - else - tex = glTex.loadFromFile( texMapName, wrap, mips ); - */ if (tex) { technique.u_tex0.set( tex ); @@ -174,6 +162,38 @@ var PulseMaterial = function PulseMaterial() { } }; + // JSON export + this.exportJSON = function() + { + var jObj = + { + 'material' : this.getShaderName(), + 'name' : this.getName(), + 'texture' : this._propValues[this._propNames[0]], + 'dTime' : this._dTime + }; + + return jObj; + }; + + this.importJSON = function( jObj ) + { + if (this.getShaderName() != jObj.material) throw new Error( "ill-formed material" ); + this.setName( jObj.name ); + + try { + this._propValues[this._propNames[0]] = jObj.texture; + this._texMap = jObj.texture; + if (jObj.dTime) + this._dTime = jObj.dTime; + } + catch (e) + { + throw new Error( "could not import material: " + jObj ); + } + } + + this.export = function() { // every material needs the base type and instance name var exportStr = "material: " + this.getShaderName() + "\n"; diff --git a/js/lib/rdge/materials/radial-blur-material.js b/js/lib/rdge/materials/radial-blur-material.js index 46cdda74..f4a4baa2 100644 --- a/js/lib/rdge/materials/radial-blur-material.js +++ b/js/lib/rdge/materials/radial-blur-material.js @@ -157,6 +157,38 @@ var RadialBlurMaterial = function RadialBlurMaterial() { } }; + this.exportJSON = function() + { + var jObj = + { + 'material' : this.getShaderName(), + 'name' : this.getName(), + 'color' : this._propValues["color"], + 'texture' : this._propValues[this._propNames[0]] + }; + + return jObj; + }; + + this.importJSON = function( jObj ) + { + if (this.getShaderName() != jObj.material) throw new Error( "ill-formed material" ); + this.setName( jObj.name ); + + var rtnStr; + try + { + this._propValues[this._propNames[0]] = jObj.texture; + this.updateTexture(); + } + catch (e) + { + throw new Error( "could not import material: " + importStr ); + } + + return rtnStr; + } + this.export = function() { // every material needs the base type and instance name var exportStr = "material: " + this.getShaderName() + "\n"; @@ -242,10 +274,31 @@ var radialBlurMaterialDef = } }; + +var RaidersMaterial = function RaidersMaterial() +{ + // initialize the inherited members + this.inheritedFrom = RadialBlurMaterial; + this.inheritedFrom(); + + this._name = "RaidersMaterial"; + this._shaderName = "radialBlur"; + + this._texMap = 'assets/images/raiders.png'; + this._propValues[ this._propNames[0] ] = this._texMap.slice(0); +} + +RaidersMaterial.prototype = new Material(); + +if (typeof exports === "object") +{ + exports.RaidersMaterial = RaidersMaterial; +} + + RadialBlurMaterial.prototype = new Material(); -if (typeof exports === "object") { +if (typeof exports === "object") exports.RadialBlurMaterial = RadialBlurMaterial; -} diff --git a/js/lib/rdge/materials/radial-gradient-material.js b/js/lib/rdge/materials/radial-gradient-material.js index d19b44b7..87e20ad4 100755 --- a/js/lib/rdge/materials/radial-gradient-material.js +++ b/js/lib/rdge/materials/radial-gradient-material.js @@ -158,7 +158,8 @@ var RadialGradientMaterial = function RadialGradientMaterial() { this._propValues[ this._propNames[6] ] = this._colorStop3; this._propValues[ this._propNames[7] ] = this._colorStop4; - this.setProperty = function( prop, value ) { + this.setProperty = function( prop, value ) + { if (prop === "color") prop = "color1"; // make sure we have legitimate imput @@ -236,6 +237,57 @@ var RadialGradientMaterial = function RadialGradientMaterial() { } }; + this.exportJSON = function() + { + var jObj = + { + 'material' : this.getShaderName(), + 'name' : this.getName(), + + 'color1' : this.getColor1(), + 'color2' : this.getColor2(), + 'color3' : this.getColor3(), + 'color4' : this.getColor4(), + 'colorStop1' : this.getColorStop1(), + 'colorStop2' : this.getColorStop2(), + 'colorStop3' : this.getColorStop3(), + 'colorStop4' : this.getColorStop4() + }; + + return jObj; + }; + + this.importJSON = function( jObj ) + { + if (this.getShaderName() != jObj.material) throw new Error( "ill-formed material" ); + this.setName( jObj.name ); + + try + { + var color1 = jObj.color1, + color2 = jObj.color2, + color3 = jObj.color3, + color4 = jObj.color4, + colorStop1 = jObj.colorStop1, + colorStop2 = jObj.colorStop2, + colorStop3 = jObj.colorStop3, + colorStop4 = jObj.colorStop4; + + this.setProperty( "color1", color1 ); + this.setProperty( "color2", color2 ); + this.setProperty( "color3", color3 ); + this.setProperty( "color4", color4 ); + this.setProperty( "colorStop1", colorStop1 ); + this.setProperty( "colorStop2", colorStop2 ); + this.setProperty( "colorStop3", colorStop3 ); +