Skip to content

Commit 47b9abf

Browse files
alteredqalteredq
committed
Another batch of examples resizing.
This should be the last one. The only ones left should be "webgl_postprocessing" and "webgl_postprocessing_dof" where I got stuck.
1 parent d2ea31a commit 47b9abf

26 files changed

+375
-53
lines changed

‎examples/js/postprocessing/EffectComposer.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -124,8 +124,8 @@ THREE.EffectComposer.prototype = {
124124

125125
// shared ortho camera
126126

127-
THREE.EffectComposer.initWidth = window.innerWidth | 1;
128-
THREE.EffectComposer.initHeight = window.innerHeight | 1;
127+
THREE.EffectComposer.initWidth = window.innerWidth || 1;
128+
THREE.EffectComposer.initHeight = window.innerHeight || 1;
129129

130130
THREE.EffectComposer.camera = new THREE.OrthographicCamera( THREE.EffectComposer.initWidth / - 2, THREE.EffectComposer.initWidth / 2, THREE.EffectComposer.initHeight / 2, THREE.EffectComposer.initHeight / - 2, -10000, 10000 );
131131

‎examples/webgl_materials2.html

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -133,6 +133,19 @@
133133

134134
container.appendChild( stats.domElement );
135135

136+
//
137+
138+
window.addEventListener( 'resize', onWindowResize, false );
139+
140+
}
141+
142+
function onWindowResize() {
143+
144+
camera.aspect = window.innerWidth / window.innerHeight;
145+
camera.updateProjectionMatrix();
146+
147+
renderer.setSize( window.innerWidth, window.innerHeight );
148+
136149
}
137150

138151
//

‎examples/webgl_materials_cubemap_dynamic.html

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -76,8 +76,11 @@
7676

7777
var MARGIN = 100;
7878

79-
var SCREEN_WIDTH = window.innerWidth;
80-
var SCREEN_HEIGHT = window.innerHeight - 2 * MARGIN;
79+
var WIDTH = window.innerWidth || 2;
80+
var HEIGHT = window.innerHeight || ( 2 + 2 * MARGIN );
81+
82+
var SCREEN_WIDTH = WIDTH;
83+
var SCREEN_HEIGHT = HEIGHT - 2 * MARGIN;
8184

8285
var SHADOW_MAP_WIDTH = 1024, SHADOW_MAP_HEIGHT = 1024;
8386

‎examples/webgl_materials_skin.html

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -256,6 +256,21 @@
256256

257257
uniforms[ "tBeckmann" ].texture = composerBeckmann.renderTarget1;
258258

259+
//
260+
261+
window.addEventListener( 'resize', onWindowResize, false );
262+
263+
}
264+
265+
function onWindowResize() {
266+
267+
windowHalfX = window.innerWidth / 2;
268+
windowHalfY = window.innerHeight / 2;
269+
270+
camera.aspect = window.innerWidth / window.innerHeight;
271+
camera.updateProjectionMatrix();
272+
273+
renderer.setSize( window.innerWidth, window.innerHeight );
259274

260275
}
261276

‎examples/webgl_materials_video.html

Lines changed: 27 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -109,6 +109,7 @@
109109
texture.minFilter = THREE.LinearFilter;
110110
texture.magFilter = THREE.LinearFilter;
111111
texture.format = THREE.RGBFormat;
112+
texture.generateMipmaps = false;
112113

113114
//
114115

@@ -155,7 +156,7 @@
155156

156157
mesh.scale.x = mesh.scale.y = mesh.scale.z = 1;
157158

158-
scene.add(mesh);
159+
scene.add( mesh );
159160

160161
mesh.dx = 0.001 * ( 0.5 - Math.random() );
161162
mesh.dy = 0.001 * ( 0.5 - Math.random() );
@@ -184,6 +185,23 @@
184185
composer.addPass( effectBloom );
185186
composer.addPass( effectScreen );
186187

