' +
' Error: {{communicationError}}' +
@@ -24,74 +20,73 @@ define([
' ' +
- ' ' +
- ' ' +
- ' ' +
- ' ' +
- ' ',
+
+ template:
+ '' +
+ ' ' +
+ ' ' +
+ ' ' +
+ ' ' +
+ ' ',
+
data: function () {
- var self = this;
- return {
- table: {
- headers: ["ID", "Username"],
- rows: [],
- globalActions: [
- {
- label: "Create New Entry",
- callback: function() { self.newUserDialog.show = true; }
- }
- ],
- rowActions: [
- {
- label: "Policies",
- callback: this.showPolicyAction,
- type: "info"
+ var self = this;
+ return {
+ table: {
+ headers: ["ID", "Username"],
+ rows: [],
+ globalActions: [{
+ label: "Create New Entry",
+ callback: function() { self.newUserDialog.show = true; }
+ }],
+ rowActions: [{
+ label: "Policies",
+ callback: this.showPolicyAction,
+ type: "info"
+ }, {
+ label: "Remove",
+ callback: this.removeAction
+ }]
},
- {
- label: "Remove",
- callback: this.removeAction
- }
- ]
- },
- users: [],
- newUserDialog: {
- show: false
- },
- removeUserDialog: {
- show: false,
- userToRemove: {
- id: null,
- name: ""
- }
- },
- communicationError: null
- };
+ users: [],
+ newUserDialog: {
+ show: false
+ },
+ removeUserDialog: {
+ show: false,
+ userToRemove: {
+ id: null,
+ name: ""
+ }
+ },
+ communicationError: null
+ };
},
+
mounted: function () {
- this.updateTable();
+ this.updateTable();
},
+
methods: {
- updateTable: function() {
- var self = this;
- this.communicationError = null;
- resources.User.items()
- .done(
- function (identifiers, items) {
- self.table.rows = [];
- identifiers.forEach(function(id) {
- var item = items[id];
- self.table.rows.push([
- id,
- item.name
- ]);
+ updateTable: function() {
+ var self = this;
+ this.communicationError = null;
+ resources.User.items()
+ .done(function (identifiers, items){
+ self.table.rows = [];
+ identifiers.forEach(function(id) {
+ var item = items[id];
+ self.table.rows.push([
+ id,
+ item.name
+ ]);
+ });
+ })
+ .fail(function () {
+ self.communicationError = "The request could not be executed successfully";
});
- })
- .fail(
- function () {
- self.communicationError = "The request could not be executed successfully";
- });
- },
- newUserCreated: function() {
- this.newUserDialog.show = false;
- this.updateTable();
- },
- showPolicyAction: function(row) {
- this.$router.push({
- name: 'user_accounting',
- params: { id: row[0] }
- });
- },
- removeAction: function(row) {
- this.removeUserDialog.userToRemove.id = row[0];
- this.removeUserDialog.userToRemove.name = row[1];
- this.removeUserDialog.show = true;
- },
- closeRemoveUserDialog: function() {
- this.removeUserDialog.show = false;
- this.removeUserDialog.userToRemove = {
- id: null,
- name: ""
- };
- },
- removeUser: function () {
- var self = this;
- resources.User.delete(this.removeUserDialog.userToRemove.id)
- .done(function () {
- self.closeRemoveUserDialog();
- self.updateTable();
- }
- )
- .fail(
- function () {
- self.closeRemoveUserDialog();
- }
- );
- }
+ },
+
+ newUserCreated: function() {
+ this.newUserDialog.show = false;
+ this.updateTable();
+ },
+
+ showPolicyAction: function(row) {
+ this.$router.push({
+ name: 'user_accounting',
+ params: { id: row[0] }
+ });
+ },
+
+ removeAction: function(row) {
+ this.removeUserDialog.userToRemove.id = row[0];
+ this.removeUserDialog.userToRemove.name = row[1];
+ this.removeUserDialog.show = true;
+ },
+
+ closeRemoveUserDialog: function() {
+ this.removeUserDialog.show = false;
+ this.removeUserDialog.userToRemove = {
+ id: null,
+ name: ""
+ };
+ },
+
+ removeUser: function () {
+ var self = this;
+ resources.User.delete(this.removeUserDialog.userToRemove.id)
+ .done(function() {
+ self.closeRemoveUserDialog();
+ self.updateTable();
+ })
+ .fail(function() {
+ self.closeRemoveUserDialog();
+ });
+ }
}
- };
-});
+};
diff --git a/remoteappmanager/static/js/admin/vue-components/accounting/NewAccountingDialog.js b/remoteappmanager/static/js/admin/vue-components/accounting/NewAccountingDialog.js
index 5f5bd5633..2da67a9df 100644
--- a/remoteappmanager/static/js/admin/vue-components/accounting/NewAccountingDialog.js
+++ b/remoteappmanager/static/js/admin/vue-components/accounting/NewAccountingDialog.js
@@ -1,152 +1,150 @@
-define([
- "components/vue/dist/vue",
- "jsapi/v1/resources"
-], function(Vue, resources) {
- "use strict";
+var resources = require("admin-resources");
- return {
+module.exports = {
template:
- ' ' +
- ' ' +
- ' ',
+ ' ' +
+ ' ' +
+ ' ',
+
props: ['show', "userId"],
+
data: function () {
- return {
- formstate: {},
- crossValidationError: false,
- communicationError: null,
- model: {
- image_name: '',
- allow_home: false,
- volume_source: '',
- volume_target: '',
- volume_readonly: false,
- volume_source_target: []
- }
- };
+ return {
+ formstate: {},
+ crossValidationError: false,
+ communicationError: null,
+ model: {
+ image_name: '',
+ allow_home: false,
+ volume_source: '',
+ volume_target: '',
+ volume_readonly: false,
+ volume_source_target: []
+ }
+ };
},
+
methods: {
- close: function () {
- this.$emit('closed');
- },
- fieldClassName: function (field) {
- if (!field) {
- return '';
- }
- if ((field.$dirty || field.$submitted) && field.$invalid) {
- return 'has-error';
- } else {
- return '';
- }
- },
- createNewAccounting: function () {
- var model = this.model;
- var formstate = this.formstate;
+ close: function () {
+ this.$emit('closed');
+ },
- if (formstate.$invalid) {
- return;
- }
- if ((model.volume_source.length === 0 && model.volume_target.length !== 0) ||
- (model.volume_source.length !== 0 && model.volume_target.length === 0)) {
- this.crossValidationError = true;
- return;
- }
+ fieldClassName: function (field) {
+ if (!field) {
+ return '';
+ }
+ if ((field.$dirty || field.$submitted) && field.$invalid) {
+ return 'has-error';
+ } else {
+ return '';
+ }
+ },
- var rep = {
- user_id: this.userId,
- image_name: this.model.image_name,
- allow_home: this.model.allow_home,
- volume_source: this.model.volume_source,
- volume_target: this.model.volume_target,
- volume_mode: (model.volume_readonly ? "ro" : "rw")
- };
+ createNewAccounting: function () {
+ var model = this.model;
+ var formstate = this.formstate;
+
+ if (formstate.$invalid) {
+ return;
+ }
+ if ((model.volume_source.length === 0 && model.volume_target.length !== 0) ||
+ (model.volume_source.length !== 0 && model.volume_target.length === 0)) {
+ this.crossValidationError = true;
+ return;
+ }
+
+ var rep = {
+ user_id: this.userId,
+ image_name: this.model.image_name,
+ allow_home: this.model.allow_home,
+ volume_source: this.model.volume_source,
+ volume_target: this.model.volume_target,
+ volume_mode: (model.volume_readonly ? "ro" : "rw")
+ };
- resources.Accounting.create(rep)
- .done((
- function () {
- this.$emit('created');
- }).bind(this)
- )
- .fail(
- (function () {
- this.communicationError = "The request could not be executed successfully";
- }).bind(this)
- );
+ resources.Accounting.create(rep)
+ .done(function () {
+ this.$emit('created');
+ }.bind(this))
+ .fail(function () {
+ this.communicationError = "The request could not be executed successfully";
+ }.bind(this));
+ },
- },
- reset: function () {
- Object.assign(this.$data, this.$options.data());
- },
- validatePath: function(value) {
- return (value.length === 0 || value[0] === '/');
- }
+ reset: function () {
+ Object.assign(this.$data, this.$options.data());
+ },
+
+ validatePath: function(value) {
+ return (value.length === 0 || value[0] === '/');
+ }
},
+
watch: {
- "show": function (value) {
- if (value) {
- this.reset();
+ "show": function (value) {
+ if (value) {
+ this.reset();
+ }
+ },
+ "model.volume_source": function() {
+ delete this.formstate.volume_source.$error.volumesInconsistent;
+ delete this.formstate.volume_target.$error.volumesInconsistent;
+ },
+ "model.volume_target": function() {
+ delete this.formstate.volume_source.$error.volumesInconsistent;
+ delete this.formstate.volume_target.$error.volumesInconsistent;
}
- },
- "model.volume_source": function() {
- delete this.formstate.volume_source.$error.volumesInconsistent;
- delete this.formstate.volume_target.$error.volumesInconsistent;
- },
- "model.volume_target": function() {
- delete this.formstate.volume_source.$error.volumesInconsistent;
- delete this.formstate.volume_target.$error.volumesInconsistent;
- }
}
- };
-});
+};
diff --git a/remoteappmanager/static/js/admin/vue-components/applications/NewApplicationDialog.js b/remoteappmanager/static/js/admin/vue-components/applications/NewApplicationDialog.js
index 85986671d..85f45aa72 100644
--- a/remoteappmanager/static/js/admin/vue-components/applications/NewApplicationDialog.js
+++ b/remoteappmanager/static/js/admin/vue-components/applications/NewApplicationDialog.js
@@ -1,83 +1,80 @@
-define([
- "components/vue/dist/vue",
- "jsapi/v1/resources"
-], function(Vue, resources) {
- "use strict";
+var resources = require("admin-resources");
- return {
+module.exports = {
template:
- ' ' +
- ' ' +
- ' ',
+ ' ' +
+ ' ' +
+ ' ',
+
props: ['show'],
data: function () {
- return {
- formstate: {},
- communicationError: null,
- model: {
- name: ''
- }
- };
+ return {
+ formstate: {},
+ communicationError: null,
+ model: {
+ name: ''
+ }
+ };
},
+
methods: {
- close: function () {
- this.$emit('closed');
- },
- fieldClassName: function (field) {
- if (!field) {
- return '';
- }
- if ((field.$touched || field.$submitted) && field.$invalid) {
- return 'has-error';
- } else {
- return '';
- }
- },
- createNewApplication: function () {
- if (!this.formstate.$valid) {
- return;
+ close: function () {
+ this.$emit('closed');
+ },
+
+ fieldClassName: function (field) {
+ if (!field) {
+ return '';
+ }
+ if ((field.$touched || field.$submitted) && field.$invalid) {
+ return 'has-error';
+ } else {
+ return '';
+ }
+ },
+
+ createNewApplication: function () {
+ if (!this.formstate.$valid) {
+ return;
+ }
+ resources.Application.create({image_name: this.model.name})
+ .done(function () {
+ this.$emit('created');
+ }.bind(this))
+ .fail(function () {
+ this.communicationError = "The request could not be executed successfully";
+ }.bind(this));
+ },
+
+ reset: function () {
+ Object.assign(this.$data, this.$options.data());
}
- resources.Application.create({image_name: this.model.name})
- .done((
- function () {
- this.$emit('created');
- }).bind(this)
- )
- .fail(
- (function () {
- this.communicationError = "The request could not be executed successfully";
- }).bind(this)
- );
- },
- reset: function () {
- Object.assign(this.$data, this.$options.data());
- }
},
+
watch: {
- "show": function (value) {
- if (value) {
- this.reset();
+ "show": function (value) {
+ if (value) {
+ this.reset();
+ }
}
- }
}
- };
-});
+};
diff --git a/remoteappmanager/static/js/admin/vue-components/toolkit/AdminLTEBox.js b/remoteappmanager/static/js/admin/vue-components/toolkit/AdminLTEBox.js
index 4d4b7b167..83aa72b84 100644
--- a/remoteappmanager/static/js/admin/vue-components/toolkit/AdminLTEBox.js
+++ b/remoteappmanager/static/js/admin/vue-components/toolkit/AdminLTEBox.js
@@ -1,23 +1,17 @@
-define([
-], function() {
- "use strict";
-
- return {
+module.exports = {
props: {
- title: {
- type: String,
- default: "Box"
- }
+ title: {
+ type: String,
+ default: "Box"
+ }
},
template:
- ' ' +
- ' '
- };
-});
+ ' ' +
- ' '
- };
-});
+ ' ' +
' ' +
@@ -24,56 +20,57 @@ define([
' ' +
'
' +
'',
+
props: ['show'],
data: function () {
- return {
- formstate: {},
- model: {
- name: ''
- }
- };
+ return {
+ formstate: {},
+ model: {
+ name: ''
+ }
+ };
},
+
methods: {
- close: function () {
- this.$emit('closed');
- },
- fieldClassName: function (field) {
- if (!field) {
- return '';
- }
- if ((field.$touched || field.$submitted) && field.$invalid) {
- return 'has-error';
- } else {
- return '';
- }
- },
- createNewUser: function () {
- if (!this.formstate.$valid) {
- return;
+ close: function () {
+ this.$emit('closed');
+ },
+
+ fieldClassName: function (field) {
+ if (!field) {
+ return '';
+ }
+ if ((field.$touched || field.$submitted) && field.$invalid) {
+ return 'has-error';
+ } else {
+ return '';
+ }
+ },
+
+ createNewUser: function () {
+ if (!this.formstate.$valid) {
+ return;
+ }
+ resources.User.create({name: this.model.name})
+ .done((function () {
+ this.$emit('created');
+ }).bind(this))
+ .fail(function () {
+ this.$emit("closed");
+ }.bind(this));
+ },
+
+ reset: function () {
+ Object.assign(this.$data, this.$options.data());
}
- resources.User.create({name: this.model.name})
- .done((
- function () {
- this.$emit('created');
- }).bind(this)
- )
- .fail(
- (function () {
- this.$emit("closed");
- }).bind(this)
- );
- },
- reset: function () {
- Object.assign(this.$data, this.$options.data());
- }
},
+
watch: {
- "show": function (value) {
- if (value) {
- this.reset();
+ "show": function (value) {
+ if (value) {
+ this.reset();
+ }
}
- }
}
- };
-});
+};
diff --git a/remoteappmanager/static/js/gamodule.js b/remoteappmanager/static/js/gamodule.js
index 09be666ed..cd71bd96e 100644
--- a/remoteappmanager/static/js/gamodule.js
+++ b/remoteappmanager/static/js/gamodule.js
@@ -1,35 +1,32 @@
// This module contains the setup for google analytics.
// MUST not be renamed to analytics. Some blockers rely on name
// matching to prevent loading.
-define([], function () {
- "use strict";
- function init() {
- if (window.apidata.analytics !== undefined) {
- window.ga('create', window.apidata.analytics.tracking_id, 'auto');
- } else {
- window.ga = function() {};
- }
-
- return function() {
- window.ga.apply(this, arguments);
- };
+function init() {
+ if (window.apidata.analytics !== undefined) {
+ window.ga('create', window.apidata.analytics.tracking_id, 'auto');
+ } else {
+ window.ga = function() {};
}
- var GaObserver = function() {
- this.ga = init();
+ return function() {
+ window.ga.apply(this, arguments);
};
+}
- GaObserver.prototype.triggerApplicationStarting = function(name) {
- this.ga("send", "event", {
- eventCategory: "Application",
- eventAction: "start",
- eventLabel: name
- });
- };
+var GaObserver = function() {
+ this.ga = init();
+};
- return {
- init: init, // For testing purpose
- GaObserver: GaObserver
- };
-});
+GaObserver.prototype.triggerApplicationStarting = function(name) {
+ this.ga("send", "event", {
+ eventCategory: "Application",
+ eventAction: "start",
+ eventLabel: name
+ });
+};
+
+module.exports = {
+ init: init, // For testing purpose
+ GaObserver: GaObserver
+};
diff --git a/remoteappmanager/static/js/home-resources.js b/remoteappmanager/static/js/home-resources.js
new file mode 100644
index 000000000..c5060fefd
--- /dev/null
+++ b/remoteappmanager/static/js/home-resources.js
@@ -0,0 +1,313 @@
+var $ = require("jquery");
+var urlUtils = require("urlutils");
+var utils = require("utils");
+
+var object_to_query_args = function (obj) {
+ var keys = Object.keys(obj);
+ if (keys.length === 0) {
+ return "";
+ }
+
+ var result = [];
+ for (var idx in keys) {
+ var key = keys[idx];
+ var value = obj[key];
+ var key_enc = encodeURIComponent(key);
+ if ($.isArray(value)) {
+ for (var v in value) {
+ result.push(key_enc+"="+encodeURIComponent(v));
+ }
+ } else {
+ result.push(key_enc+"="+encodeURIComponent(value));
+ }
+ }
+
+ return result.join("&");
+};
+
+var API = (function () {
+ // Object representing the interface to the Web API.
+ // @param base_url : the url at which to find the web API endpoint.
+ var self = {};
+ self.base_urlpath = "/user/test/";
+ self.default_options = {
+ contentType: "application/json",
+ cache: false,
+ dataType : null,
+ processData: false,
+ success: null,
+ error: null
+ };
+
+ self.request = function (req_type, endpoint, body, query_args) {
+ // Performs a request to the final endpoint
+ var options = {};
+ utils.update(options, self.default_options);
+ utils.update(options, {
+ type: req_type,
+ data: body
+ });
+
+ var url = urlUtils.pathJoin(
+ self.base_urlpath,
+ "api", "v1",
+ urlUtils.encodeUriComponents(endpoint)
+ )+'/';
+
+ if (query_args) {
+ url = url + "?" + object_to_query_args(query_args);
+ }
+ return $.ajax(url, options);
+ };
+ return self;
+})();
+
+var RestError = function(code, message) {
+ console.log("Creating error "+code+" message: "+message);
+ this.code = code;
+ this.message = message;
+};
+
+var fail_handler = function(promise, jqXHR) {
+ var status = jqXHR.status;
+ var payload = null;
+ try {
+ payload = JSON.parse(jqXHR.responseText);
+ } catch (e) {
+ // Suppress any syntax error and discard the payload
+ }
+
+ var err = new RestError(status, "");
+ if (payload !== null) {
+ utils.update(err, payload);
+ }
+ promise.reject(err);
+};
+
+var create_handler = function(promise, data, textStatus, jqXHR) {
+ var status = jqXHR.status;
+
+ var payload = null;
+ try {
+ payload = JSON.parse(data);
+ } catch (e) {
+ // Suppress any syntax error and discard the payload
+ }
+
+ if (status !== 201) {
+ // Strange situation in which the call succeeded, but
+ // not with a 201. Just do our best.
+ console.log(
+ "Create succeded but response with status " +
+ status +
+ " instead of 201."
+ );
+ promise.reject(status, payload);
+ return;
+ }
+
+ var id, location;
+ try {
+ location = jqXHR.getResponseHeader('Location');
+ var url = urlUtils.parse(location);
+ var arr = url.pathname.replace(/\/$/, "").split('/');
+ id = arr[arr.length - 1];
+ } catch (e) {
+ console.log("Response had invalid or absent Location header");
+ promise.reject(status, payload);
+ return;
+ }
+ promise.resolve(id, location);
+};
+
+var update_handler = function(promise, data, textStatus, jqXHR) {
+ var status = jqXHR.status;
+
+ var payload = null;
+ try {
+ payload = JSON.parse(data);
+ } catch (e) {
+ // Suppress any syntax error and discard the payload
+ }
+
+ if (status !== 204) {
+ // Strange situation in which the call succeeded, but
+ // not with a 201. Just do our best.
+ console.log(
+ "Update succeded but response with status " +
+ status +
+ " instead of 204."
+ );
+ promise.reject(status, payload);
+ return;
+ }
+
+ promise.resolve();
+};
+
+var delete_handler = function(promise, data, textStatus, jqXHR) {
+ var status = jqXHR.status;
+ var payload = null;
+ try {
+ payload = JSON.parse(data);
+ } catch (e) {
+ // Suppress any syntax error and discard the payload
+ }
+
+ if (status !== 204) {
+ console.log(
+ "Delete succeded but response with status " +
+ status +
+ " instead of 204."
+ );
+ promise.reject(status, payload);
+ return;
+ }
+ promise.resolve();
+};
+
+var retrieve_handler = function(promise, data, textStatus, jqXHR) {
+ var status = jqXHR.status;
+
+ var payload = null;
+ try {
+ payload = JSON.parse(jqXHR.responseText);
+ } catch (e) {
+ // Suppress any syntax error and discard the payload
+ }
+
+ if (status !== 200) {
+ console.log(
+ "Retrieve succeded but response with status " +
+ status +
+ " instead of 200."
+ );
+ promise.reject(status, payload);
+ return;
+ }
+
+ if (payload === null) {
+ console.log(
+ "Retrieve succeded but empty or invalid payload"
+ );
+ promise.reject(status, payload);
+ return;
+ }
+
+ promise.resolve(payload);
+};
+
+var Resource = function(type) {
+ this.type = type;
+
+ this.create = function(representation, query_args) {
+ var body = JSON.stringify(representation);
+ var promise = $.Deferred();
+
+ API.request("POST", type, body, query_args)
+ .done(function(data, textStatus, jqXHR) {
+ create_handler(promise, data, textStatus, jqXHR);
+ })
+ .fail(function(jqXHR) {
+ fail_handler(promise, jqXHR);
+ });
+
+ return promise;
+ };
+
+ this.update = function(id, representation, query_args) {
+ var body = JSON.stringify(representation);
+ var promise = $.Deferred();
+
+ API.request("PUT", urlUtils.pathJoin(type, id), body, query_args)
+ .done(function(data, textStatus, jqXHR) {
+ update_handler(promise, data, textStatus, jqXHR);
+ }
+ )
+ .fail(function(jqXHR) {
+ fail_handler(promise, jqXHR);
+ });
+
+ return promise;
+ };
+
+ this.delete = function(id, query_args) {
+ var promise = $.Deferred();
+
+ API.request("DELETE", urlUtils.pathJoin(type, id), null, query_args)
+ .done(function(data, textStatus, jqXHR) {
+ delete_handler(promise, data, textStatus, jqXHR);
+ }
+ )
+ .fail(function(jqXHR) {
+ fail_handler(promise, jqXHR);
+ });
+
+ return promise;
+ };
+
+ this.retrieve = function(id, query_args) {
+ var promise = $.Deferred();
+
+ API.request("GET", urlUtils.pathJoin(type, id), null, query_args)
+ .done(function(data, textStatus, jqXHR) {
+ retrieve_handler(promise, data, textStatus, jqXHR);
+ }
+ )
+ .fail(function(jqXHR) {
+ fail_handler(promise, jqXHR);
+ });
+
+ return promise;
+ };
+
+ this.items = function(query_args) {
+ var promise = $.Deferred();
+
+ API.request("GET", type, null, query_args)
+ .done(function(data, textStatus, jqXHR) {
+ var status = jqXHR.status;
+
+ var payload = null;
+ try {
+ payload = JSON.parse(jqXHR.responseText);
+ } catch (e) {
+ // Suppress any syntax error and discard the payload
+ }
+
+ if (status !== 200) {
+ console.log(
+ "Items retrieve succeded but response with status " +
+ status +
+ " instead of 200."
+ );
+ promise.reject(status, payload);
+ return;
+ }
+
+ if (payload === null) {
+ console.log(
+ "Items Retrieve succeded but empty or invalid payload"
+ );
+ promise.reject(status, payload);
+ return;
+ }
+
+ promise.resolve(
+ payload.identifiers,
+ payload.items,
+ payload.offset,
+ payload.total);
+ })
+ .fail(function(jqXHR) {
+ fail_handler(promise, jqXHR);
+ });
+
+ return promise;
+ };
+};
+
+module.exports = {
+ "Container" : new Resource("containers"),
+ "Application" : new Resource("applications"),
+};
diff --git a/remoteappmanager/static/js/home/configurables.js b/remoteappmanager/static/js/home/configurables.js
index 4f4e8902e..1a1f20e83 100644
--- a/remoteappmanager/static/js/home/configurables.js
+++ b/remoteappmanager/static/js/home/configurables.js
@@ -1,61 +1,57 @@
-define([
- "utils",
- "components/vue/dist/vue"
-], function(utils, Vue) {
- "use strict";
-
- var resolutionTag = 'resolution';
- var resolutionComponent = Vue.component(resolutionTag + '-component', {
- // Your configurable must have a "configDict" property from the model
- props: ['configDict'],
-
- template:
- 'Do you want to stop container {{ stopContainerDialog.containerToStop }}?
' +
' ' +
'',
- data: function () {
+
+ data: function () {
return {
- table: {
- headers: ["URL ID", "User", "Image", "Docker ID", "Mapping ID"],
- rows: [],
- rowActions: [
- {
- label: "Stop",
- callback: this.stopAction
- }
- ]
- },
- stopContainerDialog: {
- show: false,
- containerToStop: null
- },
- communicationError: null
+ table: {
+ headers: ["URL ID", "User", "Image", "Docker ID", "Mapping ID"],
+ rows: [],
+ rowActions: [{
+ label: "Stop",
+ callback: this.stopAction
+ }]
+ },
+ stopContainerDialog: {
+ show: false,
+ containerToStop: null
+ },
+ communicationError: null
};
- },
- mounted: function () {
+ },
+
+ mounted: function () {
this.updateTable();
- },
- methods: {
+ },
+
+ methods: {
updateTable: function() {
- var self = this;
- this.communicationError = null;
- resources.Container.items()
- .done(
- function (identifiers, items) {
+ var self = this;
+ this.communicationError = null;
+ resources.Container.items()
+ .done(function (identifiers, items) {
self.table.rows = [];
identifiers.forEach(function(id) {
- var item = items[id];
- self.table.rows.push([
- id,
- item.user,
- item.image_name,
- item.docker_id,
- item.mapping_id]);
+ var item = items[id];
+ self.table.rows.push([
+ id,
+ item.user,
+ item.image_name,
+ item.docker_id,
+ item.mapping_id
+ ]);
});
- })
- .fail(
- function () {
+ })
+ .fail(function () {
self.communicationError = "The request could not be executed successfully";
- }
- );
+ });
},
+
stopAction: function(row) {
- this.stopContainerDialog.containerToStop = row[0];
- this.stopContainerDialog.show = true;
+ this.stopContainerDialog.containerToStop = row[0];
+ this.stopContainerDialog.show = true;
},
+
stopContainer: function () {
- var self = this;
- resources.Container.delete(this.stopContainerDialog.containerToStop)
+ var self = this;
+ resources.Container.delete(this.stopContainerDialog.containerToStop)
.done(function () {
- self.updateTable();
- self.closeStopContainerDialog();
+ self.updateTable();
+ self.closeStopContainerDialog();
})
- .fail(
- function () {
+ .fail(function () {
self.closeStopContainerDialog();
self.communicationError = "The request could not be executed successfully";
- }
- );
+ });
},
+
closeStopContainerDialog: function() {
- this.stopContainerDialog.show = false;
- this.stopContainerDialog.containerToStop = null;
+ this.stopContainerDialog.show = false;
+ this.stopContainerDialog.containerToStop = null;
}
- }
- };
- });
+ }
+};
diff --git a/remoteappmanager/static/js/admin/vue-components/MainView.js b/remoteappmanager/static/js/admin/vue-components/MainView.js
index 4f89349b8..b82cba9e4 100644
--- a/remoteappmanager/static/js/admin/vue-components/MainView.js
+++ b/remoteappmanager/static/js/admin/vue-components/MainView.js
@@ -1,73 +1,65 @@
-define([
- "components/vue/dist/vue.min",
- "jsapi/v1/resources"
-], function(Vue, resources) {
- "use strict";
-
- return {
- template:
- '' +
- '
',
+var resources = require("admin-resources");
+
+module.exports = {
+ template:
+ '' +
- '
' +
- '' +
- '
' +
- ' Statistics
' +
- ' ' +
- '
' +
- ' ' +
- ' Error: {{communicationError}}' +
- '
' +
- ' ' +
- '
' + - '
' +
- ' ' +
- '
' +
- ' Realm
' +
- ' {{ realm }}
' +
- ' ' +
- '
' +
- ' Total users
' +
- ' {{ num_total_users }}
' +
- ' ' +
- '
' +
- ' Number of applications
' +
- ' {{ num_applications }}
' +
- ' ' + - '
' +
- '
' +
- ' Active users
' +
- ' {{ num_active_users }}
' +
- ' ' +
- '
' +
- ' Running containers
' +
- ' {{ num_running_containers }}
' +
- ' ' +
+ '
',
+
data: function() {
- return {
- communicationError: null,
- realm: "",
- num_total_users: "",
- num_applications: "",
- num_active_users: "",
- num_running_containers: ""
- };
+ return {
+ communicationError: null,
+ realm: "",
+ num_total_users: "",
+ num_applications: "",
+ num_active_users: "",
+ num_running_containers: ""
+ };
},
+
mounted: function() {
- resources.Stats.retrieve()
- .done(
- (function(rep) {
- this.$data.realm = rep.realm;
- this.$data.num_total_users = rep.num_total_users;
- this.$data.num_applications = rep.num_applications;
- this.$data.num_active_users = rep.num_active_users;
- this.$data.num_running_containers = rep.num_running_containers;
- }).bind(this)
- )
- .fail(
- (function() {
+ resources.Stats.retrieve()
+ .done(function(rep) {
+ this.realm = rep.realm;
+ this.num_total_users = rep.num_total_users;
+ this.num_applications = rep.num_applications;
+ this.num_active_users = rep.num_active_users;
+ this.num_running_containers = rep.num_running_containers;
+ }.bind(this))
+ .fail(function() {
this.communicationError = "The request could not be executed successfully";
- }).bind(this)
-
- );
+ }.bind(this));
}
- };
-});
+};
diff --git a/remoteappmanager/static/js/admin/vue-components/UsersView.js b/remoteappmanager/static/js/admin/vue-components/UsersView.js
index 0e77d2e42..b915f1d89 100644
--- a/remoteappmanager/static/js/admin/vue-components/UsersView.js
+++ b/remoteappmanager/static/js/admin/vue-components/UsersView.js
@@ -1,136 +1,130 @@
-define([
- "components/vue/dist/vue",
- "jsapi/v1/resources",
- "admin/vue-components/users/NewUserDialog"
-], function(Vue, resources, NewUserDialog) {
- "use strict";
+var resources = require("admin-resources");
+var NewUserDialog = require("./users/NewUserDialog");
- return {
+module.exports = {
components: {
- 'new-user-dialog': NewUserDialog,
+ 'new-user-dialog': NewUserDialog,
},
- template:
- '' +
+ '
' +
+ '' +
+ '
' +
+ ' Statistics
' +
+ ' ' +
+ '
' +
+ ' ' +
+ ' Error: {{communicationError}}' +
+ '
' +
+ ' ' +
+ '
' + + '
' +
+ ' ' +
+ '
' +
+ ' Realm
' +
+ ' {{ realm }}
' +
+ ' ' +
+ '
' +
+ ' Total users
' +
+ ' {{ num_total_users }}
' +
+ ' ' +
+ '
' +
+ ' Number of applications
' +
+ ' {{ num_applications }}
' +
+ ' ' + + '
' +
+ '
' +
+ ' Active users
' +
+ ' {{ num_active_users }}
' +
+ ' ' +
+ '
' +
+ ' Running containers
' +
+ ' {{ num_running_containers }}
' +
+ ' ' +
- ' Error: {{communicationError}}' +
- '
' +
- ' Do you want to remove User {{removeUserDialog.userToRemove.name}} ' +
- ' ({{removeUserDialog.userToRemove.id}})
' +
- ' ' +
+ ' Error: {{communicationError}}' +
+ '
' +
+ ' Do you want to remove User {{removeUserDialog.userToRemove.name}} ' +
+ ' ({{removeUserDialog.userToRemove.id}})
' +
+ ' Create New Policy
' +
- ' ' +
- ' ' +
- ' ' +
- ' ' +
- ' ' +
- ' Image Name cannot be empty' +
- ' ' +
- ' ' +
- ' ' +
- ' ' +
- ' ' +
- ' Volume Source must be empty or an absolute path' +
- ' ' +
- ' ' +
- ' ' +
- ' ' +
- ' ' +
- ' Volume Target must be empty or an absolute path' +
- ' ' +
- ' ' +
- ' ' +
- ' ' +
- '
' +
- '' +
- ' ' +
- '
' +
- ' ' +
- ' ' +
- ' ' +
- ' ' +
- '
' +
- ' ' +
- ' ' +
- ' ' +
- '
' +
- ' ' +
- ' ' +
- '
' +
- ' ' +
- ' Both Volume Source and Target must be defined
' + - ' ' + - 'Create New Policy
' +
+ ' ' +
+ ' ' +
+ ' ' +
+ ' ' +
+ ' ' +
+ ' Image Name cannot be empty' +
+ ' ' +
+ ' ' +
+ ' ' +
+ ' ' +
+ ' ' +
+ ' Volume Source must be empty or an absolute path' +
+ ' ' +
+ ' ' +
+ ' ' +
+ ' ' +
+ ' ' +
+ ' Volume Target must be empty or an absolute path' +
+ ' ' +
+ ' ' +
+ ' ' +
+ ' ' +
+ '
' +
+ '' +
+ ' ' +
+ '
' +
+ ' ' +
+ ' ' +
+ ' ' +
+ ' ' +
+ '
' +
+ ' ' +
+ ' ' +
+ ' ' +
+ '
' +
+ ' ' +
+ ' ' +
+ '
' +
+ ' ' +
+ ' Both Volume Source and Target must be defined
' + + ' ' + + 'Create New Application
' +
- ' ' +
- ' ' +
- ' ' +
- ' ' +
- ' ' +
- ' Image Name cannot be empty' +
- ' ' +
- ' ' +
- ' ' +
- ' ' +
- '
' +
- ' Create New Application
' +
+ ' ' +
+ ' ' +
+ ' ' +
+ ' ' +
+ ' ' +
+ ' Image Name cannot be empty' +
+ ' ' +
+ ' ' +
+ ' ' +
+ ' ' +
+ '
' +
+ ' ' +
- '
'
- };
-
-});
+ ' ' +
- '
' +
- ' ' +
- ' {{title}} ' +
- '
' +
- ' ' +
+ '
'
+};
diff --git a/remoteappmanager/static/js/admin/vue-components/toolkit/ConfirmDialog.js b/remoteappmanager/static/js/admin/vue-components/toolkit/ConfirmDialog.js
index 066e48a47..c82188cf3 100644
--- a/remoteappmanager/static/js/admin/vue-components/toolkit/ConfirmDialog.js
+++ b/remoteappmanager/static/js/admin/vue-components/toolkit/ConfirmDialog.js
@@ -1,35 +1,30 @@
-define([
-], function() {
- "use strict";
-
- return {
+module.exports = {
props: {
- title: {
- type: String,
- default: "Confirm"
- },
- closeCallback: {
- type: Function,
- default: undefined
- },
- okCallback: {
- type: Function,
- default: function() {}
- }
- },
+ title: {
+ type: String,
+ default: "Confirm"
+ },
+ closeCallback: {
+ type: Function,
+ default: undefined
+ },
+ okCallback: {
+ type: Function,
+ default: function() {}
+ }
+ },
template: '' +
+ '
' +
+ ' ' +
+ ' {{title}} ' +
+ '
' +
+ ' ' +
- '
' +
- '' +
- ' ' +
- '
' +
- ' ' +
+ '
' +
+ ''
+};
diff --git a/remoteappmanager/static/js/admin/vue-components/toolkit/DataTable.js b/remoteappmanager/static/js/admin/vue-components/toolkit/DataTable.js
index e0cb0494e..3845ddac9 100644
--- a/remoteappmanager/static/js/admin/vue-components/toolkit/DataTable.js
+++ b/remoteappmanager/static/js/admin/vue-components/toolkit/DataTable.js
@@ -1,52 +1,46 @@
-define([
-], function() {
- "use strict";
-
- return {
+module.exports = {
props: [
- "headers", "rows", "globalActions", "rowActions"
+ "headers", "rows", "globalActions", "rowActions"
],
methods: {
- isBoolean: function(value) {
- return typeof(value) === "boolean";
- },
- buttonClassFromType: function(value) {
- var cls = {"btn": true};
- if (value === undefined) {
- value = "danger";
+ isBoolean: function(value) {
+ return typeof(value) === "boolean";
+ },
+ buttonClassFromType: function(value) {
+ var cls = {"btn": true};
+ if (value === undefined) {
+ value = "danger";
+ }
+ cls["btn-" + value] = true;
+ return cls;
}
- cls["btn-" + value] = true;
- return cls;
- }
},
template:
- '' +
+ ' ' +
+ '
' +
+ ' ' +
- ' ' +
- ' ' +
- '
' +
- '
'
- };
-
-});
+ '' +
- ' ' +
- '
' +
- ' | {{header}} | ' + - 'Actions | ' + - '|
|---|---|---|
| ' + - ' | {{value}} | ' + - ' ' + - '' + - ' ' + - ' | ' + - '
' +
+ ' ' +
+ ' ' +
+ '
' +
+ '
'
+};
diff --git a/remoteappmanager/static/js/admin/vue-components/toolkit/ModalDialog.js b/remoteappmanager/static/js/admin/vue-components/toolkit/ModalDialog.js
index d8df1d553..61a7059a6 100644
--- a/remoteappmanager/static/js/admin/vue-components/toolkit/ModalDialog.js
+++ b/remoteappmanager/static/js/admin/vue-components/toolkit/ModalDialog.js
@@ -1,17 +1,12 @@
-define([
-], function() {
- "use strict";
-
- return {
+module.exports = {
template: '' +
+ ' ' +
+ '
' +
+ ' | {{header}} | ' + + 'Actions | ' + + '|
|---|---|---|
| ' + + ' | {{value}} | ' + + ' ' + + '' + + ' ' + + ' | ' + + '
' +
- '
' +
- '' +
- ' ' +
- '
' +
- ' ' +
+ '
' +
+ ''
+};
\ No newline at end of file
diff --git a/remoteappmanager/static/js/admin/vue-components/toolkit/toolkit.js b/remoteappmanager/static/js/admin/vue-components/toolkit/toolkit.js
index 32c04004c..b1018e319 100644
--- a/remoteappmanager/static/js/admin/vue-components/toolkit/toolkit.js
+++ b/remoteappmanager/static/js/admin/vue-components/toolkit/toolkit.js
@@ -1,28 +1,17 @@
-define([
- "components/vue/dist/vue",
- "admin/vue-components/toolkit/AdminLTEBox",
- "admin/vue-components/toolkit/ConfirmDialog",
- "admin/vue-components/toolkit/ModalDialog",
- "admin/vue-components/toolkit/DataTable"
-], function(
- Vue,
- AdminLTEBox,
- ConfirmDialog,
- ModalDialog,
- DataTable
-) {
- "use strict";
+var Vue = require("vuejs");
+var ConfirmDialog = require("./ConfirmDialog");
+var ModalDialog = require("./ModalDialog");
+var AdminLTEBox = require("./AdminLTEBox");
+var DataTable = require("./DataTable");
- Vue.component("confirm-dialog", ConfirmDialog);
- Vue.component("modal-dialog", ModalDialog);
- Vue.component("adminlte-box", AdminLTEBox);
- Vue.component("data-table", DataTable);
-
- return {
+Vue.component("confirm-dialog", ConfirmDialog);
+Vue.component("modal-dialog", ModalDialog);
+Vue.component("adminlte-box", AdminLTEBox);
+Vue.component("data-table", DataTable);
+
+module.exports = {
ConfirmDialog: ConfirmDialog,
AdminLTEBox: AdminLTEBox,
ModalDialog: ModalDialog,
DataTable: DataTable
- };
-
-});
+};
diff --git a/remoteappmanager/static/js/admin/vue-components/users/NewUserDialog.js b/remoteappmanager/static/js/admin/vue-components/users/NewUserDialog.js
index b7b217d4b..46d481d36 100644
--- a/remoteappmanager/static/js/admin/vue-components/users/NewUserDialog.js
+++ b/remoteappmanager/static/js/admin/vue-components/users/NewUserDialog.js
@@ -1,10 +1,6 @@
-define([
- "components/vue/dist/vue",
- "jsapi/v1/resources"
-], function(Vue, resources) {
- "use strict";
+var resources = require("admin-resources");
- return {
+module.exports = {
template:
'' +
+ ' ' +
+ '
' +
+ ' Create New User
' +
- ' ' +
- ' ' +
- '
',
-
- data: function() {
- return {
- resolution: this.configDict.resolution,
- resolutionOptions: ['Window', '1920x1080', '1280x1024', '1280x800', '1024x768']
- };
- },
-
- watch: {
- configDict: function() { this.resolution = this.configDict.resolution; }, // model -> view update
- resolution: function() { this.$emit('update:configDict', { resolution: this.resolution }); } // view -> model update
- }
- });
-
- // Your configurable class must implement a tag and default configDict
- var ResolutionModel = function() {
- this.tag = resolutionTag;
- this.configDict = { resolution: 'Window' };
- };
-
- ResolutionModel.prototype.asConfigDict = function() {
- var resolution = this.configDict.resolution;
-
- if (resolution === 'Window') {
- var maxSize = utils.maxIframeSize();
- resolution = maxSize[0] + 'x' + maxSize[1];
- }
-
- return { resolution: resolution };
- };
-
- var outputConfigurables = {};
-
- // Export all your configurable models here
- outputConfigurables[resolutionTag] = {
- model: ResolutionModel,
- component: resolutionComponent
- };
-
- return outputConfigurables;
+var Vue = require("vuejs");
+var utils = require("utils");
+
+var resolutionTag = 'resolution';
+var resolutionComponent = Vue.component(resolutionTag + '-component', {
+ // Your configurable must have a "configDict" property from the model
+ props: ['configDict'],
+
+ template:
+ '' +
+ ' ' +
+ ' ' +
+ '
',
+
+ data: function() {
+ return {
+ resolution: this.configDict.resolution,
+ resolutionOptions: ['Window', '1920x1080', '1280x1024', '1280x800', '1024x768']
+ };
+ },
+
+ watch: {
+ configDict: function() { this.resolution = this.configDict.resolution; }, // model -> view update
+ resolution: function() { this.$emit('update:configDict', { resolution: this.resolution }); } // view -> model update
+ }
});
+
+// Your configurable class must implement a tag and default configDict
+var ResolutionModel = function() {
+ this.tag = resolutionTag;
+ this.configDict = { resolution: 'Window' };
+};
+
+ResolutionModel.prototype.asConfigDict = function() {
+ var resolution = this.configDict.resolution;
+
+ if (resolution === 'Window') {
+ var maxSize = utils.maxIframeSize();
+ resolution = maxSize[0] + 'x' + maxSize[1];
+ }
+
+ return { resolution: resolution };
+};
+
+var outputConfigurables = {};
+
+// Export all your configurable models here
+outputConfigurables[resolutionTag] = {
+ model: ResolutionModel,
+ component: resolutionComponent
+};
+
+module.exports = outputConfigurables;
\ No newline at end of file
diff --git a/remoteappmanager/static/js/home/controller.js b/remoteappmanager/static/js/home/controller.js
index eef36c39b..2e06abbae 100644
--- a/remoteappmanager/static/js/home/controller.js
+++ b/remoteappmanager/static/js/home/controller.js
@@ -1,42 +1,31 @@
-/*globals: require, console*/
-require([
- "home/models",
- "home/views/application_list_view",
- "home/views/application_view",
- "components/vue/dist/vue",
- "gamodule",
- "vue/filters"
-], function(
- models,
- applicationListView,
- applicationView,
- Vue,
- gamodule) {
- "use strict";
+var gamodule = require("gamodule");
+var models = require("./models");
+var applicationListView = require("./views/application_list_view");
+var applicationView = require("./views/application_view");
+require("filters");
- // This model keeps the retrieved content from the REST query locally.
- // It is only synchronized at initial load.
- var model = new models.ApplicationListModel();
+// This model keeps the retrieved content from the REST query locally.
+// It is only synchronized at initial load.
+var model = new models.ApplicationListModel();
- // Initialize views
- var appListView = new applicationListView.ApplicationListView({
- el: '#applist',
- data: function() { return { model: model }; }
- });
+// Initialize views
+var appListView = new applicationListView.ApplicationListView({
+ el: '#applist',
+ data: function() { return { model: model }; }
+});
- var appView = new applicationView.ApplicationView({
- el: '#appview',
- data: function() { return { model: model }; }
- });
+var appView = new applicationView.ApplicationView({
+ el: '#appview',
+ data: function() { return { model: model }; }
+});
- // Create GA observer
- var gaObserver = new gamodule.GaObserver();
+// Create GA observer
+var gaObserver = new gamodule.GaObserver();
- appView.$on('startApplication', function(application) {
- gaObserver.triggerApplicationStarting(application.appData.image.name);
- });
+appView.$on('startApplication', function(application) {
+ gaObserver.triggerApplicationStarting(application.appData.image.name);
+});
- appListView.$on('entryClicked', function() { appView.focusIframe(); });
+appListView.$on('entryClicked', function() { appView.focusIframe(); });
- model.update();
-});
+model.update();
diff --git a/remoteappmanager/static/js/home/models.js b/remoteappmanager/static/js/home/models.js
index 03203c653..d9e3540e3 100644
--- a/remoteappmanager/static/js/home/models.js
+++ b/remoteappmanager/static/js/home/models.js
@@ -1,207 +1,203 @@
-define([
- "jquery",
- "home/configurables",
- "jsapi/v1/resources"
-], function ($, configurables, resources) {
- "use strict";
-
- var Status = {
- RUNNING: "RUNNING",
- STARTING: "STARTING",
- STOPPING: "STOPPING",
- STOPPED: "STOPPED"
- };
-
- var availableApplicationsInfo = function () {
- // Retrieve information from the various applications and
- // connect the cascading callbacks.
- // Returns a single promise. When resolved, the attached
- // callbacks will be passed an array of the promises for the various
- // retrieve operations, successful or not.
- // This routine will go away when we provide the representation data
- // inline with the items at tornado-webapi level.
-
- var promise = $.Deferred();
-
- resources.Application.items()
- .done(function (identifiers, items) {
- var result = [];
- Object.keys(items).forEach(function(key) {
- result.push(items[key]);
- });
- promise.resolve(result);
-
- })
- .fail(function() {
- promise.resolve([]);
+var $ = require("jquery");
+var resources = require("home-resources");
+var configurables = require("./configurables");
+
+var Status = {
+ RUNNING: "RUNNING",
+ STARTING: "STARTING",
+ STOPPING: "STOPPING",
+ STOPPED: "STOPPED"
+};
+
+var availableApplicationsInfo = function () {
+ // Retrieve information from the various applications and
+ // connect the cascading callbacks.
+ // Returns a single promise. When resolved, the attached
+ // callbacks will be passed an array of the promises for the various
+ // retrieve operations, successful or not.
+ // This routine will go away when we provide the representation data
+ // inline with the items at tornado-webapi level.
+
+ var promise = $.Deferred();
+
+ resources.Application.items()
+ .done(function (identifiers, items) {
+ var result = [];
+ Object.keys(items).forEach(function(key) {
+ result.push(items[key]);
});
+ promise.resolve(result);
- return promise;
- };
-
- var ApplicationListModel = function() {
- // (constructor) Model for the application list.
- this.appList = [];
-
- // Selection index for when we click on one entry.
- // Should be the index of the selected application,
- // or null if no application available (first app is clicked by default).
- this.selectedIndex = null;
-
- this.loading = true;
- };
-
- ApplicationListModel.prototype.update = function() {
- // Requests an update of the object internal data.
- // This method returns a jQuery Promise object.
- // When resolved, this.data will contain a list of the retrieved
- // data. Note that, in error conditions, this routine resolves
- // successfully in any case, and the data is set to empty list
- return $.when(
- availableApplicationsInfo()
- ).done(function (appData) {
- // appData contains the data retrieved from the remote API
-
- var appList = [];
-
- // Sort application list by names
- appData.sort(function(app1, app2) {
- var app1Name = app1.image.ui_name? app1.image.ui_name: app1.image.name;
- var app2Name = app2.image.ui_name? app2.image.ui_name: app2.image.name;
- return app1Name < app2Name? -1: 1;
- });
+ })
+ .fail(function() {
+ promise.resolve([]);
+ });
+
+ return promise;
+};
+
+var ApplicationListModel = function() {
+ // (constructor) Model for the application list.
+ this.appList = [];
+
+ // Selection index for when we click on one entry.
+ // Should be the index of the selected application,
+ // or null if no application available (first app is clicked by default).
+ this.selectedIndex = null;
+
+ this.loading = true;
+};
+
+ApplicationListModel.prototype.update = function() {
+ // Requests an update of the object internal data.
+ // This method returns a jQuery Promise object.
+ // When resolved, this.data will contain a list of the retrieved
+ // data. Note that, in error conditions, this routine resolves
+ // successfully in any case, and the data is set to empty list
+ return $.when(
+ availableApplicationsInfo()
+ ).done(function (appData) {
+ // appData contains the data retrieved from the remote API
+
+ var appList = [];
+
+ // Sort application list by names
+ appData.sort(function(app1, app2) {
+ var app1Name = app1.image.ui_name? app1.image.ui_name: app1.image.name;
+ var app2Name = app2.image.ui_name? app2.image.ui_name: app2.image.name;
+ return app1Name < app2Name? -1: 1;
+ });
- // Add the options for some image types
- appData.forEach(function(applicationData) {
- var app = {
- appData: applicationData,
- // Default values, will be overwritten
- status: Status.STOPPED,
- // If true the user will see the loading spinner (when starting the application)
- delayed: true,
- configurables: [],
- isRunning: function() {return this.status === Status.RUNNING;},
- isStopped: function() {return this.status === Status.STOPPED;},
- isStarting: function() {return this.status === Status.STARTING;},
- isStopping: function() {return this.status === Status.STOPPING;}
- };
-
- this._updateConfigurables(app);
- this._updateStatus(app);
-
- app.delayed = !app.isRunning();
- appList.push(app);
- }.bind(this));
-
- this.appList = appList;
-
- if(appList.length) {this.selectedIndex = 0;}
-
- this.loading = false;
+ // Add the options for some image types
+ appData.forEach(function(applicationData) {
+ var app = {
+ appData: applicationData,
+ // Default values, will be overwritten
+ status: Status.STOPPED,
+ // If true the user will see the loading spinner (when starting the application)
+ delayed: true,
+ configurables: [],
+ isRunning: function() {return this.status === Status.RUNNING;},
+ isStopped: function() {return this.status === Status.STOPPED;},
+ isStarting: function() {return this.status === Status.STARTING;},
+ isStopping: function() {return this.status === Status.STOPPING;}
+ };
+
+ this._updateConfigurables(app);
+ this._updateStatus(app);
+
+ app.delayed = !app.isRunning();
+ appList.push(app);
}.bind(this));
- };
- ApplicationListModel.prototype.updateIdx = function(index) {
- // Refetches and updates the entry at the given index.
- var app = this.appList[index];
- var mapping_id = app.appData.mapping_id;
+ this.appList = appList;
- return resources.Application.retrieve(mapping_id)
- .done(function(newData) {
- app.appData = newData;
+ if(appList.length) {this.selectedIndex = 0;}
- this._updateStatus(app);
- }.bind(this));
- };
-
- ApplicationListModel.prototype._updateConfigurables = function(app) {
- // Contains the submodels for the configurables.
- // It is a dictionary that maps a supported (by the image) configurable tag
- // to its client-side model.
- app.configurables = [];
-
- app.appData.image.configurables.forEach(function(tag) {
- // If this returns null, the tag has not been recognized
- // by the client. skip it and let the server deal with the
- // missing data, either by using a default or throwing
- // an error.
- var ConfigurableCls = configurables[tag].model;
-
- if (ConfigurableCls !== undefined) {
- app.configurables.push(new ConfigurableCls());
- }
- });
- };
+ this.loading = false;
+ }.bind(this));
+};
- ApplicationListModel.prototype._updateStatus = function(app) {
- if (app.appData.container === undefined) {
- app.status = Status.STOPPED;
- } else {
- app.status = Status.RUNNING;
- }
- };
+ApplicationListModel.prototype.updateIdx = function(index) {
+ // Refetches and updates the entry at the given index.
+ var app = this.appList[index];
+ var mapping_id = app.appData.mapping_id;
- ApplicationListModel.prototype.startApplication = function() {
- var selectedIndex = this.selectedIndex;
- var currentApp = this.appList[selectedIndex];
+ return resources.Application.retrieve(mapping_id)
+ .done(function(newData) {
+ app.appData = newData;
- currentApp.status = Status.STARTING;
- currentApp.delayed = true;
+ this._updateStatus(app);
+ }.bind(this));
+};
- var configurablesData = {};
- currentApp.configurables.forEach(function(configurable) {
- var tag = configurable.tag;
- configurablesData[tag] = configurable.asConfigDict();
- });
+ApplicationListModel.prototype._updateConfigurables = function(app) {
+ // Contains the submodels for the configurables.
+ // It is a dictionary that maps a supported (by the image) configurable tag
+ // to its client-side model.
+ app.configurables = [];
- var startPromise = $.Deferred();
+ app.appData.image.configurables.forEach(function(tag) {
+ // If this returns null, the tag has not been recognized
+ // by the client. skip it and let the server deal with the
+ // missing data, either by using a default or throwing
+ // an error.
+ var ConfigurableCls = configurables[tag].model;
- resources.Container.create({
- mapping_id: currentApp.appData.mapping_id,
- configurables: configurablesData
- })
- .done(function() {
- this.updateIdx(selectedIndex)
- .done(startPromise.resolve)
- .fail(function(error) {
- currentApp.status = Status.STOPPED;
- startPromise.reject(error);
- });
- }.bind(this))
+ if (ConfigurableCls !== undefined) {
+ app.configurables.push(new ConfigurableCls());
+ }
+ });
+};
+
+ApplicationListModel.prototype._updateStatus = function(app) {
+ if (app.appData.container === undefined) {
+ app.status = Status.STOPPED;
+ } else {
+ app.status = Status.RUNNING;
+ }
+};
+
+ApplicationListModel.prototype.startApplication = function() {
+ var selectedIndex = this.selectedIndex;
+ var currentApp = this.appList[selectedIndex];
+
+ currentApp.status = Status.STARTING;
+ currentApp.delayed = true;
+
+ var configurablesData = {};
+ currentApp.configurables.forEach(function(configurable) {
+ var tag = configurable.tag;
+ configurablesData[tag] = configurable.asConfigDict();
+ });
+
+ var startPromise = $.Deferred();
+
+ resources.Container.create({
+ mapping_id: currentApp.appData.mapping_id,
+ configurables: configurablesData
+ })
+ .done(function() {
+ this.updateIdx(selectedIndex)
+ .done(startPromise.resolve)
.fail(function(error) {
currentApp.status = Status.STOPPED;
startPromise.reject(error);
});
+ }.bind(this))
+ .fail(function(error) {
+ currentApp.status = Status.STOPPED;
+ startPromise.reject(error);
+ });
- return startPromise;
- };
+ return startPromise;
+};
- ApplicationListModel.prototype.stopApplication = function(index) {
- var appStopping = this.appList[index];
- appStopping.status = Status.STOPPING;
+ApplicationListModel.prototype.stopApplication = function(index) {
+ var appStopping = this.appList[index];
+ appStopping.status = Status.STOPPING;
- var url_id = appStopping.appData.container.url_id;
+ var url_id = appStopping.appData.container.url_id;
- var stopPromise = $.Deferred();
+ var stopPromise = $.Deferred();
- resources.Container.delete(url_id)
- .done(function() {
- this.updateIdx(index)
- .done(stopPromise.resolve)
- .fail(function(error) {
- appStopping.status = Status.STOPPED;
- stopPromise.reject(error);
- });
- }.bind(this))
+ resources.Container.delete(url_id)
+ .done(function() {
+ this.updateIdx(index)
+ .done(stopPromise.resolve)
.fail(function(error) {
appStopping.status = Status.STOPPED;
stopPromise.reject(error);
});
-
- return stopPromise;
- };
-
- return {
- ApplicationListModel: ApplicationListModel
- };
-});
+ }.bind(this))
+ .fail(function(error) {
+ appStopping.status = Status.STOPPED;
+ stopPromise.reject(error);
+ });
+
+ return stopPromise;
+};
+
+module.exports = {
+ ApplicationListModel: ApplicationListModel
+};
diff --git a/remoteappmanager/static/js/home/views/application_list_view.js b/remoteappmanager/static/js/home/views/application_list_view.js
index c76611aa8..4a0ee8a46 100644
--- a/remoteappmanager/static/js/home/views/application_list_view.js
+++ b/remoteappmanager/static/js/home/views/application_list_view.js
@@ -1,109 +1,105 @@
-define([
- "../../components/vue/dist/vue",
- "admin/vue-components/toolkit/toolkit"
-], function (Vue) {
- 'use strict';
+var Vue = require("vuejs");
+require("toolkit");
- var ApplicationListView = Vue.extend({
- template:
- '' +
- ' Code: {{stoppingError.code}}' +
- ' {{stoppingError.message}}' +
- '
' +
- ' ' +
+ ' Code: {{stoppingError.code}}' +
+ ' {{stoppingError.message}}' +
+ '
' +
+ ' ' +
- ' Code: {{startingError.code}}' +
- ' {{startingError.message}}' +
- '
' +
- ' ' +
- '
' +
-
-
- ' ' +
- ' ' +
- '' +
- '
' +
- ' ' +
- '
' +
- ' ' +
- '
' +
- ' {{ currentApp.appData.image | appName }}
' + - ' ' + - '' +
- '
' +
-
- ' ' +
- ' ' +
- ' Description
' + - ' {{ currentApp.appData.image.description }}' + - - 'Policy
' + - - '- ' +
- ' ' +
- '
- ' + - ' Workspace accessible' + - ' ' + - '
- ' + - ' Workspace not accessible' + - ' ' + - - ' ' + - '
- ' + - ' Volume mounted: {{ appPolicy.volume_source }} → {{ appPolicy.volume_target }} ({{ appPolicy.volume_mode }})' + - ' ' + - '
- ' + - ' No volumes mounted' + - ' ' + - '
Configuration
' + - ' ' + - '' +
+ ' Code: {{startingError.code}}' +
+ ' {{startingError.message}}' +
+ '
' +
+ ' ' +
+ '
' +
+
+
+ ' ' +
+ ' ' +
+ '' +
+ '
' +
+ ' ' +
+ '
' +
+ ' ' +
+ '
' +
+ ' {{ currentApp.appData.image | appName }}
' + + ' ' + + '' +
+ '
' +
+
+ ' ' +
+ ' ' +
+ ' Description
' + + ' {{ currentApp.appData.image.description }}' + + + 'Policy
' + + + '- ' +
+ ' ' +
+ '
- ' + + ' Workspace accessible' + + ' ' + + '
- ' + + ' Workspace not accessible' + + ' ' + + + ' ' + + '
- ' + + ' Volume mounted: {{ appPolicy.volume_source }} → {{ appPolicy.volume_target }} ({{ appPolicy.volume_mode }})' + + ' ' + + '
- ' + + ' No volumes mounted' + + ' ' + + '
Configuration
' + + ' ' + + '
diff --git a/remoteappmanager/templates/home.html b/remoteappmanager/templates/home.html
index 0f165419e..0f1432f0f 100644
--- a/remoteappmanager/templates/home.html
+++ b/remoteappmanager/templates/home.html
@@ -10,7 +10,5 @@
{% block script_init %}
{{ super() }}
-
+
{% endblock %}
diff --git a/remoteappmanager/templates/page.html b/remoteappmanager/templates/page.html
index 3741e3486..1e2495c65 100644
--- a/remoteappmanager/templates/page.html
+++ b/remoteappmanager/templates/page.html
@@ -15,24 +15,24 @@
-
+
-
+
-
+
-
+
-
+
{% block stylesheet %}
@@ -52,47 +52,6 @@
{% if analytics %}
{% endif %}
-
- {% endblock %}
-
- {% block script_init %}
-
-
-
{% endblock %}
{% block meta %}
@@ -174,9 +133,9 @@
-
-
-
+
+
+
{% block dialogs %}
{% call macros.modal_dlg('Error', btn_label='OK') %}
@@ -186,6 +145,23 @@
{% endcall %}
{% endblock %}
+ {% block script_init %}
+
+ {% endblock %}
+