Skip to content

Commit 759f45b

Browse files
paulmassonmrdoob
authored andcommitted
Add iOS workaround to documentation pages (mrdoob#9280)
* Add iOS workaround to BoxBufferGeometry * Add iOS workaround to CircleBufferGeometry * Add iOS workaround to CircleGeometry * Add iOS workaround to ConeBufferGeometry * Add iOS workaround to ConeGeometry * Add iOS workaround to CylinderBufferGeometry * Add iOS workaround to CylinderGeometry * Add iOS workaround to DodecahedronGeometry * Add iOS workaround to IcosahedronGeometry * Add iOS workaround to LatheBufferGeometry * Add iOS workaround to LatheGeometry * Add iOS workaround to OctahedronGeometry * Add iOS workaround to PlaneBufferGeometry * Add iOS workaround to PlaneGeometry * Add iOS workaround to RingBufferGeometry * Add iOS workaround to RingGeometry * Move header for consistency * Add iOS workaround to SphereBufferGeometry * Add iOS workaround to SphereGeometry * Add iOS workaround to TetrahedronGeometry * Add iOS workaround to TextGeometry * Add iOS workaround to TorusBufferGeometry * Add iOS workaround to TorusGeometry * Add iOS workaround to TorusKnotBufferGeometry * Add iOS workaround to TorusKnotGeometry * Add iOS workaround to SkinnedMesh * Add iOS workaround to MeshBasicMaterial * Add iOS workaround to MeshDepthMaterial * Add iOS workaround to MeshLambertMaterial * Add iOS workaround to MeshNormalMaterial * Add iOS workaround to MeshPhongMaterial * Add iOS workaround to MeshStandardMaterial
1 parent 4b56cc9 commit 759f45b

31 files changed

+529
-124
lines changed

docs/api/extras/geometries/BoxBufferGeometry.html

Lines changed: 17 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,23 @@ <h1>[name]</h1>
1414

1515
<div class="desc">This is the [page:BufferGeometry] port of [page:BoxGeometry].</div>
1616

17-
<iframe src='scenes/geometry-browser.html#BoxBufferGeometry'></iframe>
17+
<iframe id="scene" src="scenes/geometry-browser.html#BoxBufferGeometry"></iframe>
18+
19+
<script>
20+
21+
// iOS iframe auto-resize workaround
22+
23+
if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
24+
25+
var scene = document.getElementById( 'scene' );
26+
27+
scene.style.width = getComputedStyle( scene ).width;
28+
scene.style.height = getComputedStyle( scene ).height;
29+
scene.setAttribute( 'scrolling', 'no' );
30+
31+
}
32+
33+
</script>
1834

1935
<h2>Example</h2>
2036

@@ -26,7 +42,6 @@ <h2>Example</h2>
2642

2743
<h2>Constructor</h2>
2844

