Skip to content
GitLab
Commit 0190ef94 authored by amandaghassaei's avatar amandaghassaei
Browse files

cleaning up

parent 109d726a
Hide whitespace changes
Inline Side-by-side
index.html
View file @ 0190ef94
......@@ -542,7 +542,7 @@
</div><br/>
<b>Animation Settings:</b><a class="about floatRight" href="#" id="aboutAnimation"><span class="fui-question-circle"></span></a><br/>
<div class="indent">
<span class="smallTxt">&Delta; t = <span id="deltaT"></span> seconds</span><br/>
<span class="smallTxt">&Delta;t = <span id="deltaT"></span> seconds</span><br/>
<span class="smallTxt">Num simulation steps per render: &nbsp;&nbsp;<input id="numStepsPerRender" value="" placeholder="" class="int form-control" type="text"></span><br/><br/>
<a href="#" id="shouldCenterGeo" class="floatRight btn btn-lg btn-default">Re-center geometry</a>
</div>
......@@ -615,10 +615,10 @@
<!--Ambient Occlusion-->
<!--</label>-->
<!--</div>-->
VR:
VR: <a class="about floatRight" href="#" id="aboutVR"><span class="fui-question-circle"></span></a>
<div class="indent smallTxt">
Status: &nbsp;<span id="VRstatus"></span>
<a class="about floatRight" href="#" id="aboutVR"><span class="fui-question-circle"></span></a><br/>
<br/>
<div id="VRoptions">
</div>
......
js/controls.js
View file @ 0190ef94
......@@ -104,7 +104,7 @@ function initControls(globals){
globals.warn("No crease pattern available for FOLD format.");
return;
}
globals.pausedForPatternView = globals.threeView.running();
globals.pausedForPatternView = globals.simulationRunning;
globals.model.pause();
globals.navMode = "pattern";
$("#navPattern").parent().addClass("open");
......@@ -276,7 +276,7 @@ function initControls(globals){
globals.model.pause();
});
setLink("#reset", function(){
if (!globals.threeView.running()) $("#reset").hide();
if (!globals.simulationRunning) $("#reset").hide();
globals.model.reset();
});
setLink("#stepForward", function(){
......
js/dynamic/dynamicSolver.js
View file @ 0190ef94
......@@ -38,7 +38,6 @@ function initDynamicSolver(globals){
faces = globals.model.getFaces();
creases = globals.model.getCreases();
// globals.model.sync();
positions = globals.model.getPositionsArray();
colors = globals.model.getColorsArray();
......
js/globals.js
View file @ 0190ef94
......@@ -23,6 +23,7 @@ function initGlobals(){
ambientOcclusion: false,
//flags
simulationRunning: true,
fixedHasChanged: false,
forceHasChanged: false,
materialHasChanged: false,
......
js/main.js
View file @ 0190ef94
......@@ -19,5 +19,5 @@ $(function() {
globals.rigidSolver = initRigidSolver(globals);
globals.pattern = initPattern(globals);
globals.vive = initViveInterface(globals);
$(".demo[data-url='Tessellations/waterbomb.svg']").click();
$(".demo[data-url='Tessellations/waterbomb.svg']").click();//load demo models
});
\ No newline at end of file
js/model.js
View file @ 0190ef94
......@@ -2,16 +2,17 @@
* Created by amandaghassaei on 2/24/17.
*/
//wireframe model and folding structure
//model updates object3d geometry and materials
function initModel(globals){
var geometry = new THREE.BufferGeometry();
geometry.dynamic = true;
var material, material2;
var object3D = new THREE.Mesh(geometry);
var object3D2 = new THREE.Mesh(geometry);
object3D2.visible = false;
var frontside = new THREE.Mesh(geometry);//front face of mesh
var backside = new THREE.Mesh(geometry);//back face of mesh (different color)
backside.visible = false;
setMeshMaterial();
var positions;//place to store buffer geo vertex data
......@@ -21,7 +22,11 @@ function initModel(globals){
var faces = [];
var edges = [];
var creases = [];
var vertices = [];
var vertices = [];//indexed vertices array
var nextNodes, nextEdges, nextCreases, nextFaces;
var inited = false;
function setMeshMaterial() {
var polygonOffset = 0.5;
......@@ -32,7 +37,7 @@ function initModel(globals){
polygonOffsetFactor: polygonOffset, // positive value pushes polygon further away
polygonOffsetUnits: 1
});
object3D2.visible = false;
backside.visible = false;
} else if (globals.colorMode == "axialStrain"){
material = new THREE.MeshBasicMaterial({
vertexColors: THREE.VertexColors, side:THREE.DoubleSide,
......@@ -40,26 +45,26 @@ function initModel(globals){
polygonOffsetFactor: polygonOffset, // positive value pushes polygon further away
polygonOffsetUnits: 1
});
object3D2.visible = false;
backside.visible = false;
} else {
material = new THREE.MeshPhongMaterial({
shading:THREE.FlatShading, color:0xff0000, side:THREE.FrontSide,
shading:THREE.FlatShading, side:THREE.FrontSide,
polygonOffset: true,
polygonOffsetFactor: polygonOffset, // positive value pushes polygon further away
polygonOffsetUnits: 1
});
material2 = new THREE.MeshPhongMaterial({
shading:THREE.FlatShading, color:0x0000ff, side:THREE.BackSide,
shading:THREE.FlatShading, side:THREE.BackSide,
polygonOffset: true,
polygonOffsetFactor: polygonOffset, // positive value pushes polygon further away
polygonOffsetUnits: 1
});
material.color.setStyle( "#" + globals.color1);
material2.color.setStyle( "#" + globals.color2);
object3D2.visible = true;
backside.visible = true;
}
object3D.material = material;
object3D2.material = material2;
frontside.material = material;
backside.material = material2;
}
function updateEdgeVisibility(){
......@@ -76,8 +81,8 @@ function initModel(globals){
}
function updateMeshVisibility(){
object3D.visible = globals.meshVisible;
object3D2.visible = globals.colorMode == "color" && globals.meshVisible;
frontside.visible = globals.meshVisible;
backside.visible = globals.colorMode == "color" && globals.meshVisible;
}
function getGeometry(){
......@@ -85,7 +90,7 @@ function initModel(globals){
}
function getMesh(){
return [object3D, object3D2];
return [frontside, backside];
}
function getVertices(){
return vertices;
......@@ -107,45 +112,37 @@ function initModel(globals){
}
function reset(){
var solver = getSolver();
if (globals.needsSync){
solver.syncNodesAndEdges();
globals.needsSync = false;
}
solver.reset();
getSolver().reset();
setGeoUpdates();
}
function step(numSteps){
var solver = getSolver();
if (globals.needsSync){
solver.syncNodesAndEdges();
globals.needsSync = false;
}
solver.solve(numSteps);
geometry.attributes.position.needsUpdate = true;
getSolver().solve(numSteps);
setGeoUpdates();
}
function setGeoUpdates(){
geometry.attributes.position.needsUpdate = true;
if (globals.colorMode == "axialStrain") geometry.attributes.color.needsUpdate = true;
if (globals.userInteractionEnabled || globals.vrEnabled) geometry.computeBoundingBox();
// geometry.computeBoundingSphere();
// if (globals.userInteractionEnabled || globals.vrEnabled) geometry.computeBoundingBox();
}
var inited = false;
startSolver();
function startSolver(){
globals.threeView.startAnimation(function(){
if (!inited) return;
step();
});
globals.threeView.startAnimation(step);
}
function getSolver(){
if (globals.simType == "dynamic") return globals.dynamicSolver;
else if (globals.simType == "static") return globals.staticSolver;
return globals.rigidSolver;
}
function buildModel(_faces, _vertices, _allEdges, allCreaseParams){
if (_vertices.length == 0) {
console.warn("no vertices");
return;
......@@ -159,67 +156,72 @@ function initModel(globals){
return;
}
var _nodes = [];
nextNodes = [];
for (var i=0;i<_vertices.length;i++){
_nodes.push(new Node(_vertices[i].clone(), _nodes.length));
nextNodes.push(new Node(_vertices[i].clone(), nextNodes.length));
}
// _nodes[_faces[0][0]].setFixed(true);
// _nodes[_faces[0][1]].setFixed(true);
// _nodes[_faces[0][2]].setFixed(true);
var _edges = [];
nextEdges = [];
for (var i=0;i<_allEdges.length;i++) {
_edges.push(new Beam([_nodes[_allEdges[i][0]], _nodes[_allEdges[i][1]]]));
nextEdges.push(new Beam([nextNodes[_allEdges[i][0]], nextNodes[_allEdges[i][1]]]));
}
var _creases = [];
nextCreases = [];
for (var i=0;i<allCreaseParams.length;i++) {//allCreaseParams.length
var creaseParams = allCreaseParams[i];//face1Ind, vert1Ind, face2Ind, ver2Ind, edgeInd, angle
var type = creaseParams[5]!=0 ? 1:0;
//edge, face1Index, face2Index, targetTheta, type, node1, node2, index
_creases.push(new Crease(_edges[creaseParams[4]], creaseParams[0], creaseParams[2], creaseParams[5], type, _nodes[creaseParams[1]], _nodes[creaseParams[3]], _creases.length));
nextCreases.push(new Crease(nextEdges[creaseParams[4]], creaseParams[0], creaseParams[2], creaseParams[5], type, nextNodes[creaseParams[1]], nextNodes[creaseParams[3]], nextCreases.length));
}
nextFaces = _faces;
globals.needsSync = true;
if (!inited) {
startSolver();//start animation loop
inited = true;
}
}
function sync(){
globals.threeView.sceneClearModel();
// _.each(_nodes, function(node){
// var obj3D = node.getObject3D();
// globals.threeView.sceneAddModel(obj3D);
// });
_.each(_edges, function(edge){
_.each(nextEdges, function(edge){
globals.threeView.sceneAddModel(edge.getObject3D());
});
var oldNodes = nodes;
var oldEdges = edges;
var oldCreases = creases;
nodes = _nodes;
edges = _edges;
faces = _faces;
creases = _creases;
for (var i=0;i<oldNodes.length;i++){
oldNodes[i].destroy();
for (var i=0;i<nodes.length;i++){
nodes[i].destroy();
}
oldNodes = null;
for (var i=0;i<oldEdges.length;i++){
oldEdges[i].destroy();
for (var i=0;i<edges.length;i++){
edges[i].destroy();
}
oldEdges = null;
for (var i=0;i<oldCreases.length;i++){
oldCreases[i].destroy();
for (var i=0;i<creases.length;i++){
creases[i].destroy();
}
oldCreases = null;
globals.threeView.sceneAddModel(object3D);
globals.threeView.sceneAddModel(object3D2);
nodes = nextNodes;
edges = nextEdges;
faces = nextFaces;
creases = nextCreases;
inited = true;
updateEdgeVisibility();
updateMeshVisibility();
vertices = [];
for (var i=0;i<nodes.length;i++){
vertices.push(nodes[i].getPosition());
}
if (globals.noCreasePatternAvailable() && globals.navMode == "pattern"){
//switch to simulation mode
......@@ -229,24 +231,6 @@ function initModel(globals){
globals.navMode = "simulation";
}
if (!globals.threeView.running()) {
sync();
}
globals.needsSync = true;
}
function getSolver(){
if (globals.simType == "dynamic") return globals.dynamicSolver;
else if (globals.simType == "static") return globals.staticSolver;
return globals.rigidSolver;
}
function sync(){
vertices = [];
for (var i=0;i<nodes.length;i++){
vertices.push(nodes[i].getPosition());
}
positions = new Float32Array(vertices.length*3);
colors = new Float32Array(vertices.length*3);
indices = new Uint16Array(faces.length*3);
......@@ -278,10 +262,11 @@ function initModel(globals){
var scale = 1/geometry.boundingSphere.radius;
globals.scale = scale;
object3D.geometry.dispose();
object3D.geometry = geometry;
object3D2.geometry = geometry;
backside.geometry = geometry;
frontside.geometry.dispose();
frontside.geometry = geometry;
//scale geometry
for (var i=0;i<positions.length;i++){
positions[i] *= scale;
}
......@@ -297,7 +282,15 @@ function initModel(globals){
edges[i].recalcOriginalLength();
}
if (!globals.threeView.running()) reset();
globals.threeView.sceneAddModel(frontside);
globals.threeView.sceneAddModel(backside);
updateEdgeVisibility();
updateMeshVisibility();
getSolver().syncNodesAndEdges();
if (!globals.simulationRunning) reset();
}
function getNodes(){
......@@ -326,20 +319,25 @@ function initModel(globals){
resume: resume,
reset: reset,
step: step,
getNodes: getNodes,
getEdges: getEdges,
getFaces: getFaces,
getCreases: getCreases,
buildModel: buildModel,
setMeshMaterial: setMeshMaterial,
updateEdgeVisibility: updateEdgeVisibility,
updateMeshVisibility: updateMeshVisibility,
getGeometry: getGeometry,//for save stl
getVertices: getVertices,//for user interaction, vive interface
getPositionsArray: getPositionsArray,
getColorsArray: getColorsArray,
sync: sync,
getMesh: getMesh,
getVertices: getVertices,
getDimensions: getDimensions
buildModel: buildModel,//load new model
sync: sync,//update geometry to new model
//rendering
setMeshMaterial: setMeshMaterial,
updateEdgeVisibility: updateEdgeVisibility,
updateMeshVisibility: updateMeshVisibility,
getDimensions: getDimensions//for save stl
}
}
\ No newline at end of file
js/threeView.js
View file @ 0190ef94
......@@ -13,12 +13,6 @@ function initThreeView(globals) {
var svgRenderer = new THREE.SVGRenderer();
var controls;
// var depthMaterial, effectComposer, depthRenderTarget;
// var ssaoPass;
var simulationRunning = false;
var pauseFlag = false;
init();
function init() {
......@@ -54,7 +48,7 @@ function initThreeView(globals) {
scene.add(camera);
camera.zoom = 30;
camera.zoom = 15;
camera.updateProjectionMatrix();
camera.position.x = 10;
camera.position.y = 10;
......@@ -68,31 +62,8 @@ function initThreeView(globals) {
controls.dynamicDampingFactor = 0.3;
// controls.addEventListener("change", render);
// var renderPass = new THREE.RenderPass( scene, camera );
// Setup depth pass
// depthMaterial = new THREE.MeshDepthMaterial();
// depthMaterial.depthPacking = THREE.RGBADepthPacking;
// depthMaterial.blending = THREE.NoBlending;
// var pars = { minFilter: THREE.LinearFilter, magFilter: THREE.LinearFilter };
// depthRenderTarget = new THREE.WebGLRenderTarget( window.innerWidth, window.innerHeight, pars );
//
// // Setup SSAO pass
// ssaoPass = new THREE.ShaderPass( THREE.SSAOShader );
// ssaoPass.renderToScreen = true;
// //ssaoPass.uniforms[ "tDiffuse" ].value will be set by ShaderPass
// ssaoPass.uniforms[ "tDepth" ].value = depthRenderTarget.texture;
// ssaoPass.uniforms[ 'size' ].value.set( window.innerWidth, window.innerHeight );
// ssaoPass.uniforms[ 'cameraNear' ].value = camera.near;
// ssaoPass.uniforms[ 'cameraFar' ].value = camera.far;
// ssaoPass.uniforms[ 'onlyAO' ].value = 0;
// ssaoPass.uniforms[ 'aoClamp' ].value = 0.7;
// ssaoPass.uniforms[ 'lumInfluence' ].value = 0.8;
// // Add pass to effect composer
// effectComposer = new THREE.EffectComposer( renderer );
// effectComposer.addPass( renderPass );
// effectComposer.addPass( ssaoPass );
_render();//render before model loads
}
function setCameraX(sign){
......@@ -110,22 +81,18 @@ function initThreeView(globals) {
function startAnimation(callback){
console.log("starting animation");
simulationRunning = true;
_loop(callback);
}
function pauseSimulation(){
if (simulationRunning) pauseFlag = true;
globals.simulationRunning = false;
console.log("pausing simulation");
}
function startSimulation(){
console.log("starting simulation");
simulationRunning = true;
}
function running(){
return simulationRunning;
globals.simulationRunning = true;
}
function _render(){
......@@ -133,25 +100,15 @@ function initThreeView(globals) {
globals.vive.render();
return;
}
// if (globals.ambientOcclusion) {
// // Render depth into depthRenderTarget
// scene.overrideMaterial = depthMaterial;
// renderer.render(scene, camera, depthRenderTarget, true);
// // Render renderPass and SSAO shaderPass
// scene.overrideMaterial = null;
// effectComposer.render();
// return;
// }
renderer.render(scene, camera);
}
function _loop(callback){
if (pauseFlag) {
pauseFlag = false;
simulationRunning = false;
console.log("pausing simulation");
if (globals.needsSync){
globals.model.sync();
globals.needsSync = false;
}
if (simulationRunning) callback();
if (globals.simulationRunning) callback();
if (globals.vrEnabled){
globals.vive.effect.requestAnimationFrame(function(){
_loop(callback);
......@@ -174,10 +131,6 @@ function initThreeView(globals) {
modelWrapper.children = [];
}
function setScale(scale){
modelWrapper.scale.set(scale, scale, scale);
}
function onWindowResize() {
camera.aspect = window.innerWidth / window.innerHeight;
// camera.left = -window.innerWidth / 2;
......@@ -188,18 +141,6 @@ function initThreeView(globals) {
renderer.setSize(window.innerWidth, window.innerHeight);
controls.handleResize();
// var width = window.innerWidth;
// var height = window.innerHeight;
// ssaoPass.uniforms[ 'size' ].value.set( width, height );
// var pixelRatio = renderer.getPixelRatio();
// var newWidth = Math.floor( width / pixelRatio ) || 1;
// var newHeight = Math.floor( height / pixelRatio ) || 1;
// depthRenderTarget.setSize( newWidth, newHeight );
// effectComposer.setSize( newWidth, newHeight );
// render();
}
function enableControls(state){
......@@ -244,17 +185,19 @@ function initThreeView(globals) {
sceneAddModel: sceneAddModel,
sceneClearModel: sceneClearModel,
onWindowResize: onWindowResize,
startAnimation: startAnimation,
startSimulation: startSimulation,
pauseSimulation: pauseSimulation,
enableControls: enableControls,
enableControls: enableControls,//user interaction
scene: scene,
camera: camera,
renderer: renderer,
camera: camera,//needed for user interaction
renderer: renderer,//needed for VR
modelWrapper:modelWrapper,
running: running,
setScale:setScale,
saveSVG: saveSVG,
saveSVG: saveSVG,//svg screenshot
setCameraX:setCameraX,
setCameraY: setCameraY,
setCameraZ: setCameraZ,
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment