Merge pull request #16 from ssysm/update

Update

client/package.json

@@ -1,6 +1,6 @@
 {
   "name": "starrysea-client",
-  "version": "1.0.7",
+  "version": "1.0.8",
   "scripts": {
     "ng": "ng",
     "start": "ng serve",

client/src/app/view/about/about.component.html

@@ -32,8 +32,8 @@ <h1 class="text-center introh1 h1">About Us</h1>
     <div class="col-md-6 col-sm-12">
       <p class="h5">Latest System Releases: <span class="badge badge-success">{{Version}}</span></p>
       <div style="display: inline">
-        <p style="display: inline">Front-End: <span class="badge badge-success">v1.0.7</span></p>
-        <p style="display: inline">Back-End: <span class="badge badge-success">v1.0.7</span></p>
+        <p style="display: inline">Front-End: <span class="badge badge-success">v1.0.8</span></p>
+        <p style="display: inline">Back-End: <span class="badge badge-success">v1.0.8</span></p>
         <p>Latest Commit: <span class="badge badge-info">{{commit}}</span></p>
       </div>
     </div>

client/src/app/view/activity/activity.component.ts

@@ -1,14 +1,14 @@
-import { Component, OnInit } from '@angular/core';
+import {Component, OnDestroy, OnInit} from '@angular/core';
 import {ActivityService} from "../../service/activity.service";
 import {environment} from "../../../environments/environment";
 import {Meta, Title} from "@angular/platform-browser";
-
+declare var $:any;
 @Component({
   selector: 'app-activity',
   templateUrl: './activity.component.html',
   styleUrls: ['./activity.component.css']
 })
-export class ActivityComponent implements OnInit {
+export class ActivityComponent implements OnInit,OnDestroy {
 
   constructor(
     private activityService:ActivityService,
@@ -18,16 +18,42 @@ export class ActivityComponent implements OnInit {
 
   activityArr:Array<any>;
   apiBase:string = environment.apiBase;
+
+  page:number = 1;
+  limit:number = 5;
+
+  loading: Boolean;
   ngOnInit() {
     this.titleService.setTitle('Activities - Starry Sea Volunteers Association');
     this.metaService.updateTag({content:'/assets/icons/starrysea-512x512.png'}, "property='og:image'");
     this.metaService.updateTag({content: 'Activities - Starry Sea Volunteers Association'}, "property='og:title'");
     this.metaService.updateTag({content: 'All Activities from Starry Sea'}, "property='og:description'");
     this.metaService.updateTag({content: 'All Activities from Starry Sea'}, "name='description'");
-    this.activityService.fetchActivityList(1,99)
+    this.activityService.fetchActivityList(this.page,this.limit)
       .subscribe(data=>{
         this.activityArr = data.json().response
-      })
+      });
+    this.getContent();
+  }
+
+  getContent(){
+    $('app-activity').scroll(()=>{
+      if ($(document).height() - $(window).height() == $(window).scrollTop()) {
+        this.loading = true;
+        this.page = this.page+1;
+        this.activityService.fetchActivityList(this.page,this.limit)
+          .subscribe(data=>{
+            for(var i = 0;i < data.json().response.length;i++){
+              this.activityArr.push(data.json().response[i])
+            }
+            this.loading = false;
+          })
+      }
+    })
+  }
+
+  ngOnDestroy(){
+    $(window).unbind('scroll');
   }
 
 }

client/src/app/view/home/home.component.html

@@ -7,8 +7,8 @@ <h1 class="lead  text-center title">
   </h1>
   <div style="width: 100%;height: 20vh;"></div>
   <h2 class="lead  text-center title2">Dedicated to delivering the best of LoveLive Sunshine<br>Aqours events related support</h2>
-  <img src="/assets/img/TOW.png" class="img-fluid img-center" alt="">
-  <p class="text-right about">
+  <img src="/assets/img/TOW.png" class="img-fluid img-center" style="padding: 50px;" alt="">
+  <p class="text-right about container">
     The main job of Starry Sea is to make and distribute
     <br>callbooks and other goods for Aqours' activities throughout China,
     <br>and provide volunteer service as much as possible at live events.<br>

client/src/app/view/partical/not-found/not-found.component.html

@@ -6,9 +6,12 @@
     </p>
     <img src="/assets/img/error_dia.png" alt="Error" style="width: 25%;">
     <p class="h2 text-thin">Please Try Again Later</p>
-    <div style="border: solid #fafafa 1px; border-radius: 5px" *ngIf="cucuImg">
+
+    <div style="border: solid #fafafa 1px; border-radius: 5px" >
       <p class="text-thin">Here is a random picture of cucu</p>
+      <button class="btn btn-info" *ngIf="nsfwButton" (click)="digCucuImg()">Show Picture</button>
         <img
+          *ngIf="cucuImg"
           [src]="'data:image/png;base64,'+cucuImg"
           class="img-fluid img-pix"
           alt="cucu Image"
@@ -18,6 +21,6 @@
           (mousedown)="false"
         />
     </div>
-    <app-spinner *ngIf="!cucuImg"></app-spinner>
+    <app-spinner *ngIf="!cucuImg&&!nsfwButton"></app-spinner>
   </div>
 </div>

client/src/app/view/partical/not-found/not-found.component.ts

@@ -2,7 +2,7 @@ import { Component, OnInit } from '@angular/core';
 import {Http} from "@angular/http";
 import {environment} from "../../../../environments/environment";
 import {Meta, Title} from "@angular/platform-browser";
-
+declare var swal:any;
 @Component({
   selector: 'app-not-found',
   templateUrl: './not-found.component.html',
@@ -18,19 +18,35 @@ export class NotFoundComponent implements OnInit {
 
   cucuImg:string;
   apiBase:string = environment.apiBase;
+  nsfwButton:Boolean = true;
 
   ngOnInit() {
     this.titleService.setTitle('404 Not Found - Starry Sea Volunteers Association');
     this.metaService.updateTag({content:'/assets/icons/starrysea-512x512.png'}, "property='og:image'");
     this.metaService.updateTag({content: '404 Not Found'}, "property='og:title'");
     this.metaService.updateTag({content: 'Oops, Looks like this page doesn\'t exist'}, "property='og:description'");
     this.metaService.updateTag({content: 'Oops, Looks like this page doesn\'t exist'}, "name='description'");
-    this.
-      http
-        .get(environment.apiBase+'/errorImg',)
-      .subscribe(data=>{
-        this.cucuImg = data.text();
-      })
+
+  }
+
+  digCucuImg(){
+    swal({
+      title: "Warning!",
+      text: "The image might contain NSFW content",
+      icon: "warning",
+      buttons: [true, "Continue"]
+    })
+      .then((result) => {
+        if (result) {
+          this.nsfwButton = false;
+          this.
+          http
+            .get(environment.apiBase+'/errorImg')
+            .subscribe(data=>{
+              this.cucuImg = data.text();
+            })
+        }
+      });
   }
 
 }

client/src/app/view/work-detail/work-detail.component.css

@@ -1,3 +1,7 @@
 .container{
   padding: 24px;
 }
+.workImg{
+  border-radius: 5px;
+  margin: 10px;
+}

client/src/app/view/work-detail/work-detail.component.html

@@ -15,8 +15,8 @@ <h3 class="card-title">{{workData.name}}</h3>
   </div>
   <hr>
   <div class="row"  *ngFor="let image of workData.file.images">
-    <div class="col-sm-12">
-      <img src="{{apiBase+'/static/work/'+image.filename}}" alt="" class="img-fluid">
+    <div class="col-sm-12 text-center">
+      <img src="{{apiBase+'/static/work/'+image.filename}}" alt="" class="img-fluid workImg">
     </div>
   </div>
 </div>

client/src/app/view/work-detail/work-detail.component.ts

@@ -1,4 +1,4 @@
-import { Component, OnInit } from '@angular/core';
+import {Component, OnInit} from '@angular/core';
 import {WorkService} from "../../service/work.service";
 import {ActivatedRoute, Router} from "@angular/router";
 import {environment} from "../../../environments/environment";
@@ -39,7 +39,6 @@ export class WorkDetailComponent implements OnInit {
         }
       },error=>{
         this.router.navigate(['/','404'])
-      })
+      });
   }
