electron-proxy is added

angular.json

@@ -245,6 +245,44 @@
           }
         }
       }
+    },
+    "odds-crawler-frontend-electron-proxy": {
+      "root": "projects/odds-crawler-frontend-electron-proxy",
+      "sourceRoot": "projects/odds-crawler-frontend-electron-proxy/src",
+      "projectType": "library",
+      "prefix": "odds-crawler-electron-proxy",
+      "schematics": {
+        "@schematics/angular:component": {
+          "style": "scss"
+        }
+      },
+      "architect": {
+        "build": {
+          "builder": "@angular-devkit/build-ng-packagr:build",
+          "options": {
+            "tsConfig": "projects/odds-crawler-frontend-electron-proxy/tsconfig.lib.json",
+            "project": "projects/odds-crawler-frontend-electron-proxy/ng-package.json"
+          }
+        },
+        "test": {
+          "builder": "@angular-devkit/build-angular:karma",
+          "options": {
+            "main": "projects/odds-crawler-frontend-electron-proxy/src/test.ts",
+            "tsConfig": "projects/odds-crawler-frontend-electron-proxy/tsconfig.spec.json",
+            "karmaConfig": "projects/odds-crawler-frontend-electron-proxy/karma.conf.js"
+          }
+        },
+        "lint": {
+          "builder": "@angular-devkit/build-angular:tslint",
+          "options": {
+            "tsConfig": [
+              "projects/odds-crawler-frontend-electron-proxy/tsconfig.lib.json",
+              "projects/odds-crawler-frontend-electron-proxy/tsconfig.spec.json"
+            ],
+            "exclude": ["**/node_modules/**"]
+          }
+        }
+      }
     }
   },
   "defaultProject": "odds-crawler-frontend-app"

package.json

@@ -6,10 +6,13 @@
     "start": "ng serve",
     "build": "ng build",
     "build:app:electron": "ng build ---baseHref=./ --outputPath=../dist/odds-crawler-frontend-app",
+    "build:app:electron:watch": "ng build --watch ---baseHref=./ --outputPath=../dist/odds-crawler-frontend-app",
     "build:library": "ng build odds-crawler-frontend-common && npm-run-all -s build:library:*",
+    "build:library:electron-proxy": "ng build odds-crawler-frontend-electron-proxy",
     "build:library:network": "ng build odds-crawler-frontend-network",
     "build:library:page": "ng build odds-crawler-frontend-page",
     "build:watch:library": "npm-run-all -p build:watch:library:*",
+    "build:watch:library:electron-proxy": "ng build odds-crawler-frontend-electron-proxy --watch",
     "build:watch:library:network": "ng build odds-crawler-frontend-network --watch",
     "build:watch:library:page": "ng build odds-crawler-frontend-page --watch",
     "test": "ng test",
@@ -48,6 +51,7 @@
     "@angular/cli": "~7.3.8",
     "@angular/compiler-cli": "~7.2.0",
     "@angular/language-service": "~7.2.0",
+    "@types/hammerjs": "^2.0.36",
     "@types/node": "~8.9.4",
     "@types/jasmine": "~2.8.8",
     "@types/jasminewd2": "~2.0.3",

projects/odds-crawler-frontend-app/src/app/app.module.ts

@@ -3,6 +3,7 @@ import { BrowserModule } from '@angular/platform-browser';
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
 
 import { OddsCrawlerFrontendCommonModule } from '@odds-crawler/common';
+import { OddsCrawlerFrontendElectronProxyModule } from '@odds-crawler/electron-proxy';
 import { OddsCrawlerFrontendPageModule } from '@odds-crawler/page';
 import { OddsCrawlerFrontendNetworkModule } from '@odds-crawler/network';
 
@@ -16,6 +17,7 @@ import { AppComponent } from './app.component';
     BrowserModule,
     BrowserAnimationsModule,
     OddsCrawlerFrontendCommonModule.forRoot(),
+    OddsCrawlerFrontendElectronProxyModule.forRoot(),
     OddsCrawlerFrontendPageModule.forRoot(),
     OddsCrawlerFrontendNetworkModule.forRoot(),
     AppRoutingModule,

projects/odds-crawler-frontend-app/src/app/page/main/component/main.page.component.html

