index.html 61 KB

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