1 window.addEventListener("load", eventWindowLoaded, false);
6 var introduce = document.getElementById('introduce');
7 var ineh = document.getElementById('eucentricheightcontents');
8 var inform = document.getElementById('form');
9 var insingle = document.getElementById('singleparticlecontents');
10 var intomo = document.getElementById('tomography');
11 var inmds = document.getElementById('mds');
13 if (insingle.style.display == "") {
16 console.log("canvasmode=" + canvasmode);
17 }else if(intomo.style.display ==""){
20 console.log("canvasmode=" + canvasmode);
21 }else if(inmds.style.display ==""){
24 console.log("canvasmode=" + canvasmode);
27 console.log("canvasmode=" + canvasmode);
31 function eventWindowLoaded() {
32 //画面がロードされたら、canvasAppを呼び出す
33 /* if (canvasmode == 1) {
35 } else if (canvasmode == 2) {
41 document.getElementById("formmode").style.backgroundColor = '#e0ffff';
42 document.getElementById("formmode2").style.backgroundColor = '#e0ffff';
43 document.getElementById("formmode3").style.backgroundColor = '#e0ffff';
46 function canvasSupport(){
47 return Modernizer.canvas;
50 //var movex = document.forms.movestage.movex.value;
51 //var movey = document.forms.movestage.movey.value;
54 document.onkeydown = funcKey;
73 function switchkey(onoff) {
79 console.log("mode=" + mode);
82 document.onkeydown = function(e) {
85 if (e.keyCode == 38 || e.keyCode == 87 || e.keyCode == 72) {
86 movey = parseInt(movey) + parseInt(1);
87 stagecontrol('stage',movex,movey,movez,movea);
88 emcondition('request');
89 if (canvasmode == 1) {
91 }else if(canvasmode ==2){
93 }else if(canvasmode ==3 ){
98 if (e.keyCode == 40 || e.keyCode == 83 || e.keyCode == 74) {
99 movey = parseInt(movey) - parseInt(1);
100 stagecontrol('stage',movex,movey,movez,movea);
101 emcondition('request');
102 if (canvasmode == 1) {
104 }else if(canvasmode ==2){
106 }else if(canvasmode ==3 ){
111 if (e.keyCode == 37 || e.keyCode == 65 || e.keyCode == 75) {
112 movex = parseInt(movex) - parseInt(1);
113 stagecontrol('stage',movex,movey,movez,movea);
114 emcondition('request');
115 if (canvasmode == 1) {
117 }else if(canvasmode ==2){
119 }else if(canvasmode ==3 ){
124 if (e.keyCode == 39 || e.keyCode == 68 || e.keyCode == 76) {
125 movex = parseInt(movex) + parseInt(1);
126 stagecontrol('stage',movex,movey,movez,movea);
127 emcondition('request');
128 if (canvasmode == 1) {
130 }else if(canvasmode ==2){
132 }else if(canvasmode ==3 ){
140 if (navigator.getGamepads) {
142 var gamepad_list = navigator.getGamepads();
144 console.log(gamepad_list);
146 console.log("function gamepad");
147 window.addEventListener("gamepadconnected", function(e) {
148 console.log("gamepad connected!");
151 if (window.GamepadEvent) {
153 // ------------------------------------------------------------
154 // ゲームパッドを接続すると実行されるイベント
155 // ------------------------------------------------------------
156 window.addEventListener("gamepadconnected", function(e) {
157 console.log("ゲームパッドが接続された");
158 console.log(e.gamepad);
161 // ------------------------------------------------------------
162 // ゲームパッドの接続を解除すると実行されるイベント
163 // ------------------------------------------------------------
164 window.addEventListener("gamepaddisconnected", function(e) {
165 console.log("ゲームパッドの接続が解除された");
166 console.log(e.gamepad);
171 setInterval(function(e){
172 var gamepad = e.gamepad;
173 if (gamepad.axes[0] < -0.5) {
174 movex = parseInt(movex) + parseInt(10);
175 console.log("left!");
178 if (gamepad.axes[0] > 0.5) {
179 movex = parseInt(movex) - parseInt(10);
182 if (gamepad.axes[1] < -0.5) {
183 movey = parseInt(movey) - parseInt(10);
186 if (gamepad.axes[1] > 0.5) {
187 movey = parseInt(movey) + parseInt(10);
194 setInterval(function() {
197 var gamepad_list = navigator.getGamepads();
198 // ゲームパッドリスト内のアイテム総数を取得する
199 var num = gamepad_list.length;
201 for (i = 0; i < num; i++) {
203 var gamepad = gamepad_list[i];
207 str += "index: " + gamepad.index + "\n";
209 str += "timestamp: " + gamepad.timestamp + "\n";
211 str += "id: \"" + gamepad.id + "\"\n";
213 str += "connected: " + gamepad.connected + "\n";
215 str += "mapping: \"" + gamepad.mapping + "\"\n";
218 // ------------------------------------------------------------
219 var buttons = gamepad.buttons;
220 str += "buttons: {\n";
222 var n = buttons.length;
223 for (j = 0; j < n; j++) {
224 // GamepadButton オブジェクトを取得
225 var button = buttons[j];
226 str += " \"" + j + "\": { ";
228 str += "pressed:" + button.pressed + " , ";
230 str += "value:" + button.value + " }\n";
234 // ------------------------------------------------------------
236 var axes = gamepad.axes;
240 for (j = 0; j < n; j++) {
242 if (axes[j] < -0.5) {
243 movex = parseInt(movex) - parseInt(1);
245 console.log(axes[j]);
246 stagecontrol('stage',movex,movey,movez,movea);
247 emcondition('request');
248 if (canvasmode == 1) {
250 } else if (canvasmode == 2) {
252 } else if (canvasmode == 3) {
257 movex = parseInt(movex) + parseInt(1);
258 stagecontrol('stage',movex,movey,movez,movea);
259 emcondition('request');
260 if (canvasmode == 1) {
262 } else if (canvasmode == 2) {
264 } else if (canvasmode == 3){
269 if (axes[j] < -0.5) {
270 movey = parseInt(movey) + parseInt(1);
271 stagecontrol('stage',movex,movey,movez,movea);
272 emcondition('request');
273 if (canvasmode == 1) {
275 } else if (canvasmode == 2) {
277 } else if (canvasmode ==3 ) {
282 movey = parseInt(movey) - parseInt(1);
283 stagecontrol('stage',movex,movey,movez,movea);
284 emcondition('request');
285 if (canvasmode == 1) {
287 } else if (canvasmode == 2) {
289 } else if (canvasmode == 3){
300 window.addEventListener("gamepaddisconnected", function(e) {
301 console.log("gamepad disconnected");
303 window.addEventListener("gamepadconnected", function(e) {
304 console.log("Gamepad connected at index %d: %s. %d buttons, %d axes.",
305 e.gamepad.index, e.gamepad.id,
306 e.gamepad.buttons.length, e.gamepad.axes.length);
312 function canvasApp() {
313 var theCanvas = document.getElementById("canvasOne");
314 //canvasとして利用するhtmlのタグの場所を指定
315 var context = theCanvas.getContext("2d");
318 function drawScreen() {
320 context.fillStyle = "fffffaa";
322 context.fillRect(0, 0, 540, 605);
325 //if(document.forms.movestage.movex.value!=moveformx){
326 moveformx = document.forms.movestage.movex.value;
327 movex=parseInt(moveformx);
329 //if(document.forms.movestage.movey.value!=moveformy){
330 moveformy = document.forms.movestage.movey.value;
331 movey=parseInt(moveformy);
333 moveformz = document.forms.moveza.movez.value;
334 movez=parseInt(moveformz);
337 stagecontrol('stage',movex,movey,movez,movea);
338 emcondition('request');
343 var movez = document.forms.s2.movez.value;
349 var img = new Image();
351 img.onload = function() {
352 //イメージがロードするのを待つ必要があるのでonload
353 //context.scale(movez*0.1,movez*0.1);
354 //context.setTransform(movez*0.1,0,0,movez*0.1,0,0);
355 //context.translate(540/2,605/2);
356 context.drawImage(img, movex, movey);
357 //イメージを描写、引数は画像のオブジェクト,左端のx,y
358 document.getElementById("currentx").innerHTML = movex;
359 document.getElementById("currenty").innerHTML = movey;
360 console.log("x=" + movex);
361 console.log("y=" + movey);
365 img.src = "./image/CC124crudeダイニン.jpg";
368 context.strokeStyle = "#000000";
370 context.strokeRect(5, 5, 505, 610);
371 //わくの輪郭を書く、引数は左端のx,y,幅,高さ
376 function canvastomo() {
377 var theCanvas = document.getElementById("canvastomo");
378 //canvasとして利用するhtmlのタグの場所を指定
379 var context = theCanvas.getContext("2d");
382 function drawScreen() {
384 context.fillStyle = "fffffaa";
386 context.fillRect(0, 0, 540, 605);
389 //if(document.forms.movestage.movex.value!=moveformx){
390 moveformx = document.forms.movestagetomo.movex.value;
391 movex=parseInt(moveformx);
393 //if(document.forms.movestage.movey.value!=moveformy){
394 moveformy = document.forms.movestagetomo.movey.value;
395 movey=parseInt(moveformy);
397 moveformz = document.forms.moveztomo.movez.value;
398 movez=parseInt(moveformz);
401 moveformas = document.forms.setting.standardnum.value;
402 movea = parseInt(moveformas);
403 stagecontrol('stage', movex, movey, movez, movea);
404 emcondition('request');
405 } else if (tiltmode == 2) {
406 moveformat = document.forms.setting.tiltingnum.value;
407 movea = parseInt(moveformat);
408 stagecontrol('stage', movex, movey, movez, movea*(Math.cos(movea * (Math.PI / 180))));
409 emcondition('request');
411 stagecontrol('stage',movex,movey,movez,movea);
412 emcondition('request');
417 var movez = document.forms.s2.movez.value;
423 var img = new Image();
425 img.onload = function() {
426 //イメージがロードするのを待つ必要があるのでonload
427 //context.scale(movez*0.1,movez*0.1);
428 //context.setTransform(movez*0.1,0,0,movez*0.1,0,0);
429 //context.translate(540/2,605/2);
430 context.drawImage(img, movex, movey);
431 //イメージを描写、引数は画像のオブジェクト,左端のx,y
432 document.getElementById("currenttomox").innerHTML = movex;
433 document.getElementById("currenttomoy").innerHTML = movey;
434 console.log("x=" + movex);
435 console.log("y=" + movey);
439 img.src = "./image/axoF11-2 .jpg";
442 context.strokeStyle = "#000000";
444 context.strokeRect(5, 5, 505, 610);
445 //わくの輪郭を書く、引数は左端のx,y,幅,高さ
450 function controlmodeselect(modename){
451 document.getElementById("key").style.backgroundColor = 'transparent';
452 document.getElementById("key2").style.backgroundColor = 'transparent';
453 document.getElementById("key3").style.backgroundColor = 'transparent';
454 document.getElementById("formmode").style.backgroundColor = 'transparent';
455 document.getElementById("formmode2").style.backgroundColor = 'transparent';
456 document.getElementById("formmode3").style.backgroundColor = 'transparent';
457 document.getElementById("gamepad").style.backgroundColor = 'transparent';
458 document.getElementById("gamepad2").style.backgroundColor = 'transparent';
459 document.getElementById("gamepad3").style.backgroundColor = 'transparent';
462 document.getElementById(modename).style.backgroundColor = '#e0ffff';
468 * To change this license header, choose License Headers in Project Properties.
469 * To change this template file, choose Tools | Templates
470 * and open the template in the editor.
474 radio = document.getElementsByName('tilting');
475 document.getElementById('angurar').innerHTML= document.forms.setting.tiltingnum.value;
476 if (radio[0].checked) {
478 document.getElementById('standard').style.display = "";
479 document.getElementById('saxtorn').style.display = "none";
480 } else if (radio[1].checked) {
482 document.getElementById('standard').style.display = "none";
483 document.getElementById('saxtorn').style.display = "";
487 function canvasmds() {
488 var theCanvas = document.getElementById("canvasmds");
489 //canvasとして利用するhtmlのタグの場所を指定
490 var context = theCanvas.getContext("2d");
492 function drawScreen() {
494 context.fillStyle = "fffffaa";
496 context.fillRect(0, 0, 540, 605);
499 //if(document.forms.movestage.movex.value!=moveformx){
500 moveformx = document.forms.movestagemds.movex.value;
501 movex=parseInt(moveformx);
503 //if(document.forms.movestage.movey.value!=moveformy){
504 moveformy = document.forms.movestagemds.movey.value;
505 movey=parseInt(moveformy);
507 moveformz = document.forms.movezmds.movez.value;
508 movez=parseInt(moveformz);
511 stagecontrol('stage',movex,movey,movez,movea);
512 emcondition('request');
517 var movez = document.forms.s2.movez.value;
523 var img = new Image();
525 img.onload = function() {
526 //イメージがロードするのを待つ必要があるのでonload
527 //context.scale(movez*0.1,movez*0.1);
528 //context.setTransform(movez*0.1,0,0,movez*0.1,0,0);
529 //context.translate(540/2,605/2);
530 context.drawImage(img, movex, movey);
531 //イメージを描写、引数は画像のオブジェクト,左端のx,y
532 document.getElementById("currentmdsx").innerHTML = movex;
533 document.getElementById("currentmdsy").innerHTML = movey;
534 console.log("x=" + movex);
535 console.log("y=" + movey);
539 img.src = "./image/flower.jpg";
542 context.strokeStyle = "#000000";
544 context.strokeRect(5, 5, 505, 610);
545 //わくの輪郭を書く、引数は左端のx,y,幅,高さ
550 function shiftplace() {
552 movex = parseInt(movex) + parseInt(10);
553 stagecontrol('stage', movex, movey, movez, movea);
554 emcondition('request');
560 movex = parseInt(movex) - parseInt(10);
561 stagecontrol('stage', movex, movey, movez, movea);
562 emcondition('request');
567 function canvasroot() {
568 var theCanvas = document.getElementById("canvasroot");
569 //canvasとして利用するhtmlのタグの場所を指定
570 var context = theCanvas.getContext("2d");
573 function drawScreen() {
575 context.fillStyle = "fffffaa";
577 context.fillRect(0, 0, 200, 200);
580 //if(document.forms.movestage.movex.value!=moveformx){
581 moveformx = document.forms.movestage.movex.value;
582 movex=parseInt(moveformx);
584 //if(document.forms.movestage.movey.value!=moveformy){
585 moveformy = document.forms.movestage.movey.value;
586 movey=parseInt(moveformy);
588 moveformz = document.forms.moveza.movez.value;
589 movez=parseInt(moveformz);
592 stagecontrol('stage',movex,movey,movez,movea);
593 emcondition('request');
598 var movez = document.forms.s2.movez.value;
604 var img = new Image();
606 img.onload = function() {
607 //イメージがロードするのを待つ必要があるのでonload
608 //context.scale(movez*0.1,movez*0.1);
609 //context.setTransform(movez*0.1,0,0,movez*0.1,0,0);
610 //context.translate(540/2,605/2);
611 context.drawImage(img, movex, movey);
612 //イメージを描写、引数は画像のオブジェクト,左端のx,y
613 document.getElementById("currentx").innerHTML = movex;
614 document.getElementById("currenty").innerHTML = movey;
615 console.log("x=" + movex);
616 console.log("y=" + movey);
620 img.src = "./image/ele.jpg";
623 context.strokeStyle = "#000000";
625 context.strokeRect(5, 5, 505, 610);
626 //わくの輪郭を書く、引数は左端のx,y,幅,高さ