Skip to content

Commit f847cbb

Browse files
stianjensenstianjensen
committed
Add TUNL-MNTN-WTER
1 parent 9b14831 commit f847cbb

File tree

141 files changed

+81092
-0
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

141 files changed

+81092
-0
lines changed

‎.gitmodules

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
[submodule "skog"]
2+
path = skog
3+
url = [email protected]:sigvef/skog.git

‎skog/README.md

+37
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
skog (aka TUNL-MNTN-WTER by Ninjadev)
2+
====
3+
4+
This demo is now finished: <http://pouet.net/prod.php?which=61584>
5+
6+
This project uses [Three.js](http://threejs.org/)
7+
8+
Elements we want:
9+
* A train. Toy/Brio-style. We would like to use this model: http://www.the3dstudio.com/product_details.aspx?id_product=578770
10+
* A terrain with a mountain and some water
11+
* A rail track
12+
* A tunnel
13+
* Smoke for the train
14+
* Text
15+
16+
Effects we want:
17+
* Ascii style glitchyness (also, the music turns 8-bit when the visuals turn into ascii)
18+
* TV style noise/crackling/jitter (as a transition to/from the ascii effect)
19+
20+
The music:
21+
* Length: 1m 54s
22+
* Tempo: 120 bpm
23+
* The first beat starts at approximately t = 870
24+
25+
The plot (roughly):
26+
* Travelling in tunnel under water
27+
* Introduction text
28+
* Overview of the terrain
29+
* The train is being built
30+
* At first we only see front_body
31+
* Then middle_body and then rear_body fall down into place
32+
* Then the wheels arrive from the sides (first front, then middle and then rear)
33+
* Then the remaining parts (pole, cube etc) fall down from the top and are placed correctly on the train
34+
* Rail track is being built
35+
* Party time - Train drives over the track
36+
* Ascii-effect
37+
* Greets/shoutouts

‎skog/TUNL-MNTN-WTER.nfo

+24
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
#================================================#
2+
| |
3+
| TUNL-MNTN-WTER |
4+
| (pronounced "tunnel mountain water train") |
5+
| |
6+
| by Ninjadev |
7+
| |
8+
#================================================#
9+
10+
Hi everyone! This is a demo called TUNL-MNTN-WTER
11+
( which is pronounced "tunnel mountain water
12+
train" ). It is written in JavaScript/WebGL, and
13+
uses THREE.js. Most of the work on this demo was
14+
put in during the first night of Solskogen 2013.
15+
16+
For best results you should run this using the
17+
latest version of Google Chrome. If you want to
18+
to run it directly from your local file system,
19+
remember to start Chrome with the command-line
20+
argument --allow-file-access-from-files.
21+
22+
This demo was in the new-school compo at
23+
Solskogen 2013.
24+

‎skog/index.html

+100
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,100 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta charset=utf-8 />
5+
<title>TUNL-MNTN-WTER | Ninjadev</title>
6+
<style>
7+
html,body{overflow:hidden;background:#000;padding:0;margin:0;border:0;outline:0;}
8+
canvas{background:#000;}
9+
.p-wrapper {
10+
position: relative;
11+
width: 100%;
12+
text-align: center;
13+
padding-top: 6em;
14+
}
15+
p {
16+
padding: 10px;
17+
color:#ccc;
18+
font-family: Georgia, sans-serif;
19+
font-size:3em;
20+
21+
}
22+
h6 {
23+
font-size:18px;
24+
font-family: Georgia, sans-serif;
25+
color:#666;
26+
font-weight:300;
27+
}
28+
p.warning {
29+
font-size: 1em;
30+
text-align: center;
31+
}
32+
a {
33+
color: #fff;
34+
}
35+
</style>
36+
37+
<!-- libs -->
38+
<script src=lib/three.min.js></script>
39+
<script src=lib/EffectComposer.js></script>
40+
<script src=lib/ShaderExtras.js></script>
41+
<script src=lib/ShaderPass.js></script>
42+
<script src=lib/BloomPass.js></script>
43+
<script src=lib/RenderPass.js></script>
44+
<script src=lib/CopyShader.js></script>
45+
<script src=lib/OBJLoader.js></script>
46+
<script src=lib/ConvolutionShader.js></script>
47+
<script src=lib/SpriteParticleSystem.js></script>
48+
<script src=lib/ImprovedNoise.js></script>
49+
<script src=lib/seedrandom-min.js></script>
50+
51+
<!-- framework -->
52+
<script src=src/bootstrap.js></script>
53+
<script src=src/SceneManager.js></script>
54+
<script src=src/Helpers.js></script>
55+
<script src=src/Twyk.js></script>
56+
<script src=src/CameraHelpers.js></script>
57+
58+
<!-- scenes -->
59+
<script src=src/TunnelSceneWithNoise.js></script>
60+
<script src=src/ExampleScene.js></script>
61+
<script src=src/TunnelScene.js></script>
62+
<script src=src/TrainParts.js></script>
63+
<script src=src/MountainScene.js></script>
64+
<script src=src/GreetScene.js></script>
65+
66+
<!-- objects -->
67+
<script src=src/Train.js></script>
68+
<script src=src/Rails.js></script>
69+
<script src=src/Arms.js></script>
70+
<script src=src/Tree.js></script>
71+
72+
<!-- shaders -->
73+
<script src=src/NoiseShader.js></script>
74+
<script src=src/BasicShader.js></script>
75+
<script src=src/BlurShader.js></script>
76+
<script src=src/greetShaders.js></script>
77+
<script src=src/waterShaders.js></script>
78+
<script src=src/SquashShader.js></script>
79+
<script src=src/mountainShaders.js></script>
80+
<script src=src/asciiShaders.js></script>
81+
<script src=src/glowShaders.js></script>
82+
83+
</head>
84+
<body onload=bootstrap()>
85+
<script>
86+
notChrome = !(/Chrome/.test(navigator.userAgent) && /Google Inc/.test(navigator.vendor));
87+
if (notChrome) {
88+
document.write('<p class="warning" id="notChrome">We recommend using <a target="_blank" href="http://www.google.com/chrome/">Chrome</a> for viewing this demo.<br>It looks like you are not using Chrome, so the demo might not work.</p>');
89+
}
90+
runLocally = location.protocol === 'file:';
91+
if (runLocally) {
92+
document.write('<p class="warning" id="runLocally">When running this demo locally, remember to <a target="_blank" href="https://github.com/mrdoob/three.js/wiki/How-to-run-things-locally#change-local-files-security-policy-in-chrome">start Chrome with the --allow-file-access-from-files flag</a> in order to make it work.</p>');
93+
}
94+
</script>
95+
<audio id=music>
96+
<source src="res/music_combined.mp3" type="audio/mpeg">
97+
<source src="res/music_combined.ogg" type="audio/ogg">
98+
</audio>
99+
</body>
100+
</html>

‎skog/lib/BloomPass.js

+113
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,113 @@
1+
/**
2+
* @author alteredq / http://alteredqualia.com/
3+
*/
4+
5+
THREE.BloomPass = function ( strength, kernelSize, sigma, resolution ) {
6+
7+
strength = ( strength !== undefined ) ? strength : 1;
8+
kernelSize = ( kernelSize !== undefined ) ? kernelSize : 25;
9+
sigma = ( sigma !== undefined ) ? sigma : 4.0;
10+
resolution = ( resolution !== undefined ) ? resolution : 256;
11+
12+
// render targets
13+
14+
15+
var pars = { minFilter: THREE.LinearFilter, magFilter: THREE.LinearFilter, format: THREE.RGBFormat };
16+
17+
18+
this.renderTargetX = new THREE.WebGLRenderTarget( resolution, resolution, pars );
19+
this.renderTargetY = new THREE.WebGLRenderTarget( resolution, resolution, pars );
20+
21+
// copy material
22+
23+
if ( THREE.CopyShader === undefined )
24+
console.error( "THREE.BloomPass relies on THREE.CopyShader" );
25+
26+
var copyShader = THREE.CopyShader;
27+
28+
this.copyUniforms = THREE.UniformsUtils.clone( copyShader.uniforms );
29+
30+
this.copyUniforms[ "opacity" ].value = strength;
31+
32+
this.materialCopy = new THREE.ShaderMaterial( {
33+
34+
uniforms: this.copyUniforms,
35+
vertexShader: copyShader.vertexShader,
36+
fragmentShader: copyShader.fragmentShader,
37+
blending: THREE.AdditiveBlending,
38+
transparent: true
39+
40+
} );
41+
42+
// convolution material
43+
44+
if ( THREE.ConvolutionShader === undefined )
45+
console.error( "THREE.BloomPass relies on THREE.ConvolutionShader" );
46+
47+
var convolutionShader = THREE.ConvolutionShader;
48+
49+
this.convolutionUniforms = THREE.UniformsUtils.clone( convolutionShader.uniforms );
50+
51+
this.convolutionUniforms[ "uImageIncrement" ].value = THREE.BloomPass.blurx;
52+
this.convolutionUniforms[ "cKernel" ].value = THREE.ConvolutionShader.buildKernel( sigma );
53+
54+
this.materialConvolution = new THREE.ShaderMaterial( {
55+
56+
uniforms: this.convolutionUniforms,
57+
vertexShader: convolutionShader.vertexShader,
58+
fragmentShader: convolutionShader.fragmentShader,
59+
defines: {
60+
"KERNEL_SIZE_FLOAT": kernelSize.toFixed( 1 ),
61+
"KERNEL_SIZE_INT": kernelSize.toFixed( 0 )
62+
}
63+
64+
} );
65+
66+
this.enabled = true;
67+
this.needsSwap = false;
68+
this.clear = false;
69+
70+
};
71+
72+
THREE.BloomPass.prototype = {
73+
74+
render: function ( renderer, writeBuffer, readBuffer, delta, maskActive ) {
75+
76+
/*
77+
if ( maskActive ) renderer.context.disable( renderer.context.STENCIL_TEST );
78+
*/
79+
80+
// Render quad with blured scene into texture (convolution pass 1)
81+
82+
THREE.EffectComposer.quad.material = this.materialConvolution;
83+
84+
this.convolutionUniforms[ "tDiffuse" ].value = readBuffer;
85+
this.convolutionUniforms[ "uImageIncrement" ].value = THREE.BloomPass.blurX;
86+
87+
renderer.render( THREE.EffectComposer.scene, THREE.EffectComposer.camera, this.renderTargetX, true );
88+
89+
90+
// Render quad with blured scene into texture (convolution pass 2)
91+
92+
this.convolutionUniforms[ "tDiffuse" ].value = this.renderTargetX;
93+
this.convolutionUniforms[ "uImageIncrement" ].value = THREE.BloomPass.blurY;
94+
95+
renderer.render( THREE.EffectComposer.scene, THREE.EffectComposer.camera, this.renderTargetY, true );
96+
97+
// Render original scene with superimposed blur to texture
98+
99+
THREE.EffectComposer.quad.material = this.materialCopy;
100+
101+
this.copyUniforms[ "tDiffuse" ].value = this.renderTargetY;
102+
103+
/*
104+
if ( maskActive ) renderer.context.enable( renderer.context.STENCIL_TEST );
105+
*/
106+
107+
renderer.render( THREE.EffectComposer.scene, THREE.EffectComposer.camera, readBuffer, this.clear );
108+
}
109+
110+
};
111+
112+
THREE.BloomPass.blurX = new THREE.Vector2( 0.001953125, 0.0 );
113+
THREE.BloomPass.blurY = new THREE.Vector2( 0.0, 0.001953125 );

‎skog/lib/ConvolutionShader.js

+101
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,101 @@
1+
/**
2+
* @author alteredq / http://alteredqualia.com/
3+
*
4+
* Convolution shader
5+
* ported from o3d sample to WebGL / GLSL
6+
* http://o3d.googlecode.com/svn/trunk/samples/convolution.html
7+
*/
8+
9+
THREE.ConvolutionShader = {
10+
11+
defines: {
12+
13+
"KERNEL_SIZE_FLOAT": "25.0",
14+
"KERNEL_SIZE_INT": "25",
15+
16+
},
17+
18+
uniforms: {
19+
20+
"tDiffuse": { type: "t", value: null },
21+
"uImageIncrement": { type: "v2", value: new THREE.Vector2( 0.001953125, 0.0 ) },
22+
"cKernel": { type: "fv1", value: [] }
23+
24+
},
25+
26+
vertexShader: [
27+
28+
"uniform vec2 uImageIncrement;",
29+
30+
"varying vec2 vUv;",
31+
32+
"void main() {",
33+
34+
"vUv = uv - ( ( KERNEL_SIZE_FLOAT - 1.0 ) / 2.0 ) * uImageIncrement;",
35+
"gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );",
36+
37+
"}"
38+
39+
].join("\n"),
40+
41+
fragmentShader: [
42+
43+
"uniform float cKernel[ KERNEL_SIZE_INT ];",
44+
45+
"uniform sampler2D tDiffuse;",
46+
"uniform vec2 uImageIncrement;",
47+
48+
"varying vec2 vUv;",
49+
50+
"void main() {",
51+
52+
"vec2 imageCoord = vUv;",
53+
"vec4 sum = vec4( 0.0, 0.0, 0.0, 0.0 );",
54+
55+
"for( int i = 0; i < KERNEL_SIZE_INT; i ++ ) {",
56+
57+
"sum += texture2D( tDiffuse, imageCoord ) * cKernel[ i ];",
58+
"imageCoord += uImageIncrement;",
59+
60+
"}",
61+
62+
"gl_FragColor = sum;",
63+
64+
"}"
65+
66+
67+
].join("\n"),
68+
69+
buildKernel: function ( sigma ) {
70+
71+
// We lop off the sqrt(2 * pi) * sigma term, since we're going to normalize anyway.
72+
73+
function gauss( x, sigma ) {
74+
75+
return Math.exp( - ( x * x ) / ( 2.0 * sigma * sigma ) );
76+
77+
}
78+
79+
var i, values, sum, halfWidth, kMaxKernelSize = 25, kernelSize = 2 * Math.ceil( sigma * 3.0 ) + 1;
80+
81+
if ( kernelSize > kMaxKernelSize ) kernelSize = kMaxKernelSize;
82+
halfWidth = ( kernelSize - 1 ) * 0.5;
83+
84+
values = new Array( kernelSize );
85+
sum = 0.0;
86+
for ( i = 0; i < kernelSize; ++i ) {
87+
88+
values[ i ] = gauss( i - halfWidth, sigma );
89+
sum += values[ i ];
90+
91+
}
92+
93+
// normalize the kernel
94+
95+
for ( i = 0; i < kernelSize; ++i ) values[ i ] /= sum;
96+
97+
return values;
98+
99+
}
100+
101+
};

0 commit comments

Comments
 (0)