OLD | NEW |
1 /* | 1 /* |
2 * Copyright 2009, Google Inc. | 2 * Copyright 2009, Google Inc. |
3 * All rights reserved. | 3 * All rights reserved. |
4 * | 4 * |
5 * Redistribution and use in source and binary forms, with or without | 5 * Redistribution and use in source and binary forms, with or without |
6 * modification, are permitted provided that the following conditions are | 6 * modification, are permitted provided that the following conditions are |
7 * met: | 7 * met: |
8 * | 8 * |
9 * * Redistributions of source code must retain the above copyright | 9 * * Redistributions of source code must retain the above copyright |
10 * notice, this list of conditions and the following disclaimer. | 10 * notice, this list of conditions and the following disclaimer. |
(...skipping 125 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
136 */ | 136 */ |
137 o3djs.webgl.createClient = function(element, opt_features, opt_debug) { | 137 o3djs.webgl.createClient = function(element, opt_features, opt_debug) { |
138 opt_features = opt_features || ''; | 138 opt_features = opt_features || ''; |
139 opt_debug = opt_debug || false; | 139 opt_debug = opt_debug || false; |
140 | 140 |
141 // If we're creating a webgl client, the assumption is we're using webgl, | 141 // If we're creating a webgl client, the assumption is we're using webgl, |
142 // in which case the only acceptable shader language is glsl. So, here | 142 // in which case the only acceptable shader language is glsl. So, here |
143 // we set the shader language to glsl. | 143 // we set the shader language to glsl. |
144 o3djs.effect.setLanguage('glsl'); | 144 o3djs.effect.setLanguage('glsl'); |
145 | 145 |
| 146 // Make the canvas automatically resize to fill the containing |
| 147 // element (div), and initialize its size correctly. |
146 var canvas; | 148 var canvas; |
147 canvas = document.createElement('canvas'); | 149 canvas = document.createElement('canvas'); |
148 canvas.setAttribute('width', element.getAttribute('width')); | 150 canvas.style.width = "100%"; |
149 canvas.setAttribute('height', element.getAttribute('height')); | 151 canvas.style.height = "100%"; |
| 152 var resizeHandler = function() { |
| 153 var width = Math.max(1, canvas.clientWidth); |
| 154 var height = Math.max(1, canvas.clientHeight); |
| 155 canvas.width = width; |
| 156 canvas.height = height; |
| 157 }; |
| 158 window.addEventListener('resize', resizeHandler, false); |
| 159 setTimeout(resizeHandler, 0); |
150 | 160 |
151 var client = new o3d.Client; | 161 var client = new o3d.Client; |
152 client.initWithCanvas(canvas); | 162 client.initWithCanvas(canvas); |
153 canvas.client = client; | 163 canvas.client = client; |
154 canvas.o3d = o3d; | 164 canvas.o3d = o3d; |
155 | 165 |
156 if (opt_debug) { | 166 if (opt_debug) { |
157 client.gl = o3djs.webgl.addDebuggingWrapper(client.gl); | 167 client.gl = o3djs.webgl.addDebuggingWrapper(client.gl); |
158 } | 168 } |
159 | 169 |
160 element.appendChild(canvas); | 170 element.appendChild(canvas); |
161 return canvas; | 171 return canvas; |
162 }; | 172 }; |
163 | 173 |
164 | 174 |
OLD | NEW |