September 2014Never memorize what you can look up in books. - Albert EinsteinPage 1
The Hello World app...254The JavaFX Hi
Page 100
6. Create the WORKLIGHT_INSTALL_DIR variable7. Define a new shared library entryPage 101
8. d9. d10. d11. d12.13. s14. sOperationsAfter having installed and configure Worklight and built applications for distribution, it is likely that you
Client Side API ProgrammingA JavaScript object called "WL" is created by the Worklight framework. This can then be used as the root or name
WL.Client.connect(options)This method forms a connection to the Worklight Server. It must be executed before any other API calls from the client whic
• WL.Environment.ANDROID• WL.Environment.EMBEDDED• WL.Environment.IPAD• WL.Environment.IPHONE• WL.Environment.MOBILE_WEB• WL.Environment.PREVIEW• WL.E
• key – ???See also:• WL.Client.getUserPref(key)• WL.Client.setUserPref(key, value, options)• WL.Client.setUserPrefs(prefs, options)WL.Client.init(opt
WL.Client.invokeProcedure(invocationData, options)Invoke a procedure exposed by an adapter.• invocationData – Data passed in to control the request to
• realm – ???• options – ???WL.Client.logout(realm, options)A function which when called will logout the user.• realm – ???• options – ???WL.Client.mi
WL.Client.setUserPrefs(prefs, options)Set multiple properties for a user in one single call.• prefs – A JavaScript object where the names of the prope
JavaFX TextField...277JavaFX ToggleBu
var busy = new WL.BusyIndicator(null, { "text": "I'm Busy!"});busy.show();On an Android device this will show as:WL.Toast.sho
WL.Client.hasUserPrefWL.Client.logActivityWL.JSONStoreThe WL.JSONStore functions provide access to the JSONStore APIs.WL.JSONStore.add(data, options)T
WL.JSONStore.enhance(name, func)This function will add a named method to the prototype of Collections effectively extending their capabilities.• name
WL.JSONStore.getErrorMessage(errorCode)Retrieve a string representation of a JSONStore error described by the errorCode parameter.• errorCode – The er
◦ clear◦ localkeygen – If a password is supplied and encryption to be used, a token is obtained as part of the encryption process. Where the token is
WL.JSONStore.replace(doc, options)Replace documents within a collection with different versions.• doc – A single document or an array of documents• op
WL.Logger.debugServer Side API ProgrammingServer side programming is building logic that is executed when a client invokes an adapter.See also:• Adapt
◦ parameters – Any parameters required by the procedure.See also:• WL.Server.invokeSQLStoredProcedure(options)• WL.Server.createSQLStatement(statement
supplied.• transformationUnusually the invokeHttp() method seems to execute synchronously. The result is a JavaScript object that contains the respon
"name": "Ted Cruz", "office": "185 Dirksen Senate Office Building", "pa
Apache HTTP Server...288Setting up
This will open a dialog into which we can enter a JavaScript Object that will be passed as the parameters to the function. Note that experience seems
When the Run button is clicked, the invokeHttp function is executed by the Worklight server in the context of the deployed adapter. A further dialog
See also:• HTTP Adapter Procedure implementationsWL.Server.readSingleJMSMessage(options)This API method reads a JMSText message from a JMS queue. The
queue.• options – A description of how the message is to be read◦ destination – The JNDI name of the queue from which the message is to be read.◦ time
If not supplied, the message will not expire.See also:• WL.Server.readSingleJMSMessage(options)• WL.Server.readAllJMSMessages(options)• WL.Server.requ
Android DevelopmentInstalling the Android SDKThe Android SDK is required for building Android applications. It should be downloaded and installed int
JavaScript FrameworksjQuery MobileDojo and Dojo MobileWhen creating a new app, we have the opportunity to select to include the Dojo library:When Dojo
Local storage of dataIdeally, a Mobile App should also be able to operate when it is not currently connected to the network. In other words, it shoul
Web ProgrammingWeb programming is the notion of writing applications that will exclusively run within the browser.The skills necessary for any web pro
By creating a free userid, you can save your snippets for your own use or for sharing with others.Document Object Model – The DOMTypes of nodes found
Mobile ApplicationsApplications are no longer limited to just running on a desktop PC or laptop. Instead, we now have a plethora of devices on which
JavaScriptJavaScript is the native programming language for browsers. It is typically executed by including a script tag such as:<script type=&quo
Calling JavaScript from JavaWith the arrival of Java 8, JavaScript has become a first class and pre-supplied addition to the Java environment.To call
The {less} languageThe Less language is a preprocessor for CSS. This means that one can construct CSS much easier than hand crafting. For example, c
• setInterval(function, interval) - Calls a function repeatedly every timer period• setTimeout(function, interval) - Calls a function once after a tim
examine the state of variables and contexts within our program.One of the easiest ways to insert a breakpoint is the codding of the "debugger&quo
See also:• console.log• console.debug• console.info• console.warnconsole.infoThis method is a synonym for console.log.See also:• console.log• console.
Dojo ProgrammingDojo is a completely open source JavaScript toolkit primarily designed for web programming. Its current release level is 1.9 (as of 2
7. Create a "setenv.bat" file that adds the GIT/bin folder to the command path. In this exampleit was:C:\Program Files (x86)\Git\bin8. Add
Dojo GUI DevelopmentDojo development can be performed in HTML or in JavaScript. Other alternative development environments include IBM's Integrat
to reveal the content.Asynchronous Module Definition (AMD)Dojo package loading is achieved through a technology called "Asynchronous Module Defin
The patterns for designing user interfaces for mobile apps takes a different style from that for desktop.See also:• Designing for iOS 7Page 14
• mapSee also:• Defining Modules• The Dojo Loader• sitepen: Dojo FAQ: How does passing a configuration object to require work? - 2014-01-22• sitepen:
• xhr.post() - make an HTTP POST requestEach of these methods takes two arguments:• url – The target URL of the request• options – A JavaScript object
See also:• Deferred and asynchronous processing – dojo/Deferred• Ajax with Dojo• DojoToolkit: xhtGet• DojoToolkit: dojo/request/xhr (1.8)• Basic Acces
• Dojo DOM Functionsdojo/domThis module provides some of basic DOM functions. These include:• byId(id) – Find the single DOM node with the given id.•
E > F An F element that has an immediate parent of type E.E:linkE:visitedE:activeE:hoverE:focusE[foo] An E element with an attribute called foo.E[f
dojo/dom-geometryThe dojo/dom-geometry class provides accessors for working with the geometry (sizes and positions) of DOM nodes. Convention maps thi
◦ minute◦ second◦ millisecond◦ quarter◦ week◦ weekday• compare() - Compares two dates and returns 0 if they are the same, positive if the first is aft
◦ milliseconds – A boolean. If selected, milliseconds will be included.See also:• Dates and times within JSONDijit WidgetsIn modern UI environments,
instance of a button, nothing at all will be shown in the web page. We haven't told the button whereon the page it should appear. This is a cor
page.• claro• tundra• noir• soria<style type="text/css">@import "http://.../dojo/resources/dojo.css";@import "http://..
WorklightIBM Worklight is a development and runtime platform for building a variety of user interfaces including mobile.ReleasesThere have been a numb
/// code here});Experience shows that the values can be:• "incomplete" – Missing required field not entered.• "error" – Data in
text-align: center;background-repeat: no-repeat;}Here is an example. In the <head> of the HTML page, we define a new Style:<style type="
<br /><input type="radio"data-dojo-type="dijit/form/RadioButton"name="drink"id="radioTwo"value="
• autoComplete – If set to true, characters entered are used to match with the pre-defined possible values as soon as possible.• hasDownArrow – Whethe
The date is accessed via the "value" property and is a JavaScript "Date" object with no time component of the date set. If the da
Methods:• displayMessage(String) – displays the message associated with the text box. If no parameter is supplied, any existing message that is curre
Amongst the properties of this widget are:• rows – the number of rows to show• cols – the number of columns to showSee also:• dijit/form/Textarea• dij
Listsdijit/form/MultiSelectThe MultiSelect widget allows the user to select from a set of available options shown on a list.It can be used to select a
<option value="CA">California</option></select>By default, the Select changes its width to accommodate the selected it
not. The default is true meaning that it should be initially shown open.dijit/FieldsetThis widget places content within a fieldset that may be collap
• Worklight Studio – An integrated development environment (IDE) built on Eclipse used by a developer to build a mobile app.• Worklight Device Runtime
See also:• Dojo docs – dijit.dialog – 1.10dijit/TooltipDialogVery similar to the dijit/Dialog, the dijit/TooltipDialog also shows a modal dialog. Howe
MenusDojo has extensive menu support. It provides both menu bar and context menus. Let us look first at menu bars.The code for the above looks as fo
);A menu item can be disabled using its "disabled" property. Setting that to true disables the menu item.Images can be added to menu items
• addChild()• bindDomNode()See also:• dijit/MenuItem• dijit/popupdijit/MenuBardijit/MenuItemThis widget represents an entry in a menu. Among its prop
• popup – The widget to actually popup to the user (eg, an instance of Menu)• around – The dom node that will be the host of the popup• orient – A lis
◦ horizontal – Show the list horizontally.◦ vertical – Show the list vertically.• effectUnits – The number of pixels to scale per mouse move increment
margin: 0 auto; text-align: center;}LayoutsDojo provides some powerful layout capabilities. In addition, we can always use the classic HTMLlayou
"AccordionContainer" is part of dijit.layout. The "panels" in the accordion are added via the "addChild()" method. Typ
◦ right-h• useMenu• useSliderSee also:• Dojo Docs – Tab Container – 1.9• dijit/layout/StackContainerdijit/TitlePaneSetting the toggleable property to
The next image shows a sidebar design mode:As you can see, both contain the same number and types of panels but the width of top and bottom vs the hei
Center can be thought of as a private app store however it provides more function than that. Developers within your own company can publish new versi
the region is re-sizable in a single direction.The following JavaScript will create and add a Border Container with both left and center regions:var b
◦ right – The right region◦ center – The center region• splitter – true or false. Can be set on any region except "center".• minSize – The
• orientation – The location of the labels relative to the field. The choices are:◦ "vert" – The label is above the field.◦ "horiz&quo
• nbZones – The number of columns (zones) in the grid.There are also a number of methods of interest on the GridContainer including:• setColumns() - S
dijit/ColorPaletteAmong the more interesting properties of this widget are:• palette – A string of either "7x10" or "3x4" describi
• selectionMode◦ none◦ single◦ multiple◦ extended• columnReordering• headerMenu• autoHeight◦ Not supplied – the height of the <div>◦ true – resi
• hidden – A boolean. When set to true, the column is hidden.• classes – A set of CSS class names used to style the columnThe DataGrid also supports
If double click for editing is too much, an option called "singleClickEdit" can be added so that only a single click will be needed to edit
data store as input.eg.var store = new ObjectStore({"objectStore": new Memory({"data": data.caseHistories.items})});grid.setStore(
columnIndex could be negative to indicate that the column is sorted descending. The first column is "1". Consider using Math.abs(columnInd
InstallationThe installation of Worklight can be broken down into the installation of the distinct components associated with it. These include:• Wor
• field – The identity of the field in a row of data that should be shown in cell.• name – The column name of the column• decorator – A function that
See also:• Object Stores and Data StoresGridX ModulesThe architecture of GridX is such that it has a set of optional plugins called "modules"
called, it is the responsibility of the function to set the widget to contain the data value. Notice that in the widget description, we can add the d
• props (String) - Set of properties defined on the Dijit Widget• fromEditor (function(storeData, gridData)) – Function to be called to return the val
},editor: 'dijit/ColorPalette',editorArgs: {fromEditor: function(v, cell){return v || cell.data(); //If no color selected, use the original
It is not expected that all properties are populated. Instead, the property populated will be a functionof the hookPoint attribute set in the menu opt
Some of the more interesting properties of this module are:• multiple – A boolean. If false, only single selection is allowed. The default is true w
Among its properties there are:• sizes – An array of numbers corresponding to the different sizes that can be supplied for paging. A negative number
rowId Cell, Row, RowHeaderCellrowIndex Cell, Row, RowHeaderCellparentId Cell, Row, RowHeaderCellvisualIndex Cell, Row, RowHeaderCellcolumnId Cell, Hea
First we can create a column in the grid to hold the button. { field: "name", name: "Actions", widgetsInCell: true,decorator: fun
C:\IBM\Worklightto serve as the root of my Worklight installations. I then extracted the Eclipse distribution into a folder called "eclipse"
• xstyle• put-selectorThe TreeDojo provides an elegant tree Widget that can show hierarchical data. The core of the tree is a Dijit widget called dij
dijit/tree/ModelThis is an abstract interface that describes the methods and properties provided by a tree model. The dijit/tree/ObjectStoreModel is
dijit/tree/Model that owns the data shown in a dijit/Tree. What it does is map from a dojo/store to the tree model.Each element in the store must hav
Progress BarDijit provides a progress bar which shows a bar with optional text contained within it. Associated with the bar is a numeric value which
column "column" and "matrix". A column style shows data for a period (eg. a day) in a single column. The matrix style shows a &q
created, a property called "templateString" can be set to a fragment of HTML. This fragment defines the buttons. The default text looks as
◦ "week" – Show dateIntervalSteps weeks. Here is a week calendar:◦ "month" – Show dateIntervalSteps months. Here is a month cale
date/dateInterval option. See also endDate.• startTimeAttr – The name of a property (attribute) of an item in the store that will contain the start d
The function should return a new item that will be inserted into the calendar. If a return without data is executed, no new entry will be added.The w
If we want to execute a method on the widget after it is created, we can add:<div data-dojo-type="module/MyWidget"><script type=&qu
Table of ContentsMobile Applications...
2. Add a new repository to install.3. Select the ZIP file containing Worklight Studio. As 6.1.0, this is the file CIQ5PEN.zip.4. Select the features
• getIdentity• queryEngine• transaction• getChildren• getMetadataThe query method is very interesting. It can be used to query a store which returns
maintained data that is held in memory.When constructed, it has a property called "data" that holds the initial data of the store.dojo/store
answer that … but it appears that "out of the box", JavaScript doesn't have the concept of classes, inheritance or other common OO func
• create• postMixInProperties• buildRendering• postCreate – This is where most of the widget specification customization will occur.• startupThe filen
• Dojo Documentation - Writing Your Own Widget• Understanding _WidgetBase – 1.9• Creating a custom widget – 1.9• Creating Dojo Widgets with Inline Tem
<input type="radio"data-dojo-type="dijit/form/RadioButton"name="timeRangeMethod"id="${id}_rollingPeriod"val
to define a setter function, we create a function with the name:_set<PropertyName>Attr: function(newValue) {…}The property name within the funct
A chart object has three sets of primary attributes:• A plot• Axis• A series – the data to be drawnEach of these must be added to a chart.The Charting
◦ ClusteredBars◦ ColumnsPage 208
The AMD packages Chart and Columns must be loaded. Special properties of this chart include:• gap – pixels between columns◦ Grid◦ Lines◦ Markers◦ Mar
Note that it is essential that the Eclipse environment have Internet connectivity as installation of Worklight Studio will also require the installati
◦ StackedBars◦ StackedColumnsPage 210
◦ StackedLines◦ Pie chartThe data array supplied to the series may be either an array of numbers or an array of objects. If objects, these contain:•
GaplinesareasmarkerstensionshadowshAxis/vAxisAreas Y Y Y Y YBars YClusteredBars YColumnsGridLines Y Y Y Y YMarkers Y Y Y Y YMarkersOnly Y Y Y Y YPieSc
• minorLabels – A boolean. If true, minorLabels are shown.• minorTicks – A boolean. If true, minorTicks are shown.• microTicks – A boolean. If true
• sitepen - Zooming, Scrolling, and Panning in Dojo Charting – 2008-05-15• Dojo Docs – dojox.charting• Dojo tests – Charts• Developer Works – Customiz
The gauges have common properties that define their operation. Here is a list of some of the most important ones:• value – The value of the marker in
Another, perhaps simpler solution is to hide the scrollbars with the style:overflow-x: hidden; overflow-y: hidden;• It is possible to remove the defau
ri.set("start", 10);ri.set("value", 40);ri.set("radius", 60);this.gauge.getElement("scale").addIndicator("
In addition to the value and range indicators, we also have the notion of a text indicator. This is responsible for showing a piece of text in the ga
See also:• Dojo GFX documentation – 1.9• Vector graphics with Dojo's GFX• Dive Into Dojo GFXDojo GFX Vector FontsVector fonts are fully scalable
6. Accept the license agreementPage 22
// for us to do.var exists = query("link[href='" + path + "']", headNode);if (exists.length > 0) {return;}// Create t
In the further configuration tab, we can define where we get our Dojo from:If we select a public CDN (Content Delivery Network), we get further option
http://download.dojotoolkit.org/Using the Web Preview Server runtimeThe IID Web Preview Server run-time can be thought of as a non-production Web Serv
It is "tied in" to the IID environment and is manageable from within IID. One of the key features that it provides is the notion of proxyin
Clicking the "Configure Proxy URLs" link takes us to the proxy editor:From here we can define proxy definitions. A proxy definition is defi
Here are some common settings when working with IBM BPM:Context path Target/teamworks/* http://localhost:9080/teamworksNote: as of 8.5, Dojo root can
Using a Source Dojo with IISTo use this with Dojo, consider the following:Download a source distribution of Dojo. The URL for the download is:http://
Dojo MobileDojo provides a package specifically designed for building mobile apps. This package is called "dojox/mobile". This package pro
Dojo Mobile ThemesAn application running on Android needn't (and probably shouldn't) look exactly the same as the same application running o
• transitionDir – A value of 1 means transition forward and a value of -1 means transition backwards• transition – The type of transition animation …
IBM Worklight Studio will now install.7. Eclipse will now restart.See also:• Worklight StudioInstalling an Android SDK Eclipse PluginIf you are going
dojox/mobile/ScrollableViewThe dojox/mobile/ScrollableView is also a View container but unlike the simple dojox/mobile/View it handles scrolling abili
Its key characteristics are:• id – The identity of the view.• selected – True if this is the view to be shown at startup.dojox/mobile/TreeViewThis wid
represents an item in the list. It has a set of visual parameters that are used to set its style:• icon• label• rightText• rightIcon2• rightIconWhen
A closed pane's header has a visually distinctive look than that of an open pane.If a closed pane is opened, all the panes beneath it are pushed
not have a label but normal HTML can added before or after it to add one.Some of the key properties of this widget include:• checked – The current che
variety of other widgets such as Accordion, FixedSplitter and GridLayout.See also:• dojox/mobile/Accordiondojox/mobile/ContentPaneThis widget acts a c
• dojox/mobile/RoundRectList• dojox/mobile/EdgeToEdgeCategorydojox/mobile/EdgeToEdgeStoreListThis widget provides a list whose content is determined f
dojox/mobile/FixedSplitterThis widget is a container that shows its children side by side. The children can be laid out either horizontally or vertic
• moveTo – The view that pressing the back button will take us to. If a "back" label is supplied then moveTo must also be specified.Child T
• moveTo – The name of a view that will be shown if this icon is selected.See also:• dojox/mobile/IconMenudojox/mobile/ListItemThe list item is an ins
4. Define the ADTAs of 2013-11-11 – the location for the plugin is:https://dl-ssl.google.com/android/eclipse/See the following web page for validation
dojox/mobile/PageIndicatorThis widget shows a visual indication of which view from a set of views is currently being shown. Currently it is linked to
See also:• dojox/mobile/CheckBoxdojox/mobile/RatingThis widget provides a rating icon which can be selected.Some of the key properties of this widget
• query• queryOptions• labelProperty• queryProperty• transition – The type of animation to perform when transitioning from one selected child item to
dojox/mobile/RoundRectListThe dojox/mobile/RoundRectList provides a container for list items. The corners of the list are displayed with a rounded ap
dojox/mobile/SearchBoxTBDdojox/mobile/SimpleDialogThis widget provides a dialog container which can be popped up.Some of the key properties for this w
• yearPattern – The coding for the year. The default is "yyyy".• monthPattern – The coding for the month. The default is "MMM".•
The TabBar can also show itself in a variety of different styles through the "barType" property:tabBar (default)segmentedControlstandardTabs
• icon1 – A URL of an icon to show when unselected.• icon2 – A URL of an icon to shown when selected.• badge – A badge to show associated with the but
<input data-dojo-type="dojox/mobile/TextBox"></input>See also:• dojox/mobile/TextAreadojox/mobile/ToggleButtonThis widget provid
◦ below-centeredA companion method called "hide()" will hide a previously shown tooltip.It also appears that to show correctly, a class call
You may see a security warning similar to the following:This is expected and one should select "OK".6. After installation, we install the An
The Value Picker seems to have display problems within the Rich Page Editor. When added, it does not appear to show in the visual canvas.See also:•
See also:• dojox/mobile/ValuePickerdojox/mobile/ValuePickerTimePickerThis widget provides a visual for picking a time.• dojox/mobile/SpinWheelTimePick
jQueryThe JavaScript library called "jQuery" is an alternative to Dojo (of course, one may also say that "Dojo" is an alternative
Chrome Apps are a Google provided framework for building and running Chrome based applications that can be executed in the same fashion as native appl
all the previous technologies.There are many books written on JavaFX and we aren't going to be exhaustive in our coverage of the technology. Rat
javafx.stage.StageWe can loosely think of the stage object as being a representation of the top level window of the application. The stage ties to th
FXML – The JavaFX Markup LanguageWe can create JavaFX applications using standard Java programming techniques such as creating instances of JavaFX obj
to achieve the same effect. Any property of a Java class can be set this way. All properties must start with a lower case letter. As an alternative
The fx:id attributeMost nodes can have an "fx:id". This attribute names a Java variable of the same type of the node. When the FXML is par
<Button text="My Button" onAction="#myHandler"/>Note that in the FXML, the special syntax of "#<function name>&qu
this port number however it is easy to change.Installing Mobile Test Workbench for WorklightInstalling Worklight ServerThe Worklight Server runs on to
Handling issues with Scene BuilderExperience has shown that from time to time, Scene Builder can get confused. When opening FXML files, they have bee
select the Javadoc Location. We can now enter the path to the Javadoc URL on the web:http://docs.oracle.com/javafx/2/api/JavaFX Component SizingWhen
can access this list through the node's "getStyleClass()" method which returns an ObservableList. We can add or remove class names fro
Stage stage = (Stage) closeButton.getScene().getWindow();stage.close();}This will find the stage that contains the close button and close that stage.A
The way to achieve this recipe can be broken down as as follows:When a request to run something expensive arrives on the main thread do the following:
To create a new Task we would code:Task<String> taskInstance = new Task<String>() {@Overrideprotected String call() throws Exception {// D
"javafxpackager" to package that code into a JAR file. This JAR has other artifacts injected into it also. We place this JAR and any other
To add a listener to an ObservableList we can call:myObservableList.addListener(myListChangeListener);The ListChangeListener requires that you impleme
• Styling FX Buttons with CCSJavaFX CheckBoxThe CheckBox widget provides a selectable checkbox. The checkbox may be in one of three possible states:•
JavaFX ComboBoxJavaFX HyperlinkA Hyperlink widget behaves like a button but looks like a browser link.JavaFX ImageViewThe ImageView widget (which is i
suspect that everyone simply says "yeah yeah" and clicks next. Use your own judgment on how to proceed.Installation manager groups installe
JavaFX ListViewThe ListView is a container for a list of items. If there are more items in the list than can be shown, the list scrolls.The items in
JavaFX RadioButtonThe RadioButton provides a selectable button where only one from a group may be selected at one time.JavaFX SeparatorThe Separator w
Callback<P, R>where P and R are Java class types. The "P" parameter is the type of data passed "into" the "call()"
field as a parameter and uses "getFieldName()" and "setFieldName()" methods in the rows to get/setthe value of the cell.For exampl
be set to any nodes you like which will then appear in the table.Again, a TableColumn has a CellFactory and a CellFactory returns a TableCell and a Ta
Now, let us concentrate on just one column:Again, so far so good. Now let us remind ourselves that a table is a window onto the data and that it is v
to set the table to be editable. By default, it is flagged as not editable. We can call:myTable.setEditable(true)to achieve this.There is a lifecycl
TableView object, we can get an ObservableList of TableColumn items using the getColumns() method.JavaFX TextAreaThe TextArea widget provides an area
JavaFX ToggleButtonThe ToggleButton widget provides a button which can be in a "checked" or "unchecked" state with visualization o
Associated with a WebView component is a parallel component called the WebEngine. It is the WebEngine that actually implements the browser and the We
Next we have yet another confirmation page that we are installing Worklight Server.Page 28
JavaFX MenuBarThe menu bar is a container for menus. It is typically seen at the top of an application. A property of this class called "menus&
JavaFX CheckMenuItemJavaFX RadioMenuItemJavaFX CustomMenuItemJavaFX SeparatorMenuItemJavaFX ContextMenuThe ContextMenu is a menu container that can be
JavaFX AnchorPaneJavaFX BorderPaneJavaFX FlowPaneJavaFX GridPaneThe GridPane allows us to layout components within cells. The grid contains rows and
JavaFX TilePaneJavaFX TitledPaneJavaFX VBoxJavaFX Other classesJavaFX PopupJavaFX PopupWindowJavaFX Event HandlingEvent handling is the notion that wh
public void handle(MyEvent myEvent) {// Logic here ...}}And using lambda, this would be:myClass.addEventHandler(MyEvent.MYEVENT_A, event -> {// cod
Scenic ViewThis is a JavaFX application that interrogates the data of a running Java Application.See also:• Scenic ViewSkeleton JavaFX FilesSample app
new components. Here is a skeleton class for just a component. This class both loads the FXML tocreate the meat of the component as well as acting a
• masthead – An area that is optional and immediately below the title• graphic – A graphic image contained within the masthead• content – The primary
2. Create a class that extends org.controlsfx.Dialog.3. Create a default constructor that calls load() (see following)◦ Call the super constructor – e
#LoadModule proxy_module modules/mod_proxy.so#LoadModule proxy_http_module modules/mod_proxy_http.soReverse proxy is controlled by the "ProxyPass
Now we are being offered the opportunity to configure our installation. The first question asks whether or not we wish to install the Application Cen
transformationtype default, xslFilexslFile file nameTo invoke an adapter we create an object which contains an invocationsOptions object:adapter The n
The creation of a Worklight adapter adds some sample Procedures so we delete those. Next, in the Connection Policy we define the host-name and port o
We can supply our security credentials next. These will be the credentials used to access the server:Next we define which type of Security protocol w
Now we are ready to add our first procedure:We provide a name and a display name for our Procedure:Page 293
We can now implement the code in the JavaScript implementation file that will "back" the Procedure. We edit the file called "BPMRest-i
Next we select the Procedure called "processApps" and run it:Page 295
After a few moments, we will see the result of the REST query:What we are seeing is the JSON result from invoking the REST API against the IBM BPM run
Worklight SecurityThe model of Worklight security is that we define an "authentication realm". Think of this as a named set of steps to aut
• What is the _WidgetBase "own()" method?Page 298
Creating a new Adapter...70Adapter Imple
We are now asked what kind of database we wish to use.Page 30
We are now asked for information on how to connect to the database of the type we previously selected. This consists of entering the hostname and por
In order to access the database, we need to specify a user we will use to connect.Page 32
CREATE DATABASE APPCNTR COLLATE USING SYSTEM PAGESIZE 32768Page 33
Now we specify which kind of application server will be used to host the Worklight Server.Page 34
If installing into a WAS ND environment, you must select the Deployment Manager profile.Page 35
Page 36
Page 37
Page 38
The servers hosting Worklight Server should be restarted.Examination seems to show that the following major changes have been made to the App Server a
WL.Client.invokeProcedure(invocationData, options)...107WL.Client.isUserAuthenticated(realm)...
Next we are prompted to read, review and accept the license terms.Page 40
Now we select where on the file system we wish to install the product code. In my example I used C:\IBM\LibertyPage 41
Next we are asked for options to be included in the configuration.Page 42
One final check before install continues.Page 43
And at the end, we have installed the product.Page 44
Other Installation TasksFollowing the installation of Worklight components, other installation tasks may be performed.• Java runtime for browsers – A
Sources of InformationThe InfoCenterIBM's InfoCenter is the primary source for knowledge on Worklight. It is the on-line documentation for the p
application with WebSphere Portal pages – 2013-08-07• Prototype mobile applications built with IBM Worklight for IBM Watson – 2013-08-05• Using the IB
Application DevelopmentWorklight StudioWorklight Studio is the Eclipse based IDE for building Worklight projects. It can be launched by starting the
See also:• Installing Worklight StudioCreating a Worklight ProjectOne of the first things we will do when building a new solution is create a new Work
Android Development...125Installing
Within the project we have a folder called "apps". It is within here that we will have a folder for each individual app within the project.
There are:File Descriptioncommon/css/<App>.csscommon/images/icon.pngcommon/images/thumbnail.pngcommon/js/<App>.jscommon/js/initOptions.jsc
Application DescriptorThe Application Descriptor is an XML file contained within the application portion of the project that has the file name "a
From there, a dialog will be presented where one or more of the target environments can be added:Worklight Development ServerA copy of the Worklight S
supplied and configured with Worklight Studio. It can be seen within the Servers view:The applications deployed to it are also shown.Developing UI –
The editor is full of features and function. Let us try and break some of these down. The primary editing surface takes up the majority of the area.
The implementation of the Rich Page Editor relies on a browser being available on the OS running IBM Worklight Studio. Not all browser types are supp
The next page of the wizard allows us to set the name of the view and specify where within the HTML document the corresponding view will be inserted.P
If we choose to set the view as the default, any previously selected default view will have its defaultattribute removed.Another important window in t
Designing visuallyIn the Rich Page Editor's visual mode, a palette of available HTML and Widgets can be seen in the right hand side of the window
dojo/dom...143dojo/dom-c
item, the position within the document where the item will be inserted is shown. Releasing the mouse will insert the component. In addition to dragg
Off-line StorageOne of the core architectural concepts that distinguish mobile apps from other types of app is that they are only transiently connecte
Within a JSONStore one will find a set of "Documents". This might be a confusing name as they should not be considered documents such as PD
Using the Mobile Browser SimulatorWorklight provides an application which runs in the browser that simulates a device. This can be used to test your
When a browser runs, it provides an identification of what kind of browser and what environment itis running upon to the hosted JavaScript application
Clicking the "Install Browser Extension" will download the installer into the Downloadsfolder of your PC.To manually install this extension
5. A new entry will appear in the Chrome Extensions listDebuggingconsole.log(...)WL.Logger.debug(...)WL.Logger.error(...)See Also• IBM Worklight Tutor
You can now select the ZIP file that was previously exported.Page 67
At the conclusion of this step, a new project can be found which will be the import of the previous export.Page 68
AdaptersIt is very common for a mobile app to interact with back-end systems to retrieve information, request actions to be performed or store new dat
dijit/layout/TabContainer...167dijit/TitlePane...
returns JSON then that data is left as-is. If the data returned is something other than JSON then it isconverted into XML and then an XSL style sheet
Adapter ImplementationAn adapter is implemented by a set of artifacts. To be specific:• An adapter configuration file in XML Within this file, a des
commonly interacting with the back-end server through some other protocol.When we define the adapter, we define one or more procedures that can be cal
• protocol – The network protocol used to connect to the back-end server. The choices areeither "http" or "https". Use http for
Configuring the HTTP Adapter for SSLWhen the HTTP adapter connects to the back-end server it can utilize the HTTP protocol over either plain TCP or SS
Security considerationsNoneReturned data formatXMLWe create a new adapter that we call Senators:We delete the sample procedures associated with it.Nex
At this point we have a defined adapter but no implementation for the server side procedure which calls the back-end service. We open up the "Se
This completes our implementation. We can now test the adapter through Studio by selecting the adapter and running Run As > Invoke Worklight Proce
This shows a dialog in which the procedure name and parameters may be supplied.Clicking the Run button shows us the results of invoking the adapter on
When a JMS adapter is defined, the connection policy looks as follows:In the jmsConnection settings we have entries for:• connectionFactory – The JNDI
Progress Bar...193dojox/calen
• WL.Server.writeJMSMessage(options)• WL.Server.requestReplyJMSMessage(options)SQL AdapterThe SQL adapter allows a Worklight client to execute SQL sta
• Password – The password for the user used to connect to the database.The definitions for the adapter are saved in its XML configuration file called
Calling an adapter from the ClientFrom the client side, we can invoke an adapter with Worklight provided API:WL.Client.invokeProcedure(invocationData,
Error Handling for AdaptersSee also:• developerWorks – Error handling in IBM Worklight adapters - 2012-12-05Invoking Java code from an AdapterWhen an
9. Define an adapter procedure called "getGreeting"10. In the Adapter2Java-impl.js JavaScript file, implement the "getGreeting" fu
13. Examine the response:From the above output we see that the response now contains the text from the code that was executed in Java.See also:• devel
Application CenterAfter you have built your mobile application, your next puzzle will be how to get the application to your users and how to get feedb
Installing the Application Center mobile clientPage 87
Page 88
The installer for Android can be found in the file called:<WorklightServer>/ApplicationCenter/installer/IBMApplicationCenter.apkPage 89
dojox/mobile/EdgeToEdgeStoreList...236dojox/mobile/ExpandingTextArea...
Page 90
See also:• Application Center• Redbook – Enabling Mobile Apps with IBM Worklight Application Center – REDP-5005-00 - 2013-06-11Page 91
PerformanceThe performance of solutions built with Worklight can be improved via a number of different techniques.MinificationWhen a Worklight solutio
• Remove white spaces and comments• Google Closure Compile Simple OptimizationIn addition you can specify while files to include and exclude from the
Secure on-device stored dataThe nature of a mobile device is that … it is mobile. This means it can be carried around with you and, as such, can be l
Cross site REST callsIf you are using the Chrome web browser, it has a command line option called "--disable-web-security" that switches off
db2 SET CURRENT SCHEMA = 'WRKSCHM'db2 -vf <worklight_install_dir>/WorklightServer/databases/create-worklight-db2.sql -t4. Create a dat
Page 97
Page 98
5. Create the Worklight Reports DatasourcePage 99
Comentarios a estos manuales