feat: f11 screen full mode

Change-Id: I7106aafb5a03ba24f10bac7ab896199aef42a7b0

src/ui/web_window.cpp

@@ -267,6 +267,9 @@ void WebWindow::initConnections()
     connect(web_view_->page(), &QCefWebPage::urlChanged,
             this, &WebWindow::onWebViewUrlChanged);
 
+    connect(web_view_->page(), &QCefWebPage::fullscreenRequested,
+            this, &WebWindow::onFullscreenRequest);
+
     connect(web_view_->page(), &QCefWebPage::loadingStateChanged,
             this, &WebWindow::onLoadingStateChanged);
 
@@ -539,5 +542,14 @@ void WebWindow::webViewGoForward()
         page->forward();
     }
 }
+void WebWindow::onFullscreenRequest(bool fullscreen) {
+    if (fullscreen) {
+        this->titlebar()->hide();
+        this->showFullScreen();
+    } else {
+        this->titlebar()->show();
+        this->showNormal();
+    }
+}
 
 }  // namespace dstore

src/ui/web_window.h

@@ -110,6 +110,7 @@ class WebWindow : public Dtk::Widget::DMainWindow {
   void onThemeChaged(const QString theme_name);
 
   void onWebViewUrlChanged(const QUrl& url);
+  void onFullscreenRequest(bool fullscreen);
 
   void onLoadingStateChanged(bool is_loading,
                              bool can_go_back,

src/web/package.json

@@ -22,13 +22,15 @@
     "@angular/platform-browser": "~7.1.4",
     "@angular/platform-browser-dynamic": "~7.1.4",
     "@angular/router": "~7.1.4",
+    "@types/screenfull": "^3.3.2",
     "core-js": "^2.5.4",
     "jwt-decode": "^2.2.0",
     "localforage": "^1.7.3",
     "marked": "^0.5.1",
     "perfect-scrollbar": "^1.4.0",
     "qrcode": "^1.3.0",
     "rxjs": "~6.3.3",
+    "screenfull": "^4.0.0",
     "smooth-scroll-into-view-if-needed": "^1.1.23",
     "tslib": "^1.9.0",
     "zone.js": "~0.8.26"
@@ -56,4 +58,4 @@
     "tslint": "~5.11.0",
     "typescript": "~3.1.1"
   }
-}
+}

src/web/src/app/app.component.ts

@@ -11,6 +11,7 @@ import { App, AppService } from 'app/services/app.service';
 import { SearchService } from 'app/services/search.service';
 import { SysFontService } from 'app/services/sys-font.service';
 import { MenuService } from './services/menu.service';
+import { KeyboardService } from './services/keyboard.service';
 
 @Component({
   selector: 'dstore-root',
@@ -25,6 +26,7 @@ export class AppComponent implements OnInit {
     private themeService: ThemeService,
     private sysFontService: SysFontService,
     private menu: MenuService,
+    private keyboard: KeyboardService,
   ) {}
   ngOnInit(): void {
     this.switchTheme();
@@ -36,6 +38,7 @@ export class AppComponent implements OnInit {
     this.screenshotPreview();
     this.switchFont();
     this.menu.serve();
+    this.keyboard.server();
   }
 
   switchTheme() {

src/web/src/app/services/keyboard.service.ts

@@ -0,0 +1,41 @@
+import { Injectable } from '@angular/core';
+import * as screenFull from 'screenfull';
+
+@Injectable({
+  providedIn: 'root',
+})
+export class KeyboardService {
+  constructor() {}
+  server() {
+    const handles = new Map<string, KeyboardHandle>();
+    handles.set('F11', this.F11);
+    handles.set('Escape', this.Escape);
+    window.addEventListener('keydown', (event: KeyboardEvent) => {
+      const handle = handles.get(event.key);
+      if (handle) {
+        handle(event);
+      } else {
+        console.log(event);
+      }
+    });
+  }
+  Escape() {
+    if (!screenFull) {
+      return;
+    }
+    if (screenFull.isFullscreen) {
+      screenFull.exit();
+    }
+  }
+  F11() {
+    if (!screenFull) {
+      return;
+    }
+    if (screenFull.isFullscreen) {
+      screenFull.exit();
+    } else {
+      screenFull.request(document.documentElement);
+    }
+  }
+}
+type KeyboardHandle = (event: KeyboardEvent) => void;

src/web/yarn.lock

@@ -336,6 +336,10 @@
   version "0.0.32"
   resolved "http://registry.npm.taobao.org/@types/q/download/@types/q-0.0.32.tgz#bd284e57c84f1325da702babfc82a5328190c0c5"
 
+"@types/screenfull@^3.3.2":
+  version "3.3.2"
+  resolved "http://registry.npm.taobao.org/@types/screenfull/download/@types/screenfull-3.3.2.tgz#2425ed1ff1c70913e40c622c31b9b3b51701c9f9"
+
 "@types/selenium-webdriver@^3.0.0":
   version "3.0.12"
   resolved "http://registry.npm.taobao.org/@types/selenium-webdriver/download/@types/selenium-webdriver-3.0.12.tgz#6affe5aed1ba379175075a889adbe2bc3aa62159"
@@ -6063,6 +6067,10 @@ schema-utils@^1.0.0:
     ajv-errors "^1.0.0"
     ajv-keywords "^3.1.0"
 
+screenfull@^4.0.0:
+  version "4.0.0"
+  resolved "http://registry.npm.taobao.org/screenfull/download/screenfull-4.0.0.tgz#86f3c26a2e516c8143884d8af16d07f0cb653394"
+
 scroll-into-view-if-needed@2.2.20:
   version "2.2.20"
   resolved "http://registry.npm.taobao.org/scroll-into-view-if-needed/download/scroll-into-view-if-needed-2.2.20.tgz#3a46847a72233a3af9770e55df450f2a7f2e2a0e"