29-
3045
<h3>[name]([page:Float width], [page:Float height], [page:Float depth], [page:Integer widthSegments], [page:Integer heightSegments], [page:Integer depthSegments])</h3>
3146
<div>
3247
width — Width of the sides on the X axis.<br />
@@ -37,7 +52,6 @@ <h3>[name]([page:Float width], [page:Float height], [page:Float depth], [page:In
3752
depthSegments — Optional. Number of segmented faces along the depth of the sides. Default is 1.
3853
</div>
3954

40-
4155
<h2>Properties</h2>
4256

4357
<h3>.parameters</h3>

docs/api/extras/geometries/CircleBufferGeometry.html

Lines changed: 18 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -14,9 +14,25 @@ <h1>[name]</h1>
1414

1515
<div class="desc">This is the [page:BufferGeometry] port of [page:CircleGeometry].</div>
1616

17-
<h2>Example</h2>
17+
<iframe id="scene" src="scenes/geometry-browser.html#CircleBufferGeometry"></iframe>
18+
19+
<script>
20+
21+
// iOS iframe auto-resize workaround
22+
23+
if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
24+
25+
var scene = document.getElementById( 'scene' );
26+
27+
scene.style.width = getComputedStyle( scene ).width;
28+
scene.style.height = getComputedStyle( scene ).height;
29+
scene.setAttribute( 'scrolling', 'no' );
1830

19-
<iframe src='scenes/geometry-browser.html#CircleBufferGeometry'></iframe>
31+
}
32+
33+
</script>
34+
35+
<h2>Example</h2>
2036

2137
<code>
2238
var geometry = new THREE.CircleBufferGeometry( 5, 32 );
@@ -25,7 +41,6 @@ <h2>Example</h2>
2541
scene.add( circle );
2642
</code>
2743

28-
2944
<h2>Constructor</h2>
3045

3146
<h3>[name]([page:Float radius], [page:Integer segments], [page:Float thetaStart], [page:Float thetaLength])</h3>
@@ -36,7 +51,6 @@ <h3>[name]([page:Float radius], [page:Integer segments], [page:Float thetaStart]
3651
thetaLength — The central angle, often called theta, of the circular sector. The default is 2*Pi, which makes for a complete circle.
3752
</div>
3853

39-
4054
<h2>Source</h2>
4155

4256
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]

docs/api/extras/geometries/CircleGeometry.html

Lines changed: 18 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -15,9 +15,25 @@ <h1>[name]</h1>
1515
<div class="desc">CircleGeometry is a simple shape of Euclidean geometry. It is contructed from a number of triangular segments that are oriented around a central point and extend as far out as a given radius. It is built counter-clockwise from a start angle and a given central angle. It can also be used to create regular polygons, where the number of segments determines the number of sides.
1616
</div>
1717

18-
<h2>Example</h2>
18+
<iframe id="scene" src="scenes/geometry-browser.html#CircleGeometry"></iframe>
19+
20+
<script>
21+
22+
// iOS iframe auto-resize workaround
23+
24+
if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
25+
26+
var scene = document.getElementById( 'scene' );
27+
28+
scene.style.width = getComputedStyle( scene ).width;
29+
scene.style.height = getComputedStyle( scene ).height;
30+
scene.setAttribute( 'scrolling', 'no' );
1931

20-
<iframe src='scenes/geometry-browser.html#CircleGeometry'></iframe>
32+
}
33+
34+
</script>
35+
36+
<h2>Example</h2>
2137

2238
<code>
2339
var geometry = new THREE.CircleGeometry( 5, 32 );
@@ -26,7 +42,6 @@ <h2>Example</h2>
2642
scene.add( circle );
2743
</code>
2844

29-
3045
<h2>Constructor</h2>
3146

3247
<h3>[name]([page:Float radius], [page:Integer segments], [page:Float thetaStart], [page:Float thetaLength])</h3>
@@ -37,7 +52,6 @@ <h3>[name]([page:Float radius], [page:Integer segments], [page:Float thetaStart]
3752
thetaLength — The central angle, often called theta, of the circular sector. The default is 2*Pi, which makes for a complete circle.
3853
</div>
3954

40-
4155
<h2>Source</h2>
4256

4357
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]

docs/api/extras/geometries/ConeBufferGeometry.html

Lines changed: 17 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -14,21 +14,34 @@ <h1>[name]</h1>
1414

1515
<div class="desc">This is the [page:BufferGeometry] port of [page:ConeGeometry].</div>
1616

17+
<iframe id="scene" src="scenes/geometry-browser.html#ConeBufferGeometry"></iframe>
1718

18-
<h2>Example</h2>
19+
<script>
20+
21+
// iOS iframe auto-resize workaround
22+
23+
if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
24+
25+
var scene = document.getElementById( 'scene' );
26+
27+
scene.style.width = getComputedStyle( scene ).width;
28+
scene.style.height = getComputedStyle( scene ).height;
29+
scene.setAttribute( 'scrolling', 'no' );
30+
31+
}
1932

20-
<iframe src='scenes/geometry-browser.html#ConeBufferGeometry'></iframe>
33+
</script>
34+
35+
<h2>Example</h2>
2136

2237
<code>var geometry = new THREE.ConeBufferGeometry( 5, 20, 32 );
2338
var material = new THREE.MeshBasicMaterial( {color: 0xffff00} );
2439
var cone = new THREE.Mesh( geometry, material );
2540
scene.add( cone );
2641
</code>
2742

28-
2943
<h2>Constructor</h2>
3044

