From: Anthony Garcia Date: Wed, 16 Oct 2013 10:31:32 +0000 (+0200) Subject: Add modif senslabmap X-Git-Tag: 0.2-6~19 X-Git-Url: http://git.onelab.eu/?p=myslice.git;a=commitdiff_plain;h=6a0470f524345a768a9878d3ec5d953208ede5c5 Add modif senslabmap --- diff --git a/plugins/senslabmap/senslabmap.py b/plugins/senslabmap/senslabmap.py index 73c767db..7540edb0 100644 --- a/plugins/senslabmap/senslabmap.py +++ b/plugins/senslabmap/senslabmap.py @@ -5,9 +5,11 @@ class SensLabMap (Plugin): # set checkboxes if a final column with checkboxes is desired # pass columns as the initial set of columns # if None then this is taken from the query's fields - def __init__ (self, query, **settings): + def __init__ (self, query, query_all, **settings): Plugin.__init__ (self, **settings) - self.query=query + self.query = query + self.query_all = query_all + self.query_all_uuid = query_all.query_uuid def template_file (self): return "senslabmap.html" @@ -22,10 +24,10 @@ class SensLabMap (Plugin): "js/spin.presets.js", "js/spin.min.js", "js/jquery.spin.js", "js/three.js", "js/grenoble.js", "js/viewer3D.js", ] , - 'css_files': [ "css/senslabmap.css" , + 'css_files': [ "css/senslabmap.css" , ], } return reqs # the list of things passed to the js plugin - def json_settings_list (self): return ['plugin_uuid','query_uuid'] + def json_settings_list (self): return ['plugin_uuid', 'dom_id', 'query_uuid', 'query_all_uuid'] diff --git a/plugins/senslabmap/static/css/senslabmap.css b/plugins/senslabmap/static/css/senslabmap.css index cfd2d941..86f3638b 100644 --- a/plugins/senslabmap/static/css/senslabmap.css +++ b/plugins/senslabmap/static/css/senslabmap.css @@ -1,11 +1,40 @@ -.senslab-map { - width: 800px; - height: 500px; - height: 100%; +.senslabmap { + margin: 10px; + font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; + font-size: 13px; + line-height: 18px; + color: #333333; + background-color: #ffffff; } #div3d { - width: 100%; - height: 500px; - background-color: #202020; + height: 500px; + background-color: #202020; + z-index:-1 +} + +#selectionbox { + text-align: center; + padding:2px +} + +#infobox { + text-align: center +} + +#node_alive { + background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAATCAYAAACQjC21AAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAFRQAABUUBbA3bdwAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAFHSURBVDiNtdSxSkJxFMfx7znVtZS2wFdIaLHBpcUl4UYPkRQNCU7hQ0RTYiAk9RDRhRpqaXHIJbBXEJwErXuj/2lJK60ovP3G/+F8/mf6iZkxnnIgib4ubIKsmpAFsm+jlhgtsLuUezw/8i0c35VxcOsquabGCcjyxE+fYg9O2DlbH9x+CRZvZJ4weSjCHiA/Y++qGcckBvuneXsCmB1ONEoemFD6JTQ6SISSREkHlEcXbl+mfIOLP2KfZdhoFPqB7F4vLj1HL/dAehoQ6Mx5Mysahc6PAQNIR6HzVdRyMWAAiFpOzYgNNCOngmXiAgXLqCHtuEBD2ipCMy5QhKaak9hAc9JUL6EB0InB63gJDbSe73UFitNqAsV6vtdVgEahHwhUp8CqjUI/ANDho/MGFTNqwGRBfh8zo+a8QWWE/1sffsw0jf0KmsOTrB0wIw8AAAAASUVORK5CYII='); + +} + +#node_down { + background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAATCAYAAACQjC21AAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAFRQAABUUBbA3bdwAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAEqSURBVDiNtdSxSkJxFMfx7zkGtQgKgU8gJLRcBZcmxxu9hNCU0BQ9RLSJTT1GdEenFrn87xIY+AQXhCu41OA9DdZNNMLy3288f87n/5uOmBkbqdf3KZfPMGsCAWYBACIJkCDimM8fmEze1ldlAwyCE8zuETna/GklZi+InJMkT9+Dnc4Bs9ktcAHIj9gKC9xRqVwxHL4C7BVPWXaDSG9LqCgE9MiyHLj8athshpg9/hJbo+UU5yKxVuuQxeIZqO0EQkqpdKzkeegBA6iR56ECbQ/YZ9qKmT/QrK1AwxsIDQXGHsGxIjLyxomMFPAHwkhRjYDUA5aiGilxPEWkuzMn0iWOpwqAcxFm/T9jZn2ciwC0GFar18CA5QXZmgIGH7vLov93D1ezw8V+B8jhfgJI7kYcAAAAAElFTkSuQmCC'); +} + +#node_selected { + background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAATCAYAAACQjC21AAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAFRQAABUUBbA3bdwAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAE0SURBVDiNtdS/SoJxFMbx7zn0xyGhIfAGGhJaTHFpaTW6iISUSGqKLiLaxChq6CKid21pEcklsKEbEBqCGizhfRrMF9SiP+/bM57D+fzO8OOYJMZj9YdZUk8biBXwHCj30WlD2Ma4pTd/qd3F14nZcdBOWqu4nQNLEy+N5p5QW9ou3HwK2sV1ire5I7AdwL7BhhHomJmXfW2u9QCmolY/fQjUfghFC4HV6KdDYC/a0M5aJWRXv8TGaK2rUgiM09YCcAdkYoHQBZYdUykBDCCDqeTIiwlgg8iLjik50FR0RDYxUGQdo5MYaHQcWTMxUNZ0LEwOtLDpyAIGfyhuusgCVzX/iKkcmzOVVc0/OoAqhQCj/neMuiqFAMCj4vTzAagBTB7IryNQYzA7XPS/7uFIMcbFfgcJcoL5SKOsjQAAAABJRU5ErkJggg=='); +} + +#node_used { + background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAATCAYAAACQjC21AAAABHNCSVQICAgIfAhkiAAAAZJJREFUOI2t1D1LQlEcx/Hf+R/NTMKsawldqRZ7JDBIhyAIpwu9A6egpmrsbUQQ1FDQJL2B4E49LC0OuUQPToUKehFTosy6x9OQF8qiQu93Ohw4n7P9WDQaxQ+53Kx70Uv9MwEaDg85JsIAcG9epfL1u1SlblxU5eMRgFrzQ9YMOtAxt+CK7wedobGffrLKvKVvTmuJZROv55/vuaqq1rlzmE9tLXpWd33c7/8NAwAv71MmO+aXKsLwl6VxAsD8Ag7xqc2YO75GIPYXZkUgNuKcjpREwVuRhv5xB8DFurSYO77+X6i5mDu+7mJdmgUqWufKQauYVcNQyMN6tF4eGGgX7OWBAQ/r0UghNdIuZqWQGqGgY9Q2MOgYjdAgD43bBQ7y0DjlRPraLjAn0teUMW+TdoEZ8zZJxXrWNrBYzybpSZb1ksgX2sVKIl94kmWdABT1l72ldsGGUSQAqMln/bia2G4VO64mtmvyWQc+jUNFGqcPouALOidn/zsQJoQ8qx7u3IvLDTTWxvY9/AY2anmx3wGj5aLJgOrlPgAAAABJRU5ErkJggg=='); } diff --git a/plugins/senslabmap/static/js/senslabmap.js b/plugins/senslabmap/static/js/senslabmap.js index 8075be9c..1fe7810c 100644 --- a/plugins/senslabmap/static/js/senslabmap.js +++ b/plugins/senslabmap/static/js/senslabmap.js @@ -1,80 +1,51 @@ -/** - * Description: SensLab display of 3D-geolocated data - * Copyright (c) 2012 UPMC Sorbonne Universite - INRIA - * License: GPLv3 - */ - -// xxx TODO -- this plugin has never been tested -// update_map looks suspiciously empty... -// in addition it could use a bit of cleaning like what was done for the first plugins -// especially wrt using 'instance' and 'data' in such a confusing way - -(function( $ ){ - - $.fn.SensLabMap = function( method ) { - /* Method calling logic */ - if ( methods[method] ) { - return methods[ method ].apply( this, Array.prototype.slice.call( arguments, 1 )); - } else if ( typeof method === 'object' || ! method ) { - return methods.init.apply( this, arguments ); - } else { - $.error( 'Method ' + method + ' does not exist on $.SensLabMap' ); - } - }; - - var methods = { - init : function( options ) { - return this.each(function(){ - var $this = $(this), - data = $this.data('SensLabMap'), SensLabMap = $('
', { text : $this.attr('title') }); - // If the plugin hasn't been initialized yet - if ( ! data ) { - /* Plugin initialization */ - //google.load('maps', '3', { other_params: 'sensor=false' }); - //google.setOnLoadCallback(initialize); - init(); - /* End of plugin initialization */ - $(this).data('SensLabMap', { - plugin_uuid: options.plugin_uuid, - query_uuid: options.query_uuid, - target : $this, - SensLabMap : SensLabMap - }); - /* Subscribe to query updates */ - $.subscribe('/results/' + options.query_uuid + '/changed', {instance: $this}, update_map); - } - }); - }, - destroy : function( ) { - return this.each(function(){ - var $this = $(this), data = $this.data('SensLabMap'); - $(window).unbind('SensLabMap'); - data.SensLabMap.remove(); - $this.removeData('SensLabMap'); - }); - }, -/* - reposition : function( ) { // ... }, - show : function( ) { // ... }, - hide : function( ) { // ... }, -*/ - update : function( content ) { - // should be made a private function - set3dsize() - }, - }; - - /* Private methods */ - function update_map(e, rows) { - var $plugindiv = e.data.instance; - $plugindiv.closest('.need-spin').spin(false); - - if(rows) { - /* TODO rendering */ - } else { - alert('error'); - } - +(function($){ + var SensLabMap = Plugin.extend({ + init: function(options, element) { + this._super(options, element); + + this.elmt().on('show', this, this.on_show); + + this.method = query.object; + + /* Setup query and record handlers */ + this.listen_query(options.query_uuid); + this.listen_query(options.query_all_uuid, 'all'); + + /* GUI setup and event binding */ + this.initialize_map(); + }, + + initialize_map: function() { + this.nodes = []; + this.id = 0; + init(); + }, + + refresh: function() { + console.log("refresh"); + myrender(); + }, + + on_show: function(e) { + e.data.refresh(); + }, + + on_all_new_record: function(n) { + // format is : [name, x, y, z, uid, state] + // state = "Busy", "Alive" or "Suspected" + if (n.x == null || n.y == null || n.z == null) { + console.log("Warning: no coord for " + n.hrn); + return; + } + this.id++; + node = [this.id, n.x, n.y, n.z, this.id, n.boot_state]; + this.nodes.push(node); + }, + + on_all_query_done: function() { + drawNodes(this.nodes); + parseNodebox(); } - -})( jQuery ); + }); + $.plugin('SensLabMap', SensLabMap); +})(jQuery); diff --git a/plugins/senslabmap/static/js/viewer3D.js b/plugins/senslabmap/static/js/viewer3D.js index cf70e812..33ae659e 100644 --- a/plugins/senslabmap/static/js/viewer3D.js +++ b/plugins/senslabmap/static/js/viewer3D.js @@ -1,17 +1,8 @@ - -// Various global variables -var mouseX = 0, mouseY = 0, - camera, scene, renderer, projector; -var sTestEventType = 'mousedown'; -//var window3DWidth = window.innerWidth * 0.8; -//var window3DHeight=window.innerHeight*0.75; -var window3DWidth, window3DHeight; -var offX, offY; +// Various global variables +var mouseX = 0, mouseY = 0, camera, scene, renderer, projector; + // Camera parameters -phi = -100, theta = 0, distance = 150; -var rcount = 0; -// Text display -var info, nodelist, help; +var phi = -100, theta = 0, distance = 130; // graphical nodes var objects = []; @@ -21,322 +12,331 @@ var selectedNodes = []; var div3d, nodebox, infobox; -function init() { - var particles, particle; - - // jordan : modifier document.getElementById - div3d = jQuery('#div3d'); - nodebox = jQuery('#nodebox'); - infobox = jQuery('#infobox'); - titlebox = jQuery('#titlebox'); - // offset also - var offset = div3d.offset(); - offY = offset.top; - offX = offset.left; - - titlebox.innerHTML = 'Grenoble Site ' + nodes_gre.length + " nodes"; - infobox.innerHTML = 'Node info : '; - - nodebox.value = ""; - - camera = new THREE.PerspectiveCamera(75, window3DWidth / window3DHeight, 1, 10000); - - scene = new THREE.Scene(); +function onResize() { + renderer.setSize(div3d.offsetWidth, div3d.offsetHeight); + camera.aspect = div3d.offsetWidth / div3d.offsetHeight; + camera.updateProjectionMatrix(); + myrender(); +} - renderer = new THREE.CanvasRenderer(); +function getCenter(nodes) { + var xmin = 0, ymin = 0, zmin = 0; + var xmax = 0, ymax = 0, zmax = 0; + + for (var i = 0; i < nodes.length; i++) { + if (nodes[i][1] > xmax) xmax = nodes[i][1]; + if (nodes[i][1] < xmin) xmin = nodes[i][1]; + if (nodes[i][2] > ymax) ymax = nodes[i][2]; + if (nodes[i][2] < ymin) ymin = nodes[i][2]; + if (nodes[i][3] > zmax) zmax = nodes[i][3]; + if (nodes[i][3] < zmin) zmin = nodes[i][3]; + } + return {x: (xmax + xmin) / 2, y: (ymax + ymin) / 2, z: (zmax + zmin) / 2}; +} - // jordan XXX div3d.appendChild(renderer.domElement); - div3d.append(renderer.domElement); +function debugaxis(axisLength) { + var v = function(x, y, z) { + return new THREE.Vertex(new THREE.Vector3(x, y, z)); + } + + var createAxis = function (p1, p2, color) { + var lineGeometry = new THREE.Geometry(); + var lineMat = new THREE.LineBasicMaterial({ color: color, lineWidth: 2 }); + lineGeometry.vertices.push(p1, p2); + var line = new THREE.Line(lineGeometry, lineMat); + scene.add(line); + } + + createAxis(v(0, 0, 0), v(axisLength, 0, 0), 0xFF0000); + createAxis(v(0, 0, 0), v(0, axisLength, 0), 0x00FF00); + createAxis(v(0, 0, 0), v(0, 0, axisLength), 0x0000FF); +}; - window.addEventListener('resize', set3dsize, false); - scene.add(camera); - set3dsize(); +function drawNodes(nodes) { + var geometry = new THREE.Geometry(); + var center = getCenter(nodes); + + onResize(); + for (var i = 0; i < nodes.length; i++) { + var material = new THREE.ParticleCanvasMaterial({ + color: 0xffffff, + program: function (context) { + context.beginPath(); + context.arc(0, 0, 1, 0, Math.PI * 2, true); + context.closePath(); + context.fill(); + } + }); + var particle = new THREE.Particle(material); + particle.name = nodes[i][0]; + particle.position.x = nodes[i][1] - center.x; + particle.position.y = nodes[i][2] - center.y; + particle.position.z = nodes[i][3] - center.z; + particle.uid = nodes[i][4]; + particle.state = nodes[i][5]; + particle.position.multiplyScalar(10); + particle.scale.x = particle.scale.y = 1; + scene.add(particle); + + var vertex = new THREE.Vertex(particle.position); + geometry.vertices.push(vertex); + objects.push(particle) - - var PI2 = Math.PI * 2; - var geometry = new THREE.Geometry(); - - // let's find the center of the nodes - xmin = ymin = zmin = 0; - xmax = ymax = zmax = 0; - - for (var i = 0; i < nodes_gre.length; i++) { - if (nodes_gre[i][1] > xmax) xmax = nodes_gre[i][1]; - if (nodes_gre[i][1] < xmin) xmin = nodes_gre[i][1]; - if (nodes_gre[i][2] > ymax) ymax = nodes_gre[i][2]; - if (nodes_gre[i][2] < ymin) ymin = nodes_gre[i][2]; - if (nodes_gre[i][3] > zmax) zmax = nodes_gre[i][3]; - if (nodes_gre[i][3] < zmin) zmin = nodes_gre[i][3]; - } - - xcenter = (xmax + xmin) / 2; - ycenter = (ymax + ymin) / 2; - zcenter = (zmax + zmin) / 2; - - // display nodes as TREE particles - for (var i = 0; i < nodes_gre.length; i++) { - material = new THREE.ParticleCanvasMaterial({ - color: 0xffffff, - program: function (context) { - context.beginPath(); - context.arc(0, 0, 1, 0, PI2, true); - context.closePath(); - context.fill(); - } - }); - particle = new THREE.Particle(material); - particle.name = nodes_gre[i][0]; - particle.position.x = nodes_gre[i][1] - xcenter; - particle.position.y = nodes_gre[i][2] - ycenter; - particle.position.z = nodes_gre[i][3] - zcenter; - particle.position.multiplyScalar(10); - particle.scale.x = particle.scale.y = 1; - scene.add(particle); - v = new THREE.Vertex(particle.position); - geometry.vertices.push(v); - objects.push(particle) - } - debugaxis(10); - // a projector is needed to find which node is under the mouse - projector = new THREE.Projector(); - - nodebox.onkeyup = parseNodebox; - // set mouse event handlers // TODO jordan - document.onmousedown = OnMouseDown; - document.onmouseup = OnMouseUp; - document.onmousemove = displayNodeInfo; - if (window.addEventListener) - /** DOMMouseScroll is for mozilla. */ - window.addEventListener('DOMMouseScroll', wheel, false); - /** IE/Opera. */ - window.onmousewheel = document.onmousewheel = wheel; myrender(); + } } -function set3dsize() { - // jordan - var offset = div3d.offset(); - offY = offset.top; - offX = offset.left; - window3DWidth = div3d.width(); - window3DHeight = div3d.height(); - renderer.setSize(window3DWidth, window3DHeight); - - camera.aspect = window3DWidth / window3DHeight; - camera.updateProjectionMatrix(); - - myrender(); +function init(nodes) { + div3d = document.getElementById('div3d'); + nodebox = document.getElementById('nodebox'); + infobox = document.getElementById('infobox'); + + infobox.innerHTML = 'Node info : '; + nodebox.value = ""; + + camera = new THREE.PerspectiveCamera(75, div3d.offsetWidth / div3d.offsetHeight, 1, 10000); + scene = new THREE.Scene(); + renderer = new THREE.CanvasRenderer(); + projector = new THREE.Projector(); + + div3d.appendChild(renderer.domElement); + + window.addEventListener('resize', onResize, false); + scene.add(camera); + + nodebox.onkeyup = parseNodebox; + + div3d.onmousedown = OnMouseDown; + div3d.onmouseup = OnMouseUp; + div3d.onmousemove = displayNodeInfo; + if (div3d.addEventListener) { + div3d.addEventListener('DOMMouseScroll', wheel, false); // mozilla + } + div3d.onmousewheel = wheel; // IE & Opera } function sortfunction(a, b) { - return (a - b) //causes an array to be sorted numerically and ascending + return (a - b) //causes an array to be sorted numerically and ascending } // factorize the expanded list in selectedNode to produce dash intervals // 1,2,3,5,9 -> 1-3,5,9 function factorize() { - var fact = []; - var previous = 0; - var intervalStart = 0; - selectedNodes.sort(sortfunction); - for (j = 0; j < selectedNodes.length; j++) { - if (intervalStart) { - // we are in an interval - if (selectedNodes[j] == previous + 1) { - // interval grows - previous += 1; - } else { - // end of interval - fact.push(intervalStart + "-" + previous); - intervalStart = 0; - previous = selectedNodes[j]; - } - } else { - // we are not in an interval - if (selectedNodes[j] == previous + 1) { - // let's begin an interval - intervalStart = previous; - previous += 1; - } else { - if (previous) fact.push(previous); - previous = selectedNodes[j]; - } - } - } // for end - // at the end of the loop, two cases - // we were still in an interval, then add it to the result - // we were not in an interval, then add the last selectednode (previous) + var fact = []; + var previous = 0; + var intervalStart = 0; + selectedNodes.sort(sortfunction); + for (j = 0; j < selectedNodes.length; j++) { if (intervalStart) { + // we are in an interval + if (selectedNodes[j] == previous + 1) { + // interval grows + previous += 1; + } else { + // end of interval fact.push(intervalStart + "-" + previous); + intervalStart = 0; + previous = selectedNodes[j]; + } } else { - if (previous) fact.push(previous); + // we are not in an interval + if (selectedNodes[j] == previous + 1) { + // let's begin an interval + intervalStart = previous; + previous += 1; + } else { + if (previous) { + fact.push(previous); + } + previous = selectedNodes[j]; + } } - return fact; + } // for end + // at the end of the loop, two cases + // we were still in an interval, then add it to the result + // we were not in an interval, then add the last selectednode (previous) + if (intervalStart) { + fact.push(intervalStart + "-" + previous); + } else if (previous) { + fact.push(previous); + } + return fact; } // expand a list of nodes containing dash intervals // 1-3,5,9 -> 1,2,3,5,9 -function expand(factExp) { - exp = []; - for (i = 0; i < factExp.length; i++) { - dashExpression = factExp[i].split("-"); - if (dashExpression.length == 2) { - for (j = parseInt(dashExpression[0]); j < (parseInt(dashExpression[1]) + 1); j++) - exp.push(j); - } else exp.push(parseInt(factExp[i])); +function expand(input) { + var factorized = input.split(","); + var expanded = []; + for (var i = 0; i < factorized.length; i++) { + var d = factorized[i].split("-"); + if (d.length == 2) { + for (var j = parseInt(d[0]); j < parseInt(d[1]) + 1; j++) { + expanded.push(j); + } + } else { + expanded.push(parseInt(factorized[i])); + } + } + expanded.sort(sortfunction); + for (var i = 1; i < expanded.length; i++) { + if (expanded[i] == expanded[i - 1]) { + expanded.splice(i--, 1); } - exp.sort(sortfunction); - for (var i = 1; i < exp.length; i++) { if (exp[i] == exp[i - 1]) { exp.splice(i--, 1); } } - return exp; + } + return expanded; } function parseNodebox() { - input = nodebox.value; - selectedNodes = expand(input.split(",")); - myrender(); + selectedNodes = expand(nodebox.value); + myrender(); } -function debugaxis(axisLength) { - //Shorten the vertex function - function v(x, y, z) { - return new THREE.Vertex(new THREE.Vector3(x, y, z)); - } - - //Create axis (point1, point2, colour) - function createAxis(p1, p2, color) { - var line, lineGeometry = new THREE.Geometry(), - lineMat = new THREE.LineBasicMaterial({ color: color, lineWidth: 2 }); - lineGeometry.vertices.push(p1, p2); - line = new THREE.Line(lineGeometry, lineMat); - scene.add(line); - } - - createAxis(v(0, 0, 0), v(axisLength, 0, 0), 0xFF0000); - createAxis(v(0, 0, 0), v(0, axisLength, 0), 0x00FF00); - createAxis(v(0, 0, 0), v(0, 0, axisLength), 0x0000FF); -}; - // set the camera position according two angles theta and phi and the distance // and display the scene function myrender() { - //infobox.innerHTML = " Cam Pos = " + camera.position.x + "," + camera.position.y + "," + camera.position.z - // + " - " + theta + "," + phi + ","+ distance; - //infobox.innerHTML = selectedNodes; - camera.position.x = distance * Math.sin(theta * Math.PI / 360) * Math.cos(phi * Math.PI / 360); - camera.position.y = distance * Math.sin(this.phi * Math.PI / 360); - camera.position.z = distance * Math.cos(this.theta * Math.PI / 360) * Math.cos(this.phi * Math.PI / 360); - camera.lookAt(scene.position); - camera.updateMatrix(); - - for (i = 0; i < objects.length; i++) - if (selectedNodes.indexOf(objects[i].name) != -1) objects[i].material.color.setHex(0xff0000); - else objects[i].material.color.setHex(0xffffff); - renderer.render(scene, camera); + camera.position.x = distance * Math.sin(theta * Math.PI / 360) * Math.cos(phi * Math.PI / 360); + camera.position.y = distance * Math.sin(this.phi * Math.PI / 360); + camera.position.z = distance * Math.cos(this.theta * Math.PI / 360) * Math.cos(this.phi * Math.PI / 360); + camera.lookAt(scene.position); + camera.updateMatrix(); + + for (i = 0; i < objects.length; i++) { + if (selectedNodes.indexOf(objects[i].name) != -1) { + objects[i].material.color.setHex(0x0099CC); + } else { + if (objects[i].state == "Busy") { + objects[i].material.color.setHex(0x9943BE); + } else if (objects[i].state == "Alive") { + objects[i].material.color.setHex(0x7FFF00); + } else { + objects[i].material.color.setHex(0xFF3030); + } + } + } + renderer.render(scene, camera); } -// rigthbutton is used for rotations +// rigthbutton is used for rotations function onDocumentMouseMoveRot(event) { - NewmouseX = event.clientX; - NewmouseY = event.clientY; - DeltaX = NewmouseX - mouseX; - DeltaY = NewmouseY - mouseY; - - mouseX = NewmouseX; - mouseY = NewmouseY; - - theta -= DeltaX; - phi += DeltaY; - if (phi > 180) phi = 180; - if (phi < -180) phi = -180; - myrender(); + var NewmouseX = event.clientX; + var NewmouseY = event.clientY; + var DeltaX = NewmouseX - mouseX; + var DeltaY = NewmouseY - mouseY; + + mouseX = NewmouseX; + mouseY = NewmouseY; + + theta -= DeltaX; + phi += DeltaY; + if (phi > 180) phi = 180; + if (phi < -180) phi = -180; + myrender(); } // mousewheel is used for zoom function Zoom(delta) { - distance += delta * 5; - myrender(); + distance += delta * 5; + myrender(); } // return the graphical node under the mouse function findNodeUnderMouse(event) { - var vector = new THREE.Vector3(((event.clientX - offX) / window3DWidth) * 2 - 1, -((event.clientY - offY) / window3DHeight) * 2 + 1, 0.5); - projector.unprojectVector(vector, camera); - var ray = new THREE.Ray(camera.position, vector.subSelf(camera.position).normalize()); - var intersects = ray.intersectObjects(objects); - if (intersects.length > 0) { - return intersects[0]; - } else return null; + var x, y, z; + + event.preventDefault(); + + x = ((event.clientX - div3d.offsetLeft) / div3d.offsetWidth) * 2 - 1; + y = -((event.clientY - div3d.offsetTop) / div3d.offsetHeight) * 2 + 1; + z = 0.5; + + var vector = new THREE.Vector3(x, y, z); + projector.unprojectVector(vector, camera); + + var ray = new THREE.Ray(camera.position, vector.subSelf(camera.position).normalize()); + var intersects = ray.intersectObjects(objects); + + if (intersects.length > 0) { + return intersects[0]; + } else { + return null; + } } // display some info of the node under the mouse function displayNodeInfo(e) { - obj = findNodeUnderMouse(e); - if (obj) infobox.innerHTML = 'Node info : number ' + obj.object.name + " with id " + nodes_gre[obj.object.id][4]; - // else infobox.innerHTML = e.clientX + "," + e.clientY + " - " + offX + "," + offY; + obj = findNodeUnderMouse(e); + if (obj) { + infobox.innerHTML = 'Node info : number ' + obj.object.name + " with id " + obj.object.uid; + } } // select/unselect nodes function toggleNode(obj) { - nodeId = obj.object.name; - i = selectedNodes.indexOf(nodeId); - if (i == -1) selectedNodes.push(nodeId); - else selectedNodes.splice(i, 1); - nodebox.value = factorize().join(","); - myrender(); + var nodeId = obj.object.name; + var index = selectedNodes.indexOf(nodeId); + + if (index == -1) { + selectedNodes.push(nodeId); + } else { + selectedNodes.splice(index, 1); + } + nodebox.value = factorize().join(","); + myrender(); } //////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// // Mouse handling functions // function OnMouseDown(e) { - var clickType = 'LEFT'; - if (e.type != sTestEventType) return true + var clickType = 'LEFT'; + if (e.type != 'mousedown') return true if (e.which) { - if (e.which == 3) clickType = 'RIGHT'; - if (e.which == 2) clickType = 'MIDDLE'; - //infobox.innerHTML = clickType + " - Cam Pos = " + camera.position.x + "," + camera.position.y + "," + camera.position.z; + if (e.which == 3) clickType = 'RIGHT'; + if (e.which == 2) clickType = 'MIDDLE'; + //infobox.innerHTML = clickType + " - Cam Pos = " + camera.position.x + "," + camera.position.y + "," + camera.position.z; } mouseX = e.clientX; - mouseY = e.clientY; - if (clickType == 'RIGHT') { - document.onmousemove = onDocumentMouseMoveRot; - } - if (clickType == 'LEFT') { - obj = findNodeUnderMouse(e); - if (obj != null) toggleNode(obj); - } + mouseY = e.clientY; + if (clickType == 'RIGHT') { + document.onmousemove = onDocumentMouseMoveRot; + } + if (clickType == 'LEFT') { + obj = findNodeUnderMouse(e); + if (obj != null) toggleNode(obj); + } } function OnMouseUp(e) { - document.onmousemove = displayNodeInfo; + document.onmousemove = displayNodeInfo; } // This function was taken here : http://www.adomas.org/javascript-mouse-wheel/ // Event handler for mouse wheel event. function wheel(event) { - var delta = 0; - if (!event) /* For IE. */ - event = window.event; - if (event.wheelDelta) { /* IE/Opera. */ - delta = event.wheelDelta / 120; - } else if (event.detail) { /** Mozilla case. */ - /** In Mozilla, sign of delta is different than in IE. - * Also, delta is multiple of 3. - */ - delta = -event.detail / 3; - } - /** If delta is nonzero, handle it. - * Basically, delta is now positive if wheel was scrolled up, - * and negative, if wheel was scrolled down. - */ - if (delta) - Zoom(delta); - /** Prevent default actions caused by mouse wheel. - * That might be ugly, but we handle scrolls somehow - * anyway, so don't bother here.. - */ - if (event.preventDefault) - event.preventDefault(); - event.returnValue = false; -} + var delta = 0; + if (!event) /* For IE. */ + event = window.event; + if (event.wheelDelta) { /* IE/Opera. */ + delta = event.wheelDelta / 120; + } else if (event.detail) { /** Mozilla case. */ + /** In Mozilla, sign of delta is different than in IE. + * Also, delta is multiple of 3. + */ + delta = -event.detail / 3; + } + /** If delta is nonzero, handle it. + * Basically, delta is now positive if wheel was scrolled up, + * and negative, if wheel was scrolled down. + */ + if (delta) + Zoom(delta); + /** Prevent default actions caused by mouse wheel. + * That might be ugly, but we handle scrolls somehow + * anyway, so don't bother here.. + */ + if (event.preventDefault) + event.preventDefault(); + event.returnValue = false; +} diff --git a/plugins/senslabmap/templates/senslabmap.html b/plugins/senslabmap/templates/senslabmap.html index c1c65996..c00ea643 100644 --- a/plugins/senslabmap/templates/senslabmap.html +++ b/plugins/senslabmap/templates/senslabmap.html @@ -1 +1,18 @@ -
+
+
+
+
+ Selected Nodes + +
+
+
+
+
Alive - +
Down - +
Selected - +
Busy +
+
+
+
\ No newline at end of file