JavaScript-side refactor supporting new Connection API.

This commit is contained in:
Michael Jumper
2013-01-31 15:03:50 -08:00
parent c05286c486
commit c770c28d66
3 changed files with 109 additions and 84 deletions

View File

@@ -136,6 +136,7 @@
Guacamole ${project.version} Guacamole ${project.version}
</div> </div>
<script type="text/javascript" src="scripts/service.js"></script>
<script type="text/javascript" src="scripts/session.js"></script> <script type="text/javascript" src="scripts/session.js"></script>
<script type="text/javascript" src="scripts/history.js"></script> <script type="text/javascript" src="scripts/history.js"></script>
<script type="text/javascript" src="scripts/root-ui.js"></script> <script type="text/javascript" src="scripts/root-ui.js"></script>

View File

@@ -91,96 +91,45 @@ GuacamoleRootUI.login = function(username, password) {
}; };
/**
* An arbitrary Guacamole configuration, consisting of an ID/protocol pair.
*
* @constructor
* @param {String} protocol The protocol used by this configuration.
* @param {String} id The ID associated with this configuration.
*/
GuacamoleRootUI.Configuration = function(protocol, id) {
/**
* The protocol associated with this configuration.
*/
this.protocol = protocol;
/**
* The ID associated with this configuration.
*/
this.id = id;
};
GuacamoleRootUI.getConfigurations = function(parameters) {
// Construct request URL
var configs_url = "configs";
if (parameters) configs_url += "?" + parameters;
// Get config list
var xhr = new XMLHttpRequest();
xhr.open("GET", configs_url, false);
xhr.send(null);
// If fail, throw error
if (xhr.status != 200)
throw new Error(xhr.statusText);
// Otherwise, get list
var configs = new Array();
var configElements = xhr.responseXML.getElementsByTagName("config");
for (var i=0; i<configElements.length; i++) {
configs.push(new Config(
configElements[i].getAttribute("protocol"),
configElements[i].getAttribute("id")
));
}
return configs;
};
/** /**
* A connection UI object which can be easily added to a list of connections * A connection UI object which can be easily added to a list of connections
* for sake of display. * for sake of display.
*/ */
GuacamoleRootUI.Connection = function(config) { GuacamoleRootUI.Connection = function(connection) {
/** /**
* The configuration associated with this connection. * The actual connection associated with this connection UI element.
*/ */
this.configuration = config; this.connection = connection;
function element(tagname, classname) { function createElement(tagname, classname) {
var new_element = document.createElement(tagname); var new_element = document.createElement(tagname);
new_element.className = classname; new_element.className = classname;
return new_element; return new_element;
} }
// Create connection display elements // Create connection display elements
var connection = element("div", "connection"); var element = createElement("div", "connection");
var caption = element("div", "caption"); var caption = createElement("div", "caption");
var protocol = element("div", "protocol"); var protocol = createElement("div", "protocol");
var name = element("span", "name"); var name = createElement("span", "name");
var protocol_icon = element("div", "icon " + config.protocol); var protocol_icon = createElement("div", "icon " + connection.protocol);
var thumbnail = element("div", "thumbnail"); var thumbnail = createElement("div", "thumbnail");
var thumb_img; var thumb_img;
// Get URL // Get URL
var url = "client.xhtml?id=" + encodeURIComponent(config.id); var url = "client.xhtml?id=" + encodeURIComponent(connection.id);
// Create link to client // Create link to client
connection.onclick = function() { element.onclick = function() {
// Attempt to focus existing window // Attempt to focus existing window
var current = window.open(null, config.id); var current = window.open(null, connection.id);
// If window did not already exist, set up as // If window did not already exist, set up as
// Guacamole client // Guacamole client
if (!current.GuacUI) if (!current.GuacUI)
window.open(url, config.id); window.open(url, connection.id);
}; };
@@ -188,18 +137,18 @@ GuacamoleRootUI.Connection = function(config) {
protocol.appendChild(protocol_icon); protocol.appendChild(protocol_icon);
// Set name // Set name
name.textContent = config.id; name.textContent = connection.id;
// Assemble caption // Assemble caption
caption.appendChild(protocol); caption.appendChild(protocol);
caption.appendChild(name); caption.appendChild(name);
// Assemble connection icon // Assemble connection icon
connection.appendChild(thumbnail); element.appendChild(thumbnail);
connection.appendChild(caption); element.appendChild(caption);
// Add screenshot if available // Add screenshot if available
var thumbnail_url = GuacamoleHistory.get(config.id).thumbnail; var thumbnail_url = GuacamoleHistory.get(connection.id).thumbnail;
if (thumbnail_url) { if (thumbnail_url) {
// Create thumbnail element // Create thumbnail element
@@ -213,7 +162,7 @@ GuacamoleRootUI.Connection = function(config) {
* Returns the DOM element representing this connection. * Returns the DOM element representing this connection.
*/ */
this.getElement = function() { this.getElement = function() {
return connection; return element;
}; };
/** /**
@@ -250,9 +199,9 @@ GuacamoleRootUI.Connection = function(config) {
GuacamoleRootUI.thumbnailConnections = {}; GuacamoleRootUI.thumbnailConnections = {};
/** /**
* Set of all configurations, indexed by ID. * Set of all connections, indexed by ID.
*/ */
GuacamoleRootUI.configurations = {}; GuacamoleRootUI.connections = {};
/** /**
* Adds the given connection to the recent connections list. * Adds the given connection to the recent connections list.
@@ -260,7 +209,7 @@ GuacamoleRootUI.configurations = {};
GuacamoleRootUI.addRecentConnection = function(connection) { GuacamoleRootUI.addRecentConnection = function(connection) {
// Add connection object to list of thumbnailed connections // Add connection object to list of thumbnailed connections
GuacamoleRootUI.thumbnailConnections[connection.configuration.id] = GuacamoleRootUI.thumbnailConnections[connection.connection.id] =
connection; connection;
// Add connection to recent list // Add connection to recent list
@@ -285,14 +234,14 @@ GuacamoleRootUI.reset = function() {
// Get parameters from query string // Get parameters from query string
var parameters = window.location.search.substring(1); var parameters = window.location.search.substring(1);
// Read configs // Read connections
var configs; var connections;
try { try {
configs = GuacamoleRootUI.getConfigurations(parameters); connections = GuacamoleService.getConnections(parameters);
} }
catch (e) { catch (e) {
// Show login UI if unable to get configs // Show login UI if unable to get connections
GuacamoleRootUI.views.login.style.display = ""; GuacamoleRootUI.views.login.style.display = "";
GuacamoleRootUI.views.connections.style.display = "none"; GuacamoleRootUI.views.connections.style.display = "none";
@@ -301,13 +250,13 @@ GuacamoleRootUI.reset = function() {
} }
// Add connection icons // Add connection icons
for (var i=0; i<configs.length; i++) { for (var i=0; i<connections.length; i++) {
// Add configuration to set // Add connection to set
GuacamoleRootUI.configurations[configs[i].id] = configs[i]; GuacamoleRootUI.connections[connections[i].id] = connections[i];
// Get connection element // Get connection element
var connection = new GuacamoleRootUI.Connection(configs[i]); var connection = new GuacamoleRootUI.Connection(connections[i]);
// If screenshot present, add to recent connections // If screenshot present, add to recent connections
if (connection.hasThumbnail()) if (connection.hasThumbnail())
@@ -315,11 +264,11 @@ GuacamoleRootUI.reset = function() {
// Add connection to connection list // Add connection to connection list
GuacamoleRootUI.sections.all_connections.appendChild( GuacamoleRootUI.sections.all_connections.appendChild(
new GuacamoleRootUI.Connection(configs[i]).getElement()); new GuacamoleRootUI.Connection(connections[i]).getElement());
} }
// If configs could be retrieved, display list // If connections could be retrieved, display list
GuacamoleRootUI.views.login.style.display = "none"; GuacamoleRootUI.views.login.style.display = "none";
GuacamoleRootUI.views.connections.style.display = ""; GuacamoleRootUI.views.connections.style.display = "";
@@ -338,7 +287,7 @@ GuacamoleHistory.onchange = function(id, old_entry, new_entry) {
// Create new connection // Create new connection
connection = new GuacamoleRootUI.Connection( connection = new GuacamoleRootUI.Connection(
GuacamoleRootUI.configurations[id] GuacamoleRootUI.connections[id]
); );
GuacamoleRootUI.addRecentConnection(connection); GuacamoleRootUI.addRecentConnection(connection);

View File

@@ -0,0 +1,75 @@
/*
* Guacamole - Clientless Remote Desktop
* Copyright (C) 2010 Michael Jumper
*
* This program is free software: you can redistribute it and/or modify
* it under the terms of the GNU Affero General Public License as published by
* the Free Software Foundation, either version 3 of the License, or
* (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU Affero General Public License for more details.
*
* You should have received a copy of the GNU Affero General Public License
* along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
/**
* Main Guacamole web service namespace.
* @namespace
*/
var GuacamoleService = GuacamoleService || {};
/**
* An arbitrary Guacamole connection, consisting of an ID/protocol pair.
*
* @constructor
* @param {String} protocol The protocol used by this connection.
* @param {String} id The ID associated with this connection.
*/
GuacamoleService.Connection = function(protocol, id) {
/**
* The protocol associated with this connection.
*/
this.protocol = protocol;
/**
* The ID associated with this connection.
*/
this.id = id;
};
GuacamoleService.getConnections = function(parameters) {
// Construct request URL
var connections_url = "connections";
if (parameters) connections_url += "?" + parameters;
// Get connection list
var xhr = new XMLHttpRequest();
xhr.open("GET", connections_url, false);
xhr.send(null);
// If fail, throw error
if (xhr.status != 200)
throw new Error(xhr.statusText);
// Otherwise, get list
var connections = new Array();
var connectionElements = xhr.responseXML.getElementsByTagName("connection");
for (var i=0; i<connectionElements.length; i++) {
connections.push(new GuacamoleService.Connection(
connectionElements[i].getAttribute("protocol"),
connectionElements[i].getAttribute("id")
));
}
return connections;
};