Skip to content

Commit

Permalink
Updates to HTML client
Browse files Browse the repository at this point in the history
  • Loading branch information
mjharkin committed Apr 16, 2019
1 parent a2f6de8 commit 7d5a4f0
Show file tree
Hide file tree
Showing 16 changed files with 1,077 additions and 38 deletions.
37 changes: 31 additions & 6 deletions trunk/src/html5/connect.html
Original file line number Diff line number Diff line change
Expand Up @@ -236,7 +236,7 @@ <h4 class="panel-title">Advanced options</h4>
<input type="checkbox" id="swap_keys"> <span>Swap command and control key</span>
</li>
<li class="list-group-item">
<input type="checkbox" id="top_bar"> <span>Show top bar</span>, <input type="checkbox" id="clock"> <span>show server clock</span>
<input type="checkbox" id="floating_menu"> <span>Floating Menu</span>, <input type="checkbox" id="top_bar"> <span>Top Bar</span>, <input type="checkbox" id="clock"> <span>Server clock</span>
</li>
<li class="list-group-item">
<input type="checkbox" id="video"> <span>Video <input type="checkbox" id="mediasource_video"> Native decoding</span>
Expand Down Expand Up @@ -323,7 +323,7 @@ <h4 class="panel-title">Advanced options</h4>
"exit_with_children", "exit_with_client",
"sharing", "steal", "reconnect", "swap_keys",
"video", "mediasource_video",
"ssl", "insecure", "top_bar", "clock",
"ssl", "insecure", "top_bar", "floating_menu", "clock",
"debug_main", "debug_keyboard", "debug_geometry", "debug_mouse", "debug_clipboard", "debug_draw", "debug_audio", "debug_network",
];
for (var i = 0; i < bool_props.length; i++) {
Expand All @@ -333,6 +333,12 @@ <h4 class="panel-title">Advanced options</h4>
window.location = url;
}

$(document).keyup(function (e) {
if ($("password:focus") && (e.keyCode === 13)) {
doConnect();
}
});

