diff --git a/terminus-core/src/components/appRoot.component.ts b/terminus-core/src/components/appRoot.component.ts index 938b1d31..b839a1af 100644 --- a/terminus-core/src/components/appRoot.component.ts +++ b/terminus-core/src/components/appRoot.component.ts @@ -50,8 +50,8 @@ export class AppRootComponent { private docking: DockingService, private electron: ElectronService, private tabRecovery: TabRecoveryService, + private hotkeys: HotkeysService, public hostApp: HostAppService, - public hotkeys: HotkeysService, public config: ConfigService, public app: AppService, @Inject(ToolbarButtonProvider) private toolbarButtonProviders: ToolbarButtonProvider[], diff --git a/terminus-core/src/services/hotkeys.service.ts b/terminus-core/src/services/hotkeys.service.ts index efc598c6..cfd0ccc0 100644 --- a/terminus-core/src/services/hotkeys.service.ts +++ b/terminus-core/src/services/hotkeys.service.ts @@ -178,10 +178,6 @@ export class AppHotkeyProvider extends HotkeyProvider { id: 'toggle-window', name: 'Toggle terminal window', }, - { - id: 'new-tab', - name: 'New tab', - }, { id: 'close-tab', name: 'Close tab', diff --git a/terminus-terminal/src/components/terminalTab.component.ts b/terminus-terminal/src/components/terminalTab.component.ts index 062a3e2d..f78c8e23 100644 --- a/terminus-terminal/src/components/terminalTab.component.ts +++ b/terminus-terminal/src/components/terminalTab.component.ts @@ -1,7 +1,7 @@ import { BehaviorSubject, Subject, Subscription } from 'rxjs' import 'rxjs/add/operator/bufferTime' import { Component, NgZone, Inject, Optional, ViewChild, HostBinding, Input } from '@angular/core' -import { AppService, ConfigService, BaseTabComponent, ThemesService, HostAppService, Platform } from 'terminus-core' +import { AppService, ConfigService, BaseTabComponent, ThemesService, HostAppService, HotkeysService, Platform } from 'terminus-core' import { Session, SessionsService } from '../services/sessions.service' @@ -16,11 +16,13 @@ import { hterm, preferenceManager } from '../hterm' export class TerminalTabComponent extends BaseTabComponent { session: Session @Input() sessionOptions: SessionOptions + @Input() zoom = 0 @ViewChild('content') content @HostBinding('style.background-color') backgroundColor: string hterm: any configSubscription: Subscription sessionCloseSubscription: Subscription + hotkeysSubscription: Subscription bell$ = new Subject() size: ResizeEvent resize$ = new Subject() @@ -37,6 +39,7 @@ export class TerminalTabComponent extends BaseTabComponent { private app: AppService, private themes: ThemesService, private hostApp: HostAppService, + private hotkeys: HotkeysService, private sessions: SessionsService, public config: ConfigService, @Optional() @Inject(TerminalDecorator) private decorators: TerminalDecorator[], @@ -64,6 +67,17 @@ export class TerminalTabComponent extends BaseTabComponent { }) this.session.releaseInitialDataBuffer() }) + this.hotkeysSubscription = this.hotkeys.matchedHotkey.subscribe(hotkey => { + if (hotkey === 'zoom-in') { + this.zoomIn() + } + if (hotkey === 'zoom-out') { + this.zoomOut() + } + if (hotkey === 'reset-zoom') { + this.resetZoom() + } + }) } getRecoveryToken (): any { @@ -150,10 +164,18 @@ export class TerminalTabComponent extends BaseTabComponent { const _onMouse = hterm.onMouse_.bind(hterm) hterm.onMouse_ = (event) => { this.mouseEvent$.next(event) - if ((event.ctrlKey || event.metaKey) && event.type === 'mousewheel') { - event.preventDefault() - let delta = Math.round(event.wheelDeltaY / 50) - this.sendInput(((delta > 0) ? '\u001bOA' : '\u001bOB').repeat(Math.abs(delta))) + if (event.type === 'mousewheel') { + if (event.ctrlKey || event.metaKey) { + if (event.wheelDeltaY < 0) { + this.zoomIn() + } else { + this.zoomOut() + } + } else if (event.altKey) { + event.preventDefault() + let delta = Math.round(event.wheelDeltaY / 50) + this.sendInput(((delta > 0) ? '\u001bOA' : '\u001bOB').repeat(Math.abs(delta))) + } } _onMouse(event) } @@ -208,7 +230,7 @@ export class TerminalTabComponent extends BaseTabComponent { async configure (): Promise { let config = this.config.store preferenceManager.set('font-family', config.terminal.font) - preferenceManager.set('font-size', config.terminal.fontSize) + this.setFontSize() preferenceManager.set('enable-bold', true) preferenceManager.set('audible-bell-sound', '') preferenceManager.set('desktop-notification-bell', config.terminal.bell === 'notification') @@ -242,12 +264,28 @@ export class TerminalTabComponent extends BaseTabComponent { this.hterm.setBracketedPaste(config.terminal.bracketedPaste) } + zoomIn () { + this.zoom++ + this.setFontSize() + } + + zoomOut () { + this.zoom-- + this.setFontSize() + } + + resetZoom () { + this.zoom = 0 + this.setFontSize() + } + ngOnDestroy () { - this.decorators.forEach((decorator) => { + this.decorators.forEach(decorator => { decorator.detach(this) }) this.configSubscription.unsubscribe() this.sessionCloseSubscription.unsubscribe() + this.hotkeysSubscription.unsubscribe() this.resize$.complete() this.input$.complete() this.output$.complete() @@ -261,4 +299,8 @@ export class TerminalTabComponent extends BaseTabComponent { super.destroy() await this.session.destroy() } + + private setFontSize () { + preferenceManager.set('font-size', this.config.store.terminal.fontSize * Math.pow(1.1, this.zoom)) + } } diff --git a/terminus-terminal/src/config.ts b/terminus-terminal/src/config.ts index f657ca91..bb0aa316 100644 --- a/terminus-terminal/src/config.ts +++ b/terminus-terminal/src/config.ts @@ -43,6 +43,14 @@ export class TerminalConfigProvider extends ConfigProvider { shell: '~default-shell~', }, hotkeys: { + 'zoom-in': [ + '⌘-=', + '⌘-Shift-+', + ], + 'zoom-out': [ + '⌘--', + '⌘-Shift-_', + ], 'new-tab': [ ['Ctrl-A', 'C'], ['Ctrl-A', 'Ctrl-C'], @@ -57,6 +65,14 @@ export class TerminalConfigProvider extends ConfigProvider { shell: '~clink~', }, hotkeys: { + 'zoom-in': [ + 'Ctrl-=', + 'Ctrl-Shift-+', + ], + 'zoom-out': [ + 'Ctrl--', + 'Ctrl-Shift-_', + ], 'new-tab': [ ['Ctrl-A', 'C'], ['Ctrl-A', 'Ctrl-C'], @@ -70,6 +86,14 @@ export class TerminalConfigProvider extends ConfigProvider { shell: '~default-shell~', }, hotkeys: { + 'zoom-in': [ + 'Ctrl-=', + 'Ctrl-Shift-+', + ], + 'zoom-out': [ + 'Ctrl--', + 'Ctrl-Shift-_', + ], 'new-tab': [ ['Ctrl-A', 'C'], ['Ctrl-A', 'Ctrl-C'], diff --git a/terminus-terminal/src/hotkeys.ts b/terminus-terminal/src/hotkeys.ts new file mode 100644 index 00000000..0d30ffe5 --- /dev/null +++ b/terminus-terminal/src/hotkeys.ts @@ -0,0 +1,24 @@ +import { Injectable } from '@angular/core' +import { IHotkeyDescription, HotkeyProvider } from 'terminus-core' + +@Injectable() +export class TerminalHotkeyProvider extends HotkeyProvider { + hotkeys: IHotkeyDescription[] = [ + { + id: 'zoom-in', + name: 'Zoom in', + }, + { + id: 'zoom-out', + name: 'Zoom out', + }, + { + id: 'reset-zoom', + name: 'Reset zoom', + }, + { + id: 'new-tab', + name: 'New tab', + }, + ] +} diff --git a/terminus-terminal/src/index.ts b/terminus-terminal/src/index.ts index 65e70e73..6c0b5241 100644 --- a/terminus-terminal/src/index.ts +++ b/terminus-terminal/src/index.ts @@ -3,7 +3,7 @@ import { BrowserModule } from '@angular/platform-browser' import { FormsModule } from '@angular/forms' import { NgbModule } from '@ng-bootstrap/ng-bootstrap' -import { HostAppService, Platform, ToolbarButtonProvider, TabRecoveryProvider, ConfigProvider, HotkeysService } from 'terminus-core' +import { HostAppService, Platform, ToolbarButtonProvider, TabRecoveryProvider, ConfigProvider, HotkeysService, HotkeyProvider } from 'terminus-core' import { SettingsTabProvider } from 'terminus-settings' import { TerminalTabComponent } from './components/terminalTab.component' @@ -19,6 +19,7 @@ import { SessionPersistenceProvider, TerminalColorSchemeProvider, TerminalDecora import { TerminalSettingsTabProvider } from './settings' import { PathDropDecorator } from './pathDrop' import { TerminalConfigProvider } from './config' +import { TerminalHotkeyProvider } from './hotkeys' import { HyperColorSchemes } from './colorSchemes' import { hterm } from './hterm' @@ -46,6 +47,7 @@ import { hterm } from './hterm' }, { provide: SettingsTabProvider, useClass: TerminalSettingsTabProvider, multi: true }, { provide: ConfigProvider, useClass: TerminalConfigProvider, multi: true }, + { provide: HotkeyProvider, useClass: TerminalHotkeyProvider, multi: true }, { provide: TerminalColorSchemeProvider, useClass: HyperColorSchemes, multi: true }, { provide: TerminalDecorator, useClass: PathDropDecorator, multi: true }, ],