Oracle Mobile Application Framework Getting Started Demo

Sometimes you just need a little push to get started on something and this is pretty much the goal of this post... to get you started with the Oracle Mobile Application Framework.

I'm a very visual person and no matter how much I read about a specific topic I prefer watching a demo or a tutorial and then I try to do something on my own.

With that idea in mind I recorded a 3-part Oracle MAF demo that covers how to get started developing a mobile app, create a new feature (module), create and customize a task flow, invoke a REST Web Service as well as a SOAP Web Service, customize the request and response for the Web Service calls, create a data control, customize the MAF AMX pages, import a local HTML resource, configure a Remote URL based feature and deploy to the iOS Simulator.

I hope you enjoy!

Part 1: Getting Started with Oracle Mobile Application Framework

Part 2: Getting Started with Oracle Mobile Application Framework

Part 3: Getting Started with Oracle Mobile Application Framework

You can also watch these videos directly on Youtube: https://www.youtube.com/watch?v=KZ3xZDDDFwc&list=PLgz4ntw9X2fG_umbS1GcSIHZJs1jheUM_

Using TIBCO Silver Mobile with TIBCO Web Messaging

Every company has or it's planning to have a mobile app these days and among other top priorities like Social, Event Processing, Analytics and Cloud, Mobility is a hot topic for CIOs looking for how they can change the game and put on their internal and external consumers' fingertips the right information at the right time with the right context. Not only that requirement but also how to capture, sense, act and respond to business events and notify mobile users of actions they need to take or what just happened that's so important to them.

Sometimes, there is a big disconnection between the "App" and all the backend systems that really do all the heavy lifting.

Integrating those two distinct worlds is getting easier primarily because of technologies like TIBCO Silver Mobile and TIBCO Web Messaging. Those product already have their huge value attached to their capabilities but when you combine them then the value brought to the table is extreme. 

TIBCO Silver Mobile is an open mobile development application platform (MDAP) that lets you build and manage mobile apps and create your own secure enterprise app portal. The platform lets you leverage whatever investments you've made in back-end automation infrastructure, whether from TIBCO or another provider.

Some of the Silver Mobile benefits are:

- Helps decrease mobile application development time and cost with a cross-platform, write-once environment and simplified Java and HTML5 back-end integration capabilities
- Lets you easily build onto your web application code base and add provisions for using pictures, video, contacts, and other data collected by mobile workers to mobile applications
- Deploys mobile apps securely on your own mobile app portal using your existing security standards and controls access to app downloads and the information available through them
- Supports Android, iOS, and others – and provides a familiar mobile app download process
- Gives front-line mobile workers access to the full resources of the enterprise by letting them access and contribute information in real time

You can download TIBCO Silver Mobile from the TIBCO Access Point (TAP) here: http://tap.tibco.com/storefront/trialware/tibco-silver-mobile/prod15310.html

On the other hand, TIBCO Web Messaging overcomes traditional HTTP-based web architectures that simply don't provide the real-time, bidirectional communication that today's new applications and services demand by using HTML5 WebSocket.

Some of the Web Messaging benefits are:

- Build compelling real-time applications using the new HTML5 WebSocket standard for low-latency web communication with a fraction of the overhead of existing web architectures.
- Use HTML5 API for Java Message Service, support legacy browsers, and natively integrate TIBCO EMS for faster and at less costly web and mobile application development.
- Don't sacrifice enterprise readiness to get next-generation web services with TIBCO Enterprise Message Service integration, enhanced security, and connection offloading.
- Natively integrate with TIBCO Enterprise Message Service to extend the reach of enterprise IT infrastructures through asynchronous or synchronous communication.
- Provide real-time full-duplex communication for web applications with HTML5 WebSocket at a fraction of the overhead of existing web architectures.
- Simplify application development for multiple client platforms with a JMS-client API familiar to enterprise developers.

In conclusion, combining these two powerful technologies give the business users not only full access to the information they need at any time and any place but also leverage the resources your company already invested on.

The Definitive Guide to HTML5 WebSocket

The book is on the way now! You can pre-order it here. It has been so much fun and a lot of work but I personally hope you can get a copy and enjoy all the content we're putting together.

Here is part of the book description if you want more information about it:

"The Definitive Guide to HTML5 WebSocket is the ultimate insider’s WebSocket resource. This revolutionary new web technology enables you to harness the power of true real-time connectivity and build responsive, modern web applications.   

This book contains everything web developers and architects need to know about WebSocket. It discusses how WebSocket-based architectures provide a dramatic reduction in unnecessary network overhead and latency compared to older HTTP (Ajax) architectures, how to layer widely used protocols such as XMPP and STOMP on top of WebSocket, and how to secure WebSocket connections and deploy WebSocket-based applications to the enterprise. Build real-time web applications with HTML5."

