putisgamedown v2

src/app/app-routing.module.ts

@@ -8,6 +8,7 @@ import {BanlistPageComponent} from "./pages/banlist-page/banlist-page.component"
 import {MessagesPageComponent} from "./pages/messages-page/messages-page.component";
 import {VipPageComponent} from "./pages/vip-page/vip-page.component";
 import {DowngamePageComponent} from "./pages/downgame-page/downgame-page.component";
+import {StatisticPageComponent} from "./pages/statistic-page/statistic-page.component";
 
 const routes: Routes = [
   { path: "", component: MainPageComponent},
@@ -17,7 +18,8 @@ const routes: Routes = [
   { path: "banlist", component: BanlistPageComponent },
   { path: "messages", component: MessagesPageComponent },
   { path: "vip", component: VipPageComponent },
-  { path: "putisRun", component: DowngamePageComponent}
+  { path: "putisRun", component: DowngamePageComponent },
+  { path: "statistic", component: StatisticPageComponent }
 ];
 
 @NgModule({

src/app/app.module.ts

@@ -67,6 +67,7 @@ import {VipPromocodeDialog} from "./pages/vip-page/VipPromocodeDialog";
 import {MatCheckboxModule} from "@angular/material/checkbox";
 import {PromocodeService} from "./services/promocode.service";
 import { DowngamePageComponent } from './pages/downgame-page/downgame-page.component';
+import { StatisticPageComponent } from './pages/statistic-page/statistic-page.component';
 
 registerLocaleData(localeRu, "ru")
 
@@ -103,7 +104,8 @@ registerLocaleData(localeRu, "ru")
     VipBuyDialog,
     VipFreeDialog,
     VipPromocodeDialog,
-    DowngamePageComponent
+    DowngamePageComponent,
+    StatisticPageComponent
   ],
   imports: [
     BrowserModule,

src/app/entities/graph/StatsOfPeakOfDay.ts

@@ -0,0 +1,13 @@
+export class StatsOfPeakOfDay {
+  date!: string;
+  max!:number;
+  avg!:number;
+
+  static fromData(res:any):StatsOfPeakOfDay[] {
+    return res.map((ss: any) => {
+      const s = new StatsOfPeakOfDay();
+      Object.assign(s, ss);
+      return s;
+    })
+  }
+}

src/app/entities/graph/StatsOfPeakOfPerFiveMinutes.ts

@@ -0,0 +1,12 @@
+export class StatsOfPeakOfPerFiveMinutes {
+  timestamp!:Date;
+  max!:number;
+
+  static fromData(res:any):StatsOfPeakOfPerFiveMinutes[] {
+    return res.map((ss: any) => {
+      const s = new StatsOfPeakOfPerFiveMinutes();
+      Object.assign(s, ss);
+      return s;
+    })
+  }
+}

src/app/pages/downgame-page/downgame-page.component.scss

@@ -1,4 +1,4 @@
-@keyframes cactusMov {
+@keyframes shitMov {
   0%{
     left: 580px;
   }
@@ -36,21 +36,21 @@
 #putis {
   width: 50px;
   height: 50px;
-  background-image: url(../../../assets/images/downGame/dino.png);
+  background-image: url(../../../assets/images/downGame/putis.webp);
   background-size: 50px 50px;
   position: relative;
   top: 150px;
 }
 
-#cactus {
+#shit {
-  width: 20px;
+  width: 40px;
   height: 40px;
-  background-image: url(../../../assets/images/downGame/cactus.png);
+  background-image: url(../../../assets/images/downGame/shit.webp);
-  background-size: 20px 40px;
+  background-size: 40px 40px;
   position: relative;
   top: 110px;
   left: 580px;
-  animation: cactusMov 1s infinite linear;
+  animation: shitMov 1s infinite linear;
 }
 
 .jump {

src/app/pages/downgame-page/downgame-page.component.ts

@@ -1,53 +1,78 @@
-import {Component, ElementRef, OnInit, ViewChild} from '@angular/core';
+import {Component, ElementRef, Input, OnInit, ViewChild} from '@angular/core';
 import {ActionService} from "../../services/action.service";
+import {ActivatedRoute} from "@angular/router";
 
 @Component({
   selector: 'app-downgame-page',
   styleUrls: ['./downgame-page.component.scss'],
   template: `
+    <div *ngIf="dead" style="width: 600px; margin: auto">
+      <p style="text-align: center">Факты13 умерли, поиграй пока в симулятор путиса</p>
+    </div>
+    <div style="display: flex; justify-content: space-between; width: 600px; margin: auto">
+      <p>{{funnyText}}</p>
+      <p>Уронил кала: {{counter}}</p>
+    </div>
     <div class="game" (click)="jump()">
       <div id="putis" #putis [ngClass]="{'jump':isJump}"></div>
-      <div id="cactus" #cactus></div>
+      <div id="shit" #shit></div>
     </div>
   `
 })
 export class DowngamePageComponent implements OnInit {
 
-  constructor(private actionService: ActionService) { }
+  constructor(private actionService: ActionService,
+              private route: ActivatedRoute) { }
 
   @ViewChild('putis', {static: false})
   putis!: ElementRef;
 
-  @ViewChild('cactus', {static: false})
+  @ViewChild('shit', {static: false})
-  cactus!: ElementRef;
+  shit!: ElementRef;
 
   isAlive!: NodeJS.Timeout;
 
   isJump: boolean = false;
+  dead: boolean = true;
+
+  counter: number = 0;
+  funnyText: string = "";
 
   ngOnInit(): void {
     this.createGame();
+    if (this.route.snapshot.queryParamMap.get("dead") == null) {
+      this.dead = false;
+    }
   }
 
   createGame() {
     this.isAlive = setInterval (() => {
-      //console.log(this.putis, window.getComputedStyle(this.putis.nativeElement).top)
+      if (this.isTouch(this.putis, this.shit)) {
-
+        this.counter = 0;
-      let putisTop = this.putis ? parseInt(window.getComputedStyle(this.putis.nativeElement).top) : 0;
+        this.funnyText = "Лох";
-      let cactusLeft = this.cactus ? parseInt(window.getComputedStyle(this.cactus.nativeElement).left) : 0;
-
-      if (cactusLeft < 50 && cactusLeft > 0 && putisTop >= 140) {
-        alert("GAME OVER!")
       }
+
     }, 10)
   }
 
   jump() {
     if (!this.isJump) {
       this.isJump = true;
+      this.funnyText = "Молодец";
       setTimeout(() => {
         this.isJump = false;
+        this.counter++;
       }, 300);
     }
   }
+
+  isTouch(obj1_ref: any, obj2_ref: any): boolean {
+    const obj1: CSSStyleDeclaration = window.getComputedStyle(obj1_ref.nativeElement);
+    const obj2: CSSStyleDeclaration = window.getComputedStyle(obj2_ref.nativeElement);
+
+    const touch: boolean = parseInt(obj1.right) >= parseInt(obj2.left) && Math.abs(parseInt(obj1.bottom)) >= parseInt(obj2.top);
+
+    return touch;
+  }
+
 }

src/app/pages/main-page/main-page.component.ts

@@ -21,7 +21,7 @@ export class MainPageComponent implements OnInit {
     {ico: 'rowing', name: 'Статистика', url: 'statistic'},
     {ico: 'message', name: 'Сообщения', url: 'messages'},
     {ico: 'list_alt', name: 'Киллфид', url: 'killfeed'},
-    {ico: 'live_help', name: 'О нас', url: 'abot'}
+    {ico: 'live_help', name: 'О нас', url: 'about'}
   ]
 
   search: string = "";
@@ -38,7 +38,8 @@ export class MainPageComponent implements OnInit {
 
   ngOnInit(): void {
     this.serverService.getStats("statistic").subscribe(
-      (res) => this.statistic = res.export()
+      (res) => this.statistic = res.export(),
+      (err) => this.router.navigate(["/putisRun"], {queryParams: {dead: true}})
     )
   }
 

src/app/pages/statistic-page/statistic-page.component.html

@@ -0,0 +1,15 @@
+<div class="content-in-center-header" style="flex-direction: column;">
+  <h1>Статистика</h1>
+  <h3>Скоро и ты сюда попадешь браток</h3>
+</div>
+
+<div class="content-in-center">
+  <div class="content-in-border">
+    <h2>График онлайна</h2>
+    <div></div>
+  </div>
+  <div class="content-in-border">
+    <h2>Страны</h2>
+    <div></div>
+  </div>
+</div>

src/app/pages/statistic-page/statistic-page.component.scss

@@ -0,0 +1,3 @@
+h2 {
+  color: #000000;
+}

src/app/pages/statistic-page/statistic-page.component.ts

@@ -0,0 +1,38 @@
+import { Component, OnInit } from '@angular/core';
+import {GraphService} from "../../services/graph.service";
+
+export interface Period {
+  name: string
+  value: string
+}
+
+@Component({
+  selector: 'app-statistic-page',
+  templateUrl: './statistic-page.component.html',
+  styleUrls: ['./statistic-page.component.scss']
+})
+export class StatisticPageComponent implements OnInit {
+
+  init: boolean = true;
+  loading: boolean = false;
+
+  periods:Period[] = [
+    {name: 'По дням', value: 'days'},
+    {name: 'По минутам', value: 'minutes'}
+  ];
+  selectedPeriod:Period = this.periods[0];
+
+  days:number[] = [1,7,14,21,30,60,90,180];
+  selectedDays:number = 30;
+
+  constructor(private graphService: GraphService) { }
+
+  ngOnInit(): void {
+  }
+
+  getGraph() {
+    this.init = false;
+    this.loading = true;
+  }
+
+}

src/app/services/graph.service.ts

@@ -0,0 +1,21 @@
+import { Injectable } from '@angular/core';
+import {HttpClient} from "@angular/common/http";
+import {map, Observable} from "rxjs";
+import {StatsOfPeakOfDay} from "../entities/graph/StatsOfPeakOfDay";
+import {StatsOfPeakOfPerFiveMinutes} from "../entities/graph/StatsOfPeakOfPerFiveMinutes";
+
+@Injectable({
+  providedIn: 'root'
+})
+export class GraphService {
+
+  constructor(private http: HttpClient) { }
+
+  public getOnlineStatsOfDays(limit: number, server_id: string):Observable<StatsOfPeakOfDay[]> {
+    return this.http.get(`api/stats/graph/peak/of/days`, {params: {limit, server_id}}).pipe((map((res) => StatsOfPeakOfDay.fromData(res))))
+  }
+
+  public getOnlineStatsOfMinutes(minutes: number, limit: number, server_id: string):Observable<StatsOfPeakOfPerFiveMinutes[]> {
+    return this.http.get(`api/stats/graph/peak/of/minutes`, {params: {limit, server_id, minutes}}).pipe((map((res) => StatsOfPeakOfPerFiveMinutes.fromData(res))))
+  }
+}