mirror of
https://github.com/gyurix1968/guacamole-client.git
synced 2025-09-06 13:17:41 +00:00
Improve styling and handling of missing history.
This commit is contained in:
@@ -74,6 +74,7 @@
|
||||
|
||||
<h2>Recent Connections</h2>
|
||||
<div id="recent-connections">
|
||||
<p id="no-recent">No recent connections.</p>
|
||||
</div>
|
||||
|
||||
<h2>Other Connections</h2>
|
||||
@@ -133,16 +134,20 @@
|
||||
// Remove all rows from connections list
|
||||
var recent_connections = document.getElementById("recent-connections");
|
||||
var other_connections = document.getElementById("other-connections");
|
||||
var no_recent_connections = document.getElementById("no-recent");
|
||||
|
||||
// Get thumbnail set from local storage
|
||||
var thumbnails = {};
|
||||
try {
|
||||
thumbnails = JSON.parse(localStorage.getItem("GUAC_THUMBNAILS"));
|
||||
if (localStorage) {
|
||||
var thumbnails = {};
|
||||
try {
|
||||
var thumbnail_json = localStorage.getItem("GUAC_THUMBNAILS");
|
||||
if (thumbnail_json)
|
||||
thumbnails = JSON.parse(thumbnail_json);
|
||||
}
|
||||
catch (e) {}
|
||||
}
|
||||
catch (e) {
|
||||
}
|
||||
for (var test in thumbnails)
|
||||
console.log(test);
|
||||
else
|
||||
document.body.className += " history-unavailable";
|
||||
|
||||
// Add connection icons
|
||||
for (var i=0; i<configs.length; i++) {
|
||||
@@ -166,15 +171,18 @@
|
||||
var thumbnail = document.createElement("div");
|
||||
thumbnail.className = "thumbnail";
|
||||
|
||||
// Create link to client
|
||||
var url = getClientURL(configs[i].id)
|
||||
var clientLink = document.createElement("a");
|
||||
clientLink.setAttribute("href", url);
|
||||
|
||||
connection.onclick = function() {
|
||||
window.location = url;
|
||||
};
|
||||
function redirect(url) {
|
||||
return 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);
|
||||
|
||||
clientLink.textContent = configs[i].id;
|
||||
@@ -197,6 +205,7 @@
|
||||
thumbnail.appendChild(img);
|
||||
|
||||
recent_connections.appendChild(connection);
|
||||
no_recent_connections.style.display = "none";
|
||||
}
|
||||
else
|
||||
other_connections.appendChild(connection);
|
||||
|
@@ -781,45 +781,47 @@ GuacamoleUI.attach = function(guac) {
|
||||
GuacamoleUI.hideStatus();
|
||||
title_prefix = null;
|
||||
|
||||
window.setTimeout(function() {
|
||||
if (localStorage) {
|
||||
window.setTimeout(function() {
|
||||
|
||||
// Get screenshot
|
||||
var canvas = guac.flatten();
|
||||
// Get screenshot
|
||||
var canvas = guac.flatten();
|
||||
|
||||
// Calculate scale of thumbnail (max 320x240, max zoom 100%)
|
||||
var scale = Math.min(
|
||||
320 / canvas.width,
|
||||
240 / canvas.height,
|
||||
1
|
||||
);
|
||||
// Calculate scale of thumbnail (max 320x240, max zoom 100%)
|
||||
var scale = Math.min(
|
||||
320 / canvas.width,
|
||||
240 / canvas.height,
|
||||
1
|
||||
);
|
||||
|
||||
// Create thumbnail canvas
|
||||
var thumbnail = document.createElement("canvas");
|
||||
thumbnail.width = canvas.width*scale;
|
||||
thumbnail.height = canvas.height*scale;
|
||||
// Create thumbnail canvas
|
||||
var thumbnail = document.createElement("canvas");
|
||||
thumbnail.width = canvas.width*scale;
|
||||
thumbnail.height = canvas.height*scale;
|
||||
|
||||
// Scale screenshot to thumbnail
|
||||
var context = thumbnail.getContext("2d");
|
||||
context.drawImage(canvas,
|
||||
0, 0, canvas.width, canvas.height,
|
||||
0, 0, thumbnail.width, thumbnail.height
|
||||
);
|
||||
// Scale screenshot to thumbnail
|
||||
var context = thumbnail.getContext("2d");
|
||||
context.drawImage(canvas,
|
||||
0, 0, canvas.width, canvas.height,
|
||||
0, 0, thumbnail.width, thumbnail.height
|
||||
);
|
||||
|
||||
// Get thumbnail set from local storage
|
||||
var thumbnails = {};
|
||||
try {
|
||||
thumbnails = JSON.parse(localStorage.getItem("GUAC_THUMBNAILS"));
|
||||
}
|
||||
catch (e) {
|
||||
}
|
||||
// Get thumbnail set from local storage
|
||||
var thumbnails = {};
|
||||
try {
|
||||
var thumbnail_json = localStorage.getItem("GUAC_THUMBNAILS");
|
||||
if (thumbnail_json)
|
||||
thumbnails = JSON.parse(thumbnail_json);
|
||||
}
|
||||
catch (e) {}
|
||||
|
||||
// Save thumbnail to local storage
|
||||
var id = decodeURIComponent(window.location.search.substring(4));
|
||||
thumbnails[id] = thumbnail.toDataURL();
|
||||
localStorage.setItem("GUAC_THUMBNAILS", JSON.stringify(thumbnails));
|
||||
|
||||
}, 5000);
|
||||
// Save thumbnail to local storage
|
||||
var id = decodeURIComponent(window.location.search.substring(4));
|
||||
thumbnails[id] = thumbnail.toDataURL();
|
||||
localStorage.setItem("GUAC_THUMBNAILS", JSON.stringify(thumbnails));
|
||||
|
||||
}, 5000);
|
||||
}
|
||||
break;
|
||||
|
||||
// Disconnecting
|
||||
|
@@ -225,11 +225,24 @@ div#connection-list-ui h2 {
|
||||
|
||||
}
|
||||
|
||||
.history-unavailable div#recent-connections {
|
||||
display: none;
|
||||
}
|
||||
|
||||
div#recent-connections {
|
||||
margin: 1em;
|
||||
margin-top: 0;
|
||||
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 {
|
||||
|
Reference in New Issue
Block a user