safebox/guacamole-client
4
0
Fork 0
mirror of https://github.com/gyurix1968/guacamole-client.git synced 2025-09-09 22:51:22 +00:00
Code Issues Packages Projects Releases Wiki Activity

Working login + connection list UI stub.

Browse Source
This commit is contained in:
Michael Jumper
2011-08-11 09:57:25 -07:00
parent e5e34a0367
commit 9ef50a1ce7
4 changed files with 206 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
guacamole/src/main/webapp/WEB-INF/web.xml
View File

@@ -28,6 +28,17 @@
</session-timeout>
</session-config>
<!-- Basic Login Servlet -->
<servlet>
<description>Login servlet.</description>
<servlet-name>Login</servlet-name>
<servlet-class>net.sourceforge.guacamole.net.basic.BasicLogin</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>Login</servlet-name>
<url-pattern>/login</url-pattern>
</servlet-mapping>
<!-- Guacamole Tunnel Servlet -->
<servlet>
<description>Tunnel servlet.</description>

60
guacamole/src/main/webapp/index.xhtml
View File

@@ -29,7 +29,7 @@
<body>
<div id="login-ui">
<div id="login-ui" style="display: none">
<div id="login-dialog-middle">
<div id="login-dialog">
@@ -60,25 +60,51 @@
</form>
</div>
<div id="version-dialog">
Guacamole ${project.version}
</div>
</div>
</div>
<!-- Main UI - hidden until login succeeds -->
<!-- Connection list UI -->
<div id="connection-list-ui" style="display: none">
<!-- STUB -->
<h1>
<img class="logo" src="images/guacamole-logo-64.png" alt=""/>
Available Connections
</h1>
<table class="connections">
<thead>
<tr>
<th>Name</th>
<th>Protocol</th>
<th>Description</th>
</tr>
</thead>
<tbody>
<tr>
<td>zhz@localhost</td>
<td>vnc</td>
<td class="description">Connect to test.guac-dev.org via vnc.</td>
</tr>
<tr>
<td>zhz@localhost</td>
<td>ssh</td>
<td class="description">Connect to test.guac-dev.org via ssh.</td>
</tr>
</tbody>
</table>
</div>
<div id="version-dialog">
Guacamole ${project.version}
</div>
<!-- Init -->
<script type="text/javascript"> /* <![CDATA[ */
var loginForm = document.getElementById("login-form");
var loginUI = document.getElementById("login-ui");
var display = document.getElementById("display");
var connectionListUI = document.getElementById("connection-list-ui");
// TODO: Get connection list
// On no-auth fail, show login UI
@@ -93,7 +119,21 @@
+ "&password=" + encodeURIComponent(password.value)
try {
// STUB
// Log in
var xhr = new XMLHttpRequest();
xhr.open("POST", "login", false);
xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhr.send(data);
// Handle failures
if (xhr.status != 200)
throw new Error("Invalid login");
// Hide login UI, display connections
loginUI.style.display = "none";
connectionListUI.style.display = "";
}
catch (e) {
@@ -113,6 +153,8 @@
}
loginUI.style.display = "";
/* ]]> */ </script>
</body>

58
guacamole/src/main/webapp/styles/login.css
View File

@@ -18,7 +18,7 @@
*/
body {
background: black;
background: gray;
font-family: sans-serif;
padding: 0;
margin: 0;
@@ -114,7 +114,7 @@ div#login-dialog #login-fields img.logo {
float: left;
}
div#login-ui #version-dialog {
div#version-dialog {
position: fixed;
right: 0;
bottom: 0;
@@ -136,3 +136,57 @@ img#license {
float: right;
margin: 2px;
}
div#connection-list-ui {
background: #BCA;
}
div#connection-list-ui table {
width: 100%;
border-collapse: collapse;
}
div#connection-list-ui table thead {
background: #9A8;
}
div#connection-list-ui table thead tr {
border-top: 1px solid #676;
border-bottom: 1px solid gray;
}
div#connection-list-ui table tbody {
background: white;
}
div#connection-list-ui table tbody tr {
border-top: 1px solid gray;
border-bottom: 1px solid gray;
}
div#connection-list-ui table td {
padding: 0.25em;
text-align: center;
}
div#connection-list-ui table tbody tr:nth-child(even) { background: #CCC; }
div#connection-list-ui table tbody tr:nth-child(odd) { background: #EEE; }
div#connection-list-ui table td.description {
text-align: left;
}
div#connection-list-ui h1 {
margin: 0;
padding: 0.5em;
font-size: 2em;
vertical-align: middle;
text-align: center;
}
div#connection-list-ui img {
vertical-align: middle;
}