index.html 67 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536153715381539154015411542154315441545154615471548154915501551155215531554155515561557155815591560156115621563156415651566156715681569157015711572157315741575157615771578157915801581158215831584158515861587158815891590159115921593159415951596159715981599160016011602160316041605160616071608160916101611161216131614161516161617161816191620162116221623162416251626162716281629163016311632163316341635163616371638163916401641164216431644164516461647164816491650165116521653165416551656165716581659166016611662166316641665166616671668166916701671167216731674167516761677167816791680168116821683168416851686168716881689169016911692169316941695169616971698169917001701170217031704170517061707170817091710171117121713171417151716171717181719172017211722172317241725172617271728172917301731173217331734173517361737173817391740174117421743174417451746174717481749175017511752175317541755175617571758175917601761176217631764176517661767176817691770177117721773177417751776177717781779178017811782178317841785178617871788178917901791179217931794179517961797179817991800180118021803180418051806180718081809181018111812181318141815181618171818181918201821182218231824182518261827182818291830183118321833183418351836183718381839184018411842184318441845184618471848184918501851185218531854185518561857185818591860186118621863186418651866186718681869187018711872187318741875187618771878187918801881188218831884188518861887188818891890189118921893189418951896189718981899190019011902190319041905190619071908190919101911191219131914191519161917191819191920192119221923192419251926192719281929193019311932193319341935193619371938193919401941194219431944194519461947194819491950195119521953195419551956195719581959196019611962196319641965196619671968196919701971197219731974197519761977197819791980
  1. <!doctype html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8">
  5. <title>The Vault GUI</title>
  6. <link rel="stylesheet" href="{{ static_url("style.css") }}">
  7. <link rel="stylesheet" href="//code.jquery.com/ui/1.12.0/themes/base/jquery-ui.css">
  8. <!--[if lt IE 9]>
  9. <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
  10. <![endif]-->
  11. </head>
  12. <body>
  13. <div id="container"></div>
  14. <!--<div id="slider"></div>-->
  15. <div id="slider-tooltip"></div>
  16. <div id="obj-tooltip">Module: </div>
  17. <div id="val-tooltip">Value: </div>
  18. <!--<div id="stat-tooltip">Status: </div>-->
  19. <div class="window-item window-unitem" id="message">
  20. <div class="bar-header">
  21. <div class="bar-title noselect">Message Log</div>
  22. <div class="bar-dropdown noselect">^</div>
  23. <div class="bar-close noselect">&#215;</div>
  24. </div>
  25. <div class="bar-message">
  26. <div class="bar-wrapper" style="height:200px; overflow-y:scroll;">
  27. </div>
  28. </div>
  29. </div>
  30. <!--
  31. <div class="window-item window-unitem" id="settings">
  32. <div class="bar-header">
  33. <div class="bar-title noselect">Settings</div>
  34. <div class="bar-dropdown noselect">^</div>
  35. <div class="bar-close noselect">&#215;</div>
  36. </div>
  37. <div class="bar-settings">
  38. <div class="bar-wrapper">
  39. <div class="bar-setup">
  40. <span class="bl bar-hl">Start time</span>
  41. <span class="br bar-info">
  42. <input id="start_time" class="jscolor" value="1472688000">
  43. </span>
  44. </div>
  45. <div class="bar-setup">
  46. <span class="bl bar-hl">End time</span>
  47. <span class="br bar-info">
  48. <input id="end_time" class="jscolor" value="1472774400">
  49. </span>
  50. </div>
  51. </div>
  52. </div>
  53. </div>
  54. -->
  55. <div class="window-item" id="orientation">
  56. <div class="bar-header">
  57. <div class="bar-title noselect">Orientation</div>
  58. <div class="bar-dropdown noselect">^</div>
  59. <div class="bar-close noselect">&#215;</div>
  60. </div>
  61. <div class="bar-orientation">
  62. <canvas class="bar-wrapper" id="compass" width="200" height="180"></canvas>
  63. </div>
  64. </div>
  65. <div id="window-tab">
  66. <div id="offMessage" class="noselect bar-pil">Message Log</div>
  67. <div id="offOrientation" class="noselect bar-pil">Orientation</div>
  68. <!--<div id="offSettings" class="noselect bar-pil">Settings</div>-->
  69. </div>
  70. <div class="window-cp" id="control-panel">
  71. <div class="bar-header">
  72. <div id="toggleGUI" class="bar-button noselect">Show/Hide GUI</div>
  73. <div id="showTabs" class="bar-button noselect">Windows</div>
  74. <!--<div id="runSimulation" class="bar-button noselect">Run</div>-->
  75. <!---
  76. <div id="testTrigger" class="bar-button noselect">Test Trigger</div>
  77. -->
  78. </div>
  79. </div>
  80. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
  81. <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
  82. <script src="{{ static_url("scripts.js") }}"></script>
  83. <script src="{{ static_url("three.min.js") }}"></script>
  84. <script src="{{ static_url("OrbitControls.js") }}"></script>
  85. <script>
  86. // Global variable
  87. var img = null,
  88. needle = null,
  89. ctx = null;
  90. function clearCanvas() {
  91. // clear canvas
  92. ctx.clearRect(0, 0, 200, 200);
  93. }
  94. function draw(degrees) {
  95. //console.log("Draw degree");
  96. //console.log(degrees);
  97. clearCanvas();
  98. // Draw the compass onto the canvas
  99. ctx.drawImage(img, 0, 0);
  100. // Save the current drawing state
  101. ctx.save();
  102. // Now move across and down half the
  103. ctx.translate(100, 100);
  104. // Rotate around this point
  105. ctx.rotate(degrees * (Math.PI / 180));
  106. // Draw the image back and up
  107. ctx.drawImage(needle, -100, -100);
  108. // Restore the previous drawing state
  109. ctx.restore();
  110. // Increment the angle of the needle by 5 degrees
  111. //degrees += 5;
  112. }
  113. function imgLoaded() {
  114. // Image loaded event complete. Start the timer
  115. draw(myvalue);
  116. //setInterval(draw, 100);
  117. }
  118. function init() {
  119. // Grab the compass element
  120. var canvas = document.getElementById('compass');
  121. // Canvas supported?
  122. if (canvas.getContext('2d')) {
  123. ctx = canvas.getContext('2d');
  124. // Load the needle image
  125. needle = new Image();
  126. needle.src = 'http://katrin.kit.edu/static/needle.png';
  127. // Load the compass image
  128. img = new Image();
  129. img.src = 'http://katrin.kit.edu/static/compass.png';
  130. img.onload = imgLoaded;
  131. } else {
  132. alert("Canvas not supported!");
  133. }
  134. }
  135. var myvalue = 0;
  136. init();
  137. </script>
  138. <script src="https://dl.dropboxusercontent.com/u/3587259/Code/Threejs/CSS3DRenderer.js"></script>
  139. <script>
  140. var camera, scene, renderer;
  141. var container;
  142. var mycontrol;
  143. var enableControls = true;
  144. var pv001;
  145. var data;
  146. var raycaster = new THREE.Raycaster();
  147. var mouse = new THREE.Vector2();
  148. function onMouseMove( event ) {
  149. // calculate mouse position in normalized device coordinates
  150. // (-1 to +1) for both components
  151. mouse.x = ( event.clientX / window.innerWidth ) * 2 - 1;
  152. mouse.y = - ( event.clientY / window.innerHeight ) * 2 + 1;
  153. }
  154. init();
  155. animate();
  156. window.addEventListener( 'mousemove', onMouseMove, false );
  157. function createLabel(name) {
  158. var text2 = document.createElement('div');
  159. text2.style.position = 'absolute';
  160. //text2.style.zIndex = 1; // if you still don't see the label, try uncommenting this
  161. text2.style.width = 100;
  162. text2.style.height = 100;
  163. text2.style.padding = "5px";
  164. text2.style.backgroundColor = '#303030';
  165. text2.style.color = '#fff';
  166. text2.innerHTML = name;
  167. //text2.style.top = 200 + 'px';
  168. //text2.style.left = 200 + 'px';
  169. text2.id = "text"+name;
  170. document.body.appendChild(text2);
  171. }
  172. function init() {
  173. setMessage("3D", "Initialization.");
  174. scene = new THREE.Scene();
  175. camera = new THREE.PerspectiveCamera(45, window.innerWidth / window.innerHeight, 1, 10000);
  176. camera.position.set(0, 45, 100);
  177. camera.lookAt(scene.position);
  178. container = document.getElementById( 'container' );
  179. document.body.appendChild( container );
  180. renderer = new THREE.WebGLRenderer({ alpha: true, antialias: true });
  181. //renderer = new THREE.CSS3DRenderer();
  182. renderer.setSize(window.innerWidth, window.innerHeight);
  183. renderer.setClearColor( 0xffffff, 0);
  184. container.appendChild(renderer.domElement);
  185. mycontrol = new THREE.OrbitControls( camera );
  186. var size = 40, step = 1;
  187. var geometry = new THREE.Geometry();
  188. var material = new THREE.LineBasicMaterial({color: 0xe3e3e3, linewidth: 1, fog:true});
  189. for ( var i = - size; i <= size; i += step ) {
  190. geometry.vertices.push(new THREE.Vector3( -size, -0.04, i ));
  191. geometry.vertices.push(new THREE.Vector3( size, -0.04, i ));
  192. geometry.vertices.push(new THREE.Vector3( i, -0.04, -size ));
  193. geometry.vertices.push(new THREE.Vector3( i, -0.04, size ));
  194. }
  195. var line = new THREE.LineSegments( geometry, material );
  196. scene.add(line);
  197. setMessage("3D", "Added grid plane.");
  198. /*
  199. var geometry = new THREE.BoxGeometry( 1, 1, 1 );
  200. var material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
  201. var cube = new THREE.Mesh( geometry, material );
  202. */
  203. var light = new THREE.DirectionalLight( 0xffffff );
  204. light.position.set( 0, 1, 1 ).normalize();
  205. scene.add(light);
  206. setMessage("3D", "Added directional light.");
  207. pv001 = new THREE.Mesh(
  208. new THREE.CubeGeometry( 4, 1, 1 ),
  209. new THREE.MeshPhongMaterial( {
  210. color: 0xD3D3D3,
  211. specular: 0x050505,
  212. shininess: 100
  213. })
  214. );
  215. pv001.position.set(-18, 0.5, 29);
  216. pv001.rotateY( Math.PI / 3 );
  217. pv001.name = "2A_15_60e_001";
  218. scene.add(pv001);
  219. setMessage("3D", "Loaded PV001.");
  220. createLabel("001");
  221. pv002 = new THREE.Mesh(
  222. new THREE.CubeGeometry( 4, 1, 1 ),
  223. new THREE.MeshPhongMaterial( {
  224. color: 0xD3D3D3,
  225. specular: 0x050505,
  226. shininess: 100
  227. })
  228. );
  229. pv002.position.set(-14, 0.5, 30);
  230. pv002.rotateY( Math.PI / 3 );
  231. pv002.name = "5A_15_60e_002";
  232. scene.add(pv002);
  233. setMessage("3D", "Loaded PV002.");
  234. createLabel("002");
  235. pv003 = new THREE.Mesh(
  236. new THREE.CubeGeometry( 4, 1, 1 ),
  237. new THREE.MeshPhongMaterial( {
  238. color: 0xD3D3D3,
  239. specular: 0x050505,
  240. shininess: 100
  241. })
  242. );
  243. pv003.position.set(9.5, 0.5, 2);
  244. pv003.rotateY( Math.PI / 3 );
  245. pv003.name = "6A_30_60e_003";
  246. scene.add(pv003);
  247. setMessage("3D", "Loaded PV003.");
  248. createLabel("003");
  249. pv004 = new THREE.Mesh(
  250. new THREE.CubeGeometry( 4, 1, 1 ),
  251. new THREE.MeshPhongMaterial( {
  252. color: 0xD3D3D3,
  253. specular: 0x050505,
  254. shininess: 100
  255. })
  256. );
  257. pv004.position.set(6, 0.5, 1);
  258. pv004.rotateY( Math.PI / 3 );
  259. pv004.name = "1A_30_60e_004";
  260. scene.add(pv004);
  261. setMessage("3D", "Loaded PV004.");
  262. createLabel("004");
  263. pv005 = new THREE.Mesh(
  264. new THREE.CubeGeometry( 4, 1, 1 ),
  265. new THREE.MeshPhongMaterial( {
  266. color: 0xD3D3D3,
  267. specular: 0x050505,
  268. shininess: 100
  269. })
  270. );
  271. pv005.position.set(-8, 0.5, -3);
  272. pv005.rotateY( Math.PI / 3 );
  273. pv005.name = "6A_45_60e_005";
  274. scene.add(pv005);
  275. setMessage("3D", "Loaded PV005.");
  276. createLabel("005");
  277. pv006 = new THREE.Mesh(
  278. new THREE.CubeGeometry( 4, 1, 1 ),
  279. new THREE.MeshPhongMaterial( {
  280. color: 0xD3D3D3,
  281. specular: 0x050505,
  282. shininess: 100
  283. })
  284. );
  285. pv006.position.set(-4.5, 0.5, -2);
  286. pv006.rotateY( Math.PI / 3 );
  287. pv006.name = "1A_45_60e_006";
  288. scene.add(pv006);
  289. setMessage("3D", "Loaded PV006.");
  290. createLabel("006");
  291. pv007 = new THREE.Mesh(
  292. new THREE.CubeGeometry( 4, 1, 1 ),
  293. new THREE.MeshPhongMaterial( {
  294. color: 0xD3D3D3,
  295. specular: 0x050505,
  296. shininess: 100
  297. })
  298. );
  299. pv007.position.set(-5, 0.5, -16);
  300. pv007.rotateY( Math.PI / 3 );
  301. pv007.name = "6C_60_60e_007";
  302. scene.add(pv007);
  303. setMessage("3D", "Loaded PV007.");
  304. createLabel("007");
  305. pv008 = new THREE.Mesh(
  306. new THREE.CubeGeometry( 4, 1, 1 ),
  307. new THREE.MeshPhongMaterial( {
  308. color: 0xD3D3D3,
  309. specular: 0x050505,
  310. shininess: 100
  311. })
  312. );
  313. pv008.position.set(-7, 0.5, -9);
  314. pv008.rotateY( Math.PI / 3 );
  315. pv008.name = "1C_60_60e_008";
  316. scene.add(pv008);
  317. setMessage("3D", "Loaded PV008.");
  318. createLabel("008");
  319. pv009 = new THREE.Mesh(
  320. new THREE.CubeGeometry( 4, 1, 1 ),
  321. new THREE.MeshPhongMaterial( {
  322. color: 0xD3D3D3,
  323. specular: 0x050505,
  324. shininess: 100
  325. })
  326. );
  327. pv009.position.set(13, 0.5, 3);
  328. pv009.rotateY( Math.PI / 4 );
  329. pv009.name = "2A_15_45e_009";
  330. scene.add(pv009);
  331. setMessage("3D", "Loaded PV009.");
  332. createLabel("009");
  333. pv010 = new THREE.Mesh(
  334. new THREE.CubeGeometry( 4, 1, 1 ),
  335. new THREE.MeshPhongMaterial( {
  336. color: 0xD3D3D3,
  337. specular: 0x050505,
  338. shininess: 100
  339. })
  340. );
  341. pv010.position.set(18, 0.5, 4);
  342. pv010.rotateY( Math.PI / 4 );
  343. pv010.name = "1A_15_45e_010";
  344. scene.add(pv010);
  345. setMessage("3D", "Loaded PV010.");
  346. createLabel("010");
  347. pv011 = new THREE.Mesh(
  348. new THREE.CubeGeometry( 4, 1, 1 ),
  349. new THREE.MeshPhongMaterial( {
  350. color: 0xD3D3D3,
  351. specular: 0x050505,
  352. shininess: 100
  353. })
  354. );
  355. pv011.position.set(3.5, 0.5, -0.5);
  356. pv011.rotateY( Math.PI / 4 );
  357. pv011.name = "4A_15_45e_011";
  358. scene.add(pv011);
  359. setMessage("3D", "Loaded PV011.");
  360. createLabel("011");
  361. pv012 = new THREE.Mesh(
  362. new THREE.CubeGeometry( 4, 1, 1 ),
  363. new THREE.MeshPhongMaterial( {
  364. color: 0xD3D3D3,
  365. specular: 0x050505,
  366. shininess: 100
  367. })
  368. );
  369. pv012.position.set(17, 0.5, -1);
  370. pv012.rotateY( Math.PI / 4 );
  371. pv012.name = "6A_30_45e_012";
  372. scene.add(pv012);
  373. setMessage("3D", "Loaded PV012.");
  374. createLabel("012");
  375. pv013 = new THREE.Mesh(
  376. new THREE.CubeGeometry( 4, 1, 1 ),
  377. new THREE.MeshPhongMaterial( {
  378. color: 0xD3D3D3,
  379. specular: 0x050505,
  380. shininess: 100
  381. })
  382. );
  383. pv013.position.set(-2, 0.5, -1);
  384. pv013.rotateY( Math.PI / 4 );
  385. pv013.name = "2A_30_45e_013";
  386. scene.add(pv013);
  387. setMessage("3D", "Loaded PV013.");
  388. createLabel("013");
  389. pv014 = new THREE.Mesh(
  390. new THREE.CubeGeometry( 4, 1, 1 ),
  391. new THREE.MeshPhongMaterial( {
  392. color: 0xD3D3D3,
  393. specular: 0x050505,
  394. shininess: 100
  395. })
  396. );
  397. pv014.position.set(9, 0.5, -3);
  398. pv014.rotateY( Math.PI / 4 );
  399. pv014.name = "2A_45_45e_014";
  400. scene.add(pv014);
  401. setMessage("3D", "Loaded PV014.");
  402. createLabel("014");
  403. pv015 = new THREE.Mesh(
  404. new THREE.CubeGeometry( 4, 1, 1 ),
  405. new THREE.MeshPhongMaterial( {
  406. color: 0xD3D3D3,
  407. specular: 0x050505,
  408. shininess: 100
  409. })
  410. );
  411. pv015.position.set(12.5, 0.5, -2);
  412. pv015.rotateY( Math.PI / 4 );
  413. pv015.name = "4A_45_45e_015";
  414. scene.add(pv015);
  415. setMessage("3D", "Loaded PV015.");
  416. createLabel("015");
  417. pv016 = new THREE.Mesh(
  418. new THREE.CubeGeometry( 4, 1, 1 ),
  419. new THREE.MeshPhongMaterial( {
  420. color: 0xD3D3D3,
  421. specular: 0x050505,
  422. shininess: 100
  423. })
  424. );
  425. pv016.position.set(-1, 0.5, -22);
  426. pv016.rotateY( Math.PI / 4 );
  427. pv016.name = "6A_60_45e_016";
  428. scene.add(pv016);
  429. setMessage("3D", "Loaded PV016.");
  430. createLabel("016");
  431. pv017 = new THREE.Mesh(
  432. new THREE.CubeGeometry( 4, 1, 1 ),
  433. new THREE.MeshPhongMaterial( {
  434. color: 0xD3D3D3,
  435. specular: 0x050505,
  436. shininess: 100
  437. })
  438. );
  439. pv017.position.set(-2, 0.5, -26);
  440. pv017.rotateY( Math.PI / 4 );
  441. pv017.name = "2A_60_45e_017";
  442. scene.add(pv017);
  443. setMessage("3D", "Loaded PV017.");
  444. createLabel("017");
  445. pv018 = new THREE.Mesh(
  446. new THREE.CubeGeometry( 4, 1, 1 ),
  447. new THREE.MeshPhongMaterial( {
  448. color: 0xD3D3D3,
  449. specular: 0x050505,
  450. shininess: 100
  451. })
  452. );
  453. pv018.position.set(-8.5, 0.5, 23);
  454. pv018.rotateY( Math.PI / 6 );
  455. pv018.name = "3A_15_30e_018";
  456. scene.add(pv018);
  457. setMessage("3D", "Loaded PV018.");
  458. createLabel("018");
  459. pv019 = new THREE.Mesh(
  460. new THREE.CubeGeometry( 4, 1, 1 ),
  461. new THREE.MeshPhongMaterial( {
  462. color: 0xD3D3D3,
  463. specular: 0x050505,
  464. shininess: 100
  465. })
  466. );
  467. pv019.position.set(-10, 0.5, 26.5);
  468. pv019.rotateY( Math.PI / 6 );
  469. pv019.name = "1A_15_30e_019";
  470. scene.add(pv019);
  471. setMessage("3D", "Loaded PV019.");
  472. createLabel("019");
  473. pv020 = new THREE.Mesh(
  474. new THREE.CubeGeometry( 4, 1, 1 ),
  475. new THREE.MeshPhongMaterial( {
  476. color: 0xD3D3D3,
  477. specular: 0x050505,
  478. shininess: 100
  479. })
  480. );
  481. pv020.position.set(6, 0.5, 14);
  482. pv020.rotateY( Math.PI / 6 );
  483. pv020.name = "1B_15_30e_020";
  484. scene.add(pv020);
  485. setMessage("3D", "Loaded PV020.");
  486. createLabel("020");
  487. pv021 = new THREE.Mesh(
  488. new THREE.CubeGeometry( 4, 1, 1 ),
  489. new THREE.MeshPhongMaterial( {
  490. color: 0xD3D3D3,
  491. specular: 0x050505,
  492. shininess: 100
  493. })
  494. );
  495. pv021.position.set(12, 0.5, 19);
  496. pv021.rotateY( Math.PI / 6 );
  497. pv021.name = "1D_15_30e_021";
  498. scene.add(pv021);
  499. setMessage("3D", "Loaded PV021.");
  500. createLabel("021");
  501. pv022 = new THREE.Mesh(
  502. new THREE.CubeGeometry( 4, 1, 1 ),
  503. new THREE.MeshPhongMaterial( {
  504. color: 0xD3D3D3,
  505. specular: 0x050505,
  506. shininess: 100
  507. })
  508. );
  509. pv022.position.set(6, 0.5, 17);
  510. pv022.rotateY( Math.PI / 6 );
  511. pv022.name = "1C_15_30e_022";
  512. scene.add(pv022);
  513. setMessage("3D", "Loaded PV022.");
  514. createLabel("022");
  515. pv023 = new THREE.Mesh(
  516. new THREE.CubeGeometry( 4, 1, 1 ),
  517. new THREE.MeshPhongMaterial( {
  518. color: 0xD3D3D3,
  519. specular: 0x050505,
  520. shininess: 100
  521. })
  522. );
  523. pv023.position.set(9, 0.5, 18);
  524. pv023.rotateY( Math.PI / 6 );
  525. pv023.name = "5A_15_30e_023";
  526. scene.add(pv023);
  527. setMessage("3D", "Loaded PV023.");
  528. createLabel("023");
  529. pv024 = new THREE.Mesh(
  530. new THREE.CubeGeometry( 4, 1, 1 ),
  531. new THREE.MeshPhongMaterial( {
  532. color: 0xD3D3D3,
  533. specular: 0x050505,
  534. shininess: 100
  535. })
  536. );
  537. pv024.position.set(-16, 0.5, 24);
  538. pv024.rotateY( Math.PI / 6 );
  539. pv024.name = "6D_30_30e_024";
  540. scene.add(pv024);
  541. setMessage("3D", "Loaded PV024.");
  542. createLabel("024");
  543. pv025 = new THREE.Mesh(
  544. new THREE.CubeGeometry( 4, 1, 1 ),
  545. new THREE.MeshPhongMaterial( {
  546. color: 0xD3D3D3,
  547. specular: 0x050505,
  548. shininess: 100
  549. })
  550. );
  551. pv025.position.set(-15, 0.5, 26);
  552. pv025.rotateY( Math.PI / 6 );
  553. pv025.name = "3D_30_30e_025";
  554. scene.add(pv025);
  555. setMessage("3D", "Loaded PV025.");
  556. createLabel("025");
  557. pv026 = new THREE.Mesh(
  558. new THREE.CubeGeometry( 4, 1, 1 ),
  559. new THREE.MeshPhongMaterial( {
  560. color: 0xD3D3D3,
  561. specular: 0x050505,
  562. shininess: 100
  563. })
  564. );
  565. pv026.position.set(1.5, 0.5, -7.5);
  566. pv026.rotateY( Math.PI / 6 );
  567. pv026.name = "6A_45_30e_026";
  568. scene.add(pv026);
  569. setMessage("3D", "Loaded PV026.");
  570. createLabel("026");
  571. pv027 = new THREE.Mesh(
  572. new THREE.CubeGeometry( 4, 1, 1 ),
  573. new THREE.MeshPhongMaterial( {
  574. color: 0xD3D3D3,
  575. specular: 0x050505,
  576. shininess: 100
  577. })
  578. );
  579. pv027.position.set(-3, 0.5, -8.5);
  580. pv027.rotateY( Math.PI / 6 );
  581. pv027.name = "3A_45_30e_027";
  582. scene.add(pv027);
  583. setMessage("3D", "Loaded PV027.");
  584. createLabel("027");
  585. pv028 = new THREE.Mesh(
  586. new THREE.CubeGeometry( 4, 1, 1 ),
  587. new THREE.MeshPhongMaterial( {
  588. color: 0xD3D3D3,
  589. specular: 0x050505,
  590. shininess: 100
  591. })
  592. );
  593. pv028.position.set(3, 0.5, -4.5);
  594. pv028.rotateY( Math.PI / 6 );
  595. pv028.name = "1A_45_30e_028";
  596. scene.add(pv028);
  597. setMessage("3D", "Loaded PV028.");
  598. createLabel("028");
  599. pv029 = new THREE.Mesh(
  600. new THREE.CubeGeometry( 4, 1, 1 ),
  601. new THREE.MeshPhongMaterial( {
  602. color: 0xD3D3D3,
  603. specular: 0x050505,
  604. shininess: 100
  605. })
  606. );
  607. pv029.position.set(3, 0.5, -25);
  608. pv029.rotateY( Math.PI / 6 );
  609. pv029.name = "6A_60_30e_029";
  610. scene.add(pv029);
  611. setMessage("3D", "Loaded PV029.");
  612. createLabel("029");
  613. pv030 = new THREE.Mesh(
  614. new THREE.CubeGeometry( 4, 1, 1 ),
  615. new THREE.MeshPhongMaterial( {
  616. color: 0xD3D3D3,
  617. specular: 0x050505,
  618. shininess: 100
  619. })
  620. );
  621. pv030.position.set(1, 0.5, -13);
  622. pv030.rotateY( Math.PI / 6 );
  623. pv030.name = "3A_60_30e_030";
  624. scene.add(pv030);
  625. setMessage("3D", "Loaded PV030.");
  626. createLabel("030");
  627. pv031 = new THREE.Mesh(
  628. new THREE.CubeGeometry( 4, 1, 1 ),
  629. new THREE.MeshPhongMaterial( {
  630. color: 0xD3D3D3,
  631. specular: 0x050505,
  632. shininess: 100
  633. })
  634. );
  635. pv031.position.set(0, 0.5, -16);
  636. pv031.rotateY( Math.PI / 6 );
  637. pv031.name = "1A_60_30e_031";
  638. scene.add(pv031);
  639. setMessage("3D", "Loaded PV031.");
  640. createLabel("031");
  641. pv032 = new THREE.Mesh(
  642. new THREE.CubeGeometry( 4, 1, 1 ),
  643. new THREE.MeshPhongMaterial( {
  644. color: 0xD3D3D3,
  645. specular: 0x050505,
  646. shininess: 100
  647. })
  648. );
  649. pv032.position.set(7, 0.5, 10.5);
  650. pv032.rotateY( Math.PI / 12 );
  651. pv032.name = "3A_15_15e_032";
  652. scene.add(pv032);
  653. setMessage("3D", "Loaded PV032.");
  654. createLabel("032");
  655. pv033 = new THREE.Mesh(
  656. new THREE.CubeGeometry( 4, 1, 1 ),
  657. new THREE.MeshPhongMaterial( {
  658. color: 0xD3D3D3,
  659. specular: 0x050505,
  660. shininess: 100
  661. })
  662. );
  663. pv033.position.set(-10, 0.5, 29.5);
  664. pv033.rotateY( Math.PI / 12 );
  665. pv033.name = "1B_15_15e_033";
  666. scene.add(pv033);
  667. setMessage("3D", "Loaded PV033.");
  668. createLabel("033");
  669. pv034 = new THREE.Mesh(
  670. new THREE.CubeGeometry( 4, 1, 1 ),
  671. new THREE.MeshPhongMaterial( {
  672. color: 0xD3D3D3,
  673. specular: 0x050505,
  674. shininess: 100
  675. })
  676. );
  677. pv034.position.set(-11, 0.5, 31.5);
  678. pv034.rotateY( Math.PI / 12 );
  679. pv034.name = "4B_15_15e_034";
  680. scene.add(pv034);
  681. setMessage("3D", "Loaded PV034.");
  682. createLabel("034");
  683. pv035 = new THREE.Mesh(
  684. new THREE.CubeGeometry( 4, 1, 1 ),
  685. new THREE.MeshPhongMaterial( {
  686. color: 0xD3D3D3,
  687. specular: 0x050505,
  688. shininess: 100
  689. })
  690. );
  691. pv035.position.set(-13, 0.5, 19);
  692. pv035.rotateY( Math.PI / 12 );
  693. pv035.name = "3A_30_15e_035";
  694. scene.add(pv035);
  695. setMessage("3D", "Loaded PV035.");
  696. createLabel("035");
  697. pv036 = new THREE.Mesh(
  698. new THREE.CubeGeometry( 4, 1, 1 ),
  699. new THREE.MeshPhongMaterial( {
  700. color: 0xD3D3D3,
  701. specular: 0x050505,
  702. shininess: 100
  703. })
  704. );
  705. pv036.position.set(-13, 0.5, 21);
  706. pv036.rotateY( Math.PI / 12 );
  707. pv036.name = "1A_30_15e_036";
  708. scene.add(pv036);
  709. setMessage("3D", "Loaded PV036.");
  710. createLabel("036");
  711. pv037 = new THREE.Mesh(
  712. new THREE.CubeGeometry( 4, 1, 1 ),
  713. new THREE.MeshPhongMaterial( {
  714. color: 0xD3D3D3,
  715. specular: 0x050505,
  716. shininess: 100
  717. })
  718. );
  719. pv037.position.set(-7, 0.5, 20);
  720. pv037.rotateY( Math.PI / 12 );
  721. pv037.name = "5A_30_15e_037";
  722. scene.add(pv037);
  723. setMessage("3D", "Loaded PV037.");
  724. createLabel("037");
  725. pv038 = new THREE.Mesh(
  726. new THREE.CubeGeometry( 4, 1, 1 ),
  727. new THREE.MeshPhongMaterial( {
  728. color: 0xD3D3D3,
  729. specular: 0x050505,
  730. shininess: 100
  731. })
  732. );
  733. pv038.position.set(8, 0.5, -14);
  734. pv038.rotateY( Math.PI / 12 );
  735. pv038.name = "3A_45_15e_038";
  736. scene.add(pv038);
  737. setMessage("3D", "Loaded PV038.");
  738. createLabel("038");
  739. pv039 = new THREE.Mesh(
  740. new THREE.CubeGeometry( 4, 1, 1 ),
  741. new THREE.MeshPhongMaterial( {
  742. color: 0xD3D3D3,
  743. specular: 0x050505,
  744. shininess: 100
  745. })
  746. );
  747. pv039.position.set(8, 0.5, -10);
  748. pv039.rotateY( Math.PI / 12 );
  749. pv039.name = "1A_45_15e_039";
  750. scene.add(pv039);
  751. setMessage("3D", "Loaded PV039.");
  752. createLabel("039");
  753. pv040 = new THREE.Mesh(
  754. new THREE.CubeGeometry( 4, 1, 1 ),
  755. new THREE.MeshPhongMaterial( {
  756. color: 0xD3D3D3,
  757. specular: 0x050505,
  758. shininess: 100
  759. })
  760. );
  761. pv040.position.set(9, 0.5, -6.5);
  762. pv040.rotateY( Math.PI / 12 );
  763. pv040.name = "4A_45_15e_040";
  764. scene.add(pv040);
  765. setMessage("3D", "Loaded PV040.");
  766. createLabel("040");
  767. pv041 = new THREE.Mesh(
  768. new THREE.CubeGeometry( 4, 1, 1 ),
  769. new THREE.MeshPhongMaterial( {
  770. color: 0xD3D3D3,
  771. specular: 0x050505,
  772. shininess: 100
  773. })
  774. );
  775. pv041.position.set(4, 0.5, -20.5);
  776. pv041.rotateY( Math.PI / 12 );
  777. pv041.name = "6A_60_15e_041";
  778. scene.add(pv041);
  779. setMessage("3D", "Loaded PV041.");
  780. createLabel("041");
  781. pv042 = new THREE.Mesh(
  782. new THREE.CubeGeometry( 4, 1, 1 ),
  783. new THREE.MeshPhongMaterial( {
  784. color: 0xD3D3D3,
  785. specular: 0x050505,
  786. shininess: 100
  787. })
  788. );
  789. pv042.position.set(9, 0.5, -22);
  790. pv042.rotateY( Math.PI / 12 );
  791. pv042.name = "3A_60_15e_042";
  792. scene.add(pv042);
  793. setMessage("3D", "Loaded PV042.");
  794. createLabel("042");
  795. pv043 = new THREE.Mesh(
  796. new THREE.CubeGeometry( 4, 1, 1 ),
  797. new THREE.MeshPhongMaterial( {
  798. color: 0xD3D3D3,
  799. specular: 0x050505,
  800. shininess: 100
  801. })
  802. );
  803. pv043.position.set(8, 0.5, -17.5);
  804. pv043.rotateY( Math.PI / 12 );
  805. pv043.name = "1A_60_15e_043";
  806. scene.add(pv043);
  807. setMessage("3D", "Loaded PV043.");
  808. createLabel("043");
  809. pv044 = new THREE.Mesh(
  810. new THREE.CubeGeometry( 4, 1, 1 ),
  811. new THREE.MeshPhongMaterial( {
  812. color: 0xD3D3D3,
  813. specular: 0x050505,
  814. shininess: 100
  815. })
  816. );
  817. pv044.position.set(2, 0.5, 33);
  818. pv044.rotateY( Math.PI );
  819. pv044.name = "3B_15_00s_044";
  820. scene.add(pv044);
  821. setMessage("3D", "Loaded PV044.");
  822. createLabel("044");
  823. pv045 = new THREE.Mesh(
  824. new THREE.CubeGeometry( 4, 1, 1 ),
  825. new THREE.MeshPhongMaterial( {
  826. color: 0xD3D3D3,
  827. specular: 0x050505,
  828. shininess: 100
  829. })
  830. );
  831. pv045.position.set(5, 0.5, 34.5);
  832. pv045.rotateY( Math.PI );
  833. pv045.name = "4B_15_00s_045";
  834. scene.add(pv045);
  835. setMessage("3D", "Loaded PV045.");
  836. createLabel("045");
  837. pv046 = new THREE.Mesh(
  838. new THREE.CubeGeometry( 4, 1, 1 ),
  839. new THREE.MeshPhongMaterial( {
  840. color: 0xD3D3D3,
  841. specular: 0x050505,
  842. shininess: 100
  843. })
  844. );
  845. pv046.position.set(-1, 0.5, 35);
  846. pv046.rotateY( Math.PI );
  847. pv046.name = "6A_02_00s_046";
  848. scene.add(pv046);
  849. setMessage("3D", "Loaded PV046.");
  850. createLabel("046");
  851. pv047 = new THREE.Mesh(
  852. new THREE.CubeGeometry( 4, 1, 1 ),
  853. new THREE.MeshPhongMaterial( {
  854. color: 0xD3D3D3,
  855. specular: 0x050505,
  856. shininess: 100
  857. })
  858. );
  859. pv047.position.set(3, 0.5, 36);
  860. pv047.rotateY( Math.PI );
  861. pv047.name = "2A_02_00s_047";
  862. scene.add(pv047);
  863. setMessage("3D", "Loaded PV047.");
  864. createLabel("047");
  865. pv048 = new THREE.Mesh(
  866. new THREE.CubeGeometry( 4, 1, 1 ),
  867. new THREE.MeshPhongMaterial( {
  868. color: 0xD3D3D3,
  869. specular: 0x050505,
  870. shininess: 100
  871. })
  872. );
  873. pv048.position.set(6, 0.5, 37);
  874. pv048.rotateY( Math.PI );
  875. pv048.name = "1A_02_00s_048";
  876. scene.add(pv048);
  877. setMessage("3D", "Loaded PV048.");
  878. createLabel("048");
  879. pv049 = new THREE.Mesh(
  880. new THREE.CubeGeometry( 4, 1, 1 ),
  881. new THREE.MeshPhongMaterial( {
  882. color: 0xD3D3D3,
  883. specular: 0x050505,
  884. shininess: 100
  885. })
  886. );
  887. pv049.position.set(-11, 0.5, 14);
  888. pv049.rotateY( Math.PI );
  889. pv049.name = "3C_30_00s_049";
  890. scene.add(pv049);
  891. setMessage("3D", "Loaded PV049.");
  892. createLabel("049");
  893. pv050 = new THREE.Mesh(
  894. new THREE.CubeGeometry( 4, 1, 1 ),
  895. new THREE.MeshPhongMaterial( {
  896. color: 0xD3D3D3,
  897. specular: 0x050505,
  898. shininess: 100
  899. })
  900. );
  901. pv050.position.set(-10.5, 0.5, 11);
  902. pv050.rotateY( Math.PI );
  903. pv050.name = "1A_30_00s_050";
  904. scene.add(pv050);
  905. setMessage("3D", "Loaded PV050.");
  906. createLabel("050");
  907. pv051 = new THREE.Mesh(
  908. new THREE.CubeGeometry( 4, 1, 1 ),
  909. new THREE.MeshPhongMaterial( {
  910. color: 0xD3D3D3,
  911. specular: 0x050505,
  912. shininess: 100
  913. })
  914. );
  915. pv051.position.set(8, 0.5, 7.5);
  916. pv051.rotateY( Math.PI );
  917. pv051.name = "1B_30_00s_051";
  918. scene.add(pv051);
  919. setMessage("3D", "Loaded PV051.");
  920. createLabel("051");
  921. pv052 = new THREE.Mesh(
  922. new THREE.CubeGeometry( 4, 1, 1 ),
  923. new THREE.MeshPhongMaterial( {
  924. color: 0xD3D3D3,
  925. specular: 0x050505,
  926. shininess: 100
  927. })
  928. );
  929. pv052.position.set(-10, 0.5, 8);
  930. pv052.rotateY( Math.PI );
  931. pv052.name = "1D_30_00s_052";
  932. scene.add(pv052);
  933. setMessage("3D", "Loaded PV052.");
  934. createLabel("052");
  935. pv053 = new THREE.Mesh(
  936. new THREE.CubeGeometry( 4, 1, 1 ),
  937. new THREE.MeshPhongMaterial( {
  938. color: 0xD3D3D3,
  939. specular: 0x050505,
  940. shininess: 100
  941. })
  942. );
  943. pv053.position.set(3, 0.5, 25);
  944. pv053.rotateY( Math.PI );
  945. pv053.name = "1C_30_00s_053";
  946. scene.add(pv053);
  947. setMessage("3D", "Loaded PV053.");
  948. createLabel("053");
  949. pv054 = new THREE.Mesh(
  950. new THREE.CubeGeometry( 4, 1, 1 ),
  951. new THREE.MeshPhongMaterial( {
  952. color: 0xD3D3D3,
  953. specular: 0x050505,
  954. shininess: 100
  955. })
  956. );
  957. pv054.position.set(2.5, 0.5, 28);
  958. pv054.rotateY( Math.PI );
  959. pv054.name = "4D_30_00s_054";
  960. scene.add(pv054);
  961. setMessage("3D", "Loaded PV054.");
  962. createLabel("054");
  963. pv055 = new THREE.Mesh(
  964. new THREE.CubeGeometry( 4, 1, 1 ),
  965. new THREE.MeshPhongMaterial( {
  966. color: 0xD3D3D3,
  967. specular: 0x050505,
  968. shininess: 100
  969. })
  970. );
  971. pv055.position.set(15, 0.5, -7);
  972. pv055.rotateY( Math.PI );
  973. pv055.name = "3A_45_00s_055";
  974. scene.add(pv055);
  975. setMessage("3D", "Loaded PV055.");
  976. createLabel("055");
  977. pv056 = new THREE.Mesh(
  978. new THREE.CubeGeometry( 4, 1, 1 ),
  979. new THREE.MeshPhongMaterial( {
  980. color: 0xD3D3D3,
  981. specular: 0x050505,
  982. shininess: 100
  983. })
  984. );
  985. pv056.position.set(15, 0.5, -11);
  986. pv056.rotateY( Math.PI );
  987. pv056.name = "4A_45_00s_056";
  988. scene.add(pv056);
  989. setMessage("3D", "Loaded PV056.");
  990. createLabel("056");
  991. pv057 = new THREE.Mesh(
  992. new THREE.CubeGeometry( 4, 1, 1 ),
  993. new THREE.MeshPhongMaterial( {
  994. color: 0xD3D3D3,
  995. specular: 0x050505,
  996. shininess: 100
  997. })
  998. );
  999. pv057.position.set(9, 0.5, -27.5);
  1000. pv057.rotateY( Math.PI );
  1001. pv057.name = "6A_60_00s_057";
  1002. scene.add(pv057);
  1003. setMessage("3D", "Loaded PV057.");
  1004. createLabel("057");
  1005. pv058 = new THREE.Mesh(
  1006. new THREE.CubeGeometry( 4, 1, 1 ),
  1007. new THREE.MeshPhongMaterial( {
  1008. color: 0xD3D3D3,
  1009. specular: 0x050505,
  1010. shininess: 100
  1011. })
  1012. );
  1013. pv058.position.set(0, 0.5, -30);
  1014. pv058.rotateY( Math.PI );
  1015. pv058.name = "3A_60_00s_058";
  1016. scene.add(pv058);
  1017. setMessage("3D", "Loaded PV058.");
  1018. createLabel("058");
  1019. pv059 = new THREE.Mesh(
  1020. new THREE.CubeGeometry( 4, 1, 1 ),
  1021. new THREE.MeshPhongMaterial( {
  1022. color: 0xD3D3D3,
  1023. specular: 0x050505,
  1024. shininess: 100
  1025. })
  1026. );
  1027. pv059.position.set(8, 0.5, 25.5);
  1028. pv059.rotateY( 11 * Math.PI / 12 );
  1029. pv059.name = "3B_15_15w_059";
  1030. scene.add(pv059);
  1031. setMessage("3D", "Loaded PV059.");
  1032. createLabel("059");
  1033. pv060 = new THREE.Mesh(
  1034. new THREE.CubeGeometry( 4, 1, 1 ),
  1035. new THREE.MeshPhongMaterial( {
  1036. color: 0xD3D3D3,
  1037. specular: 0x050505,
  1038. shininess: 100
  1039. })
  1040. );
  1041. pv060.position.set(2.5, 0.5, 31);
  1042. pv060.rotateY( 11 * Math.PI / 12 );
  1043. pv060.name = "1B_15_15w_060";
  1044. scene.add(pv060);
  1045. setMessage("3D", "Loaded PV060.");
  1046. createLabel("060");
  1047. pv061 = new THREE.Mesh(
  1048. new THREE.CubeGeometry( 4, 1, 1 ),
  1049. new THREE.MeshPhongMaterial( {
  1050. color: 0xD3D3D3,
  1051. specular: 0x050505,
  1052. shininess: 100
  1053. })
  1054. );
  1055. pv061.position.set(9.5, 0.5, 35.5);
  1056. pv061.rotateY( 11 * Math.PI / 12 );
  1057. pv061.name = "4B_15_15w_061";
  1058. scene.add(pv061);
  1059. setMessage("3D", "Loaded PV061.");
  1060. createLabel("061");
  1061. pv062 = new THREE.Mesh(
  1062. new THREE.CubeGeometry( 4, 1, 1 ),
  1063. new THREE.MeshPhongMaterial( {
  1064. color: 0xD3D3D3,
  1065. specular: 0x050505,
  1066. shininess: 100
  1067. })
  1068. );
  1069. pv062.position.set(8, 0.5, 22.15);
  1070. pv062.rotateY( 11 * Math.PI / 12 );
  1071. pv062.name = "3A_30_15w_062";
  1072. scene.add(pv062);
  1073. setMessage("3D", "Loaded PV062.");
  1074. createLabel("062");
  1075. pv063 = new THREE.Mesh(
  1076. new THREE.CubeGeometry( 4, 1, 1 ),
  1077. new THREE.MeshPhongMaterial( {
  1078. color: 0xD3D3D3,
  1079. specular: 0x050505,
  1080. shininess: 100
  1081. })
  1082. );
  1083. pv063.position.set(12.5, 0.5, 23.25);
  1084. pv063.rotateY( 11 * Math.PI / 12 );
  1085. pv063.name = "1A_30_15w_063";
  1086. scene.add(pv063);
  1087. setMessage("3D", "Loaded PV063.");
  1088. createLabel("063");
  1089. pv064 = new THREE.Mesh(
  1090. new THREE.CubeGeometry( 4, 1, 1 ),
  1091. new THREE.MeshPhongMaterial( {
  1092. color: 0xD3D3D3,
  1093. specular: 0x050505,
  1094. shininess: 100
  1095. })
  1096. );
  1097. pv064.position.set(3.5, 0.5, 21);
  1098. pv064.rotateY( 11 * Math.PI / 12 );
  1099. pv064.name = "5A_30_15w_064";
  1100. scene.add(pv064);
  1101. setMessage("3D", "Loaded PV064.");
  1102. createLabel("064");
  1103. pv065 = new THREE.Mesh(
  1104. new THREE.CubeGeometry( 4, 1, 1 ),
  1105. new THREE.MeshPhongMaterial( {
  1106. color: 0xD3D3D3,
  1107. specular: 0x050505,
  1108. shininess: 100
  1109. })
  1110. );
  1111. pv065.position.set(16, 0.5, -19);
  1112. pv065.rotateY( 11 * Math.PI / 12 );
  1113. pv065.name = "3A_45_15w_065";
  1114. scene.add(pv065);
  1115. setMessage("3D", "Loaded PV065.");
  1116. createLabel("065");
  1117. pv066 = new THREE.Mesh(
  1118. new THREE.CubeGeometry( 4, 1, 1 ),
  1119. new THREE.MeshPhongMaterial( {
  1120. color: 0xD3D3D3,
  1121. specular: 0x050505,
  1122. shininess: 100
  1123. })
  1124. );
  1125. pv066.position.set(17, 0.5, -22);
  1126. pv066.rotateY( 11 * Math.PI / 12 );
  1127. pv066.name = "1A_45_15w_066";
  1128. scene.add(pv066);
  1129. setMessage("3D", "Loaded PV066.");
  1130. createLabel("066");
  1131. pv067 = new THREE.Mesh(
  1132. new THREE.CubeGeometry( 4, 1, 1 ),
  1133. new THREE.MeshPhongMaterial( {
  1134. color: 0xD3D3D3,
  1135. specular: 0x050505,
  1136. shininess: 100
  1137. })
  1138. );
  1139. pv067.position.set(15, 0.5, -15);
  1140. pv067.rotateY( 11 * Math.PI / 12 );
  1141. pv067.name = "4A_45_15w_067";
  1142. scene.add(pv067);
  1143. setMessage("3D", "Loaded PV067.");
  1144. createLabel("067");
  1145. pv068 = new THREE.Mesh(
  1146. new THREE.CubeGeometry( 4, 1, 1 ),
  1147. new THREE.MeshPhongMaterial( {
  1148. color: 0xD3D3D3,
  1149. specular: 0x050505,
  1150. shininess: 100
  1151. })
  1152. );
  1153. pv068.position.set(15, 0.5, -27);
  1154. pv068.rotateY( 11 * Math.PI / 12 );
  1155. pv068.name = "6A_60_15w_068";
  1156. scene.add(pv068);
  1157. setMessage("3D", "Loaded PV068.");
  1158. createLabel("068");
  1159. pv069 = new THREE.Mesh(
  1160. new THREE.CubeGeometry( 4, 1, 1 ),
  1161. new THREE.MeshPhongMaterial( {
  1162. color: 0xD3D3D3,
  1163. specular: 0x050505,
  1164. shininess: 100
  1165. })
  1166. );
  1167. pv069.position.set(20, 0.5, -25.75);
  1168. pv069.rotateY( 11 * Math.PI / 12 );
  1169. pv069.name = "3A_60_15w_069";
  1170. scene.add(pv069);
  1171. setMessage("3D", "Loaded PV069.");
  1172. createLabel("069");
  1173. pv070 = new THREE.Mesh(
  1174. new THREE.CubeGeometry( 4, 1, 1 ),
  1175. new THREE.MeshPhongMaterial( {
  1176. color: 0xD3D3D3,
  1177. specular: 0x050505,
  1178. shininess: 100
  1179. })
  1180. );
  1181. pv070.position.set(25, 0.5, -24.5);
  1182. pv070.rotateY( 11 * Math.PI / 12 );
  1183. pv070.name = "1A_60_15w_070";
  1184. scene.add(pv070);
  1185. setMessage("3D", "Loaded PV070.");
  1186. createLabel("070");
  1187. pv071 = new THREE.Mesh(
  1188. new THREE.CubeGeometry( 4, 1, 1 ),
  1189. new THREE.MeshPhongMaterial( {
  1190. color: 0xD3D3D3,
  1191. specular: 0x050505,
  1192. shininess: 100
  1193. })
  1194. );
  1195. pv071.position.set(17, 0.5, 25);
  1196. pv071.rotateY( 11 * Math.PI / 6 );
  1197. pv071.name = "3A_15_30w_071";
  1198. scene.add(pv071);
  1199. setMessage("3D", "Loaded PV071.");
  1200. createLabel("071");
  1201. pv072 = new THREE.Mesh(
  1202. new THREE.CubeGeometry( 4, 1, 1 ),
  1203. new THREE.MeshPhongMaterial( {
  1204. color: 0xD3D3D3,
  1205. specular: 0x050505,
  1206. shininess: 100
  1207. })
  1208. );
  1209. pv072.position.set(6.75, 0.5, 32.5);
  1210. pv072.rotateY( 11 * Math.PI / 6 );
  1211. pv072.name = "1A_15_30w_072";
  1212. scene.add(pv072);
  1213. setMessage("3D", "Loaded PV072.");
  1214. createLabel("072");
  1215. pv073 = new THREE.Mesh(
  1216. new THREE.CubeGeometry( 4, 1, 1 ),
  1217. new THREE.MeshPhongMaterial( {
  1218. color: 0xD3D3D3,
  1219. specular: 0x050505,
  1220. shininess: 100
  1221. })
  1222. );
  1223. pv073.position.set(10.5, 0.5, 38.25);
  1224. pv073.rotateY( 11 * Math.PI / 6 );
  1225. pv073.name = "1B_15_30w_073";
  1226. scene.add(pv073);
  1227. setMessage("3D", "Loaded PV073.");
  1228. createLabel("073");
  1229. pv074 = new THREE.Mesh(
  1230. new THREE.CubeGeometry( 4, 1, 1 ),
  1231. new THREE.MeshPhongMaterial( {
  1232. color: 0xD3D3D3,
  1233. specular: 0x050505,
  1234. shininess: 100
  1235. })
  1236. );
  1237. pv074.position.set(12.5, 0.5, 27.5);
  1238. pv074.rotateY( 11 * Math.PI / 6 );
  1239. pv074.name = "1D_15_30w_074";
  1240. scene.add(pv074);
  1241. setMessage("3D", "Loaded PV074.");
  1242. createLabel("074");
  1243. pv075 = new THREE.Mesh(
  1244. new THREE.CubeGeometry( 4, 1, 1 ),
  1245. new THREE.MeshPhongMaterial( {
  1246. color: 0xD3D3D3,
  1247. specular: 0x050505,
  1248. shininess: 100
  1249. })
  1250. );
  1251. pv075.position.set(7.5, 0.5, 29.5);
  1252. pv075.rotateY( 11 * Math.PI / 6 );
  1253. pv075.name = "1C_15_30w_075";
  1254. scene.add(pv075);
  1255. createLabel("075");
  1256. pv076 = new THREE.Mesh(
  1257. new THREE.CubeGeometry( 4, 1, 1 ),
  1258. new THREE.MeshPhongMaterial( {
  1259. color: 0xD3D3D3,
  1260. specular: 0x050505,
  1261. shininess: 100
  1262. })
  1263. );
  1264. pv076.position.set(11, 0.5, 33.5);
  1265. pv076.rotateY( 11 * Math.PI / 6 );
  1266. pv076.name = "5D_15_30w_076";
  1267. scene.add(pv076);
  1268. setMessage("3D", "Loaded PV076.");
  1269. createLabel("076");
  1270. pv077 = new THREE.Mesh(
  1271. new THREE.CubeGeometry( 4, 1, 1 ),
  1272. new THREE.MeshPhongMaterial( {
  1273. color: 0xD3D3D3,
  1274. specular: 0x050505,
  1275. shininess: 100
  1276. })
  1277. );
  1278. pv077.position.set(13, 0.5, 12);
  1279. pv077.rotateY( 11 * Math.PI / 6 );
  1280. pv077.name = "6D_30_30w_077";
  1281. scene.add(pv077);
  1282. setMessage("3D", "Loaded PV077.");
  1283. createLabel("077");
  1284. pv078 = new THREE.Mesh(
  1285. new THREE.CubeGeometry( 4, 1, 1 ),
  1286. new THREE.MeshPhongMaterial( {
  1287. color: 0xD3D3D3,
  1288. specular: 0x050505,
  1289. shininess: 100
  1290. })
  1291. );
  1292. pv078.position.set(12, 0.5, 15);
  1293. pv078.rotateY( 11 * Math.PI / 6 );
  1294. pv078.name = "3D_30_30w_078";
  1295. scene.add(pv078);
  1296. setMessage("3D", "Loaded PV078.");
  1297. createLabel("078");
  1298. pv079 = new THREE.Mesh(
  1299. new THREE.CubeGeometry( 4, 1, 1 ),
  1300. new THREE.MeshPhongMaterial( {
  1301. color: 0xD3D3D3,
  1302. specular: 0x050505,
  1303. shininess: 100
  1304. })
  1305. );
  1306. pv079.position.set(14, 0.5, 9);
  1307. pv079.rotateY( 11 * Math.PI / 6 );
  1308. pv079.name = "1D_30_30w_079";
  1309. scene.add(pv079);
  1310. setMessage("3D", "Loaded PV079.");
  1311. createLabel("079");
  1312. pv080 = new THREE.Mesh(
  1313. new THREE.CubeGeometry( 4, 1, 1 ),
  1314. new THREE.MeshPhongMaterial( {
  1315. color: 0xD3D3D3,
  1316. specular: 0x050505,
  1317. shininess: 100
  1318. })
  1319. );
  1320. pv080.position.set(20, 0.5, -4);
  1321. pv080.rotateY( 11 * Math.PI / 6 );
  1322. pv080.name = "3A_45_30w_080";
  1323. scene.add(pv080);
  1324. setMessage("3D", "Loaded PV080.");
  1325. createLabel("080");
  1326. pv081 = new THREE.Mesh(
  1327. new THREE.CubeGeometry( 4, 1, 1 ),
  1328. new THREE.MeshPhongMaterial( {
  1329. color: 0xD3D3D3,
  1330. specular: 0x050505,
  1331. shininess: 100
  1332. })
  1333. );
  1334. pv081.position.set(21, 0.5, -7);
  1335. pv081.rotateY( 11 * Math.PI / 6 );
  1336. pv081.name = "1A_45_30w_081";
  1337. scene.add(pv081);
  1338. setMessage("3D", "Loaded PV081.");
  1339. createLabel("081");
  1340. pv082 = new THREE.Mesh(
  1341. new THREE.CubeGeometry( 4, 1, 1 ),
  1342. new THREE.MeshPhongMaterial( {
  1343. color: 0xD3D3D3,
  1344. specular: 0x050505,
  1345. shininess: 100
  1346. })
  1347. );
  1348. pv082.position.set(21.5, 0.5, -11);
  1349. pv082.rotateY( 11 * Math.PI / 6 );
  1350. pv082.name = "5A_45_30w_082";
  1351. scene.add(pv082);
  1352. setMessage("3D", "Loaded PV082.");
  1353. createLabel("082");
  1354. pv083 = new THREE.Mesh(
  1355. new THREE.CubeGeometry( 4, 1, 1 ),
  1356. new THREE.MeshPhongMaterial( {
  1357. color: 0xD3D3D3,
  1358. specular: 0x050505,
  1359. shininess: 100
  1360. })
  1361. );
  1362. pv083.position.set(24, 0.5, -21);
  1363. pv083.rotateY( 11 * Math.PI / 6 );
  1364. pv083.name = "6A_60_30w_083";
  1365. scene.add(pv083);
  1366. setMessage("3D", "Loaded PV083.");
  1367. createLabel("083");
  1368. pv084 = new THREE.Mesh(
  1369. new THREE.CubeGeometry( 4, 1, 1 ),
  1370. new THREE.MeshPhongMaterial( {
  1371. color: 0xD3D3D3,
  1372. specular: 0x050505,
  1373. shininess: 100
  1374. })
  1375. );
  1376. pv084.position.set(23, 0.5, -18);
  1377. pv084.rotateY( 11 * Math.PI / 6 );
  1378. pv084.name = "3A_60_30w_084";
  1379. scene.add(pv084);
  1380. setMessage("3D", "Loaded PV084.");
  1381. createLabel("084");
  1382. pv085 = new THREE.Mesh(
  1383. new THREE.CubeGeometry( 4, 1, 1 ),
  1384. new THREE.MeshPhongMaterial( {
  1385. color: 0xD3D3D3,
  1386. specular: 0x050505,
  1387. shininess: 100
  1388. })
  1389. );
  1390. pv085.position.set(23, 0.5, -14);
  1391. pv085.rotateY( 11 * Math.PI / 6 );
  1392. pv085.name = "1A_60_30w_085";
  1393. scene.add(pv085);
  1394. setMessage("3D", "Loaded PV085.");
  1395. createLabel("085");
  1396. pv086 = new THREE.Mesh(
  1397. new THREE.CubeGeometry( 4, 1, 1 ),
  1398. new THREE.MeshPhongMaterial( {
  1399. color: 0xD3D3D3,
  1400. specular: 0x050505,
  1401. shininess: 100
  1402. })
  1403. );
  1404. pv086.position.set(12, 0.5, 30.5);
  1405. pv086.rotateY( 7 * Math.PI / 4 );
  1406. pv086.name = "2A_15_45w_086";
  1407. scene.add(pv086);
  1408. setMessage("3D", "Loaded PV086.");
  1409. createLabel("086");
  1410. pv087 = new THREE.Mesh(
  1411. new THREE.CubeGeometry( 4, 1, 1 ),
  1412. new THREE.MeshPhongMaterial( {
  1413. color: 0xD3D3D3,
  1414. specular: 0x050505,
  1415. shininess: 100
  1416. })
  1417. );
  1418. pv087.position.set(16, 0.5, 30.5);
  1419. pv087.rotateY( 7 * Math.PI / 4 );
  1420. pv087.name = "1A_15_45w_087";
  1421. scene.add(pv087);
  1422. setMessage("3D", "Loaded PV087.");
  1423. createLabel("087");
  1424. pv088 = new THREE.Mesh(
  1425. new THREE.CubeGeometry( 4, 1, 1 ),
  1426. new THREE.MeshPhongMaterial( {
  1427. color: 0xD3D3D3,
  1428. specular: 0x050505,
  1429. shininess: 100
  1430. })
  1431. );
  1432. pv088.position.set(17, 0.5, 27.5);
  1433. pv088.rotateY( 7 * Math.PI / 4 );
  1434. pv088.name = "4A_15_45w_088";
  1435. scene.add(pv088);
  1436. setMessage("3D", "Loaded PV088.");
  1437. createLabel("088");
  1438. pv089 = new THREE.Mesh(
  1439. new THREE.CubeGeometry( 4, 1, 1 ),
  1440. new THREE.MeshPhongMaterial( {
  1441. color: 0xD3D3D3,
  1442. specular: 0x050505,
  1443. shininess: 100
  1444. })
  1445. );
  1446. pv089.position.set(20, 0.5, 11);
  1447. pv089.rotateY( 7 * Math.PI / 4 );
  1448. pv089.name = "6A_30_45w_089";
  1449. scene.add(pv089);
  1450. setMessage("3D", "Loaded PV089.");
  1451. createLabel("089");
  1452. pv090 = new THREE.Mesh(
  1453. new THREE.CubeGeometry( 4, 1, 1 ),
  1454. new THREE.MeshPhongMaterial( {
  1455. color: 0xD3D3D3,
  1456. specular: 0x050505,
  1457. shininess: 100
  1458. })
  1459. );
  1460. pv090.position.set(19, 0.5, 14);
  1461. pv090.rotateY( 7 * Math.PI / 4 );
  1462. pv090.name = "2A_30_45w_090";
  1463. scene.add(pv090);
  1464. setMessage("3D", "Loaded PV090.");
  1465. createLabel("090");
  1466. pv091 = new THREE.Mesh(
  1467. new THREE.CubeGeometry( 4, 1, 1 ),
  1468. new THREE.MeshPhongMaterial( {
  1469. color: 0xD3D3D3,
  1470. specular: 0x050505,
  1471. shininess: 100
  1472. })
  1473. );
  1474. pv091.position.set(29, 0.5, -14);
  1475. pv091.rotateY( 7 * Math.PI / 4 );
  1476. pv091.name = "2C_45_45w_091";
  1477. scene.add(pv091);
  1478. setMessage("3D", "Loaded PV091.");
  1479. createLabel("091");
  1480. pv092 = new THREE.Mesh(
  1481. new THREE.CubeGeometry( 4, 1, 1 ),
  1482. new THREE.MeshPhongMaterial( {
  1483. color: 0xD3D3D3,
  1484. specular: 0x050505,
  1485. shininess: 100
  1486. })
  1487. );
  1488. pv092.position.set(23, 0.5, 7);
  1489. pv092.rotateY( 7 * Math.PI / 4 );
  1490. pv092.name = "4C_45_45w_092";
  1491. scene.add(pv092);
  1492. setMessage("3D", "Loaded PV092.");
  1493. createLabel("092");
  1494. pv093 = new THREE.Mesh(
  1495. new THREE.CubeGeometry( 4, 1, 1 ),
  1496. new THREE.MeshPhongMaterial( {
  1497. color: 0xD3D3D3,
  1498. specular: 0x050505,
  1499. shininess: 100
  1500. })
  1501. );
  1502. pv093.position.set(30, 0.5, -18);
  1503. pv093.rotateY( 7 * Math.PI / 4 );
  1504. pv093.name = "6A_60_45w_093";
  1505. scene.add(pv093);
  1506. setMessage("3D", "Loaded PV093.");
  1507. createLabel("093");
  1508. pv094 = new THREE.Mesh(
  1509. new THREE.CubeGeometry( 4, 1, 1 ),
  1510. new THREE.MeshPhongMaterial( {
  1511. color: 0xD3D3D3,
  1512. specular: 0x050505,
  1513. shininess: 100
  1514. })
  1515. );
  1516. pv094.position.set(30, 0.5, -22);
  1517. pv094.rotateY( 7 * Math.PI / 4 );
  1518. pv094.name = "2A_60_45w_094";
  1519. scene.add(pv094);
  1520. setMessage("3D", "Loaded PV094.");
  1521. createLabel("094");
  1522. pv095 = new THREE.Mesh(
  1523. new THREE.CubeGeometry( 4, 1, 1 ),
  1524. new THREE.MeshPhongMaterial( {
  1525. color: 0xD3D3D3,
  1526. specular: 0x050505,
  1527. shininess: 100
  1528. })
  1529. );
  1530. pv095.position.set(15, 0.5, 34);
  1531. pv095.rotateY( 5 * Math.PI / 3);
  1532. pv095.name = "6A_15_60w_095";
  1533. scene.add(pv095);
  1534. setMessage("3D", "Loaded PV095.");
  1535. createLabel("095");
  1536. pv096 = new THREE.Mesh(
  1537. new THREE.CubeGeometry( 4, 1, 1 ),
  1538. new THREE.MeshPhongMaterial( {
  1539. color: 0xD3D3D3,
  1540. specular: 0x050505,
  1541. shininess: 100
  1542. })
  1543. );
  1544. pv096.position.set(14, 0.5, 37);
  1545. pv096.rotateY( 5 * Math.PI / 3);
  1546. pv096.name = "2A_15_60w_096";
  1547. scene.add(pv096);
  1548. setMessage("3D", "Loaded PV096.");
  1549. createLabel("096");
  1550. pv097 = new THREE.Mesh(
  1551. new THREE.CubeGeometry( 4, 1, 1 ),
  1552. new THREE.MeshPhongMaterial( {
  1553. color: 0xD3D3D3,
  1554. specular: 0x050505,
  1555. shininess: 100
  1556. })
  1557. );
  1558. pv097.position.set(16, 0.5, 20);
  1559. pv097.rotateY( 5 * Math.PI / 3);
  1560. pv097.name = "6A_30_60w_097";
  1561. scene.add(pv097);
  1562. setMessage("3D", "Loaded PV097.");
  1563. createLabel("097");
  1564. pv098 = new THREE.Mesh(
  1565. new THREE.CubeGeometry( 4, 1, 1 ),
  1566. new THREE.MeshPhongMaterial( {
  1567. color: 0xD3D3D3,
  1568. specular: 0x050505,
  1569. shininess: 100
  1570. })
  1571. );
  1572. pv098.position.set(17, 0.5, 17);
  1573. pv098.rotateY( 5 * Math.PI / 3);
  1574. pv098.name = "1A_30_60w_098";
  1575. scene.add(pv098);
  1576. setMessage("3D", "Loaded PV098.");
  1577. createLabel("098");
  1578. pv099 = new THREE.Mesh(
  1579. new THREE.CubeGeometry( 4, 1, 1 ),
  1580. new THREE.MeshPhongMaterial( {
  1581. color: 0xD3D3D3,
  1582. specular: 0x050505,
  1583. shininess: 100
  1584. })
  1585. );
  1586. pv099.position.set(25, 0.5, -1);
  1587. pv099.rotateY( 5 * Math.PI / 3);
  1588. pv099.name = "6A_45_60w_099";
  1589. scene.add(pv099);
  1590. setMessage("3D", "Loaded PV099.");
  1591. createLabel("099");
  1592. pv100 = new THREE.Mesh(
  1593. new THREE.CubeGeometry( 4, 1, 1 ),
  1594. new THREE.MeshPhongMaterial( {
  1595. color: 0xD3D3D3,
  1596. specular: 0x050505,
  1597. shininess: 100
  1598. })
  1599. );
  1600. pv100.position.set(22, 0.5, 2);
  1601. pv100.rotateY( 5 * Math.PI / 3);
  1602. pv100.name = "1A_45_60w_100";
  1603. scene.add(pv100);
  1604. setMessage("3D", "Loaded PV100.");
  1605. createLabel("100");
  1606. pv101 = new THREE.Mesh(
  1607. new THREE.CubeGeometry( 4, 1, 1 ),
  1608. new THREE.MeshPhongMaterial( {
  1609. color: 0xD3D3D3,
  1610. specular: 0x050505,
  1611. shininess: 100
  1612. })
  1613. );
  1614. pv101.position.set(28, 0.5, -10);
  1615. pv101.rotateY( 5 * Math.PI / 3);
  1616. pv101.name = "2C_60_60w_101";
  1617. scene.add(pv101);
  1618. setMessage("3D", "Loaded PV101.");
  1619. createLabel("101");
  1620. pv102 = new THREE.Mesh(
  1621. new THREE.CubeGeometry( 4, 1, 1 ),
  1622. new THREE.MeshPhongMaterial( {
  1623. color: 0xD3D3D3,
  1624. specular: 0x050505,
  1625. shininess: 100
  1626. })
  1627. );
  1628. pv102.position.set(26, 0.5, -6);
  1629. pv102.rotateY( 5 * Math.PI / 3);
  1630. pv102.name = "1C_60_60w_102";
  1631. scene.add(pv102);
  1632. setMessage("3D", "Loaded PV102.");
  1633. createLabel("102");
  1634. //scene.fog = new THREE.FogExp2( 0x000000, 0.0128 );
  1635. //renderer.setClearColor( scene.fog.color, 1 );
  1636. render();
  1637. }
  1638. function animate() {
  1639. requestAnimationFrame(animate);
  1640. if (enableControls){
  1641. mycontrol.enabled = true;
  1642. } else {
  1643. mycontrol.enabled = false;
  1644. }
  1645. mycontrol.update();
  1646. render();
  1647. }
  1648. var vector;
  1649. function render() {
  1650. /*
  1651. var speed = 0.0002;
  1652. var distance = 200;
  1653. var timer = Date.now() * speed;
  1654. camera.position.x = Math.cos(timer) * distance;
  1655. camera.position.z = Math.sin(timer) * distance;
  1656. camera.lookAt(scene.position);
  1657. */
  1658. //console.log(camera.position);
  1659. // if camera.position.y more than 90 then show module number
  1660. scene.traverse( function( node ) {
  1661. if (node.name != "") {
  1662. //console.log(node.name);
  1663. var _id = node.name;
  1664. _id = "#" + _id.split("_")[-1];
  1665. if (camera.position.y > 0) {
  1666. //console.log(scene.children);
  1667. var obj1 = scene.getObjectByName( node.name );
  1668. var width = window.innerWidth, height = window.innerHeight;
  1669. var widthHalf = width / 2, heightHalf = height / 2;
  1670. var pos = obj1.position.clone();
  1671. pos.project(camera);
  1672. pos.x = ( pos.x * widthHalf ) + widthHalf;
  1673. pos.y = - ( pos.y * heightHalf ) + heightHalf;
  1674. $(_id).show();
  1675. $(_id).css("top", pos.y + 'px');
  1676. $(_id).css("left", (pos.x-10) + 'px');
  1677. //console.log(pos);
  1678. } else {
  1679. $(_id).hide();
  1680. }
  1681. }
  1682. });
  1683. /*
  1684. if (camera.position.y > 0) {
  1685. //console.log(scene.children);
  1686. var obj1 = scene.getObjectByName( "2A_15_60e_001" );
  1687. var width = window.innerWidth, height = window.innerHeight;
  1688. var widthHalf = width / 2, heightHalf = height / 2;
  1689. var pos = obj1.position.clone();
  1690. pos.project(camera);
  1691. pos.x = ( pos.x * widthHalf ) + widthHalf;
  1692. pos.y = - ( pos.y * heightHalf ) + heightHalf;
  1693. $("#text001").show();
  1694. $("#text001").css("top", pos.y + 'px');
  1695. $("#text001").css("left", (pos.x-10) + 'px');
  1696. //console.log(pos);
  1697. } else {
  1698. $("#text001").hide();
  1699. }
  1700. */
  1701. // update the picking ray with the camera and mouse position
  1702. raycaster.setFromCamera( mouse, camera );
  1703. // calculate objects intersecting the picking ray
  1704. var intersects = raycaster.intersectObjects( scene.children );
  1705. //console.log("Check intersection");
  1706. //console.log(intersects);
  1707. for ( var i = 0; i < intersects.length; i++ ) {
  1708. //intersects[ i ].object.material.color.set( 0xff0000 );
  1709. //$("#obj-tooltip").text(intersects[ i ].object.name);
  1710. if (intersects[ i ].object.name != "") {
  1711. $("#obj-tooltip").text("Module: " + intersects[ i ].object.name);
  1712. $("#val-tooltip").text("Value: " + data[ intersects[ i ].object.name ]);
  1713. }
  1714. }
  1715. renderer.render(scene, camera);
  1716. vector = camera.getWorldDirection();
  1717. theta = Math.atan2(vector.x,vector.z);
  1718. theta = theta + 3.142; // add/minux pi to inverse
  1719. var degree = theta * (180/3.142);
  1720. //console.log(degree);
  1721. draw(degree);
  1722. }
  1723. $("#testTrigger").click(function() {
  1724. console.log("clicked");
  1725. pv001.material.color.setHex( 0x00ff00 );
  1726. pv001.scale.y = 10;
  1727. pv001.position.y = 5.5;
  1728. setMessage("3D", "Updated PV001.");
  1729. render();
  1730. });
  1731. $("#message").mousedown(function() {
  1732. console.log("clicked");
  1733. enableControls = false;
  1734. setMessage("GUI", "De-select main scene. Click on main scene to re-select.");
  1735. //render();
  1736. });
  1737. $("#orientation").mousedown(function() {
  1738. console.log("clicked");
  1739. enableControls = false;
  1740. setMessage("GUI", "De-select main scene. Click on main scene to re-select.");
  1741. //render();
  1742. });
  1743. $("#settings").mousedown(function() {
  1744. console.log("clicked");
  1745. enableControls = false;
  1746. setMessage("GUI", "De-select main scene. Click on main scene to re-select.");
  1747. //render();
  1748. });
  1749. $("#slider").mousedown(function() {
  1750. console.log("clicked");
  1751. enableControls = false;
  1752. setMessage("GUI", "De-select main scene. Click on main scene to re-select.");
  1753. //render();
  1754. });
  1755. $("#container").click(function() {
  1756. console.log("clicked");
  1757. enableControls = true;
  1758. animate();
  1759. setMessage("GUI", "Selected main scene.");
  1760. });
  1761. </script>
  1762. <script>
  1763. jQuery(window).load(function () {
  1764. myTimer();
  1765. var myVar = setInterval(myTimer, 10000);
  1766. function myTimer() {
  1767. var dataToSend = {};
  1768. var object;
  1769. var colour;
  1770. var value;
  1771. $.ajax({
  1772. url: '/getdata/',
  1773. type: 'GET',
  1774. data: dataToSend,
  1775. success: function (response) {
  1776. //var objresponse = JSON.parse(response);
  1777. console.log(response);
  1778. data = response;
  1779. var obj = response;
  1780. for (var prop in obj) {
  1781. value = obj[prop];
  1782. if (prop == "time") {
  1783. $("#slider-tooltip").text(value);
  1784. } else {
  1785. // 0 = red
  1786. // 1 = green
  1787. if (value <= 0) {
  1788. colour = "0xff0000";
  1789. } else {
  1790. colour = "0x00ff00";
  1791. }
  1792. object = scene.getObjectByName( prop, true );
  1793. object.material.color.setHex( colour );
  1794. }
  1795. }
  1796. },
  1797. error: function () {
  1798. console.log("Error.")
  1799. }
  1800. });
  1801. }
  1802. });
  1803. </script>
  1804. </body>
  1805. </html>