Tuesday, May 30, 2017

ADF PopUp Event Context Launcher

I will describe how you could use ADF popup event context to pass parameters into popup. This could be useful if you want to develop reusable popup, which should accept different type of parameters from various launcher components.

In this example - popup is loaded from context info. Launcher component - output text is assigned with attribute, reading its value from binding. Our goal is to pass attribute value into popup:


In order to be able to read attribute value from launcher parent component, make sure to set eventContext="launcher" for ADF popup:


You can reference parent UI component from launcher property, this can be done in popup fetch listener - where value will be copied to managed bean property:


We could process launcher parent component in managed bean, extract values, etc.:


Value retrieved from popup launcher is displayed in the popup:


Download sample application - PopUpEventContextApp.zip

Thursday, May 18, 2017

Oracle JET Hybrid - NavDrawer Template Menu/Header Structure

Oracle JET provides NavDrawer template for Web and for Hybrid. Read how to create JET Hybrid application based on template - Create a Hybrid Mobile Application. There is significant difference in NavDrawer template implementation when we compare Web and Hybrid application.

Hybrid template draws menu structure on top of the form. Web template is pushing form to the right, when menu is opened. Such approach works fine on the Web, but you would see significant UI lag each time when menu item is selected. Probably thats the reason why hybrid NavDrawer template draws menu on top of the form - visually this provides better performance when switching between menu items. Menu is rendered on the top of the form in JET Hybrid Nav Drawer template:


Form is loaded instantly, when menu item is selected. Header in JET Hybrid NavDrawer template stays fixed, it doesnt scroll. This gives good opportunity to put there common actions:


NavDrawer template in JET Web application moves form to the right, when menu is opened - thats the main visual difference when comparing to NavDrawer Hybrid:


Index page of NavDrawer hybrid template is almost identical to Web NavDrawer, except that it doesn't contain header part. Header is implemented separate module:


I have customized default header implementation with additional items - logo and user preferences:


Header module is constructed in appController, this is how it is generated by default. If we want to have access to variables/functions from appController in the header, we need to create a mapping:


Every module must include div with fixed top JET CSS class (thats why it doesnt scroll and stays on top), where you would copy header code:


Header is bind with module, which is defined by headerConfig variable (must be located in each module) - which is initialized in appController:


Thats all about menu/header implementation.

Let's learn how to push update to Google Play. Make sure to increase application version in Cordova config.xml file:


Go to Google Play and upload new APK, it will be parsed and Google Play automatically will deactivate previous version:


You can initiate roll-out to production:


This will push new release to Google Play. Users will be automatically notified about new version:


Version 2 of our JET Hybrid app is available on Google Play:

Wednesday, May 10, 2017

Oracle JET Hybrid Mobile Application on Google Play

Oracle JET Hybrid mobile application can be published to Google Play and installed on Android device. We have tested this process from beginning to the end. Of course JET Hybrid mobile app can be published on Apple Store too, but we are using Google Plain and Android for now.

Where to get started if you want to publish your own Oracle JET Hybrid (open source and free to use) mobile app? First of all you need to build APK (if building for Android) file in release mode. Read about it in my previous post - How To Package JET Hybrid Mobile Application for Release (Android Platform).

Search for JellyHouse in Google Play to install and test our JET app:


You can use demo data account redsam/welcome1 to login and check how JET runs on your Android mobile:


Let's walk through the main steps about how to upload and publish JET APK file in Google Play. First of all you need to login into Google Play Developer console and pay license fee 25 USD (if you are publishing first time). Second, prepare APK file compiled in release mode (read above how to do it). APK file typically is located in hybrid folder, build/outputs directory:


In Google Play Developer console create new application - press Create Application button:


Before you could publish APK to Google Play, you will be asked to complete various forms with information about the app, content rating and upload application graphics:


APK file is uploaded under Release Management -> Artifact library:


To verify upload, click on show details icon and you should see additional information for uploaded APK:


There are options to manage test releases. But you could opt out directly for production - this is what I did. Press publish button and wait about 30 - 60 minutes. Status should be changed to published:


Once published, search for your app in Google Play. Google Play for JellyHouse app:

Sunday, May 7, 2017

How To Package JET Hybrid Mobile Application for Release (Android Platform)

If you want to build/package JET Hybrid application you must issue build:release or serve:release command. Read more about it in JET developer guide: Packaging Hybrid Mobile Applications. In order to run build:release or serve:release commands successfully, you need create buildConfig.json file, which includes information about self signed certificate. This allows to sign application and package it for release.

Steps below are tested for Android platform.

You can generate certificate with Java keytool utility. Navigate to Java home bin folder and run keytool. Specify correct path and preferred alias:

keytool -genkey -v -keystore /Users/andrejusbaranovskis/jdeveloper/mywork/jellyhouse-release-key.keystore -alias RedSamuraiConsulting -keyalg RSA -keysize 2048 -validity 10000

You will be asked to enter additional information, such as name, organization, location, etc.:


Once certificate is generated, you can create empty buildConfig.json file. I have created it in the root directory of JET Hybrid application. Certificate file is copied into the same location:


Provide release information in buildConfig.json. Since certificate file is located in the same folder, it is enough to specify its name without path. Include alias name, certificate password and keystore password:


If buildConfig.json contains correct entries, build:release should run successfully:

sudo grunt build:release --platform=android --buildConfig=buildConfig.json

Successful result output:


JET Hybrid release app built for Android platform size is 7.5 MB (major part takes Cordova libraries):


So, if you create self signed certificate and populate buildConfig.json correctly - it is very easy to run release build for Oracle JET Hybrid application.

Wednesday, May 3, 2017

Batch Requests Support in ADF BC REST

ADF BC REST provides a set of enterprise features for REST, one of them support for batch requests. In single REST batch call we can execute multiple update, insert, delete and get operations. This is important functionality, it allows to minimize number of REST calls from the client and improves client performance. Take a read about it in developer guide - 22.13.7 Making Batch Requests.

Batch request in ADF BC REST is executed through POST. You need to specify root URL for REST request, complete path will be set in the payload. Make sure to include batch request Conent-Type:


Request is constructed with different parts, each part describes separate request operation - update, create, delete or get. Path to REST resource is specified too, along with payload if any:


Complete example of ADF BC REST batch request (one for update, create, delete and another for multiple get):

It is important to keep in mind - if one of the batch operations fails, other operations are reverted. In this example, validation fails for create operation - message is returned to the client:


Successful batch request returns back response data for each operation. This is useful, if you want to leverage response on the client - there is no need to do separate REST call to retrieve latest data:


I have logged execution output on the server side. Batch request is executing two update operations, create and delete. At the end single commit is called:


Very useful could be execute multiple get operations in single batch request. We can fetch data for different REST resources in one call to improve performance. In this example fetching data for Employees and Departments:


In response we get data for Employees under part1:


Data for Departments under part2:


Response structure is simple and this makes it easy to parse it on the client.

Access sample application code on GitHub repository - jetcrud.