IBM Worklight 6.1 issues

Tonight I got replied from mr Ed regarding to worklight issues. Luckily I follow up him until he respond my email. Even we not in the same timezone, we are able to communicate to each other. These are a list of issues that we faced past 3 months ago. I also post a several of questions here. Even though the problems not solved 100% but as long I got his feedback, it’s so much better than before.

gmail

gmail

1. Are there any tutorials or references to implement SSO on device?
https://pic.dhe.ibm.com/infocenter/wrklight/v6r1m0/topic/com.ibm.worklight.dev.doc/devref/c_device_single_sign_on.html
https://pic.dhe.ibm.com/infocenter/wrklight/v6r1m0/topic/com.ibm.worklight.dev.doc/devref/t_configuring_device_SSO.html

2. Are there any tutorials or references to integrate sencha framework into worklight?
We have a starter application at http://public.dhe.ibm.com/software/mobile-solutions/worklight/docs/v610/WorklightStarter_Sencha.zip

3. App takes about 30 seconds to launch for the first time on android.
That has been fixed in Worklight 6.1

4. Sometimes why worklight project got this error message, “untracked file differs” after pulling from mercurial?
I don’t know. Seems like a problem with mercurial though.

5. Why worklight wont allow adjustment splash screen duration on iOS and android?
That is a feature we have not yet implemented.

6. Qhich worklight server I need to install? http://www-01.ibm.com/support/docview.wss?uid=swg24035056

If you need the server, search for IBM Worklight 6.1 on Partnerworld Software Access Catalog. Download the entire eAssembly to be sure you get everything you need. You need to install WAS Liberty Profile, the Worklight Server, and DB2 at a minimum.

But if you just want to develop and test, you don’t need a separate server as it is part of Worklight Studio. Follow these directions

http://public.dhe.ibm.com/software/mobile-solutions/worklight/docs/v610/01_01_Setting_up_your_Worklight_development_environment.pdf

I hope this post can help anyone for those using this software.

CRUD operation using jquery mobile on android – Part 2

This is a second part of 2-part tutorial series on CRUD operation using jquery mobile on android. In the first tutorial, you learned how to setup your android environment, create cordova/phonegap project using eclipse and node.js and how to test your app using android simulator without device.

http://blog.revivalx.com/2014/02/21/crud-operation-using-jquery-mobile-on-android-part-1/

In this second part, you will learn how to create a simple web service for your app. Your web service will enable to create, read, update and data using JSON ( Javascript Object Notation) to your database. We will not using SOAP (Simple Object Access Protocol) for this tutorial because JSON is easy to learn and simple compare to SOAP is too complex for beginner. It basically works on HTTP protocol.

URL Structure

In web service design the URL endpoints should be well formed and should be easily understandable. Every URL for a resource should be uniquely identified.

For example

GET – http://localhost:8888/crud_tutorial/product/index

GET – http://localhost:8888/crud_tutorial/product/display?productId=1

POST – http://localhost:8888/crud_tutorial/product/create

POST – http://localhost:8888/crud_tutorial/product/update?productId=1

POST – http://localhost:8888/crud_tutorial/product/delete?productId=1

Why we using JSON for mobile application? Why not we access directly to our database without using JSON instead PHP or JAVA. It is because hybrid mobile app support client side languages, not servers side languages. Hybrid mobile app consists these 3 languages are HTML5, CSS and Javascript. We can’t simply run PHP or JAVA in mobile app. This video will answer these questions.

Getting started.

For this tutorial you need to have basic in PHP and Mysql. You need to have eclipse Helios to complete the project. Compare to previous tutorial we using eclipse Juno. It is because we develop an android app. For eclipse PHP we develop web service using PHP.

First you need to setup a web server in your machine. I’m using MAMP (stands for Mac, Apache, Mysql and Php) for this tutorial. It’s ok if your want to use other than this such as XAMPP or WAMP. No problem with that. But i suggest you using MAMP if you using Mac. There will be a lot of glitches if you using XAMPP or WAMP in your apple machine.

Download MAMP from this site and install to your machine. After finish installed MAMP to your machine, start apache server and mysql server. So far I didn’t get any issues starting my web server compare to XAMPP. If you got problem start up your apache server, make sure you check port 80 because maybe other applications using the same port especially skype. you need to terminate the application before start the apache server. This issue always happened to windows users.

If your apache and mysql server running successful, you will get like this (green light on both server status).

MAMP

MAMP

