Playing with JavaScript, My Language of 2009

December 31st, 2009

JavaScript has been around since 1995 but only since Web 2.0 techniques it has become a mainstream language to all developers. No matter if you are a mobile, server side or desktop developer you probably have touched some JavaScript in your career. Even latest operating systems like Palm WebOS and Google Chrome OS are using JavaScript as “native” programming language.

My first experiences ten years ago with JavaScript were limited only to simple functions like page refreshing or trivial actions when user pressed link or button. In the recent years I’ve been using more advanced features of JavaScript like AJAX. Modern JavaScript frameworks like jQuery have really boosted up the productivity on the UI development.

As a developer you might have read a good advice from Pragmatic Programmer to learn a new language each year. I might say that JavaScript could be my language for 2009 even though I’ve been writing JavaScript nearly a decade.

Othello Game

Game of Othello

As a last JavaScript exercise of 2009 I crafted a small game of Othello by using only JavaScript and small chunks of HTML and CSS. It includes a decent AI opponent which uses minmax algorithm to find a good move. You can find the game here. Let me know if the computer AI can beat you :)

It was a great year of 2009. Looking forward on the new gadgets and technologies of 2010!

Babel Fish for Twitter – New Twim Release

November 2nd, 2009

Google Translator is a great translator tool which has a very simple AJAX API that can be easily used from mobile apps. Compared to other translator tools it has one feature which other services don’t have, the auto detection of language.

The API is really easy to use. All you need to do is to pass three parameters to the API call:

  1. Version, v=1.0
  2. Translated text, q=Hei maailma!
  3. Language pair (if source is empty then language is automatically identified), langpair=|en

In the end you end up with the following URL:

http://ajax.googleapis.com/ajax/services/language/translate?v=1.0&langpair=|en&q=Hei+maailma!

And if you click the link you’ll see that it returns the translated text in JSON format which is pretty easy to parse.

{ "responseData": {
"translatedText":"Hello world!",
"detectedSourceLanguage":"fi" },
"responseDetails": null,
"responseStatus": 200}

This made it pretty easy to integrate the API call to Twim. So now in Twim 1.6 you can select a tweet from status list and select “Translate to English” from status menu and Twim will display the translation to you in seconds. Pretty handy if you are following people from other countries in Twitter. Go ahead and download the latest Twim to your mobile phone from here.

…and by the way, new feature also has the “paging” feature for home screen and search results as a bonus! Happy Twittering!

Posted using Mobypicture.com

LWUIT 1.1 for Java ME Developers

October 18th, 2009

One of the problems with Java ME applications containing more advanced UI components have been that it is really painful to have it rendered consistently across different platforms and devices. I’ve used to implement my own set of practices on displaying lists of tweets in Twim or todo lists in Mobile Task Manager. Now I came across a nice looking UI library for Java ME called LWUIT.

Posted using Mobypicture.com

LWUIT supports such nice things like theming, transitions and animation. It also includes new UI components like TabbedPane and Dialogs.

I just got a new book to review, LWUIT 1.1 for Java ME Developers, written by Biswajit Sarkar. If you think that LWUIT could scratch your itch then I’d recommend on having this book on your desk as it works pretty nicely as a reference as well as good introduction to the whole library.

Book contains lots of emulator screenshots which help to understand the concepts very well. This combined with lots of sample code makes it really easy to learn all features of LWUIT library. Only one oddity is that it’s referencing to Sprint SDK where it could as well be the Sun’s original WTK but that doesn’t really have any affect on code samples.

Book’s first chapter is a good introduction to the library. The following chapters explain the default components and then there is one chapter on how to create a custom component. Last chapters dig into resources, LWUIT designer, themes, animations and transitions, painters, effects and logging. The index is also very complete which makes the book work well as a good resource in the bookshelf even after the first reading.

Check out the publisher site for more information about the book.

New Release, Mobile Task Manager v1.3

October 13th, 2009

I just uploaded the latest binaries (JAR and JAD) of Mobile Task Manager to Google Code download page. The previous version (v1.2) was already downloaded over 1700 times in less then a month so there seems to be a need for a good GTD / Task Manager application :)

