{"author_name":"Frozen Fractal","cat":"LD #24","comments":[],"epoch":1345663200,"likes":2,"metadata":{"p_key":"55085","p_author":"Frozen Fractal","p_authorkey":"7882","p_urlkey":"90799","p_title":"Frozen Fractal joining LD24, and announcing a WebGL library!","p_cat":"LD #24","p_event":"LD24","p_time":"1345663200","p_likes":"2","p_comments":"0","p_status":"UPD5","us_key":"7882","us_name":"Frozen Fractal","us_username":"thomastc","event_start":"1345766400","event_key":"12","event_name":"LD24"},"text":"<p>My previous &lt;shamelessplug&gt;<a title=\"I Am A Ninja\" href=\"http:\/\/ninja.frozenfractal.com\/\" target=\"_blank\">entry<\/a>&lt;\/shamelessplug&gt;, for LD22, being a resounding success, I&#8217;m now back for more! I used to be known as ThomasTC, but now I&#8217;m Frozen Fractal on here, frozenfractal on IRC, <a href=\"http:\/\/twitter.com\/frozenfractal\" target=\"_blank\">@frozenfractal<\/a> on Twitter, and\u00a0<a href=\"http:\/\/frozenfractal.com\" target=\"_blank\">frozenfractal.com<\/a> on the web at large.<\/p>\n <p>Like last time, I&#8217;ll be using <strong>HTML5<\/strong> and <strong>canvas<\/strong>. Unlike last time, rather than plain 2D canvas, I&#8217;ll be using <strong>WebGL<\/strong>! It&#8217;ll be all fancy-like, with shaders and stuff. Maybe even 3D.<\/p>\n <p>This post is also a kind of base code declaration. &#8220;Kind of&#8221;, because I&#8217;m spending my free time this week writing my &#8220;base code&#8221; up into a nice <strong>open-source WebGL library<\/strong>!<\/p>\n <p>It&#8217;s called <strong>Gladder<\/strong> (GL-adder, or G-ladder, or just more glad, take your pick). Gladder is&#8230;<\/p>\n <ul>\n <li>&#8230; opaque. It does not expose WebGL, but rather aims to wrap it in a straightforward way.<\/li>\n <li>&#8230; thin. Many Gladder classes are direct equivalents of WebGL constructs.<\/li>\n <li>&#8230; light. It has no dependencies, other than WebGL itself.<\/li>\n <li>&#8230; flexible. It tries to make as few assumptions about your application as possible.<\/li>\n <li>&#8230; unobtrusive. It does not change default behaviour of anything.<\/li>\n <li>&#8230; cross-browser. It abstracts away browser differences.<\/li>\n <\/ul>\n <p>The only similar library I could find was\u00a0<a title=\"GLOW\" href=\"http:\/\/i-am-glow.com\/\" target=\"_blank\">Glow<\/a>, but I found its documentation lacking (read: nonexistent),\u00a0the website yellow, and\u00a0the code messy. I&#8217;d rather write my own bugs than inherit someone else&#8217;s; that way, I have at least a sporting chance at fixing them.<\/p>\n <p>Another drawback of Glow, as with many other OpenGL wrapper libraries, is that it still forces you to deal with OpenGL and its state changes. Gladder aims to abstract all hidden state away and let you deal just with objects and draw calls. Here is an <a href=\"https:\/\/github.com\/ttencate\/gladder\/blob\/master\/examples\/cube.html\" target=\"_blank\">example<\/a>; there&#8217;s still one gla.enable() call, but no code to bind shaders, programs, buffers, uniforms, attributes&#8230; all of that is handled behind the scenes. The advantage of not exposing OpenGL at all is that the library has full knowledge of the GL state, so it can skip expensive state changes whenever possible.<\/p>\n <p>Since I don&#8217;t yet know what type of game I&#8217;ll be making, I&#8217;m forced to keep Gladder generic. To do that, I&#8217;m working top-down from code samples. First, I come up with something I&#8217;d like to be able to do, like render a spinning cube. Then I&#8217;ll write the code that I would like to result in a spinning cube being rendered, but it won&#8217;t work because I haven&#8217;t implemented those parts of the library yet. Finally I write the library code that does the actual work behind the scenes. I might iterate a few times, cleaning up the example code even further. I hope this approach will result in a straightforward, easy to use API.<\/p>\n <p>You can <a title=\"Gladder\" href=\"http:\/\/github.com\/ttencate\/gladder\" target=\"_blank\">get Gladder on GitHub<\/a>. Several important things are still missing (e.g. modifying buffer data, loading textures from images), but I&#8217;m going to push hard to make it usable before LD24 starts.<\/p>\n <p>Note that the interface is still in flux while I improve things and make them easier to use. If you would like to use Gladder for the compo or jam, let me know and I&#8217;ll focus a bit more on adding JSDoc comments and more examples.\u00a0During the compo you&#8217;ll be on your own though, because I&#8217;ll be busy making a game!<\/p>\n \n <p>Tags: <a href=\"http:\/\/ludumdare.com\/compo\/tag\/canvas\/\" rel=\"tag\">canvas<\/a>, <a href=\"http:\/\/ludumdare.com\/compo\/tag\/html5\/\" rel=\"tag\">html5<\/a>, <a href=\"http:\/\/ludumdare.com\/compo\/tag\/javascript\/\" rel=\"tag\">javascript<\/a>, <a href=\"http:\/\/ludumdare.com\/compo\/tag\/webgl\/\" rel=\"tag\">webgl<\/a><\/p>","time":"August 22nd, 2012 2:20 pm","title":"Frozen Fractal joining LD24, and announcing a WebGL library!"}