31-
3245
<h3>[name]([page:Float radius], [page:Float height], [page:Integer radiusSegments], [page:Integer heightSegments], [page:Boolean openEnded], [page:Float thetaStart], [page:Float thetaLength])</h3>
3346
<div>
3447
radius — Radius of the cone base. Default is 20.<br />
@@ -40,14 +53,12 @@ <h3>[name]([page:Float radius], [page:Float height], [page:Integer radiusSegment
4053
thetaLength — The central angle, often called theta, of the circular sector. The default is 2*Pi, which makes for a complete cone.
4154
</div>
4255

43-
4456
<h2>Properties</h2>
4557

4658
<div>
4759
Each of the constructor parameters is accessible as a property of the same name. Any modification of these properties after instantiation does not change the geometry.
4860
</div>
4961

50-
5162
<h2>Source</h2>
5263

5364
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]

docs/api/extras/geometries/ConeGeometry.html

Lines changed: 17 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -14,21 +14,34 @@ <h1>[name]</h1>
1414

1515
<div class="desc">A class for generating cone geometries</div>
1616

17+
<iframe id="scene" src="scenes/geometry-browser.html#ConeGeometry"></iframe>
1718

18-
<h2>Example</h2>
19+
<script>
20+
21+
// iOS iframe auto-resize workaround
22+
23+
if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
24+
25+
var scene = document.getElementById( 'scene' );
26+
27+
scene.style.width = getComputedStyle( scene ).width;
28+
scene.style.height = getComputedStyle( scene ).height;
29+
scene.setAttribute( 'scrolling', 'no' );
30+
31+
}
1932

20-
<iframe src='scenes/geometry-browser.html#ConeGeometry'></iframe>
33+
</script>
34+
35+
<h2>Example</h2>
2136

2237
<code>var geometry = new THREE.ConeGeometry( 5, 20, 32 );
2338
var material = new THREE.MeshBasicMaterial( {color: 0xffff00} );
2439
var cone = new THREE.Mesh( geometry, material );
2540
scene.add( cone );
2641
</code>
2742

28-
2943
<h2>Constructor</h2>
3044

31-
3245
<h3>[name]([page:Float radius], [page:Float height], [page:Integer radiusSegments], [page:Integer heightSegments], [page:Boolean openEnded], [page:Float thetaStart], [page:Float thetaLength])</h3>
3346
<div>
3447
radius — Radius of the cone at the base. Default is 20.<br />
@@ -40,14 +53,12 @@ <h3>[name]([page:Float radius], [page:Float height], [page:Integer radiusSegment
4053
thetaLength — The central angle, often called theta, of the circular sector. The default is 2*Pi, which makes for a complete cone.
4154
</div>
4255

43-
4456
<h2>Properties</h2>
4557

4658
<div>
4759
Each of the constructor parameters is accessible as a property of the same name. Any modification of these properties after instantiation does not change the geometry.
4860
</div>
4961

50-
5162
<h2>Source</h2>
5263

5364
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]

docs/api/extras/geometries/CylinderBufferGeometry.html

Lines changed: 17 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -14,21 +14,34 @@ <h1>[name]</h1>
1414

1515
<div class="desc">This is the [page:BufferGeometry] port of [page:CylinderGeometry].</div>
1616

17+
<iframe id="scene" src="scenes/geometry-browser.html#CylinderBufferGeometry"></iframe>
1718

18-
<h2>Example</h2>
19+
<script>
20+
21+
// iOS iframe auto-resize workaround
22+
23+
if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
24+
25+
var scene = document.getElementById( 'scene' );
26+
27+
scene.style.width = getComputedStyle( scene ).width;
28+
scene.style.height = getComputedStyle( scene ).height;
29+
scene.setAttribute( 'scrolling', 'no' );
30+
31+
}
1932

20-
<iframe src='scenes/geometry-browser.html#CylinderBufferGeometry'></iframe>
33+
</script>
34+
35+
<h2>Example</h2>
2136

2237
<code>var geometry = new THREE.CylinderBufferGeometry( 5, 5, 20, 32 );
2338
var material = new THREE.MeshBasicMaterial( {color: 0xffff00} );
2439
var cylinder = new THREE.Mesh( geometry, material );
2540
scene.add( cylinder );
2641
</code>
2742

28-
2943
<h2>Constructor</h2>
3044