-
 }

client/src/app/view/work/work.component.html

@@ -17,5 +17,5 @@ <h2 class="h1">Works Gallery</h2>
       <hr>
     </div>
   </div>
-  <app-spinner *ngIf="!workArr"></app-spinner>
+  <app-spinner *ngIf="!workArr||loading"></app-spinner>
 </div>

client/src/app/view/work/work.component.ts

@@ -1,14 +1,15 @@
-import { Component, OnInit } from '@angular/core';
+import {Component, OnDestroy, OnInit} from '@angular/core';
 import {WorkService} from "../../service/work.service";
 import {environment} from "../../../environments/environment";
 import {Meta, Title} from "@angular/platform-browser";
+declare var $:any;
 
 @Component({
   selector: 'app-work',
   templateUrl: './work.component.html',
   styleUrls: ['./work.component.css']
 })
-export class WorkComponent implements OnInit {
+export class WorkComponent implements OnInit, OnDestroy {
 
   constructor(
     private workService:WorkService,
@@ -18,17 +19,43 @@ export class WorkComponent implements OnInit {
 
   workArr: Array<any>;
   apiBase: string = environment.apiBase;
-
+  limit: number = 5;
+  page: number = 1;
+  loading:Boolean;
   ngOnInit() {
     this.titleService.setTitle('Works Gallery - Starry Sea Volunteers Association');
     this.metaService.updateTag({content:'/assets/icons/starrysea-512x512.png'}, "property='og:image'");
     this.metaService.updateTag({content: 'Work Gallery - Starry Sea Volunteers Association'}, "property='og:title'");
     this.metaService.updateTag({content: 'All Works from Starry Sea'}, "property='og:description'");
     this.metaService.updateTag({content: 'All Works from Starry Sea'}, "name='description'");
-    this.workService.fetchWorkList(1,99)
+    this.workService.fetchWorkList(this.page,this.limit)
       .subscribe(data=>{
         this.workArr = data.json().response
-      })
+      });
+    this.getContent();
+  }
+
+  getContent(){
+    $(window).scroll(()=>{
+      if ($(document).height() - $(window).height() == $(window).scrollTop()) {
+        this.loading = true;
+        this.page = this.page+1;
+        this.workService.fetchWorkList(this.page,this.limit)
+          .subscribe(data=>{
+            if(data.json().response.length == 0){
+              $(window).unbind('scroll')
+            }else {
+              for (var i = 0; i < data.json().response.length; i++) {
+                this.workArr.push(data.json().response[i])
+              }
+            }
+            this.loading = false;
+          })
+      }
+    })
+  }
+  ngOnDestroy(){
+    $(window).unbind('scroll');
   }
 
 }

package.json

@@ -1,6 +1,6 @@
 {
   "name": "starrysea",
-  "version": "1.0.7",
+  "version": "1.0.8",
   "description": "新一代星之海官网",
   "scripts": {
     "test": "echo \"Welcome to Starrysea-NextGen Project!\" && exit 0",
@@ -9,7 +9,9 @@
     "start:docs":"npm start --prefix=docs",
     "dev:server":"npm run dev --prefix=server",
     "build:client":"npm run build --prefix=client",
-    "build:docs" : "npm run build --prefix=docs"
+    "build:docs" : "npm run build --prefix=docs",
+    "test:docs": "npm run test --prefix=docs",
+    "test:client":"npm run test --prefix=client"
   },
   "repository": {
     "type": "git",

server/actions/works.js

@@ -35,6 +35,8 @@ createWork = (req,res)=>{
 fetchWork = (req,res)=>{
     "use strict";
     var { page,limit} = req.query;
+    var page = parseInt(page);
+    var limit = parseInt(limit);
     works.find({},["name","summary","file.cover"],(err,docs)=>{
         if(err){
             res.status(500).json({