Kornelius Kalnbach & Oliver Stadie

Wikip3dia

● OpenGL ES 2.0 für JavaScript● Shader!

● Standard noch in Arbeit● läuft in

● Gecko (Firefox 3.7)● WebKit (Safari, Chrome)● Opera, nicht IE● mobile Varianten

Idee

● Wikipedia als Gebäude● Artikel = Raum● Link = Tür, Tunnel

● automatisch generiert● Raum mit Platz für alle Links● Textur mit Linktiteln

Demo

Features

● MipMaps● Ambient Lighting● Directional Lighting● Point Lighting● Fake Shadow● Reflektion● Phong Shading

● Lens Flare● Backface Culling● generierte Texturen● Alpha Blending● Nebel● Shader● …

Technik● JavaScript

● komplett im Browser● keine Serverlast● plattform-unabhängig

● MediaWiki API● WebGL

HardwareBetriebssystem

Browser

GrafikkarteOpenGLWebGLJavaScript

Danke!

Fragen?

Lense Flare

● Textur mit Alphakanal & Alpha Blending● 3 orthogonale Ebenen● Depth-Buffer-Test deaktiviert.

+ - =Depth-Buffer

Reflektion● Boden zeichnen● Tiefenbuffer manipulierengl.depthFunc(gl.GREATER);gl.depthMask(false);

● Szene am Boden spiegelnmvMatrix = mvScale(mvMatrix, 1, -1, 1);

● Szene zeichnen, bei Kisten nur Vorderseitegl.enable(gl.CULL_FACE);

● Boden nochmal zeichnen (mit Alpha)gl.depthFunc(gl.EQUAL);gl.enable(gl.BLEND);setAlpha(gl, shaderProgram, 0.6);