Then open your chrome browser. Why I’m using chrome rather than other browser because there are a tons of chrome extensions available in chrome marketplace. That’s why i choose to live with it. Type this to open your MAMP start page in your browser.

http://localhost:8888/MAMP/?language=English

Then click phpMyAdmin at top of the bar. You will see this page.

phpmyadmin

phpmyadmin

You need to create a database and a table for this tutorial. Click database tab. Then create ‘crud_tutorial‘. Copy this sql script to your sql tab to generate product table.

CREATE TABLE `product` (
`productId` int(11) NOT NULL AUTO_INCREMENT,
`name` varchar(250) NOT NULL,
`description` varchar(500) NOT NULL,
`quantity` decimal(10,0) NOT NULL,
`price` decimal(10,0) NOT NULL,
`dateCreated` datetime NOT NULL,
`dateUpdated` datetime NOT NULL,
PRIMARY KEY (`productId`)
) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=1 ;

After executing these queries go through each tables and make sure that everything created correctly. Until now we are done with getting your system ready for development. Run your eclipse Helios to start develop web service. Right click in PHP explore > New > PHP Project.

eclipe helios

eclipe helios

Type crud_tutorial in project name. At content part, choose create project at existing location (from existing source). Type path name in directory field. /Applications/MAMP/htdocs/crud_tutorial  . Click Finish.

create project

create project

Right click in your project, select New > PHP File .

PHP File

PHP File

Type db_config.php and click Finish.

New php file

New php file

You need to create 5 more php files for db_connect.php, create_product.phpget_product_details.php, get_all_products.php, update_product.php and delete_product.php. You can check reference that I take from this site for this tutorial.

db_connect.php – database configuration / setting.

db_connect.php – database connection.

create_product.php – create product details into database.

get_product_details.php – get product details base on product id from database.

get_all_products – retrieve all list of products.

update_product.php – update product into database base on product id.

delete_product.php – delete product from database base on product id.

Fill up all these PHP files using these code.

db_connect.php

<?php
define('DB_USER', "root"); // db user
define('DB_PASSWORD', "root"); // db password (mention your db password here)
define('DB_DATABASE', "crud_tutorial"); // database name
define('DB_SERVER', "localhost"); // db server
?>

db_connect.php

<?php
class DB_CONNECT {
 
    // constructor
    function __construct() {
        // connecting to database
        $this->connect();
    }
 
    // destructor
    function __destruct() {
        // closing db connection
        $this->close();
    }
 
    /**
     * Function to connect with database
     */
    function connect() {
        // import database connection variables
        require_once __DIR__ . '/db_config.php';
 
        // Connecting to mysql database
        $con = mysql_connect(DB_SERVER, DB_USER, DB_PASSWORD) or die(mysql_error());
 
        // Selecing database
        $db = mysql_select_db(DB_DATABASE) or die(mysql_error()) or die(mysql_error());
 
        // returing connection cursor
        return $con;
    }
 
    /**
     * Function to close db connection
     */
    function close() {
        // closing db connection
        mysql_close();
    }
 
}
 
?>

create_product.php

<?php
  
/*
 * Following code will create a new product row
 * All product details are read from HTTP Post Request
 */
  
// array for JSON response
$response = array();
  
// check for required fields
if (isset($_POST['name']) && isset($_POST['description']) && isset($_POST['quantity']) && isset($_POST['price'])) {
  
    $name = $_POST['name'];
    $description = $_POST['description'];
    $quantity = $_POST['quantity'];
    $price = $_POST['price'];
  
    // include db connect class
    require_once __DIR__ . '/db_connect.php';
  
    // connecting to db
    $db = new DB_CONNECT();
  
    // mysql inserting a new row
    $result = mysql_query("INSERT INTO product(name, description, quantity, price, dateCreated, dateUpdated) VALUES('$name', '$description', '$quantity', '$price', NOW(), NOW())");
  
    // check if row inserted or not
    if ($result) {
        // successfully inserted into database
        $response["success"] = 1;
        $response["message"] = "Product successfully created.";
  
        // echoing JSON response
        echo json_encode($response);
    } else {
        // failed to insert row
        $response["success"] = 0;
        $response["message"] = "Oops! An error occurred.";
  
        // echoing JSON response
        echo json_encode($response);
    }
} else {
    // required field is missing
    $response["success"] = 0;
    $response["message"] = "Required field(s) is missing";
  
    // echoing JSON response
    echo json_encode($response);
}
?>

get_product_details.php

<?php
  
/*
 * Following code will get single product details
 * A product is identified by product id (productId)
 */
  
// array for JSON response
$response = array();
  