This version fixes the issues with the export and import. Now you can export data to CSV file correctly and you can import that file either to root folder or to the folder that is currently selected.

This version also improves the startup time significantly. Application is ready to use in about three seconds after the launch on my Nokia E71.

Have fun while Getting Things Done with the Mobile Task Manager! :)

Mobile Task Manager Video

September 29th, 2009

Pali Madra from E71 by Nokia blog created a very nice video of Mobile Task Manager running on Nokia E71. Check out the full review that he wrote on his blog, here.

Getting even more things done

September 19th, 2009

When I crafted the Mobile Task Manager application this summer I didn’t expect it to have that good response in community. It was even mentioned in many blogs like Nokia Mobile Talk and even reviewed on one of my favorite Symbian sites, all about symbian.com, by Ewan Spence. Ewan pointed out good ideas how application could be improved to be even better GTD application for mobile phones.

Splash screen Task list

Last week I miraculously had few spare hours here and there and I was able to improve this app a little based on feedback written on the application page and based on Ewan’s review. Today I’m able to release the version 1.2 of the Mobile Task Manager with the following new features:

  • You can prioritize todo items (none, low, normal, high)
  • Priority shown as flags (none, green, yellow, red)
  • Priority can be changed from item view (left/right key)
  • …or straight from item list with ‘0′ shortcut key
  • You can sort items by name, done-status or priority
  • Import items from text file or CSV file
  • FIX: pressing ‘3′ causes the item below the one highlighted to open up for editing
  • FIX: “Delete selected” will not delete the last entry on a folder
  • FIX: pressing ‘9′ does not work for quick note editing

Unfortunately I had to rename the JAR file in this release as it previously contained the version number so you can’t update your existing instance. From now on I’m keeping the same name (MobileGtd.jar) so future releases are going to update the existing installation. You can download the binaries (JAR/JAD files) from here.

Mobile Task Manager is still open source so if you like to check out the code you can do so in here.

Twim 1.15 with Auto-Refresh and TwitrPix Support

August 22nd, 2009

Just finished testing the latest version of Twim, v1.15. Now you can also send your photos to new TwitrPix service.

twitrpix_logo_v2

I also added few options that you can configure via settings view. You can set Twim to automatically load the home screen tweets when application is started and you can also turn on the auto-refresh option that will automatically load new tweets in every 5 minutes. If new tweets are found then phone vibrates and plays a small beep sound. With this feature you won’t miss a single tweet again :)

New settings view

New settings view

Full release notes:

  • TwitrPix support
  • Cancel option to media menu
  • Initial auto-refresh option with alarming of new tweets
  • Option to automatically load tweets on startup
  • Tab names changed: “Recent”>”Home”, “Friends”>”Following”
  • Fix for non-latin characters when posting photos (thanks Lexa!)

Have fun with the new Twim and download it from here. If you like the source code you can see that in here. Twim is still free as a free beer.

In case you didn’t know: Twim is a mobile Twitter client. I’m twittering with username @tlaukkanen.

Coding Touchscreen Scrolling in Java ME

July 29th, 2009

Here’s the trick how you can add touchscreen scrolling to your J2ME applications. The key to touchscreen support is the Canvas class and its’ methods pointerPressed, pointerDragged and pointerReleased. These events are called when user puts finger on the screen (pressed) and drags the finger (dragged) and finally when removes the finger (released). Each method has the x and y coordinates for the pointer action.

