Added the extra keys Ctrl, Alt, Tab and Esc to the control bar.
This commit is contained in:
parent
41c66fbfcd
commit
53c01a2353
|
@ -62,6 +62,14 @@ html {
|
|||
display: none;
|
||||
}
|
||||
|
||||
#noVNC_extra_keys {
|
||||
display: inline;
|
||||
list-style-type: none;
|
||||
padding: 0px;
|
||||
margin: 0px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.noVNC-buttons-left {
|
||||
float: left;
|
||||
z-index: 1;
|
||||
|
@ -404,6 +412,31 @@ html {
|
|||
width: 100%;
|
||||
}
|
||||
|
||||
#noVNC_extra_keys {
|
||||
float: none;
|
||||
top: 0px;
|
||||
}
|
||||
|
||||
#noVNC_extra_keys li {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
#showExtraKeysButton {
|
||||
display: none;
|
||||
}
|
||||
#toggleCtrlButton {
|
||||
display: inline;
|
||||
}
|
||||
#toggleAltButton {
|
||||
display: inline;
|
||||
}
|
||||
#sendTabButton {
|
||||
display: inline;
|
||||
}
|
||||
#sendEscButton {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 640px){
|
||||
.noVNC_status_button {
|
||||
font-size: 10px;
|
||||
|
@ -420,6 +453,28 @@ html {
|
|||
width: auto;
|
||||
float: left;
|
||||
}
|
||||
#noVNC_extra_keys {
|
||||
float: right;
|
||||
top: -35px;
|
||||
}
|
||||
#noVNC_extra_keys li {
|
||||
display: block;
|
||||
}
|
||||
#showExtraKeysButton {
|
||||
display: inline;
|
||||
}
|
||||
#toggleCtrlButton {
|
||||
display: none;
|
||||
}
|
||||
#toggleAltButton {
|
||||
display: none;
|
||||
}
|
||||
#sendTabButton {
|
||||
display: none;
|
||||
}
|
||||
#sendEscButton {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 481px) and (max-width: 640px) {
|
||||
|
|
|
@ -24,6 +24,10 @@ connSettingsOpen : false,
|
|||
popupStatusOpen : false,
|
||||
clipboardOpen: false,
|
||||
keyboardVisible: false,
|
||||
hideKeyboardTimeout: null,
|
||||
extraKeysVisible: false,
|
||||
ctrlOn: false,
|
||||
altOn: false,
|
||||
|
||||
// Setup rfb object, load settings from browser storage, then call
|
||||
// UI.init to setup the UI/menus
|
||||
|
@ -158,6 +162,12 @@ addMouseHandlers: function() {
|
|||
//$D("keyboardinput").onkeydown = function (event) { onKeyDown(event); };
|
||||
$D("keyboardinput").onblur = UI.keyInputBlur;
|
||||
|
||||
$D("showExtraKeysButton").onclick = UI.showExtraKeys;
|
||||
$D("toggleCtrlButton").onclick = UI.toggleCtrl;
|
||||
$D("toggleAltButton").onclick = UI.toggleAlt;
|
||||
$D("sendTabButton").onclick = UI.sendTab;
|
||||
$D("sendEscButton").onclick = UI.sendEsc;
|
||||
|
||||
$D("sendCtrlAltDelButton").onclick = UI.sendCtrlAltDel;
|
||||
$D("noVNC_status").onclick = UI.togglePopupStatusPanel;
|
||||
$D("noVNC_popup_status_panel").onclick = UI.togglePopupStatusPanel;
|
||||
|
@ -532,13 +542,16 @@ updateVisualState: function() {
|
|||
UI.setMouseButton(1);
|
||||
$D('clipboardButton').style.display = "inline";
|
||||
$D('showKeyboard').style.display = "inline";
|
||||
$D('noVNC_extra_keys').style.display = "";
|
||||
$D('sendCtrlAltDelButton').style.display = "inline";
|
||||
} else {
|
||||
UI.setMouseButton();
|
||||
$D('clipboardButton').style.display = "none";
|
||||
$D('showKeyboard').style.display = "none";
|
||||
$D('noVNC_extra_keys').style.display = "none";
|
||||
$D('sendCtrlAltDelButton').style.display = "none";
|
||||
}
|
||||
|
||||
// State change disables viewport dragging.
|
||||
// It is enabled (toggled) by direct click on the button
|
||||
UI.setViewDrag(false);
|
||||
|
@ -712,12 +725,78 @@ showKeyboard: function() {
|
|||
}
|
||||
},
|
||||
|
||||
keepKeyboard: function() {
|
||||
clearTimeout(UI.hideKeyboardTimeout);
|
||||
if(UI.keyboardVisible === true) {
|
||||
$D('keyboardinput').focus();
|
||||
$D('showKeyboard').className = "noVNC_status_button_selected";
|
||||
} else if(UI.keyboardVisible === false) {
|
||||
$D('keyboardinput').blur();
|
||||
$D('showKeyboard').className = "noVNC_status_button";
|
||||
}
|
||||
},
|
||||
|
||||
keyInputBlur: function() {
|
||||
$D('showKeyboard').className = "noVNC_status_button";
|
||||
//Weird bug in iOS if you change keyboardVisible
|
||||
//here it does not actually occur so next time
|
||||
//you click keyboard icon it doesnt work.
|
||||
setTimeout(function() { UI.setKeyboard(); },100);
|
||||
UI.hideKeyboardTimeout = setTimeout(function() { UI.setKeyboard(); },100);
|
||||
},
|
||||
|
||||
showExtraKeys: function() {
|
||||
UI.keepKeyboard();
|
||||
if(UI.extraKeysVisible === false) {
|
||||
$D('toggleCtrlButton').style.display = "inline";
|
||||
$D('toggleAltButton').style.display = "inline";
|
||||
$D('sendTabButton').style.display = "inline";
|
||||
$D('sendEscButton').style.display = "inline";
|
||||
$D('showExtraKeysButton').className = "noVNC_status_button_selected";
|
||||
UI.extraKeysVisible = true;
|
||||
} else if(UI.extraKeysVisible === true) {
|
||||
$D('toggleCtrlButton').style.display = "";
|
||||
$D('toggleAltButton').style.display = "";
|
||||
$D('sendTabButton').style.display = "";
|
||||
$D('sendEscButton').style.display = "";
|
||||
$D('showExtraKeysButton').className = "noVNC_status_button";
|
||||
UI.extraKeysVisible = false;
|
||||
}
|
||||
},
|
||||
|
||||
toggleCtrl: function() {
|
||||
UI.keepKeyboard();
|
||||
if(UI.ctrlOn === false) {
|
||||
UI.rfb.sendKey(0xFFE3, true);
|
||||
$D('toggleCtrlButton').className = "noVNC_status_button_selected";
|
||||
UI.ctrlOn = true;
|
||||
} else if(UI.ctrlOn === true) {
|
||||
UI.rfb.sendKey(0xFFE3, false);
|
||||
$D('toggleCtrlButton').className = "noVNC_status_button";
|
||||
UI.ctrlOn = false;
|
||||
}
|
||||
},
|
||||
|
||||
toggleAlt: function() {
|
||||
UI.keepKeyboard();
|
||||
if(UI.altOn === false) {
|
||||
UI.rfb.sendKey(0xFFE9, true);
|
||||
$D('toggleAltButton').className = "noVNC_status_button_selected";
|
||||
UI.altOn = true;
|
||||
} else if(UI.altOn === true) {
|
||||
UI.rfb.sendKey(0xFFE9, false);
|
||||
$D('toggleAltButton').className = "noVNC_status_button";
|
||||
UI.altOn = false;
|
||||
}
|
||||
},
|
||||
|
||||
sendTab: function() {
|
||||
UI.keepKeyboard();
|
||||
UI.rfb.sendKey(0xFF09);
|
||||
},
|
||||
|
||||
sendEsc: function() {
|
||||
UI.keepKeyboard();
|
||||
UI.rfb.sendKey(0xFF1B);
|
||||
},
|
||||
|
||||
setKeyboard: function() {
|
||||
|
|
17
vnc.html
17
vnc.html
|
@ -68,6 +68,23 @@
|
|||
value="Keyboard" title="Show Keyboard"/>
|
||||
<input type="email" autocapitalize="off" autocorrect="off"
|
||||
id="keyboardinput" class=""/>
|
||||
<ul id="noVNC_extra_keys">
|
||||
<li><input type="image" src="images/showextrakeys.png"
|
||||
id="showExtraKeysButton"
|
||||
class="noVNC_status_button"></li>
|
||||
<li><input type="image" src="images/ctrl.png"
|
||||
id="toggleCtrlButton"
|
||||
class="noVNC_status_button"></li>
|
||||
<li><input type="image" src="images/alt.png"
|
||||
id="toggleAltButton"
|
||||
class="noVNC_status_button"></li>
|
||||
<li><input type="image" src="images/tab.png"
|
||||
id="sendTabButton"
|
||||
class="noVNC_status_button"></li>
|
||||
<li><input type="image" src="images/esc.png"
|
||||
id="sendEscButton"
|
||||
class="noVNC_status_button"></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
Loading…
Reference in New Issue