The book gives you an overview of HTML5 WebSocket, the WebSocket API and the protocol, the high level protocols you can use on top of WebSocket, security aspects and enterprise deployment. 

The WebSocket bufferedAmount attribute

If you have been working or planning to work with HTML5 WebSocket you may end up transporting large amounts of data and/or you may have the requirement to transport data as fast as possible. 

The WebSocket object has an attribute called bufferedAmount that's particularly useful to check for the amount of data buffered for transmission to the server. You can use the bufferedAmount attribute to check the number of bytes that have been queued but not yet transmitted to the server.

The values reported in that attribute don’t include framing overhead incurred by the protocol or buffering done by the operating system or network hardware.

The code below shows an example of how to use the bufferedAmount attribute to keep sending updates every second, if the network can handle that rate, or at whatever rate the network can handle, if that is too fast.

// Buffering threshold at 10k

var THRESHOLD = 10240;

// Create a New WebSocket connection
var mySocket = new WebSocket(“ws://echo.websocket.org/updates”);

// Listen for the opening event
mySocket.onopen = function () {
 setInterval(function() {

// Check for amount of data buffered but not sent yet //and then send an update in case there is nothing //in the buffer

if (mySocket.bufferedAmount < THRESHOLD)

                                    mySocket.send(getUpdateData());

                  }, 1000);

};

Using the bufferedAmount attribute can be useful for throttling the rate at the applications send data to the server avoiding network saturation.

Checking for WebSocket Support on Your Web Browser

It’s frustrating to execute some code and don’t see anything happening after that. But, depending on the web browser you or the end user running your application is using that may be impacting the WebSocket functionality at this point since not all current browsers in use support HTML5 WebSocket natively yet.

So, let’s take a look on some techniques to make the web browser supports WebSocket.

We are going to use the JavaScript console available in all web browsers to start with the WebSocket support investigation. Each web browser has a different way to initiate the JavaScript console but if you’re using the suggested web browser (Google Chrome) take a look on the following resource to learn more about it (https://developers.google.com/chrome-developer-tools/docs/overview).

If you open your browser’s interactive JavaScript console and evaluate the expression window.WebSocket you should see the WebSocket constructor object:

 function WebSocket() { [native code] }

which means that your web browser supports WebSocket natively.

The same test above in some other browsers comes back blank or undefined indicating no native support.

If you want to add that capability for WebSocket support to your application or on our sample client code, you can use the following approach.

By just adding the following conditional check to your code before you try the WebSocket connection then it would be enough to tell you if the web browser supports WebSocket natively.

if (window.WebSocket){
     console.log("BROWSER SUPPORTED");
} else {
     console.log("BROWSER NOT SUPPORTED");
}

If your target web browser doesn't support HTML5 WebSocket and you want to have that amazing capability on your application, it's time for you to look into some vendors like Kaazing where you have WebSocket emulation that enables any browser (modern or not) to support the HTML5 WebSocket standard APIs.

From the developers perspective they can work in a fully transparent environment, using the client libraries that enable them to simply code against standard WebSocket APIs. And from the end-user point of view, they interact with a WebSocket application that Kaazing’s WebSocket emulation technology kicks in when native WebSocket support is unavailable, giving the user a seamless experience.

There are several web sites available on the Internet to help you with compatibility, not only WebSocket, but also HTML5 features in general. To mention a couple of them, you can navigate to http://caniuse.com/ or http://html5please.com/ and check for the HTML5 feature you want to use on the target web browser manufacturer and/or version.

The WebSocket readyState attribute

The WebSocket object will report the state of its connection through a read-only attribute called readyState.

There are four different values that the readyState attribute can receive to represent the state of the connection.

0 - CONNECTING – The connection has not been established yet.
1 - OPEN – The connection has been established and messages can be exchanged between the client and the server.
2 - CLOSING – The connection is going through the closing handshake.
3 - CLOSED – The connection has been closed or could not be opened.

When the WebSocket object is first created its readyState is 0, indicating that the socket is CONNECTING.

Inspecting WebSocket Frames

So far, it has been a challenge for us working with HTML5 WebSocket to analyze the traffic going back and forth from the client to the server and from the server to the client. Without using packet sniffing tools like Wireshark or tcpdump the analysis and debugging of WebSocket messages is almost impossible.

But, recently, things are changing and it's now possible to see frame data along with arrows indicating the direction of the data is going to.

A WebKit patch has been created and you can use Chrome Canary to check the latest changes and start inspecting WebSocket frames. A huge advance for those working with HTML5 WebSocket.

There is also a step-by-step demo located here: http://blog.kaazing.com/2012/05/09/inspecting-websocket-traffic-with-chrome-developer-tools/