The scrolling is implemented with the pointerDragged event. We store the current location of the canvas to variables verticalLoc and horizontalLoc. When finger (pointer) is dragged then location is changed according to the dragged amount. Variables are used on paint method to draw the area so that it is scrolled that correctly. You can also see from the sample code how you can draw background with repeatable pattern image.

  1. public class ScrollingCanvas extends Canvas {
  2.  
  3.  // Current location
  4.  private int verticalLoc, horizontalLoc;
  5.  // Last pointer (finger) location
  6.  private int lastX, lastY;
  7.  // Background image size
  8.  private static final int IMAGE_WIDTH = 183;
  9.  private static final int IMAGE_HEIGHT = 183;
  10.  
  11.  public ScrollingCanvas() {
  12.    verticalLoc = 0;
  13.    horizontalLoc = 0;
  14.    setFullScreenMode(true);
  15.  }
  16.  
  17.  protected void paint(Graphics g) {
  18.  
  19.    // Draw background with pattern image
  20.    int x = horizontalLoc % IMAGE_WIDTH;
  21.    if(x>0) {
  22.      x -= IMAGE_WIDTH;
  23.    }
  24.    int origX = x;
  25.  
  26.    int y = verticalLoc % IMAGE_HEIGHT;
  27.    if(y>0) {
  28.      y -= IMAGE_HEIGHT;
  29.    }
  30.  
  31.    boolean verticalDone = false;
  32.    while(!verticalDone) {
  33.      boolean horizontalDone = false;
  34.      while(!horizontalDone) {
  35.        g.drawImage(
  36.          ImageRepository.getBackground(),
  37.          x, y, Graphics.LEFT|Graphics.TOP);
  38.        x += IMAGE_WIDTH;
  39.        if(x>getWidth()) {
  40.          horizontalDone = true;
  41.        }
  42.      }
  43.      x = origX;
  44.      y += IMAGE_HEIGHT;
  45.      if(y>getHeight()) {
  46.        verticalDone = true;
  47.      }
  48.    }
  49.  }
  50.  
  51.  /**
  52.  * Finger is pressed on screen
  53.  * @param x coordinate
  54.  * @param y coordinate
  55.  */
  56.  protected void pointerPressed(int x, int y) {
  57.    lastX = x;
  58.    lastY = y;
  59.  }
  60.  
  61.  /**
  62.  * Finger is dragged on screen
  63.  * @param x coordinate
  64.  * @param y coordinate
  65.  */
  66.  protected void pointerDragged(int x, int y) {
  67.    // Calculate how much we moved horizontally
  68.    int deltaHorizontal = lastX – x;
  69.    horizontalLoc -= deltaHorizontal;
  70.    lastX = x;
  71.  
  72.    // Calculate how much we moved vertically
  73.    int deltaVertical = lastY – y;
  74.    verticalLoc -= deltaVertical;
  75.    lastY = y;
  76.  
  77.    // Repaint the screen since we have scrolled
  78.    repaint();
  79.  }
  80.  
  81. }

Here is a video of running this demonstration app in Nokia N97 SDK emulator:

Twim with Touchscreen Support

July 27th, 2009

Here is the new version of Twim, the mobile Twitter client, now with experimental touchscreen support. I don’t own a real touchscreen phone (yet) so I had to test touchscreen functionality with emulators like Nokia N97 SDK (v1.0) and Microemulator. There were also few good people in Twitter that tested the beta version with N97 and Nokia 5800.

New 1.14 also includes other new features like Search, Twitvid, and Follow/Unfollow support. There are also minor improvements like now you will only have to answer to less security popups when uploading files since now it is only using READ mode instead of READ/WRITE that popped up tons of popups on my E71.

Go ahead and download the latest binaries from here and start Twittering! Let me know how the touchscreen support feels like on a real device since I can’t test it myself :)

Twim v1.14

Twim v1.14

New search feature in action

Search feature - GIF animation

Getting Things Done – With Mobile App

July 11th, 2009
Splash Screen

Splash screen of the new GTD application.

I like to get things done. For years I’ve followed my own action management methods but recently I’m leaning towards the David Allen’s GTD method which he describes in his book Gettings Things Done: The Art of Stress-Free Productivity. I have used many tools to store the actions like traditional pen and paper and several desktop apps, like MiniTask and Evernote. I haven’t found any decent (and simple) mobile apps to do the same. I have used the Groceries app for this purpose but it was lacking in some areas of usability. This was the reason I created the Mobile Task Manager application.

I got good feature ideas from Jorge Ledesma who is a blogger at NokiaMobileTalk.com. The current set of features include:

  • Create actions
  • Edit actions (with 3 key)
  • Mark action as done (with fire key)
  • Purge done items
  • Create folders
  • You can add notes to actions (with 9 key)
  • You can rearrange the actions (with left/right keys)
  • Mark action as favorite (with 7 key)
  • Backup actions to CSV file

Check out the software page for additional screenshots and download links.