Skip to content

Instantly share code, notes, and snippets.

@philogb
Created October 18, 2011 20:41
Show Gist options
  • Save philogb/1296654 to your computer and use it in GitHub Desktop.
Save philogb/1296654 to your computer and use it in GitHub Desktop.
PhiloGL.unpack();
function BrowserSize() {
return {
width: window.innerWidth || document.body.clientWidth,
height: window.innerHeight || document.body.clientHeight
};
}
var browserSize;
var halted = false;
var it = 1;
var time;
var mouseX = 0.5;
var mouseY = 0.5;
var animation;
var timer;
var sizeX = 512;
var sizeY = 512;
var viewX = 512;
var viewY = 512;
var c;
function setMaximalSize() {
browserSize = new BrowserSize();
c.width = viewX = browserSize.width;
c.height = viewY = browserSize.height;
}
function load() {
if (!PhiloGL.hasWebGL()) {
alert("Your browser does not support WebGL");
return;
}
c = document.getElementById('c');
sizeX = 2048;
sizeY = 2048;
setMaximalSize();
PhiloGL('c', {
program: [{
id: 'advance',
from: 'ids',
vs: 'shader-vs',
fs: 'shader-fs-advance'
}, {
id: 'composite',
from: 'ids',
vs: 'shader-vs',
fs: 'shader-fs-composite'
}],
events: {
centerOrigin: false,
onMouseMove: function(e) {
mouseX = e.x / viewX;
mouseY = 1 - e.y / viewY;
},
onClick: function(e) {
halted = !halted;
}
},
onError: function() {
alert('There was an error, sorry :S');
},
onLoad: function(app) {
//Set framebuffers
var fboOpt = {
width: sizeX,
height: sizeY,
bindToTexture: {
parameters: [{
name: 'TEXTURE_MAG_FILTER',
value: 'LINEAR'
}, {
name: 'TEXTURE_MIN_FILTER',
value: 'LINEAR',
generateMipmap: false
}]
},
bindToRenderBuffer: false
};
app.setFrameBuffer('main', fboOpt)
.setFrameBuffer('main2', fboOpt);
timer = setInterval(fr, 500);
time = Date.now();
animation = "animate";
anim();
function draw() {
// advance
if (it > 0) {
Media.Image.postProcess({
width: sizeX,
height: sizeY,
fromTexture: 'main-texture',
toFrameBuffer: 'main2',
program: 'advance',
uniforms: getUniforms()
}).postProcess({
width: viewX,
height: viewY,
fromTexture: 'main2-texture',
toScreen: true,
program: 'composite',
uniforms: getUniforms()
});
} else {
Media.Image.postProcess({
width: sizeX,
height: sizeY,
fromTexture: 'main2-texture',
toFrameBuffer: 'main',
program: 'advance',
uniforms: getUniforms()
}).postProcess({
width: viewX,
height: viewY,
fromTexture: 'main-texture',
toScreen: true,
program: 'composite',
uniforms: getUniforms()
});
}
it = -it;
}
function getUniforms() {
return {
'time': time,
'mouse': [mouseX, mouseY]
};
}
function anim() {
if (!halted) {
draw();
}
switch (animation) {
case "animate":
setTimeout(function() { Fx.requestAnimationFrame(anim); }, 1);
break;
case "reset":
load();
break;
}
}
function fr() {
var ti = Date.now();
time = ti;
}
}
});
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment