The Cappuccino community loves to build rich and beautiful applications. The latest example of this is PicsEngine 4.0 by Michael Villar.
The application features a clean UI and nice drag and drop support.
Jun 11
Tim Caswell has been doing awesome work, and his latest project is Connect, a high performance middleware framework for node.js. Ruby has Rack. Python has WSGI. Java has Servlets. Now, JavaScript has Node/Connect.
I was able to set it up in minutes and took the following screencast of a sample application in action:
Take a peak at the examples as they show you how easy it is to rack up the middleware. In the Raphael circle multi-touch collaborative dragging example shown, you get a nice set of filters:
JAVASCRIPT:
module.exports = new Connect.Server([
{filter: “log”},
{filter: “response-time”},
{filter: “body-decoder”},
{provider: “pubsub”, route: “/stream”, logic: Backend},
{filter: “conditional-get”},
{filter: “cache”},
{filter: “gzip”},
{provider: “cache-manifest”, root: root},
{provider: “static”, root: root}
]);
{filter: “log”},
{filter: “response-time”},
{filter: “body-decoder”},
{provider: “pubsub”, route: “/stream”, logic: Backend},
{filter: “conditional-get”},
{filter: “cache”},
{filter: “gzip”},
{provider: “cache-manifest”, root: root},
{provider: “static”, root: root}
]);
Awesome. And with the Heroku support it is tempting to git a version up there and see how many Ajaxians can muck around with it….
May 18
Jacob Waller created an addictive word came in Golingo. What sets it apart?
- Not a single line of Objective-C written, courtesy of Titanium Mobile
- Only one (!) image ingame – the rest is CSS3 magic
- Fluid gameplay thanks to CSS Transitions and Animations
- All logic using pure, beautiful JavaScript
- Multitouch draggables using iPhone Touch API
- Logic encapsulated using Low Pro – meaning split screen mode was easy pie
- jQuery 1.4.2 for development speed (and sanity of developer)
- CouchDB as highscore storage, with storage logic in JavaScript
- Predictable randomness means replayable games, all courtesy of excellent seedrandom
Jacob dives into deeper into the full tool chain that he used in his post about open sourcing the code behind the game. That’s right, he wants you to fork it and do something amazing with the game. Pretty awesome if you ask me.
His tool chain:
- Titanium Mobile
- CSS3 with Webkit extras
- jQuery 1.4.2
- Low Pro for jQuery
- Glyphish icons
- Uri-parser
- Swedish word list
- CouchDB
- Flag icons
He then goes on to talk about the initial construction of the game:
Most of the actual game was made in a few weeks time, but from scratch to published app it took almost six weeks of part time work. A lot of this time was spent banging my head into various walls. Again, Titanium is great, but it’s a young framework with all the kinks that follows. There has been quite a few bugs, and the documentation hasn’t always been up to date – but this is much better nowadays. What more – since most other developers are as clueless as yourself, It’s been hard finding good resources and getting help. I did however get a trial for Appcelerator’s Premium Subscription, with 48-hours guaranteed response, and I must say it’s really good stuff. The developers themselves answers all your stupid questions and relieves most of the wall banging. If you can afford it, go for it!
By releasing the code for Golingo, we hope to relieve some of the headaches surrounding developing packaged HTML5 apps. I do not say that it’s not full of faults, because it is, but at least it is a working example full of faults. Please don’t hesitate to dig through the code to see what is going on. We believe we’ve solved some common problems that you too will run in to when using Titanium, for example transparently calling native functions from a webview (and vice versa) using callbacks and trickery. Here’s a quick recap of that:
- Connecting Titanium Contexts
- Low Pro like a low pro: $(‘<div/>’).attachAndReturn(Letter, this, letter, specialLetter);
- Sexifying: including templating with mustasche
Thanks for the great info and resource Jacob!
May 07
This is fantastic news. A lot of people were claiming that O3D was going to beat WebGL because of performance. Then the O3D team showed that the two could be complimentary, and they have taken the next step on that journey. As of today, O3D will stop being a plugin, and will become a JS library on top of WebGL. This is fantastic, as we need a nice API on top of the OpenGL-y WebGL library.
Here are their thoughts. Congrats to the O3D team, to the WebGL folk, and to the future:
We launched the O3D API about a year ago to start a discussion within the web community about establishing a new standard for 3D graphics on the web. Since then, we’ve also helped develop WebGL, a 3D graphics API based on OpenGL ES 2.0 that has gradually emerged as a standard, and is supported by other browser and hardware vendors like Mozilla, Apple and Opera.
At Google, we’re deeply committed to implementing and advancing standards, so as of today, the O3D project is changing direction, evolving from its current plug-in implementation into a JavaScript library that runs on top of WebGL. Users and developers will still be able to download the O3D plug-in and source code for at least one year, but other than a maintenance release, we plan to stop developing O3D as a plug-in and focus on improving WebGL and O3D as a JavaScript library.
We did not take this decision lightly. In initial discussions we had about WebGL, we were concerned that JavaScript would be too slow to drive a low-level API like OpenGL and we were convinced that a higher level approach like the O3D scene graph would yield better results. We were also cognizant of the lack of installed OpenGL drivers on many Windows machines, and that this could hamper WebGL’s adoption.
Since then, JavaScript has become a lot faster. We’ve been very impressed by the demos that developers have created with WebGL, and with the ANGLE project, we believe that Chromium will be able to run WebGL content on Windows computers without having to rely on installed OpenGL drivers.
The JavaScript implementation of O3D is still in its infancy, but you can find a copy of it on the O3D project site and see it running some of the O3D samples from a WebGL enabled browser (alas, no Beach Demo yet). Because browsers lack some requisite functionality like compressed asset loading, not all the features of O3D can be implemented purely in JavaScript. We plan to work to give the browser this functionality, and all capabilities necessary for delivering high-quality 3D content.
Apr 18
Mike Ball & Evin Grano of Eloqua gave a fun talk this morning at JSConf, and they had great stuff to show.
SeedJS
SproutCore is supporting CommonJS, but a lot of code was written by folks before CommonJS….. so they created SeedJS a package management tool that groks CommonJS and packages everything up for you. seed is built on top of git and lets you do things like:
seed fork markdown
seed install js-beautify
Greenhouse
Greenhouse is an interface builder for SproutCore (in the Atlas, Ares, vein). SproutCore was actually written with tooling in mind. For example, the tool can load up your SproutCore app and suppress the main loop, and get access to your custom views.
Touch
SproutCore has added really nice touch support natively into the framework. The guys showed the sample apps running on an iPad. They have done a lot of work here. For example, the physics for bouncing when you scroll, the list picker does the right UI when rotating to portrait mode. In a couple of weeks they took this and got a few apps written, including:
NPR
I love this. A team recreated the NPR iPad application using SproutCore… in a matter of *days*. And it really works. You can read the news, listen to the audio, etc. What is so cool about it is the fact that you can’t tell the difference between the HTML version and the native version. I really want Joe Hewitt to get his hands on this. In fact, on some scrolling tests the HTML version felt *smoother* to me. This is a real feet and a strong vindication for the Web platform. Not only do you get reach, but you can deliver first class applications on mobile and beyond. Fantastic job guys.
Oh, and this stuff works on any touch device. And it is hardware accelerated.
Feb 17
Martin Aumont has released Harmony, which “provides a simple DSL to execute JavaScript and DOM code within Ruby.”
This enables you to do very cool things such as unit test JavaScript in the same area as your Ruby tests:
RUBY:
-
require ‘test/unit’
require ‘harmony’
class JavascriptTest <Test::Unit::TestCase
def setup
@page = Harmony::Page.new
@page.load(‘public/javascripts/foo.js’)
end
def test_foo
assert_equal "world", @page.execute_js(<<-JS)
foo = new Foo;
foo.hello();
JS
end
end
and you can even use JavaScript libraries…. as script tags are autofetched:
RUBY:
-
require ‘harmony’
page = Harmony::Page.new(<<-HTML)
<html>
<head>
<script src="javascripts/jquery.js" type="text/javascript"></script>
</head>
<body>
<div id="widget">ohaie</div>
</body>
HTML
page.execute_js("$(‘#widget’).innerHTML") #=> "ohaie"
This library builds on the shoulders of giants, one of which is Mr. Johnson, John Barnette who I had the pleasure of working with many moons ago. He is the person I think of when I remember that the best engineers that I have worked with haven’t been computer scientists, but musicians and biologists. He is also a great fun guy.
Anyway, sorry for the aside.
If you are a Rails chap, you may also be interested in the Rails plugin holygrail.
