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
8bc06769
Commit
8bc06769
authored
Jun 28, 2017
by
Rurik Bugdanov
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
remove trailing spaces
parent
f888f6f7
Changes
26
Expand all
Hide whitespace changes
Inline
Side-by-side
Showing
26 changed files
with
1029 additions
and
1030 deletions
+1029
-1030
index.html
index.html
+3
-3
index.css
js/index.css
+1
-1
index.js
js/index.js
+44
-44
L.extra.js
js/leaflet/L.extra.js
+9
-9
leaflet.camera-view-marker-controls.js
js/leaflet/leaflet.camera-view-marker-controls.js
+23
-23
leaflet.camera-view-marker.js
js/leaflet/leaflet.camera-view-marker.js
+114
-114
leaflet.camera-view-marker.measure.js
js/leaflet/leaflet.camera-view-marker.measure.js
+87
-87
leaflet_init.js
js/leaflet_init.js
+20
-20
map.css
js/map.css
+1
-1
map.js
js/map.js
+19
-19
nomap_init.js
js/nomap_init.js
+21
-21
nomap_vr_init.js
js/nomap_vr_init.js
+20
-20
ui.css
js/ui.css
+3
-3
ui_align.js
js/ui_align.js
+14
-14
ui_functions.js
js/ui_functions.js
+7
-7
ui_help.js
js/ui_help.js
+5
-5
ui_init.js
js/ui_init.js
+136
-136
ui_menu.js
js/ui_menu.js
+17
-17
util_functions.js
js/util_functions.js
+20
-20
x3dom.css
js/x3dom/x3dom.css
+9
-9
x3dom_functions.js
js/x3dom_functions.js
+131
-131
x3dom_init.js
js/x3dom_init.js
+274
-275
x3l.js
js/x3l.js
+13
-13
test.html
test.html
+7
-7
test_nomap.html
test_nomap.html
+4
-4
test_nomap_vr.html
test_nomap_vr.html
+27
-27
No files found.
index.html
View file @
8bc06769
...
...
@@ -3,14 +3,14 @@
<head>
<meta
charset=
"utf-8"
/>
<title>
x3d models index
</title>
<script
type=
'text/javascript'
src=
'js/jquery/jquery-3.1.1.js'
></script>
<script
type=
'text/javascript'
src=
'js/leaflet/leaflet-src.js'
></script>
<script
type=
'text/javascript'
src=
'js/index.js'
></script>
<link
rel=
'stylesheet'
type=
'text/css'
href=
'js/leaflet/leaflet.css'
></link>
<link
rel=
'stylesheet'
type=
'text/css'
href=
'js/index.css'
></link>
</head>
<body>
<div
id=
"table_div"
>
...
...
js/index.css
View file @
8bc06769
table
{
border-collapse
:
collapse
;
}
...
...
js/index.js
View file @
8bc06769
...
...
@@ -6,28 +6,28 @@ var markers = [];
$
(
function
(){
//init();
init_maps
();
$
.
ajax
({
url
:
"list.php"
,
success
:
function
(
response
){
List
=
response
;
parse_list
(
response
);
$
(
".arow"
)[
0
].
click
();
}
});
});
function
parse_list
(
res
){
var
index
=
0
;
$
(
res
).
find
(
"model"
).
each
(
function
(){
var
row
=
$
(
"<tr class='arow'>"
);
...
...
@@ -44,60 +44,60 @@ function parse_list(res){
var
vlist
=
""
;
$
(
this
).
find
(
"version"
).
each
(
function
(
i
,
v
){
var
comments
=
$
(
this
).
find
(
"comments"
).
text
();
var
link_url
=
"test.html?path="
+
name
+
"&ver="
+
$
(
this
).
attr
(
"name"
);
var
link
=
"<a title='"
+
comments
+
"' href='"
+
link_url
+
"'>"
+
$
(
this
).
attr
(
"name"
)
+
"</a>, "
;
vlist
+=
link
;
});
vlist
=
vlist
.
slice
(
0
,
-
7
);
row
.
append
(
"<td class='acell' valign='top'><div>"
+
vlist
+
"</div></td>"
);
row
.
attr
(
"index"
,
index
);
register_row_events
(
row
);
$
(
"#model_table"
).
append
(
row
);
//place markers
$
(
this
).
find
(
"Camera"
).
each
(
function
(){
var
lat
=
$
(
this
).
find
(
"latitude"
).
text
();
var
lng
=
$
(
this
).
find
(
"longitude"
).
text
();
if
(
markers
[
lat
+
lng
]
==
undefined
){
var
marker
=
L
.
marker
([
lat
,
lng
]).
addTo
(
map
);
marker
.
bindPopup
(
name
+
": "
+
vlist
,{
direction
:
"top"
,
});
markers
[
lat
+
lng
]
=
marker
;
}
else
{
console
.
log
(
markers
[
lat
+
lng
]);
var
content
=
markers
[
lat
+
lng
].
_popup
.
getContent
();
markers
[
lat
+
lng
].
_popup
.
setContent
(
content
+
"<br/>"
+
name
+
": "
+
vlist
);
}
});
index
++
;
});
}
function
register_row_events
(
elem
){
$
(
elem
).
on
(
"click"
,
function
(){
$
(
".arow"
).
css
({
...
...
@@ -107,30 +107,30 @@ function register_row_events(elem){
$
(
this
).
css
({
background
:
"rgba(100,200,255,0.7)"
});
var
index
=
$
(
this
).
attr
(
"index"
);
var
list
=
$
(
List
).
find
(
"model"
);
var
item
=
list
[
index
];
var
lat
=
$
(
$
(
item
).
find
(
"latitude"
)[
0
]).
text
();
var
lng
=
$
(
$
(
item
).
find
(
"longitude"
)[
0
]).
text
();
map
.
panTo
(
new
L
.
LatLng
(
lat
,
lng
));
if
(
markers
[
lat
+
lng
]
!=
undefined
){
markers
[
lat
+
lng
].
openPopup
();
}
});
}
// maps
function
init_maps
(){
// https: also suppported.
var
Esri_WorldImagery
=
L
.
tileLayer
(
'https://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}'
,
'https://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}'
,
{
maxZoom
:
21
,
attribution
:
'Tiles © Esri — Source: Esri, i-cubed, USDA, USGS, AEX, GeoEye, Getmapping, Aerogrid, IGN, IGP, UPR-EGP, and the GIS User Community'
...
...
@@ -145,35 +145,35 @@ function init_maps(){
subdomains
:[
'mt0'
,
'mt1'
,
'mt2'
,
'mt3'
],
}
);
var
OSMTiles
=
L
.
tileLayer
(
'http://a.tile.openstreetmap.org/{z}/{x}/{y}.png'
,
var
OSMTiles
=
L
.
tileLayer
(
'http://a.tile.openstreetmap.org/{z}/{x}/{y}.png'
,
{
maxZoom
:
21
,
attribution
:
'Map data and images © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, <a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>'
}
);
map
=
L
.
map
(
'leaflet_map'
,{
layers
:[
googleSat
],
zoomControl
:
false
,
}).
setView
([
40.7233861
,
-
111.9328843
],
12
);
new
L
.
Control
.
Zoom
({
position
:
'topright'
}).
addTo
(
map
);
var
baseMaps
=
{
"Esri world imagery"
:
Esri_WorldImagery
,
"Google"
:
googleSat
,
"Open Street Map"
:
OSMTiles
};
//Esri_WorldImagery.addTo(map);
//googleSat.addTo(map);
//custom control:
//http://www.coffeegnome.net/control-button-leaflet/
L
.
control
.
layers
(
baseMaps
).
addTo
(
map
);
}
js/leaflet/L.extra.js
View file @
8bc06769
...
...
@@ -3,27 +3,27 @@
//from here: https://github.com/bbecquet/Leaflet.PolylineDecorator/blob/master/src/L.RotatedMarker.js
L
.
DomUtil
.
TRANSFORM_ORIGIN
=
L
.
DomUtil
.
testProp
([
'transformOrigin'
,
'WebkitTransformOrigin'
,
'OTransformOrigin'
,
'MozTransformOrigin'
,
'msTransformOrigin'
]);
L
.
LatLng
.
prototype
.
CoordinatesOf
=
function
(
angle
,
distance
){
var
d
=
distance
;
var
a
=
angle
*
Math
.
PI
/
180
;
var
lat1
=
this
.
lat
*
Math
.
PI
/
180
;
var
lng1
=
this
.
lng
*
Math
.
PI
/
180
;
var
R
=
L
.
CRS
.
Earth
.
R
;
var
lat2
=
Math
.
asin
(
Math
.
sin
(
lat1
)
*
Math
.
cos
(
d
/
R
)
+
Math
.
cos
(
lat1
)
*
Math
.
sin
(
d
/
R
)
*
Math
.
cos
(
a
));
var
y
=
Math
.
sin
(
a
)
*
Math
.
sin
(
d
/
R
)
*
Math
.
cos
(
lat1
);
var
x
=
Math
.
cos
(
d
/
R
)
-
Math
.
sin
(
lat1
)
*
Math
.
sin
(
lat2
);
var
lng2
=
lng1
+
Math
.
atan2
(
y
,
x
);
lat2
=
lat2
*
180
/
Math
.
PI
;
lng2
=
lng2
*
180
/
Math
.
PI
;
return
new
L
.
LatLng
(
lat2
,
lng2
);
}
...
...
js/leaflet/leaflet.camera-view-marker-controls.js
View file @
8bc06769
(
function
(
window
,
document
,
undefined
)
{
"use strict"
;
L
.
Control
.
CameraViewMarkerControls
=
L
.
Control
.
extend
({
onAdd
:
function
(
map
){
var
name
=
"leaflet-control-heel"
;
var
div
=
L
.
DomUtil
.
create
(
'div'
,
name
+
' leaflet-bar'
);
L
.
DomEvent
.
disableClickPropagation
(
div
);
var
title
=
"Altitude and Elevation control mode"
;
var
label
=
"⇅"
;
//var label = "+";
//var label = "핥";
var
a
=
L
.
DomUtil
.
create
(
'a'
,
'leaflet-control-zoom-in leaflet-interactive'
);
a
.
innerHTML
=
label
;
a
.
title
=
title
;
this
.
_div
=
div
;
this
.
_button
=
a
;
this
.
_state
=
false
;
div
.
appendChild
(
a
);
this
.
_registerEvents
();
return
div
;
},
onRemove
:
function
(){
// Nothing to do here
},
getState
:
function
(){
return
this
.
_state
;
},
_registerEvents
:
function
(){
var
self
=
this
;
L
.
DomEvent
.
on
(
this
.
_button
,
'click'
,
function
(){
self
.
_state
=
!
self
.
_state
;
self
.
_buttonColor
();
},
this
.
_button
);
},
_buttonColor
:
function
(){
if
(
this
.
_state
){
this
.
_button
.
style
.
backgroundColor
=
"rgba(136,255,136,1)"
;
}
else
{
this
.
_button
.
removeAttribute
(
"style"
);
}
}
});
L
.
control
.
cameraViewMarkerControls
=
function
(
options
)
{
return
new
L
.
Control
.
CameraViewMarkerControls
(
options
);
};
}(
this
,
document
));
\ No newline at end of file
js/leaflet/leaflet.camera-view-marker.js
View file @
8bc06769
This diff is collapsed.
Click to expand it.
js/leaflet/leaflet.camera-view-marker.measure.js
View file @
8bc06769
...
...
@@ -9,14 +9,14 @@
https://www.elphel.com
*/
/**
/**
* @file leaflet.camera-view-marker.measure.js
* @brief extends Leaflet.CameraViewMarker with distance measuring tool
*
*
* @copyright Copyright (C) 2017 Elphel Inc.
* @author Oleg Dzhimiev <oleg@elphel.com>
*
* @licstart The following is the entire license notice for the
* @licstart The following is the entire license notice for the
* JavaScript code in this page.
*
* The JavaScript code in this page is free software: you can
...
...
@@ -50,30 +50,30 @@
L
.
CameraViewMarker
.
include
({
createMeasureMarker
:
function
(
param
,
distance
){
var
latlng
=
param
;
// param is event
if
(
param
.
target
){
latlng
=
param
.
latlng
;
}
var
p1_ll
=
this
.
_latlng
;
// param was angle then need distance
if
(
!
(
latlng
instanceof
L
.
LatLng
)){
latlng
=
p1_ll
.
CoordinatesOf
(
param
,
distance
);
}
var
p2_ll
=
latlng
;
var
l_d
=
Array
(
p1_ll
,
p2_ll
);
var
pll
=
L
.
polyline
(
l_d
,
{
color
:
'#1f1'
,
weight
:
1
,
color
:
'#1f1'
,
weight
:
1
,
dashArray
:
"5,5"
}).
addTo
(
this
.
_layerPaint
).
bringToBack
();
//circle
var
tmp_point
=
new
L
.
CircleMarker
(
latlng
,{
color
:
'#1f1'
,
...
...
@@ -82,82 +82,82 @@
fillOpacity
:
0.5
,
radius
:
5
,
}).
addTo
(
this
.
_layerPaint
);
var
distance
=
latlng
.
distanceTo
(
this
.
_latlng
).
toFixed
(
1
);
tmp_point
.
bindTooltip
(
distance
+
' m'
,{
permanent
:
"true"
,
direction
:
"right"
,
className
:
"measurementtooltip"
,
offset
:[
0
,
0
],
}).
openTooltip
();
tmp_point
.
on
(
'click'
,
this
.
_measureMarkerClick
,
this
);
tmp_point
.
on
(
'mousedown'
,
this
.
_dragMeasureMarker
,
this
);
tmp_point
.
_index
=
this
.
_measureMarkers
.
length
;
this
.
_measureMarkers
.
push
(
tmp_point
);
this
.
_measureLines
.
push
(
pll
);
return
tmp_point
.
_index
;
},
moveMeasureMarker
:
function
(
param
,
index
){
var
latlng
=
param
;
if
(
param
.
target
){
index
=
this
.
draggedMarker
.
_index
;
latlng
=
param
.
latlng
;
// prevent image getting grabbed by browser
param
.
originalEvent
.
preventDefault
();
}
var
p1_ll
=
this
.
_latlng
;
var
p2_ll
=
latlng
;
var
l_d
=
Array
(
p1_ll
,
p2_ll
);
this
.
_measureMarkers
[
index
].
setLatLng
(
latlng
);
this
.
_measureLines
[
index
].
setLatLngs
(
l_d
);
var
distance
=
p2_ll
.
distanceTo
(
p1_ll
).
toFixed
(
1
);
this
.
_measureMarkers
[
index
].
_tooltip
.
setContent
(
distance
+
' m'
);
this
.
draggedMarker
=
{
_index
:
index
,
_latlng
:
latlng
};
this
.
_syncMeasureMarkersToBasePoint
();
},
removeMeasureMarker
:
function
(
param
){
var
index
=
param
;
if
(
param
.
target
){
index
=
param
.
target
.
_index
;
L
.
DomEvent
.
stopPropagation
(
param
);
}
this
.
_layerPaint
.
removeLayer
(
this
.
_measureMarkers
[
index
]);
this
.
_layerPaint
.
removeLayer
(
this
.
_measureLines
[
index
]);
this
.
_measureMarkers
.
splice
(
index
,
1
);
this
.
_measureLines
.
splice
(
index
,
1
);
this
.
_updateMeasureMarkersIndices
();
},
placeSlidingMarker
:
function
(
angle
,
distance
){
var
p1_ll
=
this
.
_measureBase
;
var
p2_ll
=
p1_ll
.
CoordinatesOf
(
angle
,
distance
);
var
l_d
=
Array
(
p1_ll
,
p2_ll
);
if
(
this
.
_slidingMarker
==
undefined
){
...
...
@@ -168,43 +168,43 @@
fillOpacity
:
0.5
,
radius
:
5
,
}).
addTo
(
this
.
_layerPaint
);
this
.
_slidingLine
=
L
.
polyline
(
l_d
,
{
color
:
'#1f1'
,
weight
:
1
,
color
:
'#1f1'
,
weight
:
1
,
dashArray
:
"5,5"
}).
addTo
(
this
.
_layerPaint
).
bringToBack
();
this
.
_slidingMarker
.
bindTooltip
(
distance
.
toFixed
(
1
)
+
' m'
,{
permanent
:
"true"
,
direction
:
"right"
,
className
:
"measurementtooltip"
,
offset
:[
0
,
0
],
}).
openTooltip
();
}
else
{
this
.
_slidingMarker
.
setLatLng
(
p2_ll
);
this
.
_slidingLine
.
setLatLngs
(
l_d
);
this
.
_slidingMarker
.
_tooltip
.
setContent
(
distance
.
toFixed
(
1
)
+
' m'
);
}
},
removeSlidingMarker
:
function
(){
if
(
this
.
_slidingMarker
!=
undefined
){
this
.
_layerPaint
.
removeLayer
(
this
.
_slidingMarker
);
this
.
_layerPaint
.
removeLayer
(
this
.
_slidingLine
);
delete
this
.
_slidingMarker
;
delete
this
.
_slidingLine
;
}
},
onAdd
:
function
(){
this
.
_initCameraViewMarker
();
...
...
@@ -213,18 +213,18 @@
},
_initCVM_M
:
function
(){
this
.
_measuring
=
false
;
this
.
_measureMarkers
=
Array
();
this
.
_measureLines
=
Array
();
this
.
_map
.
doubleClickZoom
.
disable
();
this
.
_registerEvents_M
();
this
.
_measureBase
=
this
.
_latlng
;
this
.
draggedMarker
=
{
_index
:
null
,
_latlng
:
null
...
...
@@ -238,7 +238,7 @@
this
.
_map
.
on
(
'mousemove'
,
this
.
_mouseMove_M
,
this
);
this
.
_map
.
on
(
'click'
,
this
.
_toggleMeasureMode
,
this
);
this
.
_map
.
on
(
'mousemove'
,
this
.
_syncMeasureMarkersToBasePoint
,
this
);
},
_mouseMove_M
:
function
(
e
){
...
...
@@ -250,22 +250,22 @@
}
},
_toggleMeasureMode
:
function
(
e
){
if
(
e
.
originalEvent
.
ctrlKey
){
this
.
createMeasureMarker
(
e
);
}
/*
self._measuring = !self._measuring;
if(self._measuring){
self._basePoint.off('mousedown',self._dragCamera, self);
self._map._container.style.cursor = "crosshair";
self._map.on('click', self._placeMeasurePoint, self);
}else{
self._basePoint.on('mousedown',self._dragCamera, self);
self._map._container.style.cursor = "default";
...
...
@@ -273,7 +273,7 @@
}
*/
},
_measureMarkerClick
:
function
(
e
){
if
(
e
.
originalEvent
.
ctrlKey
){
...
...
@@ -281,22 +281,22 @@
}
},
_syncMeasureMarkersToBasePoint
:
function
(
e
){
if
(
this
.
_measureMarkers
.
length
!=
0
){
if
(
this
.
_measureBase
!=
this
.
_latlng
){
var
self
=
this
;
this
.
_measureMarkers
.
forEach
(
function
(
c
,
i
){
var
p1_ll
=
self
.
_latlng
;
var
p2_ll
=
c
.
getLatLng
();
var
l_d
=
Array
(
p1_ll
,
p2_ll
);
self
.
_measureLines
[
i
].
setLatLngs
(
l_d
);
var
distance
=
p2_ll
.
distanceTo
(
p1_ll
).
toFixed
(
1
);
c
.
_tooltip
.
setContent
(
distance
+
' m'
);
});
...
...
@@ -304,54 +304,54 @@
this
.
_measureBase
=
this
.
_latlng
;
}
}
},
_dragMeasureMarker
:
function
(
e
){
if
(
!
e
.
originalEvent
.
ctrlKey
){
this
.
draggedMarker
=
{
_index
:
e
.
target
.
_index
,
_latlng
:
e
.
target
.
_latlng
};
this
.
_map
.
dragging
.
disable
();
this
.
_map
.
off
(
'mousemove'
,
this
.
_mouseMove
,
this
);
this
.
_map
.
off
(
'click'
,
this
.
_mouseClick
,
this
);
this
.
_map
.
on
(
'mousemove'
,
this
.
moveMeasureMarker
,
this
);
this
.
_map
.
on
(
'mouseup'
,
this
.
_mouseUp_M
,
this
);
}
},
_mouseUp_M
:
function
(){
this
.
_map
.
off
(
'mousemove'
,
this
.
moveMeasureMarker
,
this
);
this
.
_map
.
dragging
.
enable
();
this
.
_map
.
on
(
'mousemove'
,
this
.
_mouseMove
,
this
);
this
.
_map
.
off
(
'mouseup'
,
this
.
_mouseUp_M
,
this
);
this
.
draggedMarker
.
_index
=
null
;
},
_updateMeasureMarkersIndices
:
function
(){
var
self
=
this
;
this
.
_measureMarkers
.
forEach
(
function
(
c
,
i
){
self
.
_measureMarkers
[
i
].
_index
=
i
;
});
},
});
}(
this
,
document
));
js/leaflet_init.js
View file @
8bc06769
...
...
@@ -7,14 +7,14 @@
https://www.elphel.com
*/
/**
/**
* @file -
* @brief -
*
*
* @copyright Copyright (C) 2017 Elphel Inc.
* @author Oleg Dzhimiev <oleg@elphel.com>
*
* @licstart The following is the entire license notice for the
* @licstart The following is the entire license notice for the
* JavaScript code in this page.
*
* The JavaScript code in this page is free software: you can
...
...
@@ -51,25 +51,25 @@ var LeafletObject = function(id,data,options){
};
this
.
_settings
=
$
.
extend
(
defaults
,
options
);
this
.
_id
=
id
;
//[40.7233861, -111.9328843];
this
.
center
=
[
data
.
camera
.
latitude
,
data
.
camera
.
longitude
];
this
.
heading
=
data
.
camera
.
heading
;
//this.heading = 0;//data.camera.heading;
this
.
fov
=
data
.
camera
.
fov
;
this
.
initialize
();
};
LeafletObject
.
prototype
.
initialize
=
function
(){
// https: also suppported.
var
Esri_WorldImagery
=
L
.
tileLayer
(
'https://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}'
,
'https://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}'
,
{
maxZoom
:
this
.
_settings
.
maxzoom
,
attribution
:
'Tiles © Esri — Source: Esri, i-cubed, USDA, USGS, AEX, GeoEye, Getmapping, Aerogrid, IGN, IGP, UPR-EGP, and the GIS User Community'
...
...
@@ -84,14 +84,14 @@ LeafletObject.prototype.initialize = function(){
subdomains
:[
'mt0'
,
'mt1'
,
'mt2'
,
'mt3'
],
}
);
var
OSMTiles
=
L
.
tileLayer
(
'http://a.tile.openstreetmap.org/{z}/{x}/{y}.png'
,
var
OSMTiles
=
L
.
tileLayer
(
'http://a.tile.openstreetmap.org/{z}/{x}/{y}.png'
,
{
maxZoom
:
this
.
_settings
.
maxzoom
,
attribution
:
'Map data and images © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, <a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>'
}
);
this
.
_map
=
L
.
map
(
this
.
_id
,{
layers
:[
googleSat
]
}).
setView
(
this
.
center
,
this
.
_settings
.
zoom
);
...
...
@@ -103,13 +103,13 @@ LeafletObject.prototype.initialize = function(){
};
L
.
control
.
layers
(
baseMaps
).
addTo
(
this
.
_map
);
this
.
drawCamera
();
}
LeafletObject
.
prototype
.
drawCamera
=
function
(){
this
.
marker
=
L
.
cameraViewMarker
(
this
.
center
,
{
color
:
'#191'
,
fillColor
:
'#0f3'
,
...
...
@@ -121,7 +121,7 @@ LeafletObject.prototype.drawCamera = function(){
h_control
:
true
,
id
:
"basecircle"
}).
addTo
(
this
.
_map
);
}
LeafletObject
.
prototype
.
highlightMarker
=
function
(
index
){
...
...
@@ -131,13 +131,13 @@ LeafletObject.prototype.highlightMarker = function(index){
this
.
marker
.
_measureMarkers
[
index
].
setStyle
(
style
).
bringToFront
();
this
.
marker
.
_measureMarkers
[
index
].
_tooltip
.
bringToFront
();
this
.
marker
.
_measureLines
[
index
].
setStyle
(
style
).
bringToFront
();
}
LeafletObject
.
prototype
.
dehighlightMarker
=
function
(
index
){
color
=
Data
.
markers
[
index
].
color
;
var
style
=
{
color
:
color
,
fillColor
:
color
};
this
.
marker
.
_measureMarkers
[
index
].
setStyle
(
style
);
...
...
@@ -148,15 +148,15 @@ LeafletObject.prototype.dehighlightMarker = function(index){
LeafletObject
.
prototype
.
toggleMarker
=
function
(
index
){
//console.log("Toggling "+index);
if
(
!
this
.
marker
.
_measureMarkers
[
index
].
_selected
){
this
.
marker
.
_measureMarkers
[
index
].
_selected
=
true
;
}
else
{
this
.
marker
.
_measureMarkers
[
index
].
_selected
=
false
;
}
//console.log(this.marker._measureMarkers[index]._selected);
}
LeafletObject
.
prototype
.
deleteMarker
=
function
(
index
){
...
...
js/map.css
View file @
8bc06769
...
...
@@ -15,7 +15,7 @@ html, body, #leaflet_map {
border-radius
:
1px
;
font-size
:
16px
;
display
:
block
;
position
:
absolute
;
top
:
16px
;
left
:
3px
;
...
...
js/map.js
View file @
8bc06769
/*
/*
* TODO:
* *
*
* *
*
*/
// http://stackoverflow.com/questions/9394190/leaflet-map-api-with-google-satellite-layer
...
...
@@ -14,7 +14,7 @@ $(function(){
});
function
light_init
(){
$
.
ajax
({
url
:
"kml/test.kml"
,
success
:
function
(
data
){
...
...
@@ -23,15 +23,15 @@ function light_init(){
parseFloat
(
$
(
data
).
find
(
"Camera"
).
find
(
"latitude"
).
text
()),
parseFloat
(
$
(
data
).
find
(
"Camera"
).
find
(
"longitude"
).
text
())
];
var
heading
=
parseFloat
(
$
(
data
).
find
(
"Camera"
).
find
(
"longitude"
).
text
());
init_maps
(
marker
);
},
});
}
var
map
;
...
...
@@ -40,10 +40,10 @@ var markers = Array();
function
init_maps
(
center
){
var
elphelinc
=
center
;
//[40.7233861, -111.9328843];
// https: also suppported.
var
Esri_WorldImagery
=
L
.
tileLayer
(
'https://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}'
,
'https://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}'
,
{
maxZoom
:
21
,
attribution
:
'Tiles © Esri — Source: Esri, i-cubed, USDA, USGS, AEX, GeoEye, Getmapping, Aerogrid, IGN, IGP, UPR-EGP, and the GIS User Community'
...
...
@@ -58,14 +58,14 @@ function init_maps(center){
subdomains
:[
'mt0'
,
'mt1'
,
'mt2'
,
'mt3'
],
}
);
var
OSMTiles
=
L
.
tileLayer
(
'http://a.tile.openstreetmap.org/{z}/{x}/{y}.png'
,
var
OSMTiles
=
L
.
tileLayer
(
'http://a.tile.openstreetmap.org/{z}/{x}/{y}.png'
,
{
maxZoom
:
21
,
attribution
:
'Map data and images © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, <a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>'
}
);
map
=
L
.
map
(
'leaflet_map'
,{
layers
:[
googleSat
]
}).
setView
(
elphelinc
,
17
);
...
...
@@ -75,21 +75,21 @@ function init_maps(center){
"Google"
:
googleSat
,
"Open Street Map"
:
OSMTiles
};
//Esri_WorldImagery.addTo(map);
//googleSat.addTo(map);
//custom control:
//http://www.coffeegnome.net/control-button-leaflet/
L
.
control
.
layers
(
baseMaps
).
addTo
(
map
);
drawCamera
(
elphelinc
);
}
function
drawCamera
(
basepoint
){
var
circle
=
L
.
cameraViewMarker
(
basepoint
,
{
color
:
'#191'
,
fillColor
:
'#0f3'
,
...
...
js/nomap_init.js
View file @
8bc06769
...
...
@@ -16,43 +16,43 @@ function parseURL(){
}
$
(
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
...
...
@@ -62,40 +62,40 @@ function init_resize(){
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(){
...
...
js/nomap_vr_init.js
View file @
8bc06769
...
...
@@ -16,41 +16,41 @@ function parseURL(){
}
$
(
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
...
...
@@ -60,40 +60,40 @@ function init_resize(){
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(){
...
...
js/ui.css
View file @
8bc06769
...
...
@@ -53,7 +53,7 @@ html, body, #x3d_wrapper {
border-radius
:
1px
;
font-size
:
16px
;
display
:
block
;
position
:
absolute
;
top
:
16px
;
left
:
3px
;
...
...
@@ -167,7 +167,7 @@ html, body, #x3d_wrapper {
background-image
:
url('images/settings.png')
;
background-size
:
32px
32px
;
background-repeat
:
no-repeat
;
background-color
:
white
;
width
:
32px
;
height
:
32px
;
...
...
@@ -190,7 +190,7 @@ html, body, #x3d_wrapper {
background-image
:
url('images/align.png')
;
background-size
:
32px
32px
;
background-repeat
:
no-repeat
;
background-color
:
white
;
width
:
32px
;
height
:
32px
;
...
...
js/ui_align.js
View file @
8bc06769
function
align_init
(){
$
(
"#align_button"
).
on
(
"click"
,
function
(){
align_heading
();
});
}
function
align_heading
(){
// find selected markers
// pick the first one?
// align?!
console
.
log
(
"heading"
);
var
map_markers
=
Map
.
marker
.
_measureMarkers
;
var
selected_markers
=
[];
map_markers
.
forEach
(
function
(
c
,
i
){
if
(
selected_markers
.
length
<
2
){
if
(
c
.
_selected
){
...
...
@@ -24,26 +24,26 @@ function align_heading(){
}
}
});
if
(
selected_markers
.
length
<
2
){
console
.
log
(
"select 2 markers"
);
Scene
.
showMessage
(
"messagewindow"
,
"error: select 2 markers"
,
"red"
);
}
console
.
log
(
selected_markers
);
}
function
align_roll
(){
console
.
log
(
"roll"
);
}
function
align_tilt
(){
console
.
log
(
"tilt"
);
}
js/ui_functions.js
View file @
8bc06769
// general
/*
*
*
*/
function
ui_showMessage
(
id
,
msg
,
bg
){
if
(
bg
!=
undefined
){
$
(
"#"
+
id
).
css
({
background
:
bg
});
}
$
(
"#"
+
id
).
show
();
$
(
"#"
+
id
).
html
(
$
(
"<div>"
).
html
(
msg
).
css
({
padding
:
"5px 10px"
})).
show
();
}
function
ui_hideMessage
(
id
){
$
(
"#"
+
id
).
hide
();
}
// scene (x3dom)
...
...
js/ui_help.js
View file @
8bc06769
function
help_init
(){
/*
var help_content = `
<div>
...
...
@@ -16,11 +16,11 @@ function help_init(){
display:"none"
}).html(help_content);
*/
var
help
=
$
(
"#help-content"
);
help
.
hide
();
$
(
"#help_button"
).
on
(
"click"
,
function
(){
help
.
show
();
});
...
...
@@ -28,5 +28,5 @@ function help_init(){
help
.
on
(
'click'
,
function
(){
help
.
hide
();
});
}
\ No newline at end of file
js/ui_init.js
View file @
8bc06769
This diff is collapsed.
Click to expand it.
js/ui_menu.js
View file @
8bc06769
...
...
@@ -7,14 +7,14 @@
https://www.elphel.com
*/
/**
/**
* @file -
* @brief -
*
*
* @copyright Copyright (C) 2017 Elphel Inc.
* @author Oleg Dzhimiev <oleg@elphel.com>
*
* @licstart The following is the entire license notice for the
* @licstart The following is the entire license notice for the
* JavaScript code in this page.
*
* The JavaScript code in this page is free software: you can
...
...
@@ -36,7 +36,7 @@
*/
function
menu_init
(){
// init checkboxes
for
(
var
setting
in
SETTINGS
){
if
(
typeof
SETTINGS
[
setting
]
===
'boolean'
){
...
...
@@ -50,29 +50,29 @@ function menu_init(){
$
(
"#"
+
setting
).
val
(
SETTINGS
[
setting
]);
}
}
// init options menu
var
menu
=
$
(
"#menu-content"
);
$
(
"#menu_button"
).
on
(
"click"
,
function
(){
menu
.
show
();
});
// changing a checkbox will not close menu
menu
.
on
(
'click'
,
function
(
e
){
var
test
=
$
(
e
.
target
).
hasClass
(
"donothide"
);
if
(
!
test
){
menu
.
hide
();
}
});
// change checkbox
$
(
".my-check-box"
).
on
(
'click'
,
function
(
e
){
var
state
=
$
(
this
).
prop
(
"checked"
);
var
id
=
$
(
this
).
attr
(
"id"
);
if
(
state
==
true
){
SETTINGS
[
id
]
=
true
;
}
else
{
...
...
@@ -84,9 +84,9 @@ function menu_init(){
crosshair_init
();
shiftspeed_init
();
marker_size_color_init
();
reset_view_init
();
}
...
...
@@ -117,7 +117,7 @@ function shiftspeed_init(){
}
function
marker_size_color_init
(){
$
(
'#markersize'
).
on
(
'change'
,
function
(
e
){
SETTINGS
.
markersize
=
$
(
this
).
val
();
});
...
...
@@ -127,15 +127,15 @@ function marker_size_color_init(){
SETTINGS
.
markercolor
=
$
(
this
).
val
();
});
$
(
'#markercolor'
).
change
();
}
function
reset_view_init
(){
$
(
"#reset_view"
).
on
(
'click'
,
function
(){
x3d_initial_camera_placement
();
x3d_mouseMove
();
Scene
.
resize
();
});
}
\ No newline at end of file
js/util_functions.js
View file @
8bc06769
...
...
@@ -3,37 +3,37 @@
*/
function
convert_color_x2l
(
color
){
var
rgb
=
color
.
split
(
" "
);
var
r
=
parseInt
(
rgb
[
0
]
*
15
);
var
g
=
parseInt
(
rgb
[
1
]
*
15
);
var
b
=
parseInt
(
rgb
[
2
]
*
15
);
r
=
r
.
toString
(
16
);
g
=
g
.
toString
(
16
);
b
=
b
.
toString
(
16
);
return
"#"
+
r
+
g
+
b
;
}
/*
* convert #7f7 to '0.5 1.0 0.5'
*/
function
convert_color_l2x
(
color
){
var
r
=
parseInt
(
color
[
1
],
16
);
var
g
=
parseInt
(
color
[
2
],
16
);
var
b
=
parseInt
(
color
[
3
],
16
);
r
=
r
/
15
;
g
=
g
/
15
;
b
=
b
/
15
;
return
r
+
" "
+
g
+
" "
+
b
;
}
}
// http://www.movable-type.co.uk/scripts/latlong.html
// initial bearing
...
...
@@ -46,17 +46,17 @@ function getAzimuth2(p1,p2){
//p1 - start point
//p2 - end point
var dlat = p2.lat-p1.lat;
var dlon = p2.lng-p1.lng;
var y = Math.sin(dlon)*Math.cos(p2.lat);
var x = Math.cos(p1.lat)*Math.sin(p2.lat)-Math.sin(p1.lat)*Math.cos(p2.lat)*Math.cos(dlon);
var azimuth = ((2*Math.PI + Math.atan2(y,x))*180/Math.PI) % 360;
return azimuth;
}
*/
/*
...
...
@@ -64,18 +64,18 @@ function getAzimuth2(p1,p2){
*/
/*
function getAzimuth(p1_ll,p2_ll){
var Camera = Map.marker;
var p1 = Camera._map.latLngToLayerPoint(p1_ll);
var p2 = Camera._map.latLngToLayerPoint(p2_ll);
var dx = p2.x - p1.x;
var dz = p2.y - p1.y;
var azimuth = (180/Math.PI*Math.atan2(dx,-dz)+360)%360;
return azimuth;
}
*/
\ No newline at end of file
js/x3dom/x3dom.css
View file @
8bc06769
...
...
@@ -18,8 +18,8 @@ X3D, x3d {
border
:
1px
solid
#000
;
}
X3D
:hover
,
x3d
:hover
,
X3D
:hover
,
x3d
:hover
,
.x3dom-canvas
:hover
{
-webkit-user-select
:
none
;
-webkit-touch-callout
:
none
;
...
...
@@ -41,7 +41,7 @@ x3d:hover,
}
.x3dom-canvas
:focus
{
outline
:
none
;
outline
:
none
;
}
.x3dom-progress
{
margin
:
0
;
...
...
@@ -195,12 +195,12 @@ x3d:hover,
opacity
:
0.75
;
}
.x3dom-nox3d
p
{
.x3dom-nox3d
p
{
color
:
#fff
;
font-size
:
14px
;
}
.x3dom-nox3d
a
{
.x3dom-nox3d
a
{
color
:
#fff
;
font-size
:
14px
;
}
...
...
@@ -208,9 +208,9 @@ x3d:hover,
/* self-clearing floats */
.group
:after
{
content
:
"."
;
display
:
block
;
height
:
0
;
clear
:
both
;
content
:
"."
;
display
:
block
;
height
:
0
;
clear
:
both
;
visibility
:
hidden
;
}
js/x3dom_functions.js
View file @
8bc06769
This diff is collapsed.
Click to expand it.
js/x3dom_init.js
View file @
8bc06769
This diff is collapsed.
Click to expand it.
js/x3l.js
View file @
8bc06769
/*
*
*
* Copyright (C) 2017 Elphel Inc.
* License: GPLv3
*
*
*/
var
X3L
=
function
(
options
){
var
defaults
=
{
x
:
0
,
y
:
0
,
z
:
0
,
latitude
:
0
,
longitude
:
0
,
altitude
:
0
,
heading
:
0
,
tilt
:
90
,
roll
:
0
,
fov
:
0
,
color
:
"#1f1"
,
size
:
2
,
};
this
.
_data
=
$
.
extend
(
defaults
,
options
);
this
.
x
=
this
.
_data
.
x
;
this
.
y
=
this
.
_data
.
y
;
this
.
z
=
this
.
_data
.
z
;
this
.
longitude
=
this
.
_data
.
longitude
;
this
.
latitude
=
this
.
_data
.
latitude
;
this
.
altitude
=
this
.
_data
.
altitude
;
this
.
heading
=
this
.
_data
.
heading
;
this
.
tilt
=
this
.
_data
.
tilt
;
this
.
roll
=
this
.
_data
.
roll
;
this
.
fov
=
this
.
_data
.
fov
;
this
.
color
=
this
.
_data
.
color
;
this
.
size
=
this
.
_data
.
size
;
...
...
test.html
View file @
8bc06769
...
...
@@ -3,9 +3,9 @@
<head>
<meta
charset=
"utf-8"
/>
<title>
Scene+Map
</title>
<script
type=
'text/javascript'
src=
'js/jquery/jquery-3.1.1.js'
></script>
<script
type=
'text/javascript'
src=
'js/leaflet/leaflet-src.js'
></script>
<script
type=
'text/javascript'
src=
'js/leaflet/L.extra.js'
></script>
<script
type=
'text/javascript'
src=
'js/leaflet/leaflet.camera-view-marker-controls.js'
></script>
...
...
@@ -14,7 +14,7 @@
<script
type=
'text/javascript'
src=
'js/x3dom_init.js'
></script>
<script
type=
'text/javascript'
src=
'js/x3dom_functions.js'
></script>
<script
type=
'text/javascript'
src=
'js/leaflet_init.js'
></script>
<script
type=
'text/javascript'
src=
'js/x3l.js'
></script>
...
...
@@ -23,14 +23,14 @@
<script
type=
'text/javascript'
src=
'js/ui_help.js'
></script>
<script
type=
'text/javascript'
src=
'js/ui_functions.js'
></script>
<script
type=
'text/javascript'
src=
'js/ui_align.js'
></script>
<script
type=
'text/javascript'
src=
'js/util_functions.js'
></script>
<link
rel=
'stylesheet'
type=
'text/css'
href=
'js/leaflet/leaflet.css'
></link>
<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'
>
...
...
test_nomap.html
View file @
8bc06769
...
...
@@ -3,19 +3,19 @@
<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"
>
<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>
...
...
test_nomap_vr.html
View file @
8bc06769
...
...
@@ -3,14 +3,14 @@
<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
;
}
...
...
@@ -38,28 +38,28 @@
<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"
<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"
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'
>
...
...
@@ -75,7 +75,7 @@
</transform>
</group>
</group>
<group
DEF=
'left'
render=
'true'
>
<shape>
<appearance>
...
...
@@ -83,15 +83,15 @@
<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>
...
...
@@ -106,7 +106,7 @@
{
vec2 pos = sign(position.xy);
fragTexCoord = texcoord;
gl_Position = vec4((pos.x/2.0)-0.5, pos.y, 0.0, 1.0);
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 -->
...
...
@@ -136,15 +136,15 @@
<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>
...
...
@@ -172,7 +172,7 @@
</scene>
</x3d>
</div>
<script
language=
'JavaScript'
>
// --> Check to see if there are DeviceOrientation events in the DOM
...
...
@@ -187,7 +187,7 @@
alpha
=
360
-
eventData
.
alpha
;
rotate
(
alpha
,
'alpha'
);
rotate
(
beta
,
'beta'
);
rotate
(
gamma
,
'gamma'
);
rotate
(
gamma
,
'gamma'
);
},
false
);
}
else
{
alert
(
'No Device Motion Sensor'
);
...
...
@@ -197,14 +197,14 @@
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
);
...
...
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