diff --git a/package-lock.json b/package-lock.json index aa715f8..c034fb6 100644 --- a/package-lock.json +++ b/package-lock.json @@ -39,6 +39,7 @@ "karma-coverage": "~2.2.0", "karma-jasmine": "~5.1.0", "karma-jasmine-html-reporter": "~2.0.0", + "schematics-scss-migrate": "^1.3.15", "typescript": "~4.7.2" } }, @@ -11113,6 +11114,188 @@ "integrity": "sha512-xbbCH5dCYU5T8LcEhhuh7HJ88HXuW3qsI3Y0zOZFKfZEHcpWiHU/Jxzk629Brsab/mMiHQti9wMP+845RPe3Vg==", "dev": true }, + "node_modules/schematics-scss-migrate": { + "version": "1.3.15", + "resolved": "https://registry.npmjs.org/schematics-scss-migrate/-/schematics-scss-migrate-1.3.15.tgz", + "integrity": "sha512-liOWef7NlVIoW8b3Ctvr1zcfHkISBKFI3X1dZaOQjDP0rDFgBCaPKqAl1X6Eiu0fgbWmNi5XzV9gU4F/2V7q5g==", + "dev": true, + "dependencies": { + "@angular-devkit/core": "^12.0.1", + "@angular-devkit/schematics": "^12.2.8", + "@schematics/angular": "^12.2.8", + "glob": "^7.1.6", + "sass": "^1.29.0", + "typescript": "^4.3.2" + } + }, + "node_modules/schematics-scss-migrate/node_modules/@angular-devkit/core": { + "version": "12.2.18", + "resolved": "https://registry.npmjs.org/@angular-devkit/core/-/core-12.2.18.tgz", + "integrity": "sha512-GDLHGe9HEY5SRS+NrKr14C8aHsRCiBFkBFSSbeohgLgcgSXzZHFoU84nDWrl3KZNP8oqcUSv5lHu6dLcf2fnww==", + "dev": true, + "dependencies": { + "ajv": "8.6.2", + "ajv-formats": "2.1.0", + "fast-json-stable-stringify": "2.1.0", + "magic-string": "0.25.7", + "rxjs": "6.6.7", + "source-map": "0.7.3" + }, + "engines": { + "node": "^12.14.1 || >=14.0.0", + "npm": "^6.11.0 || ^7.5.6 || >=8.0.0", + "yarn": ">= 1.13.0" + } + }, + "node_modules/schematics-scss-migrate/node_modules/@angular-devkit/schematics": { + "version": "12.2.18", + "resolved": "https://registry.npmjs.org/@angular-devkit/schematics/-/schematics-12.2.18.tgz", + "integrity": "sha512-bZ9NS5PgoVfetRC6WeQBHCY5FqPZ9y2TKHUo12sOB2YSL3tgWgh1oXyP8PtX34gasqsLjNULxEQsAQYEsiX/qQ==", + "dev": true, + "dependencies": { + "@angular-devkit/core": "12.2.18", + "ora": "5.4.1", + "rxjs": "6.6.7" + }, + "engines": { + "node": "^12.14.1 || >=14.0.0", + "npm": "^6.11.0 || ^7.5.6 || >=8.0.0", + "yarn": ">= 1.13.0" + } + }, + "node_modules/schematics-scss-migrate/node_modules/@schematics/angular": { + "version": "12.2.18", + "resolved": "https://registry.npmjs.org/@schematics/angular/-/angular-12.2.18.tgz", + "integrity": "sha512-niRS9Ly9y8uI0YmTSbo8KpdqCCiZ/ATMZWeS2id5M8JZvfXbngwiqJvojdSol0SWU+n1W4iA+lJBdt4gSKlD5w==", + "dev": true, + "dependencies": { + "@angular-devkit/core": "12.2.18", + "@angular-devkit/schematics": "12.2.18", + "jsonc-parser": "3.0.0" + }, + "engines": { + "node": "^12.14.1 || >=14.0.0", + "npm": "^6.11.0 || ^7.5.6 || >=8.0.0", + "yarn": ">= 1.13.0" + } + }, + "node_modules/schematics-scss-migrate/node_modules/ajv": { + "version": "8.6.2", + "resolved": "https://registry.npmjs.org/ajv/-/ajv-8.6.2.tgz", + "integrity": "sha512-9807RlWAgT564wT+DjeyU5OFMPjmzxVobvDFmNAhY+5zD6A2ly3jDp6sgnfyDtlIQ+7H97oc/DGCzzfu9rjw9w==", + "dev": true, + "dependencies": { + "fast-deep-equal": "^3.1.1", + "json-schema-traverse": "^1.0.0", + "require-from-string": "^2.0.2", + "uri-js": "^4.2.2" + }, + "funding": { + "type": "github", + "url": "https://github.com/sponsors/epoberezkin" + } + }, + "node_modules/schematics-scss-migrate/node_modules/ajv-formats": { + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/ajv-formats/-/ajv-formats-2.1.0.tgz", + "integrity": "sha512-USH2jBb+C/hIpwD2iRjp0pe0k+MvzG0mlSn/FIdCgQhUb9ALPRjt2KIQdfZDS9r0ZIeUAg7gOu9KL0PFqGqr5Q==", + "dev": true, + "dependencies": { + "ajv": "^8.0.0" + }, + "peerDependencies": { + "ajv": "^8.0.0" + }, + "peerDependenciesMeta": { + "ajv": { + "optional": true + } + } + }, + "node_modules/schematics-scss-migrate/node_modules/brace-expansion": { + "version": "1.1.11", + "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz", + "integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==", + "dev": true, + "dependencies": { + "balanced-match": "^1.0.0", + "concat-map": "0.0.1" + } + }, + "node_modules/schematics-scss-migrate/node_modules/glob": { + "version": "7.2.3", + "resolved": "https://registry.npmjs.org/glob/-/glob-7.2.3.tgz", + "integrity": "sha512-nFR0zLpU2YCaRxwoCJvL6UvCH2JFyFVIvwTLsIf21AuHlMskA1hhTdk+LlYJtOlYt9v6dvszD2BGRqBL+iQK9Q==", + "dev": true, + "dependencies": { + "fs.realpath": "^1.0.0", + "inflight": "^1.0.4", + "inherits": "2", + "minimatch": "^3.1.1", + "once": "^1.3.0", + "path-is-absolute": "^1.0.0" + }, + "engines": { + "node": "*" + }, + "funding": { + "url": "https://github.com/sponsors/isaacs" + } + }, + "node_modules/schematics-scss-migrate/node_modules/jsonc-parser": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/jsonc-parser/-/jsonc-parser-3.0.0.tgz", + "integrity": "sha512-fQzRfAbIBnR0IQvftw9FJveWiHp72Fg20giDrHz6TdfB12UH/uue0D3hm57UB5KgAVuniLMCaS8P1IMj9NR7cA==", + "dev": true + }, + "node_modules/schematics-scss-migrate/node_modules/magic-string": { + "version": "0.25.7", + "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.25.7.tgz", + "integrity": "sha512-4CrMT5DOHTDk4HYDlzmwu4FVCcIYI8gauveasrdCu2IKIFOJ3f0v/8MDGJCDL9oD2ppz/Av1b0Nj345H9M+XIA==", + "dev": true, + "dependencies": { + "sourcemap-codec": "^1.4.4" + } + }, + "node_modules/schematics-scss-migrate/node_modules/minimatch": { + "version": "3.1.2", + "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.2.tgz", + "integrity": "sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==", + "dev": true, + "dependencies": { + "brace-expansion": "^1.1.7" + }, + "engines": { + "node": "*" + } + }, + "node_modules/schematics-scss-migrate/node_modules/rxjs": { + "version": "6.6.7", + "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-6.6.7.tgz", + "integrity": "sha512-hTdwr+7yYNIT5n4AMYp85KA6yw2Va0FLa3Rguvbpa4W3I5xynaBZo41cM3XM+4Q6fRMj3sBYIR1VAmZMXYJvRQ==", + "dev": true, + "dependencies": { + "tslib": "^1.9.0" + }, + "engines": { + "npm": ">=2.0.0" + } + }, + "node_modules/schematics-scss-migrate/node_modules/source-map": { + "version": "0.7.3", + "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.7.3.tgz", + "integrity": "sha512-CkCj6giN3S+n9qrYiBTX5gystlENnRW5jZeNLHpe6aue+SrHcG5VYwujhW9s4dY31mEGsxBDrHR6oI69fTXsaQ==", + "dev": true, + "engines": { + "node": ">= 8" + } + }, + "node_modules/schematics-scss-migrate/node_modules/tslib": { + "version": "1.14.1", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz", + "integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==", + "dev": true + }, "node_modules/select-hose": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/select-hose/-/select-hose-2.0.0.tgz", @@ -21015,6 +21198,148 @@ } } }, + "schematics-scss-migrate": { + "version": "1.3.15", + "resolved": "https://registry.npmjs.org/schematics-scss-migrate/-/schematics-scss-migrate-1.3.15.tgz", + "integrity": "sha512-liOWef7NlVIoW8b3Ctvr1zcfHkISBKFI3X1dZaOQjDP0rDFgBCaPKqAl1X6Eiu0fgbWmNi5XzV9gU4F/2V7q5g==", + "dev": true, + "requires": { + "@angular-devkit/core": "^12.0.1", + "@angular-devkit/schematics": "^12.2.8", + "@schematics/angular": "^12.2.8", + "glob": "^7.1.6", + "sass": "^1.29.0", + "typescript": "^4.3.2" + }, + "dependencies": { + "@angular-devkit/core": { + "version": "12.2.18", + "resolved": "https://registry.npmjs.org/@angular-devkit/core/-/core-12.2.18.tgz", + "integrity": "sha512-GDLHGe9HEY5SRS+NrKr14C8aHsRCiBFkBFSSbeohgLgcgSXzZHFoU84nDWrl3KZNP8oqcUSv5lHu6dLcf2fnww==", + "dev": true, + "requires": { + "ajv": "8.6.2", + "ajv-formats": "2.1.0", + "fast-json-stable-stringify": "2.1.0", + "magic-string": "0.25.7", + "rxjs": "6.6.7", + "source-map": "0.7.3" + } + }, + "@angular-devkit/schematics": { + "version": "12.2.18", + "resolved": "https://registry.npmjs.org/@angular-devkit/schematics/-/schematics-12.2.18.tgz", + "integrity": "sha512-bZ9NS5PgoVfetRC6WeQBHCY5FqPZ9y2TKHUo12sOB2YSL3tgWgh1oXyP8PtX34gasqsLjNULxEQsAQYEsiX/qQ==", + "dev": true, + "requires": { + "@angular-devkit/core": "12.2.18", + "ora": "5.4.1", + "rxjs": "6.6.7" + } + }, + "@schematics/angular": { + "version": "12.2.18", + "resolved": "https://registry.npmjs.org/@schematics/angular/-/angular-12.2.18.tgz", + "integrity": "sha512-niRS9Ly9y8uI0YmTSbo8KpdqCCiZ/ATMZWeS2id5M8JZvfXbngwiqJvojdSol0SWU+n1W4iA+lJBdt4gSKlD5w==", + "dev": true, + "requires": { + "@angular-devkit/core": "12.2.18", + "@angular-devkit/schematics": "12.2.18", + "jsonc-parser": "3.0.0" + } + }, + "ajv": { + "version": "8.6.2", + "resolved": "https://registry.npmjs.org/ajv/-/ajv-8.6.2.tgz", + "integrity": "sha512-9807RlWAgT564wT+DjeyU5OFMPjmzxVobvDFmNAhY+5zD6A2ly3jDp6sgnfyDtlIQ+7H97oc/DGCzzfu9rjw9w==", + "dev": true, + "requires": { + "fast-deep-equal": "^3.1.1", + "json-schema-traverse": "^1.0.0", + "require-from-string": "^2.0.2", + "uri-js": "^4.2.2" + } + }, + "ajv-formats": { + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/ajv-formats/-/ajv-formats-2.1.0.tgz", + "integrity": "sha512-USH2jBb+C/hIpwD2iRjp0pe0k+MvzG0mlSn/FIdCgQhUb9ALPRjt2KIQdfZDS9r0ZIeUAg7gOu9KL0PFqGqr5Q==", + "dev": true, + "requires": { + "ajv": "^8.0.0" + } + }, + "brace-expansion": { + "version": "1.1.11", + "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz", + "integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==", + "dev": true, + "requires": { + "balanced-match": "^1.0.0", + "concat-map": "0.0.1" + } + }, + "glob": { + "version": "7.2.3", + "resolved": "https://registry.npmjs.org/glob/-/glob-7.2.3.tgz", + "integrity": "sha512-nFR0zLpU2YCaRxwoCJvL6UvCH2JFyFVIvwTLsIf21AuHlMskA1hhTdk+LlYJtOlYt9v6dvszD2BGRqBL+iQK9Q==", + "dev": true, + "requires": { + "fs.realpath": "^1.0.0", + "inflight": "^1.0.4", + "inherits": "2", + "minimatch": "^3.1.1", + "once": "^1.3.0", + "path-is-absolute": "^1.0.0" + } + }, + "jsonc-parser": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/jsonc-parser/-/jsonc-parser-3.0.0.tgz", + "integrity": "sha512-fQzRfAbIBnR0IQvftw9FJveWiHp72Fg20giDrHz6TdfB12UH/uue0D3hm57UB5KgAVuniLMCaS8P1IMj9NR7cA==", + "dev": true + }, + "magic-string": { + "version": "0.25.7", + "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.25.7.tgz", + "integrity": "sha512-4CrMT5DOHTDk4HYDlzmwu4FVCcIYI8gauveasrdCu2IKIFOJ3f0v/8MDGJCDL9oD2ppz/Av1b0Nj345H9M+XIA==", + "dev": true, + "requires": { + "sourcemap-codec": "^1.4.4" + } + }, + "minimatch": { + "version": "3.1.2", + "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.2.tgz", + "integrity": "sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==", + "dev": true, + "requires": { + "brace-expansion": "^1.1.7" + } + }, + "rxjs": { + "version": "6.6.7", + "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-6.6.7.tgz", + "integrity": "sha512-hTdwr+7yYNIT5n4AMYp85KA6yw2Va0FLa3Rguvbpa4W3I5xynaBZo41cM3XM+4Q6fRMj3sBYIR1VAmZMXYJvRQ==", + "dev": true, + "requires": { + "tslib": "^1.9.0" + } + }, + "source-map": { + "version": "0.7.3", + "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.7.3.tgz", + "integrity": "sha512-CkCj6giN3S+n9qrYiBTX5gystlENnRW5jZeNLHpe6aue+SrHcG5VYwujhW9s4dY31mEGsxBDrHR6oI69fTXsaQ==", + "dev": true + }, + "tslib": { + "version": "1.14.1", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz", + "integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==", + "dev": true + } + } + }, "select-hose": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/select-hose/-/select-hose-2.0.0.tgz", diff --git a/package.json b/package.json index 35df16d..d7b8830 100644 --- a/package.json +++ b/package.json @@ -41,6 +41,7 @@ "karma-coverage": "~2.2.0", "karma-jasmine": "~5.1.0", "karma-jasmine-html-reporter": "~2.0.0", + "schematics-scss-migrate": "^1.3.15", "typescript": "~4.7.2" } } diff --git a/src/app/app.component.html b/src/app/app.component.html index ea4a902..478d817 100644 --- a/src/app/app.component.html +++ b/src/app/app.component.html @@ -1,4 +1,5 @@
+

Welcome, traveler.

diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 9a16491..3083011 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -19,6 +19,7 @@ import { MatSidenavModule } from "@angular/material/sidenav"; import { BrowserAnimationsModule } from "@angular/platform-browser/animations"; import { NavBarComponent } from './pages/nav-bar/nav-bar.component'; import { SendFormComponent } from './pages/send-form/send-form.component'; +import { SnowComponent } from './pages/snow/snow.component'; @@ -33,7 +34,8 @@ import { SendFormComponent } from './pages/send-form/send-form.component'; ThreadsComponent, OPComponent, NavBarComponent, - SendFormComponent + SendFormComponent, + SnowComponent ], imports: [ diff --git a/src/app/pages/BoardThreads/threads.component.html b/src/app/pages/BoardThreads/threads.component.html index 6ed7090..1ed5453 100644 --- a/src/app/pages/BoardThreads/threads.component.html +++ b/src/app/pages/BoardThreads/threads.component.html @@ -1,6 +1,6 @@

Вы находитесь на доске {{boardName}}

- +
Что это и как это работает? diff --git a/src/app/pages/BoardThreads/threads.component.ts b/src/app/pages/BoardThreads/threads.component.ts index 2f62282..9517ba8 100644 --- a/src/app/pages/BoardThreads/threads.component.ts +++ b/src/app/pages/BoardThreads/threads.component.ts @@ -27,10 +27,8 @@ export class ThreadsComponent implements OnInit { }) } - alert(tosend: any){ - console.log("Получен эмит создания треда " + tosend.text); - console.log("С картинками: " + tosend.images) - showAlert("Cкоро можно будет создавать треды" , "#ff0a36"); + createThread(tosend: any){ + this.apiChatService.sendThreadToApi(tosend.text, tosend.images, this.boardName) } ngOnInit(): void { diff --git a/src/app/pages/snow/snow.component.html b/src/app/pages/snow/snow.component.html new file mode 100644 index 0000000..d6158c2 --- /dev/null +++ b/src/app/pages/snow/snow.component.html @@ -0,0 +1,30 @@ +
❅
+
❅
+
❅
+
❅
+
❅
+
❅
+
❅
+
❅
+
❅
+
❅
+
❅
+
❅
+
❅
+
❅
+
❅
+
❅
+
❅
+
❅
+
❅
+
❅
+
❅
+
❅
+
❅
+
❅
+
❅
+
❅
+
❅
+
❅
+
❅
+
❅
\ No newline at end of file diff --git a/src/app/pages/snow/snow.component.scss b/src/app/pages/snow/snow.component.scss new file mode 100644 index 0000000..de8ef6f --- /dev/null +++ b/src/app/pages/snow/snow.component.scss @@ -0,0 +1,48 @@ +@function random_range($min, $max) { + $rand: random(); + $random_range: $min + floor($rand * (($max - $min) + 1)); + @return $random_range; + } + + + + .snow { + $total: 30; + position: absolute; + width: 20px; + height: 20px; + font-size: 50px; + border-radius: 50%; + pointer-events: none; + color: #f8f8f8; + z-index: 999999; + text-shadow: 1px 1px 1px #000000; + + @for $i from 1 through $total { + $random-x: random(1000000) * 0.0001vw; + $random-offset: random_range(-100000, 100000) * 0.0001vw; + $random-x-end: $random-x + $random-offset; + $random-x-end-yoyo: $random-x + ($random-offset / 2); + $random-yoyo-time: random_range(30000, 80000) / 100000; + $random-yoyo-y: $random-yoyo-time * 100vh; + $random-scale: random(10000) * 0.0001; + $fall-duration: random_range(10, 30) * 1s; + $fall-delay: random(30) * -1s; + + &:nth-child(#{$i}) { + opacity: random_range(2000, 8000) * 0.0001; + transform: translate($random-x, -10px) scale($random-scale); + animation: fall-#{$i} $fall-duration $fall-delay linear infinite; + } + + @keyframes fall-#{$i} { + #{percentage($random-yoyo-time)} { + transform: translate($random-x-end, $random-yoyo-y) scale($random-scale); + } + + to { + transform: translate($random-x-end-yoyo, 100vh) scale($random-scale); + } + } + } + } \ No newline at end of file diff --git a/src/app/pages/snow/snow.component.spec.ts b/src/app/pages/snow/snow.component.spec.ts new file mode 100644 index 0000000..83541b2 --- /dev/null +++ b/src/app/pages/snow/snow.component.spec.ts @@ -0,0 +1,23 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { SnowComponent } from './snow.component'; + +describe('SnowComponent', () => { + let component: SnowComponent; + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + declarations: [ SnowComponent ] + }) + .compileComponents(); + + fixture = TestBed.createComponent(SnowComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/pages/snow/snow.component.ts b/src/app/pages/snow/snow.component.ts new file mode 100644 index 0000000..416bc47 --- /dev/null +++ b/src/app/pages/snow/snow.component.ts @@ -0,0 +1,15 @@ +import { Component, OnInit } from '@angular/core'; + +@Component({ + selector: 'app-snow', + templateUrl: './snow.component.html', + styleUrls: ['./snow.component.scss'] +}) +export class SnowComponent implements OnInit { + + constructor() { } + + ngOnInit(): void { + } + +} diff --git a/src/app/services/api-chat.service.ts b/src/app/services/api-chat.service.ts index de5d9f4..b658749 100644 --- a/src/app/services/api-chat.service.ts +++ b/src/app/services/api-chat.service.ts @@ -2,7 +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 { Board } from "../models/boards"; import * as globals from '../const/api'; @@ -44,8 +44,8 @@ export class ApiChatService { } - createThread(OPtext: string, OPimgUrl: string[], board: string,){ - return alert("Скоро будет работать!"); + sendThreadToApi(OPtext: string, OPimgUrl: string[], board: string,){ + return alert("Попытка создания тред с оп-постом " + OPtext + " на доске " + board); } sampleBoardList = [ diff --git a/src/styles.css b/src/styles.css index 6d32fc9..ad3f39a 100644 --- a/src/styles.css +++ b/src/styles.css @@ -39,4 +39,5 @@ } body { background-color: #eee; + overflow: hidden; } \ No newline at end of file