<head>
<link rel="icon" type="image/png" href="images/guacamole-icon-64.png"/>
- <link rel="stylesheet" type="text/css" href="guacamole.css"/>
- <link rel="stylesheet" type="text/css" href="guac-web-lib/css/guacamole.css"/>
- <link rel="stylesheet" type="text/css" href="keyboard.css"/>
+ <link rel="stylesheet" type="text/css" href="styles/guacamole.css"/>
+ <link rel="stylesheet" type="text/css" href="styles/keyboard.css"/>
<title>Guacamole</title>
</head>
<p id="login-error"></p>
- <form id="login-form" action="login" method="post">
+ <form id="login-form" action="#" method="post">
<table id="login-fields">
<tr>
<th>Username</th>
<button id="CtrlAltDelete">Ctrl-Alt-Delete</button>
<!-- Logo and status -->
- <img id="logo" src="images/guacamole-logo.png" alt="Guacamole" title="__GUAC_VERSION"/>
+ <img id="logo" src="images/guacamole-logo.png" alt="Guacamole" title="Guacamole 0.4.0"/>
<span id="state"></span>
<a href="agpl-3.0-standalone.html"><img id="license" src="images/agpl-logo.png" alt="AGPLv3"/></a>
<!-- Scripts -->
- <script type="text/javascript" src="guac-web-lib/javascript/keymap.js"></script>
- <script type="text/javascript" src="guac-web-lib/javascript/keyboard.js"></script>
- <script type="text/javascript" src="guac-web-lib/javascript/mouse.js"></script>
- <script type="text/javascript" src="guac-web-lib/javascript/layer.js"></script>
- <script type="text/javascript" src="guac-web-lib/javascript/guacamole.js"></script>
- <script type="text/javascript" src="guac-web-lib/javascript/oskeyboard.js"></script>
+ <script type="text/javascript" src="guacamole-common-js/keymap.js"></script>
+ <script type="text/javascript" src="guacamole-common-js/keyboard.js"></script>
+ <script type="text/javascript" src="guacamole-common-js/mouse.js"></script>
+ <script type="text/javascript" src="guacamole-common-js/layer.js"></script>
+ <script type="text/javascript" src="guacamole-common-js/tunnel.js"></script>
+ <script type="text/javascript" src="guacamole-common-js/guacamole.js"></script>
+ <script type="text/javascript" src="guacamole-common-js/oskeyboard.js"></script>
<!-- Init -->
<script type="text/javascript"> /* <![CDATA[ */
var loginForm = document.getElementById("login-form");
var loginUI = document.getElementById("login-ui");
+ var display = document.getElementById("display");
loginForm.onsubmit = function() {
"username=" + encodeURIComponent(username.value)
+ "&password=" + encodeURIComponent(password.value)
- var xmlhttprequest = new XMLHttpRequest();
- xmlhttprequest.open("POST", "login", false);
- xmlhttprequest.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
- xmlhttprequest.setRequestHeader("Content-length", data.length);
- xmlhttprequest.send(data);
+ // Instantiate client
+ var guac = new GuacamoleClient(
+ display,
+ new GuacamoleHTTPTunnel("tunnel")
+ );
+
+ try {
+
+ // Connect client
+ guac.connect(data);
- if (xmlhttprequest.status == 200) {
- loginUI.style.display = "none";
- startGuacamole();
}
- else {
+ catch (e) {
var loginError = document.getElementById("login-error");
// Display error, reset and refocus password field
- loginError.textContent = "Invalid login. Please try again.";
+ loginError.textContent = e.message;
password.value = "";
password.focus();
+ return false;
+
}
+ // On success, display UI
+ startGuacamole(guac);
return false;
}
// Shows guacamole interface and initiates connection to guacamole
- function startGuacamole() {
+ function startGuacamole(guac) {
+ loginUI.style.display = "none";
document.getElementById("main-guacamole-ui").style.display = "block";
var menu = document.getElementById("menu");
- var display = document.getElementById("display");
var logo = document.getElementById("logo");
var errorDialog = document.getElementById("errorDialog");
window.onresize();
- // Instantiate client
- var guac = new GuacamoleClient(display);
-
var state = document.getElementById("state");
guac.setOnStateChangeHandler(function(clientState) {
var guacErrorImage = new Image();
guacErrorImage.src = "images/noguacamole-logo.png";
+ guac.setNameHandler(function(name) {
+ document.title = name;
+ });
+
guac.setErrorHandler(function(error) {
+
+ guac.disconnect();
+
menu.className = "error";
+ display.className += " guac-error";
+
logo.src = guacErrorImage.src;
errorDialogText.textContent = error;
errorDialog.style.visibility = "visible";
+
+ // Show error by desaturating display
+ var layers = guac.getLayers();
+ for (var i=0; i<layers.length; i++) {
+ layers[i].filter(desaturateFilter);
+ }
+
+ // Filter for desaturation
+ function desaturateFilter(data, width, height) {
+
+ for (var i=0; i<data.length; i+=4) {
+
+ // Get RGB values
+ var r = data[i];
+ var g = data[i+1];
+ var b = data[i+2];
+
+ // Desaturate
+ var v = Math.max(r, g, b) / 2;
+ data[i] = v;
+ data[i+1] = v;
+ data[i+2] = v;
+
+ }
+
+ }
+
});
+ // Mouse
+ var mouse = new GuacamoleMouse(display);
+ mouse.setButtonPressedHandler(
+ function(mouseState) {
+ guac.sendMouseState(mouseState);
+ }
+ );
+
+ mouse.setButtonReleasedHandler(
+ function(mouseState) {
+ guac.sendMouseState(mouseState);
+ }
+ );
+
+ mouse.setMovementHandler(
+ function(mouseState) {
+ guac.sendMouseState(mouseState);
+ }
+ );
+
+ // Keyboard
+ var keyboard = new GuacamoleKeyboard(document);
+
+ function disableKeyboard() {
+ keyboard.setKeyPressedHandler(null);
+ keyboard.setKeyReleasedHandler(null);
+ }
+
+ function enableKeyboard() {
+ keyboard.setKeyPressedHandler(
+ function (keysym) {
+ guac.sendKeyEvent(1, keysym);
+ }
+ );
+
+ keyboard.setKeyReleasedHandler(
+ function (keysym) {
+ guac.sendKeyEvent(0, keysym);
+ }
+ );
+ }
+
+ // Enable keyboard by default
+ enableKeyboard();
+
// Reconnect button
var reconnect = document.getElementById("reconnect");
reconnect.onclick = function() {
window.location.reload();
};
- // Connect
- guac.connect();
-
// Disconnect on close
window.onunload = function() {
guac.disconnect();
// Ignore keypresses when clipboard is focused
clipboardElement.onfocus = function() {
- guac.disableKeyboard();
+ disableKeyboard();
};
// Capture keypresses when clipboard is not focused
clipboardElement.onblur = function() {
- guac.enableKeyboard();
+ enableKeyboard();
};
// Server copy handler
osKeyboard.setKeyPressedHandler(
function(keysym) {
- guac.pressKey(keysym);
+ guac.sendKeyEvent(1, keysym);
}
);
osKeyboard.setKeyReleasedHandler(
function(keysym) {
- guac.releaseKey(keysym);
+ guac.sendKeyEvent(0, keysym);
}
);
var CtrlAltDelete = document.getElementById("CtrlAltDelete");
CtrlAltDelete.onclick = function() {
- guac.pressKey(KEYSYM_CTRL);
- guac.pressKey(KEYSYM_ALT);
- guac.pressKey(KEYSYM_DELETE);
- guac.releaseKey(KEYSYM_DELETE);
- guac.releaseKey(KEYSYM_ALT);
- guac.releaseKey(KEYSYM_CTRL);
+ guac.sendKeyEvent(1, KEYSYM_CTRL);
+ guac.sendKeyEvent(1, KEYSYM_ALT);
+ guac.sendKeyEvent(1, KEYSYM_DELETE);
+ guac.sendKeyEvent(0, KEYSYM_DELETE);
+ guac.sendKeyEvent(0, KEYSYM_ALT);
+ guac.sendKeyEvent(0, KEYSYM_CTRL);
}
}
projects / guacamole.git / blobdiff