comparison webGL/dandy/dandy4.html @ 8:03b67cd2bde7

upload parse.js
author NOBUYASU Oshiro
date Fri, 09 Jul 2010 01:48:59 +0900
parents
children 1d76f5717ba7
comparison
equal deleted inserted replaced
7:4343c1feedb5 8:03b67cd2bde7
1 <!DOCTYPE html>
2 <!--
3 /*
4 * Copyright (C) 2009 Apple Inc. All Rights Reserved.
5 *
6 * Redistribution and use in source and binary forms, with or without
7 * modification, are permitted provided that the following conditions
8 * are met:
9 * 1. Redistributions of source code must retain the above copyright
10 * notice, this list of conditions and the following disclaimer.
11 * 2. Redistributions in binary form must reproduce the above copyright
12 * notice, this list of conditions and the following disclaimer in the
13 * documentation and/or other materials provided with the distribution.
14 *
15 * THIS SOFTWARE IS PROVIDED BY APPLE INC. ``AS IS'' AND ANY
16 * EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
17 * IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
18 * PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL APPLE INC. OR
19 * CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL,
20 * EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO,
21 * PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR
22 * PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
23 * OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
24 * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
25 * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
26 */
27 -->
28 <html>
29 <head>
30 <title>WebGL dandy</title>
31 <script src="resources/CanvasMatrix.js"> </script>
32 <script src="resources/utils3d.js"> </script>
33 <script src="resources/jkl-parsexml.js"> </script>
34 <script src="resources/makePanel.js"> </script>
35 <script src="resources/Character_state.js"> </script>
36 <script src="resources/Character.js"> </script>
37 <script src="resources/schedule.js"> </script>
38 <script src="resources/Player.js"> </script>
39 <script src="resources/enemy.js"> </script>
40 <script src="resources/bullet.js"> </script>
41 <script src="resources/collision.js"> </script>
42 <script src="resources/constKey.js"> </script>
43 <script src="resources/keybord.js"> </script>
44 <script src="resources/boss.js"> </script>
45 <script src="resources/parse.js"> </script>
46
47 <script id="vshader" type="x-shader/x-vertex">
48 uniform mat4 u_modelViewProjMatrix;
49 uniform mat4 u_normalMatrix;
50 uniform vec3 lightDir;
51
52 attribute vec3 vNormal;
53 attribute vec4 vTexCoord;
54 attribute vec4 vPosition;
55
56 varying float v_Dot;
57 varying vec2 v_texCoord;
58
59 void main()
60 {
61 gl_Position = u_modelViewProjMatrix * vPosition;
62 v_texCoord = vTexCoord.st;
63 vec4 transNormal = u_normalMatrix * vec4(vNormal,1);
64 v_Dot = max(dot(transNormal.xyz, lightDir), 0.0);
65 // v_Dot = min(dot(transNormal.xyz, lightDir), 1.0);
66 }
67 </script>
68
69 <script id="fshader" type="x-shader/x-fragment">
70 uniform sampler2D sampler2d;
71
72 varying float v_Dot;
73 varying vec2 v_texCoord;
74
75 void main()
76 {
77 vec4 color = texture2D(sampler2d,v_texCoord);
78 color += vec4(0.1,0.1,0.1,1);
79 gl_FragColor = vec4(color.xyz * v_Dot, color.a);
80 // gl_FragColor = vec4(color.xyz * v_Dot, 0.5);
81 }
82 </script>
83
84 <script>
85 //audioの試運転
86 var audio = window.Audio && new Audio("sound/sample.wav");
87 var audioShoot = window.Audio && new Audio("sound/shota.wav");
88
89 //画面(canvas)の大きさ
90 var w = 1024;
91 var h = 640;
92
93
94
95 function init()
96 {
97 var gl = initWebGL("example", "vshader", "fshader",
98 [ "vNormal", "vTexCoord", "vPosition"],
99 [ 0, 0, 0, 1 ], 10000);
100
101 gl.uniform3f(gl.getUniformLocation(gl.program, "lightDir"), 0, 0, 1);
102 gl.uniform1i(gl.getUniformLocation(gl.program, "sampler2d"), 0);
103
104 gl.enable(gl.TEXTURE_2D);
105
106 parseXml(gl);//parse.js
107
108 return gl;
109 }
110
111 width = -1;
112 height = -1;
113
114 function reshape(ctx, ortho)
115 {
116 var canvas = document.getElementById('example');
117 if (canvas.width == width && canvas.width == height)
118 return;
119
120
121 width = canvas.width;
122 height = canvas.height;
123
124 ctx.viewport(0, 0, width, height);
125
126 ctx.perspectiveMatrix = new CanvasMatrix4();
127 ctx.perspectiveMatrix.lookat(0,0,-60, 0, 0, 0, 0, 1, 0);
128 ctx.perspectiveMatrix.ortho(ortho.left, ortho.right, ortho.top, -ortho.bottom, 0, 10000);
129 }
130
131
132
133 function loop(ctx, ortho)
134 {
135
136 reshape(ctx, ortho);
137 ctx.clear(ctx.COLOR_BUFFER_BIT | ctx.DEPTH_BUFFER_BIT);
138
139
140 Player(ctx, jiki, pad, ortho);
141 obj_draw(ctx);
142
143 ctx.flush();
144
145 filpcount++;
146 schedule();
147 state_update();
148 collision_detect();
149
150 framerate.snapshot();
151
152 }
153
154 function start()
155 {
156
157 var ortho = makeOrthoPara(0,200,140,0);
158 // var ortho = makeOrthoPara(-100,100,-70,70);
159
160 audio && audio.play();//audio Test
161
162 var c = document.getElementById("example");
163
164
165 //画面の大きさ
166 c.width = w;
167 c.height = h;
168
169 var ctx = init();
170
171 currentAngle = 0;
172 var f = function() { loop(ctx, ortho) };
173 setInterval(f, 10);
174 framerate = new Framerate("framerate");
175 }
176 </script>
177 <style type="text/css">
178 canvas {
179 border: 2px solid black;
180 }
181 </style>
182 </head>
183 <body onload="start()" onkeydown="keybordDown()" onkeypress="keybordPress()" onkeyup="keybordUp()" style='overflow:hidden'>
184 <canvas id="example">
185 There is supposed to be an example drawing here, but it's not important.
186 </canvas>
187 <div id="framerate"></div>
188 <div id="console"></div>
189
190 <img id="test" style="border:1px solid red">
191
192 </body>
193 </html>