clockwerk-guacamole – Blame information for rev 2
?pathlinks?
Rev | Author | Line No. | Line |
---|---|---|---|
1 | eva | 1 | <?xml version="1.0" encoding="UTF-8"?> |
2 | <!DOCTYPE html> |
||
3 | <html xmlns="http://www.w3.org/1999/xhtml"> |
||
2 | vero | 4 | <head> |
5 | <title>Clockwerk</title> |
||
6 | <link rel="stylesheet" href="styles/gray.css" type="text/css" /> |
||
7 | <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, target-densitydpi=device-dpi"/> |
||
8 | </head> |
||
9 | <body class="dark-grey"> |
||
10 | <div class="center"> |
||
11 | <img src="images/clockwerk-logo.png"/> |
||
12 | <h1>OpenSim Console Access</h1> |
||
13 | <hr/> |
||
14 | <script type="text/javascript" src="scripts/jquery.min.js"></script> |
||
15 | <div id="login-ui" style="display; none"> |
||
16 | <p id="login-error"></p> |
||
17 | <form id="login-form" class="dark-grey" style="color:#000;text-shadow:none;text-align:left;max-width:480px;min-width:150px" method="post" action="#"><div class="title"></div> |
||
18 | <div class="element-input" ><label class="title">Username<span class="required"></span></label><input class="large" type="text" name="username" id="username" required="required"/></div> |
||
19 | <div class="element-password" ><label class="title">Password<span class="required"></span></label><input class="large" type="password" name="password" id="password" value="" required="required"/></div> |
||
20 | <div class="submit"> |
||
21 | <input type="submit" name="login" id="login" value="Login" /> |
||
22 | <input type="button" onclick="parent.location='/welcome.php'" value="Cancel" /> |
||
23 | </div> |
||
24 | </form> |
||
25 | </div> |
||
1 | eva | 26 | |
27 | <!-- Connection list UI --> |
||
28 | <div id="connection-list-ui" style="display: none"> |
||
29 | |||
30 | <div id="logout-panel"> |
||
31 | <button id="logout">Logout</button> |
||
32 | </div> |
||
33 | |||
34 | <h1> |
||
35 | <img class="logo" src="images/guacamole-logo-64.png" alt=""/> |
||
36 | Available Connections |
||
37 | </h1> |
||
38 | |||
39 | <table class="connections"> |
||
40 | <thead> |
||
41 | <tr> |
||
42 | <th class="protocol"> </th> |
||
43 | <th class="name">Name</th> |
||
44 | </tr> |
||
45 | </thead> |
||
46 | <tbody id="connections-tbody"> |
||
47 | </tbody> |
||
48 | </table> |
||
49 | |||
50 | </div> |
||
51 | |||
52 | <script type="text/javascript" src="scripts/connections.js"></script> |
||
53 | |||
54 | <!-- Init --> |
||
55 | <script type="text/javascript"> /* <![CDATA[ */ |
||
56 | |||
57 | // Constructs the URL for a client which connects to the connection |
||
58 | // with the given id. |
||
59 | function getClientURL(id) { |
||
60 | |||
61 | // Construct URL for client with given id |
||
62 | return "client.xhtml?id=" + encodeURIComponent(id); |
||
63 | |||
64 | } |
||
65 | |||
66 | // Resets the interface such that the login UI is displayed if |
||
67 | // the user is not authenticated (or authentication fails) and |
||
68 | // the connection list UI (or the client for the only available |
||
69 | // connection, if there is only one) is displayed if the user is |
||
70 | // authenticated. |
||
71 | function resetUI() { |
||
72 | |||
73 | // Get parameters from query string |
||
74 | var parameters = window.location.search.substring(1); |
||
75 | |||
76 | var configs; |
||
77 | try { |
||
78 | configs = getConfigList(parameters); |
||
79 | } |
||
80 | catch (e) { |
||
81 | |||
82 | // Show login UI if unable to get configs |
||
83 | loginUI.style.display = ""; |
||
84 | connectionListUI.style.display = "none"; |
||
85 | |||
86 | return; |
||
87 | |||
88 | } |
||
89 | |||
90 | // If only one connection, redirect to that. |
||
91 | if (configs.length == 1) { |
||
92 | window.location.href = getClientURL(configs[0].id); |
||
93 | return; |
||
94 | } |
||
95 | |||
96 | // Remove all rows from connections list |
||
97 | var tbody = document.getElementById("connections-tbody"); |
||
98 | tbody.innerHTML = ""; |
||
99 | |||
100 | // Add one row per connection |
||
101 | for (var i=0; i<configs.length; i++) { |
||
102 | |||
103 | // Create row and cells |
||
104 | var tr = document.createElement("tr"); |
||
105 | var protocol = document.createElement("td"); |
||
106 | var id = document.createElement("td"); |
||
107 | |||
108 | var protocolIcon = document.createElement("div"); |
||
109 | protocolIcon.className = "protocol icon " + configs[i].protocol; |
||
110 | |||
111 | // Set CSS |
||
112 | protocol.className = "protocol"; |
||
113 | id.className = "name"; |
||
114 | |||
115 | // Create link to client |
||
116 | var clientLink = document.createElement("a"); |
||
117 | clientLink.setAttribute("href", getClientURL(configs[i].id)); |
||
118 | |||
119 | // Set cell contents |
||
120 | protocol.appendChild(protocolIcon); |
||
121 | //protocol.textContent = configs[i].protocol; |
||
122 | clientLink.textContent = configs[i].id; |
||
123 | id.appendChild(clientLink); |
||
124 | |||
125 | // Add cells |
||
126 | tr.appendChild(protocol); |
||
127 | tr.appendChild(id); |
||
128 | |||
129 | // Add row |
||
130 | tbody.appendChild(tr); |
||
131 | |||
132 | } |
||
133 | |||
134 | // If configs could be retrieved, display list |
||
135 | loginUI.style.display = "none"; |
||
136 | connectionListUI.style.display = ""; |
||
137 | |||
138 | } |
||
139 | |||
140 | var loginForm = document.getElementById("login-form"); |
||
141 | var loginUI = document.getElementById("login-ui"); |
||
142 | var connectionListUI = document.getElementById("connection-list-ui"); |
||
143 | var logout = document.getElementById("logout"); |
||
144 | var username = document.getElementById("username"); |
||
145 | var password = document.getElementById("password"); |
||
146 | |||
147 | logout.onclick = function() { |
||
148 | window.location.href = "logout"; |
||
149 | }; |
||
150 | |||
151 | loginForm.onsubmit = function() { |
||
152 | |||
153 | // Get parameters from query string |
||
154 | var parameters = window.location.search.substring(1); |
||
155 | |||
156 | // Get username and password from form |
||
157 | var data = |
||
158 | "username=" + encodeURIComponent(username.value) |
||
159 | + "&password=" + encodeURIComponent(password.value) |
||
160 | |||
161 | // Include query parameters in submission data |
||
162 | if (parameters) data += "&" + parameters; |
||
163 | |||
164 | try { |
||
165 | |||
166 | // Log in |
||
167 | var xhr = new XMLHttpRequest(); |
||
168 | xhr.open("POST", "login", false); |
||
169 | xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); |
||
170 | xhr.send(data); |
||
171 | |||
172 | // Handle failures |
||
173 | if (xhr.status != 200) |
||
174 | throw new Error("Invalid login"); |
||
175 | |||
176 | // Ensure username/password fiels are blurred after submit |
||
177 | username.blur(); |
||
178 | password.blur(); |
||
179 | |||
180 | resetUI(); |
||
181 | |||
182 | } |
||
183 | catch (e) { |
||
184 | |||
185 | var loginError = document.getElementById("login-error"); |
||
186 | |||
187 | // Display error, reset and refocus password field |
||
188 | loginError.textContent = e.message; |
||
189 | password.value = ""; |
||
190 | password.focus(); |
||
191 | |||
192 | return false; |
||
193 | |||
194 | } |
||
195 | |||
196 | // On success, hide loginUI, get and show connection list. |
||
197 | return false; |
||
198 | |||
199 | } |
||
200 | |||
201 | // Turn off autocorrect and autocapitalization on usename |
||
202 | username.setAttribute("autocorrect", "off"); |
||
203 | username.setAttribute("autocapitalize", "off"); |
||
204 | |||
205 | resetUI(); |
||
206 | |||
207 | /* ]]> */ </script> |
||
208 | |||
2 | vero | 209 | </div> |
210 | </body> |
||
1 | eva | 211 | </html> |