|
|
Post by duncan on Apr 22, 2013 2:33:27 GMT -5
|
|
|
|
Post by duncan on May 4, 2013 3:47:00 GMT -5
I was able to get a low poly model of the tigermoth to show in firefox using ovoid. Attachments:
|
|
|
|
Post by duncan on May 4, 2013 3:47:48 GMT -5
another angle Attachments:
|
|
|
|
Post by duncan on May 4, 2013 4:32:17 GMT -5
alpha crater Attachments:
|
|
|
|
Post by duncan on May 4, 2013 4:32:42 GMT -5
alpha crater - angle Attachments:
|
|
|
|
Post by Joe Staff on May 4, 2013 21:57:04 GMT -5
That's really neat
|
|
|
|
Post by duncan on May 6, 2013 15:11:48 GMT -5
|
|
|
|
Post by duncan on May 6, 2013 15:28:50 GMT -5
If anyone feels like wrestling with this stuff, here the code that loads a collada model. I contacted the ovoid developer to hep me out to get it done, there was no tutorial covering the topic on the ovoid site. You will need to run a server on your computer, I use MAMP, XAMPP is equivalent on windows. I have no clue yet how to move forward from this - guess I will try to get to move the camera/model so to mimic flight through the crater.
Note - you can export collada models from Blender. Remember all hardwar models are available in Blender. Ovoid uses its own 3D model format ojsn, which is stored in json format - the advise is to optimise and convert the collada models using ovoid into ojsn, and then us in ovoid.
This example just loads the mesh data from a collada model that you have to provide - check mesh name in collada file, adjust in script - adjust paths.
<html>
<head>
<title>OVoiD.JS Html Mesh Import Test</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<!-- Library core (must be loaded first), change the path as your needs -->
<script type="text/javascript" src="ovoid.js/core.js"></script>
<!-- Library options (must be loaded in last) -->
<script type="text/javascript" src="ovoid.js/config.js"></script>
<script type="text/javascript">
var myScene = new Ovoid.Scene("thescene");
// Main start function
function main()
{
// Place preloadings here
Ovoid.includeDaeMesh("models/tigerXYtri.dae", myScene);
// Initialize the library
Ovoid.init("canvas");
};
// The Ovoid.onload function
Ovoid.onload = function()
{
Ovoid.useScene(myScene);
var body = myScene.create(Ovoid.BODY, "blenderbox");
mesh = myScene.search("MOTH3AY_012-mesh");
body.setShape(mesh);
// Create new light node
var light = myScene.create(Ovoid.LIGHT, "PointLight");
// Move the light
light.moveXyz(2.0,2.0,3.0, Ovoid.WORLD, Ovoid.ABSOLUTE);
};
// The Ovoid.onloop function
Ovoid.onloop = function()
{
Ovoid.rotate("blenderbox", 0.0, Ovoid.Timer.quantum, Ovoid.Timer.quantum, Ovoid.WORLD, Ovoid.RELATIVE);
};
</script>
</head>
<body style="text-align:center; margin:0px;" onload="main();">
<canvas id="canvas" width=800 height=500 style="border: 0;"/>
</body>
</html>
|
|
|
|
Post by duncan on May 11, 2013 3:41:10 GMT -5
this script will load a ojsn model and rotate over all 3 axis with arrow and o/l keys - i will try to get it to mimic the moths flight
<html>
<head>
<title>OVoiD.JS Html Simulae Moth Flight Test</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<!-- Library core (must be loaded first), change the path as your needs -->
<script type="text/javascript" src="ovoid.js/core.js"></script>
<!-- Library options (must be loaded in last) -->
<script type="text/javascript" src="ovoid.js/config.js"></script>
<script type="text/javascript">
/*
*GLOBALS
*/
var myScene = new Ovoid.Scene("thescene");
var cube;
//Variables moth rotation axis plus speed
var rotUpdown = 0;
var rotLeftright = 0;
var rotRoll = 0;
var rotFactor = 2;
//Functions to take key inputs
// rotate up
var EmoveUp = function() {
rotUpdown=Ovoid.Timer.quantum*rotFactor;
};
// Elevator push down
var EmoveDn = function() {
rotUpdown=-Ovoid.Timer.quantum*rotFactor;
};
// Aileron gouvern to right
var RmoveR = function() {
rotLeftright=Ovoid.Timer.quantum*rotFactor;
};
// Aileron gouvern to left
var RmoveL = function() {
rotLeftright=-Ovoid.Timer.quantum*rotFactor;
};
// Flpasturn
var FmoveR = function() {
rotRoll=Ovoid.Timer.quantum*rotFactor;
};
var FmoveL = function() {
rotRoll=-Ovoid.Timer.quantum*rotFactor;
};
//center stick
var Ecenter = function() { rotUpdown = 0 };
var Rcenter = function() { rotLeftright = 0 };
var Fcenter = function() { rotRoll = 0 };
/*
*MAIN
*/
// Main start function
function main()
{
// Place preloadings here
Ovoid.includeOjsScene("models/ojsn/tigermoth.ojsn", myScene);
// Initialize the library
Ovoid.init("canvas");
};
/*
*ONLOAD
*/
// The Ovoid.onload function
Ovoid.onload = function()
{
Ovoid.useScene(myScene);
cube = myScene.search("MOTH3AY-object");
// Create new light node
var light = myScene.create(Ovoid.LIGHT, "PointLight");
// Move the light
light.moveXyz(2.0,2.0,3.0, Ovoid.WORLD, Ovoid.ABSOLUTE);
// Bind up and down arrow keys for Elevator
Ovoid.inputTrigger(null, 38, Ovoid.HELD, EmoveUp);
Ovoid.inputTrigger(null, 40, Ovoid.HELD, EmoveDn);
// Bind left and right arrow keys for Ailerons
Ovoid.inputTrigger(null, 37, Ovoid.HELD, RmoveL);
Ovoid.inputTrigger(null, 39, Ovoid.HELD, RmoveR);
// Bind O and L keys for flapsturn
Ovoid.inputTrigger(null, 79, Ovoid.HELD, FmoveL);
Ovoid.inputTrigger(null, 76, Ovoid.HELD, FmoveR);
//center stick
Ovoid.inputTrigger(null, 38, Ovoid.UP, Ecenter);
Ovoid.inputTrigger(null, 40, Ovoid.UP, Ecenter);
Ovoid.inputTrigger(null, 37, Ovoid.UP, Rcenter);
Ovoid.inputTrigger(null, 39, Ovoid.UP, Rcenter);
Ovoid.inputTrigger(null, 79, Ovoid.UP, Fcenter);
Ovoid.inputTrigger(null, 76, Ovoid.UP, Fcenter);
};
/*
*ONLOOP
*/
// The Ovoid.onloop function
Ovoid.onloop = function()
{
Ovoid.rotate("MOTH3AY-object", rotUpdown, rotLeftright, rotRoll, Ovoid.LOCAL, Ovoid.RELATIVE);
// cube.rotateXyz(rotUpdown, rotLeftright, rotRoll, Ovoid.LOCAL, Ovoid.ABSOLUTE);
};
</script>
</head>
<body style="text-align:center; margin:0px;" onload="main();">
<canvas id="canvas" width=800 height=500 style="border: 0;"/>
</body>
</html>
|
|
|
|
Post by duncan on May 19, 2013 12:21:26 GMT -5
took a while - script that mimics moth flight - likely can be smarter/optimised/tweaked. it will do for now. maybe flight in alpha crater next
<html>
<head>
<title>OVoiD.JS Html Simulae Moth Flight Test</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<!-- Ovoid Library core (must be loaded before configuration), change the path as your needs -->
<script type="text/javascript" src="ovoid.js/core.js"></script>
<!-- Ovoid Library configuration (must be loaded in after core) -->
<script type="text/javascript" src="ovoid.js/config.js"></script>
<!-- JQuery - Duncan intend to use for debug/exploration -->
<script type="text/javascript" src="jquery/jquery-2.0.0.min.js"></script>
<script type="text/javascript">
//Override some debug options
Ovoid.opt_showDebug = false;
// Ovoid.Drawer.opt_drawHelpers = false;
/*
*GLOBALS
*/
var myScene = new Ovoid.Scene("thescene");
var cube;
//duncan report - only bit that uses jquery, not essential, can be deleted
var duncanrap = function(duncanmsg){
$(function(){$("#rap1").text(duncanmsg); });
};
//Variables to set limits rotation and return to level orientation
//to keep track of models axis rotations to set limits
var rotX=0;
var rotY=0;
var rotZ=0;
var rotmax=0.75; //~ 45degrees
var rotUpdown = 0;
var rotLeftright = 0;
var rotRoll = 0;
var rotfactormax = 2.0;
var turnfactor=0.0;
var loopfactor=0.0;
var spdFwd = 50;
var FLAGctr = 0;
var FLAGfwd = 0;
var FLAGbck = 0;
var FLAGlft = 0;
var FLAGrgt = 0;
//Functions to take key inputs
var Throtlup = function() {if(spdFwd<100) spdFwd+=1};
var Throtldn = function() {if(spdFwd> 0) spdFwd-=1};
var Stickbackward = function() {
if (!FLAGfwd){
FLAGbck=1;
if(loopfactor<rotfactormax){loopfactor+=0.1;}
if(rotX<rotmax){
rotUpdown=Ovoid.Timer.quantum*loopfactor;
rotX+=rotUpdown;
}
else {rotUpdown=0}
}
};
var Stickforward = function() {
if(!FLAGbck){
FLAGfwd=1;
if(loopfactor<rotfactormax){loopfactor+=0.1;}
if(rotX>-rotmax){
rotUpdown=-Ovoid.Timer.quantum*loopfactor;
rotX+=rotUpdown;
}
else {rotUpdown=0}
}
};
var Stickleft = function() {
if(!FLAGrgt){
FLAGlft=1;
FLAGctr=0;
if(turnfactor<rotfactormax){turnfactor+=0.1;}
rotLeftright=Ovoid.Timer.quantum*turnfactor;
rotY+=rotLeftright;
if(rotZ>-rotmax){
rotRoll=-spdFwd/2000;
rotZ+=rotRoll;
}
else {rotRoll=0}
}
};
var Stickright = function() {
if(!FLAGlft){
FLAGrgt=1;
FLAGctr=0;
if(turnfactor<rotfactormax){turnfactor+=0.1;}
rotLeftright=-Ovoid.Timer.quantum*turnfactor;
rotY+=rotLeftright;
if(rotZ<rotmax){
rotRoll=spdFwd/2000;
rotZ+=rotRoll;
}
else {rotRoll=0}
}
};
// stick center from ...
var Stickctrffwd = function() { FLAGfwd = 0; loopfactor=0.0; Stickcenter() ;};
var Stickctrfbck = function() { FLAGbck = 0; loopfactor=0.0; Stickcenter() ;};
var Stickctrflft = function() { FLAGlft = 0; turnfactor=0.0; Stickcenter() ;};
var Stickctrfrgt = function() { FLAGrgt = 0; turnfactor=0.0; Stickcenter() ;};
// autolevel after release left or right, speed dependent
var Stickcenter = function() {
FLAGctr=1;
rotUpdown = 0;
var div = spdFwd+10;
rotLeftright+=-rotLeftright*Ovoid.Timer.quantum*100/div;
rotRoll=-rotZ*Ovoid.Timer.quantum*100/div;
if(rotRoll*rotRoll<0.000000001){rotRoll=0;}
if(rotLeftright*rotLeftright<0.000001){rotLeftright=0;}
if(rotRoll==0 && rotLeftright==0){FLAGctr=0;}
rotZ+=rotRoll;
};
/*
*MAIN
*/
// Main start function
function main()
{
// Place preloadings here
Ovoid.includeOjsScene("models/ojsn/tigermoth.ojsn", myScene);
// Initialize the library
Ovoid.init("canvas");
};
/*
*ONLOAD
*/
// The Ovoid.onload function
Ovoid.onload = function()
{
Ovoid.useScene(myScene);
cube = myScene.search("MOTH3AY-object");
// Create new light node
var light = myScene.create(Ovoid.LIGHT, "PointLight");
// Move the light
light.moveXyz(2.0,2.0,3.0, Ovoid.WORLD, Ovoid.ABSOLUTE);
// bind up and down arrow keys
Ovoid.inputTrigger(null, 38, Ovoid.HELD, Stickforward);
Ovoid.inputTrigger(null, 40, Ovoid.HELD, Stickbackward);
// bind left and right arrow keys
Ovoid.inputTrigger(null, 37, Ovoid.HELD, Stickleft);
Ovoid.inputTrigger(null, 39, Ovoid.HELD, Stickright);
// bind + and - keys for throttle
Ovoid.inputTrigger(null, 61, Ovoid.HELD, Throtlup);
Ovoid.inputTrigger(null,173, Ovoid.HELD, Throtldn);
// center stick
Ovoid.inputTrigger(null, 38, Ovoid.UP, Stickctrffwd);
Ovoid.inputTrigger(null, 40, Ovoid.UP, Stickctrfbck);
Ovoid.inputTrigger(null, 37, Ovoid.UP, Stickctrflft);
Ovoid.inputTrigger(null, 39, Ovoid.UP, Stickctrfrgt);
};
/*
*ONLOOP
*/
// The Ovoid.onloop function
Ovoid.onloop = function()
{
cube.orientXyz(0.0,0.0,rotLeftright,Ovoid.WORLD,Ovoid.RELATIVE);
cube.orientXyz(rotUpdown, 0.0, 0.0, Ovoid.LOCAL, Ovoid.RELATIVE);
cube.orientXyz(0.0, rotRoll, 0.0, Ovoid.LOCAL, Ovoid.RELATIVE);
//function stick center, perhaps run upon set flag by 'UP' triggers
if (FLAGctr){Stickcenter()}
duncanrap("Throttle: "+spdFwd);
//next deals with inaccuracies that build up in coded moth axis rotation system
//takes orientation quaternion, converts to matrix 4, then converts to Euler angles
var m1 = new Ovoid.Matrix4();
var e1 = new Ovoid.Euler();
m1=cube.orientation.asMat4();
e1.fromMat4(m1);
rotX=e1.v[0];
if(FLAGctr){
rotY=e1.v[2];
rotZ=e1.v[1];
}
}; //closes onloop function
</script>
</head>
<body style="text-align:center; margin:0px;" onload="main();">
<p id="rap1">Duncan debug</p>
<canvas id="canvas" width=800 height=600 style="border: 1;"/>
</body>
</html>
|
|
