WebOSDev - Programming has just evolved

The online blog for the webOS developer community you can find everything you need here to get a strong start developing applications for the webOS platform

User agents must consider statements that use the BEGIN, COMMIT, and ROLLBACK SQL features as being unsupported (and thus will mark them as bogus), so as to not let these statements interfere with the explicit transactions managed by the database API itself.

Activating one app menu for all the scenes

Posted by codesos Tuesday, November 3, 2009 0 comments

Want to define one app menu , Handle it once but acrivate it from all scenes?

Here is the way

1. Define the  menue modal and att as globals in the stage scene

glob = {};


glob.MenuAttr = {omitDefaultItems: true};



glob.appMenuModel = {

               visible: true,

               items: [

                           Mojo.Menu.editItem, //must


                            {label: $L("Preferences..."), command: "do-Prefs"},

                            {label: $L("Help"), command: "do-about"}


                          ]

                    };

define the handle command in the same stage scene :

StageAssistant.prototype.handleCommand = function(event)
{
                      var currentScene = Mojo.Controller.stageController.activeScene();

                      if (event.type == Mojo.Event.commandEnable) {

                                  if ((event.command == "do-Update")) {

                                            event.preventDefault();
                                   }

                       }

else {

           if(event.type == Mojo.Event.command) {

               switch(event.command) {

                     case "do-about":

                         Mojo.Controller.stageController.pushScene('support');

                     break;

                     case "do-Prefs":

                          Mojo.Log.info("do-Prefs");

                         Mojo.Controller.stageController.pushScene("preferences");

                     break;

                  case "do-Update":

                  break;

           }

     }

}
}

now in every scene's setup function do this:

this.controller.setupWidget(Mojo.Menu.appMenu, glob.MenuAttr, glob.appMenuModel);


Done!!

How to capture click on itemTemplate on FilterList

Posted by codesos Thursday, October 15, 2009 0 comments

Here are some tips regurding capturing "tap" events on itemTemplate on FilterList.

1. Define HTML Mojo object

<div x-mojo-element="FilterList" class="filterlistClass" id="filterlistID" x-mojo-focus-highlight="true"></div>

2. Difine the "filterlistID" in the .js file.

var attributes =
{
itemTemplate: 'food-filter-list/entry',
swipeToDelete: bSwipeToDelete,
reorderable: false,
filterFunction: this.list.bind(this),
formatters:{Food_Item:this.formatName.bind(this),Points:this.formatNumber.bind(this)},
delay: 500, //1 second delay before filter string is used
disabledProperty: 'disabled'
};
this.model = {
disabled: false
};


this.controller.setupWidget('filterlistID', attributes, this.model);
this.tapped = this.tapped.bindAsEventListener(this);
Mojo.Event.listen(this.controller.get('filterlistID'), Mojo.Event.listTap, this.tapped);


3. Int the entry.html file defined for the itemTemplate define


<div class="palm-row" x-mojo-tap-highlight="momentary">
<div class="palm-row-wrapper">
<table width="100%">
<tr>
<td width="90%"><div class="title"><font face="Comic Sans MS, Arial, Impact" size="3">
#{Food_Item} has the value of #{Points} DC Points
</font></div></td>
<td width="10%">
<div class="palm-button InfoBtnCL" id="InfoBtnID"></div>
</td>
</tr>
  <tr>
<div id='AdditionalInfoID'>
</div>
</tr>
</table>
</div>
</div>
</div>


now we want to capture the click event of the InfoBtnID button right?

4. in the .js file tapped function
FoodFilterListAssistant.prototype.tapped = function(event)
{
       Mojo.Log.info("*************** Tapped " + event.originalEvent.target.id );
if(event.originalEvent.target.alt!=undefined &&  event.originalEvent.target. id == "InfoBtnID")
{
//code for clicking on the InfoBtnID button
}
else
{
              //code for tapping the list item
        }
}

The FloatPicker

Posted by codesos 13 comments

Ever thought about why the mojo SDK doesn't contain a  floatPicker?
So did I.
With a little code changes and some thought  i present to you:


Usage:

HTML :

<div id="FloatPickerID" x-mojo-element="FloatPicker"></div>

JS :

****.prototype.setup = function() {
    attributes = {
            label:    'Float', // the label next to the control
            min: 0, // minimum value
            max: 10, // maximum value
            modelProperty:    'value',
                Interval:0.1 //the "jumps" of the value , use integers to display as integerPicker
            };
        this.model = {
            value : 0.1, // current value
                      disabled : false // use this to set enable/disable of the control
        }
        this.controller.setupWidget('FloatPickerID', attributes, this.model);
}

This FloatPicker is a subclass of IntegerPicker so it uses the same attributes and model , with the addition of  Interval attribute which determain the value "jumps" of the control.

to change the control's enable disable state use:

this.pickerModelNewPoints.disabled = true; // or false


this.controller.modelChanged(this.model);

Enjoy