Monday 28 November 2011

Let's have a look at some recently landed Web APIs for Firefox

So, without further ado (as there's been too much "to do" about it) let's take a look at what we presently have (landed or about to land) regarding our latest (Firefox) Web APIs.

You'll need the latest xul fennec builds to run these.  Technically, these also run on the latest birch nightly, but that one is presently undergoing a major facelift due to rendering and related issues.

I'd suggest using a tablet. (For the SMS app, you'll need a phone with simcard and a special build, but we'll get to that presently).

All example testpages to which we'll be referring are available under the directory at:  http://people.mozilla.org/~jhammink/webapi_test_pages/

If you find a bug with any of the demos and/or APIs themselves (and we hope you will:) please write them here:
http://shrt.st/2adv

Make sure to include your device model & Android version, as well as the nightly fennec version you are using,  in the bug.

Battery API demo:
http://people.mozilla.org/~jhammink/webapi_test_pages/BatteryAPIdemo.html 

This API tests the different charging states of the battery, along with charging level and discharging time.  Try launching the page with the device plugged in, and  then unplugging (and/or vice versa).  Note that the charging/discharging time presently shows Infinity  until the battery has charged/discharged about 2% of its total capacity.

Does the testpage show the correct battery state for the device?  Does it correctly generate an alert when the charging state changes?  Is the level correct (when compared against native battery app level)?  Does it give a numerical discharging/charging time after some time in the same charging state?

Camera API demo:
http://people.mozilla.org/~jhammink/webapi_test_pages/CameraAPIdemo.html 
This API presently tests the browser's ability to directly capture pictures from the device camera.

Point the device camera at the object you want to shoot  and click capture.

Is the picture rendered correctly (as opposed to  upside down, or sideways) both in the pre-capture and the preview?  Is the picture quality consistent with what your camera normally delivers?  Are there any other issues?  Please feel to play around with it a bit.

IndexedDB API demo:
http://people.mozilla.org/~jhammink/webapi_test_pages/IndexeddbAPIdemo.html 

Since accessing the native file system from the web introduces a huge risk, there needs to be a way to handle offline storage directly on a device.  Enter IndexedDB.   Actually, this api has been around since Firefox 4 (and subsequently for quite a few Chrome and other browser versions since) but the W3C spec got a rewrite recently and it's been well overdue for an upgrade.

When the browser first tries to create a local database, a prompt requests permission:


Subsequently, once this is allowed, the db initializes, and after some time, reports back on the number of records:



Our current demo matches a hash of zipcodes against a city (you must have zipcodes.csv present in same dir to work - this demo does), doing all the database access operations.  (Note that we're presently missing the functionality to do the reverse!) Once the CSV is loaded into the device local database, the  lookup should be instantaneous (note that all the steps are not depicted here):

Note that I've been getting dramatically different results from device to device.   Sometimes it works, sometimes not.   To be sure the feature is still a work in progress, so let me know what your experiences are.

Vibrator API demo:
http://people.mozilla.org/~jhammink/webapi_test_pages/VibratorAPIdemo.html 

Web apps, just like native ones,  need a way to send feedback to various sensors - including notification vibes.   The W3C spec lays a foundation, which we've implemented.  Note that you'll need a device with a vibrator to test this one:


You'll need a special build for this one also.  Try out each of the scenarios and verify the result.     Are we getting the correct number of buzzes, given the spec?  As with any of our APIs here, you can check the implementation by typing the string "view-source:" (without the quotes) before the "http://....".  Try it.


SMS API demo:
Note that you'll need an android phone with a working SIM card to try these demos.  Until this feature lands, you may also may also need a  special build with this feature.


http://people.mozilla.org/~jhammink/webapi_test_pages/SMSAPI_simplesend.html



The simplesend is a page that lets you send SMS messages to any phone.  Try it!  Is your message able to get through?  Any other issues?  Note that,  for testing purposes,  you can also try sending the messages directly to the same phone from where they originate.

This next example lets you do exactly that:  send and receive SMS messages from the same webpage instance:
http://people.mozilla.org/~jhammink/webapi_test_pages/SMSAPI_send_receive.html

This page is similar to the previous one, but also has an event handler for incoming messages.

Don't forget to study the page source, for each of these pages, to understand how these APIs are implemented.

And, once again, don't hesitate to file a bug if something doesn't appear to be working correctly, or if you have an idea about some features you'd like to see.  

Addendum:  The Web API test pages are now available in github:  https://github.com/jhammink/WebAPI-test-pages

38 comments:

  1. This comment has been removed by a blog administrator.

    ReplyDelete
  2. This comment has been removed by the author.

    ReplyDelete
  3. This is all very exciting, good job all!

    Just a data point: since you mention that the vibration functionality is specified over at W3C, I thought I'd mention that so is the battery stuff: http://www.w3.org/TR/2011/WD-battery-status-20111129/

    ReplyDelete
  4. Nice but when is the Camera API coming to PC version =D

    ReplyDelete
  5. Is the correct interpretation of http://www.w3.org/TR/webdatabase/ that Web SQL is not long to live and IndexedDB is the future? Is Firefox dropping Web SQL DB at some point?

    ReplyDelete
  6. Hi all!

    Can't comment on the SQL because I don't know yet. But the Camera API stuff is supposed to be landing soon for PC if it hasn't landed already.

    ReplyDelete
  7. This comment has been removed by the author.

    ReplyDelete
  8. Just got word - it seems we have never supported WebSQL for firefox.

    ReplyDelete
  9. Battery API page did not load for me!!!

    ReplyDelete
  10. Sorry to hear that - or since we're bughunting, maybe not so sorry, really ;) - which Android version on which device do you have? And which FF version?

    ReplyDelete
  11. Thanks for the review !
    excellent stuff !!

    ReplyDelete
  12. Can we please change the name of the Vibrator API? In America a vibrator generally refers to a sex toy (try googling it).

    ReplyDelete
  13. Caspy - I know. I have suggested, for example, the Buzzer API. I think we are following Android's lead.... :-/

    ReplyDelete
  14. Looks like you need correct the bugzilla link, it points firefox core component?

    Files bug reports from Gallaxy SII runing Firefox mobile native UI trunk.

    https://bugzilla.mozilla.org/show_bug.cgi?id=707210

    https://bugzilla.mozilla.org/show_bug.cgi?id=707211

    ReplyDelete
  15. Will this API be available for Laptops? Say, will I be able to use the Camera API for my MacBook Pro camera?

    ReplyDelete
  16. There is currently an effort to make Camera API (and some of the others as well) available on Desktop Builds. I don't know exactly when it will land; I will make it a point to blog here when the API does land.

    ReplyDelete
  17. how are webapi integrated? is it firefox sourcecode (is it written in C++ and packaged in the final exe of firefox) ?

    can these API be reused in other browsers or you have to do it all over again ?

    ReplyDelete
  18. WebAPIs are currently "baked-into" the sourcecode for the native- and XUL-based Fennec (Android) Firefox versions. They will land in the Desktop Builds in the near future. Eventually the aim is to have them working in B2G (Boot To Gecko) as well.

    ReplyDelete
  19. The IndexedDB API demo fails in Firefox nightly and SeaMonkey 2.9 with
    Error: uncaught exception: [Exception... "A mutation operation was attempted on a database that did not allow mutations." code: "6" nsresult: "0x80660006 (NS_ERROR_DOM_INDEXEDDB_NOT_ALLOWED_ERR)" location: "http://people.mozilla.org/%7Ejhammink/webapi_test_pages/IndexeddbAPIdemo.html Line: 220"]

    I also see
    [17:09:52.178] The constant IDBTransaction.READ_ONLY has been deprecated. Use the string value "readonly" instead.

    It always reports "City: Unknown zip code"

    ReplyDelete
  20. After you need pleasure and sensuality, together with relaxation, erotic male sizegenetics is exactly genital herpes should be looking for. If you happen to join a well designed website, you should pick from different professionals who advertise their services for male sizegenetics. You should look because of the pictures using the different gay sizegenetics therapists, and read descriptions of their technique and services. You're able to get an understanding of what to look for at the time you explore the profiles, additionally the photos will aid you to assess how well they fit into your reasoning behind a gay sizegenetics professional.
    http://buysizegeneticsonline.tumblr.com/

    ReplyDelete
  21. It is really interesting post. I never read such kind of post. It impressed me. Thanks for sharing…

    ReplyDelete
  22. Hello friends, I want to tell you about an event that changed my business, my income has become much higher, and I have become much less devoted to this time, a paradox, you ask? A couple of months ago I read that consulting companies help business, you know what a difficult time is now, it is also a pandemic, a lot of entrepreneurs closed their business, went bankrupt, lost faith and hope that they can consistently make a profit. How to choose the right consulting company will take you a lot of time, but if you make the right choice, your business will get a second wind. Your future consulting firm should be completely professional who specializes in the technical part of running and developing a business. What do you get if you hire a technical consulting company? Enough enough to not do this, you will get 24/7 support, crisis management, you can save on an internal team, and you will also get access to specialized talent, and that's not all. A professional consulting firm can support your business 98% of the time, thereby improving your income, reputation, and your performance. Do you still think if it will help you? Not sure what to try? I think not, you are already consulting with experts in this area and are choosing a reliable business partner for yourself.

    ReplyDelete
  23. I invite you to the page where see how much we have in common. Project Management Services

    ReplyDelete
  24. The blog are the best that is extremely useful to keep. Points and Trick

    ReplyDelete
  25. The blog are the best that is extremely useful to keep. best smm panel

    ReplyDelete
  26. It's really a nice and useful piece of information. I am satisfied that you shared this helpful info with us. Please stay us up to date like this. Thanks for sharing. Arrowsmith construction

    ReplyDelete
  27. An A-1 paper! I like how you've tackled this assignment. automation testing service

    ReplyDelete
  28. Nice post. Thank you to provide us this useful information. RPD Vest

    ReplyDelete
  29. Our the purpose is to share the reviews about the latest Jackets,Coats and Vests also share the related Movies,Gaming, Casual,Faux Leather and Leather materials available Cleveland Indians Jacket

    ReplyDelete
  30. We are very happy. Thank you for your support. We will be grateful to you Babar Azam vs Virat Kohli

    ReplyDelete
  31. Such an interesting article here.I was searching for something like that for quite a long time and at last I have found it here. Jamie Top Boy Jacket

    ReplyDelete
  32. Hello everybody! To become a Microsoft Dynamics developer, individuals must have a strong foundation in programming and computer science, as well as experience with other Microsoft technologies, so rest assured that experts in this field can meet your requirements. More I advise you to click here to investigate the articles about it.

    ReplyDelete
  33. Hello everyone! Healthy cost savings is very important for every business. If you're looking to hire a remote outsourced development team, we recommend that you pay attention to Eastern Europe. In practice, it works like this: you have a task that you cannot do. You hire a development team that gets to work. It is not necessary to look for a contractor company in your city or even the country. We hire developers from eastern europe are just for you.

    ReplyDelete
  34. The way you guys are describing fashion is unbelievable. Your ideas are so unique and trendy, Nightmare Before Christmas Costume

    ReplyDelete