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

GUAC-326: Add event target. Add placeholder input method radio buttons. Add more menu styling.

Browse Source
This commit is contained in:
Michael Jumper
2014-04-22 15:34:47 -07:00
parent b98302f911
commit 6c917360cf
3 changed files with 94 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files

47
guacamole/src/main/webapp/client.xhtml
View File

@@ -37,14 +37,19 @@
<body>
<!-- Display -->
<div id="main">
<!-- Event target -->
<textarea id="target"></textarea>
<!-- Display -->
<div class="displayOuter">
<div class="displayMiddle">
<div id="display">
</div>
</div>
</div>
</div>
<!-- Dimensional clone of viewport -->
@@ -57,15 +62,42 @@
<div id="menu">
<h2 id="menu-title">Guacamole ${project.version}</h2>
<div class="content">
<h3>Input method</h3>
<div class="content" id="keyboard-settings">
<!-- No IME -->
<div class="choice">
<input name="input-method" type="radio" value="ime-none" checked="checked" id="ime-none"/> None
<p class="caption"><label for="ime-none">No input method is used. Keyboard input is accepted from
a connected, physical keyboard.</label></p>
</div>
<!-- Text input -->
<div class="choice">
<input name="input-method" type="radio" value="ime-text" id="ime-text"/> Text input
<p class="caption"><label for="ime-text">Allow typing of text, and emulate keyboard events based on the
typed text. This is necessary for devices such as mobile phones that lack a physical keyboard.</label></p>
</div>
<!-- Guac OSK -->
<div class="choice">
<input name="input-method" type="radio" value="ime-osk" id="ime-osk"/> On-screen keyboard
<p class="caption"><label for="ime-osk">Display and accept input from the built-in Guacamole on-screen
keyboard. The on-screen keyboard allows typing of key combinations that may otherwise be impossible
(such as Ctrl-Alt-Del).</label></p>
</div>
</div>
<h3>Clipboard</h3>
<div id="clipboardDiv">
<p>Text copied/cut within Guacamole will appear here. Changes to the text below will affect the remote clipboard.</p>
<div class="content" id="clipboard-settings">
<p class="description">Text copied/cut within Guacamole will appear here. Changes to the text below will affect the remote clipboard.</p>
<textarea rows="10" cols="40" id="clipboard"></textarea>
</div>
<h3>Mouse emulation mode</h3>
<div id="mouse-settings">
<p>Determines how the remote mouse behaves with respect to touches.</p>
<div class="content" id="mouse-settings">
<p class="description">Determines how the remote mouse behaves with respect to touches.</p>
<!-- Touchscreen -->
<div class="choice">
@@ -86,7 +118,6 @@
</div>
</div>
</div>
</div>
@@ -115,7 +146,7 @@
// Start connect after control returns from onload (allow browser
// to consider the page loaded).
window.onload = function() {
window.setTimeout(GuacUI.Client.connect, 0);
window.setTimeout(GuacUI.Client.connect, 10);
};
/* ]]> */ </script>

1
guacamole/src/main/webapp/scripts/client-ui.js
View File

@@ -223,6 +223,7 @@ GuacUI.Client = {
"menu" : document.getElementById("menu"),
"menu_title" : document.getElementById("menu-title"),
"display" : document.getElementById("display"),
"target" : document.getElementById("target"),
"clipboard" : document.getElementById("clipboard"),
"relative_radio" : document.getElementById("relative"),
"absolute_radio" : document.getElementById("absolute"),

40
guacamole/src/main/webapp/styles/client.css
View File

@@ -549,6 +549,10 @@ p.hint {
padding: 1em;
}
#menu .content > * {
margin: 1em 0;
}
#menu, #menu.closed {
left: -480px;
opacity: 0;
@@ -577,12 +581,7 @@ p.hint {
-webkit-animation-duration: 0.05s;
}
div#mouse-settings,
div#clipboardDiv {
padding: 0;
}
#clipboardDiv textarea {
#clipboard-settings textarea {
width: 100%;
border: 1px solid #AAA;
-moz-border-radius: 0.25em;
@@ -590,6 +589,7 @@ div#clipboardDiv {
-khtml-border-radius: 0.25em;
border-radius: 0.25em;
white-space: pre;
display: block;
}
#mouse-settings .choice {
@@ -602,6 +602,12 @@ div#clipboardDiv {
max-width: 80%;
}
#keyboard-settings .caption {
font-size: 0.9em;
margin-left: 2em;
margin-right: 2em;
}
#mouse-settings .figure .caption {
text-align: center;
font-size: 0.9em;
@@ -612,3 +618,25 @@ div#clipboardDiv {
max-width: 100%;
margin: 1em auto;
}
#menu h3 {
background: rgba(0, 0, 0, 0.4);
padding: 0.25em 0.5em;
margin: 0;
font-size: 1em;
color: white;
font-weight: bold;
}
#target {
position: fixed;
left: 0;
top: 0;
right: 0;
bottom: 0;
opacity: 0;
}