proper visual bell (fixes #131)

terminus-terminal/src/components/terminalTab.component.ts

@@ -32,6 +32,7 @@ export class TerminalTabComponent extends BaseTabComponent {
     alternateScreenActive$ = new BehaviorSubject(false)
     mouseEvent$ = new Subject<Event>()
     htermVisible = false
+    private bellPlayer: HTMLAudioElement
     private io: any
 
     constructor (
@@ -84,6 +85,8 @@ export class TerminalTabComponent extends BaseTabComponent {
                 this.resetZoom()
             }
         })
+        this.bellPlayer = document.createElement('audio')
+        this.bellPlayer.src = require<string>('../bell.ogg')
     }
 
     getRecoveryToken (): any {
@@ -126,13 +129,15 @@ export class TerminalTabComponent extends BaseTabComponent {
         }, 1000)
 
         this.bell$.subscribe(() => {
-            if (this.config.store.terminal.bell !== 'off') {
-                let bg = preferenceManager.get('background-color')
+            if (this.config.store.terminal.bell === 'visual') {
                 preferenceManager.set('background-color', 'rgba(128,128,128,.25)')
                 setTimeout(() => {
-                    preferenceManager.set('background-color', bg)
+                    this.configure()
                 }, 125)
             }
+            if (this.config.store.terminal.bell === 'audible') {
+                this.bellPlayer.play()
+            }
             // TODO audible
         })
     }
@@ -246,7 +251,7 @@ export class TerminalTabComponent extends BaseTabComponent {
         preferenceManager.set('font-family', `"${config.terminal.font}", "monospace-fallback", monospace`)
         this.setFontSize()
         preferenceManager.set('enable-bold', true)
-        preferenceManager.set('audible-bell-sound', '')
+        // preferenceManager.set('audible-bell-sound', '')
         preferenceManager.set('desktop-notification-bell', config.terminal.bell === 'notification')
         preferenceManager.set('enable-clipboard-notice', false)
         preferenceManager.set('receive-encoding', 'raw')

terminus-terminal/src/persistenceProviders.ts

@@ -87,7 +87,7 @@ export class ScreenPersistenceProvider extends SessionPersistenceProvider {
         let configPath = '/tmp/.termScreenConfig'
         await fs.writeFile(configPath, `
             escape ^^^
-            vbell on
+            vbell off
             deflogin on
             defflow off
             term xterm-color

terminus-terminal/webpack.config.js

@@ -35,7 +35,7 @@ module.exports = {
       { test: /\.scss$/, use: ['to-string-loader', 'css-loader', 'sass-loader'] },
       { test: /\.css$/, use: ['to-string-loader', 'css-loader'] },
       {
-        test: /\.(ttf|eot|otf|woff|woff2)(\?v=[0-9]\.[0-9]\.[0-9])?$/,
+        test: /\.(ttf|eot|otf|woff|woff2|ogg)(\?v=[0-9]\.[0-9]\.[0-9])?$/,
         loader: "url-loader",
         options: {
           limit: 999999999999,