Difference between revisions of "AppSuite:Writing a simple application with embedded iframe"

(reorder / remove Apps from AppLauncher)
(Provide an iframe for the content area)
Line 24: Line 24:
  
 
     var iframeApp = createIframeApp({
 
     var iframeApp = createIframeApp({
         name: 'com.example',
+
         name: 'com.example', // the name of the app
         title: gt('Hallo, World!'),
+
         title: gt('Hallo, World!'), // the title of the app as used in the launcher
         pageTitle: gt('Hallo, World!'),
+
         pageTitle: gt('Hallo, World!'), // the page Title
         domain: 'https://www.example.com/',
+
         domain: 'https://www.example.com/', // the domain which should be used for the iframe
         cssNamespace: 'hallo_world',
+
         cssNamespace: 'hallo_world', // a css class used for namespacing,
         acquireToken: true
+
         acquireToken: true // generates a login token and appends it to the supplied url
 
     });
 
     });
  
Line 38: Line 38:
 
</pre>
 
</pre>
  
 
The following option for creating the app are available:
 
        name: 'com.example‘, // the name of the app
 
        title: gt('Hallo, World!‘), // the title of the app as used in the AppLauncher
 
        pageTitle: gt('Hallo, World!‘), // the page Title
 
        domain: 'https://www.example.com/', // the domain which should be used for the iframe
 
        cssNamespace: 'hallo_world‘ // a css class used for namespacing,
 
        acquireToken: true // generates a login token and appends it to the supplied url
 
  
 
Make sure you build the app (grunt clean default)
 
Make sure you build the app (grunt clean default)

Revision as of 09:11, 13 May 2015

API status: In Development

Writing a simple application with an embedded iframe

Provide an iframe for the content area

Developing an additional app with an iframe for the content area is quite easy. All it needs is a manifest file manifest.json and the app file main.js.

Both should be located in an designated folder in the apps folder. In this example the namespace 'com.example' will be used. (apps/com.example)

To make use of the provided helper function io.ox/core/tk/iframe has to be required in the define section.

define('com.example/main', [
    'io.ox/core/tk/iframe',
    'gettext!com.example'
], function (createIframeApp, gt) {

    'use strict';

    var iframeApp = createIframeApp({
        name: 'com.example', // the name of the app
        title: gt('Hallo, World!'), // the title of the app as used in the launcher
        pageTitle: gt('Hallo, World!'), // the page Title
        domain: 'https://www.example.com/', // the domain which should be used for the iframe 
        cssNamespace: 'hallo_world', // a css class used for namespacing,
        acquireToken: true // generates a login token and appends it to the supplied url
    });

    return {
        getApp: iframeApp.getApp
    };
});


Make sure you build the app (grunt clean default)

Add app to the launcher

To display an additional App in the AppLauncher, the property 'topbar': true has to be set in the manifest.json file of the app. To define the order, use the index value in the manifest.json file.

{
    "title": "Hallo, World!",
    "company": "external",
    "icon": "/images/icon.png",
    "category": "Dev",
    "settings": false,
    "index": 10000,
    "topbar": true
}

reorder / remove apps from launcher

To define a custom order of the apps or remove an app from the AppLaucher the server-side setting topbar/order can be used to provide a comma-separated list of apps which should be available in the AppLauncher.

Example: io.ox/core//topbar/order=io.ox/mail,io.ox/contacts,io.ox/portal

An app which is not listed here ain’t available in the AppLauncher.