login

app/login.component.css

+:host {
+    display: flex;
+}
+webview {
+    flex-grow: 1;
+}
\ No newline at end of file

app/login.component.html

-login
\ No newline at end of file
+<webview [src]="url" (will-navigate)="return_sso($event.url)" (did-get-redirect-request)="return_sso($event.newURL)"></webview>
\ No newline at end of file

app/login.component.ts

 /**
  * Created by zh99998 on 16/9/2.
  */
-import { Component } from '@angular/core';
+import {Component} from "@angular/core";
+import {LoginService} from "./login.service";
+declare var System;
+const crypto = System._nodeRequire('crypto');
+const querystring = System._nodeRequire('querystring');
+const url = System._nodeRequire('url');
+
 @Component({
     selector: 'login',
     templateUrl: 'app/login.component.html',
     styleUrls: ['app/login.component.css'],
 })
-export class LoginComponent { }
+export class LoginComponent {
+    url;
+    return_sso_url = 'https://mycard.moe/login_callback'; // 这个url不会真的被使用，可以填写不存在的
+
+    constructor(private loginService: LoginService) {
+        let payload = new Buffer(querystring.stringify({
+            //nonce: nonce,
+            return_sso_url: this.return_sso_url
+        })).toString('base64');
+
+        let request = querystring.stringify({
+            'sso': payload,
+            'sig': crypto.createHmac('sha256', 'zsZv6LXHDwwtUAGa').update(payload).digest('hex')
+        });
+        this.url = "https://ygobbs.com/session/sso_provider?" + request;
+    }
+
+    return_sso(return_url) {
+        if (!return_url.startsWith(this.return_sso_url)) {
+            return;
+        }
+        let token = querystring.parse(url.parse(return_url).query).sso;
+        let user = querystring.parse(new Buffer(token, 'base64').toString());
+
+        this.loginService.login(user);
+    }
+
+}

app/login.service.ts

+/**
+ * Created by zh99998 on 2016/10/25.
+ */
+import {Injectable} from "@angular/core";
+
+
+/*interface User {
+ admin: boolean;
+ avatar_url: string;
+ email: string;
+ external_id: number;
+ moderator: boolean;
+ name: string;
+ username: string;
+ }*/
+
+@Injectable()
+export class LoginService {
+    user = JSON.parse(localStorage.getItem('login'));
+
+    login(user) {
+        this.user = user;
+        localStorage.setItem('login', JSON.stringify(user));
+    }
+
+    logout() {
+        this.user = null;
+        localStorage.removeItem('login');
+    }
+}

app/mycard.component.css

@@ -84,8 +84,10 @@ li > a:hover, #window-buttons > i:hover {
 }
 
 /* https://github.com/electron/electron/issues/7661#event-827104990 */