// include db connect class
require_once __DIR__ . '/db_connect.php';
  
// connecting to db
$db = new DB_CONNECT();
  
// check for post data
if (isset($_GET["productId"])) {
    $productId = $_GET['productId'];
  
    // get a product from product table
    $result = mysql_query("SELECT *FROM product WHERE productId = $productId");
  
    if (!empty($result)) {
        // check for empty result
        if (mysql_num_rows($result) > 0) {
  
            $result = mysql_fetch_array($result);
  
            $product = array();
            $product["productId"] = $result["productId"];
            $product["name"] = $result["name"];
            $product["description"] = $result["description"];
            $product["price"] = $result["price"];
            $product["price"] = $result["price"];
            $product["dateCreated"] = $result["dateCreated"];
            $product["dateUpdated"] = $result["dateUpdated"];
            // success
            $response["success"] = 1;
  
            // user node
            $response["product"] = array();
  
            array_push($response["product"], $product);
  
            // echoing JSON response
            echo json_encode($response);
        } else {
            // no product found
            $response["success"] = 0;
            $response["message"] = "No product found";
  
            // echo no users JSON
            echo json_encode($response);
        }
    } else {
        // no product found
        $response["success"] = 0;
        $response["message"] = "No product found";
  
        // echo no users JSON
        echo json_encode($response);
    }
} else {
    // required field is missing
    $response["success"] = 0;
    $response["message"] = "Required field(s) is missing";
  
    // echoing JSON response
    echo json_encode($response);
}
?>

get_all_products.php

<?php
  
/*
 * Following code will list all the products
 */
  
// array for JSON response
$response = array();
  
// include db connect class
require_once __DIR__ . '/db_connect.php';
  
// connecting to db
$db = new DB_CONNECT();
  
// get all products from product table
$result = mysql_query("SELECT *FROM product") or die(mysql_error());
  
// check for empty result
if (mysql_num_rows($result) > 0) {
    // looping through all results
    // products node
    $response["products"] = array();
  
    while ($row = mysql_fetch_array($result)) {
        // temp user array
        $product = array();
        $product["productId"] = $row["productId"];
        $product["name"] = $row["name"];
        $product["description"] = $row["description"];
        $product["quantity"] = $row["quantity"];
        $product["price"] = $row["price"];
        $product["dateCreated"] = $row["dateCreated"];
        $product["dateUpdated"] = $row["dateUpdated"];
  
        // push single product into final response array
        array_push($response["products"], $product);
    }
    // success
    $response["success"] = 1;
  
    // echoing JSON response
    echo json_encode($response);
} else {
    // no products found
    $response["success"] = 0;
    $response["message"] = "No products found";
  
    // echo no users JSON
    echo json_encode($response);
}
?>

update_product.php

<?php
  
/*
 * Following code will update a product information
 * A product is identified by product id (productId)
 */
  
// array for JSON response
$response = array();
  
// check for required fields
if (isset($_POST['productId']) && isset($_POST['name']) && isset($_POST['description']) && isset($_POST['quantity']) && isset($_POST['price'])) {
  
    $productId = $_POST['productId'];
    $name = $_POST['name'];
    $description = $_POST['description'];
    $quantity = $_POST['quantity'];
    $price = $_POST['price'];
     
    // include db connect class
    require_once __DIR__ . '/db_connect.php';
  
    // connecting to db
    $db = new DB_CONNECT();
  
    // mysql update row with matched pid
    $result = mysql_query("UPDATE product SET name = '$name', description = '$description' , quantity = '$quantity' , price = '$price', dateUpdated = NOW() WHERE productId = $productId");
  
    // check if row inserted or not
    if ($result) {
        // successfully updated
        $response["success"] = 1;
        $response["message"] = "Product successfully updated.";
  
        // echoing JSON response
        echo json_encode($response);
    } else {
  
    }
} else {
    // required field is missing
    $response["success"] = 0;
    $response["message"] = "Required field(s) is missing";
  
    // echoing JSON response
    echo json_encode($response);
}
?>

delete_product.php

<?php
  
/*
 * Following code will delete a product from table
 * A product is identified by product id (productId)
 */
  
// array for JSON response
$response = array();
  
