apitech
/
jitsi-meet
mirror of https://github.com/jitsi/jitsi-meet
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

An initial version of a "keyboard shortcuts" help panel.

Browse Source
pull/703/head
Boris Grozev 9 years ago committed by yanas
parent 334f7bf95a
commit d79971a737
6 changed files with 153 additions and 3 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 2
      Makefile
  2. 54
      css/keyboard-shortcuts.css
  3. 67
      index.html
  4. 13
      lang/main.json
  5. 7
      modules/UI/UI.js
  6. 11
      modules/keyboardshortcut/keyboardshortcut.js

2
Makefile
Unescape View File

@ -3,7 +3,7 @@ BROWSERIFY = ./node_modules/.bin/browserify
UGLIFYJS = ./node_modules/.bin/uglifyjs
EXORCIST = ./node_modules/.bin/exorcist
CLEANCSS = ./node_modules/.bin/cleancss
CSS_FILES = font.css toastr.css main.css overlay.css videolayout_default.css font-awesome.css jquery-impromptu.css modaldialog.css notice.css popup_menu.css login_menu.css popover.css jitsi_popover.css contact_list.css chat.css welcome_page.css settingsmenu.css feedback.css jquery.contextMenu.css
CSS_FILES = font.css toastr.css main.css overlay.css videolayout_default.css font-awesome.css jquery-impromptu.css modaldialog.css notice.css popup_menu.css login_menu.css popover.css jitsi_popover.css contact_list.css chat.css welcome_page.css settingsmenu.css feedback.css jquery.contextMenu.css keyboard-shortcuts.css
DEPLOY_DIR = libs
BROWSERIFY_FLAGS = -d
OUTPUT_DIR = .

54
css/keyboard-shortcuts.css
Unescape View File

@ -0,0 +1,54 @@
#keyboard-shortcuts {
display: none;
position: absolute;
bottom: 20px;
left: 20px;
overflow: hidden;
z-index: 1;
opacity: .85;
border-top-left-radius: 15px;
border-top-right-radius: 15px;
border-bottom-right-radius: 15px;
border-bottom-left-radius: 15px;
background-color: rgb(0, 0, 0);
background-image: none;
background-repeat: repeat;
background-attachment: scroll;
background-position: 0px center;
background-clip: border-box;
background-origin: padding-box;
background-size: auto auto;
}
#keyboard-shortcuts.header {
font-size: 15pt;
}
#keyboard-shortcuts.content {
font-size: 10pt;
color: #ffffff;
}
#keyboard-shortcuts.item {
color: #ffffff;
font-size: 10pt;
}
#keyboard-shortcuts.item-details {
color: #ffffff;
font-size: 10pt;
}
#keyboard-shortcuts.item-action {
color: #ffffff;
font-size: 10pt;
}
#keyboard-shortcuts.item-description {
color: #ffffff;
font-size: 10pt;
}
#keyboard-shortcuts.regular-key {
color: #ffffff;
font-size: 10pt;
}

67
index.html
Unescape View File

@ -279,5 +279,72 @@
<a id="feedbackButton" data-container="body" data-toggle="popover" data-placement="right" data-i18n="[data-content]feedback"><i class="fa fa-heart"></i></a>
</div>
</div>
<div id="keyboard-shortcuts" class="keyboard-shortcuts" style="display:none;">
<div class="header"><h3 data-i18n="keyboardShortcuts.keyboardShortcuts"></h3></div>
<div class="content">
<ul class="item">
<li class="item-details">
<span class="item-action">
<kbd class="regular-key">M</kbd>
</span>
<strong class="item-description" data-i18n="keyboardShortcuts.mute"></strong>
</li>
<li class="item-details">
<span class="item-action">
<kbd class="regular-key">V</kbd>
</span>
<strong class="item-description" data-i18n="keyboardShortcuts.videoMute"></strong>
</li>
<li class="item-details">
<span class="item-action">
<kbd class="regular-key">C</kbd>
</span>
<strong class="item-description" data-i18n="keyboardShortcuts.toggleChat"></strong>
</li>
<li class="item-details">
<span class="item-action">
<kbd class="regular-key">R</kbd>
</span>
<strong class="item-description" data-i18n="keyboardShortcuts.raiseHand"></strong>
</li>
<li class="item-details">
<span class="item-action">
<kbd class="regular-key">T</kbd>
</span>
<strong class="item-description" data-i18n="keyboardShortcuts.pushToTalk"></strong>
</li>
<li class="item-details">
<span class="item-action">
<kbd class="regular-key">D</kbd>
</span>
<strong class="item-description" data-i18n="keyboardShortcuts.toggleScreensharing"></strong>
</li>
<li class="item-details">
<span class="item-action">
<kbd class="regular-key">F</kbd>
</span>
<strong class="item-description" data-i18n="keyboardShortcuts.toggleFilmstrip"></strong>
</li>
<li class="item-details">
<span class="item-action">
<kbd class="regular-key">?</kbd>
</span>
<strong class="item-description" data-i18n="keyboardShortcuts.toggleShortcuts"></strong>
</li>
<li class="item-details">
<span class="item-action">
<kbd class="regular-key">0</kbd>
</span>
<strong class="item-description" data-i18n="keyboardShortcuts.focusLocal"></strong>
</li>
<li class="item-details">
<span class="item-action">
<kbd class="regular-key">1-9</kbd>
</span>
<strong class="item-description" data-i18n="keyboardShortcuts.focusRemote"></strong>
</li>
</ul>
</div>
</div>
</body>
</html>

13
lang/main.json
Unescape View File

@ -11,6 +11,19 @@
"defaultNickname": "ex. Jane Pink",
"defaultLink": "e.g. __url__",
"calling": "Calling __name__ ...",
"keyboardShortcuts": {
"keyboardShortcuts": "Keyboard shortcuts:",
"raiseHand": "Raise your hand.",
"pushToTalk": "Push to talk.",
"toggleScreensharing": "Switch between camera and screensharing.",
"toggleFilmstrip": "Show or hide the filmstrip.",
"toggleShortcuts": "Show or hide this help menu.",
"focusLocal": "Focus on the local video.",
"focusRemote": "Focus on one of the remote videos.",
"toggleChat": "Open or close the chat panel.",
"mute": "Mute or unmute the microphone.",
"videoMute": "Stop or start the local video."
},
"welcomepage":{
"go": "GO",
"roomname": "Enter room name",

7
modules/UI/UI.js
Unescape View File

@ -1385,4 +1385,11 @@ UI.hideRingOverLay = function () {
FilmStrip.toggleFilmStrip(true);
};
/**
* Shows or hides the keyboard shortcuts panel.'
*/
UI.toggleKeyboardShortcutsPanel = function() {
$('#keyboard-shortcuts').toggle();
};
module.exports = UI;

11
modules/keyboardshortcut/keyboardshortcut.js
Unescape View File

@ -3,6 +3,15 @@
var shortcuts = {};
function initShortcutHandlers() {
shortcuts = {
191: {
character: "/",
function: function(e) {
// Only trigger on "?", not on "/".
if (e.shiftKey) {
APP.UI.toggleKeyboardShortcutsPanel();
}
}
},
67: {
character: "C",
id: "toggleChatPopover",
@ -56,7 +65,7 @@ var KeyboardShortcut = {
$(":focus").is("input[type=password]") ||
$(":focus").is("textarea"))) {
if (typeof shortcuts[keycode] === "object") {
shortcuts[keycode].function();
shortcuts[keycode].function(e);
}
else if (keycode >= "0".charCodeAt(0) &&
keycode <= "9".charCodeAt(0)) {

Write Preview
Loading…
Cancel
Save