31-
3245
<h3>[name]([page:Float radiusTop], [page:Float radiusBottom], [page:Float height], [page:Integer radiusSegments], [page:Integer heightSegments], [page:Boolean openEnded], [page:Float thetaStart], [page:Float thetaLength])</h3>
3346
<div>
3447
radiusTop — Radius of the cylinder at the top. Default is 20.<br />
@@ -41,14 +54,12 @@ <h3>[name]([page:Float radiusTop], [page:Float radiusBottom], [page:Float height
4154
thetaLength — The central angle, often called theta, of the circular sector. The default is 2*Pi, which makes for a complete cylinder.
4255
</div>
4356

44-
4557
<h2>Properties</h2>
4658

4759
<div>
4860
Each of the constructor parameters is accessible as a property of the same name. Any modification of these properties after instantiation does not change the geometry.
4961
</div>
5062

51-
5263
<h2>Source</h2>
5364

5465
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]

docs/api/extras/geometries/CylinderGeometry.html

Lines changed: 17 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -14,21 +14,34 @@ <h1>[name]</h1>
1414

1515
<div class="desc">A class for generating cylinder geometries</div>
1616

17+
<iframe id="scene" src="scenes/geometry-browser.html#CylinderGeometry"></iframe>
1718

18-
<h2>Example</h2>
19+
<script>
20+
21+
// iOS iframe auto-resize workaround
22+
23+
if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
24+
25+
var scene = document.getElementById( 'scene' );
26+
27+
scene.style.width = getComputedStyle( scene ).width;
28+
scene.style.height = getComputedStyle( scene ).height;
29+
scene.setAttribute( 'scrolling', 'no' );
30+
31+
}
1932

20-
<iframe src='scenes/geometry-browser.html#CylinderGeometry'></iframe>
33+
</script>
34+
35+
<h2>Example</h2>
2136

2237
<code>var geometry = new THREE.CylinderGeometry( 5, 5, 20, 32 );
2338
var material = new THREE.MeshBasicMaterial( {color: 0xffff00} );
2439
var cylinder = new THREE.Mesh( geometry, material );
2540
scene.add( cylinder );
2641
</code>
2742

28-
2943
<h2>Constructor</h2>
3044

31-
3245
<h3>[name]([page:Float radiusTop], [page:Float radiusBottom], [page:Float height], [page:Integer radiusSegments], [page:Integer heightSegments], [page:Boolean openEnded], [page:Float thetaStart], [page:Float thetaLength])</h3>
3346
<div>
3447
radiusTop — Radius of the cylinder at the top. Default is 20.<br />
@@ -41,14 +54,12 @@ <h3>[name]([page:Float radiusTop], [page:Float radiusBottom], [page:Float height
4154
thetaLength — The central angle, often called theta, of the circular sector. The default is 2*Pi, which makes for a complete cylinder.
4255
</div>
4356

44-
4557
<h2>Properties</h2>
4658

4759
<div>
4860
Each of the constructor parameters is accessible as a property of the same name. Any modification of these properties after instantiation does not change the geometry.
4961
</div>
5062

51-
5263
<h2>Source</h2>
5364

5465
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]

docs/api/extras/geometries/DodecahedronGeometry.html

Lines changed: 16 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -14,27 +14,39 @@ <h1>[name]</h1>
1414

1515
<div class="desc">A class for generating a dodecahedron geometries.</div>
1616

17-
<iframe src='scenes/geometry-browser.html#DodecahedronGeometry'></iframe>
17+
<iframe id="scene" src="scenes/geometry-browser.html#DodecahedronGeometry"></iframe>
1818

19+
<script>
1920

20-
<h2>Constructor</h2>
21+
// iOS iframe auto-resize workaround
22+
23+
if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
24+
25+
var scene = document.getElementById( 'scene' );
26+
27+
scene.style.width = getComputedStyle( scene ).width;
28+
scene.style.height = getComputedStyle( scene ).height;
29+
scene.setAttribute( 'scrolling', 'no' );
30+
31+
}
2132

33+
</script>
34+
35+
<h2>Constructor</h2>
2236

2337
<h3>[name]([page:Float radius], [page:Integer detail])</h3>
2438
<div>
2539
radius — Radius of the dodecahedron. Default is 1.<br />
2640
detail — Default is 0. Setting this to a value greater than 0 adds vertices making it no longer a dodecahedron.
2741
</div>
2842

29-
3043
<h2>Properties</h2>
3144

3245
<h3>[property:Object parameters]</h3>
3346
<div>
3447
An object with all of the parameters that were used to generate the geometry.
3548
</div>
3649

37-
3850
<h2>Source</h2>
3951

4052
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]

0 commit comments

Comments
 (0)