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

Add auto-fit setting, update property before calling onchange.

Browse Source
This commit is contained in:
Michael Jumper
2012-11-05 11:29:12 -08:00
parent dd2beb7f35
commit 730ad5b3af
4 changed files with 99 additions and 45 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -90,6 +90,23 @@
<textarea rows="10" cols="40" id="clipboard"></textarea>
</div>
<h2>Settings</h2>
<div id="settings">
<dl>
<dt>
<input type="checkbox" id="auto-fit"/>
Auto-fit display to browser window.
</dt>
<dd>
If checked, remote displays are automatically
scaled to exactly fit within the browser window. If
unchecked, remote displays are always shown at their
natural resolution, even if doing so causes the display
to extend beyond the bounds of the window.
</dd>
</dl>
</div>
</div>
<div id="version-dialog">
@@ -103,8 +120,13 @@
<script type="text/javascript"> /* <![CDATA[ */
var state = new GuacamoleSessionState();
var auto_fit = document.getElementById("auto-fit");
var clipboard = document.getElementById("clipboard");
auto_fit.onchange = auto_fit.onclick = function() {
state.setProperty("auto-fit", auto_fit.checked);
};
clipboard.onchange = function() {
state.setProperty("clipboard", clipboard.value);
};
@@ -112,12 +134,21 @@
state.onchange = function(old_state, new_state, name) {
if (name == "clipboard")
clipboard.value = new_state[name];
else if (name == "auto-fit")
auto_fit.checked = new_state[name];
};
// Update clipboard with current data
if (state.getProperty("clipboard"))
clipboard.value = state.getProperty("clipboard");
// Default to true if auto-fit not specified
if (state.getProperty("auto-fit") === undefined)
state.setProperty("auto-fit", true);
// Update auto-fit setting in UI
auto_fit.checked = state.getProperty("auto-fit");
// Constructs the URL for a client which connects to the connection
// with the given id.
function getClientURL(id) {

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

@@ -367,18 +367,34 @@ GuacamoleUI.attach = function(guac) {
// Enable keyboard by default
enableKeyboard();
function updateDisplayScale() {
console.log(state.getProperty("auto-fit"));
// If auto-fit is enabled, scale display
if (state.getProperty("auto-fit")) {
// Calculate scale to fit screen
var fit_scale = Math.min(
window.innerWidth / guac.getWidth(),
window.innerHeight / guac.getHeight()
);
// Scale client
if (fit_scale != guac.getScale())
guac.scale(fit_scale);
}
// Otherwise, scale to 100%
else if (guac.getScale() != 1.0)
guac.scale(1.0);
}
// Handle resize
guac.onresize = function(width, height) {
// Calculate scale to fit screen
var fit_scale = Math.min(
window.innerWidth / width,
window.innerHeight / height
);
// Scale client
guac.scale(fit_scale);
updateDisplayScale();
}
// Handle client state change
@@ -472,15 +488,7 @@ GuacamoleUI.attach = function(guac) {
window.onresize = function() {
guac.sendSize(window.innerWidth, window.innerHeight);
// Calculate scale to fit screen
var fit_scale = Math.min(
window.innerWidth / guac.getWidth(),
window.innerHeight / guac.getHeight()
);
// Scale client
guac.scale(fit_scale);
updateDisplayScale();
};
@@ -492,6 +500,9 @@ GuacamoleUI.attach = function(guac) {
state.onchange = function(old_state, new_state, name) {
if (name == "clipboard")
guac.setClipboard(new_state[name]);
else if (name == "auto-fit")
updateDisplayScale();
};
};

14
guacamole/src/main/webapp/scripts/session.js
View File

@@ -44,11 +44,15 @@ function GuacamoleSessionState() {
// Pull current state
var new_state = JSON.parse(localStorage.getItem("GUACAMOLE_STATE") || "{}");
// Check if value is different
// Assign new state
var old_state = state;
state = new_state;
// Check if any values are different
for (var name in new_state) {
// If value changed, call handler
var old = state[name];
var old = old_state[name];
if (old != new_state[name]) {
// Call change handler
@@ -59,9 +63,6 @@ function GuacamoleSessionState() {
}
// Assign new state
state = new_state;
};
/**
@@ -100,6 +101,9 @@ function GuacamoleSessionState() {
// Reload properties every second
window.setInterval(guac_state.reload, 1000);
// Reload properties when focus is gained
window.addEventListener("focus", guac_state.reload);
// Initial load
guac_state.reload();

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

@@ -184,16 +184,6 @@ div#connection-list-ui h1 {
}
div#connection-list-ui img {
vertical-align: middle;
}
div#logout-panel {
padding: 0.45em;
text-align: right;
float: right;
}
div#connection-list-ui h2 {
padding: 0.5em;
@@ -209,13 +199,29 @@ div#connection-list-ui h2 {
}
div#connection-list-ui img {
vertical-align: middle;
}
div#logout-panel {
padding: 0.45em;
text-align: right;
float: right;
}
.history-unavailable div#recent-connections {
display: none;
}
div#recent-connections,
div#clipboardDiv,
div#settings,
div#other-connections {
margin: 0;
padding: 1em;
}
div#recent-connections {
margin: 1em;
margin-top: 0;
text-align: center;
}
@@ -263,11 +269,6 @@ div#recent-connections div.connection {
max-width: 75%;
}
div#other-connections {
margin: 0;
padding: 1em;
}
div#other-connections .connection {
display: block;
text-align: left;
@@ -316,10 +317,17 @@ div#recent-connections .protocol {
margin-left: 0.25em;
}
#clipboardDiv {
padding: 1em;
}
#clipboardDiv textarea {
width: 100%;
}
#settings dt {
border-bottom: 1px dotted #AAA;
padding-bottom: 0.25em;
}
#settings dd {
margin: 1.5em;
margin-left: 2.5em;
font-size: 0.75em;
}