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

Improve styling and handling of missing history.

Browse Source
This commit is contained in:
Michael Jumper
2012-11-03 19:24:30 -07:00
parent a9c2f5ab8d
commit a1894549a2
3 changed files with 72 additions and 48 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -74,6 +74,7 @@
<h2>Recent Connections</h2> <h2>Recent Connections</h2>
<div id="recent-connections"> <div id="recent-connections">
<p id="no-recent">No recent connections.</p>
</div> </div>
<h2>Other Connections</h2> <h2>Other Connections</h2>
@@ -133,16 +134,20 @@
// Remove all rows from connections list // Remove all rows from connections list
var recent_connections = document.getElementById("recent-connections"); var recent_connections = document.getElementById("recent-connections");
var other_connections = document.getElementById("other-connections"); var other_connections = document.getElementById("other-connections");
var no_recent_connections = document.getElementById("no-recent");
// Get thumbnail set from local storage // Get thumbnail set from local storage
var thumbnails = {}; if (localStorage) {
try { var thumbnails = {};
thumbnails = JSON.parse(localStorage.getItem("GUAC_THUMBNAILS")); try {
var thumbnail_json = localStorage.getItem("GUAC_THUMBNAILS");
if (thumbnail_json)
thumbnails = JSON.parse(thumbnail_json);
}
catch (e) {}
} }
catch (e) { else
} document.body.className += " history-unavailable";
for (var test in thumbnails)
console.log(test);
// Add connection icons // Add connection icons
for (var i=0; i<configs.length; i++) { for (var i=0; i<configs.length; i++) {
@@ -166,15 +171,18 @@
var thumbnail = document.createElement("div"); var thumbnail = document.createElement("div");
thumbnail.className = "thumbnail"; thumbnail.className = "thumbnail";
// Create link to client function redirect(url) {
var url = getClientURL(configs[i].id) return function() {
var clientLink = document.createElement("a"); window.location = url;
clientLink.setAttribute("href", url); };
}
connection.onclick = function() {
window.location = url;
};
// Create link to client
var clientLink = document.createElement("a");
var url = getClientURL(configs[i].id)
clientLink.setAttribute("href", url);
connection.onclick = redirect(url);
protocol.appendChild(protocolIcon); protocol.appendChild(protocolIcon);
clientLink.textContent = configs[i].id; clientLink.textContent = configs[i].id;
@@ -197,6 +205,7 @@
thumbnail.appendChild(img); thumbnail.appendChild(img);
recent_connections.appendChild(connection); recent_connections.appendChild(connection);
no_recent_connections.style.display = "none";
} }
else else
other_connections.appendChild(connection); other_connections.appendChild(connection);

66
guacamole/src/main/webapp/scripts/interface.js
View File

@@ -781,45 +781,47 @@ GuacamoleUI.attach = function(guac) {
GuacamoleUI.hideStatus(); GuacamoleUI.hideStatus();
title_prefix = null; title_prefix = null;
window.setTimeout(function() { if (localStorage) {
window.setTimeout(function() {
// Get screenshot // Get screenshot
var canvas = guac.flatten(); var canvas = guac.flatten();
// Calculate scale of thumbnail (max 320x240, max zoom 100%) // Calculate scale of thumbnail (max 320x240, max zoom 100%)
var scale = Math.min( var scale = Math.min(
320 / canvas.width, 320 / canvas.width,
240 / canvas.height, 240 / canvas.height,
1 1
); );
// Create thumbnail canvas // Create thumbnail canvas
var thumbnail = document.createElement("canvas"); var thumbnail = document.createElement("canvas");
thumbnail.width = canvas.width*scale; thumbnail.width = canvas.width*scale;
thumbnail.height = canvas.height*scale; thumbnail.height = canvas.height*scale;
// Scale screenshot to thumbnail // Scale screenshot to thumbnail
var context = thumbnail.getContext("2d"); var context = thumbnail.getContext("2d");
context.drawImage(canvas, context.drawImage(canvas,
0, 0, canvas.width, canvas.height, 0, 0, canvas.width, canvas.height,
0, 0, thumbnail.width, thumbnail.height 0, 0, thumbnail.width, thumbnail.height
); );
// Get thumbnail set from local storage // Get thumbnail set from local storage
var thumbnails = {}; var thumbnails = {};
try { try {
thumbnails = JSON.parse(localStorage.getItem("GUAC_THUMBNAILS")); var thumbnail_json = localStorage.getItem("GUAC_THUMBNAILS");
} if (thumbnail_json)
catch (e) { thumbnails = JSON.parse(thumbnail_json);
} }
catch (e) {}
// Save thumbnail to local storage // Save thumbnail to local storage
var id = decodeURIComponent(window.location.search.substring(4)); var id = decodeURIComponent(window.location.search.substring(4));
thumbnails[id] = thumbnail.toDataURL(); thumbnails[id] = thumbnail.toDataURL();
localStorage.setItem("GUAC_THUMBNAILS", JSON.stringify(thumbnails)); localStorage.setItem("GUAC_THUMBNAILS", JSON.stringify(thumbnails));
}, 5000);
}, 5000);
}
break; break;
// Disconnecting // Disconnecting

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

@@ -225,11 +225,24 @@ div#connection-list-ui h2 {
} }
.history-unavailable div#recent-connections {
display: none;
}
div#recent-connections { div#recent-connections {
margin: 1em; margin: 1em;
margin-top: 0; margin-top: 0;
text-align: center; text-align: center;
min-height: 240px; }
#no-recent {
color: black;
text-shadow: 1px 1px white;
opacity: 0.5;
font-size: 2em;
font-weight: bolder;
} }
div#recent-connections div.connection { div#recent-connections div.connection {