diff --git a/guacamole/src/main/webapp/client.xhtml b/guacamole/src/main/webapp/client.xhtml index b9241354b..f0eb0bfc0 100644 --- a/guacamole/src/main/webapp/client.xhtml +++ b/guacamole/src/main/webapp/client.xhtml @@ -62,6 +62,12 @@ diff --git a/guacamole/src/main/webapp/images/settings/zoom-in.png b/guacamole/src/main/webapp/images/settings/zoom-in.png new file mode 100644 index 000000000..ef36301b4 Binary files /dev/null and b/guacamole/src/main/webapp/images/settings/zoom-in.png differ diff --git a/guacamole/src/main/webapp/images/settings/zoom-out.png b/guacamole/src/main/webapp/images/settings/zoom-out.png new file mode 100644 index 000000000..358632cf8 Binary files /dev/null and b/guacamole/src/main/webapp/images/settings/zoom-out.png differ diff --git a/guacamole/src/main/webapp/scripts/client-ui.js b/guacamole/src/main/webapp/scripts/client-ui.js index 0989275f3..1eefc2a31 100644 --- a/guacamole/src/main/webapp/scripts/client-ui.js +++ b/guacamole/src/main/webapp/scripts/client-ui.js @@ -217,6 +217,10 @@ GuacUI.Client = { "ime_none_radio" : document.getElementById("ime-none"), "ime_text_radio" : document.getElementById("ime-text"), "ime_osk_radio" : document.getElementById("ime-osk"), + "zoom_state" : document.getElementById("zoom-state"), + "zoom_out" : document.getElementById("zoom-out"), + "zoom_in" : document.getElementById("zoom-in"), + "auto_fit" : document.getElementById("auto-fit"), /* Expected Input Rectangle */ diff --git a/guacamole/src/main/webapp/styles/client.css b/guacamole/src/main/webapp/styles/client.css index dec924d57..b39cdb790 100644 --- a/guacamole/src/main/webapp/styles/client.css +++ b/guacamole/src/main/webapp/styles/client.css @@ -643,6 +643,42 @@ p.hint { max-width: 100%; } +#zoom-settings { + text-align: center; +} + +#zoom-out, #zoom-in, #zoom-state { + display: inline-block; + vertical-align: middle; +} + +#zoom-out, #zoom-in { + max-width: 3em; + border: 1px solid rgba(0, 0, 0, 0.5); + background: rgba(0, 0, 0, 0.1); + border-radius: 2em; + margin: 0.5em; + cursor: pointer; +} + +#zoom-out img, #zoom-in img { + max-width: 100%; + opacity: 0.5; +} + +#zoom-out:hover, #zoom-in:hover { + border: 1px solid rgba(0, 0, 0, 1); + background: #CDA; +} + +#zoom-out:hover img, #zoom-in:hover img { + opacity: 1; +} + +#zoom-state { + font-size: 2em; +} + #target { position: fixed; left: 0;