Skip to content

X
x3domlet
Commit 0563cb76 authored by Rurik Bugdanov's avatar Rurik Bugdanov
Browse files
Options

merge

parents 45eda947 f888f6f7
Hide whitespace changes
Inline Side-by-side
Showing with 474 additions and 1 deletion
js/nomap_init.js 0 → 100644
View file @ 0563cb76
var SETTINGS = {
'basepath': "models",
'path' : "1487451413_967079",
'version': "v1"
}
function parseURL(){
var parameters=location.href.replace(/\?/ig,"&").split("&");
for (var i=0;i<parameters.length;i++) parameters[i]=parameters[i].split("=");
for (var i=1;i<parameters.length;i++) {
switch (parameters[i][0]) {
case "path": SETTINGS.path = parameters[i][1]; break;
case "ver": SETTINGS.version = parameters[i][1]; break;
}
}
}
$(function(){
parseURL();
init();
});
function init(){
init_resize();
var x3delement = $("#x3d_id").find("scene");
var model_url = SETTINGS.basepath+"/"+SETTINGS.path+"/"+SETTINGS.version+"/"+SETTINGS.path+".x3d";
console.log(model_url);
var model = $(`
<group>
<inline name='mymodel' namespacename='mymodel' url='`+model_url+`'></inline>
</group>`);
x3delement.append(model);
$.getScript("js/x3dom/x3dom-full.debug.js",function(){
//wait until it DOM is extended
x3dom.runtime.ready = function(){
deep_init();
};
});
}
var resizeTimer = false;
var FOV = 30*Math.PI/180;
function init_resize(){
resize();
//bind resize
$(window).resize(function(){
clearTimeout(resizeTimer);
resizeTimer = window.setTimeout(function(){
resize();
},100);
});
}
function resize(){
var element = document.getElementById('x3d_id');
var w = $(window).width();
var h = $(window).height();
$(element).attr("width",w);
$(element).attr("height",h);
var fov = w/h*FOV;
//fov = Math.PI/2;
setFoV(fov);
}
function setFoV(val){
var element = document.getElementById('x3d_id');
var vp = $(element).find("Viewpoint")[0];
$(vp).prop("fieldOfView",val);
}
var X3DOM_SCENE_INIT_DONE = false;
function deep_init(){
/*
var element = document.getElementById('x3d_id');
element.runtime.enterFrame = function(){
// the only <strong> in the document
var progress_element = $(element).find("strong");
var progress_counter = $(progress_element).html();
progress_counter = progress_counter.split(" ");
cnt = parseInt(progress_counter[1]);
if (!X3DOM_SCENE_INIT_DONE&&(cnt==0)){
X3DOM_SCENE_INIT_DONE = true;
}
};
*/
}
js/nomap_vr_init.js 0 → 100644
View file @ 0563cb76
var SETTINGS = {
'basepath': "models",
'path' : "1487451413_967079",
'version': "v1"
}
function parseURL(){
var parameters=location.href.replace(/\?/ig,"&").split("&");
for (var i=0;i<parameters.length;i++) parameters[i]=parameters[i].split("=");
for (var i=1;i<parameters.length;i++) {
switch (parameters[i][0]) {
case "path": SETTINGS.path = parameters[i][1]; break;
case "ver": SETTINGS.version = parameters[i][1]; break;
}
}
}
$(function(){
parseURL();
init();
});
function init(){
init_resize();
var x3delement = $("#x3d_id").find("scene");
var model_url = SETTINGS.basepath+"/"+SETTINGS.path+"/"+SETTINGS.version+"/"+SETTINGS.path+".x3d";
var model = $(`
<group>
<inline name='mymodel' namespacename='mymodel' url='`+model_url+`'></inline>
</group>`);
x3delement.append(model);
$.getScript("js/x3dom/x3dom-full.debug.js",function(){
//wait until it DOM is extended
x3dom.runtime.ready = function(){
deep_init();
};
});
}
var resizeTimer = false;
var FOV = 30*Math.PI/180;
function init_resize(){
resize();
//bind resize
$(window).resize(function(){
clearTimeout(resizeTimer);
resizeTimer = window.setTimeout(function(){
resize();
},100);
});
}
function resize(){
var element = document.getElementById('x3d_id');
var w = $(window).width();
var h = $(window).height();
$(element).attr("width",w);
$(element).attr("height",h);
var fov = w/h*FOV;
//fov = Math.PI/2;
setFoV(fov);
}
function setFoV(val){
var element = document.getElementById('x3d_id');
var vp = $(element).find("Viewpoint")[0];
$(vp).prop("fieldOfView",val);
}
var X3DOM_SCENE_INIT_DONE = false;
function deep_init(){
/*
var element = document.getElementById('x3d_id');
element.runtime.enterFrame = function(){
// the only <strong> in the document
var progress_element = $(element).find("strong");
var progress_counter = $(progress_element).html();
progress_counter = progress_counter.split(" ");
cnt = parseInt(progress_counter[1]);
if (!X3DOM_SCENE_INIT_DONE&&(cnt==0)){
X3DOM_SCENE_INIT_DONE = true;
}
};
*/
}
test.html
View file @ 0563cb76
...@@ -43,7 +43,7 @@ ...@@ -43,7 +43,7 @@
</head> </head>
<body> <body>
<div id='x3d_wrapper'> <div id='x3d_wrapper'>
<x3d id="x3d_id" width="100%" height="100%" showProgress="true" showStat="false" showLog="false"> <x3d id="x3d_id" width='1600px' height='800px' showProgress="true" showStat="false" showLog="false" disableDoubleClick="true" keysEnabled="true">
<scene> <scene>
<navigationInfo id="navInfo" type='"examine"' speed='0.01'></navigationInfo> <navigationInfo id="navInfo" type='"examine"' speed='0.01'></navigationInfo>
<Viewpoint fieldOfView='1' position='0 0 0' orientation='0 0 1 0'></Viewpoint> <Viewpoint fieldOfView='1' position='0 0 0' orientation='0 0 1 0'></Viewpoint>
......
test_nomap.html 0 → 100644
View file @ 0563cb76
<!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset="utf-8"/>
<title>Scene (NoMap)</title>
<script type='text/javascript' src='js/jquery/jquery-3.1.1.js'></script>
<script type='text/javascript' src='js/nomap_init.js'></script>
<link rel='stylesheet' type='text/css' href='js/x3dom/x3dom.css'></link>
<link rel='stylesheet' type='text/css' href='js/ui.css'></link>
</head>
<body>
<div id='x3d_wrapper'>
<x3d id="x3d_id" width='1600px' height='800px' showProgress="true" showStat="false" showLog="false" disableDoubleClick="true" keysEnabled="true">
<scene>
<navigationInfo id="navInfo" type='"examine" "walk"' speed='0.01'></navigationInfo>
<Viewpoint fieldOfView='1' position='0 0 0' orientation='0 0 1 0'></Viewpoint>
<!-- <group>
<inline name="back" namespacename="back" url="models/m1/v1/background.x3d"/>
</group>-->
</scene>
</x3d>
</div>
</body>
</html>
test_nomap_vr.html 0 → 100644
View file @ 0563cb76
<!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset="utf-8"/>
<title>Scene (NoMap)</title>
<script type='text/javascript' src='js/jquery/jquery-3.1.1.js'></script>
<script type='text/javascript' src='js/x3dom/x3dom-full.debug.js'></script>
<!-- <script type='text/javascript' src='js/nomap_vr_init.js'></script> -->
<link rel='stylesheet' type='text/css' href='js/x3dom/x3dom.css'></link>
<style type='text/css'>
body {margin:0; padding:0; background-color:#04344c; background-color:#ddeeff; }
.stereo-view {float:left; }
.stereo-view x3d {float:left; }
</style>
<script>
// Get display size
var deviceOrientation = 'portrait';
notFirstTime = false;
//alert ('Checking device orientation and display size');
while (deviceOrientation == 'portrait') {
insideWidth = window.innerWidth;
insideHeight = window.innerHeight;
if (insideWidth > insideHeight) {deviceOrientation = 'landscape';}
if (notFirstTime) {alert ("Please oriention device to landscape and press 'OK'");}
notFirstTime = true;
}
x3dWidth = Math.floor((insideWidth-12)/2);
x3dHeight = insideHeight;
//x3dHeight = x3dHeight/2;
x3dHeight = x3dHeight - 2;
</script>
</head>
<body>
<div class='stereo-view-1'>
<!--view-source:http://realism.com/sample/model/stereo/VAM_246-1-1870/model-ig0b75.x3d?=&headlight=true&ipd=30&%20=-->
<!--view-source:http://realism.com/x3d-examples/HTML5-Fall2014/stereo/kelpie.sgl.html -->
<script>
document.writeln ("<x3d id='all_view' showStat='false' showLog='false' disableDoubleClick='true' keysEnabled='true' x='0px' y='0px' width='"+(2*x3dWidth)+"px' height='"+x3dHeight+"px'>");
var x3dDimStr = x3dWidth + ' ' + x3dHeight + ' 4';
</script>
<scene>
<navigationInfo type='"EXAMINE" "WALK"'></navigationInfo>
<background DEF='bgnd'
backUrl= "js/images/background_side.jpeg"
bottomUrl="js/images/background_floor.jpeg"
frontUrl= "models/1488240695_710844/V0/1488240695_710844-texture-bgnd-ext.jpeg"
leftUrl= "js/images/background_side.jpeg"
rightUrl= "js/images/background_side.jpeg"
topUrl= "js/images/background_sky.jpeg">
</background>
<transform translation='0 0 0' rotation='0 1 0 0'>
<viewpoint DEF='viewpoint' id='x3d_viewpoint' position='0 0 0' orientation='0 1 0 0' zNear='0.001' zFar='2000'></viewpoint>
</transform>
<group id='unrendered_scene' render='false'>
<group DEF='scene'>
<transform DEF='Viewpoint-Left' id='x3d_viewpoint' translation='0 0 0' rotation='0 1 0 0'>
<transform DEF='Viewpoint-gamma' id='x3d_viewpoint_gamma' translation='0 0 0' rotation='0 1 0 0'>
<transform DEF='Viewpoint-beta' id='x3d_viewpoint_beta' translation='0 0 0' rotation='1 0 0 0'>
<transform DEF='Viewpoint-alpha' id='x3d_viewpoint_alpha' translation='0 0 0' rotation='0 0 1 0'>
<transform translation='0 0 0'> <!-- account for model center != center-of-mass -->
<inline url='models/1488240695_710844/V0/1488240695_710844.x3d'></inline>
</transform>
</transform>
</transform>
</transform>
</transform>
</group>
</group>
<group DEF='left' render='true'>
<shape>
<appearance>
<!-- The dimensions is the size of each display side -->
<script>
document.writeln ("<renderedTexture interpupillaryDistance='0.3' id='rtLeft' stereoMode='LEFT_EYE' update='ALWAYS' dimensions='"+x3dDimStr+"' repeatS='false' repeatT='false'>");
</script>
<viewpoint USE='viewpoint' containerField='viewpoint'></viewpoint>
<background USE='bgnd' containerField='background'></background>
<group USE='scene' containerField="scene"></group>
</renderedTexture>
<composedShader>
<field name='tex' type='SFInt32' value='0'></field>
<field name='leftEye' type='SFFloat' value='1'></field>
<shaderPart type='VERTEX'>
attribute vec3 position;
attribute vec2 texcoord;
uniform mat4 modelViewProjectionMatrix;
varying vec2 fragTexCoord;
void main()
{
vec2 pos = sign(position.xy);
fragTexCoord = texcoord;
gl_Position = vec4((pos.x/2.0)-0.5, pos.y, 0.0, 1.0);
}
</shaderPart>
<!-- The division of pos.x relates to the fraction of the window that is used -->
<shaderPart DEF="frag" type='FRAGMENT'>
#ifdef GL_ES
precision highp float;
#endif
uniform sampler2D tex;
uniform float leftEye;
varying vec2 fragTexCoord;
void main()
{
gl_FragColor = texture2D(tex, fragTexCoord);
}
</shaderPart>
</composedShader>
</appearance>
<plane solid="false"></plane>
</shape>
</group> <!-- End of tag for left window -->
<group DEF='right'>
<shape>
<appearance>
<script>
document.writeln ("<renderedTexture interpupillaryDistance='0.3' id='rtRight' stereoMode='RIGHT_EYE' update='ALWAYS' dimensions='"+x3dDimStr+"' repeatS='false' repeatT='false'>");
</script>
<viewpoint USE='viewpoint' containerField='viewpoint'></viewpoint>
<background USE='bgnd' containerField='background'></background>
<group USE='scene' containerField="scene"></group>
</renderedTexture>
<composedShader>
<field name='tex' type='SFInt32' value='0'></field>
<field name='leftEye' type='SFFloat' value='0'></field>
<shaderPart type='VERTEX'>
attribute vec3 position;
attribute vec2 texcoord;
uniform mat4 modelViewProjectionMatrix;
varying vec2 fragTexCoord;
void main()
{
vec2 pos = sign(position.xy);
fragTexCoord = texcoord;
gl_Position = vec4((pos.x + 1.0)/2.0, pos.y, 0.0, 1.0);
}
</shaderPart>
<shaderPart USE="frag" type='FRAGMENT'>
</shaderPart>
</composedShader>
</appearance>
<plane solid="false"></plane>
</shape>
</group>
</scene>
</x3d>
</div>
<script language='JavaScript'>
// --> Check to see if there are DeviceOrientation events in the DOM
var previousAngles = {'alpha':0, 'beta':0, 'gamma':0};
var vectors = {'alpha':"0 1 0 ", 'beta':"1 0 0 ", 'gamma':"0 0 1 "};
var deg2rad = Math.PI / 180;
if (window.DeviceOrientationEvent) {
window.addEventListener('deviceorientation', function(eventData) {
gamma = eventData.gamma;
beta = eventData.beta;
alpha = 360-eventData.alpha;
rotate (alpha, 'alpha');
rotate (beta, 'beta');
rotate (gamma, 'gamma');
}, false);
}else{
alert ('No Device Motion Sensor');
}
function rotate (angle, label) {
intAngle = Math.floor(angle + 0.5);
if (intAngle == previousAngles[label]) {return; }
previousAngles[label] = intAngle;
if (label == 'alpha') {
rotateView ("x3d_viewpoint_"+label, vectors[label]+" "+intAngle*deg2rad);
// rotateView ("x3d_viewpointR_"+label, vectors[label]+" "+intAngle*deg2rad);
// rotateView ("x3d_viewpointL_"+label, vectors[label]+" "+intAngle*deg2rad);
}
}
function rotateView (label, vector) {
view = document.getElementById(label);
view.setAttribute('set_rotation',vector);
}
</script>
</body>
</html>
Markdown is supported
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