@@ -1,49 +1,40 @@
 <div class="page-main">
   <div class="page-main-gnb">
     <span>
-      <button mat-button [matMenuTriggerFor]="afterMenu">After</button>
+      <button mat-button [matMenuTriggerFor]="afterMenu">File</button>
       <mat-menu #afterMenu="matMenu" xPosition="after">
         <button mat-menu-item>Item 1</button>
         <button mat-menu-item>Item 2</button>
       </mat-menu>
-      <button mat-button [matMenuTriggerFor]="afterMenu">After</button>
+      <button mat-button [matMenuTriggerFor]="afterMenu">Edit</button>
       <mat-menu #afterMenu="matMenu" xPosition="after">
         <button mat-menu-item>Item 1</button>
         <button mat-menu-item>Item 2</button>
       </mat-menu>
-      <button mat-button [matMenuTriggerFor]="afterMenu">After</button>
+      <button mat-button [matMenuTriggerFor]="afterMenu">Help</button>
-      <mat-menu #afterMenu="matMenu" xPosition="after">
-        <button mat-menu-item>Item 1</button>
-        <button mat-menu-item>Item 2</button>
-      </mat-menu>
-      <button mat-button [matMenuTriggerFor]="afterMenu">After</button>
-      <mat-menu #afterMenu="matMenu" xPosition="after">
-        <button mat-menu-item>Item 1</button>
-        <button mat-menu-item>Item 2</button>
-      </mat-menu>
-      <button mat-button [matMenuTriggerFor]="afterMenu">After</button>
-      <mat-menu #afterMenu="matMenu" xPosition="after">
-        <button mat-menu-item>Item 1</button>
-        <button mat-menu-item>Item 2</button>
-      </mat-menu>
-      <button mat-button [matMenuTriggerFor]="afterMenu">After</button>
       <mat-menu #afterMenu="matMenu" xPosition="after">
         <button mat-menu-item>Item 1</button>
         <button mat-menu-item>Item 2</button>
       </mat-menu>
     </span>
-    <span>
+    <span class="page-main-gnb-form">
-      <form class="page-main-gnb-form">
+      <form>
-        <mat-form-field class="example-form-field">
+        <mat-form-field class="page-main-gnb-form-field">
-          <input matInput #tabURL type="text" placeholder="Clearable input" />
+          <input
+            matInput
+            #tabURL
+            type="text"
+            placeholder="Clearable input"
+            matAutosize="true"
+          />
           <button mat-button matSuffix mat-icon-button aria-label="Clear">
             <mat-icon>close</mat-icon>
           </button>
         </mat-form-field>
+        <button mat-icon-button type="button" (click)="onClickNewTab(tabURL)">
+          <mat-icon>tab</mat-icon>
+        </button>
       </form>
-      <button mat-icon-button (click)="onClickNewTab(tabURL)">
-        <mat-icon>tab</mat-icon>
-      </button>
     </span>
   </div>
   <div class="page-main-body">

projects/odds-crawler-frontend-app/src/app/page/main/component/main.page.component.scss

