Posts Categorized: Experiments in Web

Ascent – A WebGL Space Simulator Framework

Quite a while ago, I started RavenJS. It was awesome fun. Seeing it grow, and in the end, being able to walk the landscape, was an amazing experience. It triggered sweet memories from the past, and also showed what was possible today. But the whole project sadly has many downsides, the biggest being the fact that I will never be able to put it online somewhere. I still believe that it would have been an awesome opportunity; if I were the original publishers, I would have jumped at it, created a freemium model around it, and spent the rest of my days wondering where to put all the money. Seriously, an online MMORPG, without any plugin or executable to download, just open your browser, enter your (OpenID-) credentials and play? With decent 3D graphics? Plus, that all in a famous setting? I can hardly imagine the amount of success of such a thing would have. (Think about it a little more – virtually no barrier to play, payment and id providers all already in place, pushing updates without downloads, and so on…)

Well, however, I don’t want to get carried away, I guess you get what I mean. So, I decided to start something else. Something that would be easier to realize for a non-3D-guy like me. And something using three.js, as I’ve always been using GLGE for my WebGL experiments (RavenJS was built using GLGE, too). And, most important, something that could be open source and live on GitHub. Something that everybody could play, download and fork. Something people could contribute to, modify, extend, make better.
read more »

How to make three.js Ray caster detect Collada objects

Three.js' Ray caster successfully detecting a Pulsar transport vehicle.

Unfortunately, three.js’ Ray class currently doesn’t detect intersections with imported Collada objects. Unfortunately, because I heavily rely on imported models and I’m too lazy to do the detection manually.

But, the good new is, the collada objects carry all information needed for the ray caster to work properly; you just need to do some manual tweaking.

read more »

2011 category Tags 3 Comments

Porting a 3D RPG to WebGL, Part 1

It all began half a year ago when I sat down with a friend and fellow crew member, Stephan, and we agreed that Gothic was indeed one the best RPGs of all times (seriously, if you don’t know it and are into RPGs, you should get it). We also soon agreed that it would be awesome to experience it’s amazing atmosphere in a browser, using WebGL. Stephan shopped two shiny new copies of Gothic and we started hacking away and gave the project the very fitting title RavenJS…

Update: Stephan recommended to put the video on top,  so here it goes: Some impressions from RavenJS, enjoy (fullscreen and headphones recommended)!

read more »

Storage Research – Your Help is Needed!

Right now, I’m doing some research regarding client-side storage on mobile devices. But for that, I need your help!

Please grab all phones you have and navigate to http://jensarps.de/tests/storage-tests/.

There are four tiny tests there. Please do them all and report your results for each phone. If you like, include your twitter handle so I can say thank you!

Your help is greatly appreciated!! Thanks a ton!!

localStorage Performance Test Results

It’s been some time since I last updated this blog, mostly because there’s plenty going on these days. However, there’s something I’ve been wanting to publish for quite some time now: The results of the localStorage performance tests I ran several weeks ago. As I am currently working on performance tests for Mozilla’s IndexedDB implementation, which is available in latest Minefield releases, I got reminded that there are still other results to publish – so, here we go:

read more »

Encrypted client-side storage with dojo

A couple of days ago, Nicholas Zakas wrote an article about secure client side storage. I think the scenario he mentioned (working from a cyber cafe) is not unsafe by nature, and could be well handled by an application. Nonetheless, client side storage such as localStorage still is subject to DNS spoofing attacks (which is the main security issue, I think). To handle this, one needs to encrypt the keys and values in the store.

So here you go: dojox.storage.encrypted, a Blowfish encrypted storage. It sits on top of dojox.storage, and you get all the dojo storage manager goodness, mainly the automatic selection of the best storage provider available. It exposes the complete API that dojox.storage does. If an attacker gains access to the storage area, he can still nuke the storage, but the data found within will be useless.
read more »

Promises with dojo – a lightweight alternative to dojo.Deferred

Update: Micheil Smith had a cool idea to improve this and posted it in the comments. I have updated the test page and the code examples to reflect his idea. Thanks Micheil!

Update II: Ben Hockey proposed to do the whole thing without using the pub/sub system. I for one think its a good idea, but in case you want the topic version, I’ll leave the test page and add another one with the topic-less version. Thanks Ben!

Update III: Dojo 1.5 introduces robust Promises with dojo.deferred as Krys Zyp explains in this SitePen post.

One of the things/ideas/concepts that I really like about CommonJS is Promises.

Promises? A brief explanation from the CommonJS API:

Promises provide a well-defined interface for interacting with an object that represents the result of an action that is performed asynchronously, and may or may not be finished at any given point in time.

To hear more about Promises, I highly recommend these two posts.
read more »

Working with the Curve – Advanced Animation with Dojo

If you use animations, you probably use them to animate CSS properties. But this post is about some real bareknuckle animation – using the dojo toolkit. We’ll have a look into dojo.Animation and talk about the curve, the line, easing and rate, and we’ll check out (the somehow undocumented) dojox.fx._core – and see how to work with multidimensional lines.

read more »

persistent local storage with dojo

Last year, Brian Leroux‘s Lawnchair caught my interest – it is an easy and fast way to access local persistant local storage.

Uh, persistant local storage?

Ahm, yeah, in case you don’t know, that means a client-side storage, be it in a browser, or in an Air app. It’s not very popular, but that concept has been around for a long time. So why local? There are two major reasons for it: First, we need this for apps and tools that work offline – and apps and tools that work online but need an offline backup and sync later. Kris Zyp wrote a post about the JsonRestStore and OfflineRest back in 2008, he goes a little into detail there. Secondly, we need it for apps and tools that rely on persistence for other reasons, no matter if online or offline – like it happended to me. When I ran into Lawnchair, I had the idea to build a tool that was monitoring CSS selector usage on websites and apps (you know how you sometimes lose control about CSS selectors in webapps…). To achieve this, I needed to store data locally, and persistent.
read more »

More fun with strings: dojo.string.contains()

In the series “convenience wrappers for small tasks that increase code readability”, today contains() is starring. Having a contains() method could also serve another purpose: to maybe prevent people from using match() to find out if a string contains a given substring (what is still proposed in some JS tutorials out there…). So, I want the contains() method to also have a switch to work case-insensitive.

Besides indexOf(), there are some other ways to achieve this, so – let’s have a competition and find out who’s the fastest!
read more »