Monthly Archives: January 2013

Firefox OS Gets Real with Developer Preview Devices Released Today

Mozilla has been working hard on Firefox OS, their mobile operating system using web technologies as the primary application platform.  Today they have announced that developer preview devices will be available soon.  Billed as the Geeksphone, these devices actually look pretty good specs wise, including a Snapdragon processor, an 8 MB camera, and a 4.3” screen for the Peak model and slightly lower specs for the Keon model.

What is interesting about Firefox OS is that every app is a web app.  The homescreen is basically a really advanced list of bookmarks.  This means that right out of the gate, right now in fact before it has even shipped, there are already millions of apps available for Firefox OS based smartphones.  Of course, once it is released, developers will be able to take advantage of some of the more advanced APIs that Firefox OS enables installed applications to use.  Things like access to contacts, camera, notifications, in app purchase, etc.

That’s why Mozilla is pushing out these developer preview devices – so developers can get started building apps for the platform with real devices in their hands.  The operating system itself is a showcase for the kinds of apps that can be built using web technology – every one of them is built using HTML, CSS, and JavaScript (plus a few additional APIs Mozilla invented for the OS).

If you’re interested in developing apps for Firefox OS yourself, you should check out their getting started guide, install the Firefox OS simulator on your desktop, install it on your own hardware, or purchase one of the new developer preview devices released today.  Also be sure to check out the long list of awesome WebAPIs Mozilla has been adding to the web platform to make this possible.

Congrats to everyone at Mozilla that made this happen.  I’ll be interested to see where this goes and to see if the web can make a comeback on mobile!

via Badass JavaScript http://badassjs.com/post/41209335596/firefox-os-gets-real-with-developer-preview-devices

OMGIF Animated GIF Encoder, MEGA’s JavaScript Encryption, LaTeX in JavaScript and more!

OMGIF! An Animated GIF Encoder in JavaScript

Dean McNamee wrote an animated GIF encoder in JavaScript, working anywhere JS runs including the browser and Node.js.  You can add multiple frames and encode your GIFs right in the browser. Woo!

MEGA’s JavaScript Encryption

You may or may not have heard that Kim Dotcom’s new file hosting site MEGA (née Megaupload) has launched over the weekend.  They are claiming that it uses a lot of new HTML 5 features (and suggest you use Chrome with the site), and also support widely touted encryption support.  I had a look through the JavaScript source code to see what was up and it turns out they really are using a lot of cutting edge stuff.

First, I noticed that all of the encryption is being done client side, in JavaScript before uploading and after downloading the files from the service over XHR.  There has been some discussion about how secure the service really is, but it is interesting to see cutting edge JavaScript used on such a high profile site.  The encryption algorithms are all implemented using JavaScript, and they attempt to capture entropy using your keyboard and mouse movements while you’re on the site.  It doesn’t use the Polycrypt library that I posted about a few days ago, but once browsers implement the WebCrypto API, I’m sure MEGA will be one of the first major sites to adopt it.

As for other HTML 5 features, they’re using the Filesystem API (only available in Chrome ATM) for local file caching during uploads and downloads, as well as the drag and drop API, the FileReader and writer APIs, and more.  Check out the source code and the site for yourself over at mega.co.nz.

LaTex In JavaScript

As I mentioned on Twitter over the weekend, the popular LaTeX typesetting program has been compiled to JavaScript with Emscripten.  Texlive.js takes a LaTeX file as input, compiles it, and then generates a PDF document.  Because it uses really large data URLs, it actually crashed Safari, so check it out in Chrome which seemed to have no problems for me.  It uses WebWorkers to do the compilation and generation in the background.

When you hit the compile button, it actually downloads all of the fonts and other resources that it needs from the server so it might take a little bit of time depending on your connection.  It actually downloads the LaTeX source code for each of the packages being used (the code that actually generates the PDF, reads in the font files, etc.) and compiles those packages to JavaScript on the fly, before actually running them to generate the output document.  This means that you could use any LaTeX program on the fly, without first compiling it with Emscripten: only the LaTeX compiler/interpreter itself needs to be compiled with Emscripten.  I’m a little fuzzy on the details, so if I got anything wrong  or missed anything major please let me know in the comments!

More

Ariya Hidayat, who wrote the impressive Esprima JavaScript parser in JavaScript, has blogged about a JavaScript Code Complexity Visualization which generates really pretty graphs showing the complexity of your JavaScript code.  It uses JSComplexity (which uses the Esprima parser) to do the heavy lifting and Plato to do the visualization with Raphael.  You can see an example output report for jQuery here and more linked from the Github page.

Marijn Haverbeke has blogged about an error resilient JavaScript parser/static analysis tool that he’s working on to help enhance a JavaScript code editor with better errors, autocomplete, etc.  It’s an interesting read, so check it out!

via Badass JavaScript http://badassjs.com/post/41122636865/omgif-animated-gif-encoder-megas-javascript