WebOSDev - Programming has just evolved

How to Make SwipeToDelete Dynamic

Posted by codesos Saturday, April 3, 2010 0 comments

You have to declare in th attributes of the list swipeToDelete: true to allow the list to delete items , but add this preventDeleteProperty:'noDelete' also if you want the list to be able to determine which items can be deleted or not.

so for example:

var attributes =
{
    itemTemplate: 'food-filter-list/entry',
    swipeToDelete: true,
    preventDeleteProperty:'noDelete',
    reorderable: false,
    filterFunction: this.FilterList.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.filterlist = this.controller.get('filterlistID');

the default implementation allows delete of all the items.

Now if you want to allow an item not to be deleted :

entry = {Food_Item: $L(row.Portion + ConnectionWord + row.Food_Item), Points: row.Points,ItemObj:row,'noDelete':true};

this.FoodList[i] = entry;

this way you can dynamically determine which item can be deleted or not

cool , no?

Full Story

Using scrollable log text box

Posted by codesos Sunday, February 21, 2010 0 comments

Want scrollable log trace or text edit? here's how:

HTML:

<div class="palm-group unlabeled" id="scrollID" x-mojo-element="Scroller">
<div id="scrolling_contents">
</div>
</div>

JS:

SETUP

this.modesModel = {scrollbars: true, mode: "vertical"},
    this.controller.setupWidget('scrollID', {}, this.modesModel);
    this.scroller = this.controller.get('scrollID');
    this.scrollStarting = this.scrollStarting.bind(this);
    this.controller.listen(this.scroller, Mojo.Event.scrollStarting, this.scrollStarting);

MyAssistant.prototype.scrollStarting = function(event) {
        event.scroller.addListener(this);
        Mojo.Log.info(new Date(), "scroll starting");
    }

MyAssistant.prototype.AddLog= function(str,bClear)
{

   if(bClear==undefined){
        if(this.controller.get('scrolling_contents').innerHTML.length>0)
            this.controller.get('scrolling_contents').innerHTML+="<br />";
        this.controller.get('scrolling_contents').innerHTML+=str;
    }
    else if(bClear==true)
    {
        this.controller.get('scrolling_contents').innerHTML=str;
    }

}

Magic , Isn't it?

Full Story

AdMob.com integration

Posted by codesos 0 comments

Want to add professional advertisements to your palm pre applicatio?

It's as simple as 1,2,3

1 . go to http://code.google.com/p/admob-webos/

download admob.js and place it in your application

2. HTML File:

<div id="admob_ad"></div>

Initialize:

    AdMob.ad.initialize({
                      pub_id: '*********', // your publisher id get it from admob.com
                      bg_color: '#ccc', // optional background color, defaults to #fff
                      text_color: '#333'
                      });

and for each time you want to display ad:

AdMob.ad.request({
                        onSuccess: (function (ad)
                        {
                        Mojo.Log.info("**************** AdMob OK ");
                           // successful ad call, parameter 'ad' is the html markup for the ad
                            this.controller.get('admob_ad').insert(ad); // place mark up in the the previously declared div
                               }).bind(this),
                      onFailure: (function ()
                    { // no ad was returned or call was unsuccessful
                        Mojo.Log.info("**************** AdMob ERROr ");
                       }).bind(this),
             });

That is all , Now start earning Money!!

Full Story

Integrate with Flot Graph system using Webos

Posted by codesos Tuesday, January 12, 2010 0 comments

Want to be able to produce HI END graphs like this?:

It's very simple:

1. go to http://code.google.com/p/flot/ and download the package.

2. Extract it and add it to your project(just add the entire folder)

3. Add to the sources.json the relevant source you are going to use

(I.E {"source": "javascript/flot/jquery.js"},{"source": "javascript/flot/jquery.flot.js"}

4. Add new Scene or use exsiting one

5. In the HTML add the tag:

6. In the source file you can use this div:

var d1 = [];

for (var i = 0; i < 14; i += 0.5)
d1.push([i, Math.sin(i)]);
var d2 = [[0, 3], [4, 8], [8, 5], [9, 13]];
// a null signifies separate line segments
var d3 = [[0, 12], [7, 12], null, [7, 2.5], [12, 2.5]];
$.plot($("#placeholder"), [ d1, d2, d3 ],{ grid: { color: "#100" } });

Thats all!!

Full Story

WebOSDev - Programming has just evolved