188+
//
189+
190+
window.addEventListener( 'resize', onWindowResize, false );
191+
192+
}
193+
194+
function onWindowResize() {
195+
196+
windowHalfX = window.innerWidth / 2;
197+
windowHalfY = window.innerHeight / 2;
198+
199+
camera.aspect = window.innerWidth / window.innerHeight;
200+
camera.updateProjectionMatrix();
201+
202+
renderer.setSize( window.innerWidth, window.innerHeight );
203+
composer.reset();
204+
187205
}
188206

189207
function change_uvs( geometry, unitx, unity, offsetx, offsety ) {
@@ -240,20 +258,20 @@
240258

241259
}
242260

243-
for( i = 0; i < cube_count; i++ ) {
261+
for ( i = 0; i < cube_count; i ++ ) {
244262

245-
material = materials[i];
263+
material = materials[ i ];
246264

247265
h = ( 360 * ( material.hue + time ) % 360 ) / 360;
248266
material.color.setHSV( h, material.saturation, 1 );
249267

250268
}
251269

252-
if( counter % 1000 > 200 ) {
270+
if ( counter % 1000 > 200 ) {
253271

254-
for( i = 0; i < cube_count; i++ ) {
272+
for ( i = 0; i < cube_count; i ++ ) {
255273

256-
mesh = meshes[i];
274+
mesh = meshes[ i ];
257275

258276
mesh.rotation.x += 10 * mesh.dx;
259277
mesh.rotation.y += 10 * mesh.dy;
@@ -266,11 +284,11 @@
266284

267285
}
268286

269-
if( counter % 1000 == 0 ) {
287+
if ( counter % 1000 === 0 ) {
270288

271-
for( i = 0; i < cube_count; i++ ) {
289+
for ( i = 0; i < cube_count; i ++ ) {
272290

273-
mesh = meshes[i];
291+
mesh = meshes[ i ];
274292

275293
mesh.dx *= -1;
276294
mesh.dy *= -1;
@@ -284,7 +302,6 @@
284302
renderer.clear();
285303
composer.render();
286304

287-
288305
}
289306

290307

‎examples/webgl_morphtargets.html

Lines changed: 18 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -139,12 +139,29 @@
139139

140140
scene.add( mesh );
141141

142+
//
142143

143-
renderer = new THREE.WebGLRenderer( { clearColor:0x222222, clearAlpha: 1 } );
144+
renderer = new THREE.WebGLRenderer( { clearColor: 0x222222, clearAlpha: 1 } );
144145
renderer.setSize( window.innerWidth, window.innerHeight );
145146
renderer.sortObjects = false;
146147
container.appendChild( renderer.domElement );
147148

149+
//
150+
151+
window.addEventListener( 'resize', onWindowResize, false );
152+
153+
}
154+
155+
function onWindowResize() {
156+
157+
windowHalfX = window.innerWidth / 2;
158+
windowHalfY = window.innerHeight / 2;
159+
160+
camera.aspect = window.innerWidth / window.innerHeight;
161+
camera.updateProjectionMatrix();
162+
163+
renderer.setSize( window.innerWidth, window.innerHeight );
164+
148165
}
149166

150167
function onDocumentMouseMove(event) {

‎examples/webgl_morphtargets_horse.html

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -86,6 +86,19 @@
8686
stats.domElement.style.top = '0px';
8787
container.appendChild( stats.domElement );
8888

89+
//
90+
91+
window.addEventListener( 'resize', onWindowResize, false );
92+
93+
}
94+
95+
function onWindowResize() {
96+
97+
camera.aspect = window.innerWidth / window.innerHeight;
98+
camera.updateProjectionMatrix();
99+
100+
renderer.setSize( window.innerWidth, window.innerHeight );
101+
89102
}
90103

91104
//

‎examples/webgl_panorama_equirectangular.html

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -76,6 +76,19 @@
7676
document.addEventListener( 'mousewheel', onDocumentMouseWheel, false );
7777
document.addEventListener( 'DOMMouseScroll', onDocumentMouseWheel, false);
7878

79+
//
80+
81+
window.addEventListener( 'resize', onWindowResize, false );
82+
83+
}
84+
85+
function onWindowResize() {
86+
87+
camera.aspect = window.innerWidth / window.innerHeight;
88+
camera.updateProjectionMatrix();
89+
90+
renderer.setSize( window.innerWidth, window.innerHeight );
91+
7992
}
8093

8194
function onDocumentMouseDown( event ) {

‎examples/webgl_particles_billboards.html

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -108,6 +108,22 @@
108108
document.addEventListener( 'touchstart', onDocumentTouchStart, false );
109109
document.addEventListener( 'touchmove', onDocumentTouchMove, false );
110110

111+
//
112+
113+
window.addEventListener( 'resize', onWindowResize, false );
114+
115+
}
116+
117+
function onWindowResize() {
118+
119+
windowHalfX = window.innerWidth / 2;
120+
windowHalfY = window.innerHeight / 2;
121+
122+
camera.aspect = window.innerWidth / window.innerHeight;
123+
camera.updateProjectionMatrix();
124+
125+
renderer.setSize( window.innerWidth, window.innerHeight );
126+
111127
}
112128

113129
function onDocumentMouseMove( event ) {

‎examples/webgl_particles_billboards_colors.html

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -113,10 +113,12 @@
113113
document.addEventListener( 'mousemove', onDocumentMouseMove, false );
114114
document.addEventListener( 'touchstart', onDocumentTouchStart, false );
115115
document.addEventListener( 'touchmove', onDocumentTouchMove, false );
116+
116117
window.addEventListener( 'resize', onWindowResize, false );
117118

118119
}
119120

121+
120122
function onDocumentMouseMove( event ) {
121123

122124
mouseX = event.clientX - windowHalfX;
@@ -126,19 +128,20 @@
126128

127129
function onDocumentTouchStart( event ) {
128130

129-
if ( event.touches.length == 1 ) {
131+
if ( event.touches.length === 1 ) {
130132

131133
event.preventDefault();
132134

133135
mouseX = event.touches[ 0 ].pageX - windowHalfX;
134136
mouseY = event.touches[ 0 ].pageY - windowHalfY;
135137

136138
}
139+
137140
}
138141

139142
function onDocumentTouchMove( event ) {
140143

141-
if ( event.touches.length == 1 ) {
144+
if ( event.touches.length === 1 ) {
142145

143146
event.preventDefault();
144147

@@ -151,6 +154,9 @@
151154

152155
function onWindowResize( event ) {
153156

157+
windowHalfX = window.innerWidth / 2;
158+
windowHalfY = window.innerHeight / 2;
159+
154160
camera.aspect = window.innerWidth / window.innerHeight;
155161
camera.updateProjectionMatrix();
156162

‎examples/webgl_particles_random.html

Lines changed: 19 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -117,6 +117,22 @@
117117
document.addEventListener( 'touchstart', onDocumentTouchStart, false );
118118
document.addEventListener( 'touchmove', onDocumentTouchMove, false );
119119

120+
//
121+
122+
window.addEventListener( 'resize', onWindowResize, false );
123+
124+
}
125+
126+
function onWindowResize() {
127+
128+
windowHalfX = window.innerWidth / 2;
129+
windowHalfY = window.innerHeight / 2;
130+
131+
camera.aspect = window.innerWidth / window.innerHeight;
132+
camera.updateProjectionMatrix();
133+
134+
renderer.setSize( window.innerWidth, window.innerHeight );
135+
120136
}
121137

122138
function onDocumentMouseMove( event ) {
@@ -128,19 +144,20 @@
128144

129145
function onDocumentTouchStart( event ) {
130146

131-
if ( event.touches.length == 1 ) {
147+
if ( event.touches.length === 1 ) {
132148

133149
event.preventDefault();
134150

135151
mouseX = event.touches[ 0 ].pageX - windowHalfX;
136152
mouseY = event.touches[ 0 ].pageY - windowHalfY;
137153

138154
}
155+
139156
}
140157

141158
function onDocumentTouchMove( event ) {
142159

143-
if ( event.touches.length == 1 ) {
160+
if ( event.touches.length === 1 ) {
144161

145162
event.preventDefault();
146163

0 commit comments

Comments
 (0)