Skip to content

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

ui_init.js 

- remove backquotes incompatible with minification
- load x3dom-full from html instead (to allow minification)
parent 3cafecd0
Hide whitespace changes
Inline Side-by-side
Showing with 154 additions and 154 deletions
js/ui_init.js
View file @ b6453ceb
......@@ -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
......@@ -91,9 +91,9 @@ $(function(){
title_init();
help_init();
menu_init();
light_init();
});
function title_init(){
......@@ -110,38 +110,38 @@ function title_init(){
"font-family": '"Helvetica Neue", Helvetica, Arial, sans-serif',
"user-select": "none"
});
$("body").append(html);
}
function light_init(){
var x3delement = $("#x3d_id").find("scene");
var model_url = SETTINGS.basepath+"/"+SETTINGS.path+"/"+SETTINGS.version+"/"+SETTINGS.path+".x3d";
var model_back_url = SETTINGS.basepath+"/"+SETTINGS.path+"/"+SETTINGS.version+"/"+SETTINGS.path+"-texture-bgnd-ext.jpeg";
var model = $(`
<group>
<inline name='mymodel' namespacename='mymodel' url='`+model_url+`'></inline>
</group>
<group>
<Background
id="Background"
class="Background"
backUrl= "js/images/background_side.jpeg"
bottomUrl="js/images/background_floor.jpeg"
frontUrl= "`+model_back_url+`"
leftUrl= "js/images/background_side.jpeg"
rightUrl= "js/images/background_side.jpeg"
topUrl= "js/images/background_sky.jpeg">
</Background>
</group>
`);
var model = $([
'<group>',
' <inline name="mymodel" namespacename="mymodel" url="'+model_url+'"></inline>',
'</group>',
'<group>',
' <Background ',
' id="Background"',
' class="Background"',
' backUrl= "js/images/background_side.jpeg"',
' bottomUrl="js/images/background_floor.jpeg"',
' frontUrl= "'+model_back_url+'"',
' leftUrl= "js/images/background_side.jpeg"',
' rightUrl= "js/images/background_side.jpeg"',
' topUrl= "js/images/background_sky.jpeg">',
' </Background>',
'</group>'
].join('\n'));
x3delement.append(model);
$.ajax({
url: SETTINGS.basepath+"/"+SETTINGS.path+"/"+SETTINGS.path+".kml",
success: function(response){
......@@ -149,13 +149,13 @@ function light_init(){
var longitude = parseFloat($(response).find("Camera").find("longitude").text());
var latitude = parseFloat($(response).find("Camera").find("latitude").text());
var altitude = parseFloat($(response).find("Camera").find("altitude").text());
var heading = parseFloat($(response).find("Camera").find("heading").text());
var tilt = parseFloat($(response).find("Camera").find("tilt").text());
var roll = parseFloat($(response).find("Camera").find("roll").text());
var fov = parseFloat($(response).find("Camera").find("fov").text());
Data.camera = new X3L({
x: 0,
y: 0,
......@@ -168,13 +168,13 @@ function light_init(){
roll: roll || 0,
fov: fov || 0,
});
var element = document.getElementById('x3d_id');
Scene = new X3DOMObject(element,Data,{});
Scene.initResize();
$.getScript("js/x3dom/x3dom-full.debug.js",function(){
// $.getScript("js/x3dom/x3dom-full.debug.js",function(){
Map = new LeafletObject('leaflet_map',Data,{});
//wait until it DOM is extended
......@@ -186,39 +186,39 @@ function light_init(){
x3d_initial_camera_placement();
x3d_events();
leaf_events();
};
});
// });
},
});
}
function map_resize_init(){
var html = $("<div>",{id:"map_resizer_handle"});
$("#map_wrapper").append(html);
html.on("mousedown",function(){
$("body").on("mousemove",map_resize);
$(Scene.element).find("canvas").on("mousemove",map_resize);
});
html.on("mouseup",function(){
$("body").off("mousemove",map_resize);
$(Scene.element).find("canvas").off("mousemove",map_resize);
});
}
function map_resize(e){
var xm = e.clientX;
var ym = e.clientY;
......@@ -239,11 +239,11 @@ function map_resize(e){
// from some forum, stackoverflow?
setTimeout(function(){Map._map.invalidateSize();}, 100);
}
function deep_init(){
//Scene.initResize();
Scene.FoVEvents();
Scene.KeyEvents();
......@@ -257,9 +257,9 @@ function deep_init(){
cnt = parseInt(progress_counter[1]);
if (!Scene._X3DOM_SCENE_INIT_DONE&&(cnt==0)){
//Scene.initResize();
// now then all shapes are parsed and accessible
Scene.ShapeEvents();
......@@ -267,7 +267,7 @@ function deep_init(){
}
};
}
function x3d_initial_camera_placement(){
......@@ -275,33 +275,33 @@ function x3d_initial_camera_placement(){
var heading = Data.camera.heading*Math.PI/180;
var tilt = (Data.camera.tilt-90)*Math.PI/180;
var roll = Data.camera.roll*Math.PI/180;
// Altitude is relative. Do not care.
// Heading,Tilt,Roll
var Mh = x3dom.fields.SFMatrix4f.rotationZ(heading);
var Mt = x3dom.fields.SFMatrix4f.rotationY(tilt);
var Mr = x3dom.fields.SFMatrix4f.rotationX(roll);
// rw = real world with North
// w = virtual world = x3dom frame reference
// proper Euler rotation
var R = Mh.mult(Mt).mult(Mr);
// convert to proper Euler
var T = x3dom_toYawPitchRoll();
var R0 = T.inverse().mult(R).mult(T);
// _rw - real world
// _w - virt world
// exclude roll?
//var RC0_rw = T.inverse().mult(Mh).mult(Mt).mult(T);
// exclude tilt and roll
var RC0_rw = T.inverse().mult(Mh).mult(T);
var RC_w = R0.inverse().mult(RC0_rw);
// store matrices
Data.camera.Matrices = {
......@@ -309,9 +309,9 @@ function x3d_initial_camera_placement(){
Up0: RC_w.e1(),
RC_w: RC_w,
};
x3dom_setViewpoint(RC_w);
}
function x3d_events(){
......@@ -319,61 +319,61 @@ function x3d_events(){
var elem = Scene.element;
elem.addEventListener('keydown',function(e){
//console.log("scene keydown");
if ((e.key=="Shift")||(SETTINGS.highlight&&!SETTINGS.pointer)){
// select shape
var sr = elem.runtime.shootRay(e.path[0].mouse_drag_x,e.path[0].mouse_drag_y);
if (!$(sr.pickObject).hasClass("shapemarker")){
X3DOMObject.Shape.highlight(sr.pickObject);
}
}
if (e.key=="Control"){
var x,y,z;
var dist = 1000;
var mouse = x3dom_getXYPosOr(e.path[0].mouse_drag_x,e.path[0].mouse_drag_y,false);
if (mouse.d_xz != null){
dist = parseFloat(mouse.d_xz);
X3DOMObject.Marker.place(mouse.x,mouse.y,mouse.z,"sliding_sphere");
$("#sliding_sphere").find("switch").attr("whichChoice",0);
}
Map.marker.placeSlidingMarker(mouse.a,dist);
}
},true);
elem.addEventListener('keyup',function(e){
if (e.key=="Shift"){
// select shape
var sr = elem.runtime.shootRay(e.path[0].mouse_drag_x,e.path[0].mouse_drag_y);
X3DOMObject.Shape.dehighlight(sr.pickObject);
}
if (e.key=="Control"){
X3DOMObject.Marker.place(0,0,0,"sliding_sphere");
$("#sliding_sphere").find("switch").attr("whichChoice",-1);
Map.marker.removeSlidingMarker();
}
},true);
elem.addEventListener('mousedown',function(){
elem.addEventListener('mousemove',x3d_mouseMove,true);
});
......@@ -383,37 +383,37 @@ function x3d_events(){
});
elem.addEventListener('mouseover',function(e){
// have to focus if want key events to work w/o extra click
Scene.focusOnCanvas();
});
elem.addEventListener('mousemove',function(e){
// have to focus if want key events to work w/o extra click
Scene.focusOnCanvas();
var camera = x3dom_getCameraPosOr(e.clientX,e.clientY,false);
Map.marker.setAltitude(camera.y);
Map.marker.setElevation(camera.e*Math.PI/180);
X3DOMObject.displayInfo(e);
X3DOMObject.displayViewInfo(e);
if (SETTINGS.highlight&&!SETTINGS.pointer){
var sr = elem.runtime.shootRay(e.path[0].mouse_drag_x,e.path[0].mouse_drag_y);
X3DOMObject.Shape.highlight(sr.pickObject);
}
if ((Scene._ctrlKey)||(SETTINGS.pointer)){
// show shadow marker
var mouse = x3dom_getXYPosOr(e.clientX,e.clientY,false);
var dist = parseFloat(mouse.d_xz) || 1000;
Map.marker.placeSlidingMarker(mouse.a,dist);
}else{
......@@ -422,51 +422,51 @@ function x3d_events(){
Map.marker.removeSlidingMarker();
}
if (e.buttons==1){
// upright view
x3dom_setUpRight();
}
// what is this?
//x3d_mouseMove();
},true);
elem.addEventListener('mouseout',function(e){
// hide shadow marker
Map.marker.removeSlidingMarker();
ui_hideMessage("window-info");
});
}
function leaf_events(){
var Camera = Map.marker;
Camera._map.on('mouseover',function(e){
//console.log("map mouseover");
//$(this).focus();
this._container.focus();
});
Camera._map.on('mousemove',function(e){
//console.log("map mousemove");
this._container.focus();
});
/*
});
/*
// this one works
document.getElementById("leaflet_map").addEventListener('keydown',function(e){
console.log("well2");
});
*/
Camera._map.on('click',function(e){
if (e.originalEvent.ctrlKey){
......@@ -474,55 +474,55 @@ function leaf_events(){
var Lm = Camera._measureMarkers[Data.markers.length];
if (Lm!=undefined){
var mark = new X3L({
latitude: Lm._latlng.lat,
longitude: Lm._latlng.lng,
color: SETTINGS.markercolor,
size: SETTINGS.markersize,
});
var p1_ll = Camera._latlng;
var p2_ll = Lm._latlng;
var distance = p1_ll.distanceTo(p2_ll);
p_w = x3dom_delta_map2scene(p1_ll,p2_ll);
mark.x = p_w.x;
mark.y = p_w.y;
mark.z = p_w.z;
mark.d_map = distance;
mark.d_x3d = "<font style='color:red;'>drag over 3D</font>";
Data.markers.push(mark);
X3DOMObject.displayMarkInfo(Data.markers.length-1);
//new X3DOMObject.Marker(mark.x,mark.y,mark.z,true);
new X3DOMObject.Marker(mark.x,mark.y,mark.z,false);
//Scene.createMarker(mark.x,mark.y,mark.z);
//x3d_markerEvents(Data.markers.length-1);
X3DOMObject.MapMarker.registerEvents(Lm);
}
}
});
Camera._map.on('mousedown',function(e){
if (!e.originalEvent.ctrlKey){
Camera._map.on('mousemove',leaf_mousemove,Camera);
Camera._map.on('mouseup',leaf_mouseup,Camera);
}
});
}
......@@ -532,7 +532,7 @@ function leaf_mouseup(e){
var Camera = Map.marker;
Camera._map.off('mousemove',leaf_mousemove,Camera);
Camera._map.off('mousemove',leaf_mouseup,Camera);
Camera.draggedMarker._index = null;
}
......@@ -541,103 +541,103 @@ function leaf_mousemove(e){
// update Scene dragged marker position
leaf_drag_marker();
var hecs = Map.marker.getHCState();
if (hecs){
leaf_mousemove_hc(e)
}else{
leaf_mousemove_nohc(e);
}
}
function leaf_mousemove_hc(){
var Camera = Map.marker;
var altitude = Camera._altitude;
var elevation = Camera._elevation; //rads
x3dom_altelev(altitude,elevation);
X3DOMObject.displayViewInfo({});
}
function leaf_mousemove_nohc(e){
var Camera = Map.marker;
var p0 = new L.LatLng(Data.camera.latitude,Data.camera.longitude);
var p1 = new L.LatLng(Camera._latlng.lat,Camera._latlng.lng);
var dh = Camera._heading - Math.PI/180*Data.camera.heading;
Data.camera.heading = Camera._heading*180/Math.PI;
Data.camera.latitude = Camera._latlng.lat;
Data.camera.longitude = Camera._latlng.lng;
if ((p0.lat!=p1.lat)||(p0.lng!=p1.lng)){
leaf_translation_v1(p0,p1);
}else{
x3dom_rotation(dh);
x3dom_rotation(dh);
}
X3DOMObject.displayViewInfo({});
}
function leaf_drag_marker(){
var Camera = Map.marker;
// update Scene marker position
if (Camera.draggedMarker._index != null){
//console.log(Camera.draggedMarker._latlng);
var index = Camera.draggedMarker._index;
var p1_ll = Camera._latlng;
var p2_ll = Camera.draggedMarker._latlng;
var mark = Data.markers[index];
mark.latitude = p2_ll.lat;
mark.longitude = p2_ll.lng;
var distance = p1_ll.distanceTo(p2_ll);
var dp_w = x3dom_delta_map2scene(p1_ll,p2_ll);
mark.x = dp_w.x;
mark.z = dp_w.z;
mark.d_map = distance;
X3DOMObject.displayMarkInfo(index);
X3DOMObject.Marker.place(mark.x,mark.y,mark.z,"my-sph-"+index);
}
}
function leaf_translation_v1(p0,p1){
var dp_w = x3dom_delta_map2scene(p0,p1);
x3dom_translation(dp_w.x,dp_w.y,dp_w.z);
// if not updated then moving in 3D scene will make it jump
Scene.old_view_translation = x3dom_getViewTranslation(Scene.element);
}
function x3d_mouseMove(){
x3dom_update_map();
}
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