Our light buffer consists of this: RGB: Light A: Specular highlight Storing our specular highlight in our alpha channel makes sense, since in a traditional forward renderer, the specular highlight would be a float multiplied against a specular map at a later stage anyways. So we basically just multiply the light (RGB) against the albedo (which we'll assume is vec3), and the specular highlight (A) against our specular map (which can either be float or vec3, depending on if you want to use an extra texture or the alpha of an existing texture), then add the two resulting specular and diffuse components together. Another nifty trick you could do, since we're storing our specular exponent for the deferred renderer in its own channel, then later multiplying by 128 within the fragment shader, you could actually use the alpha of your specular map to influence the specular highlight's exponent; therefore giving you a specular exponent map.
Ha, that would allow for some kickass galvanized metal and ice effects. Update: I've implemented layers of objects, so skyboxes are now a possibility. I've added an animated sky shader, simulating cloud formation and movement. Check it out: Looks better in motion, so give it a try.
This is awesome. I've been wondering what happened to this when you suddenly disappear. I wish I could make levels for this though.
I went ahead and forked your repo. I'm gonna see if I can get some fancypants rendering stuff going on.
This still doesn't work for me on Firefox 3 or Chrome 11. Chrome gives this error, but it seems to carry on only to give pages full of warnings and still not work. Ubuntu 10.10 x64 GTX280
There's your problem. WebGL is not enabled by default in Linux builds of Chrome. (And I don't think Firefox 3 even supported it, upgrade to 4) You might be able to enable it in Chrome by launching with "--enable-webgl —in-process-webgl" arguments.
Can't run it either in Firefox 6.0a1 (Nightly) or Chromium 10.0.648.133 (77742) - all I get is the HUD and a black screen. OS : Ubuntu 10.04 GPU : Nvidia 8500GS with proprietary drivers Error shown in Chromium : Code (Text): Error: Nonexistent or unused uniform in the description of shader shader/sky.jsonshader: u_normalCameraViewError: Nonexistent or unused uniform in the description of shader shader/sky.jsonshader: u_normalCameraView at http://achene.co/WebSonic/js/GraphicsEngine.js:96:11 at Array.forEach (native) at new (http://achene.co/WebSonic/js/GraphicsEngine.js:93:23) at Object.success (http://achene.co/WebSonic/js/ResourceManager.js:80:20) at success (http://achene.co/WebSonic/lib/jquery.js:5267:15) at XMLHttpRequest. (http://achene.co/WebSonic/lib/jquery.js:5207:7) Error in Firefox : Code (Text): Error: Nonexistent or unused uniform in the description of shader shader/sky.jsonshader: u_normalCameraView("u_normalCameraView",1,[object Array])@http://achene.co/WebSonic/js/GraphicsEngine.js:96 ([object Object],"shader/sky.jsonshader")@http://achene.co/WebSonic/js/GraphicsEngine.js:93 ([object Object],"success",[object XMLHttpRequest])@http://achene.co/WebSonic/js/ResourceManager.js:80 success()@http://achene.co/WebSonic/lib/jquery.js:5267 ([object Event])@http://achene.co/WebSonic/lib/jquery.js:5207
That must be why "247 User(s) are reading this topic (244 Guests [3 Members] and 0 Anonymous Users)"!
This is fantastic! It really shows some promise, but it's a bitch and a half to get Sonic to turn more than 90 degrees. Is there any way to tween animations in WebGL, or is that something done in other software?
Having this featured on Hacker News was a very pleasant surprise. :-) Haha, the topic got 12,000 views in a few hours. I've fixed a minor bug on the shader code for the clouds. It's hard to get the shaders working everywhere, since different hardware seems to deal with GLSL differently. Regarding the controls: I was kinda anal about them on the FAQ. Do you guys have suggestions on better control schemes? Regarding the animations: Yup, it's possible to implement it. Shouldn't be hard, either: Just send the previous and current vertex positions to the shader as attributes, and the interpolation factor as an uniform. Then use the simple math (alpha * V1 + (1-alpha) * V2) to work out the interpolated positions. Implementing bone based animation might be a bit harder. :-( Regarding walking on walls: lol I need to fix that.
I've made the shader error handling less draconian now. Missing uniforms/attributes now issue a warning instead of an error. If it didn't work before for you with an error like: It should work now.
So, apparently Firefox 4 for Android supports WebGL, I'd try running this on my phone but it has an ARM6 CPU, Firefox 4 requires at least an ARM7 CPU. Could someone with an ARM7 Android phone try to run this?
There used to be an ARM6 development version of Firefox 4 Mobile, but apparently they gave up on it and removed it from the site. Shame, really.
How odd, I keep getting a "connection reset" when trying to access http://www.achene.co/WebSonic/. =\
Which incidentally now I'm on Firefox 4 I can finally have a play with. =P Very impressive stuff! You'd never have seen this sort of thing coming browser-native even a few years ago.
Does not work on Firefox 4 on android. Error: Error compiling vertex shader. Oh well. The dream of a web-based 3d sonic game on my mobile phone will have to wait another day. Edit: But on the PC, works great under Chrome
