I’ve been trying out a smaller JavaScript framework built exclusively for making web apps for mobile use names iWebkit. iWebkit makes it very easy for programmers to build a website that very closely resembles an iPhone App.

After using it for a few days I found myself wanting more functionality from it. Actually, if only two extra features were added to it I would love it so much more.

  • I need a black bottom navigation bar. A lot of iPhone apps use the area for main navigation. Apple’s native IPod app for example uses this area to navigate to
  • The other would be a currency input field. For example the input field starts off with 0.00 and when the user focuses on the input and starts entering in 1,2,3, the input would display, 0.01, 0.12, 1.23. I spoke with the developer via their forum and he confirmed that the functionality does not exist. So I took this on myself.

Since the black navigation bar would be a little more involved, I decided to add the currency input functionality myself. After all, I don’t have that much free time for fun little projects like this.

Below is the JavaScript function that I am calling for a currency input. I put it together pretty quickly so if anyone can think of anything to add to it to make it more complete, it would be greatly appreciated. I am using this code right now live and it appears to be working well.


//
// convertToFloat -
//
// param obj - This it the input box object
// param event - This is the keyboard input allowing us to detect what key was pressed based on the ascii code
// param decimal - The precision of decimal places I am rounding too
//
function convertToFloat(obj, event, decimal) {

var value = obj.value.replace(/[^0-9.]/g,'');
var ascii = event.which;
var convertedNum = parseFloat(value);

if (ascii == 8) { //backspace

if (value == 0) {
convertedNum = 0;
} else {
convertedNum = value/10;
}
// ascii codes between 48 and 57 are numbers
//don't react to other keyboard inputs
} else if (ascii >= 48 && ascii <= 57 && value < 1000000) {
convertedNum = value*10;
}

obj.value = convertedNum.toFixed(decimal);
return;
}