+
@@ -55,6 +55,36 @@
+
+
+
@@ -87,7 +117,7 @@
-
![]()
{
+ combo = e.pressedKeys
+ let comboStr = combo.join(' + ')
+ this.pttKeyDisplay('> ' + comboStr + ' <')
+ }
+ const keyup = () => {
+ keyboardjs.unbind('', keydown, keyup)
+ let comboStr = combo.join(' + ')
+ if (comboStr) {
+ this.pttKey(comboStr).pttKeyDisplay(comboStr)
+ } else {
+ this.pttKeyDisplay(this.pttKey())
+ }
+ }
+ keyboardjs.bind('', keydown, keyup)
+ this.pttKeyDisplay('> ? <')
}
}
@@ -67,6 +90,13 @@ class Settings {
constructor () {
const load = key => window.localStorage.getItem('mumble.' + key)
this.voiceMode = load('voiceMode') || 'cont'
+ this.pttKey = load('pttKey') || 'ctrl + shift'
+ }
+
+ save () {
+ const save = (key, val) => window.localStorage.setItem('mumble.' + key, val)
+ save('voiceMode', this.voiceMode)
+ save('pttKey', this.pttKey)
}
}
@@ -77,7 +107,7 @@ class GlobalBindings {
this.connectDialog = new ConnectDialog()
this.connectionInfo = new ConnectionInfo()
this.commentDialog = new CommentDialog()
- this.settingsDialog = new SettingsDialog()
+ this.settingsDialog = ko.observable()
this.log = ko.observableArray()
this.thisUser = ko.observable()
this.root = ko.observable()
@@ -88,6 +118,25 @@ class GlobalBindings {
this.selected(element)
}
+ this.openSettings = () => {
+ this.settingsDialog(new SettingsDialog(this.settings))
+ }
+
+ this.applySettings = () => {
+ const settingsDialog = this.settingsDialog()
+
+ settingsDialog.applyTo(this.settings)
+
+ this._updateVoiceHandler()
+
+ this.settings.save()
+ this.settingsDialog(null)
+ }
+
+ this.closeSettings = () => {
+ this.settingsDialog(null)
+ }
+
this.getTimeString = () => {
return '[' + new Date().toLocaleTimeString('en-US') + ']'
}
@@ -309,7 +358,7 @@ class GlobalBindings {
if (mode === 'cont') {
voiceHandler = new ContinuousVoiceHandler(this.client)
} else if (mode === 'ptt') {
- voiceHandler = new PushToTalkVoiceHandler(this.client, 'ctrl + shift')
+ voiceHandler = new PushToTalkVoiceHandler(this.client, this.settings.pttKey)
} else if (mode === 'vad') {
} else {
diff --git a/themes/MetroMumbleLight/main.css b/themes/MetroMumbleLight/main.css
index 2845e03..bcff5f4 100644
--- a/themes/MetroMumbleLight/main.css
+++ b/themes/MetroMumbleLight/main.css
@@ -195,7 +195,7 @@ form {
.message-content p {
margin: 0;
}
-.tb-information, .tb-record, .tb-comment, .tb-settings{
+.tb-information, .tb-record, .tb-comment {
filter: grayscale(100%);
}
.dialog-header {
@@ -230,17 +230,38 @@ form {
text-align: center;
width: 100%
}
-.connect-dialog {
+.dialog {
position: absolute;
- width: 300px;
- height: 227px;
- top: calc(50% - 100px);
- left: calc(50% - 150px);
background-color: #eee;
border: 1px gray solid;
box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.25);
z-index: 20;
}
+.settings-dialog {
+ width: 300px;
+ height: 156px;
+ top: calc(50% - 100px);
+ left: calc(50% - 150px);
+}
+.settings-dialog table {
+ width: 100%;
+ padding: 5px;
+}
+.settings-dialog td {
+ width: 50%;
+}
+.settings-dialog table select {
+ width: 100%;
+}
+.settings-dialog table input {
+ width: 100%;
+}
+.connect-dialog {
+ width: 300px;
+ height: 227px;
+ top: calc(50% - 100px);
+ left: calc(50% - 150px);
+}
.connect-dialog input[type=text] {
font-size: 15px;
border: 1px gray solid;