iOS JavaScript API Overview
General Integration Information
Calling Native Functions:
Vablet API functions are called using an interface layer to communicate with our application.
Every function in our API is defined with the format functionName(arg1,arg2,...)
You call the native interface with the function name as the first argument. Followed by the named arguments defined in a JSON object as the second argument. Optionally a callback for status and data to be returned can be defined as the final argument.
So a call to the Vablet Native Interface looks like:
VabletNativeInterface.callNativeMethod('functionName',{'arguments': 'values'},callback)
Example:
Using the definition above with functionName(arg1,arg2), calling this would look like:
VabletNativeInterface.callNativeMethod('functionName',{'arg1': 'x', 'arg2': 'y'}, function (response)
{
if (response.success)
{
// The function returned a success do something
}
else
{
// The function returned a failure do something else
alert(response.error);
}
});
Global Preconditions:
-
You must wait until the Vablet library has finished loading before calling functions. Please see the event section for details on registering for that event.
-
Arguments cannot be null. For optional arguments you do not wish to utilize please leave blank.
Global Returns:
-
success - This is a boolean that indicates whether the function was successful or not
-
error - If the function was unsuccessful, then details on the error are returned here
To use the above return variables you must supply an argument to the callback function which the responses will be attached to.
Events
| Event Name | Description |
|---|---|
| VabletLibraryLoaded | Triggered when the Vablet library has fully loaded. |
| VabletManifestUpdated | Triggered after every manifest update. |
| VabletRequestedPageNumber | Triggered when Vablet requests the current page number. |
Functions
All of the functions listed below are called using the Vablet Native Interface:
VabletNativeInterface.callNativeMethod('functionName',{'arguments': 'values'},callback)
Click on a function name to see it's arguments and a code snippet.
| Function Name | Description |
|---|---|
| addFileIdsToUserFolder | Adds files with ids to the end of the folder list. If the file exists it will be readded in the order given. |
| addFileNamesToUserFolder | Adds files with names to the end of the folder list. If the file exists it will be readded in the order given. |
| changeActiveFolderTo | Changes the active folder, which if using the openfile feature will affect slide behavior. |
| CloseFile | Closes the current file. |
| ConvertHTMLAttachmentToPdfAndSend | Converts HTML data to PDF and emails it. |
| createUserFolder | Creates a new user folder. |
| enableNativeDisplayOfHtmlSelectionForHTMLPaths | A thumbnail bar to select HTML files to go to. This version has automatic handling of swipe gestures. Once enabled swiping up and down will display the menu. |
| endSession | Ends the current SalesForce session, and pops up the event editing screen. |
| getFileWithId | Fetches the meta for a Vablet file via fileId. |
| getFolderFullDataById | Gets the meta data for folder with the folderId supplied. |
| getFolderFullDataByPath | Gets the meta data for folder with the folderPath supplied. |
| getLatestManifest | Starts a manifest update and calls back after the update has finished. |
| GetSalesForceContact | Presents a SalesForce selection screen. Returns selected contact information. |
| getSalesforceContactIfEnabledElseNative | If a salesforce session is active, it obtains a salesforce contact. If a native session is enabled it obtains a native contacts. |
| GetSelectedContactsIndependentOfSessionType | If a salesforce session is active, it obtains salesforce session contacts that were selected. If a native session is enabled it obtains native session contacts that were selected. |
| getThumbnailForFileId | Gets the thumbnail data for the file with the given ID. |
| getXMLForFileId | Gets the XML for the file with the given ID. |
| getXMLForFileName | Gets the XML for the first file with the supplied name in the system. |
| getCSVForFileId | Gets the CSV for the file with the given ID. |
| getCSVForFileName | Gets the CSV for the first file with the supplied name in the system. |
| HideCloseButton | Hides the Vablet close button. |
| hideHtmlSelection | Hides any visible HTML selection bar. |
| presentSalesforceCalendar | Presents the Salesforce event selection calendar. |
| presentSalesforceMenuFromButtonWithId | Presents Vablet's popover from the button specified. |
| reportPageChange | Reports a page change for logging purposes. |
| searchForTerm(searchTerm,enableLiveUpdates) | Searches for a term within the file manifest. Returns an array of file objects. |
| SendEmail | Converts HTML data to PDF and emails it. |
| sendEmailForFiles | Sends Vablet files to the specified emails. |
| setCompletedToTrue | Sets the completed flag in the specified fileId's Media Report to true. |
| showHtmlSelectionForHTMLPaths(htmlPaths) | A thumbnail bar to select HTML files to go to. |
| snapshotCurrentPage | Takes a snapshot of the current page, and presents the user with an email form to send it. |
| startSessionWithSalesforceContactId | Starts a Salesforce session with the specified contactId. |
| startSessionWithoutContact | Starts a session without a contact. |
| SupressFileToolbar | Hides the Vablet bottom toolbar. |
| toggleFavoriteStatusForFileWithId | Toggles the favorite flag for the file, then adds or removes the file from the favorites folder. |
| toggleTagStatusForFileWithId | Toggles the tag flag for the file, then adds or removes the file from the Tagged folder. |
| useVabletGUIToSendEmailForFiles | Presents the Vablet email gui, using the prefilled values specified. Returns success if the email is queued or sent. |
Classes
These are actual javascript classes, and used as described. Note that this is not converted to VabletNativeInterface.callNativeMethod, they are as is
VabletFormTools
VabletForm tools is a collection of tools for form processing and interaction with Vablet API taken care of for you. These are actual class and function calls, and are called as listed. All methods below are class functions for VabletFormTools and are called like a normal Javascript function.
Syntax: VabletFormTools.classFunction(arguments)
Click on class function to see it's argument list and code snippet.
| Class Function | Description |
|---|---|
| bakePageFormAndSendAsPDF | Converts form, and special Vablet elements on the page to text and image elements to 'bake' them in. Then creates and emails a PDF from the baked page. |
| bakePageFormAndSaveToBox | Converts form, and special Vablet elements on the page to text and image elements to 'bake' them in. Then uploads this to box. Existing files with same name are not overwritten. |
| sendFormAsSurvey | Submits form to Vablet as Survey for Capture |
Settings
Optional global special settings can be configured in VabletLoadSettings.json. This file must be put into the root of the ZHTML file where the index.html should have been placed and not inside any subfolders. The settings apply to all the pages in the ZHTML file.
The file should not be rich text and should be a plain text utf-8 format.
The settings are specified with a JSON object with all the configuration options their own keys
Example content of VabletLoadSettings.json:
{"disableBounce":true, "scaleToFitPage":true, "disableStatusBar":true, "useTransparentBar":false, "hideToolBar":true}
The above settings we use in almost all of our projects. It will disable screen bounce, scale to always fit the screen size, disable both the opaque and transparent Apple status bars, and hide the Vablet toolbar.
Settings List:
| Setting | Description |
|---|---|
| disableBounce | The default iOS bounce effect is disabled. |
| disableFileSwitchSwimlane | Disables the Vablet Swimlane function. |
| disableStatusBar | Disables the status bar at the top of the iDevice. |
| hideClose | The bottom of the page contains a red close button. Setting this to true removes that button. |
| hideToolBar | The bottom of the page contains a Vablet toolbar, when set to true that toolbar is disabled. |
| scaleToFitPage | The webpage is automatically shrunk to fit into the view. |
| useTransparentBar | The top of the page uses the default transparent bar rather than pushing down content. |
Links
Vablet Links:
These links start with VabletGeneral:// and are used to perform actions within Vablet. A few of these Vablet actions have optional parameters that can be passed in via query string.
Syntax:
VabletGeneral://action?optionalParameters
| Link Action | Description |
|---|---|
| home | Goes to the currently set home folder, normally root unless it has been customized. |
| openFile | Opens a Vablet file by ID. |
| openFileName | Opens a Vablet file by name. |
| openFileNameInPowerPoint | Opens a Vablet file by name into PowerPoint. |
| openFolder | Opens the specified folder in Vablet. |
| register | Allows prefilling of the registration screen. |
| salesForceSessionStartWithEvent | Starts a Salesforce session, with an existing event if provided uses an editing GUI when session ends |
| salesForceSessionStartWithEventNoEditing | Starts a Salesforce session, with an existing event if provided, no GUI is used |
External Links:
To open an external link in the default device web browser use the following.
Syntax:
- externalBrowserHttp://website.url for http://
- externalBrowserHttps://website.url for https://