Henry Minsky (hqm@ai.mit.edu)
Beartronics J2ME Top : PicoBrowser Notes
The PicoBrowser is designed to run in small devices such as mobile phones, internet appliances, and dedicated embedded servers. It is my opinion that HTML provides an exceptionally simple and powerful user interface to a wide range of services and applications. Design of applications for embedded devices can be simplified greatly by using key parts of the WWW technology that has been developed for full size computers and workstations.
The PicoBrowser currently supports a simplified subset of HTML known as compactHTML, or cHTML. This is a W3C standard which is used by the popular NTT DoCoMo i-mode mobile internet service in Japan. A listing of supported tags is here.
The browser could be modified to support WAP's WML (formerly HDML) markup language as well, although I believe that the success of i-mode has demonstrated that there is no technical advantage, and several disadvantages, to using WAP instead of a subset of standard HTML for applications.
Taking that to the next step, as we find more embedded devices which have flat panel or front-panel display interfaces, we ought to expect that they will contain web clients, i.e., browsers, which may talk to a web server within the same device, or to web servers on other devices.
For an opinion about why browser interfaces are good, see my flame at ua.com (written in 1996!).
I want the ability to do local I/O from the phone to peripherals, like a serial or IR port. Given that ability, you must have the ability to do some local processing of the data in Java, even if the bulk of your app runs on an external web server. This is obviously needed for an industrial embedded device.
Say you build a portable device containing an embedded system which monitors sensors and writes the data to a local flash storage system. You might want to build a GUI to access and monitor the data right on the device, as well as post it up to a master server.
If the device operating system runs the PicoBrowser, you could write the GUI as a servlet-style application which generates HTML pages, and use the PicoBrowser to provide the GUI to view and interact with these pages. I believe that writing the UI for applications this way is less costly, and more flexible for the user, who will see a consistent browser UI, instead of a new fully custom user interface.
A: Well, actually, most of the browsers I have seen in mobile phones in Japan have serious shortcomings. Considering that they presumably are written in C or some other low-level language, the performance is astonishingly bad in many cases. Scrolling or redisplay of a page is agonizingly slow, and the browser can be made to crawl to a halt or crash on modestly complex forms in some cases.
But the motivation here is not to duplicate existing mobile phone browser functionality. The motivation for this projects was that the new DoCoMo Java 503i phones have no integration between their built-in microbrowser and their Java engine. You can run dedicated applets in Java, or use the phone's browser, but never both at the same time. Thus you cannot extend the GUI capabilities of the existing HTML browser using Java. The real goal is to have an easily customized, high-performance integrated browser which can be used as the basis for creating the GUI for embedded device applications.
 | <center>Welcome to <br> <b>PicoBrowser</b></center> A very small browser and servlet engine! <br> ° <a href="page2.html">Page 2</a><br> ° <a href="page3.html">Page 3</a><br> ° <a href="local://servlet?n2=0&n=1">A Servlet</a><br> ° <a href="http://202.221.249.3/">Tokyo-Q</a><br> <img src="p32.gif"><br> (C) Beartronics Inc. 2001 <br> Henry Minsky <br> beartronics.weblogger.com |
| Homepage | |
 |
<b>This is Page 2</b> Colored Text:<br> <font color="#ff0000"></font><br> <img src="resource:///pics/j1.gif"><font color="#00ff00">Green TEXT</font><br> <img src="resource:///pics/j2.gif"><font color="#0000ff">Blue TEXT</font><br> <img src="resource:///pics/j3.gif"><font color="#ff00ff">Purple TEXT</font><p> Supports inline images and <a href="index.html">hyperlinks</a> <br>Some more text and other things: GHI<br> XXX YYY<br> BOO BEAR<br> Spoo Bear<br> JKLMN<br> <img src="resource:///pics/j0.gif"> <img src="resource:///pics/j1.gif"> <br> <img src="resource:///pics/j2.gif"> <img src="resource:///pics/j3.gif"> <img src="resource:///pics/j4.gif"> <img src="resource:///pics/j5.gif"> <img src="resource:///pics/j6.gif"> <img src="resource:///pics/j7.gif"> <img src="resource:///pics/j8.gif"> <img src="resource:///pics/j9.gif"> <img src="resource:///pics/j10.gif"> <img src="resource:///pics/j11.gif"> <img src="resource:///pics/j12.gif"> Say hello to Pookie Bear! <br> Another name for <a href="resource:///index.html">MIDP</a> applications is MIDlets.<p> Like applets, <a href="resource:///index.html">MIDlets</a> are controlled by the software that runs them.<br> In the case of an applet, the underlying software is a browser or the appletviewer tool.<p> In the case of a MIDlet, the underlying software is the cell phone or two-way pager device implementation that supports the CLDC and MIDP. <a href="resource:///index.html">Home</a> |
| Page 2 (shows FONT color, inline images, hyperlinks) | |
 |
<center>PicoBrowser <br>hqm@ai.mit.edu <p> <img src="p32.gif"><br> </center> Say Hello to<br> Pookie Bear. <p> Pookie is the official mascot of the PicoBrowser application. <br> <a href="index.html">Home</a> |
| Page 3 (shows inline images) |
 |
String handleServlet(String url) {
if (url.startsWith("servlet")) {
Hashtable params = getQueryParams(url);
int n = Integer.parseInt((String)params.get("n"));
int n2 = Integer.parseInt((String)params.get("n2"));
return "This is a servlet running on the phone!<br>n = " + n
+ "<br><a href=\"local://servlet?n2="+n+"&n="+(n+n2)+"\">Fibonacci</a>"
+ "<p><a href=\"resource:///index.html\"><img src=\"resource:///p32.gif\">"
+ "Home</a>";
} else {
return "Undefined servlet "+url;
}
}
|
| Servlet which computes Fibonacci | |
 |
| Viewing a real iMode site via HTTP |
 |
| The Panel UI for entering a URL. Use the '2' key to bring up this dialog. |
   |
This is a custom "scrolling map overlay" html widget that
is implemented in the PicoBrowser. The SMAP tag
displays this special type of graphic.
<b>Dynamic Maplet</b> <smap src="server:maps/map.gif"> <font color="#ff0000"></font><br> <img src="resource:///pics/j1.gif"><font color="#00ff00">Green TEXT</font><br> <img src="resource:///pics/j2.gif"><font color="#0000ff">Blue TEXT</font><br> <img src="resource:///pics/j1.gif"><font color="#ff00ff">Purple TEXT</font><br> This is a scrollable map which is overlaid with HTML content. Use the 4,5,6 and 8 keys to scroll the map.The SMAP tag will retrieve an image from the server, like a normal IMG tag, but places it "under" the displayed text on the page, and makes it independently scrollabe. So for example, a map can be displayed and on top of it, HTML text and graphics information can be displayed, such as a map legend. The background map image can be scrolled independently of the HTML text using the 4,5,6 and 8 keys, and the display of the text and map can be toggled using the '7' key. |
