Create our own button for CtrlAltDel in vnc_lite

In order to have better control of the layout and to make the code
easier to follow. Using input type button or buttons will imply a lot of
built in styling that differs from browser to browser.
This commit is contained in:
Samuel Mannehed 2018-08-21 11:24:08 +02:00
parent 5271e30049
commit 011e4bff34
1 changed files with 12 additions and 23 deletions

View File

@ -38,26 +38,21 @@
#noVNC_status_bar { #noVNC_status_bar {
background-color: #6e84a3; background-color: #6e84a3;
width: 100%; color: white;
display: flex; font: bold 12px Helvetica;
justify-content: space-between; padding: 6px 5px 4px 5px;
border-bottom: 1px outset; border-bottom: 1px outset;
} }
#noVNC_status { #noVNC_status {
color: #ffffff; text-align: center;
font: bold 12px Helvetica;
margin: auto;
} }
#sendCtrlAltDelButton {
#noVNC_left_dummy_elem { position: fixed;
flex: 1; top: 0px;
} right: 0px;
border: 1px outset;
#noVNC_buttons { padding: 5px 5px 4px 5px;
padding: 1px; cursor: pointer;
flex: 1;
display: flex;
justify-content: flex-end;
} }
</style> </style>
@ -89,13 +84,11 @@
// When this function is called we have // When this function is called we have
// successfully connected to a server // successfully connected to a server
function connectedToServer(e) { function connectedToServer(e) {
document.getElementById('sendCtrlAltDelButton').disabled = false;
status("Connected to " + desktopName); status("Connected to " + desktopName);
} }
// This function is called when we are disconnected // This function is called when we are disconnected
function disconnectedFromServer(e) { function disconnectedFromServer(e) {
document.getElementById('sendCtrlAltDelButton').disabled = true;
if (e.detail.clean) { if (e.detail.clean) {
status("Disconnected"); status("Disconnected");
} else { } else {
@ -196,12 +189,8 @@
<body> <body>
<div id="noVNC_status_bar"> <div id="noVNC_status_bar">
<div id="noVNC_left_dummy_elem"></div>
<div id="noVNC_status">Loading</div> <div id="noVNC_status">Loading</div>
<div id="noVNC_buttons"> <div id="sendCtrlAltDelButton">Send CtrlAltDel</div>
<input type=button value="Send CtrlAltDel"
id="sendCtrlAltDelButton">
</div>
</div> </div>
</body> </body>
</html> </html>