Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
X
x3domlet
Project
Project
Details
Activity
Releases
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
3
Issues
3
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
Elphel
x3domlet
Commits
44765fa1
Commit
44765fa1
authored
Jun 20, 2017
by
Oleg Dzhimiev
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
disabled doubleclick
parent
425f4da4
Changes
5
Show whitespace changes
Inline
Side-by-side
Showing
5 changed files
with
474 additions
and
1 deletion
+474
-1
nomap_init.js
js/nomap_init.js
+116
-0
nomap_vr_init.js
js/nomap_vr_init.js
+114
-0
test.html
test.html
+1
-1
test_nomap.html
test_nomap.html
+29
-0
test_nomap_vr.html
test_nomap_vr.html
+214
-0
No files found.
js/nomap_init.js
0 → 100644
View file @
44765fa1
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 @
44765fa1
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 @
44765fa1
...
@@ -34,7 +34,7 @@
...
@@ -34,7 +34,7 @@
</head>
</head>
<body>
<body>
<div
id=
'x3d_wrapper'
>
<div
id=
'x3d_wrapper'
>
<x3d
id=
"x3d_id"
width=
'1600px'
height=
'800px'
showProgress=
"true"
showStat=
"false"
showLog=
"false"
>
<x3d
id=
"x3d_id"
width=
'1600px'
height=
'800px'
showProgress=
"true"
showStat=
"false"
showLog=
"false"
disableDoubleClick=
"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 @
44765fa1
<!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"
>
<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 @
44765fa1
<!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' 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>
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment