Skip to content

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

x3dom_init.js 

- remove backquotes incompatibles with minification
parent b6453ceb
Hide whitespace changes
Inline Side-by-side
Showing with 320 additions and 321 deletions
js/x3dom_init.js
View file @ 6188329e
...@@ -7,14 +7,14 @@ ...@@ -7,14 +7,14 @@
https://www.elphel.com https://www.elphel.com
*/ */
/** /**
* @file - * @file -
* @brief - * @brief -
* *
* @copyright Copyright (C) 2017 Elphel Inc. * @copyright Copyright (C) 2017 Elphel Inc.
* @author Oleg Dzhimiev <oleg@elphel.com> * @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. * JavaScript code in this page.
* *
* The JavaScript code in this page is free software: you can * The JavaScript code in this page is free software: you can
...@@ -39,9 +39,9 @@ var X3DOMObject = function(element,data,options){ ...@@ -39,9 +39,9 @@ var X3DOMObject = function(element,data,options){
this.element = element; this.element = element;
this.data = data; this.data = data;
var defaults = { var defaults = {
debug: true, // {boot}, unused debug: true, // {boot}, unused
highlight: true, // {bool}, highlight surfaces on mouseover highlight: true, // {bool}, highlight surfaces on mouseover
fov: 30*Math.PI/180,// {rad}, default vertical fov fov: 30*Math.PI/180,// {rad}, default vertical fov
fov_step: 0.025, // {rad}, min change fov_step: 0.025, // {rad}, min change
...@@ -49,7 +49,7 @@ var X3DOMObject = function(element,data,options){ ...@@ -49,7 +49,7 @@ var X3DOMObject = function(element,data,options){
this._settings = $.extend(defaults,options); this._settings = $.extend(defaults,options);
this._DEBUG = this._settings.debug; this._DEBUG = this._settings.debug;
this._FOV = this._settings.fov; this._FOV = this._settings.fov;
this._FOV_STEP = this._settings.fov_step; this._FOV_STEP = this._settings.fov_step;
this._HIGHLIGHT_ON_MOUSEOVER = this._settings.highlight; this._HIGHLIGHT_ON_MOUSEOVER = this._settings.highlight;
...@@ -57,22 +57,22 @@ var X3DOMObject = function(element,data,options){ ...@@ -57,22 +57,22 @@ var X3DOMObject = function(element,data,options){
// tmp vars // tmp vars
this._resizeTimer = false; this._resizeTimer = false;
this._eventCtrlKey = false; this._eventCtrlKey = false;
this.highlighted_marker_index = null; this.highlighted_marker_index = null;
this.old_view_translation = null; this.old_view_translation = null;
// status vars // status vars
this._X3DOM_SCENE_INIT_DONE = false; this._X3DOM_SCENE_INIT_DONE = false;
this._ctrlKey = false; this._ctrlKey = false;
this._shiftKey = false; this._shiftKey = false;
this.markInfoIndex = null; this.markInfoIndex = null;
}; };
// ui, window // ui, window
X3DOMObject.prototype.initResize = function(){ X3DOMObject.prototype.initResize = function(){
var self = this; var self = this;
self.resize(); self.resize();
...@@ -89,7 +89,7 @@ X3DOMObject.prototype.initResize = function(){ ...@@ -89,7 +89,7 @@ X3DOMObject.prototype.initResize = function(){
// ui, window // ui, window
X3DOMObject.prototype.resize = function(){ X3DOMObject.prototype.resize = function(){
var self = this; var self = this;
var w = $(window).width(); var w = $(window).width();
...@@ -97,7 +97,7 @@ X3DOMObject.prototype.resize = function(){ ...@@ -97,7 +97,7 @@ X3DOMObject.prototype.resize = function(){
$(self.element).attr("width",w); $(self.element).attr("width",w);
$(self.element).attr("height",h); $(self.element).attr("height",h);
$("#crosshair_h").css({ $("#crosshair_h").css({
left: (w/2-$("#crosshair_h").width()/2)+"px", left: (w/2-$("#crosshair_h").width()/2)+"px",
top: (h/2)+"px" top: (h/2)+"px"
...@@ -107,26 +107,26 @@ X3DOMObject.prototype.resize = function(){ ...@@ -107,26 +107,26 @@ X3DOMObject.prototype.resize = function(){
left: (w/2)+"px", left: (w/2)+"px",
top: (h/2-$("#crosshair_v").height()/2)+"px" top: (h/2-$("#crosshair_v").height()/2)+"px"
}); });
var fov = w/h*self._FOV; var fov = w/h*self._FOV;
//fov = Math.PI/2; //fov = Math.PI/2;
self.setFoV(fov); self.setFoV(fov);
self.data.camera.fov = fov; self.data.camera.fov = fov;
if (Map.marker != undefined){ if (Map.marker != undefined){
Map.marker.setFoV(fov); Map.marker.setFoV(fov);
} }
} }
/* /*
X3DOMObject.getX3DOMlibrary = function(){ X3DOMObject.getX3DOMlibrary = function(){
var self = this; var self = this;
$.getScript("js/x3dom-full.debug.js",function(){ $.getScript("js/x3dom-full.debug.js",function(){
//wait until it parsed the DOM //wait until it parsed the DOM
x3dom.runtime.ready = function(){ x3dom.runtime.ready = function(){
...@@ -138,9 +138,9 @@ X3DOMObject.getX3DOMlibrary = function(){ ...@@ -138,9 +138,9 @@ X3DOMObject.getX3DOMlibrary = function(){
// so one doesn't have to click to enable keydown/keyup // so one doesn't have to click to enable keydown/keyup
X3DOMObject.prototype.focusOnCanvas = function(){ X3DOMObject.prototype.focusOnCanvas = function(){
this.element.getElementsByTagName("canvas")[0].focus(); this.element.getElementsByTagName("canvas")[0].focus();
} }
/** /**
...@@ -148,11 +148,11 @@ X3DOMObject.prototype.focusOnCanvas = function(){ ...@@ -148,11 +148,11 @@ X3DOMObject.prototype.focusOnCanvas = function(){
* which was the default action * which was the default action
*/ */
X3DOMObject.prototype.FoVEvents = function(){ X3DOMObject.prototype.FoVEvents = function(){
var self = this; var self = this;
// true = CAPTURING = from parent to child // true = CAPTURING = from parent to child
// canvas is a child of x3d // canvas is a child of x3d
//Chrome?! //Chrome?!
self.element.addEventListener('mousewheel',function(e){ self.element.addEventListener('mousewheel',function(e){
var delta = e.deltaY>0 ? 1 : -1; var delta = e.deltaY>0 ? 1 : -1;
...@@ -162,9 +162,9 @@ X3DOMObject.prototype.FoVEvents = function(){ ...@@ -162,9 +162,9 @@ X3DOMObject.prototype.FoVEvents = function(){
e.stopPropagation(); e.stopPropagation();
return false; return false;
},true); },true);
//Firefox?! //Firefox?!
self.element.addEventListener('DOMMouseScroll',function(e){ self.element.addEventListener('DOMMouseScroll',function(e){
var delta = e.detail>0 ? 1 : -1; var delta = e.detail>0 ? 1 : -1;
self.changeFoV(delta*self._FOV_STEP); self.changeFoV(delta*self._FOV_STEP);
// prevent zoom // prevent zoom
...@@ -172,8 +172,8 @@ X3DOMObject.prototype.FoVEvents = function(){ ...@@ -172,8 +172,8 @@ X3DOMObject.prototype.FoVEvents = function(){
e.stopPropagation(); e.stopPropagation();
return false; return false;
},true); },true);
} }
/** /**
...@@ -184,20 +184,20 @@ X3DOMObject.prototype.changeFoV = function(val){ ...@@ -184,20 +184,20 @@ X3DOMObject.prototype.changeFoV = function(val){
var fov = this.getFoV()+val; var fov = this.getFoV()+val;
this.setFoV(fov); this.setFoV(fov);
// update Map // update Map
Map.marker.setFoV(fov); Map.marker.setFoV(fov);
} }
/** /**
* Set by @val rad * Set by @val rad
*/ */
X3DOMObject.prototype.setFoV = function(val){ X3DOMObject.prototype.setFoV = function(val){
var vp = $(this.element).find("Viewpoint")[0]; var vp = $(this.element).find("Viewpoint")[0];
$(vp).prop("fieldOfView",val); $(vp).prop("fieldOfView",val);
// apply to all viewpoints, but: // apply to all viewpoints, but:
// https://doc.x3dom.org/author/Navigation/Viewpoint.html // https://doc.x3dom.org/author/Navigation/Viewpoint.html
// = correct field of view is not guaranteed in X3DOM // = correct field of view is not guaranteed in X3DOM
...@@ -206,24 +206,24 @@ X3DOMObject.prototype.setFoV = function(val){ ...@@ -206,24 +206,24 @@ X3DOMObject.prototype.setFoV = function(val){
$(this).attr("fieldOfView",fov); $(this).attr("fieldOfView",fov);
}); });
*/ */
} }
/** /**
* Read property from DOM element * Read property from DOM element
*/ */
X3DOMObject.prototype.getFoV = function(){ X3DOMObject.prototype.getFoV = function(){
var vp = $(this.element).find("Viewpoint")[0]; var vp = $(this.element).find("Viewpoint")[0];
return parseFloat($(vp).prop("fieldOfView")); return parseFloat($(vp).prop("fieldOfView"));
} }
/** /**
* Remember which key is pressed - used for mouse moving / dragging * Remember which key is pressed - used for mouse moving / dragging
*/ */
X3DOMObject.prototype.KeyEvents = function(){ X3DOMObject.prototype.KeyEvents = function(){
var self = this; var self = this;
//Chrome?! //Chrome?!
self.element.addEventListener('mousemove',function(e){ self.element.addEventListener('mousemove',function(e){
...@@ -236,7 +236,7 @@ X3DOMObject.prototype.KeyEvents = function(){ ...@@ -236,7 +236,7 @@ X3DOMObject.prototype.KeyEvents = function(){
self._shiftKey = true; self._shiftKey = true;
}else{ }else{
self._shiftKey = false; self._shiftKey = false;
} }
},true); },true);
} }
...@@ -245,13 +245,13 @@ X3DOMObject.prototype.KeyEvents = function(){ ...@@ -245,13 +245,13 @@ X3DOMObject.prototype.KeyEvents = function(){
* The 3D model building blocks are shapes * The 3D model building blocks are shapes
*/ */
X3DOMObject.prototype.ShapeEvents = function(){ X3DOMObject.prototype.ShapeEvents = function(){
var self = this; var self = this;
var tmp = new X3DOMObject.PointerMarker(); var tmp = new X3DOMObject.PointerMarker();
var inlines = $(self.element).find("inline"); var inlines = $(self.element).find("inline");
inlines.each(function(){ inlines.each(function(){
if ($(this).attr("name")!="back"){ if ($(this).attr("name")!="back"){
...@@ -259,15 +259,15 @@ X3DOMObject.prototype.ShapeEvents = function(){ ...@@ -259,15 +259,15 @@ X3DOMObject.prototype.ShapeEvents = function(){
var shapes = $(this).find("Shape"); var shapes = $(this).find("Shape");
shapes.each(function(){ shapes.each(function(){
new X3DOMObject.Shape(this); new X3DOMObject.Shape(this);
}); });
} }
}); });
} }
/** /**
...@@ -275,62 +275,62 @@ X3DOMObject.prototype.ShapeEvents = function(){ ...@@ -275,62 +275,62 @@ X3DOMObject.prototype.ShapeEvents = function(){
*/ */
X3DOMObject.Shape = function(element){ X3DOMObject.Shape = function(element){
this._elem = element this._elem = element
this._registerEvents(); this._registerEvents();
} }
X3DOMObject.Shape.prototype._registerEvents = function(){ X3DOMObject.Shape.prototype._registerEvents = function(){
var self = Scene; var self = Scene;
$(this._elem).on("mousemove",function(e){ $(this._elem).on("mousemove",function(e){
var x = e.originalEvent.worldX; var x = e.originalEvent.worldX;
var y = e.originalEvent.worldY; var y = e.originalEvent.worldY;
var z = e.originalEvent.worldZ; var z = e.originalEvent.worldZ;
if (self._ctrlKey||SETTINGS.pointer){ if (self._ctrlKey||SETTINGS.pointer){
$("#sliding_sphere").find('material').attr("diffuseColor",convert_color_l2x(SETTINGS.markercolor)); $("#sliding_sphere").find('material').attr("diffuseColor",convert_color_l2x(SETTINGS.markercolor));
$("#sliding_sphere").find('Sphere').attr("radius",SETTINGS.markersize/2); $("#sliding_sphere").find('Sphere').attr("radius",SETTINGS.markersize/2);
X3DOMObject.Marker.place(x,y,z,"sliding_sphere"); X3DOMObject.Marker.place(x,y,z,"sliding_sphere");
$("#sliding_sphere").find("switch").attr("whichChoice",0); $("#sliding_sphere").find("switch").attr("whichChoice",0);
}else{ }else{
X3DOMObject.Marker.place(0,0,0,"sliding_sphere"); X3DOMObject.Marker.place(0,0,0,"sliding_sphere");
$("#sliding_sphere").find("switch").attr("whichChoice",-1); $("#sliding_sphere").find("switch").attr("whichChoice",-1);
} }
/* /*
if (!SETTINGS.verticaldrag&&Scene.draggedMarker){ if (!SETTINGS.verticaldrag&&Scene.draggedMarker){
console.log("dragging not vertically"); console.log("dragging not vertically");
//$(Scene.draggedMarker) - get id //$(Scene.draggedMarker) - get id
var sphere = $(Scene.draggedMarker).parent().parent(); var sphere = $(Scene.draggedMarker).parent().parent();
console.log(Scene.draggedMarker.parent().parent()); console.log(Scene.draggedMarker.parent().parent());
var index = parseInt(sphere.attr("id").substr(7)); var index = parseInt(sphere.attr("id").substr(7));
console.log(index); console.log(index);
X3DOMObject.Marker.place(x,y,z,"my-sph-"+index); X3DOMObject.Marker.place(x,y,z,"my-sph-"+index);
} }
*/ */
}); });
$(this._elem).on("click",function(e){ $(this._elem).on("click",function(e){
// if self._shiftKey then the mouse will always be over the pointer marker // if self._shiftKey then the mouse will always be over the pointer marker
if ((self._shiftKey)||(SETTINGS.highlight)){ if ((self._shiftKey)||(SETTINGS.highlight)){
X3DOMObject.Shape.toggle(this); X3DOMObject.Shape.toggle(this);
} }
}); });
$(this._elem).on("mouseover",function(e){ $(this._elem).on("mouseover",function(e){
...@@ -351,13 +351,13 @@ X3DOMObject.Shape.prototype._registerEvents = function(){ ...@@ -351,13 +351,13 @@ X3DOMObject.Shape.prototype._registerEvents = function(){
X3DOMObject.Shape.dehighlight(this); X3DOMObject.Shape.dehighlight(this);
}); });
} }
X3DOMObject.Shape.highlight = function(elem){ X3DOMObject.Shape.highlight = function(elem){
var m = $(elem).find("Material[class='hl']"); var m = $(elem).find("Material[class='hl']");
if (m.length==0){ if (m.length==0){
m = $("<Material>",{class:'hl'}); m = $("<Material>",{class:'hl'});
//m.attr("ambientintensity","1"); //m.attr("ambientintensity","1");
...@@ -369,45 +369,45 @@ X3DOMObject.Shape.highlight = function(elem){ ...@@ -369,45 +369,45 @@ X3DOMObject.Shape.highlight = function(elem){
} }
X3DOMObject.Shape.dehighlight = function(elem){ X3DOMObject.Shape.dehighlight = function(elem){
var self = this; var self = this;
$(elem).find("Appearance").find("Material[class='hl']").remove(); $(elem).find("Appearance").find("Material[class='hl']").remove();
m = $(elem).find("Material[class='sl']"); m = $(elem).find("Material[class='sl']");
if (m.length==1){ if (m.length==1){
X3DOMObject.Shape.select(elem); X3DOMObject.Shape.select(elem);
} }
} }
X3DOMObject.Shape.toggle = function(elem){ X3DOMObject.Shape.toggle = function(elem){
var self = this; var self = this;
var m = $(elem).find("Material[class='sl']"); var m = $(elem).find("Material[class='sl']");
if (m.length!=0){ if (m.length!=0){
X3DOMObject.Shape.deselect(elem); X3DOMObject.Shape.deselect(elem);
}else{ }else{
X3DOMObject.Shape.select(elem); X3DOMObject.Shape.select(elem);
} }
} }
X3DOMObject.Shape.select = function(elem){ X3DOMObject.Shape.select = function(elem){
var self = this; var self = this;
X3DOMObject.Shape.deselect(elem); X3DOMObject.Shape.deselect(elem);
var m = $(elem).find("Material[class='sl']"); var m = $(elem).find("Material[class='sl']");
m = $("<Material>",{class:'sl'}); m = $("<Material>",{class:'sl'});
m.attr("emissiveColor","1 1 1"); m.attr("emissiveColor","1 1 1");
//m.attr("transparency","0"); //m.attr("transparency","0");
$(elem).find("Appearance").append(m); $(elem).find("Appearance").append(m);
} }
X3DOMObject.Shape.deselect = function(elem){ X3DOMObject.Shape.deselect = function(elem){
...@@ -419,14 +419,14 @@ X3DOMObject.Shape.deselect = function(elem){ ...@@ -419,14 +419,14 @@ X3DOMObject.Shape.deselect = function(elem){
X3DOMObject.prototype.createMarker = function(x,y,z,id){ X3DOMObject.prototype.createMarker = function(x,y,z,id){
var self = this; var self = this;
var sph_class = ""; var sph_class = "";
var index = null; var index = null;
var color = convert_color_l2x(SETTINGS.markercolor); var color = convert_color_l2x(SETTINGS.markercolor);
var size = SETTINGS.markersize/2; var size = SETTINGS.markersize/2;
if ((id=="")||(id==undefined)){ if ((id=="")||(id==undefined)){
sph_class = "my-markers"; sph_class = "my-markers";
index = $("."+sph_class).length; index = $("."+sph_class).length;
...@@ -434,38 +434,38 @@ X3DOMObject.prototype.createMarker = function(x,y,z,id){ ...@@ -434,38 +434,38 @@ X3DOMObject.prototype.createMarker = function(x,y,z,id){
color = convert_color_l2x(self.data.markers[index].color); color = convert_color_l2x(self.data.markers[index].color);
size = self.data.markers[index].size/2; size = self.data.markers[index].size/2;
} }
var html = ` var html = [
<group id='`+id+`' class='`+sph_class+`'> '<group id="'+id+'" class="'+sph_class+'">',
<switch whichChoice='0'> ' <switch whichChoice="0">',
<transform translation='`+x+` `+y+` `+z+`' rotation='0 0 0 0'> ' <transform translation="'+x+' '+y+' '+z+'" rotation="0 0 0 0">',
<shape class='shapemarker'> ' <shape class="shapemarker">',
<appearance> ' <appearance>',
<material diffuseColor='`+color+`' transparency='0.0' myColor='`+color+`'></material> ' <material diffuseColor="'+color+'" transparency="0.0" myColor="'+color+'"></material>',
</appearance> ' </appearance>',
<Sphere DEF="sphere" radius="`+size+`" /> ' <Sphere DEF="sphere" radius="'+size+'" />',
</shape> ' </shape>',
</transform> ' </transform>',
</switch> ' </switch>',
</group> '</group>'
`; ].join('\n');
var sphere_element = $(html); var sphere_element = $(html);
$(this.element).find("scene").append(sphere_element); $('scene',this.element).append(sphere_element);
//var shape = $(sphere_element).find("shape"); //var shape = $(sphere_element).find("shape");
//var id_prefix = $(sphere_element).attr("id").substr(0,7); //var id_prefix = $(sphere_element).attr("id").substr(0,7);
return sphere_element; return sphere_element;
// sphere events // sphere events
// Drag, select, delete // Drag, select, delete
// Data.push() // Data.push()
} }
X3DOMObject.prototype.updateMarkersIndices = function(){ X3DOMObject.prototype.updateMarkersIndices = function(){
$(this.element).find(".my-markers").each(function(i,v){ $(this.element).find(".my-markers").each(function(i,v){
$(this).attr("id","my-sph-"+i); $(this).attr("id","my-sph-"+i);
...@@ -474,7 +474,7 @@ X3DOMObject.prototype.updateMarkersIndices = function(){ ...@@ -474,7 +474,7 @@ X3DOMObject.prototype.updateMarkersIndices = function(){
// sphere events // sphere events
// Drag, select, delete // Drag, select, delete
// Data.push() // Data.push()
} }
/** /**
...@@ -482,54 +482,54 @@ X3DOMObject.prototype.updateMarkersIndices = function(){ ...@@ -482,54 +482,54 @@ X3DOMObject.prototype.updateMarkersIndices = function(){
* @ylevel - level height * @ylevel - level height
*/ */
X3DOMObject.Marker = function(x,y,z,ylevel){ X3DOMObject.Marker = function(x,y,z,ylevel){
this._x = x || 0; this._x = x || 0;
this._y = y || 0; this._y = y || 0;
this._z = z || 0; this._z = z || 0;
this._ylevel = ylevel || false; this._ylevel = ylevel || false;
this.init(); this.init();
} }
X3DOMObject.Marker.prototype.init = function(){ X3DOMObject.Marker.prototype.init = function(){
if (this._ylevel){ if (this._ylevel){
//console.log(this._x+" "+this._y+" "+this._z); //console.log(this._x+" "+this._y+" "+this._z);
// temporary solution is to shoot rays - very slow // temporary solution is to shoot rays - very slow
var cPos = Scene.element.runtime.calcCanvasPos(this._x,this._y,this._z); var cPos = Scene.element.runtime.calcCanvasPos(this._x,this._y,this._z);
var cx = cPos[0]; var cx = cPos[0];
var cy = 0; var cy = 0;
var x,y,z,d0,d1; var x,y,z,d0,d1;
var sr; var sr;
d0 = Math.sqrt(this._x*this._x+this._z*this._z); d0 = Math.sqrt(this._x*this._x+this._z*this._z);
for(var i=0;i<$(window).height();i++){ for(var i=0;i<$(window).height();i++){
sr = Scene.element.runtime.shootRay(cx,cy); sr = Scene.element.runtime.shootRay(cx,cy);
if (sr.pickPosition != null){ if (sr.pickPosition != null){
x = sr.pickPosition.x; x = sr.pickPosition.x;
y = sr.pickPosition.y; y = sr.pickPosition.y;
z = sr.pickPosition.z; z = sr.pickPosition.z;
d1 = Math.sqrt(x*x+z*z); d1 = Math.sqrt(x*x+z*z);
if ((d1-d0)<0.1){ if ((d1-d0)<0.1){
this._y = y; this._y = y;
break; break;
} }
} }
cy += 1; cy += 1;
} }
/* /*
//var from = new x3dom.fields.SFVec3f(this._x, 100, this._z); //var from = new x3dom.fields.SFVec3f(this._x, 100, this._z);
var from = new x3dom.fields.SFVec3f(0, 0, 0); var from = new x3dom.fields.SFVec3f(0, 0, 0);
...@@ -537,36 +537,36 @@ X3DOMObject.Marker.prototype.init = function(){ ...@@ -537,36 +537,36 @@ X3DOMObject.Marker.prototype.init = function(){
var dir = new x3dom.fields.SFVec3f(0, -0, -1);//at.subtract(from); var dir = new x3dom.fields.SFVec3f(0, -0, -1);//at.subtract(from);
// dir gets auto normalized // dir gets auto normalized
var vray = new x3dom.fields.Ray(from, dir); var vray = new x3dom.fields.Ray(from, dir);
//var vray = Scene.element.runtime.getViewingRay(0,0); //var vray = Scene.element.runtime.getViewingRay(0,0);
console.log(vray); console.log(vray);
var scene = Scene.element.runtime.canvas.doc._scene; var scene = Scene.element.runtime.canvas.doc._scene;
var info = Scene.element.runtime.canvas.doc._viewarea._pickingInfo; var info = Scene.element.runtime.canvas.doc._viewarea._pickingInfo;
console.log(Scene.element.runtime.pickMode()); console.log(Scene.element.runtime.pickMode());
//console.log(Scene.element.runtime.changePickMode('idbuf')); //console.log(Scene.element.runtime.changePickMode('idbuf'));
//console.log(Scene.element.runtime.changePickMode('color')); //console.log(Scene.element.runtime.changePickMode('color'));
console.log(Scene.element.runtime.changePickMode('texcoord')); console.log(Scene.element.runtime.changePickMode('texcoord'));
//console.log(Scene.element.runtime.changePickMode('box')); //console.log(Scene.element.runtime.changePickMode('box'));
console.log(Scene.element.runtime.pickMode()); console.log(Scene.element.runtime.pickMode());
var isect = scene.doIntersect(vray); var isect = scene.doIntersect(vray);
console.log(info); console.log(info);
console.log("vr"); console.log("vr");
console.log(vray); console.log(vray);
if (vray.hitObject!=null){ if (vray.hitObject!=null){
console.log($(vray.hitObject._xmlNode).parent().find("ImageTexture").attr("url")); console.log($(vray.hitObject._xmlNode).parent().find("ImageTexture").attr("url"));
var el = $(vray.hitObject._xmlNode).parent(); var el = $(vray.hitObject._xmlNode).parent();
var bbox = Scene.element.runtime.getSceneBBox(); var bbox = Scene.element.runtime.getSceneBBox();
console.log(bbox); console.log(bbox);
this._x = vray.hitPoint.x; this._x = vray.hitPoint.x;
this._y = vray.hitPoint.y; this._y = vray.hitPoint.y;
this._z = vray.hitPoint.z; this._z = vray.hitPoint.z;
...@@ -578,14 +578,14 @@ X3DOMObject.Marker.prototype.init = function(){ ...@@ -578,14 +578,14 @@ X3DOMObject.Marker.prototype.init = function(){
var bbox = Scene.element.runtime.getSceneBBox(); var bbox = Scene.element.runtime.getSceneBBox();
console.log(bbox); console.log(bbox);
*/ */
/* /*
var sr = Scene.element.runtime.shootRay(1000,450); var sr = Scene.element.runtime.shootRay(1000,450);
console.log("sr"); console.log("sr");
console.log(sr); console.log(sr);
*/ */
/* /*
//while(vray.hitPoint.y>-100){ //while(vray.hitPoint.y>-100){
var n=0; var n=0;
...@@ -601,48 +601,48 @@ X3DOMObject.Marker.prototype.init = function(){ ...@@ -601,48 +601,48 @@ X3DOMObject.Marker.prototype.init = function(){
} }
*/ */
//do intersect //do intersect
//hitobject //hitobject
//get y //get y
} }
this._elem = Scene.createMarker(this._x,this._y,this._z); this._elem = Scene.createMarker(this._x,this._y,this._z);
this._shape = this._elem.find("shape"); this._shape = this._elem.find("shape");
this._registerEvents(); this._registerEvents();
} }
X3DOMObject.Marker.prototype._registerEvents = function(){ X3DOMObject.Marker.prototype._registerEvents = function(){
var PREFIX = "my-sph-"; var PREFIX = "my-sph-";
var self = this; var self = this;
var marker = this._shape; var marker = this._shape;
//var id_prefix = $(this._elem).attr("id").substr(0,PREFIX.length); //var id_prefix = $(this._elem).attr("id").substr(0,PREFIX.length);
//var index = parseInt($(this._elem).attr("id").substr(PREFIX.length)); //var index = parseInt($(this._elem).attr("id").substr(PREFIX.length));
marker.on('click',function(e){ marker.on('click',function(e){
var elem = $(this).parent().parent().parent(); var elem = $(this).parent().parent().parent();
var index = parseInt($(elem).attr("id").substr(PREFIX.length)); var index = parseInt($(elem).attr("id").substr(PREFIX.length));
var id_prefix = $(elem).attr("id").substr(0,PREFIX.length); var id_prefix = $(elem).attr("id").substr(0,PREFIX.length);
//self.dehighlight(); //self.dehighlight();
//X3DOMObject.PointerMarker.dehighlight(self._elem); //X3DOMObject.PointerMarker.dehighlight(self._elem);
if (Scene._ctrlKey){ if (Scene._ctrlKey){
if (id_prefix==PREFIX){ if (id_prefix==PREFIX){
elem.remove(); elem.remove();
// REMOVE // REMOVE
Data.markers.splice(index,1); Data.markers.splice(index,1);
Scene.updateMarkersIndices(); Scene.updateMarkersIndices();
Map.deleteMarker(index); Map.deleteMarker(index);
} }
}else{ }else{
...@@ -651,38 +651,38 @@ X3DOMObject.Marker.prototype._registerEvents = function(){ ...@@ -651,38 +651,38 @@ X3DOMObject.Marker.prototype._registerEvents = function(){
Map.toggleMarker(index); Map.toggleMarker(index);
} }
}); });
marker.on('mouseover',function(e){ marker.on('mouseover',function(e){
var elem = $(this).parent().parent().parent(); var elem = $(this).parent().parent().parent();
var index = parseInt($(elem).attr("id").substr(PREFIX.length)); var index = parseInt($(elem).attr("id").substr(PREFIX.length));
var id_prefix = $(elem).attr("id").substr(0,PREFIX.length); var id_prefix = $(elem).attr("id").substr(0,PREFIX.length);
X3DOMObject.Marker.highlight(elem); X3DOMObject.Marker.highlight(elem);
Map.highlightMarker(index); Map.highlightMarker(index);
Scene.highlighted_marker_index = index; Scene.highlighted_marker_index = index;
if (Scene._ctrlKey){ if (Scene._ctrlKey){
if (id_prefix==PREFIX){ if (id_prefix==PREFIX){
$("#sliding_sphere").find("switch").attr("whichChoice",-1); $("#sliding_sphere").find("switch").attr("whichChoice",-1);
} }
} }
}); });
/* /*
marker.addEventListener('mouseover',function(){ marker.addEventListener('mouseover',function(){
Scene.showMessage("infowindow","X"); Scene.showMessage("infowindow","X");
},true); },true);
*/ */
marker.on('mouseout',function(e){ marker.on('mouseout',function(e){
var elem = $(this).parent().parent().parent(); var elem = $(this).parent().parent().parent();
var index = parseInt($(elem).attr("id").substr(PREFIX.length)); var index = parseInt($(elem).attr("id").substr(PREFIX.length));
...@@ -690,7 +690,7 @@ X3DOMObject.Marker.prototype._registerEvents = function(){ ...@@ -690,7 +690,7 @@ X3DOMObject.Marker.prototype._registerEvents = function(){
Scene.highlighted_marker_index = null; Scene.highlighted_marker_index = null;
if (Scene.draggedTransformNode==null){ if (Scene.draggedTransformNode==null){
if (!elem.prop("selected")){ if (!elem.prop("selected")){
X3DOMObject.Marker.dehighlight(elem); X3DOMObject.Marker.dehighlight(elem);
Map.dehighlightMarker(index); Map.dehighlightMarker(index);
...@@ -700,39 +700,39 @@ X3DOMObject.Marker.prototype._registerEvents = function(){ ...@@ -700,39 +700,39 @@ X3DOMObject.Marker.prototype._registerEvents = function(){
} }
} }
}); });
marker.on('mousedown',function(e){ marker.on('mousedown',function(e){
var elem = $(this).parent().parent().parent(); var elem = $(this).parent().parent().parent();
var index = parseInt($(elem).attr("id").substr(PREFIX.length)); var index = parseInt($(elem).attr("id").substr(PREFIX.length));
X3DOMObject.Marker.dehighlight(elem); X3DOMObject.Marker.dehighlight(elem);
Map.dehighlightMarker(index); Map.dehighlightMarker(index);
document.getElementById("navInfo").setAttribute("type", '"NONE"'); document.getElementById("navInfo").setAttribute("type", '"NONE"');
Scene.lastMouseX = event.offsetX; Scene.lastMouseX = event.offsetX;
Scene.lastMouseY = event.offsetY; Scene.lastMouseY = event.offsetY;
X3DOMObject.Marker.dragStart(this); X3DOMObject.Marker.dragStart(this);
Scene.element.addEventListener('mousemove',X3DOMObject.Marker.mouseMove,true); Scene.element.addEventListener('mousemove',X3DOMObject.Marker.mouseMove,true);
Scene.element.addEventListener('mouseup',X3DOMObject.Marker.mouseUp,true); Scene.element.addEventListener('mouseup',X3DOMObject.Marker.mouseUp,true);
}); });
marker.on('mouseup',function(e){ marker.on('mouseup',function(e){
var elem = $(this).parent().parent().parent(); var elem = $(this).parent().parent().parent();
var index = parseInt($(elem).attr("id").substr(PREFIX.length)); var index = parseInt($(elem).attr("id").substr(PREFIX.length));
X3DOMObject.Marker.highlight(elem); X3DOMObject.Marker.highlight(elem);
Map.highlightMarker(index); Map.highlightMarker(index);
}); });
} }
X3DOMObject.Marker.mouseUp = function(){ X3DOMObject.Marker.mouseUp = function(){
...@@ -745,18 +745,18 @@ X3DOMObject.Marker.mouseUp = function(){ ...@@ -745,18 +745,18 @@ X3DOMObject.Marker.mouseUp = function(){
X3DOMObject.Marker.toggle(elem); X3DOMObject.Marker.toggle(elem);
} }
*/ */
Scene.element.removeEventListener('mouseup',X3DOMObject.Marker.mouseUp,true); Scene.element.removeEventListener('mouseup',X3DOMObject.Marker.mouseUp,true);
Scene.element.removeEventListener('mousemove',X3DOMObject.Marker.mouseMove,true); Scene.element.removeEventListener('mousemove',X3DOMObject.Marker.mouseMove,true);
Scene.draggedTransformNode = null; Scene.draggedTransformNode = null;
Scene.draggingUpVec = null; Scene.draggingUpVec = null;
Scene.draggingRightVec = null; Scene.draggingRightVec = null;
Scene.unsnappedDragPos = null; Scene.unsnappedDragPos = null;
Scene.markerdragged = false; Scene.markerdragged = false;
document.getElementById("navInfo").setAttribute("type",'"examine"'); document.getElementById("navInfo").setAttribute("type",'"examine"');
} }
// from https://x3dom.org/x3dom/example/MovingObjectsWithDOMEvents.html // from https://x3dom.org/x3dom/example/MovingObjectsWithDOMEvents.html
...@@ -766,13 +766,13 @@ X3DOMObject.Marker.dragStart = function(elem){ ...@@ -766,13 +766,13 @@ X3DOMObject.Marker.dragStart = function(elem){
var transformNode = $(elem).parent(); var transformNode = $(elem).parent();
var tr0 = $(transformNode).attr("translation"); var tr0 = $(transformNode).attr("translation");
Scene.draggedTransformNode = transformNode; Scene.draggedTransformNode = transformNode;
Scene.unsnappedDragPos = new x3dom.fields.SFVec3f.parse(tr0); Scene.unsnappedDragPos = new x3dom.fields.SFVec3f.parse(tr0);
//compute the dragging vectors in world coordinates //compute the dragging vectors in world coordinates
//(since navigation is disabled, those will not change until dragging has been finished) //(since navigation is disabled, those will not change until dragging has been finished)
var vMatInv = Scene.element.runtime.viewMatrix().inverse(); var vMatInv = Scene.element.runtime.viewMatrix().inverse();
var viewDir = vMatInv.multMatrixVec(new x3dom.fields.SFVec3f(0.0, 0.0, -1.0)); var viewDir = vMatInv.multMatrixVec(new x3dom.fields.SFVec3f(0.0, 0.0, -1.0));
...@@ -787,18 +787,18 @@ X3DOMObject.Marker.dragStart = function(elem){ ...@@ -787,18 +787,18 @@ X3DOMObject.Marker.dragStart = function(elem){
var magnificationFactor = 1.0 / Math.abs(p1[0] - p2[0]); var magnificationFactor = 1.0 / Math.abs(p1[0] - p2[0]);
//scale up vector and right vector accordingly //scale up vector and right vector accordingly
Scene.draggingUpVec = Scene.draggingUpVec.multiply(magnificationFactor); Scene.draggingUpVec = Scene.draggingUpVec.multiply(magnificationFactor);
Scene.draggingRightVec = Scene.draggingRightVec.multiply(magnificationFactor); Scene.draggingRightVec = Scene.draggingRightVec.multiply(magnificationFactor);
} }
X3DOMObject.Marker.mouseMove = function(event){ X3DOMObject.Marker.mouseMove = function(event){
Scene.markerdragged = true; Scene.markerdragged = true;
X3DOMObject.Marker.highlight(Scene.draggedTransformNode.parent().parent()); X3DOMObject.Marker.highlight(Scene.draggedTransformNode.parent().parent());
//offsetX / offsetY polyfill for FF //offsetX / offsetY polyfill for FF
var target = event.target || event.srcElement; var target = event.target || event.srcElement;
var rect = target.getBoundingClientRect(); var rect = target.getBoundingClientRect();
...@@ -824,15 +824,15 @@ X3DOMObject.Marker.mouseMove = function(event){ ...@@ -824,15 +824,15 @@ X3DOMObject.Marker.mouseMove = function(event){
if (!$(sr.pickObject).hasClass("shapemarker")){ if (!$(sr.pickObject).hasClass("shapemarker")){
var sphere = Scene.draggedTransformNode.parent().parent(); var sphere = Scene.draggedTransformNode.parent().parent();
var index = parseInt(sphere.attr("id").substr(7)); var index = parseInt(sphere.attr("id").substr(7));
X3DOMObject.Marker.place(sr.pickPosition.x,sr.pickPosition.y,sr.pickPosition.z,"my-sph-"+index); X3DOMObject.Marker.place(sr.pickPosition.x,sr.pickPosition.y,sr.pickPosition.z,"my-sph-"+index);
//console.log("got shape"); //console.log("got shape");
//Scene.draggedTransformNode //Scene.draggedTransformNode
X3DOMObject.Marker.slide(index,sr.pickPosition.x,sr.pickPosition.y,sr.pickPosition.z); X3DOMObject.Marker.slide(index,sr.pickPosition.x,sr.pickPosition.y,sr.pickPosition.z);
X3DOMObject.displayInfo(event); X3DOMObject.displayInfo(event);
X3DOMObject.displayViewInfo(event); X3DOMObject.displayViewInfo(event);
} }
} }
} }
...@@ -840,11 +840,11 @@ X3DOMObject.Marker.mouseMove = function(event){ ...@@ -840,11 +840,11 @@ X3DOMObject.Marker.mouseMove = function(event){
Scene.lastMouseX = event.offsetX; Scene.lastMouseX = event.offsetX;
Scene.lastMouseY = event.offsetY; Scene.lastMouseY = event.offsetY;
} }
X3DOMObject.Marker.drag = function(dx,dy){ X3DOMObject.Marker.drag = function(dx,dy){
var offsetUp = Scene.draggingUpVec.multiply(-dy); var offsetUp = Scene.draggingUpVec.multiply(-dy);
var offsetRight = Scene.draggingRightVec.multiply(dx); var offsetRight = Scene.draggingRightVec.multiply(dx);
...@@ -854,23 +854,23 @@ X3DOMObject.Marker.drag = function(dx,dy){ ...@@ -854,23 +854,23 @@ X3DOMObject.Marker.drag = function(dx,dy){
var sphere = $(Scene.draggedTransformNode).parent().parent(); var sphere = $(Scene.draggedTransformNode).parent().parent();
var index = parseInt(sphere.attr("id").substr(7)); var index = parseInt(sphere.attr("id").substr(7));
X3DOMObject.Marker.slide(index,Scene.unsnappedDragPos.x,Scene.unsnappedDragPos.y,Scene.unsnappedDragPos.z); X3DOMObject.Marker.slide(index,Scene.unsnappedDragPos.x,Scene.unsnappedDragPos.y,Scene.unsnappedDragPos.z);
} }
X3DOMObject.Marker.slide = function(index,x,y,z){ X3DOMObject.Marker.slide = function(index,x,y,z){
var da = x3dom_getDistAngle(x,y,z); var da = x3dom_getDistAngle(x,y,z);
var distance = da[0]; var distance = da[0];
var angle = da[1]; var angle = da[1];
var p1_ll = Map.marker._latlng; var p1_ll = Map.marker._latlng;
var p2_ll = p1_ll.CoordinatesOf(angle,distance); var p2_ll = p1_ll.CoordinatesOf(angle,distance);
var c = Data.markers[index]; var c = Data.markers[index];
c.x = x; c.x = x;
c.y = y; c.y = y;
c.z = z; c.z = z;
...@@ -879,53 +879,53 @@ X3DOMObject.Marker.slide = function(index,x,y,z){ ...@@ -879,53 +879,53 @@ X3DOMObject.Marker.slide = function(index,x,y,z){
c.altitude = c.y; c.altitude = c.y;
//d_x3d - map distance calculated from the model //d_x3d - map distance calculated from the model
c.d_x3d = distance; c.d_x3d = distance;
X3DOMObject.displayMarkInfo(index); X3DOMObject.displayMarkInfo(index);
X3DOMObject.displayInfo({}); X3DOMObject.displayInfo({});
Map.marker.moveMeasureMarker(p2_ll,index); Map.marker.moveMeasureMarker(p2_ll,index);
} }
X3DOMObject.Marker.place = function(x,y,z,id){ X3DOMObject.Marker.place = function(x,y,z,id){
var tr = $("#"+id).find("transform"); var tr = $("#"+id).find("transform");
$(tr).attr("translation",x+" "+y+" "+z); $(tr).attr("translation",x+" "+y+" "+z);
} }
X3DOMObject.Marker.highlight = function(elem){ X3DOMObject.Marker.highlight = function(elem){
var color = "1 0.5 0.5"; var color = "1 0.5 0.5";
elem.find('material').attr("diffuseColor",color); elem.find('material').attr("diffuseColor",color);
} }
X3DOMObject.Marker.dehighlight = function(elem){ X3DOMObject.Marker.dehighlight = function(elem){
//var color = "0.07 1 0.07"; //var color = "0.07 1 0.07";
var color = elem.find('material').attr("myColor"); var color = elem.find('material').attr("myColor");
elem.find('material').attr("diffuseColor",color); elem.find('material').attr("diffuseColor",color);
} }
X3DOMObject.Marker.toggle = function(elem){ X3DOMObject.Marker.toggle = function(elem){
if (elem.prop("selected")){ if (elem.prop("selected")){
elem.prop("selected",false); elem.prop("selected",false);
}else{ }else{
elem.prop("selected",true); elem.prop("selected",true);
} }
} }
// PointerMarker // PointerMarker
X3DOMObject.PointerMarker = function(){ X3DOMObject.PointerMarker = function(){
//init //init
this._init(); this._init();
}; };
X3DOMObject.PointerMarker.prototype._init = function(){ X3DOMObject.PointerMarker.prototype._init = function(){
...@@ -933,23 +933,23 @@ X3DOMObject.PointerMarker.prototype._init = function(){ ...@@ -933,23 +933,23 @@ X3DOMObject.PointerMarker.prototype._init = function(){
this._elem = Scene.createMarker(0,0,0,"sliding_sphere"); this._elem = Scene.createMarker(0,0,0,"sliding_sphere");
this._shape = this._elem.find("shape"); this._shape = this._elem.find("shape");
this._registerEvents(); this._registerEvents();
this._elem.find("switch").attr("whichChoice",-1); this._elem.find("switch").attr("whichChoice",-1);
} }
X3DOMObject.PointerMarker.prototype._registerEvents = function(){ X3DOMObject.PointerMarker.prototype._registerEvents = function(){
var self = this; var self = this;
var Camera = Map.marker; var Camera = Map.marker;
self._shape.on("click",function(e){ self._shape.on("click",function(e){
X3DOMObject.Marker.dehighlight(self._elem); X3DOMObject.Marker.dehighlight(self._elem);
var xyz = $(this).parent().attr("translation"); var xyz = $(this).parent().attr("translation");
xyz = xyz.split(" "); xyz = xyz.split(" ");
// Create marker for Data // Create marker for Data
var mark = new X3L({ var mark = new X3L({
x: parseFloat(xyz[0]) || 0, x: parseFloat(xyz[0]) || 0,
...@@ -958,44 +958,44 @@ X3DOMObject.PointerMarker.prototype._registerEvents = function(){ ...@@ -958,44 +958,44 @@ X3DOMObject.PointerMarker.prototype._registerEvents = function(){
color: SETTINGS.markercolor, color: SETTINGS.markercolor,
size: SETTINGS.markersize, size: SETTINGS.markersize,
}); });
mark.d_x3d = Math.sqrt(mark.x*mark.x+mark.z*mark.z); mark.d_x3d = Math.sqrt(mark.x*mark.x+mark.z*mark.z);
mark.d_map = "<font style='color:red;'>drag over map</font>"; mark.d_map = "<font style='color:red;'>drag over map</font>";
Data.markers.push(mark); Data.markers.push(mark);
X3DOMObject.displayMarkInfo(Data.markers.length-1); X3DOMObject.displayMarkInfo(Data.markers.length-1);
// Create marker on the scene // Create marker on the scene
new X3DOMObject.Marker(mark.x,mark.y,mark.z); new X3DOMObject.Marker(mark.x,mark.y,mark.z);
var da = x3dom_getDistAngle(mark.x,mark.y,mark.z); var da = x3dom_getDistAngle(mark.x,mark.y,mark.z);
var distance = da[0]; var distance = da[0];
var angle = da[1]; var angle = da[1];
// Create marker on the map // Create marker on the map
Camera.createMeasureMarker(angle,distance); Camera.createMeasureMarker(angle,distance);
var map_mark = Camera._measureMarkers[Camera._measureMarkers.length-1]; var map_mark = Camera._measureMarkers[Camera._measureMarkers.length-1];
// Update marker in Data // Update marker in Data
mark.latitude = map_mark._latlng.lat; mark.latitude = map_mark._latlng.lat;
mark.longitude = map_mark._latlng.lng; mark.longitude = map_mark._latlng.lng;
// register events for a new marker in Data // register events for a new marker in Data
X3DOMObject.MapMarker.registerEvents(map_mark); X3DOMObject.MapMarker.registerEvents(map_mark);
// need? // need?
Camera._syncMeasureMarkersToBasePoint(); Camera._syncMeasureMarkersToBasePoint();
}); });
self._shape.on("mousedown",function(e){ self._shape.on("mousedown",function(e){
X3DOMObject.Marker.highlight(self._elem); X3DOMObject.Marker.highlight(self._elem);
}); });
} }
/** /**
...@@ -1004,27 +1004,27 @@ X3DOMObject.PointerMarker.prototype._registerEvents = function(){ ...@@ -1004,27 +1004,27 @@ X3DOMObject.PointerMarker.prototype._registerEvents = function(){
X3DOMObject.MapMarker = {}; X3DOMObject.MapMarker = {};
X3DOMObject.MapMarker.registerEvents = function(map_mark){ X3DOMObject.MapMarker.registerEvents = function(map_mark){
var Camera = Map.marker; var Camera = Map.marker;
map_mark.on('mouseover',function(){ map_mark.on('mouseover',function(){
//console.log(this._index); //console.log(this._index);
var index = this._index; var index = this._index;
var elem = $("#my-sph-"+index); var elem = $("#my-sph-"+index);
X3DOMObject.Marker.highlight(elem); X3DOMObject.Marker.highlight(elem);
Map.highlightMarker(index); Map.highlightMarker(index);
}); });
map_mark.on('mouseout',function(){ map_mark.on('mouseout',function(){
var index = this._index; var index = this._index;
var elem = $("#my-sph-"+index); var elem = $("#my-sph-"+index);
if (Camera.draggedMarker._index!=index){ if (Camera.draggedMarker._index!=index){
if (!this._selected){ if (!this._selected){
X3DOMObject.Marker.dehighlight(elem); X3DOMObject.Marker.dehighlight(elem);
Map.dehighlightMarker(index); Map.dehighlightMarker(index);
...@@ -1032,110 +1032,110 @@ X3DOMObject.MapMarker.registerEvents = function(map_mark){ ...@@ -1032,110 +1032,110 @@ X3DOMObject.MapMarker.registerEvents = function(map_mark){
} }
}); });
/* /*
map_mark.on('click',function(e){ map_mark.on('click',function(e){
var index = this._index var index = this._index
var elem = $("#my-sph-"+index); var elem = $("#my-sph-"+index);
X3DOMObject.Marker.toggle(elem); X3DOMObject.Marker.toggle(elem);
Map.toggleMarker(index); Map.toggleMarker(index);
//if ctrl - remove //if ctrl - remove
//Data.markers.splice(index); //Data.markers.splice(index);
//Scene.updateMarkersIndices(); //Scene.updateMarkersIndices();
}); });
*/ */
map_mark.on('mousedown',function(){ map_mark.on('mousedown',function(){
var index = this._index; var index = this._index;
var elem = $("#my-sph-"+index); var elem = $("#my-sph-"+index);
X3DOMObject.Marker.dehighlight(elem); X3DOMObject.Marker.dehighlight(elem);
Map.dehighlightMarker(index); Map.dehighlightMarker(index);
}); });
map_mark.on('mouseup',function(e){ map_mark.on('mouseup',function(e){
var index = this._index; var index = this._index;
var elem = $("#my-sph-"+index); var elem = $("#my-sph-"+index);
if (e.originalEvent.ctrlKey){ if (e.originalEvent.ctrlKey){
// from Data // from Data
Data.markers.splice(index); Data.markers.splice(index);
// from Map (indices get updated) // from Map (indices get updated)
Map.deleteMarker(index); Map.deleteMarker(index);
// from Scene // from Scene
elem.remove(); elem.remove();
Scene.updateMarkersIndices(); Scene.updateMarkersIndices();
}else{ }else{
X3DOMObject.Marker.toggle(elem); X3DOMObject.Marker.toggle(elem);
Map.toggleMarker(index); Map.toggleMarker(index);
X3DOMObject.Marker.highlight(elem); X3DOMObject.Marker.highlight(elem);
Map.highlightMarker(index); Map.highlightMarker(index);
} }
}); });
} }
/** /**
* info template * info template
*/ */
X3DOMObject.displayInfo = function(e){ X3DOMObject.displayInfo = function(e){
if (Data.markers.length==0||!SETTINGS.markinfo){ if (Data.markers.length==0||!SETTINGS.markinfo){
ui_hideMessage("window-markinfo"); ui_hideMessage("window-markinfo");
} }
//console.log("displayInfo"); //console.log("displayInfo");
var elem = Scene.element; var elem = Scene.element;
var mouse = x3dom_getXYPosOr(e.clientX,e.clientY,true); var mouse = x3dom_getXYPosOr(e.clientX,e.clientY,true);
if (Data.markers[mouse.index]!=undefined){ if (Data.markers[mouse.index]!=undefined){
X3DOMObject.displayMarkInfo(mouse.index); X3DOMObject.displayMarkInfo(mouse.index);
} }
var dist = 1000; var dist = 1000;
$("#window-info").css({"font-size":"20px"}); $("#window-info").css({"font-size":"20px"});
if (mouse.d_xz != null){ if (mouse.d_xz != null){
var dist_msg = ""; var dist_msg = "";
var id_msg = ""; var id_msg = "";
if (SETTINGS.moreinfo){ if (SETTINGS.moreinfo){
//console.log("displayInfo actual displaying"); //console.log("displayInfo actual displaying");
$("#window-info").css({"font-size":"16px"}); $("#window-info").css({"font-size":"16px"});
var st = mouse.id; var st = mouse.id;
id_msg = (st===undefined)?"n/a":st; id_msg = (st===undefined)?"n/a":st;
dist_msg += "<table>"; dist_msg += "<table>";
dist_msg += "<tr><th align='center'>shape id</td><td>"+id_msg+"</td></tr>"; dist_msg += "<tr><th align='center'>shape id</td><td>"+id_msg+"</td></tr>";
dist_msg += "</table>"; dist_msg += "</table>";
dist_msg += "<table>"; dist_msg += "<table>";
dist_msg += "<tr><th align='left'>d<sub>xz</sub></td><td>"+mouse.d_xz+" m</td>"; dist_msg += "<tr><th align='left'>d<sub>xz</sub></td><td>"+mouse.d_xz+" m</td>";
dist_msg += "<td>&nbsp;</td>"; dist_msg += "<td>&nbsp;</td>";
dist_msg += "<th align='left'>d<sub>xyz</sub></td><td>"+mouse.d_xyz+" m</td></tr>"; dist_msg += "<th align='left'>d<sub>xyz</sub></td><td>"+mouse.d_xyz+" m</td></tr>";
dist_msg += "</table>"; dist_msg += "</table>";
}else{ }else{
dist_msg = mouse.d_xz+" m"; dist_msg = mouse.d_xz+" m";
...@@ -1162,68 +1162,68 @@ X3DOMObject.displayInfo = function(e){ ...@@ -1162,68 +1162,68 @@ X3DOMObject.displayInfo = function(e){
* view info template * view info template
*/ */
X3DOMObject.displayViewInfo = function(e){ X3DOMObject.displayViewInfo = function(e){
if (Data.markers.length==0||!SETTINGS.markinfo){ if (Data.markers.length==0||!SETTINGS.markinfo){
ui_hideMessage("window-markinfo"); ui_hideMessage("window-markinfo");
} }
if (!e.target){ if (!e.target){
e.clientX = $(window).width()/2; e.clientX = $(window).width()/2;
e.clientY = $(window).height()/2; e.clientY = $(window).height()/2;
} }
var mouse = x3dom_getXYPosOr(e.clientX,e.clientY,true); var mouse = x3dom_getXYPosOr(e.clientX,e.clientY,true);
mouse.s = "0"; mouse.s = "0";
/* /*
if (Data.markers[mouse.index]!=undefined){ if (Data.markers[mouse.index]!=undefined){
X3DOMObject.displayMarkInfo(mouse.index); X3DOMObject.displayMarkInfo(mouse.index);
} }
*/ */
var camera = x3dom_getCameraPosOr(true); var camera = x3dom_getCameraPosOr(true);
// ?!!! // ?!!!
//Map.marker.setAltitude(camera.y); //Map.marker.setAltitude(camera.y);
//Map.marker.setElevation(camera.e*Math.PI/180); //Map.marker.setElevation(camera.e*Math.PI/180);
var msg = ` var msg = [
<table> '<table>',
<tr> '<tr>',
<td></td> ' <td></td>',
<td colspan='3' align='center'>position, m</td> ' <td colspan="3" align="center">position, m</td>',
<td colspan='3' align='center'>orientation, &deg;</td> ' <td colspan="3" align="center">orientation, &deg;</td>',
</tr> '</tr>',
<tr> '<tr>',
<th></th> ' <th></th>',
<th style='width:60px;'>x</th> ' <th style="width:60px;">x</th>',
<th style='width:60px;'>y</th> ' <th style="width:60px;">y</th>',
<th style='width:60px;'>z</th> ' <th style="width:60px;">z</th>',
<th>azimuth</th> ' <th>azimuth</th>',
<th>elevation</th> ' <th>elevation</th>',
<th>skew</th> ' <th>skew</th>',
</tr> '</tr>',
<tr> '<tr>',
<td>mouse</td> ' <td>mouse</td>',
<td>`+mouse.x+`</td> ' <td>'+mouse.x+'</td>',
<td>`+mouse.y+`</td> ' <td>'+mouse.y+'</td>',
<td>`+mouse.z+`</td> ' <td>'+mouse.z+'</td>',
<td>`+mouse.a+`</td> ' <td>'+mouse.a+'</td>',
<td>`+mouse.e+`</td> ' <td>'+mouse.e+'</td>',
<td>`+mouse.s+`</td> ' <td>'+mouse.s+'</td>',
</tr> '</tr>',
<tr> '<tr>',
<td>camera</td> ' <td>camera</td>',
<td>`+camera.x+`</td> ' <td>'+camera.x+'</td>',
<td>`+camera.y+`</td> ' <td>'+camera.y+'</td>',
<td>`+camera.z+`</td> ' <td>'+camera.z+'</td>',
<td>`+camera.a+`</td> ' <td>'+camera.a+'</td>',
<td>`+camera.e+`</td> ' <td>'+camera.e+'</td>',
<td>`+camera.s+`</td> ' <td>'+camera.s+'</td>',
</tr> '</tr>',
</table> '</table>'
`; ].join('\n');
if (SETTINGS.viewinfo){ if (SETTINGS.viewinfo){
ui_showMessage("window-viewinfo",msg); ui_showMessage("window-viewinfo",msg);
}else{ }else{
...@@ -1235,56 +1235,55 @@ X3DOMObject.displayViewInfo = function(e){ ...@@ -1235,56 +1235,55 @@ X3DOMObject.displayViewInfo = function(e){
* view marker data - satellite vs 3d model * view marker data - satellite vs 3d model
*/ */
X3DOMObject.displayMarkInfo = function(index){ X3DOMObject.displayMarkInfo = function(index){
//console.log("displayMarkInfo"); //console.log("displayMarkInfo");
var hide = false; var hide = false;
if (Data.markers.length==0){ if (Data.markers.length==0){
hide = true; hide = true;
}else{ }else{
msg = "<div>Marker "+index+" (Satellite vs 3D model)</div>"; msg = "<div>Marker "+index+" (Satellite vs 3D model)</div>";
var d_map = Data.markers[index].d_map; var d_map = Data.markers[index].d_map;
var d_x3d = Data.markers[index].d_x3d; var d_x3d = Data.markers[index].d_x3d;
var d_map_float = parseFloat(d_map); var d_map_float = parseFloat(d_map);
var d_x3d_float = parseFloat(d_x3d); var d_x3d_float = parseFloat(d_x3d);
var delta; var delta;
if (isNaN(d_map_float)){ if (isNaN(d_map_float)){
d_map_msg = d_map; d_map_msg = d_map;
}else{ }else{
d_map_msg = d_map_float.toFixed(1)+" m"; d_map_msg = d_map_float.toFixed(1)+" m";
} }
if (isNaN(d_x3d_float)){ if (isNaN(d_x3d_float)){
d_x3d_msg = d_x3d; d_x3d_msg = d_x3d;
}else{ }else{
d_x3d_msg = d_x3d_float.toFixed(1)+" m"; d_x3d_msg = d_x3d_float.toFixed(1)+" m";
} }
if (!isNaN(d_x3d_float)&&!isNaN(d_map_float)){ if (!isNaN(d_x3d_float)&&!isNaN(d_map_float)){
delta = (d_map_float-d_x3d_float).toFixed(1); delta = (d_map_float-d_x3d_float).toFixed(1);
}else{ }else{
delta = "-"; delta = "-";
} }
msg += "<table>"; msg += "<table>";
msg += "<tr title='drag marker over map to update distance'><th align='left'>d<sub>map</sub></th><td align='left' style='text-align:left;'>"+d_map_msg+"</td></tr>"; msg += "<tr title='drag marker over map to update distance'><th align='left'>d<sub>map</sub></th><td align='left' style='text-align:left;'>"+d_map_msg+"</td></tr>";
msg += "<tr title='drag marker over 3d scene to update distance'><th align='left'>d<sub>3d</sub></th><td align='left' style='text-align:left;'>"+d_x3d_msg+"</td></tr>"; msg += "<tr title='drag marker over 3d scene to update distance'><th align='left'>d<sub>3d</sub></th><td align='left' style='text-align:left;'>"+d_x3d_msg+"</td></tr>";
msg += "<tr><th align='center'>&Delta;</th><td align='left' style='text-align:left;'>"+delta+" m</td></tr>"; msg += "<tr><th align='center'>&Delta;</th><td align='left' style='text-align:left;'>"+delta+" m</td></tr>";
msg += "</table>"; msg += "</table>";
} }
if (hide||!SETTINGS.markinfo){ if (hide||!SETTINGS.markinfo){
ui_hideMessage("window-markinfo"); ui_hideMessage("window-markinfo");
}else{ }else{
ui_showMessage("window-markinfo",msg); ui_showMessage("window-markinfo",msg);
} }
}
}
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