// check for required fields
if (isset($_POST['productId'])) {
    $productId = $_POST['productId'];
  
    // include db connect class
    require_once __DIR__ . '/db_connect.php';
  
    // connecting to db
    $db = new DB_CONNECT();
  
    // mysql update row with matched productId
    $result = mysql_query("DELETE FROM product WHERE productId = $productId");
  
    // check if row deleted or not
    if (mysql_affected_rows() > 0) {
        // successfully updated
        $response["success"] = 1;
        $response["message"] = "Product successfully deleted";
  
        // echoing JSON response
        echo json_encode($response);
    } else {
        // no product found
        $response["success"] = 0;
        $response["message"] = "No product found";
  
        // echo no users JSON
        echo json_encode($response);
    }
} else {
    // required field is missing
    $response["success"] = 0;
    $response["message"] = "Required field(s) is missing";
  
    // echoing JSON response
    echo json_encode($response);
}
?>

After you fill up the files, you need to install Curl in your machine. Curl is a command line tool for transferring data with URL syntax. Install curl via npm. Type this command to install. If you using windows, run this command in your command prompt. Make sure you install node.js first.

npm install curl

npm install curl

npm install curl

Run this command to test create_product.php in your terminal.

curl POST

curl POST

curl -X POST -F name=The\ Promise\ of\ Spring -F description=With\ Valentine’s\ Day\ come,\ can\ Spring\ be\ far\ behind? -F quantity=3 -F price=21 http://localhost:8888/crud_tutorial/create_product.php

Success status for create_product.php

{"success":1,"message":"Product successfully created."}

Proceed all these curl commands for each URLs

get_product_details.php

curl http://localhost:8888/crud_tutorial/get_product_details.php?productId=1

Success status for get_product_details.php

{
    "success": 1,
    "product": [{
        "productId": "1",
        "name": "The Promise of Spring",
        "description": "With Valentine\u2019s Day come, can Spring be far behind?",
        "price": "21",
        "dateCreated": "2014-02-26 10:26:19",
        "dateUpdated": "2014-02-26 10:26:19"
    }]
}

get_all_products.php

curl http://localhost:8888/crud_tutorial/get_all_products.php

Success status for get_all_products.php

{
    "products": [{
        "productId": "1",
        "name": "The Promise of Spring",
        "description": "With Valentine\u2019s Day come, can Spring be far behind?",
        "quantity": "3",
        "price": "21",
        "dateCreated": "2014-02-26 10:26:19",
        "dateUpdated": "2014-02-26 10:26:19"
    }, {
        "productId": "2",
        "name": "The Rapture of Psyche",
        "description": "Now we're getting a bit more serious!",
        "quantity": "3",
        "price": "21",
        "dateCreated": "2014-02-26 00:00:00",
        "dateUpdated": "2014-02-26 00:00:00"
    }, {
        "productId": "3",
        "name": "Thrilling Love",
        "description": "This girl's got her hockey hunk right where she wants him!",
        "quantity": "3",
        "price": "21",
        "dateCreated": "2014-02-26 00:00:00",
        "dateUpdated": "2014-02-26 00:00:00"
    }],
    "success": 1
}

update_product.php

curl -X POST -F productId=1 -F name=The\ Promise\ of\ Spring -F description=With\ Valentine’s\ Day\ come,\ can\ Spring\ be\ far\ behind? -F quantity=3 -F price=21 http://localhost:8888/crud_tutorial/update_product.php

Success status for update_product.php

{"success":1,"message":"Product successfully updated."}

delete_product.php

curl -X POST -F productId=3 http://localhost:8888/crud_tutorial/delete_product.php

Success status for delete_product.php

{"success":1,"message":"Product successfully deleted"}

I thinks thats all tutorial for a simple web service. Later we will integrate this web service with android app. Stay tune and enjoy!!

Web & Apps Promo

Hi everyone. My partner nadia just gave me a poster about our services. We provide some sort of services for web and mobile apps development . So far right now we are focusing on mobile apps development because many clients ask us and demands are too high. So don’t hesitate to contact us if you interested to hire us.

Our portfolio:

Nadia: http://my.linkedin.com/in/nurulnadia/

Nurdin: http://www.linkedin.com/pub/mohammad-nurdin/57/290/692

web and apps promo

web and apps promo

Service Finder Mobile

Service Finder Mobile is an open source mobile application built using PhoneGap (Apache Cordova) that helps users provide and find services in Malaysia.

The Service Finder Mobile uses the following technologies:

The entire user interface of the application is created dynamically at runtime based on jquery mobile.  You can download the full application source code at https://github.com/datomnurdin/service-finder-mobile.  Feel free to fork it, or use it as a learning tool to build UI experiences for PhoneGap applications.

Enjoy !

CRUD operation using jquery mobile on android – Part 1

