The Domain Manager view that shows details of a domain (domain profile) must show if the application service (VPS in our scenario) is bound to the domain and it must allow a customer to run the application tools, such as:
Create resources bound to the domain
Remove all application resources linked to a domain
Show a list of all application resources
In this document:
In meta description, you added the ui/plugins/DomainInfoPlugin.js
file as the source
that provides information about the application services in a domain profile presented in a tile. In this project, let us
provide a menu to select an operation, such as
Go to VPSes or Remove Servers. A click on the tile itself must run the custom VPS creation wizard.
The Domain Manager passes the mediator
module to the view-plugin and expects from the latter the definition
of the mediator.setServiceData(data)
function.
When calling the mediator.setServiceData(data)
, the Domain Manager provides the data
argument
that contains the presentation of the selected domain as defined by the PAHostedDomain type.
In addition, it contains data.services
- a list of all services assigned to the domain.
The mediator.setServiceData(data)
function must return a UI tile containing the data and menu
to be displayed and used in the domain profile.
Continue the demo project from the previous step.
When creating the script from scratch in the ui/plugins/DomainInfoPlugin.js
file, follow these steps:
Create the script skeleton:
define([
"dojo/_base/declare",
"dojo/promise/all",
"aps/xhr",
"aps/Memory",
"aps/Tile",
"aps/nav/ViewPlugin",
"aps/Output",
"aps/FieldSet"
], function (declare, all, xhr, Memory, Tile, ViewPlugin, Output, FieldSet) {
/* Define the function that removes all servers linked with a domain */
function removeService(tile, domainApsId, vpses) {
}
return declare(ViewPlugin, {
init: function (mediator) {
/* Main function for the Domain Manager */
mediator.setServiceData = function(data) {
/* Initialize internal variables */
/* Initialize the tile */
/* Fill in the tile with the list of assigned servers and a menu */
return tile;
}; // End of mediator.setServiceData
} // End of Init
}); // End of Declare
}); // End of Define
Define a function that removes all application servers linked with a domain.
function removeService(tile, domainApsId, vpses) {
tile.set("isBusy", true);
/* Remove all VPSes through the APS controller */
all(vpses.data.map(function(vps) {
return xhr('/aps/2/resources/' + vps.aps.id, {
method: 'DELETE'
});
})).then(function () {
tile.removeAll();
tile.set({
/* Enable the customer to create a new VPS */
onClick: function() {
aps.apsc.gotoView("http://aps-standard.org/samples/dns1p#vps-wizard",
null,
{ domainApsId: domainApsId } // You may send more parameters
); // In the destination view, they are available as aps.context.params
},
isBusy: false
});
tile.addChild(new Output({"value": "Click to create a VPS bound to the domain"}));
});
}
Later, you will add a menu item in the tile that will call this function.
The function requests the APS controller to remove all VPSes listed in one of the arguments.
Once this is done, it clears the tile content and then
provides a way to the create again a VPS bound to the domain
identified by its APS ID - domainApsId
.
Note
If you remove a domain using the Domain Manager, all VPSes linked to the domain will be removed automatically since they implement the PADomainService type that requires a link with a domain.
In the mediator.setServiceData(data)
function, initialize internal variables.
The Domain Manager must call the mediator.setServiceData(data)
function
that must be defined in this view-plugin. The view-plugin gets the data
argument that represent the domain
as defined in the PAHostedDomain type and a list of assigned services in its data.services
structure.
Declare a cache that you will use for collecting a list of VPSes assigned to the selected domain:
var vpses = new Memory({data: [], idProperty: "aps.id"});
Collect domain and VPS service data that might be needed in various functions:
var domainData = {
serviceName: "Virtual Server", // Name of the service in Domain tile
domainApsId: data.aps.id,
domainName: data.name,
status: "Not Assigned"
};
Declare and initialize the tile.
Declare the tile and make it redirect users to the VPS creation view if they click on the tile:
var tile = new Tile({
title: domainData.serviceName,
onClick: function() {
aps.apsc.gotoView("http://aps-standard.org/samples/dns1p#vps-wizard",
null,
{
domainApsId: domainData.domainApsId
});
}
});
Print out the invitation to click on the tile.
tile.addChild(new Output({
value: "Click to host a VPS on this domain"
}));
For the sake of performance, close the function and return the initial tile if there is no services to process.
if (!data.services || data.services.length === 0) {
return tile;
}
Fill in the tile with the list of assigned servers.
From the full list of all services hosted on the domain, collect the list of hosted VPSes:
data.services.forEach(function (service) {
if(service.aps.type === "http://aps-standard.org/samples/dns1p/vps/1.0") {
vpses.data.push(service);
}
});
In the tile, add the name of each assigned VPS to the list of servers:
if(vpses.data.length > 0) {
domainData.status = "Assigned";
var container = new FieldSet({title: "Assigned services: "});
vpses.data.forEach( function(vps) {
container.addChild(new Output({
content: "VPS name: ${value}",
value: vps.name
}));
});
tile.addChild(container);
// Context menu will be here
}
In the tile, add the menu with two items. The former item will direct users to the list of VPSes and the latter one will allow users to remove the selected domain.
tile.set("buttons", [
{
icon: "fa-times-circle",
label: "Go to VPS list",
onClick: function () {
aps.apsc.gotoView("http://aps-standard.org/samples/dns1p#servers");
}
},
{
icon: "fa-times-circle",
label: "Remove Servers",
onClick: function () {
removeService(tile, domainData.domainApsId, vpses);
}
}
]);
On completion of this step, you have the application integrated into the domain profile presented by the Domain Manager.
The project file you have created is similar to the respective file in the
sample package
.
You have completed development of the APS application. Follow the next steps to test the application functionality on your test platform.