Remove useless examples.
150
sandbox/df/df.js
@ -1,150 +0,0 @@
|
||||
goog.provide('my.Df');
|
||||
|
||||
goog.require('og.node.RenderNode');
|
||||
goog.require('og.inheritance');
|
||||
|
||||
my.Df = function (name) {
|
||||
og.inheritance.base(this, name);
|
||||
|
||||
this.texture = null;
|
||||
|
||||
this._vertexBuffer = null;
|
||||
this._texCoordBuffer = null;
|
||||
|
||||
this._texCoordArr = [];
|
||||
this._vertexArr = [];
|
||||
};
|
||||
|
||||
og.inheritance.extend(my.Df, og.node.RenderNode);
|
||||
|
||||
|
||||
my.Df.prototype.initialization = function () {
|
||||
|
||||
var size = 1000;
|
||||
|
||||
this._vertexArr = [-0.5 * size, 0.5 * size, 100,
|
||||
-0.5 * size, -0.5 * size, 100,
|
||||
0.5 * size, -0.5 * size, 100,
|
||||
0.5 * size, -0.5 * size, 100,
|
||||
0.5 * size, 0.5 * size, 100,
|
||||
-0.5 * size, 0.5 * size, 100];
|
||||
|
||||
this._texCoordArr = [0, 0,
|
||||
0, 1,
|
||||
1, 1,
|
||||
1, 1,
|
||||
1, 0,
|
||||
0, 0];
|
||||
|
||||
var h = this.renderer.handler;
|
||||
this._vertexBuffer = h.createArrayBuffer(new Float32Array(this._vertexArr), 3, this._vertexArr.length / 3);
|
||||
this._texCoordBuffer = h.createArrayBuffer(new Float32Array(this._texCoordArr), 2, this._texCoordArr.length / 2);
|
||||
|
||||
var img = new Image();
|
||||
that = this;
|
||||
img.onload = function () {
|
||||
that.texture = h.createTexture_l(this);
|
||||
};
|
||||
img.src = "hw.png";
|
||||
|
||||
var sdfShader = new og.shaderProgram.ShaderProgram("sdf", {
|
||||
uniforms: {
|
||||
uMVMatrix: { type: og.shaderProgram.types.MAT4 },
|
||||
uPMatrix: { type: og.shaderProgram.types.MAT4 },
|
||||
u_texture: { type: og.shaderProgram.types.SAMPLER2D },
|
||||
u_color: { type: og.shaderProgram.types.VEC4 },
|
||||
u_gamma: { type: og.shaderProgram.types.FLOAT },
|
||||
u_buffer: { type: og.shaderProgram.types.FLOAT },
|
||||
uZ: { type: og.shaderProgram.types.FLOAT }
|
||||
},
|
||||
attributes: {
|
||||
a_vertices: { type: og.shaderProgram.types.VEC3, enableArray: true },
|
||||
a_texCoord: { type: og.shaderProgram.types.VEC2, enableArray: true }
|
||||
},
|
||||
vertexShader: "attribute vec3 a_vertices; \n\
|
||||
attribute vec2 a_texCoord; \n\
|
||||
\n\
|
||||
uniform mat4 uPMatrix;\n\
|
||||
uniform mat4 uMVMatrix;\n\
|
||||
uniform float uZ;\n\
|
||||
\n\
|
||||
varying vec2 vTextureCoord;\n\
|
||||
\n\
|
||||
void main(void) {\n\
|
||||
vTextureCoord = a_texCoord;\n\
|
||||
gl_Position = uPMatrix * uMVMatrix * vec4(a_vertices, 1.0);\n\
|
||||
gl_Position.z+=uZ;\n\
|
||||
}\n\
|
||||
",
|
||||
fragmentShader: "precision highp float;\n\
|
||||
varying vec2 vTextureCoord;\n\
|
||||
uniform sampler2D u_texture;\n\
|
||||
uniform vec4 u_color;\n\
|
||||
uniform float u_buffer;\n\
|
||||
uniform float u_gamma;\n\
|
||||
\n\
|
||||
void main(void) {\n\
|
||||
float dist = texture2D(u_texture, vTextureCoord).r;\n\
|
||||
float alpha = smoothstep(u_buffer - u_gamma, u_buffer + u_gamma, dist);\n\
|
||||
if(alpha<=0.5)discard;\n\
|
||||
gl_FragColor = vec4(u_color.rgb, alpha * u_color.a);\n\
|
||||
}"
|
||||
});
|
||||
|
||||
h.addShaderProgram(sdfShader);
|
||||
};
|
||||
|
||||
var gamma = 0;
|
||||
var buffer = 0.5;
|
||||
|
||||
var bcolor = [1, 1, 1, 1];
|
||||
var color = [0, 0, 0, 1];
|
||||
|
||||
my.Df.prototype.frame = function () {
|
||||
|
||||
var r = this.renderer;
|
||||
var h = r.handler;
|
||||
h.shaderPrograms.sdf.activate();
|
||||
var sh = h.shaderPrograms.sdf._program;
|
||||
var sha = sh.attributes,
|
||||
shu = sh.uniforms;
|
||||
|
||||
var gl = h.gl;
|
||||
|
||||
|
||||
gl.enable(gl.BLEND);
|
||||
//gl.blendEquation(gl.FUNC_ADD);
|
||||
gl.blendFuncSeparate(gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA, gl.ONE, gl.ONE);
|
||||
|
||||
|
||||
gl.disable(gl.CULL_FACE);
|
||||
|
||||
gl.activeTexture(gl.TEXTURE0);
|
||||
gl.bindTexture(gl.TEXTURE_2D, this.texture);
|
||||
|
||||
gl.uniform1i(shu.u_texture._pName, 0);
|
||||
|
||||
gl.uniformMatrix4fv(shu.uMVMatrix._pName, false, r.activeCamera.mvMatrix._m);
|
||||
gl.uniformMatrix4fv(shu.uPMatrix._pName, false, r.activeCamera.pMatrix._m);
|
||||
|
||||
gl.bindBuffer(gl.ARRAY_BUFFER, this._texCoordBuffer);
|
||||
gl.vertexAttribPointer(sha.a_texCoord._pName, this._texCoordBuffer.itemSize, gl.FLOAT, false, 0, 0);
|
||||
|
||||
gl.bindBuffer(gl.ARRAY_BUFFER, this._vertexBuffer);
|
||||
gl.vertexAttribPointer(sha.a_vertices._pName, this._vertexBuffer.itemSize, gl.FLOAT, false, 0, 0);
|
||||
|
||||
//gl.drawArrays(gl.TRIANGLES, 0, this._vertexBuffer.numItems);
|
||||
|
||||
gl.uniform4fv(shu.u_color._pName, bcolor);
|
||||
gl.uniform1f(shu.u_buffer._pName, buffer);
|
||||
gl.uniform1f(shu.uZ._pName, 0);
|
||||
gl.drawArrays(gl.TRIANGLES, 0, this._vertexBuffer.numItems);
|
||||
|
||||
gl.uniform4fv(shu.u_color._pName, color);
|
||||
gl.uniform1f(shu.u_buffer._pName, 192 / 256);
|
||||
gl.uniform1f(shu.u_gamma._pName, gamma);
|
||||
gl.uniform1f(shu.uZ._pName, -0.01);
|
||||
gl.drawArrays(gl.TRIANGLES, 0, this._vertexBuffer.numItems);
|
||||
|
||||
};
|
||||
|
||||
|
Before Width: | Height: | Size: 231 KiB |
@ -1,18 +0,0 @@
|
||||
<html>
|
||||
<head>
|
||||
<title>OpenGlobus - Earth planet</title>
|
||||
<link rel="stylesheet" href="../../css/og.css" type="text/css"/>
|
||||
|
||||
<script src="../../../closure-library/closure/goog/base.js"></script>
|
||||
<script src="../../src/og/og-deps.js"></script>
|
||||
|
||||
<script src="my-deps.js"></script>
|
||||
<script src="main.js"></script>
|
||||
|
||||
</head>
|
||||
|
||||
<body style="width: 100%; height: 100%; padding: 0; margin: 0;" onload="start();">
|
||||
<canvas id="canvas" style="width: 100%; height: 100%; display: block"></canvas>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
@ -1,47 +0,0 @@
|
||||
goog.require('og.webgl.Handler');
|
||||
goog.require('og.Renderer');
|
||||
goog.require('og.control.SimpleNavigation');
|
||||
goog.require('og.control.ShowFps');
|
||||
goog.require('og.shaderProgram');
|
||||
goog.require('og.node.Axes');
|
||||
goog.require('my.Df');
|
||||
goog.require('og.math.Vector3');
|
||||
|
||||
function start() {
|
||||
|
||||
og.webgl.MAX_FRAME_DELAY = 15;
|
||||
|
||||
var flatShader = new og.shaderProgram.ShaderProgram("flat", {
|
||||
uniforms: {
|
||||
uPMVMatrix: { type: og.shaderProgram.types.MAT4 }
|
||||
},
|
||||
attributes: {
|
||||
aVertexPosition: { type: og.shaderProgram.types.VEC3, enableArray: true },
|
||||
aVertexColor: { type: og.shaderProgram.types.VEC4, enableArray: true }
|
||||
},
|
||||
vertexShader: og.utils.readTextFile(og.shaderProgram.SHADERS_URL + "flat_vs.txt"),
|
||||
fragmentShader: og.utils.readTextFile(og.shaderProgram.SHADERS_URL + "flat_fs.txt")
|
||||
});
|
||||
|
||||
context = new og.webgl.Handler("canvas", { alpha: false });
|
||||
context.addShaderProgram(flatShader);
|
||||
context.init();
|
||||
|
||||
renderer = new og.Renderer(context);
|
||||
renderer.init();
|
||||
|
||||
var axes = new og.node.Axes(10000);
|
||||
|
||||
df = new my.Df("df");
|
||||
renderer.addRenderNode(axes);
|
||||
renderer.addRenderNode(df);
|
||||
|
||||
renderer.addControls([
|
||||
new og.control.SimpleNavigation({ autoActivate: true }),
|
||||
new og.control.ShowFps({ autoActivate: true })
|
||||
]);
|
||||
|
||||
renderer.start();
|
||||
|
||||
renderer.activeCamera.setEye(new og.math.Vector3(1114.1424013103258, 2086.749969128237, 8824.474084480114));
|
||||
};
|
||||
@ -1,3 +0,0 @@
|
||||
// This file was autogenerated by depswriter.py.
|
||||
// Please do not edit.
|
||||
goog.addDependency('../../../og/sandbox/df/df.js', ['my.Df'], ['og.inheritance', 'og.node.RenderNode'], false);
|
||||
@ -1 +0,0 @@
|
||||
"e:\my projects\closure-library\closure\bin\build\depswriter.py" --root_with_prefix="./ ../../../og/sandbox/df/" > "e:\my projects\openglobus\sandbox\df\my-deps.js"
|
||||
|
Before Width: | Height: | Size: 181 KiB |
@ -1,19 +0,0 @@
|
||||
<html>
|
||||
<head>
|
||||
<title>OpenGlobus - Earth planet</title>
|
||||
<link rel="stylesheet" href="../../css/og.css" type="text/css"/>
|
||||
|
||||
<script src="../../../closure-library/closure/goog/base.js"></script>
|
||||
<script src="../../src/og/og-deps.js"></script>
|
||||
|
||||
<script src="my-deps.js"></script>
|
||||
<script src="main.js"></script>
|
||||
|
||||
</head>
|
||||
|
||||
<body style="width: 100%; height: 100%; padding: 0; margin: 0;" onload="start();">
|
||||
<div style="position:absolute;width:100px;height:10px;background-color:red"></div>
|
||||
<canvas id="canvas" style="width: 100%; height: 100%; display: block"></canvas>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
@ -1,391 +0,0 @@
|
||||
goog.provide('my.Label');
|
||||
|
||||
goog.require('og.node.RenderNode');
|
||||
goog.require('og.inheritance');
|
||||
goog.require('og.shaderProgram.sphericalBillboard');
|
||||
|
||||
|
||||
my.Label = function (name) {
|
||||
og.inheritance.base(this, name);
|
||||
this.texture = null;
|
||||
this.bbPos = new og.math.Vector3();
|
||||
};
|
||||
|
||||
og.inheritance.extend(my.Label, og.node.RenderNode);
|
||||
|
||||
|
||||
my.Label.prototype.initialization = function () {
|
||||
|
||||
var billboardShader = og.shaderProgram.sphericalBillboard();
|
||||
|
||||
this._handler = this.renderer.handler;
|
||||
|
||||
this._handler.addShaderProgram(billboardShader);
|
||||
|
||||
this.createBuffers();
|
||||
this.drawMode = this.renderer.handler.gl.TRIANGLE_STRIP;
|
||||
|
||||
this.renderer.events.on("charkeypress", this, this.toogleWireframe, og.input.KEY_X);
|
||||
|
||||
var that = this;
|
||||
var img = new Image();
|
||||
img.onload = function () {
|
||||
that.texture = that.renderer.handler.createTexture(this);
|
||||
};
|
||||
img.src = "wall.jpg"
|
||||
};
|
||||
|
||||
my.Label.prototype.toogleWireframe = function (e) {
|
||||
if (this.drawMode === this.renderer.handler.gl.LINE_STRIP) {
|
||||
this.drawMode = this.renderer.handler.gl.TRIANGLE_STRIP;
|
||||
} else {
|
||||
this.drawMode = this.renderer.handler.gl.LINE_STRIP;
|
||||
}
|
||||
};
|
||||
|
||||
my.Label.prototype.createBuffers = function () {
|
||||
var tcoords = [
|
||||
0, 0,
|
||||
0, 0,
|
||||
0, 0,
|
||||
0, 0,
|
||||
|
||||
0, 0,
|
||||
0, 0,
|
||||
|
||||
0, 0,
|
||||
|
||||
|
||||
0, 0,
|
||||
1, 0,
|
||||
0, 1,
|
||||
1, 1,
|
||||
|
||||
1, 1,
|
||||
1, 1,
|
||||
|
||||
|
||||
0, 0,
|
||||
|
||||
0, 0,
|
||||
1, 0,
|
||||
0, 1,
|
||||
1, 1,
|
||||
|
||||
1, 1,
|
||||
1,1];
|
||||
this._texCoordsBuffer = this.renderer.handler.createArrayBuffer(new Float32Array(tcoords), 2, tcoords.length / 2);
|
||||
|
||||
this._handler.deactivateFaceCulling();
|
||||
|
||||
var vertices = [
|
||||
0, 0, 0,
|
||||
0, 0, 0,
|
||||
0, 0, 0,
|
||||
0, 0, 0,
|
||||
|
||||
0, 0, 0,
|
||||
0, 0, 0,
|
||||
|
||||
-0.5, 0.5, 0,
|
||||
|
||||
|
||||
-0.5, 0.5, 0,
|
||||
0.5, 0.5, 0,
|
||||
-0.5, -0.5, 0,
|
||||
0.5, -0.5, 0,
|
||||
|
||||
0.5, -0.5, 0,
|
||||
0.5, -0.5, 0,
|
||||
|
||||
-0.5, 0.5, 0,
|
||||
|
||||
|
||||
-0.5, 0.5, 0,
|
||||
0.5, 0.5, 0,
|
||||
-0.5, -0.5, 0,
|
||||
0.5, -0.5, 0,
|
||||
|
||||
0.5, -0.5, 0,
|
||||
0.5, -0.5, 0];
|
||||
|
||||
this._vertexBuffer = this._handler.createArrayBuffer(new Float32Array(vertices), 3, vertices.length / 3);
|
||||
|
||||
var positions = [
|
||||
0, 0, 0,
|
||||
0, 0, 0,
|
||||
0, 0, 0,
|
||||
0, 0, 0,
|
||||
|
||||
0, 0, 0,
|
||||
0, 0, 0,
|
||||
|
||||
0, 0, 200,
|
||||
|
||||
|
||||
0, 0, 200,
|
||||
0, 0, 200,
|
||||
0, 0, 200,
|
||||
0, 0, 200,
|
||||
|
||||
0, 0, 200,
|
||||
0, 0, 200,
|
||||
|
||||
0, 0, 0,
|
||||
|
||||
|
||||
0, 0, 0,
|
||||
0, 0, 0,
|
||||
0, 0, 0,
|
||||
0, 0, 0,
|
||||
|
||||
0, 0, 0,
|
||||
0, 0, 0
|
||||
];
|
||||
|
||||
this._posBuffer = this._handler.createArrayBuffer(new Float32Array(positions), 3, positions.length / 3);
|
||||
|
||||
var size = [
|
||||
0, 0,
|
||||
0, 0,
|
||||
0, 0,
|
||||
0, 0,
|
||||
|
||||
0, 0,
|
||||
0, 0,
|
||||
|
||||
100, 100,
|
||||
|
||||
|
||||
100, 100,
|
||||
100, 100,
|
||||
100, 100,
|
||||
100, 100,
|
||||
|
||||
100, 100,
|
||||
100, 100,
|
||||
|
||||
200, 200,
|
||||
|
||||
|
||||
200, 200,
|
||||
200, 200,
|
||||
200, 200,
|
||||
200, 200,
|
||||
|
||||
200, 200,
|
||||
200, 200
|
||||
|
||||
];
|
||||
|
||||
this._sizeBuffer = this._handler.createArrayBuffer(new Float32Array(size), 2, size.length / 2);
|
||||
|
||||
var offset = [
|
||||
0, 0, 0,
|
||||
0, 0, 0,
|
||||
0, 0, 0,
|
||||
0, 0, 0,
|
||||
|
||||
0, 0, 0,
|
||||
0, 0, 0,
|
||||
|
||||
50, 0, 0,
|
||||
|
||||
|
||||
50, 0, 0,
|
||||
50, 0, 0,
|
||||
50, 0, 0,
|
||||
50, 0, 0,
|
||||
|
||||
50, 0, 0,
|
||||
50, 0, 0,
|
||||
|
||||
0, 100, -0.01,
|
||||
|
||||
|
||||
0, 100, -0.01,
|
||||
0, 100, -0.01,
|
||||
0, 100, -0.01,
|
||||
0, 100, -0.01,
|
||||
|
||||
0, 100, -0.01,
|
||||
0, 100, -0.01
|
||||
|
||||
];
|
||||
|
||||
this._offsetBuffer = this._handler.createArrayBuffer(new Float32Array(offset), 3, offset.length / 3);
|
||||
|
||||
var opacity = [
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
|
||||
0,
|
||||
0,
|
||||
|
||||
0.5,
|
||||
|
||||
|
||||
0.5,
|
||||
0.5,
|
||||
0.5,
|
||||
0.5,
|
||||
|
||||
0.5,
|
||||
0.5,
|
||||
|
||||
1.0,
|
||||
|
||||
|
||||
1.0,
|
||||
1.0,
|
||||
1.0,
|
||||
1.0,
|
||||
|
||||
1.0,
|
||||
1.0];
|
||||
|
||||
this._opacityBuffer = this._handler.createArrayBuffer(new Float32Array(opacity), 1, opacity.length);
|
||||
|
||||
var rotation = [
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
|
||||
0,
|
||||
0,
|
||||
|
||||
0 * og.math.RADIANS,
|
||||
|
||||
|
||||
0 * og.math.RADIANS,
|
||||
0 * og.math.RADIANS,
|
||||
0 * og.math.RADIANS,
|
||||
0 * og.math.RADIANS,
|
||||
|
||||
0 * og.math.RADIANS,
|
||||
0 * og.math.RADIANS,
|
||||
|
||||
45 * og.math.RADIANS,
|
||||
|
||||
|
||||
45 * og.math.RADIANS,
|
||||
45 * og.math.RADIANS,
|
||||
45 * og.math.RADIANS,
|
||||
45 * og.math.RADIANS,
|
||||
|
||||
45 * og.math.RADIANS,
|
||||
45 * og.math.RADIANS
|
||||
];
|
||||
|
||||
this._rotationBuffer = this._handler.createArrayBuffer(new Float32Array(rotation), 1, rotation.length);
|
||||
|
||||
};
|
||||
|
||||
my.Label.prototype.frame = function () {
|
||||
var r = this.renderer;
|
||||
this._handler.shaderPrograms.sphericalBillboard.activate();
|
||||
var sh = this._handler.shaderPrograms.sphericalBillboard._program;
|
||||
var sha = sh.attributes,
|
||||
shu = sh.uniforms;
|
||||
|
||||
var gl = this._handler.gl;
|
||||
|
||||
//gl.clearColor(0.0, 0.0, 0.0, 1.0);
|
||||
//gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
|
||||
|
||||
//gl.disable(gl.DEPTH_TEST);
|
||||
gl.enable(gl.BLEND);
|
||||
gl.blendEquation(gl.FUNC_ADD);
|
||||
gl.blendFuncSeparate(gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA, gl.ONE, gl.ONE);
|
||||
//gl.blendFunc(gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA);
|
||||
//gl.blendFunc(gl.SRC_ALPHA, gl.ONE);
|
||||
|
||||
//gl.uniformMatrix4fv(shu.uPMVMatrix._pName, false, r.activeCamera.pmvMatrix._m);
|
||||
gl.uniformMatrix4fv(shu.uMVMatrix._pName, false, r.activeCamera.mvMatrix._m);
|
||||
gl.uniformMatrix4fv(shu.uPMatrix._pName, false, r.activeCamera.pMatrix._m);
|
||||
|
||||
gl.uniform2fv(shu.uViewSize._pName, [gl.canvas.clientWidth, gl.canvas.clientHeight]);
|
||||
gl.uniform3fv(shu.uCamPos._pName, r.activeCamera.eye.toVec());
|
||||
|
||||
gl.uniform1f(shu.uViewAngle._pName, r.activeCamera.viewAngle * og.math.RADIANS_HALF);
|
||||
gl.uniform1f(shu.uRatio._pName, r.handler.canvas.aspect);
|
||||
|
||||
gl.bindBuffer(gl.ARRAY_BUFFER, this._texCoordsBuffer);
|
||||
gl.vertexAttribPointer(sha.a_texCoord._pName, this._texCoordsBuffer.itemSize, gl.FLOAT, false, 0, 0);
|
||||
|
||||
gl.bindBuffer(gl.ARRAY_BUFFER, this._vertexBuffer);
|
||||
gl.vertexAttribPointer(sha.a_vertices._pName, this._vertexBuffer.itemSize, gl.FLOAT, false, 0, 0);
|
||||
|
||||
gl.bindBuffer(gl.ARRAY_BUFFER, this._posBuffer);
|
||||
gl.vertexAttribPointer(sha.a_positions._pName, this._posBuffer.itemSize, gl.FLOAT, false, 0, 0);
|
||||
|
||||
gl.bindBuffer(gl.ARRAY_BUFFER, this._opacityBuffer);
|
||||
gl.vertexAttribPointer(sha.a_opacity._pName, this._opacityBuffer.itemSize, gl.FLOAT, false, 0, 0);
|
||||
|
||||
gl.bindBuffer(gl.ARRAY_BUFFER, this._sizeBuffer);
|
||||
gl.vertexAttribPointer(sha.a_size._pName, this._sizeBuffer.itemSize, gl.FLOAT, false, 0, 0);
|
||||
|
||||
gl.bindBuffer(gl.ARRAY_BUFFER, this._offsetBuffer);
|
||||
gl.vertexAttribPointer(sha.a_offset._pName, this._offsetBuffer.itemSize, gl.FLOAT, false, 0, 0);
|
||||
|
||||
gl.bindBuffer(gl.ARRAY_BUFFER, this._rotationBuffer);
|
||||
gl.vertexAttribPointer(sha.a_rotation._pName, this._rotationBuffer.itemSize, gl.FLOAT, false, 0, 0);
|
||||
|
||||
gl.activeTexture(gl.TEXTURE0);
|
||||
gl.bindTexture(gl.TEXTURE_2D, this.texture);
|
||||
gl.uniform1i(shu.u_texture._pName, 0);
|
||||
gl.drawArrays(this.drawMode, 0, this._vertexBuffer.numItems);
|
||||
|
||||
};
|
||||
|
||||
/*
|
||||
void CreateBillboardMatrix(Matrix44f &bbmat, const Vector3f &right, const Vector3f &up, const Vector3f &look, const Vertex3f &pos)
|
||||
{
|
||||
bbmat.matrix[0] = right.x;
|
||||
bbmat.matrix[1] = right.y;
|
||||
bbmat.matrix[2] = right.z;
|
||||
bbmat.matrix[3] = 0;
|
||||
bbmat.matrix[4] = up.x;
|
||||
bbmat.matrix[5] = up.y;
|
||||
bbmat.matrix[6] = up.z;
|
||||
bbmat.matrix[7] = 0;
|
||||
bbmat.matrix[8] = look.x;
|
||||
bbmat.matrix[9] = look.y;
|
||||
bbmat.matrix[10] = look.z;
|
||||
bbmat.matrix[11] = 0;
|
||||
// Add the translation in as well.
|
||||
bbmat.matrix[12] = pos.x;
|
||||
bbmat.matrix[13] = pos.y;
|
||||
bbmat.matrix[14] = pos.z;
|
||||
bbmat.matrix[15] = 1;
|
||||
}
|
||||
|
||||
void BillboardAxis(const Vertex3f &pos, const Vector3f &axis, const Vertex3f &camPos)
|
||||
{ // create the look vector: pos -> camPos
|
||||
Vector3f look = camPos - pos;
|
||||
look.Normalize();
|
||||
|
||||
// billboard about the direction vector
|
||||
Vector3f up = axis;
|
||||
Vector3f right = up.Cross(look);
|
||||
|
||||
// watch out when the look vector is almost equal to the up vector the right
|
||||
// vector gets close to zeroed, normalize it
|
||||
right.Normalize();
|
||||
|
||||
// the billboard won't actually face the direction of the look vector we
|
||||
// created earlier, that was just used as a tempory vector to create the
|
||||
// right vector so we could calculate the correct look vector from that.
|
||||
look = right.Cross(up);
|
||||
|
||||
Matrix44f bbmat;
|
||||
CreateBillboardMatrix(bbmat, right, up, look, pos);
|
||||
|
||||
// apply the billboard
|
||||
glMultMatrixf(bbmat.matrix);
|
||||
};
|
||||
|
||||
*/
|
||||
@ -1,48 +0,0 @@
|
||||
goog.require('og.webgl.Handler');
|
||||
goog.require('og.Renderer');
|
||||
goog.require('og.control.SimpleNavigation');
|
||||
goog.require('og.shaderProgram');
|
||||
goog.require('og.node.Axes');
|
||||
goog.require('my.Label');
|
||||
goog.require('og.math.Vector3');
|
||||
|
||||
function start() {
|
||||
|
||||
og.webgl.MAX_FRAME_DELAY = 15;
|
||||
|
||||
var flatShader = new og.shaderProgram.ShaderProgram("flat", {
|
||||
uniforms: {
|
||||
uPMVMatrix: { type: og.shaderProgram.types.MAT4 }
|
||||
},
|
||||
attributes: {
|
||||
aVertexPosition: { type: og.shaderProgram.types.VEC3, enableArray: true },
|
||||
aVertexColor: { type: og.shaderProgram.types.VEC4, enableArray: true }
|
||||
},
|
||||
vertexShader: og.utils.readTextFile(og.shaderProgram.SHADERS_URL + "flat_vs.txt"),
|
||||
fragmentShader: og.utils.readTextFile(og.shaderProgram.SHADERS_URL + "flat_fs.txt")
|
||||
});
|
||||
|
||||
context = new og.webgl.Handler("canvas", { alpha: false });
|
||||
context.addShaderProgram(flatShader);
|
||||
context.init();
|
||||
|
||||
renderer = new og.Renderer(context);
|
||||
renderer.init();
|
||||
|
||||
var axes = new og.node.Axes(10000);
|
||||
|
||||
lb = new my.Label("Label");
|
||||
renderer.addRenderNode(axes);
|
||||
renderer.addRenderNode(lb);
|
||||
|
||||
renderer.addControls([
|
||||
new og.control.SimpleNavigation({ autoActivate: true }),
|
||||
]);
|
||||
|
||||
renderer.start();
|
||||
|
||||
renderer.activeCamera.eye.x = 1114.1424013103258;
|
||||
renderer.activeCamera.eye.y = 2086.749969128237;
|
||||
renderer.activeCamera.eye.z = 8824.474084480114;
|
||||
renderer.activeCamera.refresh();
|
||||
};
|
||||
|
Before Width: | Height: | Size: 4.4 KiB |
@ -1,3 +0,0 @@
|
||||
// This file was autogenerated by D:\my projects\closure-library\closure\bin\build\depswriter.py.
|
||||
// Please do not edit.
|
||||
goog.addDependency('../../../og/sandbox/label/label.js', ['my.Label'], ['og.inheritance', 'og.node.RenderNode', 'og.shaderProgram.sphericalBillboard']);
|
||||
@ -1 +0,0 @@
|
||||
"d:\my projects\closure-library\closure\bin\build\depswriter.py" --root_with_prefix="./ ../../../og/sandbox/label/" > "d:\my projects\openglobus\sandbox\label\my-deps.js"
|
||||
|
Before Width: | Height: | Size: 48 KiB |
|
Before Width: | Height: | Size: 25 KiB |
@ -1,21 +0,0 @@
|
||||
<html>
|
||||
<head>
|
||||
<title>OpenGlobus - Earth planet</title>
|
||||
<link rel="stylesheet" href="../../css/og.css" type="text/css"/>
|
||||
|
||||
<script src="../../../closure-library/closure/goog/base.js"></script>
|
||||
<script src="../../src/og/og-deps.js"></script>
|
||||
|
||||
<script src="my-deps.js"></script>
|
||||
<script src="main2.js"></script>
|
||||
|
||||
</head>
|
||||
|
||||
<body style="width: 100%; height: 100%; padding: 0; margin: 0;" onload="start();">
|
||||
<div id="l1" class="defaultText"></div>
|
||||
<div id="l2" class="defaultText"></div>
|
||||
<div id="l3" class="defaultText"></div>
|
||||
<canvas id="canvas" style="width: 100%; height: 100%; display: block"></canvas>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
@ -1,5 +0,0 @@
|
||||
precision highp float;
|
||||
|
||||
void main(void) {
|
||||
gl_FragColor = vec4(vec3(1.0), 1.0);
|
||||
}
|
||||
@ -1,73 +0,0 @@
|
||||
attribute vec3 prev;
|
||||
attribute vec3 current;
|
||||
attribute vec3 next;
|
||||
attribute vec2 order;
|
||||
|
||||
uniform mat4 proj,
|
||||
view;
|
||||
uniform vec2 viewport;
|
||||
uniform float thickness;
|
||||
|
||||
float pi = 3.141592653589793;
|
||||
|
||||
vec4 transform(vec3 coord){
|
||||
return proj * view * vec4(coord, 1.0);
|
||||
}
|
||||
|
||||
vec2 project(vec4 device){
|
||||
vec3 device_normal = device.xyz/device.w;
|
||||
vec2 clip_pos = (device_normal*0.5+0.5).xy;
|
||||
return clip_pos * viewport;
|
||||
}
|
||||
|
||||
vec4 unproject(vec2 screen, float z, float w){
|
||||
vec2 clip_pos = screen/viewport;
|
||||
vec2 device_normal = clip_pos * 2.0 - 1.0;
|
||||
return vec4(device_normal * w, z, w);
|
||||
}
|
||||
|
||||
float estimateScale(vec3 position, vec2 sPosition){
|
||||
vec4 view_pos = view * vec4(position, 1.0);
|
||||
vec4 scale_pos = view_pos - vec4(normalize(view_pos.xy)*thickness, 0.0, 0.0);
|
||||
vec2 screen_scale_pos = project(proj * scale_pos);
|
||||
return distance(sPosition, screen_scale_pos);
|
||||
}
|
||||
|
||||
float curvatureCorrection(vec2 a, vec2 b){
|
||||
float p = a.x*b.y - a.y*b.x;
|
||||
float c = atan(p, dot(a,b))/pi;
|
||||
return clamp(c, -1.0, 1.0);
|
||||
}
|
||||
|
||||
void main(){
|
||||
|
||||
vec2 sPrev = project(transform(prev));
|
||||
vec2 sNext = project(transform(next));
|
||||
vec4 dCurrent = transform(current);
|
||||
vec2 sCurrent = project(dCurrent);
|
||||
|
||||
vec2 dirNext = normalize(sNext - sCurrent);
|
||||
vec2 sNormalNext = normalize(vec2(-dirNext.y, dirNext.x));
|
||||
|
||||
vec2 dirPrev = normalize(sPrev - sCurrent);
|
||||
vec2 sNormalPrev = normalize(vec2(-dirPrev.y, dirPrev.x));
|
||||
|
||||
vec2 dir;
|
||||
|
||||
dir = sNormalNext- sNormalPrev;
|
||||
float sinA = dirPrev.x * dir.y - dirPrev.y * dir.x;
|
||||
|
||||
if( abs(sinA) < 0.2 ) {
|
||||
if(order.x == 1.0){
|
||||
dir = sNormalPrev;
|
||||
} else {
|
||||
dir = sNormalNext;
|
||||
}
|
||||
} else {
|
||||
dir *= order.x / sinA;
|
||||
}
|
||||
|
||||
vec2 pos = sCurrent + dir * thickness * order.y;
|
||||
|
||||
gl_Position = unproject(pos, dCurrent.z, dCurrent.w);
|
||||
}
|
||||
@ -1,50 +0,0 @@
|
||||
goog.require('og.webgl.Handler');
|
||||
goog.require('og.Renderer');
|
||||
goog.require('og.control.SimpleNavigation');
|
||||
goog.require('og.control.ShowFps');
|
||||
goog.require('og.shaderProgram');
|
||||
goog.require('og.node.Axes');
|
||||
goog.require('my.LineString2');
|
||||
goog.require('og.math.Vector3');
|
||||
|
||||
function start() {
|
||||
|
||||
og.webgl.MAX_FRAME_DELAY = 15;
|
||||
|
||||
var flatShader = new og.shaderProgram.ShaderProgram("flat", {
|
||||
uniforms: {
|
||||
uPMVMatrix: { type: og.shaderProgram.types.MAT4 }
|
||||
},
|
||||
attributes: {
|
||||
aVertexPosition: { type: og.shaderProgram.types.VEC3, enableArray: true },
|
||||
aVertexColor: { type: og.shaderProgram.types.VEC4, enableArray: true }
|
||||
},
|
||||
vertexShader: og.utils.readTextFile(og.shaderProgram.SHADERS_URL + "flat_vs.txt"),
|
||||
fragmentShader: og.utils.readTextFile(og.shaderProgram.SHADERS_URL + "flat_fs.txt")
|
||||
});
|
||||
|
||||
context = new og.webgl.Handler("canvas", { alpha: false });
|
||||
context.addShaderProgram(flatShader);
|
||||
context.init();
|
||||
|
||||
renderer = new og.Renderer(context);
|
||||
renderer.init();
|
||||
|
||||
var axes = new og.node.Axes(10000);
|
||||
|
||||
bb = new my.LineString2("LineString");
|
||||
renderer.addRenderNode(axes);
|
||||
renderer.addRenderNode(bb);
|
||||
|
||||
renderer.addControls([
|
||||
new og.control.SimpleNavigation({ autoActivate: true }),
|
||||
new og.control.ShowFps({ autoActivate: true })
|
||||
]);
|
||||
|
||||
renderer.start();
|
||||
|
||||
renderer.activeCamera.eye.x = 139.78950005325692;
|
||||
renderer.activeCamera.eye.y = 134.6316551663209;
|
||||
renderer.activeCamera.eye.z = 1337.487396725346;
|
||||
renderer.activeCamera.refresh();
|
||||
};
|
||||
@ -1,3 +0,0 @@
|
||||
// This file was autogenerated by depswriter.py.
|
||||
// Please do not edit.
|
||||
goog.addDependency('../../../og/sandbox/linestring2/myLineString2.js', ['my.LineString2'], ['og.inheritance', 'og.math.Vector2', 'og.math.Vector3', 'og.node.RenderNode'], false);
|
||||
@ -1,166 +0,0 @@
|
||||
goog.provide('my.LineString2');
|
||||
|
||||
goog.require('og.node.RenderNode');
|
||||
goog.require('og.inheritance');
|
||||
|
||||
goog.require('og.math.Vector2');
|
||||
goog.require('og.math.Vector3');
|
||||
|
||||
my.LineString2 = function (name) {
|
||||
og.inheritance.base(this, name);
|
||||
|
||||
this.positionBuffer = null;
|
||||
this.nextVertsBuffer = null;
|
||||
this.indexBuffer = null;
|
||||
this.thicknessBuffer = null;
|
||||
this.drawMode = null;
|
||||
this.thickness = 10;
|
||||
};
|
||||
|
||||
og.inheritance.extend(my.LineString2, og.node.RenderNode);
|
||||
|
||||
|
||||
my.LineString2.prototype.initialization = function () {
|
||||
|
||||
this.drawMode = this.renderer.handler.gl.TRIANGLE_STRIP;
|
||||
|
||||
var lineStringShader = new og.shaderProgram.ShaderProgram("LineString", {
|
||||
uniforms: {
|
||||
view: { type: og.shaderProgram.types.MAT4 },
|
||||
proj: { type: og.shaderProgram.types.MAT4 },
|
||||
viewport: { type: og.shaderProgram.types.VEC2 },
|
||||
thickness: { type: og.shaderProgram.types.FLOAT }
|
||||
},
|
||||
attributes: {
|
||||
prev: { type: og.shaderProgram.types.VEC3, enableArray: true },
|
||||
current: { type: og.shaderProgram.types.VEC3, enableArray: true },
|
||||
next: { type: og.shaderProgram.types.VEC3, enableArray: true },
|
||||
order: { type: og.shaderProgram.types.VEC2, enableArray: true }
|
||||
},
|
||||
vertexShader: og.utils.readTextFile("lineString2_vs.txt"),
|
||||
fragmentShader: og.utils.readTextFile("lineString2_fs.txt")
|
||||
});
|
||||
|
||||
this.renderer.handler.addShaderProgram(lineStringShader);
|
||||
|
||||
var path = [[-100, -100, 100], [0, 100, 0], [100, -100, 0], [200, -100, 0], [100, 100, -500], [0, 0, 10000000000]];
|
||||
|
||||
this.createBuffers(path);
|
||||
|
||||
var that = this;
|
||||
this.renderer.events.on("charkeypress", this, function () {
|
||||
that.toogleWireframe();
|
||||
}, og.input.KEY_X);
|
||||
};
|
||||
|
||||
my.LineString2.prototype.toogleWireframe = function (e) {
|
||||
if (this.drawMode === this.renderer.handler.gl.LINE_STRIP) {
|
||||
this.drawMode = this.renderer.handler.gl.TRIANGLE_STRIP;
|
||||
} else {
|
||||
this.drawMode = this.renderer.handler.gl.LINE_STRIP;
|
||||
}
|
||||
};
|
||||
|
||||
my.LineString2.prototype.createBuffers = function (path) {
|
||||
var h = this.renderer.handler;
|
||||
|
||||
var len = path.length - 1;
|
||||
|
||||
var buff = [],
|
||||
order = [],
|
||||
vertIndeces = [];
|
||||
|
||||
var p0 = path[0],
|
||||
p1 = path[1];
|
||||
|
||||
var prevX = p0[0] + p0[0] - p1[0],
|
||||
prevY = p0[1] + p0[1] - p1[1],
|
||||
prevZ = p0[2] + p0[2] - p1[2];
|
||||
|
||||
for (var i = 0, j = 0; i < len; i++) {
|
||||
|
||||
p0 = path[i];
|
||||
p1 = path[i + 1];
|
||||
|
||||
buff.push(p0[0], p0[1], p0[2], prevX, prevY, prevZ, p1[0], p1[1], p1[2]);
|
||||
buff.push(p0[0], p0[1], p0[2], prevX, prevY, prevZ, p1[0], p1[1], p1[2]);
|
||||
|
||||
prevX = p0[0];
|
||||
prevY = p0[1];
|
||||
prevZ = p0[2];
|
||||
|
||||
var p2 = path[i + 2];
|
||||
var nextX, nextY, nextZ;
|
||||
|
||||
if (p2) {
|
||||
nextX = p2[0];
|
||||
nextY = p2[1];
|
||||
nextZ = p2[2];
|
||||
vertIndeces.push(j, ++j, ++j, ++j, j, j, ++j);
|
||||
} else {
|
||||
nextX = p1[0] + p1[0] - p0[0];
|
||||
nextY = p1[1] + p1[1] - p0[1];
|
||||
nextZ = p1[2] + p1[2] - p0[2];
|
||||
vertIndeces.push(j, ++j, ++j, ++j);
|
||||
}
|
||||
|
||||
buff.push(p1[0], p1[1], p1[2], p0[0], p0[1], p0[2], nextX, nextY, nextZ);
|
||||
buff.push(p1[0], p1[1], p1[2], p0[0], p0[1], p0[2], nextX, nextY, nextZ);
|
||||
|
||||
order.push(-1, 1, -1, -1, 1, -1, 1, 1);
|
||||
}
|
||||
|
||||
this.components = 9;
|
||||
var size = (buff.length / this.components);
|
||||
|
||||
this.mainBuffer = h.createArrayBuffer(new Float32Array(buff), 3, size);
|
||||
this.orderBuffer = h.createArrayBuffer(new Float32Array(order), 2, order.length / 2);
|
||||
this.indexBuffer = h.createElementArrayBuffer(new Uint16Array(vertIndeces), 1, vertIndeces.length);
|
||||
};
|
||||
|
||||
my.LineString2.prototype.frame = function () {
|
||||
var r = this.renderer;
|
||||
|
||||
var sh, p, gl;
|
||||
|
||||
sh = r.handler.shaderPrograms.LineString;
|
||||
p = sh._program;
|
||||
gl = r.handler.gl,
|
||||
sha = p.attributes,
|
||||
shu = p.uniforms;
|
||||
|
||||
sh.activate();
|
||||
|
||||
//matrices
|
||||
gl.uniformMatrix4fv(shu.proj._pName, false, r.activeCamera._pMatrix._m);
|
||||
gl.uniformMatrix4fv(shu.view._pName, false, r.activeCamera._mvMatrix._m);
|
||||
|
||||
gl.uniform2fv(shu.viewport._pName, [r.handler.canvas.width, r.handler.canvas.height]);
|
||||
|
||||
gl.uniform1f(shu.thickness._pName, this.thickness);
|
||||
|
||||
var FLOATSIZE = 4;
|
||||
|
||||
gl.bindBuffer(gl.ARRAY_BUFFER, this.mainBuffer);
|
||||
|
||||
gl.vertexAttribPointer(sha.current._pName, this.mainBuffer.itemSize, gl.FLOAT, false,
|
||||
this.components * FLOATSIZE, 0 * FLOATSIZE);
|
||||
|
||||
gl.vertexAttribPointer(sha.prev._pName, this.mainBuffer.itemSize, gl.FLOAT, false,
|
||||
this.components * FLOATSIZE, 3 * FLOATSIZE);
|
||||
|
||||
gl.vertexAttribPointer(sha.next._pName, this.mainBuffer.itemSize, gl.FLOAT, false,
|
||||
this.components * FLOATSIZE, 6 * FLOATSIZE);
|
||||
|
||||
|
||||
gl.bindBuffer(gl.ARRAY_BUFFER, this.orderBuffer);
|
||||
gl.vertexAttribPointer(sha.order._pName, this.orderBuffer.itemSize, gl.FLOAT, false, 0, 0);
|
||||
|
||||
gl.disable(gl.CULL_FACE);
|
||||
|
||||
//draw indexes
|
||||
gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexBuffer);
|
||||
gl.drawElements(this.drawMode, this.indexBuffer.numItems, gl.UNSIGNED_SHORT, 0);
|
||||
|
||||
gl.enable(gl.CULL_FACE);
|
||||
};
|
||||
@ -1 +0,0 @@
|
||||
"e:\my projects\closure-library\closure\bin\build\depswriter.py" --root_with_prefix="./ ../../../og/sandbox/linestring2/" > "e:\my projects\openglobus\sandbox\linestring2\my-deps.js"
|
||||
@ -1,13 +0,0 @@
|
||||
<html>
|
||||
<head>
|
||||
<title>SDF test</title>
|
||||
|
||||
<script src="ssedt.js"></script>
|
||||
<script src="main.js"></script>
|
||||
|
||||
</head>
|
||||
|
||||
<body style="width: 100%; height: 100%; padding: 0; margin: 0;" onload="main();">
|
||||
</body>
|
||||
|
||||
</html>
|
||||
@ -1,39 +0,0 @@
|
||||
var width = 256;
|
||||
var height = 256;
|
||||
|
||||
var canvas = document.createElement("canvas");
|
||||
canvas.width = width;
|
||||
canvas.height = height;
|
||||
var context = canvas.getContext('2d');
|
||||
|
||||
var canvasDst = document.createElement("canvas");
|
||||
canvasDst.width = width;
|
||||
canvasDst.height = height;
|
||||
var contextDst = canvasDst.getContext('2d');
|
||||
|
||||
var img = new Image();
|
||||
|
||||
function main() {
|
||||
|
||||
img.onload = function () {
|
||||
proceed();
|
||||
}
|
||||
|
||||
img.src = "test.bmp";
|
||||
};
|
||||
|
||||
function proceed() {
|
||||
context.drawImage(img, 0, 0);
|
||||
var imgd = context.getImageData(0, 0, width, height);
|
||||
|
||||
var dest = new Array(width * height * 4);
|
||||
makeSDF(imgd.data, dest);
|
||||
|
||||
var imageData = contextDst.createImageData(width, height);
|
||||
imageData.data.set(dest);
|
||||
contextDst.putImageData(imageData, 0, 0);
|
||||
|
||||
document.body.appendChild(canvas);
|
||||
document.body.appendChild(canvasDst);
|
||||
|
||||
}
|
||||
@ -1,129 +0,0 @@
|
||||
var WIDTH = 256,
|
||||
HEIGHT = 256;
|
||||
|
||||
function DistSq(point) {
|
||||
return point.dx * point.dx + point.dy * point.dy;
|
||||
};
|
||||
|
||||
var Point = function (x, y) {
|
||||
this.dx = x;
|
||||
this.dy = y;
|
||||
this.clone = function () {
|
||||
return new Point(this.dx, this.dy);
|
||||
}
|
||||
};
|
||||
|
||||
var Grid = function () {
|
||||
this.grid = [];
|
||||
for (var y = 0; y < HEIGHT; y++) {
|
||||
this.grid[y] = [];
|
||||
}
|
||||
};
|
||||
|
||||
var inside = new Point(0, 0);
|
||||
var empty = new Point(9999, 9999);
|
||||
var grid1 = new Grid();
|
||||
var grid2 = new Grid();
|
||||
|
||||
var Get = function (g, x, y) {
|
||||
if (x >= 0 && y >= 0 && x < WIDTH && y < HEIGHT)
|
||||
return g.grid[y][x].clone();
|
||||
else
|
||||
return empty.clone();
|
||||
};
|
||||
|
||||
var Put = function (g, x, y, p) {
|
||||
g.grid[y][x] = p;
|
||||
};
|
||||
|
||||
var Compare = function (g, p, x, y, offsetx, offsety) {
|
||||
var other = Get(g, x + offsetx, y + offsety);
|
||||
other.dx += offsetx;
|
||||
other.dy += offsety;
|
||||
|
||||
if (DistSq(other) < DistSq(p)) {
|
||||
p.dx = other.dx;
|
||||
p.dy = other.dy;
|
||||
}
|
||||
};
|
||||
|
||||
var GenerateSDF = function (g) {
|
||||
// Pass 0
|
||||
for (var y = 0; y < HEIGHT; y++) {
|
||||
for (var x = 0; x < WIDTH; x++) {
|
||||
var p = Get(g, x, y);
|
||||
Compare(g, p, x, y, -1, 0);
|
||||
Compare(g, p, x, y, 0, -1);
|
||||
Compare(g, p, x, y, -1, -1);
|
||||
Compare(g, p, x, y, 1, -1);
|
||||
Put(g, x, y, p);
|
||||
}
|
||||
|
||||
for (var x = WIDTH - 1; x >= 0; x--) {
|
||||
var p = Get(g, x, y);
|
||||
Compare(g, p, x, y, 1, 0);
|
||||
Put(g, x, y, p);
|
||||
}
|
||||
}
|
||||
|
||||
// Pass 1
|
||||
for (var y = HEIGHT - 1; y >= 0; y--) {
|
||||
for (var x = WIDTH - 1; x >= 0; x--) {
|
||||
var p = Get(g, x, y);
|
||||
Compare(g, p, x, y, 1, 0);
|
||||
Compare(g, p, x, y, 0, 1);
|
||||
Compare(g, p, x, y, -1, 1);
|
||||
Compare(g, p, x, y, 1, 1);
|
||||
Put(g, x, y, p);
|
||||
}
|
||||
|
||||
for (var x = 0; x < WIDTH; x++) {
|
||||
var p = Get(g, x, y);
|
||||
Compare(g, p, x, y, -1, 0);
|
||||
Put(g, x, y, p);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function makeSDF(data, dest) {
|
||||
|
||||
for (var y = 0; y < HEIGHT; y++) {
|
||||
for (var x = 0; x < WIDTH; x++) {
|
||||
var r, g, b;
|
||||
|
||||
g = data[(y * WIDTH + x) * 4 + 1];
|
||||
|
||||
if (g < 128) {
|
||||
Put(grid1, x, y, inside);
|
||||
Put(grid2, x, y, empty);
|
||||
} else {
|
||||
Put(grid2, x, y, inside);
|
||||
Put(grid1, x, y, empty);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
GenerateSDF(grid1);
|
||||
GenerateSDF(grid2);
|
||||
|
||||
for (var y = 0; y < HEIGHT; y++) {
|
||||
for (var x = 0; x < WIDTH; x++) {
|
||||
|
||||
// Calculate the actual distance from the dx/dy
|
||||
var dist1 = parseInt(Math.sqrt(DistSq(Get(grid1, x, y))));
|
||||
var dist2 = parseInt(Math.sqrt(DistSq(Get(grid2, x, y))));
|
||||
var dist = dist1 - dist2;
|
||||
|
||||
// Clamp and scale it, just for display purposes.
|
||||
var c = dist * 3 + 128;
|
||||
if (c < 0) c = 0;
|
||||
if (c > 255) c = 255;
|
||||
|
||||
var ind = (y * WIDTH + x) * 4;
|
||||
dest[ind] = c;
|
||||
dest[ind + 1] = c;
|
||||
dest[ind + 2] = c;
|
||||
dest[ind + 3] = 255;
|
||||
}
|
||||
}
|
||||
};
|
||||
|
Before Width: | Height: | Size: 192 KiB |
|
Before Width: | Height: | Size: 6.1 KiB |
|
Before Width: | Height: | Size: 217 KiB |
@ -1,18 +0,0 @@
|
||||
<html>
|
||||
<head>
|
||||
<title>OpenGlobus - Earth planet</title>
|
||||
<link rel="stylesheet" href="../../css/og.css" type="text/css"/>
|
||||
|
||||
<script src="../../../closure-library/closure/goog/base.js"></script>
|
||||
<script src="../../src/og/og-deps.js"></script>
|
||||
|
||||
<script src="my-deps.js"></script>
|
||||
<script src="main.js"></script>
|
||||
|
||||
</head>
|
||||
|
||||
<body style="width: 100%; height: 100%; padding: 0; margin: 0;" onload="start();">
|
||||
<canvas id="canvas" style="width: 100%; height: 100%; display: block"></canvas>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
@ -1,47 +0,0 @@
|
||||
goog.require('og.webgl.Handler');
|
||||
goog.require('og.Renderer');
|
||||
goog.require('og.control.SimpleNavigation');
|
||||
goog.require('og.control.ShowFps');
|
||||
goog.require('og.shaderProgram');
|
||||
goog.require('og.node.Axes');
|
||||
goog.require('my.Simple');
|
||||
goog.require('og.math.Vector3');
|
||||
|
||||
function start() {
|
||||
|
||||
og.webgl.MAX_FRAME_DELAY = 15;
|
||||
|
||||
var flatShader = new og.shaderProgram.ShaderProgram("flat", {
|
||||
uniforms: {
|
||||
uPMVMatrix: { type: og.shaderProgram.types.MAT4 }
|
||||
},
|
||||
attributes: {
|
||||
aVertexPosition: { type: og.shaderProgram.types.VEC3, enableArray: true },
|
||||
aVertexColor: { type: og.shaderProgram.types.VEC4, enableArray: true }
|
||||
},
|
||||
vertexShader: og.utils.readTextFile(og.shaderProgram.SHADERS_URL + "flat_vs.txt"),
|
||||
fragmentShader: og.utils.readTextFile(og.shaderProgram.SHADERS_URL + "flat_fs.txt")
|
||||
});
|
||||
|
||||
context = new og.webgl.Handler("canvas", { alpha: false });
|
||||
context.addShaderProgram(flatShader);
|
||||
context.init();
|
||||
|
||||
renderer = new og.Renderer(context);
|
||||
renderer.init();
|
||||
|
||||
var axes = new og.node.Axes(10000);
|
||||
|
||||
s = new my.Simple("simple");
|
||||
renderer.addRenderNode(axes);
|
||||
renderer.addRenderNode(s);
|
||||
|
||||
renderer.addControls([
|
||||
new og.control.SimpleNavigation({ autoActivate: true }),
|
||||
new og.control.ShowFps({ autoActivate: true })
|
||||
]);
|
||||
|
||||
renderer.start();
|
||||
|
||||
renderer.activeCamera.setEye(new og.math.Vector3(1114.1424013103258, 2086.749969128237, 8824.474084480114));
|
||||
};
|
||||
@ -1,3 +0,0 @@
|
||||
// This file was autogenerated by depswriter.py.
|
||||
// Please do not edit.
|
||||
goog.addDependency('../../../og/sandbox/simple/simple.js', ['my.Simple'], ['og.inheritance', 'og.node.RenderNode'], false);
|
||||
@ -1 +0,0 @@
|
||||
"e:\my projects\closure-library\closure\bin\build\depswriter.py" --root_with_prefix="./ ../../../og/sandbox/simple/" > "e:\my projects\openglobus\sandbox\simple\my-deps.js"
|
||||
@ -1,119 +0,0 @@
|
||||
goog.provide('my.Simple');
|
||||
|
||||
goog.require('og.node.RenderNode');
|
||||
goog.require('og.inheritance');
|
||||
|
||||
my.Simple = function (name) {
|
||||
og.inheritance.base(this, name);
|
||||
|
||||
this.texture = null;
|
||||
|
||||
this._vertexBuffer = null;
|
||||
this._texCoordBuffer = null;
|
||||
|
||||
this._texCoordArr = [];
|
||||
this._vertexArr = [];
|
||||
};
|
||||
|
||||
og.inheritance.extend(my.Simple, og.node.RenderNode);
|
||||
|
||||
|
||||
my.Simple.prototype.initialization = function () {
|
||||
|
||||
var size = 1000;
|
||||
|
||||
this._vertexArr = [-0.5 * size, 0.5 * size, 0,
|
||||
-0.5 * size, -0.5 * size, 0,
|
||||
0.5 * size, -0.5 * size, 0,
|
||||
0.5 * size, -0.5 * size, 0,
|
||||
0.5 * size, 0.5 * size, 0,
|
||||
-0.5 * size, 0.5 * size, 0];
|
||||
|
||||
this._texCoordArr = [0, 0,
|
||||
0, 1,
|
||||
1, 1,
|
||||
1, 1,
|
||||
1, 0,
|
||||
0, 0];
|
||||
|
||||
var h = this.renderer.handler;
|
||||
this._vertexBuffer = h.createArrayBuffer(new Float32Array(this._vertexArr), 3, this._vertexArr.length / 3);
|
||||
this._texCoordBuffer = h.createArrayBuffer(new Float32Array(this._texCoordArr), 2, this._texCoordArr.length / 2);
|
||||
|
||||
var img = new Image();
|
||||
that = this;
|
||||
img.onload = function () {
|
||||
that.texture = h.createTexture_n(this);
|
||||
};
|
||||
img.src = "diffuse.png";
|
||||
|
||||
var sdfShader = new og.shaderProgram.ShaderProgram("sdf", {
|
||||
uniforms: {
|
||||
uMVMatrix: { type: og.shaderProgram.types.MAT4 },
|
||||
uPMatrix: { type: og.shaderProgram.types.MAT4 },
|
||||
u_texture: { type: og.shaderProgram.types.SAMPLER2D }
|
||||
},
|
||||
attributes: {
|
||||
a_vertices: { type: og.shaderProgram.types.VEC3, enableArray: true },
|
||||
a_texCoord: { type: og.shaderProgram.types.VEC2, enableArray: true }
|
||||
},
|
||||
vertexShader: "attribute vec3 a_vertices; \n\
|
||||
attribute vec2 a_texCoord; \n\
|
||||
\n\
|
||||
uniform mat4 uPMatrix;\n\
|
||||
uniform mat4 uMVMatrix;\n\
|
||||
\n\
|
||||
varying vec2 vTextureCoord;\n\
|
||||
\n\
|
||||
void main(void) {\n\
|
||||
vTextureCoord = a_texCoord;\n\
|
||||
gl_Position = uPMatrix * uMVMatrix * vec4(a_vertices, 1.0);\n\
|
||||
}\n\
|
||||
",
|
||||
fragmentShader: "precision highp float;\n\
|
||||
varying vec2 vTextureCoord;\n\
|
||||
uniform sampler2D u_texture;\n\
|
||||
\n\
|
||||
void main(void) {\n\
|
||||
vec4 tColor = texture2D( u_texture, vTextureCoord );\n\
|
||||
gl_FragColor = vec4(tColor.rgb, 1.0);\n\
|
||||
}"
|
||||
});
|
||||
|
||||
h.addShaderProgram(sdfShader);
|
||||
};
|
||||
|
||||
|
||||
my.Simple.prototype.frame = function () {
|
||||
var r = this.renderer;
|
||||
var h = r.handler;
|
||||
h.shaderPrograms.sdf.activate();
|
||||
var sh = h.shaderPrograms.sdf._program;
|
||||
var sha = sh.attributes,
|
||||
shu = sh.uniforms;
|
||||
|
||||
var gl = h.gl;
|
||||
|
||||
gl.enable(gl.BLEND);
|
||||
gl.blendEquation(gl.FUNC_ADD);
|
||||
gl.blendFuncSeparate(gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA, gl.ONE, gl.ONE);
|
||||
gl.disable(gl.CULL_FACE);
|
||||
|
||||
gl.activeTexture(gl.TEXTURE0);
|
||||
gl.bindTexture(gl.TEXTURE_2D, this.texture);
|
||||
|
||||
gl.uniform1i(shu.u_texture._pName, 0);
|
||||
|
||||
gl.uniformMatrix4fv(shu.uMVMatrix._pName, false, r.activeCamera.mvMatrix._m);
|
||||
gl.uniformMatrix4fv(shu.uPMatrix._pName, false, r.activeCamera.pMatrix._m);
|
||||
|
||||
gl.bindBuffer(gl.ARRAY_BUFFER, this._texCoordBuffer);
|
||||
gl.vertexAttribPointer(sha.a_texCoord._pName, this._texCoordBuffer.itemSize, gl.FLOAT, false, 0, 0);
|
||||
|
||||
gl.bindBuffer(gl.ARRAY_BUFFER, this._vertexBuffer);
|
||||
gl.vertexAttribPointer(sha.a_vertices._pName, this._vertexBuffer.itemSize, gl.FLOAT, false, 0, 0);
|
||||
|
||||
gl.drawArrays(gl.TRIANGLES, 0, this._vertexBuffer.numItems);
|
||||
|
||||
};
|
||||
|
||||
@ -1,19 +0,0 @@
|
||||
<html>
|
||||
<head>
|
||||
<title>OpenGlobus - Earth planet</title>
|
||||
<link rel="stylesheet" href="../../css/spinner.css" type="text/css"/>
|
||||
<link rel="stylesheet" href="../../css/og.css" type="text/css"/>
|
||||
|
||||
<script src="../../../closure-library/closure/goog/base.js"></script>
|
||||
<script src="../../src/og/og-deps.js"></script>
|
||||
|
||||
<script src="my-deps.js"></script>
|
||||
<script src="main.js"></script>
|
||||
|
||||
</head>
|
||||
|
||||
<body style="width: 100%; height: 100%; padding: 0; margin: 0;" onload="start();">
|
||||
<canvas id="canvas" style="width: 100%; height: 100%; display: block"></canvas>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
@ -1,48 +0,0 @@
|
||||
goog.require('og');
|
||||
goog.require('og.webgl.Handler');
|
||||
goog.require('og.Renderer');
|
||||
goog.require('og.control.SimpleNavigation');
|
||||
goog.require('og.shaderProgram.shape_wl');
|
||||
goog.require('og.shaderProgram.shape_nl');
|
||||
goog.require('og.node.Axes');
|
||||
goog.require('my.Sphere');
|
||||
goog.require('og.math.Vector3');
|
||||
|
||||
function start() {
|
||||
|
||||
var axesShader = new og.shaderProgram.ShaderProgram("flat", {
|
||||
uniforms: {
|
||||
uPMVMatrix: { type: og.shaderProgram.types.MAT4 }
|
||||
},
|
||||
attributes: {
|
||||
aVertexPosition: { type: og.shaderProgram.types.VEC3, enableArray: true },
|
||||
aVertexColor: { type: og.shaderProgram.types.VEC4, enableArray: true }
|
||||
},
|
||||
vertexShader: og.utils.readTextFile(og.shaderProgram.SHADERS_URL + "flat_vs.txt"),
|
||||
fragmentShader: og.utils.readTextFile(og.shaderProgram.SHADERS_URL + "flat_fs.txt")
|
||||
});
|
||||
|
||||
context = new og.webgl.Handler("canvas");
|
||||
context.addShaderProgram(axesShader);
|
||||
context.addShaderProgram(og.shaderProgram.shape_wl());
|
||||
context.addShaderProgram(og.shaderProgram.shape_nl());
|
||||
context.init();
|
||||
|
||||
renderer = new og.Renderer(context);
|
||||
renderer.init();
|
||||
|
||||
var axes = new og.node.Axes(10000);
|
||||
|
||||
mySphere = new my.Sphere();
|
||||
renderer.addRenderNode(mySphere);
|
||||
renderer.addRenderNode(axes);
|
||||
|
||||
renderer.addControls([
|
||||
new og.control.SimpleNavigation({ autoActivate: true }),
|
||||
]);
|
||||
|
||||
renderer.activeCamera.eye.set(50.0050415860476, 100.7441933678265, 200.429889299481);
|
||||
renderer.activeCamera.refresh();
|
||||
|
||||
renderer.start();
|
||||
};
|
||||
@ -1,4 +0,0 @@
|
||||
// This file was autogenerated by depswriter.py.
|
||||
// Please do not edit.
|
||||
goog.addDependency('../../../og/sandbox/sphere/my_sphere.js', ['my.Sphere'], ['og.light.PointLight', 'og.math', 'og.math.Matrix4', 'og.math.Vector3', 'og.node.RenderNode', 'og.shaderProgram.sphere', 'og.shape.Sphere'], false);
|
||||
goog.addDependency('../../../og/sandbox/sphere/sphere.js', ['og.shaderProgram.sphere'], ['og.shaderProgram', 'og.shaderProgram.ShaderProgram', 'og.shaderProgram.types', 'og.utils'], false);
|
||||
@ -1 +0,0 @@
|
||||
"e:\my projects\closure-library\closure\bin\build\depswriter.py" --root_with_prefix="./ ../../../og/sandbox/sphere/" > "e:\my projects\openglobus\sandbox\sphere\my-deps.js"
|
||||
@ -1,144 +0,0 @@
|
||||
goog.provide('my.Sphere');
|
||||
|
||||
goog.require('og.node.RenderNode');
|
||||
goog.require('og.shape.Sphere');
|
||||
goog.require('og.math');
|
||||
goog.require('og.math.Matrix4');
|
||||
goog.require('og.math.Vector3');
|
||||
goog.require('og.light.PointLight');
|
||||
goog.require('og.shaderProgram.sphere');
|
||||
|
||||
my.Sphere = function () {
|
||||
og.inheritance.base(this);
|
||||
|
||||
this._radius = 100;
|
||||
this._latBands = 64;
|
||||
this._lonBands = 64;
|
||||
|
||||
this._indexData = [];
|
||||
this._textureCoordData = [];
|
||||
this._normalData = [];
|
||||
this._positionData = [];
|
||||
|
||||
this.texture = null;
|
||||
|
||||
this._createData();
|
||||
};
|
||||
|
||||
og.inheritance.extend(my.Sphere, og.node.RenderNode);
|
||||
|
||||
my.Sphere.prototype._createData = function () {
|
||||
|
||||
for (var latNumber = 0; latNumber <= this._latBands; latNumber++) {
|
||||
var theta = latNumber * Math.PI / this._latBands;
|
||||
var sinTheta = Math.sin(theta);
|
||||
var cosTheta = Math.cos(theta);
|
||||
|
||||
for (var longNumber = 0; longNumber <= this._lonBands; longNumber++) {
|
||||
var phi = longNumber * 2 * Math.PI / this._lonBands;
|
||||
var sinPhi = Math.sin(phi);
|
||||
var cosPhi = Math.cos(phi);
|
||||
var x = cosPhi * sinTheta;
|
||||
var y = cosTheta;
|
||||
var z = sinPhi * sinTheta;
|
||||
var u = 1 - (longNumber / this._lonBands);
|
||||
var v = latNumber / this._latBands;
|
||||
this._normalData.push(x);
|
||||
this._normalData.push(y);
|
||||
this._normalData.push(z);
|
||||
this._textureCoordData.push(u);
|
||||
this._textureCoordData.push(v);
|
||||
this._positionData.push(this._radius * x);
|
||||
this._positionData.push(this._radius * y);
|
||||
this._positionData.push(this._radius * z);
|
||||
}
|
||||
}
|
||||
|
||||
for (var latNumber = 0; latNumber < this._latBands; latNumber++) {
|
||||
for (var longNumber = 0; longNumber < this._lonBands; longNumber++) {
|
||||
var first = (latNumber * (this._lonBands + 1)) + longNumber;
|
||||
var second = first + this._lonBands + 1;
|
||||
|
||||
this._indexData.push(first);
|
||||
this._indexData.push(first + 1);
|
||||
this._indexData.push(second);
|
||||
|
||||
this._indexData.push(second);
|
||||
this._indexData.push(first + 1);
|
||||
this._indexData.push(second + 1);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
my.Sphere.prototype._createBuffers = function () {
|
||||
var r = this.renderer;
|
||||
this._positionBuffer = r.handler.createArrayBuffer(new Float32Array(this._positionData), 3, this._positionData.length / 3);
|
||||
this._normalBuffer = r.handler.createArrayBuffer(new Float32Array(this._normalData), 3, this._normalData.length / 3);
|
||||
this._indexBuffer = r.handler.createElementArrayBuffer(new Uint16Array(this._indexData), 1, this._indexData.length);
|
||||
this._textureCoordBuffer = r.handler.createArrayBuffer(new Float32Array(this._textureCoordData), 2, this._textureCoordData.length / 2);
|
||||
}
|
||||
|
||||
my.Sphere.prototype.initialization = function () {
|
||||
this.renderer.handler.addShaderProgram(og.shaderProgram.sphere());
|
||||
|
||||
l1 = new og.light.PointLight();
|
||||
l1._diffuse.set(1.0, 1.0, 1.0);
|
||||
l1._ambient.set(0.3, 0.3, 0.4);
|
||||
l1._position.z = 5000;
|
||||
l1.addTo(this);
|
||||
|
||||
this.color = [1, 1, 1, 1];
|
||||
this.lightEnabled = true;
|
||||
|
||||
var that = this;
|
||||
var img = new Image();
|
||||
img.onload = function () {
|
||||
that.texture = that.renderer.handler.createTexture_mm(this);
|
||||
};
|
||||
img.src = "bm.png";
|
||||
|
||||
this._createBuffers();
|
||||
};
|
||||
|
||||
my.Sphere.prototype.frame = function () {
|
||||
var rn = this;
|
||||
var r = rn.renderer;
|
||||
|
||||
var sh, p,
|
||||
gl = r.handler.gl;
|
||||
|
||||
sh = r.handler.shaderPrograms.sphere;
|
||||
p = sh._program;
|
||||
sha = p.attributes,
|
||||
shu = p.uniforms;
|
||||
|
||||
sh.activate();
|
||||
|
||||
this.transformLights();
|
||||
|
||||
gl.uniform3fv(shu.pointLightsPositions._pName, rn._pointLightsTransformedPositions);
|
||||
gl.uniform3fv(shu.pointLightsParamsv._pName, rn._pointLightsParamsv);
|
||||
gl.uniform1fv(shu.pointLightsParamsf._pName, rn._pointLightsParamsf);
|
||||
gl.uniformMatrix4fv(shu.uPMatrix._pName, false, r.activeCamera._pMatrix._m);
|
||||
gl.uniformMatrix4fv(shu.uMVMatrix._pName, false, r.activeCamera._mvMatrix._m);
|
||||
gl.uniformMatrix3fv(shu.uNMatrix._pName, false, r.activeCamera._nMatrix._m);
|
||||
|
||||
gl.bindBuffer(gl.ARRAY_BUFFER, this._normalBuffer);
|
||||
gl.vertexAttribPointer(sha.aVertexNormal._pName, this._normalBuffer.itemSize, gl.FLOAT, false, 0, 0);
|
||||
|
||||
gl.uniform4fv(shu.uColor._pName, this.color);
|
||||
|
||||
gl.bindBuffer(gl.ARRAY_BUFFER, this._positionBuffer);
|
||||
gl.vertexAttribPointer(sha.aVertexPosition._pName, this._positionBuffer.itemSize, gl.FLOAT, false, 0, 0);
|
||||
|
||||
gl.activeTexture(gl.TEXTURE0);
|
||||
gl.bindTexture(gl.TEXTURE_2D, this.texture);
|
||||
gl.uniform1i(shu.uSampler._pName, 0);
|
||||
|
||||
gl.bindBuffer(gl.ARRAY_BUFFER, this._textureCoordBuffer);
|
||||
gl.vertexAttribPointer(sha.aTextureCoord._pName, this._textureCoordBuffer.itemSize, gl.FLOAT, false, 0, 0);
|
||||
|
||||
gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this._indexBuffer);
|
||||
gl.drawElements(r.handler.gl.TRIANGLES, this._indexBuffer.numItems, gl.UNSIGNED_SHORT, 0);
|
||||
|
||||
};
|
||||
|
Before Width: | Height: | Size: 64 KiB |
|
Before Width: | Height: | Size: 64 KiB |
@ -1,43 +0,0 @@
|
||||
precision highp float;
|
||||
|
||||
varying vec2 vTexCoord;
|
||||
|
||||
uniform sampler2D u_texture;
|
||||
uniform float resolution;
|
||||
uniform float radius;
|
||||
uniform vec2 dir;
|
||||
|
||||
void main() {
|
||||
//this will be our RGBA sum
|
||||
vec4 sum = vec4(0.0);
|
||||
|
||||
//our original texcoord for this fragment
|
||||
vec2 tc = vTexCoord;
|
||||
|
||||
//the amount to blur, i.e. how far off center to sample from
|
||||
//1.0 -> blur by one pixel
|
||||
//2.0 -> blur by two pixels, etc.
|
||||
float blur = radius/resolution;
|
||||
|
||||
//the direction of our blur
|
||||
//(1.0, 0.0) -> x-axis blur
|
||||
//(0.0, 1.0) -> y-axis blur
|
||||
float hstep = dir.x;
|
||||
float vstep = dir.y;
|
||||
|
||||
//apply blurring, using a 9-tap filter with predefined gaussian weights
|
||||
|
||||
sum += texture2D(u_texture, vec2(tc.x - 4.0 * blur * hstep, tc.y - 4.0 * blur * vstep)) * 0.0162162162;
|
||||
sum += texture2D(u_texture, vec2(tc.x - 3.0 * blur * hstep, tc.y - 3.0 * blur * vstep)) * 0.0540540541;
|
||||
sum += texture2D(u_texture, vec2(tc.x - 2.0 * blur * hstep, tc.y - 2.0 * blur * vstep)) * 0.1216216216;
|
||||
sum += texture2D(u_texture, vec2(tc.x - 1.0 * blur * hstep, tc.y - 1.0 * blur * vstep)) * 0.1945945946;
|
||||
|
||||
sum += texture2D(u_texture, vec2(tc.x, tc.y)) * 0.2270270270;
|
||||
|
||||
sum += texture2D(u_texture, vec2(tc.x + 1.0 * blur * hstep, tc.y + 1.0 * blur * vstep)) * 0.1945945946;
|
||||
sum += texture2D(u_texture, vec2(tc.x + 2.0 * blur * hstep, tc.y + 2.0 * blur * vstep)) * 0.1216216216;
|
||||
sum += texture2D(u_texture, vec2(tc.x + 3.0 * blur * hstep, tc.y + 3.0 * blur * vstep)) * 0.0540540541;
|
||||
sum += texture2D(u_texture, vec2(tc.x + 4.0 * blur * hstep, tc.y + 4.0 * blur * vstep)) * 0.0162162162;
|
||||
|
||||
gl_FragColor = vec4(sum.rgb, 1.0);
|
||||
}
|
||||
@ -1,9 +0,0 @@
|
||||
attribute vec2 a_position;
|
||||
|
||||
varying vec2 vTexCoord;
|
||||
|
||||
void main() {
|
||||
gl_Position = vec4(a_position, 0, 1);
|
||||
vec2 vt = a_position * 0.5 + 0.5;
|
||||
vTexCoord = vec2(vt.x, 1.0 - vt.y);//a_texCoords;
|
||||
}
|
||||
|
Before Width: | Height: | Size: 8.8 KiB |
|
Before Width: | Height: | Size: 217 KiB |
@ -1,72 +0,0 @@
|
||||
goog.require('og.webgl.Handler');
|
||||
goog.require('og.Renderer');
|
||||
goog.require('og.control.SimpleNavigation');
|
||||
goog.require('og.shaderProgram');
|
||||
goog.require('og.node.Axes');
|
||||
goog.require('my.Plane');
|
||||
goog.require('og.math.Vector3');
|
||||
|
||||
function start() {
|
||||
|
||||
og.webgl.MAX_FRAME_DELAY = 15;
|
||||
|
||||
var flatShader = new og.shaderProgram.ShaderProgram("flat", {
|
||||
uniforms: {
|
||||
uPMVMatrix: { type: og.shaderProgram.types.MAT4 }
|
||||
},
|
||||
attributes: {
|
||||
aVertexPosition: { type: og.shaderProgram.types.VEC3, enableArray: true },
|
||||
aVertexColor: { type: og.shaderProgram.types.VEC4, enableArray: true }
|
||||
},
|
||||
vertexShader: og.utils.readTextFile(og.shaderProgram.SHADERS_URL + "flat_vs.txt"),
|
||||
fragmentShader: og.utils.readTextFile(og.shaderProgram.SHADERS_URL + "flat_fs.txt")
|
||||
});
|
||||
|
||||
var colorShader = new og.shaderProgram.ShaderProgram("colorShader", {
|
||||
uniforms: {
|
||||
uMVMatrix: { type: og.shaderProgram.types.MAT4 },
|
||||
uPMatrix: { type: og.shaderProgram.types.MAT4 },
|
||||
uNMatrix: { type: og.shaderProgram.types.MAT4 },
|
||||
|
||||
pointLightsPositions: { type: og.shaderProgram.types.VEC3 },
|
||||
pointLightsParamsv: { type: og.shaderProgram.types.VEC3 },
|
||||
pointLightsParamsf: { type: og.shaderProgram.types.FLOAT },
|
||||
|
||||
//uColor: { type: og.shaderProgram.types.VEC4 },
|
||||
uSampler: { type: og.shaderProgram.types.SAMPLER2D },
|
||||
uNormalsMap: { type: og.shaderProgram.types.SAMPLER2D }
|
||||
},
|
||||
attributes: {
|
||||
aVertexNormal: { type: og.shaderProgram.types.VEC3, enableArray: true },
|
||||
aVertexPosition: { type: og.shaderProgram.types.VEC3, enableArray: true },
|
||||
aTextureCoord: { type: og.shaderProgram.types.VEC2, enableArray: true }
|
||||
},
|
||||
vertexShader: og.utils.readTextFile("plane_vs.txt"),
|
||||
fragmentShader: og.utils.readTextFile("plane_fs.txt")
|
||||
});
|
||||
|
||||
context = new og.webgl.Handler("canvas", null, ["OES_standard_derivatives"]);
|
||||
context.addShaderProgram(flatShader);
|
||||
context.addShaderProgram(colorShader);
|
||||
context.init();
|
||||
|
||||
renderer = new og.Renderer(context);
|
||||
renderer.init();
|
||||
|
||||
var axes = new og.node.Axes(10000);
|
||||
|
||||
plane = new my.Plane("Plane");
|
||||
renderer.addRenderNode(axes);
|
||||
renderer.addRenderNode(plane);
|
||||
|
||||
renderer.addControls([
|
||||
new og.control.SimpleNavigation({ autoActivate: true }),
|
||||
]);
|
||||
|
||||
renderer.start();
|
||||
|
||||
renderer.activeCamera.eye.x = 1114.1424013103258;
|
||||
renderer.activeCamera.eye.y = 2086.749969128237;
|
||||
renderer.activeCamera.eye.z = 8824.474084480114;
|
||||
renderer.activeCamera.refresh();
|
||||
};
|
||||
@ -1,3 +0,0 @@
|
||||
// This file was autogenerated by D:\my projects\closure-library\closure\bin\build\depswriter.py.
|
||||
// Please do not edit.
|
||||
goog.addDependency('../../../og/sandbox/plane/plane.js', ['my.Plane'], ['og.inheritance', 'og.light.PointLight', 'og.node.RenderNode', 'og.planetSegment.PlanetSegmentHelper', 'og.webgl.Framebuffer']);
|
||||
|
Before Width: | Height: | Size: 599 KiB |
|
Before Width: | Height: | Size: 73 KiB |
@ -1,7 +0,0 @@
|
||||
precision mediump float;
|
||||
|
||||
varying vec3 v_color;
|
||||
|
||||
void main () {
|
||||
gl_FragColor = vec4(v_color, 1.0);
|
||||
}
|
||||
@ -1,10 +0,0 @@
|
||||
attribute vec2 a_position;
|
||||
attribute vec3 a_normal;
|
||||
|
||||
varying vec3 v_color;
|
||||
|
||||
void main() {
|
||||
gl_PointSize = 1.0;
|
||||
gl_Position = vec4(a_position, 0, 1);
|
||||
v_color = a_normal * 0.5 + 0.5;
|
||||
}
|
||||
@ -1,441 +0,0 @@
|
||||
goog.provide('my.Plane');
|
||||
|
||||
goog.require('og.node.RenderNode');
|
||||
goog.require('og.inheritance');
|
||||
goog.require('og.planetSegment.PlanetSegmentHelper');
|
||||
goog.require('og.light.PointLight');
|
||||
goog.require('og.webgl.Framebuffer');
|
||||
|
||||
//goog.require('og.SyncQueue');
|
||||
|
||||
///////////////////////////////////////////////////////////////////
|
||||
///////////////////////////////////////////////////////////////////
|
||||
Heatmap = function (handler) {
|
||||
|
||||
this.handler = handler;
|
||||
this._verticesBuffer;
|
||||
};
|
||||
|
||||
Heatmap.prototype.init = function () {
|
||||
|
||||
var vertices = [];
|
||||
|
||||
for (var i = 0; i < 33; i++) {
|
||||
for (var j = 0; j < 33; j++) {
|
||||
vertices.push(-1 + j / (32 / 2), -1 + i / (32 / 2));
|
||||
}
|
||||
}
|
||||
|
||||
this._verticesBuffer = this.handler.createArrayBuffer(new Float32Array(vertices), 2, vertices.length / 2);
|
||||
var indexes = og.planetSegment.PlanetSegmentHelper.createSegmentIndexes(32, [32, 32, 32, 32]);
|
||||
this._indexBuffer = this.handler.createElementArrayBuffer(indexes, 1, indexes.length);
|
||||
|
||||
var positions = [
|
||||
-1.0, -1.0,
|
||||
1.0, -1.0,
|
||||
-1.0, 1.0,
|
||||
1.0, 1.0];
|
||||
|
||||
this._positionBuffer = this.handler.createArrayBuffer(new Float32Array(positions), 2, positions.length / 2);
|
||||
|
||||
this.framebuffer = new og.webgl.Framebuffer(this.handler.gl, 128, 128);
|
||||
this.framebuffer.initialize();
|
||||
};
|
||||
|
||||
|
||||
Heatmap.prototype.drawNormalMap = function (normals) {
|
||||
|
||||
this._normalsBuffer = this.handler.createArrayBuffer(new Float32Array(normals), 3, normals.length / 3);
|
||||
|
||||
this.handler.deactivateFaceCulling();
|
||||
//this.handler.clearFrame();
|
||||
|
||||
this.framebuffer.activate();
|
||||
this.framebuffer.clear();
|
||||
|
||||
this.handler.shaderPrograms.heatmap.activate();
|
||||
|
||||
this.handler.shaderPrograms.heatmap.set({
|
||||
a_position: this._verticesBuffer,
|
||||
a_normal: this._normalsBuffer
|
||||
});
|
||||
|
||||
//draw indexes
|
||||
this.handler.gl.bindBuffer(this.handler.gl.ELEMENT_ARRAY_BUFFER, this._indexBuffer);
|
||||
this.handler.gl.drawElements(this.handler.gl.TRIANGLE_STRIP, this._indexBuffer.numItems, this.handler.gl.UNSIGNED_SHORT, 0);
|
||||
|
||||
//this.handler.shaderPrograms.heatmap.drawArray(this.handler.gl.POINTS, this._verticesBuffer.numItems);
|
||||
this.framebuffer.deactivate();
|
||||
};
|
||||
|
||||
Heatmap.prototype.drawTexture = function (texture) {
|
||||
|
||||
this.handler.clearFrame();
|
||||
|
||||
this.handler.shaderPrograms.texture.activate();
|
||||
|
||||
this.handler.shaderPrograms.texture.set({
|
||||
a_position: this._positionBuffer,
|
||||
u_sampler: texture
|
||||
});
|
||||
|
||||
this.handler.shaderPrograms.texture.drawArray(this.handler.gl.TRIANGLE_STRIP, this._positionBuffer.numItems);
|
||||
};
|
||||
|
||||
Heatmap.prototype.drawBlur = function (texture, dir, size, radius) {
|
||||
|
||||
this.handler.clearFrame();
|
||||
|
||||
this.handler.shaderPrograms.blur.activate();
|
||||
|
||||
this.handler.shaderPrograms.blur.set({
|
||||
a_position: this._positionBuffer,
|
||||
u_texture: texture,
|
||||
resolution: size,
|
||||
radius: radius,
|
||||
dir: dir
|
||||
});
|
||||
|
||||
this.handler.shaderPrograms.blur.drawArray(this.handler.gl.TRIANGLE_STRIP, this._positionBuffer.numItems);
|
||||
};
|
||||
|
||||
////////////////////////////////////////////////////////////////////////////
|
||||
////////////////////////////////////////////////////////////////////////////
|
||||
my.Plane = function (name) {
|
||||
og.inheritance.base(this, name);
|
||||
this.vertexPositionBuffer = null;
|
||||
this.indexBuffer = null;
|
||||
this.size = 100;
|
||||
|
||||
this.light = null;
|
||||
|
||||
this.texture = null;
|
||||
};
|
||||
|
||||
og.inheritance.extend(my.Plane, og.node.RenderNode);
|
||||
|
||||
my.Plane.prototype.normalsPack = function () {
|
||||
normalsPacked = [];
|
||||
for (var i = 0; i < normals.length; i++) {
|
||||
normalsPacked[i] = normals[i] * 0.5 + 0.5;
|
||||
}
|
||||
};
|
||||
|
||||
my.Plane.prototype.normalsUnpack = function () {
|
||||
normalsUnpacked = [];
|
||||
for (var i = 0; i < normals.length; i++) {
|
||||
normalsUnpacked[i] = (normalsPacked[i] - 0.5) * 2.0;
|
||||
}
|
||||
};
|
||||
|
||||
my.Plane.prototype.initialization = function () {
|
||||
this.createBuffers();
|
||||
this.drawMode = this.renderer.handler.gl.TRIANGLE_STRIP;
|
||||
this.light = new og.light.PointLight();
|
||||
|
||||
this.light.setAmbient(new og.math.Vector3(0.14, 0.1, 0.2));
|
||||
this.light.setDiffuse(new og.math.Vector3(0.9, 0.9, 0.8));
|
||||
this.light.setSpecular(new og.math.Vector3(0.01, 0.01, 0.009));
|
||||
this.light.setShininess(8);
|
||||
this.light.addTo(this);
|
||||
this.light._position = new og.math.Vector3(5, 5, 5);
|
||||
|
||||
this.lightEnabled = true;
|
||||
|
||||
this.renderer.events.on("charkeypress", this, this.toogleWireframe, og.input.KEY_X);
|
||||
this.renderer.events.on("charkeypress", this, this.toogleLightPosition, og.input.KEY_C);
|
||||
|
||||
//
|
||||
//Hiddent context experiment
|
||||
//
|
||||
var normalMap = new og.shaderProgram.ShaderProgram("heatmap", {
|
||||
attributes: {
|
||||
a_position: { type: og.shaderProgram.types.VEC2, enableArray: true },
|
||||
a_normal: { type: og.shaderProgram.types.VEC3, enableArray: true }
|
||||
},
|
||||
vertexShader: og.utils.readTextFile("normalmap_vs.txt"),
|
||||
fragmentShader: og.utils.readTextFile("normalmap_fs.txt")
|
||||
});
|
||||
|
||||
var texture = new og.shaderProgram.ShaderProgram("texture", {
|
||||
attributes: {
|
||||
a_position: { type: og.shaderProgram.types.VEC2, enableArray: true }
|
||||
},
|
||||
uniforms: {
|
||||
u_sampler: { type: og.shaderProgram.types.SAMPLER2D }
|
||||
},
|
||||
vertexShader: og.utils.readTextFile("texture_vs.txt"),
|
||||
fragmentShader: og.utils.readTextFile("texture_fs.txt")
|
||||
});
|
||||
|
||||
var blur = new og.shaderProgram.ShaderProgram("blur", {
|
||||
attributes: {
|
||||
a_position: { type: og.shaderProgram.types.VEC2, enableArray: true }
|
||||
},
|
||||
uniforms: {
|
||||
u_texture: { type: og.shaderProgram.types.SAMPLER2D },
|
||||
resolution: { type: og.shaderProgram.types.FLOAT },
|
||||
radius: { type: og.shaderProgram.types.FLOAT },
|
||||
dir: { type: og.shaderProgram.types.VEC2 }
|
||||
},
|
||||
vertexShader: og.utils.readTextFile("blur_vs.txt"),
|
||||
fragmentShader: og.utils.readTextFile("blur_fs.txt")
|
||||
});
|
||||
|
||||
|
||||
this._hiddenHandler = new og.webgl.Handler();
|
||||
this._hiddenHandler.addShaderProgram(texture);
|
||||
this._hiddenHandler.addShaderProgram(blur);
|
||||
this._hiddenHandler.addShaderProgram(normalMap);
|
||||
this._hiddenHandler.init();
|
||||
|
||||
this._hiddenNode = new Heatmap(this._hiddenHandler, { alpha: false, depth: false });
|
||||
this._hiddenNode.init();
|
||||
|
||||
//make normal map
|
||||
this._hiddenHandler.setSize(128, 128);
|
||||
this._hiddenNode.drawNormalMap(normals);
|
||||
|
||||
//this._hiddenHandler.setSize(256, 256);
|
||||
//this._hiddenNode.drawTexture(this._hiddenNode.framebuffer.texture);
|
||||
|
||||
this._hiddenNode.drawBlur(/*this._hiddenHandler.createTexture(this._hiddenHandler.canvas)*/this._hiddenNode.framebuffer.texture, [1.0, 0.0], 128, 1);
|
||||
this._hiddenNode.drawBlur(this._hiddenHandler.createTexture(this._hiddenHandler.canvas), [0.0, 1.0], 128, 1);
|
||||
this.realNormals = this.renderer.handler.createTexture(this._hiddenHandler.canvas);
|
||||
|
||||
var img = new Image();
|
||||
var that = this;
|
||||
img.onload = function (e) {
|
||||
that.normalsTexture = that.renderer.handler.createTexture(this);
|
||||
};
|
||||
|
||||
img.src = "3912-normal.jpg";
|
||||
|
||||
};
|
||||
|
||||
my.Plane.prototype.toogleWireframe = function (e) {
|
||||
if (this.drawMode === this.renderer.handler.gl.LINE_STRIP) {
|
||||
this.drawMode = this.renderer.handler.gl.TRIANGLE_STRIP;
|
||||
} else {
|
||||
this.drawMode = this.renderer.handler.gl.LINE_STRIP;
|
||||
}
|
||||
};
|
||||
|
||||
my.Plane.prototype.toogleLightPosition = function () {
|
||||
this.light._position = this.renderer.activeCamera.eye.clone();
|
||||
};
|
||||
|
||||
my.Plane.prototype.createBuffers = function () {
|
||||
og.planetSegment.PlanetSegmentHelper.initIndexesTables(6);
|
||||
|
||||
|
||||
vertices = [];
|
||||
|
||||
var step = 1;
|
||||
var size = 32;
|
||||
|
||||
for (var i = 0; i <= size; i++) {
|
||||
for (var j = 0; j <= size; j++) {
|
||||
var x = j * step,
|
||||
y = (size) * step - i * step,
|
||||
z = Math.sin(x / 5) * Math.cos(1 * y / 5) * 1400;
|
||||
|
||||
vertices.push(x * this.size * 2, y * this.size * 2, z);
|
||||
}
|
||||
}
|
||||
|
||||
var gs = size + 1;
|
||||
normals = new Float64Array(gs * gs * 3);
|
||||
|
||||
var vertexIndices = og.planetSegment.PlanetSegmentHelper.createSegmentIndexes(size, [size, size, size, size]);
|
||||
var textureCoords = og.planetSegment.PlanetSegmentHelper.textureCoordsTable[size];
|
||||
|
||||
//function getVertex(i, j) {
|
||||
// if (i < 0) i = 0;
|
||||
// if (j < 0) j = 0;
|
||||
// if (i > gs - 1) i = gs - 1;
|
||||
// if (j > gs - 1) j = gs - 1;
|
||||
// var vInd = (i * gs + j) * 3;
|
||||
// return new og.math.Vector3(vertices[vInd], vertices[vInd + 1], vertices[vInd + 2]);
|
||||
//}
|
||||
|
||||
//for (var i = 0; i < gs - 1; i++) {
|
||||
// for (var j = 0; j < gs - 1; j++) {
|
||||
// var C = getVertex(i, j);
|
||||
// var B = getVertex(i - 1, j);
|
||||
// var D = getVertex(i, j - 1);
|
||||
// var E = getVertex(i, j + 1);
|
||||
// var F = getVertex(i + 1, j);
|
||||
|
||||
|
||||
// var vBC = og.math.Vector3.sub(C, B);
|
||||
// var vBE = og.math.Vector3.sub(E, B);
|
||||
// var nBCE = vBC.cross(vBE).normalize();
|
||||
|
||||
// var vDC = og.math.Vector3.sub(C, D);
|
||||
// var vDF = og.math.Vector3.sub(F, D);
|
||||
// var nDFC = vDF.cross(vDC).normalize();
|
||||
|
||||
// var vDB = og.math.Vector3.sub(B, D);
|
||||
// var nDCB = vDC.cross(vDB).normalize();
|
||||
|
||||
// var vCF = og.math.Vector3.sub(F, C);
|
||||
// var vCE = og.math.Vector3.sub(E, C);
|
||||
// var nCFE = vCF.cross(vCE).normalize();
|
||||
|
||||
// var nC = new og.math.Vector3((nBCE.x + nDFC.x + nDCB.x + nCFE.x) / 4, (nBCE.y + nDFC.y + nDCB.y + nCFE.y) / 4,
|
||||
// (nBCE.z + nDFC.z + nDCB.z + nCFE.z) / 4);
|
||||
|
||||
// // nC.normalize();
|
||||
|
||||
// var vInd = (i * gs + j) * 3;
|
||||
// normals[vInd] = nC.x;
|
||||
// normals[vInd + 1] = nC.y;
|
||||
// normals[vInd + 2] = nC.z;
|
||||
// }
|
||||
//}
|
||||
|
||||
for (var i = 0; i < gs - 1; i++) {
|
||||
for (var j = 0; j < gs - 1; j++) {
|
||||
|
||||
var vInd0 = (i * gs + j) * 3;
|
||||
var vInd1 = (i * gs + j + 1) * 3;
|
||||
var vInd2 = ((i + 1) * gs + j) * 3;
|
||||
var vInd3 = ((i + 1) * gs + (j + 1)) * 3;
|
||||
|
||||
var v0 = new og.math.Vector3(vertices[vInd0], vertices[vInd0 + 1], vertices[vInd0 + 2]),
|
||||
v1 = new og.math.Vector3(vertices[vInd1], vertices[vInd1 + 1], vertices[vInd1 + 2]),
|
||||
v2 = new og.math.Vector3(vertices[vInd2], vertices[vInd2 + 1], vertices[vInd2 + 2]),
|
||||
v3 = new og.math.Vector3(vertices[vInd3], vertices[vInd3 + 1], vertices[vInd3 + 2]);
|
||||
|
||||
var e10 = og.math.Vector3.sub(v1, v0),
|
||||
e20 = og.math.Vector3.sub(v2, v0),
|
||||
e30 = og.math.Vector3.sub(v3, v0);
|
||||
|
||||
var sw = e20.cross(e30);//.normalize();
|
||||
var ne = e30.cross(e10);//.normalize();
|
||||
|
||||
var n0 = og.math.Vector3.add(ne, sw);
|
||||
var n3 = og.math.Vector3.add(ne, sw);
|
||||
var n1 = og.math.Vector3.add(ne, sw);
|
||||
var n2 = og.math.Vector3.add(ne, sw);
|
||||
|
||||
//n0.normalize();
|
||||
//n1.normalize();
|
||||
//n3.normalize();
|
||||
//n2.normalize();
|
||||
|
||||
normals[vInd0] += n0.x;
|
||||
normals[vInd0 + 1] += n0.y;
|
||||
normals[vInd0 + 2] += n0.z;
|
||||
|
||||
normals[vInd1] += n1.x;
|
||||
normals[vInd1 + 1] += n1.y;
|
||||
normals[vInd1 + 2] += n1.z;
|
||||
|
||||
normals[vInd2] += n2.x;
|
||||
normals[vInd2 + 1] += n2.y;
|
||||
normals[vInd2 + 2] += n2.z;
|
||||
|
||||
normals[vInd3] += n3.x;
|
||||
normals[vInd3 + 1] += n3.y;
|
||||
normals[vInd3 + 2] += n3.z;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
for (var i = 0; i < normals.length; i += 3) {
|
||||
var l = Math.sqrt(normals[i] * normals[i] + normals[i + 1] * normals[i + 1] + normals[i + 2] * normals[i + 2]);
|
||||
normals[i] /= l;
|
||||
normals[i + 1] /= l;
|
||||
normals[i + 2] /= l;
|
||||
}
|
||||
|
||||
this.positionBuffer = this.renderer.handler.createArrayBuffer(new Float32Array(vertices), 3, vertices.length / 3);
|
||||
this.normalBuffer = this.renderer.handler.createArrayBuffer(new Float32Array(normals), 3, normals.length / 3);
|
||||
this.textureCoordBuffer = this.renderer.handler.createArrayBuffer(new Float32Array(textureCoords), 2, textureCoords.length / 2);
|
||||
this.indexBuffer = this.renderer.handler.createElementArrayBuffer(new Uint16Array(vertexIndices), 1, vertexIndices.length);
|
||||
|
||||
|
||||
var lines = [];
|
||||
var colors = [];
|
||||
for (var i = 0; i < normals.length; i += 3) {
|
||||
|
||||
lines.push(vertices[i], vertices[i + 1], vertices[i + 2],
|
||||
vertices[i] + normals[i] * 100, vertices[i + 1] + normals[i + 1] * 100, vertices[i + 2] + normals[i + 2] * 100);
|
||||
|
||||
colors.push(1.0, 0.0, 0.0, 1.0,
|
||||
1.0, 0.0, 0.0, 1.0);
|
||||
}
|
||||
|
||||
this.linesBuffer = this.renderer.handler.createArrayBuffer(new Float32Array(lines), 3, 2 * vertices.length / 3);
|
||||
this.linesColorBuffer = this.renderer.handler.createArrayBuffer(new Float32Array(colors), 4, 2 * vertices.length / 3);
|
||||
};
|
||||
|
||||
my.Plane.prototype.frame = function () {
|
||||
|
||||
var r = this.renderer;
|
||||
|
||||
var sh, p, gl;
|
||||
|
||||
//
|
||||
// Draw surface
|
||||
sh = r.handler.shaderPrograms.colorShader;
|
||||
p = sh._program;
|
||||
gl = r.handler.gl,
|
||||
sha = p.attributes,
|
||||
shu = p.uniforms;
|
||||
|
||||
sh.activate();
|
||||
|
||||
//gl.uniform4fv(shu.uColor._pName, [1, 1, 1, 1]);
|
||||
|
||||
//point light
|
||||
gl.uniform3fv(shu.pointLightsPositions._pName, this._pointLightsTransformedPositions);
|
||||
gl.uniform3fv(shu.pointLightsParamsv._pName, this._pointLightsParamsv);
|
||||
gl.uniform1fv(shu.pointLightsParamsf._pName, this._pointLightsParamsf);
|
||||
|
||||
//matrices
|
||||
gl.uniformMatrix4fv(shu.uPMatrix._pName, false, r.activeCamera.pMatrix._m);
|
||||
gl.uniformMatrix4fv(shu.uMVMatrix._pName, false, r.activeCamera.mvMatrix._m);
|
||||
gl.uniformMatrix3fv(shu.uNMatrix._pName, false, r.activeCamera.nMatrix._m);
|
||||
|
||||
//diffuse texture
|
||||
gl.activeTexture(gl.TEXTURE0);
|
||||
gl.bindTexture(gl.TEXTURE_2D, this.realNormals);
|
||||
gl.uniform1i(shu.uSampler._pName, 0);
|
||||
|
||||
gl.activeTexture(gl.TEXTURE1);
|
||||
gl.bindTexture(gl.TEXTURE_2D, this.normalsTexture);
|
||||
gl.uniform1i(shu.uNormalsMap._pName, 1);
|
||||
|
||||
|
||||
//normals
|
||||
gl.bindBuffer(gl.ARRAY_BUFFER, this.normalBuffer);
|
||||
gl.vertexAttribPointer(sha.aVertexNormal._pName, this.normalBuffer.itemSize, gl.FLOAT, false, 0, 0);
|
||||
|
||||
//vertices positions
|
||||
gl.bindBuffer(gl.ARRAY_BUFFER, this.positionBuffer);
|
||||
gl.vertexAttribPointer(sha.aVertexPosition._pName, this.positionBuffer.itemSize, gl.FLOAT, false, 0, 0);
|
||||
|
||||
//texture coordinates
|
||||
gl.bindBuffer(gl.ARRAY_BUFFER, this.textureCoordBuffer);
|
||||
gl.vertexAttribPointer(sha.aTextureCoord._pName, this.textureCoordBuffer.itemSize, gl.FLOAT, false, 0, 0);
|
||||
|
||||
//draw indexes
|
||||
gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexBuffer);
|
||||
gl.drawElements(this.drawMode, this.indexBuffer.numItems, gl.UNSIGNED_SHORT, 0);
|
||||
|
||||
|
||||
//
|
||||
//Draw normals
|
||||
//r.handler.shaderPrograms.flat.activate();
|
||||
|
||||
//r.handler.shaderPrograms.flat.set({
|
||||
// uPMVMatrix: r.activeCamera.pmvMatrix._m,
|
||||
// aVertexPosition: this.linesBuffer,
|
||||
// aVertexColor: this.linesColorBuffer
|
||||
//});
|
||||
//r.handler.shaderPrograms.flat.drawArray(r.handler.gl.LINES, this.linesBuffer.numItems);
|
||||
|
||||
};
|
||||
@ -1,71 +0,0 @@
|
||||
#extension GL_OES_standard_derivatives : enable
|
||||
|
||||
precision highp float;
|
||||
|
||||
varying vec4 v_TransformedNormal;
|
||||
varying vec4 v_Position;
|
||||
varying vec2 v_TextureCoord;
|
||||
varying vec4 v_lightDirection;
|
||||
varying vec4 v_EyeVec;
|
||||
|
||||
|
||||
|
||||
//uniform vec4 uColor;
|
||||
uniform sampler2D uSampler;
|
||||
uniform sampler2D uNormalsMap;
|
||||
|
||||
#define MAX_POINT_LIGHTS 1
|
||||
|
||||
uniform vec3 pointLightsParamsv[MAX_POINT_LIGHTS * 3];
|
||||
uniform float pointLightsParamsf[MAX_POINT_LIGHTS];
|
||||
|
||||
varying mat3 v_NMatrix;
|
||||
|
||||
mat3 cotangent_frame(vec3 N, vec3 p, vec2 uv)
|
||||
{
|
||||
// get edge vectors of the pixel triangle
|
||||
vec3 dp1 = dFdx( p );
|
||||
vec3 dp2 = dFdy( p );
|
||||
vec2 duv1 = dFdx( uv );
|
||||
vec2 duv2 = dFdy( uv );
|
||||
|
||||
// solve the linear system
|
||||
vec3 dp2perp = cross( dp2, N );
|
||||
vec3 dp1perp = cross( N, dp1 );
|
||||
vec3 T = dp2perp * duv1.x + dp1perp * duv2.x;
|
||||
vec3 B = dp2perp * duv1.y + dp1perp * duv2.y;
|
||||
|
||||
// construct a scale-invariant frame
|
||||
float invmax = inversesqrt( max( dot(T,T), dot(B,B) ) );
|
||||
return mat3( T * invmax, B * invmax, N );
|
||||
}
|
||||
|
||||
vec3 perturb_normal( vec3 N, vec3 V, vec2 texcoord )
|
||||
{
|
||||
// assume N, the interpolated vertex normal and
|
||||
// V, the view vector (vertex to eye)
|
||||
vec3 map = texture2D(uNormalsMap, texcoord ).xyz;
|
||||
map = map * 255./127. - 128./127.;
|
||||
mat3 TBN = cotangent_frame(N, -V, texcoord);
|
||||
return normalize(TBN * map);
|
||||
}
|
||||
|
||||
void main(void) {
|
||||
|
||||
vec2 uv = v_TextureCoord;
|
||||
vec3 N = normalize(v_TransformedNormal.xyz);
|
||||
vec3 L = normalize(v_lightDirection.xyz);
|
||||
vec3 V = normalize(v_EyeVec.xyz);
|
||||
|
||||
vec3 PN = perturb_normal(N, V, uv);
|
||||
|
||||
vec3 R = reflect(-L, PN);
|
||||
|
||||
float specular = pow(max(dot(R, V), 0.0), pointLightsParamsf[0]);
|
||||
float lambertTerm = max(dot(PN, L), 0.0);
|
||||
vec3 lightWeighting = pointLightsParamsv[0] + pointLightsParamsv[1] * lambertTerm + pointLightsParamsv[2] * specular;
|
||||
|
||||
vec4 tColor = vec4(1.0);//texture2D( uSampler, v_TextureCoord.st );
|
||||
|
||||
gl_FragColor = vec4(tColor.rgb * lightWeighting, 1.0);
|
||||
}
|
||||
@ -1,28 +0,0 @@
|
||||
attribute vec3 aVertexNormal;
|
||||
attribute vec3 aVertexPosition;
|
||||
attribute vec2 aTextureCoord;
|
||||
|
||||
uniform mat4 uPMatrix;
|
||||
uniform mat4 uMVMatrix;
|
||||
uniform mat3 uNMatrix;
|
||||
|
||||
uniform vec3 pointLightsPositions[1];
|
||||
|
||||
|
||||
varying vec4 v_TransformedNormal;
|
||||
varying vec4 v_Position;
|
||||
varying vec2 v_TextureCoord;
|
||||
varying vec4 v_lightDirection;
|
||||
varying vec4 v_EyeVec;
|
||||
|
||||
varying mat3 v_NMatrix;
|
||||
|
||||
void main(void) {
|
||||
v_Position = uMVMatrix * vec4(aVertexPosition, 1.0);
|
||||
v_EyeVec = -v_Position;
|
||||
gl_Position = uPMatrix * v_Position;
|
||||
v_TransformedNormal = vec4(uNMatrix * aVertexNormal, 1.0);
|
||||
v_TextureCoord = aTextureCoord;
|
||||
v_NMatrix = uNMatrix;
|
||||
v_lightDirection = vec4(pointLightsPositions[0], 1.0) - v_Position;
|
||||
}
|
||||
@ -1,10 +0,0 @@
|
||||
precision highp float;
|
||||
|
||||
varying vec2 v_texCoords;
|
||||
|
||||
uniform sampler2D u_sampler;
|
||||
|
||||
void main(void) {
|
||||
vec4 tColor = texture2D( u_sampler, v_texCoords.st );
|
||||
gl_FragColor = vec4(tColor.rgb, 1.0);
|
||||
}
|
||||
@ -1,10 +0,0 @@
|
||||
attribute vec2 a_position;
|
||||
//attribute vec2 a_texCoords;
|
||||
|
||||
varying vec2 v_texCoords;
|
||||
|
||||
void main() {
|
||||
gl_Position = vec4(a_position, 0, 1);
|
||||
vec2 vt = a_position * 0.5 + 0.5;
|
||||
v_texCoords = vec2(vt.x, 1.0 - vt.y);//a_texCoords;
|
||||
}
|
||||