$(document).ready(function() {
var getparam = Utilities.getparam;
var getboolparam = Utilities.getboolparam;
Expand Down Expand Up @@ -538,9 +544,9 @@ <h4 class="panel-title">Advanced options</h4>
var bool_props = ["clipboard", "printing", "file_transfer",
"exit_with_children", "exit_with_client",
"sharing", "steal", "reconnect", "swap_keys",
"video", "mediasource_video", "top_bar", "clock",
"video", "mediasource_video", "top_bar", "floating_menu", "clock",
"debug_main", "debug_keyboard", "debug_geometry", "debug_mouse", "debug_clipboard", "debug_draw", "debug_audio", "debug_network"];
var default_on = ["steal", "clipboard", "printing", "file_transfer", "reconnect", "top_bar", "clock", "exit_with_children", "exit_with_client", "video"];
var default_on = ["steal", "clipboard", "printing", "file_transfer", "reconnect", "floating_menu", "clock", "exit_with_children", "exit_with_client", "video"];
if (Utilities.isMacOS()) {
default_on.push("swap_keys");
}
Expand All @@ -557,15 +563,34 @@ <h4 class="panel-title">Advanced options</h4>
toggle_mediasource_video();

var top_bar_checkbox = $("#top_bar");
var floating_menu_checkbox = $("#floating_menu");
function set_clock_visibility() {
if (top_bar_checkbox.is(':checked')) {
if (top_bar_checkbox.is(':checked') || floating_menu_checkbox.is(':checked')) {
$("#clock").removeAttr("disabled");
}
else {
$("#clock").attr("disabled", true);
}
}
top_bar_checkbox.change(set_clock_visibility);

function top_bar_change() {
set_clock_visibility()
if (top_bar_checkbox.is(':checked')) {
floating_menu_checkbox.prop('checked', false);;
}

}

function floating_menu_change() {
set_clock_visibility()
if (floating_menu_checkbox.is(':checked')) {
top_bar_checkbox.prop('checked', false);;
}

}

top_bar_checkbox.change(top_bar_change);
floating_menu_checkbox.change(floating_menu_change);
set_clock_visibility();

$("#expandopts").click(function() {
Expand Down
9 changes: 4 additions & 5 deletions trunk/src/html5/css/client.css
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@ html, body {
padding: 0;
margin: 0;
overflow: hidden;
background-color: #021d3a;
}

div.window canvas {
Expand Down Expand Up @@ -71,7 +72,6 @@ canvas {
.window {
border: 1px;
position: absolute;
box-shadow: 0px 10px 25px rgba(0, 0, 0, 0.5);
padding: 0;
overflow: hidden; /* required for radius clip */
}
Expand All @@ -82,17 +82,15 @@ canvas {
float: left;
}
.window.desktop {
border-radius: 0;
box-shadow: none;
}

.window-NORMAL {
border-radius: 6px;
}
.windowhead {
height: 30px;
color: #000000;
background-color: #c0c0c0;
background-color: #ffffff;
}
.windowicon {
display: inline-block;
Expand Down Expand Up @@ -126,7 +124,7 @@ canvas {
padding-right: 5px;
cursor: pointer;
padding-top: 7px;
background-color: #c0c0c0;
background-color: transparent;
}
.above {
z-index: 10000;
Expand Down Expand Up @@ -177,6 +175,7 @@ div.windowinfocus {
width: 600px;
height: auto;
z-index: 10001;
background-color: white;
transition: height 0.5s, opacity 0.5s, top 0.5s, box-shadow 0.5s, bottom 0.5s;
box-shadow: 0 1rem 2rem rgba(21, 36, 48, 0.75);
overflow: hidden;
Expand Down
25 changes: 25 additions & 0 deletions trunk/src/html5/css/icon.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,25 @@
@font-face {
font-family: "materialicons";
src: url(../icons/materialicons-regular.woff) format("woff");
}

.Icon, *[data-icon]:before {
display: inline-block;
position: relative;
width: 40px;
height: 40px;
line-height: 40px;

font-family: "materialicons";
font-size: 24px;
text-align: center;

content: attr(data-icon);

/* This is important for IE, which has it off by default */
font-feature-settings: "liga" 1;
}

.Icon.-small {
font-size: 18px;
}
129 changes: 129 additions & 0 deletions trunk/src/html5/css/menu-skin.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,129 @@
/*
MIT License
Copyright (c) 2019 Mark Harkin, 2016 Dylan Hicks (aka. dylanh333)
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
*/

#float_menu {
display: inline-block;
height: 30px;
padding: 0px 0px 0px 10px;
z-index: 100000;
background: repeating-linear-gradient(
90deg,
white,
white 1px,
black 1px,
black 2px
);

border-color: grey;
border-width: 1px;
border-style: solid;
box-shadow: 0px 10px 25px rgba(0, 0, 0, 0.5);
}

.menu-divleft {
float:left;
clear:left;
}

.menu-divright {
float:right;
clear:right;
}

.menu-content-left {
white-space: nowrap;
float: left;
width: 24px;
height: 24px;
padding: 3px 2px;
vertical-align:middle;
text-decoration: none;
display: inline;
}

.menu-content-right {
white-space: nowrap;
float: right;
width: 16px;
height: 16px;
padding: 7px 2px;
vertical-align:middle;
text-decoration: none;
display: inline;
}

.windowlist-li {
min-width: 400px;
}

.Menu {
color: black;
}
/* Foreground */
.Menu,
.Menu li.-hasSubmenu > a:after {
color: black;
border-color: black; /* chevron colour */
}

/* Background */
.Menu,
.Menu li ul {
background: white;
}

/* Border */
.Menu,
.Menu li ul {
box-shadow: none;
}

.Menu li ul,
.Menu.-floating {
border-radius: 3px;
}
.Menu.-horizontal > li > ul {
border-top-left-radius: 0px;
border-top-right-radius: 0px;
}
.Menu:not(.-alignRight) li > ul,
.Menu.-floating:not(.-alignRight) {
border-top-left-radius: 0px;
}
.Menu.-alignRight li > ul,
.Menu.-floating.-alignRight {
border-top-right-radius: 0px;
}

/* Drop shadow on Menus and header */
.Menu li ul,
.Menu.-floating {
box-shadow:
0px 0px 0px 1px rgba(0,0,0,0.2),
0px 3px 1px 0px rgba(0,0,0,0.2),
0px 6px 12px 0px rgba(0,0,0,0.15)
;
}

Loading

0 comments on commit 7d5a4f0

Please sign in to comment.