svg screengrab and newer version of threejs

js/cam/assemblers/Assembler.js

@@ -5,7 +5,7 @@
 define(['underscore', 'appState', 'lattice', 'stlLoader', 'threeModel', 'cam', 'component', 'stockComponent', 'assemblerPost'],
     function(_, appState, lattice, THREE, three, cam, Component, StockComponent, AssemblerPostMethods){
     
-    var assemblerMaterial = new THREE.MeshLambertMaterial({color:0xaaaaaa, shading: THREE.FlatShading, transparent:true, opacity:0.3});
+    var assemblerMaterial = new THREE.MeshLambertMaterial({color:0xaaaaaa, transparent:true, opacity:0.3});
     var stlLoader = new THREE.STLLoader();
 
     function Assembler(id, json){

js/main.js

@@ -27,6 +27,8 @@ require.config({
         threeView: 'three/ThreeView',
         fillGeometry: 'three/FillGeometry',
         axes: 'three/Axes',
+        svgRenderer: '../dependencies/svgRenderer',
+        threeProjector: '../dependencies/Projector',
 
         //plist
         plist: 'plists/PList',
@@ -237,6 +239,14 @@ require.config({
             deps: ['three'],
             exports: 'THREE'
         },
+        threeProjector: {
+            deps: ['three'],
+            exports: "THREE"
+        },
+        svgRenderer: {
+            deps: ['three', 'threeProjector'],
+            exports: "THREE.SVGRenderer"
+        },
         fileSaverLib: {
             exports: 'saveAs'
         },

js/materials/DMAMaterials.js

@@ -220,8 +220,8 @@ define(['underscore', 'three', 'appState', 'lattice', 'plist', 'threeModel'], fu
     }
 
     function makeMaterialObject(color, transparent){
-        if (transparent) return new THREE.MeshLambertMaterial({color:color, shading:THREE.FlatShading, transparent: true, opacity:0.1});
-        return new THREE.MeshLambertMaterial({color:color, shading:THREE.FlatShading});
+        if (transparent) return new THREE.MeshLambertMaterial({color:color, transparent: true, opacity:0.1});
+        return new THREE.MeshLambertMaterial({color:color});
     }
 
     function setMaterialDefaults(){

js/models/AppState.js

@@ -220,9 +220,16 @@ define(['underscore', 'backbone', 'threeModel', 'three', 'plist', 'globals'], fu
                     break;
                 case 69://e
     //                if (currentTab != "sketch") return;
-                    this.set("extrudeMode", state);
+//                    this.set("extrudeMode", state);
                     break;
                 case 80://p part mode
+                    if (e.ctrlKey || e.metaKey){//command
+                        if (e.shiftKey){
+                            e.preventDefault();
+                            three.saveSVG();
+                            return;
+                        }
+                    }
                     var cellMode = this.get("cellMode");
                     if (cellMode == "part") this.set("cellMode", "cell");
                     else if (cellMode == "cell") this.set("cellMode", "part");

js/models/FileSaver.js

@@ -14,8 +14,7 @@ define(['underscore', 'fileSaverLib', 'lattice', 'materials', 'ribbon', 'menuWra
                 jsonString = jsonString.replace(/"/g, '');
             }
 
-            var blob = new Blob([jsonString], {type: "text/plain;charset=utf-8"});
-            saveAs(blob, name + extension);
+            saveData(jsonString, name, extension);
             if (data.assembler){
                 jsonString.replace(/\\"/g,"\uFFFF"); //U+ FFFF
                 jsonString = jsonString.replace(/\"([^"]+)\":/g,"$1:").replace(/\uFFFF/g,"\\\"");
@@ -25,6 +24,11 @@ define(['underscore', 'fileSaverLib', 'lattice', 'materials', 'ribbon', 'menuWra
 //        });
     }
 
+    function saveData(data, name, extension){
+        var blob = new Blob([data], {type: "text/plain;charset=utf-8"});
+        saveAs(blob, name + extension);
+    }
+
 //    function save(name){
 //        if (!name || name == "" || name == undefined) name = "file";
 //        var data = {
@@ -125,9 +129,11 @@ define(['underscore', 'fileSaverLib', 'lattice', 'materials', 'ribbon', 'menuWra
         object.trigger("change");
     }
 
+
     return {//return public methods
 //        save: save,
         save: save,
+        saveData: saveData,
         saveMaterial: saveMaterial,
         saveMachineConfig: saveMachineConfig,
 //        saveAssembler: saveAssembler,

js/three/FillGeometry.js

@@ -29,7 +29,6 @@ define(['three', 'underscore', 'backbone', 'lattice', 'threeModel'],
     
             var mesh = new THREE.Mesh(geometry, new THREE.MeshLambertMaterial({
                 color:0xf25536,
-                shading: THREE.FlatShading,
                 transparent:true,
                 opacity:0.4,
                 side:THREE.DoubleSide

js/three/ThreeModel.js

@@ -9,6 +9,8 @@ define(['underscore', 'three'], function(_, THREE){
     var scene = new THREE.Scene();
     var renderer = new THREE.WebGLRenderer({antialias:true});//antialiasing is not supported in ff and on mac+chrome
 
+    var svgRenderer = null;
+
     var appState;
     require(['appState'], function(globalAppState){
         appState = globalAppState;
@@ -36,7 +38,6 @@ define(['underscore', 'three'], function(_, THREE){
         resetCameraPosition();
         camera.up.set(0,0,1);//set z axis as "up"
 
-        var fogColor = 0xcccccc;
 //        scene.fog = new THREE.FogExp2(fogColor, 0.001);
 
         // lights
@@ -61,12 +62,17 @@ define(['underscore', 'three'], function(_, THREE){
         
 
         // renderer
-        renderer.setClearColor(fogColor, 1);
-        renderer.setSize(window.innerWidth, window.innerHeight);
+        configRenderer(renderer);
 
         window.addEventListener('resize', onWindowResize, false);
     }
 
+    function configRenderer(_renderer){
+        var fogColor = 0xcccccc;
+        _renderer.setClearColor(fogColor, 1);
+        _renderer.setSize(window.innerWidth, window.innerHeight);
+    }
+
     function resetCameraPosition(){
         camera.position.x = initialCameraPosition.x;
         camera.position.y = initialCameraPosition.y;
@@ -182,6 +188,19 @@ define(['underscore', 'three'], function(_, THREE){
         shouldRender = false;
     }
 
+    function saveSVG(){
+        require(['svgRenderer', 'fileSaver'], function(SVGRenderer, fileSaver){
+            if (svgRenderer === null) {
+                svgRenderer = new SVGRenderer();
+            }
+            configRenderer(svgRenderer);
+            svgRenderer.render(scene, camera);
+            var XMLS = new XMLSerializer();
+            var svgfile = XMLS.serializeToString(svgRenderer.domElement);
+            fileSaver.saveData(svgfile, "screenshot", ".svg");
+        })
+    }
+
     return {//return public properties/methods
         render: render,
         conditionalRender: conditionalRender,
@@ -204,7 +223,8 @@ define(['underscore', 'three'], function(_, THREE){
         removeAllCells: removeAllCells,
         removeAllCompositeCells: removeAllCompositeCells,
         resetCameraPosition: resetCameraPosition,
-        setThreeView: setThreeView
+        setThreeView: setThreeView,
+        saveSVG: saveSVG
     }
 
 });
\ No newline at end of file

modPush.sh

@@ -6,4 +6,7 @@ git fetch upstream
 git merge upstream/master
 git push origin master
 cd ~/Research/CBAStuff/git/archives/dma
+git fetch origin
+git merge origin/master
 git subtree pull -P Web/mod/dmdesign fabpeople:people/amanda.ghassaei/dmdesign master --squash
+git push origin master