diff --git a/angular.json b/angular.json index e0585de38c05f6b5ccec49729f8b0d3e24ad9fd1..51e7d1a809baf81a7395db004183dab18e9fb2c5 100644 --- a/angular.json +++ b/angular.json @@ -21,20 +21,14 @@ "base": "dist/twitch-poll" }, "index": "src/index.html", - "polyfills": [ - "zone.js" - ], + "polyfills": ["zone.js"], "tsConfig": "tsconfig.app.json", "inlineStyleLanguage": "scss", - "assets": [ - "src/favicon.ico", - "src/assets" - ], - "styles": [ - "src/styles.scss" - ], + "assets": ["src/favicon.ico", "src/assets"], + "styles": ["src/styles.scss"], "scripts": [], - "browser": "src/main.ts" + "browser": "src/main.ts", + "allowedCommonJsDependencies": ["tmi.js"] }, "configurations": { "production": { @@ -82,19 +76,11 @@ "test": { "builder": "@angular-devkit/build-angular:karma", "options": { - "polyfills": [ - "zone.js", - "zone.js/testing" - ], + "polyfills": ["zone.js", "zone.js/testing"], "tsConfig": "tsconfig.spec.json", "inlineStyleLanguage": "scss", - "assets": [ - "src/favicon.ico", - "src/assets" - ], - "styles": [ - "src/styles.scss" - ], + "assets": ["src/favicon.ico", "src/assets"], + "styles": ["src/styles.scss"], "scripts": [] } } diff --git a/src/app/app.component.html b/src/app/app.component.html index 7330f9524ccd56ddcff1e8f32fa583563ad3a5d8..383aecfbde20dca829a9e368dc66be73c6566f51 100644 --- a/src/app/app.component.html +++ b/src/app/app.component.html @@ -28,7 +28,7 @@ <label> <span class="number">{{ index + 1 }} :</span> <input [(ngModel)]="response.label" /> </label> - <button (click)="removeResponses(index)" [disabled]="start">×</button> + <button (click)="removeResponses(index)" [disabled]="start()">×</button> </div> } <div class="add"> @@ -43,25 +43,25 @@ <div>Votes par personne</div> <label> <span>Pas sub : </span - ><input [(ngModel)]="poll.options.userWeight.user" [disabled]="start" /> + ><input [(ngModel)]="poll.options.userWeight.user" [disabled]="start()" /> </label> <label> <span>Sub : </span - ><input [(ngModel)]="poll.options.userWeight.subscriber" [disabled]="start" /> + ><input [(ngModel)]="poll.options.userWeight.subscriber" [disabled]="start()" /> </label> <label> <span>VIP : </span - ><input [(ngModel)]="poll.options.userWeight.vip" [disabled]="start" /> + ><input [(ngModel)]="poll.options.userWeight.vip" [disabled]="start()" /> </label> <label> <span>Streameur : </span - ><input [(ngModel)]="poll.options.userWeight.broadcaster" [disabled]="start" /> + ><input [(ngModel)]="poll.options.userWeight.broadcaster" [disabled]="start()" /> </label> </div> <div class="max-vote"> <label> <span>Votes max : </span - ><input [(ngModel)]="poll.options.acceptVotesByUser" [disabled]="start" /> + ><input [(ngModel)]="poll.options.acceptVotesByUser" [disabled]="start()" /> </label> <div class="info">(0 = infini)</div> </div> @@ -69,15 +69,15 @@ </div> <div class="start"> <p> - @if (!start) { - <button (click)="startReading()">Démarrer</button> - } - @if (start) { + @if (start()) { <button (click)="stopReading()">Stop</button> + } @else { + <button (click)="startReading()">Démarrer</button> } + <button (click)="reInit()">Réinitialisation</button> </p> </div> - @if (stop && total) { + @if (stop() && total) { <div class="options"> <label> Garder les @@ -91,9 +91,9 @@ </div> } </section> - @if (showPoll && poll) { + @if (showPoll() && poll) { <section class="render"> - <div class="view" [class.stop]="stop"> + <div class="view" [class.stop]="stop()"> <h3> {{ poll.question }} </h3> diff --git a/src/app/app.component.ts b/src/app/app.component.ts index 66c768cda3185a9002b0a03fce2a2ac4f15ba33c..f0c9b775046f4b2d3101ddd8af6cb87cc9b681c3 100644 --- a/src/app/app.component.ts +++ b/src/app/app.component.ts @@ -1,7 +1,9 @@ -import { Component } from '@angular/core'; +import { Component, signal } from '@angular/core'; import { ChatUserstate, Client } from 'tmi.js'; import { Choice, Message, Poll, Status, User } from './interface'; -const tmi = require('tmi.js'); +import('tmi.js'); +declare const tmi: any; + const version = require('../../package.json').version; @Component({ @@ -23,12 +25,12 @@ export class AppComponent { client?: Client; poll?: Poll; - showPoll = false; + showPoll = signal(false); - start = false; - stop = false; + start = signal(false); + stop = signal(false); - betterSize = 2; + betterSize = signal(2); disconnect() { if (window.confirm('Êtes-vous sûr de déconnecter la chaîne ?')) { @@ -79,17 +81,21 @@ export class AppComponent { this.poll?.responses.push({ label: '' }); } + reInit() { + this.resetStatus(); + } + startReading() { this.client?.on('message', (channel, tags, message, self) => this.log(channel, tags, message, self)); - this.start = true; - this.stop = false; - this.showPoll = true; + this.start.set(true); + this.stop.set(false); + this.showPoll.set(true); } stopReading() { this.client?.removeAllListeners('message'); - this.start = false; - this.stop = true; + this.start.set(false); + this.stop.set(true); } betterLine() { @@ -105,7 +111,7 @@ export class AppComponent { } }); - while (this.poll!.responses.length > this.betterSize) { + while (this.poll!.responses.length > this.betterSize()) { let min: number; let minKey = ''; @@ -125,8 +131,8 @@ export class AppComponent { } resetStatus() { - this.start = false; - this.stop = false; + this.start.set(false); + this.stop.set(false); this.choices = {}; this.messages = []; this.users = []; diff --git a/tsconfig.json b/tsconfig.json index 4ec7ddc8deadd47f0cc82c35dab1b4b83861597b..26ad6da0988dcbbcd7188beb454f0f1c29a2546b 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -19,10 +19,7 @@ "target": "ES2022", "module": "ES2022", "useDefineForClassFields": false, - "lib": [ - "ES2022", - "dom" - ] + "lib": ["ES2022", "dom"] }, "angularCompilerOptions": { "enableI18nLegacyMessageIdFormat": false,