Added one button
All checks were successful
continuous-integration/drone/push Build is passing

This commit is contained in:
RakVhalate 2022-12-04 02:40:33 +10:00
parent d702e01f16
commit ccef7fb86f
18 changed files with 303 additions and 43 deletions

View File

@ -3,7 +3,6 @@
"",
"\\src",
"\\src\\app",
"\\src\\app\\send-post",
"\\src\\app\\services"
],
"PreviewInSolutionExplorer": false

Binary file not shown.

89
package-lock.json generated
View File

@ -13,6 +13,7 @@
"@angular/compiler": "^14.2.0",
"@angular/core": "^14.2.0",
"@angular/forms": "^14.2.0",
"@angular/material": "^7.0.0",
"@angular/platform-browser": "^14.2.0",
"@angular/platform-browser-dynamic": "^14.2.0",
"@angular/router": "^14.2.0",
@ -349,6 +350,35 @@
"@angular/core": "14.2.6"
}
},
"node_modules/@angular/cdk": {
"version": "7.0.0",
"resolved": "https://registry.npmjs.org/@angular/cdk/-/cdk-7.0.0.tgz",
"integrity": "sha512-HX+gIJzST/Nu07ASg1XR583KSEmHI6kUbiSBdq0LqF3mIQgId5z3auBqQcXAgvB0Cg29+/38aj31hnoK/LswEQ==",
"peer": true,
"dependencies": {
"tslib": "^1.7.1"
},
"optionalDependencies": {
"parse5": "^5.0.0"
},
"peerDependencies": {
"@angular/common": ">=7.0.0",
"@angular/core": ">=7.0.0"
}
},
"node_modules/@angular/cdk/node_modules/parse5": {
"version": "5.1.1",
"resolved": "https://registry.npmjs.org/parse5/-/parse5-5.1.1.tgz",
"integrity": "sha512-ugq4DFI0Ptb+WWjAdOK16+u/nHfiIrcE+sh8kZMaM0WllQKLI9rOUq6c2b7cwPkXdzfQESqvoqK6ug7U/Yyzug==",
"optional": true,
"peer": true
},
"node_modules/@angular/cdk/node_modules/tslib": {
"version": "1.14.1",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
"integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==",
"peer": true
},
"node_modules/@angular/cli": {
"version": "14.2.6",
"resolved": "https://registry.npmjs.org/@angular/cli/-/cli-14.2.6.tgz",
@ -481,6 +511,25 @@
"rxjs": "^6.5.3 || ^7.4.0"
}
},
"node_modules/@angular/material": {
"version": "7.0.0",
"resolved": "https://registry.npmjs.org/@angular/material/-/material-7.0.0.tgz",
"integrity": "sha512-HgHzHWsUvNiSpRmoOJqnH/TVb4Ki7sXxbWuw5OVKOKiBW6Gwvd29+cP4XauzH47wHMyvS9/HH8kj3gC72pLhJQ==",
"dependencies": {
"tslib": "^1.7.1"
},
"peerDependencies": {
"@angular/animations": ">=7.0.0",
"@angular/cdk": "7.0.0",
"@angular/common": ">=7.0.0",
"@angular/core": ">=7.0.0"
}
},
"node_modules/@angular/material/node_modules/tslib": {
"version": "1.14.1",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
"integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg=="
},
"node_modules/@angular/platform-browser": {
"version": "14.2.6",
"resolved": "https://registry.npmjs.org/@angular/platform-browser/-/platform-browser-14.2.6.tgz",
@ -13153,6 +13202,31 @@
"tslib": "^2.3.0"
}
},
"@angular/cdk": {
"version": "7.0.0",
"resolved": "https://registry.npmjs.org/@angular/cdk/-/cdk-7.0.0.tgz",
"integrity": "sha512-HX+gIJzST/Nu07ASg1XR583KSEmHI6kUbiSBdq0LqF3mIQgId5z3auBqQcXAgvB0Cg29+/38aj31hnoK/LswEQ==",
"peer": true,
"requires": {
"parse5": "^5.0.0",
"tslib": "^1.7.1"
},
"dependencies": {
"parse5": {
"version": "5.1.1",
"resolved": "https://registry.npmjs.org/parse5/-/parse5-5.1.1.tgz",
"integrity": "sha512-ugq4DFI0Ptb+WWjAdOK16+u/nHfiIrcE+sh8kZMaM0WllQKLI9rOUq6c2b7cwPkXdzfQESqvoqK6ug7U/Yyzug==",
"optional": true,
"peer": true
},
"tslib": {
"version": "1.14.1",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
"integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==",
"peer": true
}
}
},
"@angular/cli": {
"version": "14.2.6",
"resolved": "https://registry.npmjs.org/@angular/cli/-/cli-14.2.6.tgz",
@ -13231,6 +13305,21 @@
"tslib": "^2.3.0"
}
},
"@angular/material": {
"version": "7.0.0",
"resolved": "https://registry.npmjs.org/@angular/material/-/material-7.0.0.tgz",
"integrity": "sha512-HgHzHWsUvNiSpRmoOJqnH/TVb4Ki7sXxbWuw5OVKOKiBW6Gwvd29+cP4XauzH47wHMyvS9/HH8kj3gC72pLhJQ==",
"requires": {
"tslib": "^1.7.1"
},
"dependencies": {
"tslib": {
"version": "1.14.1",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
"integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg=="
}
}
},
"@angular/platform-browser": {
"version": "14.2.6",
"resolved": "https://registry.npmjs.org/@angular/platform-browser/-/platform-browser-14.2.6.tgz",

View File

@ -15,6 +15,7 @@
"@angular/compiler": "^14.2.0",
"@angular/core": "^14.2.0",
"@angular/forms": "^14.2.0",
"@angular/material": "^7.0.0",
"@angular/platform-browser": "^14.2.0",
"@angular/platform-browser-dynamic": "^14.2.0",
"@angular/router": "^14.2.0",

View File

@ -0,0 +1,21 @@
import { NgModule } from '@angular/core';
import {RouterModule, Routes} from "@angular/router";
import {HomeComponent} from "./pages/home/home.component";
import {ThreadsComponent} from "./pages/BoardThreads/threads.component";
import {BoardsComponent} from "./pages/SingleThread/boards.component";
import {AboutComponent} from "./pages/about/about.component";
import {NotFoundComponent} from "./pages/not-found/not-found.component";
const appRoutes: Routes = [
{ path: '', component: HomeComponent },
{ path: 'threads', component: ThreadsComponent},
{ path: 'board', component: BoardsComponent },
{ path: 'about', component: AboutComponent },
{ path: '**', component: NotFoundComponent }
]
@NgModule({
imports: [RouterModule.forRoot(appRoutes)],
exports: [RouterModule]
})
export class AppRoutingModule { }

View File

@ -1,4 +1,63 @@
h1{
color: red;
font-size: 10rem;
.main-container {
height: 100%;
}
.sidenav-content {
height: 100%;
align-items: center;
justify-content: center;
}
.sidenav {
padding: 20px;
border: 1px solid rgba(25, 116, 211, 0.5);
}
.navToggle-btn {
height: 40px;
color: #fff;
border-radius: 5px;
padding: 10px 25px;
font-family: 'Lato', sans-serif;
font-weight: 500;
background: transparent;
cursor: pointer;
transition: all 0.3s ease;
position: relative;
display: inline-block;
box-shadow:inset 2px 2px 2px 0px rgba(255,255,255,.5),
7px 7px 20px 0px rgba(0,0,0,.1),
4px 4px 5px 0px rgba(0,0,0,.1);
outline: none;
}
.btn-14 {
background: rgb(255,151,0);
border: none;
z-index: 1;
}
.btn-14:after {
position: absolute;
content: "";
width: 100%;
height: 0;
top: 0;
left: 0;
z-index: -1;
border-radius: 5px;
background-color: #ff0000;
background-image: linear-gradient(315deg, #000000 0%, #ff0000 74%);
box-shadow:inset 2px 2px 2px 0px rgba(255,255,255,.5);
transition: all 0.3s ease;
}
.btn-14:hover {
color: #ffffff;
}
.btn-14:hover:after {
top: auto;
bottom: 0;
height: 100%;
}
.btn-14:active {
top: 2px;
}

View File

@ -0,0 +1,15 @@
<div>
<h1>Welcome, traveler.</h1>
<mat-drawer-container class="main-container" [autosize]="true">
<mat-drawer #drawer class="sidenav" mode="side" [mode]="'push'">
<app-nav-bar></app-nav-bar>
</mat-drawer>
<div class="sidenav-content">
<button type="button" class = "navToggle-btn btn-14" (click)="drawer.toggle()">
Отобразить панель навигации
</button>
</div>
<router-outlet></router-outlet>
</mat-drawer-container>
</div>

View File

@ -1,18 +1,19 @@
import { Component } from '@angular/core';
@Component({
selector: 'app-root',
template: `<div>
<h1>Welcome, traveler.</h1>
<nav>
<a routerLink = "">Главная </a>
<a routerLink = "about">О нас </a>
<a routerLink = "board">Тред </a>
<a routerLink = "threads">Борда </a>
</nav>
<router-outlet></router-outlet>
</div>`
templateUrl: `app.component.html`,
styleUrls:['app.component.css']
})
export class AppComponent {
title = 'Nedvach Angular';
ngOnInit(): void {
}
}

View File

@ -1,9 +1,9 @@
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { Routes, RouterModule } from '@angular/router';
import { HttpClientModule } from '@angular/common/http';
import { AppComponent } from './app.component';
import { HomeComponent } from './pages/home/home.component';
import { AboutComponent } from './pages/about/about.component';
@ -15,14 +15,12 @@ import { SendPostComponent } from './pages/send-post/send-post.component';
import { PostComponent } from './pages/SingleThread/post/post.component'
import { ThreadsComponent } from './pages/BoardThreads/threads.component';
import { OPComponent } from './pages/BoardThreads/op/op.component';
import { AppRoutingModule } from './app-routing.module';
import {MatSidenavModule} from "@angular/material/sidenav";
import {BrowserAnimationsModule} from "@angular/platform-browser/animations";
import { NavBarComponent } from './pages/nav-bar/nav-bar.component';
const appRoutes: Routes = [
{ path: '', component: HomeComponent },
{ path: 'threads', component: ThreadsComponent},
{ path: 'board', component: BoardsComponent },
{ path: 'about', component: AboutComponent },
{ path: '**', component: NotFoundComponent }
]
@NgModule({
declarations: [
@ -34,13 +32,17 @@ const appRoutes: Routes = [
PostComponent,
SendPostComponent,
ThreadsComponent,
OPComponent
OPComponent,
NavBarComponent,
],
imports: [
BrowserModule,
RouterModule.forRoot(appRoutes),
HttpClientModule,
FormsModule
FormsModule,
AppRoutingModule,
MatSidenavModule,
BrowserAnimationsModule
],
providers: [
ApiChatService

9
src/app/models/boards.ts Normal file
View File

@ -0,0 +1,9 @@
export interface Board {
BoardName: string,
BoardExplainedName: string,
BoardID: number,
ThreadCount: number,
PostCount: number
}

View File

@ -1,6 +1,4 @@
import { Component, OnInit } from '@angular/core';
// двач лучший двач
import { ApiChatService } from '../../services/api-chat.service';
@Component({
selector: 'app-about',
@ -8,12 +6,9 @@ import { ApiChatService } from '../../services/api-chat.service';
styleUrls: [`./about.component.css`]
})
export class AboutComponent implements OnInit {
// это комментарий
ngOnInit(): void {
console.log('ya tochno ne ta stroka chto budet v drugom commite!');
console.log('Yeah, you REALLY expect me to push changes without any console debugging?');
}
}

View File

@ -1 +1 @@
<p>home works!</p>
<img src="http://static.vdk2ch.ru:15555/test-public/sin.jpg">

View File

@ -2,11 +2,11 @@ import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-home',
template: `<img src="http://static.vdk2ch.ru:15555/test-public/sin.jpg">`
templateUrl: `home.component.html`,
})
export class HomeComponent implements OnInit {
title = 'Home компонент';
title = 'Напоминание';

View File

@ -0,0 +1,10 @@
<nav>
<a routerLink = "">Напоминание </a>
<br>
<a routerLink = "about">О нас </a>
<br>
Доски:
<div>
<a *ngFor="let board of boardsToList" routerLink = "threads" title="{{board.BoardExplainedName}}">{{board.BoardName}}</a>
</div>
</nav>

View File

@ -0,0 +1,23 @@
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { NavBarComponent } from './nav-bar.component';
describe('NavBarComponent', () => {
let component: NavBarComponent;
let fixture: ComponentFixture<NavBarComponent>;
beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [ NavBarComponent ]
})
.compileComponents();
fixture = TestBed.createComponent(NavBarComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});

View File

@ -0,0 +1,21 @@
import { Component, OnInit } from '@angular/core';
import {Board} from "../../models/boards";
import {ApiChatService} from "../../services/api-chat.service";
@Component({
selector: 'app-nav-bar',
templateUrl: './nav-bar.component.html',
styleUrls: ['./nav-bar.component.css']
})
export class NavBarComponent implements OnInit {
boardsToList: Board[];
constructor(public apiChatService: ApiChatService) {
}
ngOnInit(): void {
this.boardsToList = this.apiChatService.getBoards()
}
}

View File

@ -2,6 +2,7 @@ import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Observable } from 'rxjs';
import { SinglePost } from '../models/post';
import {Board} from "../models/boards";
import * as globals from '../const/api';
@ -12,9 +13,9 @@ export class ApiChatService {
constructor(private http: HttpClient) {
}
getPosts(boardName:string, threadID: number): Observable<SinglePost[]> {
getPosts(boardName: string, threadID: number): Observable<SinglePost[]> {
//console.log("Получаю посты и картинки");
return this.http.get<SinglePost[]>(globals.api_endpoint +'List/', {params:{board: boardName , thread: threadID}}) ;
return this.http.get<SinglePost[]>(globals.api_endpoint + 'List/', {params: {board: boardName, thread: threadID}});
}
sendPostToApi(text: string, imgUrl: string[], threadId: number,) {
@ -27,19 +28,33 @@ export class ApiChatService {
ImgURL: imgUrl,
Thread_Id: threadId
}
return this.http.post( globals.api_endpoint +'PostTo', postToSend)
return this.http.post(globals.api_endpoint + 'PostTo', postToSend)
}
sendpic(picToSend: File):Observable<any> {
sendpic(picToSend: File): Observable<any> {
const PostPicture = new FormData();
PostPicture.append('PostPicture', picToSend);
return this.http.post(globals.api_endpoint +'UploadPic', PostPicture)
return this.http.post(globals.api_endpoint + 'UploadPic', PostPicture)
}
getThreads(boardName:string): Observable<SinglePost[]> {
getThreads(boardName: string): Observable<SinglePost[]> {
//console.log("Получаю посты и картинки");
return this.http.get<SinglePost[]>(globals.api_endpoint +'Threads/', {params:{board: boardName}}) ;
return this.http.get<SinglePost[]>(globals.api_endpoint + 'Threads/', {params: {board: boardName}});
}
}
sampleBoardList = [
{
BoardName: 'b',
BoardExplainedName: 'Всего понемногу',
BoardID: 228,
ThreadCount: 4,
PostCount: 4445
}
]
getBoards(): Board[] {
return this.sampleBoardList;
//return this.http.get<Board[]>(globals.api_endpoint + 'Boards/');
}
}