OLD | NEW |
| (Empty) |
1 <html> | |
2 <head> | |
3 <style> | |
4 #target { | |
5 width:200px; | |
6 height:200px; | |
7 border:2px solid black; | |
8 content: -webkit-canvas(triangle); | |
9 } | |
10 </style> | |
11 | |
12 <script id="vertexShader" type="x-shader/x-vertex"> | |
13 attribute vec4 vPosition; | |
14 | |
15 void main() { | |
16 gl_Position = vPosition; | |
17 } | |
18 </script> | |
19 | |
20 <script id="fragmentShader" type="x-shader/x-fragment"> | |
21 void main() { | |
22 gl_FragColor = vec4(0.8, 0.7, 0, 1.0); | |
23 } | |
24 </script> | |
25 | |
26 <script type="application/x-javascript"> | |
27 function getFragmentShader() | |
28 { | |
29 var shaderNode = document.getElementById("fragmentShader"); // f
ragmentShader has been defined at the top | |
30 var shaderSource = getShaderSource(shaderNode); | |
31 | |
32 var shader = gl.createShader(gl.FRAGMENT_SHADER); | |
33 gl.shaderSource(shader, shaderSource); | |
34 gl.compileShader(shader); | |
35 | |
36 return shader; | |
37 } | |
38 | |
39 function getShaderSource(shaderNode) | |
40 { | |
41 var shaderSource = ""; | |
42 var node = shaderNode.firstChild; | |
43 while (node) { | |
44 if (node.nodeType == 3) // Node.TEXT_NODE | |
45 shaderSource += node.textContent; | |
46 node = node.nextSibling; | |
47 } | |
48 | |
49 return shaderSource; | |
50 } | |
51 | |
52 function getVertexShader() | |
53 { | |
54 var shaderNode = document.getElementById("vertexShader"); | |
55 var shaderSource = getShaderSource(shaderNode); | |
56 | |
57 var shader = gl.createShader(gl.VERTEX_SHADER); | |
58 gl.shaderSource(shader, shaderSource); | |
59 gl.compileShader(shader); | |
60 | |
61 return shader; | |
62 } | |
63 | |
64 function initialize() | |
65 { | |
66 gl = document.getCSSCanvasContext("webgl", "triangle", 200, 200)
; | |
67 | |
68 var vertexShader = getVertexShader(); | |
69 var fragmentShader = getFragmentShader(); | |
70 | |
71 var shaderProgram = gl.createProgram(); | |
72 gl.attachShader(shaderProgram, vertexShader); | |
73 gl.attachShader(shaderProgram, fragmentShader); | |
74 gl.bindAttribLocation(shaderProgram, 0, "vPosition"); // vPositi
on has been defined at the top | |
75 gl.linkProgram(shaderProgram); | |
76 | |
77 gl.useProgram(shaderProgram); | |
78 | |
79 var buffer = gl.createBuffer(); | |
80 gl.bindBuffer(gl.ARRAY_BUFFER, buffer); | |
81 } | |
82 | |
83 function draw(r, g, b) | |
84 { | |
85 var vertices = [ 0.0, 0.8, 0.0, | |
86 -0.8, -0.8, 0.0, | |
87 0.8, -0.8, 0.0 ]; | |
88 gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertices), gl.ST
ATIC_DRAW); | |
89 | |
90 gl.vertexAttribPointer(0, 3, gl.FLOAT, false, 0, 0); // Load the
vertex data | |
91 gl.enableVertexAttribArray(0); | |
92 gl.clearColor(r, g, b, 1); | |
93 gl.clear(gl.COLOR_BUFFER_BIT); | |
94 gl.drawArrays(gl.TRIANGLES, 0, 3); | |
95 } | |
96 | |
97 if (window.testRunner) | |
98 testRunner.overridePreference("WebKitWebGLEnabled", "1"); | |
99 | |
100 initialize(); | |
101 draw(0, 0.5, 0); | |
102 </script> | |
103 </head> | |
104 <body> | |
105 <div id="target"></div> | |
106 <div id="console"></div> | |
107 </body> | |
108 <script> | |
109 function log(str) { | |
110 var li = document.createElement("li"); | |
111 li.appendChild(document.createTextNode(str)); | |
112 var console = document.getElementById("console"); | |
113 console.appendChild(li); | |
114 } | |
115 function assert(bool, text) { | |
116 if (!bool) | |
117 log(text + "Failure"); | |
118 } | |
119 window.onload = function() { | |
120 if (window.testRunner && window.internals) { | |
121 window.testRunner.layoutAndPaintAsyncThen(function() { | |
122 assert(window.internals.isUseCounted(document, 753), "has -w
ebkit-canvas UseCounter: "); // 753 == UseCounter::Feature::WebkitCanvas | |
123 testRunner.notifyDone(); | |
124 }); | |
125 } | |
126 } | |
127 testRunner.waitUntilDone(); | |
128 </script> | |
129 </html> | |
OLD | NEW |