-.hide {
+lobby[hidden], webview[hidden] {
     width: 0;
     height: 0;
     flex: 0 1;
+    display: inherit !important;
+    overflow: hidden;
 }
\ No newline at end of file

app/mycard.component.html

 <nav class="navbar navbar-dark bg-inverse" [class.darwin]="platform == 'darwin'">
     <a class="navbar-brand" href="#">MyCard</a>
     <ul class="nav navbar-nav">
+        <li *ngIf="!loginService.user" class="nav-item active">
+            <a class="nav-link" href="#">登录<span class="sr-only">(current)</span></a>
+        </li>
         <!--
         <li [ngClass]="{active: routingService.component == 'store'}" class="nav-item">
             <a (click)="changeFouce('store')" class="nav-link" href="#">商店</a>
         </li>
         -->
-        <li [ngClass]="{active: currentPage === 'lobby'}" class="nav-item">
+        <li *ngIf="loginService.user" [ngClass]="{active: currentPage === 'lobby'}" class="nav-item">
             <a (click)="currentPage='lobby'" class="nav-link" href="#">{{'library'| translate}}<span class="sr-only">(current)</span></a>
         </li>
-        <li [ngClass]="{active: currentPage === 'community'}" class="nav-item">
+        <li *ngIf="loginService.user" [ngClass]="{active: currentPage === 'community'}" class="nav-item">
             <a (click)="currentPage='community'" class="nav-link" href="#">{{'community'| translate}}</a>
         </li>
     </ul>
     <div class="navbar-right">
-        <div id="user">
+        <div id="user" *ngIf="loginService.user">
             <a href="#forum" class="require-login profile">
                 <img id="avatar" src="https://ygobbs.com/letter_avatar_proxy/v2/letter/a/e47774/36.png" alt="image">
             </a>
@@ -31,8 +34,8 @@
     </div>
 </nav>
 
-<login class="page" [ngClass]="{hide: currentPage != 'login'}"></login>
-<store class="page" [ngClass]="{hide: currentPage != 'store'}"></store>
-<lobby class="page" [ngClass]="{hide: currentPage != 'lobby'}"></lobby>
-<webview id="community" class="page" [ngClass]="{hide: currentPage != 'community'}"
+<login class="page" *ngIf="!loginService.user"></login>
+<store class="page" [hidden]="!loginService.user || currentPage != 'store'"></store>
+<lobby class="page" [hidden]="!loginService.user || currentPage != 'lobby'"></lobby>
+<webview id="community" class="page" [hidden]="!loginService.user || currentPage != 'community'"
          src="https://ygobbs.com"></webview>
\ No newline at end of file

app/mycard.component.ts

 import {Component, Renderer} from "@angular/core";
 import {TranslateService} from "ng2-translate";
 import {RoutingService} from "./routing.service";
+import {LoginService} from "./login.service";
 const electron = System._nodeRequire('electron');
 declare var process;
 declare var System;
@@ -14,11 +15,12 @@ declare var System;
 })
 
 export class MyCardComponent {
-    currentPage: string="lobby";
+    currentPage: string = "lobby";
 
     platform = process.platform;
 
-    constructor(private routingService: RoutingService, private renderer: Renderer, private translate: TranslateService) {
+    constructor(private routingService: RoutingService, private renderer: Renderer, private translate: TranslateService, private loginService: LoginService) {
+
         renderer.listenGlobal('window', 'message', (event) => {
             console.log(event);
             // Do something with 'event'

app/mycard.module.ts

@@ -16,12 +16,13 @@ import {RoutingService} from "./routing.service";
 import {AppsService} from "./apps.service";
 import {TranslateModule} from "ng2-translate";
 import {SettingsService} from "./settings.sevices";
+import {LoginService} from "./login.service";
 
 @NgModule({
     imports: [BrowserModule, FormsModule, ReactiveFormsModule, HttpModule, TranslateModule.forRoot()],
     declarations: [MyCardComponent, LoginComponent, StoreComponent, LobbyComponent, CommunityComponent, AppsComponent, AppDetailComponent, RosterComponent, CandyComponent, YGOProComponent],
     bootstrap: [MyCardComponent],
-    providers: [RoutingService, AppsService,SettingsService],
+    providers: [RoutingService, AppsService, SettingsService, LoginService],
     schemas: [NO_ERRORS_SCHEMA]
 })
 export class MyCard {

app/ygopro.component.html

@@ -16,7 +16,6 @@
     <button type="button" class="btn btn-secondary" data-toggle="modal" data-target="#game-create-modal">创建房间</button>
     <button type="button" class="btn btn-secondary" data-toggle="modal" data-target="#game-list-modal">房间列表</button>
     <button type="button" class="btn btn-secondary" data-toggle="modal" data-target="#game-create-windbot">单人模式</button>
-    <!--<button (click)="appsService.browse(routingService.app)" type="button" class="btn btn-secondary">浏览本地文件</button>-->
 </div>
 
 <div class="modal fade" id="game-create-windbot" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"