Today I want to create a tutorial about CRUD (stands for Create – Read – Update – Delete) operation using Jquery Mobile. If you don’t know about the jquery mobile thing, you may visit this website here for your more understanding. First, you need to have correct tools before we begin. I suggest you visit my old post regarding to hybrid mobile app development tools and references before we go further.

You need eclipse juno r2 for android development. Why I choose this because base on our experience using other version of eclipse can be troublesome for android development. Mostly eclipse plugin support for eclipse juno r2 on eclipse marketplace. Eclipse Kapler and Luna are still new compare with the others. Indigo got some issue for Maven. Helios for PHP, not suitable for android development. Android Studio? I did’t had chance to test it because of time limitation. Ok, cut the chit chat.

Don’t forget to install or update your machine with latest JDK. Currently JDK version 7. Download here. After you download, make sure you set the correct java path. If not, you can’t start your eclipse. You can download eclipse Juno here. Then install it. After you install the tool that I tell you, make sure you install ADT (android development tools).

Go to Help and choose Install New Software.

Install New Software

Install New Software

Click Add button then popup box will appear. Enter ‘ADT’ in name textfield and ‘https://dl-ssl.google.com/android/eclipse/’ in location textfield.

Screen Shot 2014-02-21 at 10.11.57 PM

Click Select All button and click Next.

Screen Shot 2014-02-21 at 10.15.34 PM

Click Next.

Screen Shot 2014-02-21 at 10.23.07 PM

Select I accept the terms of the license of agreement. Click Finish.

Screen Shot 2014-02-21 at 10.23.36 PM

After finished setup ADT in your eclipse, download android SDK and update latest android version or depends on your device for testing. After you install the android SDK, open android SDK , /android-sdk/tools. I’m not suggest you to update android version 4.4.2 (API 19) because not stable yet. If you using simulator, don’t forget to install Intel x86 Atom System Image for speed during testing your app compare to ARM. Intel Atom processor more faster than ARM7 because it using normal mobile phone processor.

Screen Shot 2014-02-21 at 10.28.19 PM

After that, install node.js to use npm for package manager. If you not install node.js, you should not be able to invoke node or npm on your command line to install cordova apache. Then install cordova apache using terminal for Mac, command prompt for Windows.

Type this command to install cordova apache.

For Mac

sudo npm install -g cordova

For Windows. If you can’t install, make sure you run the command prompt as administrator.

npm install -g cordova

Screen Shot 2014-02-21 at 10.45.27 PM

After you finish install the cordova apache. You can start create your project using cordova command. Open your terminal/command prompt, type these command. You can ignore sudo if you using Windows.

cd /Applications/MAMP/htdocs
sudo cordova create to-do-mobile
cd to-do-mobile
sudo cordova platform add android

Screen Shot 2014-02-21 at 11.11.07 PM

Go to eclipse and import android project. Click File and choose Import.

Screen Shot 2014-02-21 at 11.26.28 PM

Choose Existing Android Code into Workspace and click Next.

Screen Shot 2014-02-21 at 11.28.01 PM

Browse your android project and select all. Click Finish.

Screen Shot 2014-02-21 at 11.31.31 PM

Right click android project > Run As > Android Application.

Screen Shot 2014-02-21 at 11.51.30 PM

Then you will get this popup box. Click Yes to enter Android Device Chooser.

Screen Shot 2014-02-21 at 11.57.12 PM

Select Launch a new Android Virtual Device. Then click Manager.

Screen Shot 2014-02-22 at 12.01.49 AM

Android Virtual Device Manager show up after clicked. Then click New.

Screen Shot 2014-02-22 at 12.04.01 AM

  1. Enter AVD1 in AVD name textfield.
  2. Choose Nexus 4 (4.7″, 768 x 1280: xhdpi).
  3. Target: Android 4.3 – API Level 18.
  4. CPU/ABI: Intel Atom (x86).
  5. Leave default for all the rest.

Screen Shot 2014-02-22 at 12.05.10 AM

Choose AVD and click Start.

Screen Shot 2014-02-22 at 12.07.10 AM

Click Launch.

Screen Shot 2014-02-22 at 12.08.26 AM

Wait for a few minutes to start the android emulator and load the app.

Screen Shot 2014-02-22 at 12.10.19 AM

You can see you app is running.

android simulator

android simulator

Don’t hesitate to contact and ask me if you got any problem or difficulties during development. You can find sample code here: https://github.com/datomnurdin/to-do-mobile. Enjoy!!

Part 2: http://blog.revivalx.com/2014/02/25/crud-operation-using-jquery-mobile-on-android-part-2/