Mercurial > hg > Members > e105711

comparison webGL/DrumSimulator.html @ 8:040c922bd7ff draft

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
keyChar -> keyCode,add sounds
author e105711 <yomitan.ie.u-ryukyu.ac.jp>
date Mon, 14 May 2012 16:19:40 +0900
parents c5455ae6cd70
children 502bc41e0c59
comparison
equal deleted inserted replaced
7:c5455ae6cd70 8:040c922bd7ff
57 gl_FragColor = vec4(color.xyz * v_Dot, color.a); 57 gl_FragColor = vec4(color.xyz * v_Dot, color.a);
58 // gl_FragColor = vec4(color.xyz * v_Dot, 0.5); 58 // gl_FragColor = vec4(color.xyz * v_Dot, 0.5);
59 } 59 }
60 </script> 60 </script>
61 <script> 61 <script>
62 renderStats = new Stats(); 62 renderStats = new Stats();
63 updateStats = new Stats(); 63 updateStats = new Stats();
64 64
65 var MODE = TITLE; 65 var MODE = TITLE;
66 notesArray = []; 66 var AUTO = true;
67 objsArray = []; 67 notesArray = [];
68 68 objsArray = [];
69 /* these variables are defined at const.js */ 69
70 /* these variables are defined at const.js */
70 // var WIDTH = 1024; 71 // var WIDTH = 1024;
71 // var HEIGHT = 640; 72 // var HEIGHT = 640;
72 // var FPS = 50; 73 // var FPS = 50;
73 // var Interval = 1000/FPS; 74 // var Interval = 1000/FPS;
74 75
75 76
76 function main(){ 77 function main(){
77 document.body.appendChild(renderStats.domElement); 78 document.body.appendChild(renderStats.domElement);
78 document.body.appendChild(updateStats.domElement); 79 document.body.appendChild(updateStats.domElement);
79 c = document.getElementById("example"); 80 c = document.getElementById("example");
80 c.width = WIDTH; 81 c.width = WIDTH;
81 c.height = HEIGHT; 82 c.height = HEIGHT;
82 var ctx = init(); 83 var ctx = init();
83 framerate = new Framerate("framerate"); 84
84
85 loop = (function(){ 85 loop = (function(){
86 nextGameTick = (new Date).getTime(); 86 nextGameTick = (new Date).getTime();
87 return function(){ 87 return function(){
88 while((new Date).getTime()>nextGameTick){ 88 while((new Date).getTime()>nextGameTick){
89 updateStats.update(); 89 updateStats.update();
90 gameUpdate(); 90 gameUpdate();
91 nextGameTick += Interval; 91 nextGameTick += Interval;
92 } 92 }
93 renderStats.update(); 93 renderStats.update();
94 gameRender(ctx); 94 gameRender(ctx);
95 }; 95 };
96 })(); 96 })();
97 toTitle(); 97 toTitle();
98 loadSounds(); 98 loadSounds();
99 loadNotes(); 99 loadNotes();
100 } 100 }
101 101
102 function gameStart(){ 102 function gameStart(){
103 setInterval(loop,0); 103 setInterval(loop,0);
104 } 104 }
105 105
106 function init(){ 106 function init(){
107 var gl = initWebGL("example","vshader","fshader",["vNormal","vTexCoord","vPosition"],[0,0,0,1],10000); 107 var gl = initWebGL("example","vshader","fshader",["vNormal","vTexCoord","vPosition"],[0,0,0,1],10000);
108 gl.uniform3f(gl.getUniformLocation(gl.program,"lightDir"),0,0,1); 108 gl.uniform3f(gl.getUniformLocation(gl.program,"lightDir"),0,0,1);
109 gl.uniform1i(gl.getUniformLocation(gl.program,"sampler2d"),0); 109 gl.uniform1i(gl.getUniformLocation(gl.program,"sampler2d"),0);
110 gl.enable(gl.TEXTURE_2D); 110 gl.enable(gl.TEXTURE_2D);
111 parseXml(gl); 111 parseXml(gl);
112 112
113 return gl; 113 return gl;
114 } 114 }
115
116 115
117 width = -1; 116
118 height = -1; 117 width = -1;
119 118 height = -1;
120 function reshape(ctx) 119
121 { 120 function reshape(ctx)
121 {
122 width = c.width; 122 width = c.width;
123 height = c.height; 123 height = c.height;
124 124
125 ctx.viewport(0, 0, width, height); 125 ctx.viewport(0, 0, width, height);
126 126
127 ctx.perspectiveMatrix = new J3DIMatrix4(); 127 ctx.perspectiveMatrix = new J3DIMatrix4();
128 ctx.perspectiveMatrix.ortho(0, -200, 0, -140, 0, 10000); 128 ctx.perspectiveMatrix.ortho(0, -200, 0, -140, 0, 10000);
129 } 129 }
130 130
131 </script> 131 </script>
132 <style type="text/css"> 132 <style type="text/css">
133 canvas { 133 canvas {
134 border: 2px solid black; 134 border: 2px solid black;
135 } 135 }
136 </style> 136 </style>
137 <body onload="main()" onkeydown="keybordDown()" onkeypress="keybordPress()" onkeyup="keybordUp()" style='overflow:scroll'> 137 <body onload="main()" onkeydown="keybordDown()" onkeypress="keybordPress()" onkeyup="keybordUp()" style='overflow:scroll'>
138 <div id="framerate"></div>
139 <canvas id="example"> 138 <canvas id="example">
140 There is supposed to be an example drawing here, but it's not important. 139 There is supposed to be an example drawing here, but it's not important.
141 </canvas> 140 </canvas>
142 <div id="console"></div> 141 <div id="console"></div>
143 </body> 142 </body>