@@ -13,9 +13,12 @@
 }
 
 .page-main-gnb-form {
-  display: inherit;
+  width: 30%;
-  flex-flow: inherit;
+  float: right;
-  align-items: center;
+}
+
+.page-main-gnb-form-field {
+  width: 90%;
 }
 
 .page-main-body {

projects/odds-crawler-frontend-app/src/app/page/main/component/main.page.component.ts

@@ -10,8 +10,9 @@ export class MainPageComponent {
   tabSelectedIndex: 0;
   lnbSideNavOpened = true;
 
-  onClickAddTab($event) {
+  onClickNewTab(tabURL: HTMLInputElement) {
-    this.addTab('new');
+    this.addTab('new' + tabURL.value);
+    console.log(`new: ${tabURL.value}`);
   }
 
   onTabSelectedIndexChange($event) {}

projects/odds-crawler-frontend-electron-proxy/README.md

@@ -0,0 +1,24 @@
+# OddsCrawlerFrontendElectronProxy
+
+This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 7.2.0.
+
+## Code scaffolding
+
+Run `ng generate component component-name --project odds-crawler-frontend-electron-proxy` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module --project odds-crawler-frontend-electron-proxy`.
+> Note: Don't forget to add `--project odds-crawler-frontend-electron-proxy` or else it will be added to the default project in your `angular.json` file. 
+
+## Build
+
+Run `ng build odds-crawler-frontend-electron-proxy` to build the project. The build artifacts will be stored in the `dist/` directory.
+
+## Publishing
+
+After building your library with `ng build odds-crawler-frontend-electron-proxy`, go to the dist folder `cd dist/odds-crawler-frontend-electron-proxy` and run `npm publish`.
+
+## Running unit tests
+
+Run `ng test odds-crawler-frontend-electron-proxy` to execute the unit tests via [Karma](https://karma-runner.github.io).
+
+## Further help
+
+To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI README](https://github.com/angular/angular-cli/blob/master/README.md).

projects/odds-crawler-frontend-electron-proxy/karma.conf.js

@@ -0,0 +1,32 @@
+// Karma configuration file, see link for more information
+// https://karma-runner.github.io/1.0/config/configuration-file.html
+
+module.exports = function (config) {
+  config.set({
+    basePath: '',
+    frameworks: ['jasmine', '@angular-devkit/build-angular'],
+    plugins: [
+      require('karma-jasmine'),
+      require('karma-chrome-launcher'),
+      require('karma-jasmine-html-reporter'),
+      require('karma-coverage-istanbul-reporter'),
+      require('@angular-devkit/build-angular/plugins/karma')
+    ],
+    client: {
+      clearContext: false // leave Jasmine Spec Runner output visible in browser
+    },
+    coverageIstanbulReporter: {
+      dir: require('path').join(__dirname, '../../coverage/odds-crawler-frontend-electron-proxy'),
+      reports: ['html', 'lcovonly'],
+      fixWebpackSourcePaths: true
+    },
+    reporters: ['progress', 'kjhtml'],
+    port: 9876,
+    colors: true,
+    logLevel: config.LOG_INFO,
+    autoWatch: true,
+    browsers: ['Chrome'],
+    singleRun: false,
+    restartOnFileChange: true
+  });
+};

projects/odds-crawler-frontend-electron-proxy/ng-package.json

@@ -0,0 +1,7 @@
+{
+  "$schema": "../../node_modules/ng-packagr/ng-package.schema.json",
+  "dest": "../../dist/odds-crawler-frontend-electron-proxy",
+  "lib": {
+    "entryFile": "src/public-api.ts"
+  }
+}

projects/odds-crawler-frontend-electron-proxy/package.json

@@ -0,0 +1,8 @@
+{
+  "name": "@odds-crawler/electron-proxy",
+  "version": "0.0.1",
+  "peerDependencies": {
+    "@angular/common": "^7.2.0",
+    "@angular/core": "^7.2.0"
+  }
+}

projects/odds-crawler-frontend-electron-proxy/src/lib/electron-proxy.module.ts

@@ -0,0 +1,31 @@
+import { NgModule, ModuleWithProviders } from '@angular/core';
+import { CommonModule } from '@angular/common';
+
+import { OddsCrawlerFrontendCommonModule } from '@odds-crawler/common';
+
+import { IpcService } from './service/ipc.service';
+
+export const COMPONENTS = [];
+export const SERVICES = [IpcService];
+
+@NgModule({
+  declarations: [...COMPONENTS],
+  imports: [CommonModule, OddsCrawlerFrontendCommonModule],
+  exports: [...COMPONENTS]
+})
+export class OddsCrawlerFrontendElectronProxyModule {
+  public static forRoot(): ModuleWithProviders<
+    OddsCrawlerFrontendElectronProxyRootModule
+  > {
+    return {
+      ngModule: OddsCrawlerFrontendElectronProxyRootModule,
+      providers: [...SERVICES]
+    };
+  }
+}
+
+@NgModule({
+  imports: [],
+  exports: []
+})
+export class OddsCrawlerFrontendElectronProxyRootModule {}

projects/odds-crawler-frontend-electron-proxy/src/lib/service/ipc.service.spec.ts

@@ -0,0 +1,12 @@
+import { TestBed } from '@angular/core/testing';
+
+import { IpcService } from './ipc.service';
+
+describe('electron.IpcService', () => {
+  beforeEach(() => TestBed.configureTestingModule({}));
+
+  it('should be created', () => {
+    const service: IpcService = TestBed.get(IpcService);
+    expect(service).toBeTruthy();
+  });
+});

projects/odds-crawler-frontend-electron-proxy/src/lib/service/ipc.service.ts

@@ -0,0 +1,8 @@
+import { Injectable } from '@angular/core';
+
+@Injectable({
+  providedIn: 'root'
+})
+export class IpcService {
+  constructor() {}
+}

projects/odds-crawler-frontend-electron-proxy/src/public-api.ts

@@ -0,0 +1,7 @@
+/*
+ * Public API Surface of odds-crawler-frontend-electron-proxy
+ */
+
+export * from './lib/electron-proxy.module';
+
+export * from './lib/service/ipc.service';

projects/odds-crawler-frontend-electron-proxy/src/test.ts

@@ -0,0 +1,22 @@
+// This file is required by karma.conf.js and loads recursively all the .spec and framework files
+
+import 'core-js/es7/reflect';
+import 'zone.js/dist/zone';
+import 'zone.js/dist/zone-testing';
+import { getTestBed } from '@angular/core/testing';
+import {
+  BrowserDynamicTestingModule,
+  platformBrowserDynamicTesting
+} from '@angular/platform-browser-dynamic/testing';
+
+declare const require: any;
+
+// First, initialize the Angular testing environment.
+getTestBed().initTestEnvironment(
+  BrowserDynamicTestingModule,
+  platformBrowserDynamicTesting()
+);
+// Then we find all the tests.
+const context = require.context('./', true, /\.spec\.ts$/);
+// And load the modules.
+context.keys().map(context);

projects/odds-crawler-frontend-electron-proxy/tsconfig.lib.json

@@ -0,0 +1,32 @@
+{
+  "extends": "../../tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../../out-tsc/lib",
+    "target": "es2015",
+    "module": "es2015",
+    "moduleResolution": "node",
+    "declaration": true,
+    "sourceMap": true,
+    "inlineSources": true,
+    "emitDecoratorMetadata": true,
+    "experimentalDecorators": true,
+    "importHelpers": true,
+    "types": [],
+    "lib": [
+      "dom",
+      "es2018"
+    ]
+  },
+  "angularCompilerOptions": {
+    "annotateForClosureCompiler": true,
+    "skipTemplateCodegen": true,
+    "strictMetadataEmit": true,
+    "fullTemplateTypeCheck": true,
+    "strictInjectionParameters": true,
+    "enableResourceInlining": true
+  },
+  "exclude": [
+    "src/test.ts",
+    "**/*.spec.ts"
+  ]
+}

projects/odds-crawler-frontend-electron-proxy/tsconfig.spec.json

@@ -0,0 +1,17 @@
+{
+  "extends": "../../tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../../out-tsc/spec",
+    "types": [
+      "jasmine",
+      "node"
+    ]
+  },
+  "files": [
+    "src/test.ts"
+  ],
+  "include": [
+    "**/*.spec.ts",
+    "**/*.d.ts"
+  ]
+}

projects/odds-crawler-frontend-electron-proxy/tslint.json

@@ -0,0 +1,17 @@
+{
+  "extends": "../../tslint.json",
+  "rules": {
+    "directive-selector": [
+      true,
+      "attribute",
+      "oddsCrawlerElectronProxy",
+      "camelCase"
+    ],
+    "component-selector": [
+      true,
+      "element",
+      "odds-crawler-electron-proxy",
+      "kebab-case"
+    ]
+  }
+}

tsconfig.json

@@ -16,7 +16,10 @@
     "paths": {
       "@odds-crawler/common": ["dist/odds-crawler-frontend-common"],
       "@odds-crawler/network": ["dist/odds-crawler-frontend-network"],
-      "@odds-crawler/page": ["dist/odds-crawler-frontend-page"]
+      "@odds-crawler/page": ["dist/odds-crawler-frontend-page"],
+      "@odds-crawler/electron-proxy": [
+        "dist/odds-crawler-frontend-electron-proxy"
+      ]
     }
   }
 }