Explore the Sample App
The starter app is a great way to learn about Cloud Apps and the functionality provided by the Cloud Apps API. This section will walk through the starter app to help you understand the features it demonstrates. It will reference the relevant sections of the documentation. For more even more details and demos, see the tutorials section.
Since Cloud Apps are built in Angular, the directory structure of a Cloud App is similar to that of a regular Angular app with some elements hidden to simplify the development process.
The main folder is
cloudapp/src. That folder contains three subfolders:
app: This is where all of you application code will live, including components, services, models. It also contains the standard Angular App component and module.
assets: This is for all of your assets, such as images will live
i18n: This folder contains your strings which can be translated in order to make your app available in additional languages. For more information see the Internationalization tutorial.
The starter app routes to the main component by default. The main component includes the following files:
- component.html: The HTML for the component’s user interface
- component.scss: The styling for the HTML
- component.theme.scss: The styling which relies on the theme settings in Alma. See the Components & Theme tutorial for more information.
- component.ts: The main code file which defines the functionality of the starter app
Starter App Features
This section describes the functionality included in the starter app.
Page Load Listener
One powerful feature of Cloud Apps is the ability to interact with the page which the user has opened in Alma. Based on the open page our Cloud App can inspect the entities and offer additional relevant functionality. In order to provide this interface, we need to receive information about the open page and the entities displayed on that page.
The Event Service includes two ways to retrieve information about the page loaded in Alma: the
getPageMetadata method and the
onPageLoad event. When the main component of our starter app initializes, we subscribe to the
onPageLoad event in order to receive information from Alma about pages as they’re opened.
onPageLoad handler receives a
PageInfo object which includes a list of the open entities on the page. The method sets the
pageEntities local variable which is bound to a text area in the HTML and displayed in the starter app. In addition, if there is one entity listed, we use the
RestService to retrieve additional information about that entity, populate the
apiResult variable, and display the result.
Another powerful feature of Cloud Apps is the ability to call any of the hundreds of REST APIs without the need for additional authentication such as an API key. The APIs are run in the context of the logged-in user and therefore inherit the permissions of that user.
RestService includes a single method:
call. The method takes a link or a full
Request. In our starter app, when the
onPageLoad method sees that there is one entity listed on the open page, it uses the
RestService to call the API for the provided link. The result of the API call is placed in the
apiResult local variable, which is bound to a text area in the HTML and displayed in the starter app.
The API result text area is editable, allowing the user to make changes to the object displayed. When the user clicks the “Update” button, the update method is called. The update method parses the user input and creates a
Request object, setting the
requestBody properties and the method property to PUT (which updates the entity). The request is sent using the call method. If the request fails, we display an error message to the user. If the request succeeds, we call the local
Refresh the page
The Events Service includes a
refreshPage method which can be used to refresh the currently displayed page in Alma. When the refresh completes, we use the
ToastrService to display a success message to the user.
The starter app shows off some of the main building blocks that you can use to learn about Cloud Apps and begin to build your own. You’re now ready to explore the detailed tutorials or the Cloud App API documentation. Enjoy writing your Cloud App to extend the functionality of Alma!