[DEV] migration angular17 (not tested)
This commit is contained in:
parent
4b002aaee4
commit
48ad545da1
22568
front/package-lock.json
generated
22568
front/package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@ -10,32 +10,35 @@
|
||||
"test": "ng test",
|
||||
"lint": "ng lint",
|
||||
"style": "prettier --write .",
|
||||
"e2e": "ng e2e"
|
||||
"e2e": "ng e2e",
|
||||
"update_packages": "ncu --upgrade",
|
||||
"install_dependency": "npm install"
|
||||
},
|
||||
"private": true,
|
||||
"dependencies": {
|
||||
"@angular/animations": "^14.2.10",
|
||||
"@angular/cdk": "^14.2.7",
|
||||
"@angular/common": "^14.2.10",
|
||||
"@angular/compiler": "^14.2.10",
|
||||
"@angular/core": "^14.2.10",
|
||||
"@angular/forms": "^14.2.10",
|
||||
"@angular/material": "^14.2.7",
|
||||
"@angular/platform-browser": "^14.2.10",
|
||||
"@angular/platform-browser-dynamic": "^14.2.10",
|
||||
"@angular/router": "^14.2.10",
|
||||
"rxjs": "^7.5.7",
|
||||
"zone.js": "^0.12.0"
|
||||
"@angular/animations": "^17.2.0",
|
||||
"@angular/cdk": "^17.1.2",
|
||||
"@angular/common": "^17.2.0",
|
||||
"@angular/compiler": "^17.2.0",
|
||||
"@angular/core": "^17.2.0",
|
||||
"@angular/forms": "^17.2.0",
|
||||
"@angular/material": "^17.1.2",
|
||||
"@angular/platform-browser": "^17.2.0",
|
||||
"@angular/platform-browser-dynamic": "^17.2.0",
|
||||
"@angular/router": "^17.2.0",
|
||||
"rxjs": "^7.8.1",
|
||||
"zone.js": "^0.14.4"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@angular-devkit/build-angular": "^14.2.9",
|
||||
"@angular-eslint/builder": "14.2.0",
|
||||
"@angular-eslint/eslint-plugin": "14.2.0",
|
||||
"@angular-eslint/eslint-plugin-template": "14.2.0",
|
||||
"@angular-eslint/schematics": "14.2.0",
|
||||
"@angular-eslint/template-parser": "14.2.0",
|
||||
"@angular/cli": "^14.2.9",
|
||||
"@angular/compiler-cli": "^14.2.10",
|
||||
"@angular/language-service": "^14.2.10"
|
||||
"@angular-devkit/build-angular": "^17.2.0",
|
||||
"@angular-eslint/builder": "17.2.1",
|
||||
"@angular-eslint/eslint-plugin": "17.2.1",
|
||||
"@angular-eslint/eslint-plugin-template": "17.2.1",
|
||||
"@angular-eslint/schematics": "17.2.1",
|
||||
"@angular-eslint/template-parser": "17.2.1",
|
||||
"@angular/cli": "^17.2.0",
|
||||
"@angular/compiler-cli": "^17.2.0",
|
||||
"@angular/language-service": "^17.2.0",
|
||||
"npm-check-updates": "^16.14.15"
|
||||
}
|
||||
}
|
||||
@ -2,10 +2,13 @@
|
||||
<!-- Generig global menu -->
|
||||
<app-top-menu [menu]="currentMenu" (callback)="eventOnMenu($event)"></app-top-menu>
|
||||
<!-- all interfaced pages -->
|
||||
<div class="main-content" *ngIf="autoConnectedDone">
|
||||
@if(autoConnectedDone) {
|
||||
<div class="main-content">
|
||||
<router-outlet ></router-outlet>
|
||||
</div>
|
||||
<div class="main-content" *ngIf="!autoConnectedDone">
|
||||
}
|
||||
@else {
|
||||
<div class="main-content">
|
||||
<div class="generic-page">
|
||||
<div class="fill-all colomn_mutiple">
|
||||
<b style="color:red;">Auto-connection in progress</b>
|
||||
@ -13,3 +16,4 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
@ -1,19 +1,26 @@
|
||||
|
||||
<div class="imgContainer-small">
|
||||
<div *ngIf="covers">
|
||||
@if(covers) {
|
||||
<div>
|
||||
<!--<data-image id="{{cover}}"></data-image>-->
|
||||
<img src="{{covers[0]}}"/>
|
||||
</div>
|
||||
<div *ngIf="!covers" class="noImage">
|
||||
|
||||
}
|
||||
@else {
|
||||
<div class="noImage">
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
<div class="season-small">
|
||||
Season {{numberSeason}}
|
||||
</div>
|
||||
<div class="description-small" *ngIf="count > 1">
|
||||
{{count}} Episodes
|
||||
@if(count > 0) {
|
||||
<div class="description-small">
|
||||
{{count}} épisode{{count > 1?"s":""}}
|
||||
</div>
|
||||
<div class="description-small" *ngIf="count == 1">
|
||||
{{count}} Episode
|
||||
}
|
||||
@else {
|
||||
<div class="description-small">
|
||||
Aucun épisode
|
||||
</div>
|
||||
}
|
||||
@ -1,24 +1,24 @@
|
||||
<div>
|
||||
<div class="count-base">
|
||||
<div class="count" *ngIf="countvideo">
|
||||
@if(countvideo) {
|
||||
<div class="count">
|
||||
{{countvideo}}
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
<div class="imgContainer-small">
|
||||
<div *ngIf="covers">
|
||||
@if(covers) {
|
||||
<div>
|
||||
<!--<data-image id="{{cover}}"></data-image>-->
|
||||
<img src="{{covers[0]}}"/>
|
||||
</div>
|
||||
<div *ngIf="!covers" class="noImage">
|
||||
|
||||
}
|
||||
@else {
|
||||
<div class="noImage">
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
<div class="title-small">
|
||||
{{name}}
|
||||
</div>
|
||||
<!--
|
||||
<div class="description-small" *ngIf="description">
|
||||
{{description}}
|
||||
</div>
|
||||
-->
|
||||
</div>
|
||||
@ -1,18 +1,24 @@
|
||||
<div>
|
||||
<div class="count-base">
|
||||
<span class="count" *ngIf="countvideo">
|
||||
@if(countvideo) {
|
||||
<span class="count">
|
||||
{{countvideo}}
|
||||
</span>
|
||||
}
|
||||
</div>
|
||||
<div class="imgContainer-small">
|
||||
<div *ngIf="covers">
|
||||
@if(covers) {
|
||||
<div>
|
||||
<img src="{{covers[0]}}" class="miniature-small"/>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
<div class="title-small">
|
||||
{{name}}
|
||||
</div>
|
||||
<div class="description-small" *ngIf="description">
|
||||
@if(description) {
|
||||
<div class="description-small">
|
||||
{{description}}
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
@ -1,28 +1,31 @@
|
||||
<div>
|
||||
<div class="count-base">
|
||||
<span class="views" *ngIf="advancement">
|
||||
@if(advancement) {
|
||||
<span class="views">
|
||||
{{advancement.count}}
|
||||
</span>
|
||||
}
|
||||
</div>
|
||||
<div class="videoImgContainer">
|
||||
<div *ngIf="covers">
|
||||
@if(covers) {
|
||||
<div>
|
||||
<!--<data-image id="{{cover}}"></data-image>-->
|
||||
<img src="{{covers[0]}}" />
|
||||
</div>
|
||||
<div *ngIf="!covers" class="noImage">
|
||||
}
|
||||
@else {
|
||||
<div class="noImage">
|
||||
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
<div class="view-progess" [ngStyle]="updateAdvancement()"></div>
|
||||
<div class="title-small" *ngIf="data">
|
||||
<div class="title-small">
|
||||
@if(data) {
|
||||
{{episodeDisplay}} {{name}}
|
||||
</div>
|
||||
<div class="title-small" *ngIf="!data">
|
||||
}
|
||||
@else {
|
||||
Error media: {{element?.id}}
|
||||
}
|
||||
</div>
|
||||
<!--
|
||||
<div class="description-small" *ngIf="description">
|
||||
{{description}}
|
||||
</div>
|
||||
-->
|
||||
</div>
|
||||
@ -3,9 +3,11 @@
|
||||
Karideo
|
||||
</div>
|
||||
<div class="fill-all colomn_mutiple">
|
||||
<div *ngFor="let data of dataList" class="item-home" (click)="onSelectType($event, data.id)" (auxclick)="onSelectType($event, data.id)">
|
||||
@for (data of dataList; track data.id;) {
|
||||
<div class="item-home" (click)="onSelectType($event, data.id)" (auxclick)="onSelectType($event, data.id)">
|
||||
<app-element-type [element]="data"></app-element-type>
|
||||
</div>
|
||||
}
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
</div>
|
||||
@ -2,21 +2,26 @@
|
||||
<div class="title">
|
||||
Edit season
|
||||
</div>
|
||||
<div class="fill-all" *ngIf="itemIsRemoved">
|
||||
@if(itemIsRemoved) {
|
||||
<div class="fill-all">
|
||||
<div class="message-big">
|
||||
<br/><br/><br/>
|
||||
The season has been removed
|
||||
<br/><br/><br/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="fill-all" *ngIf="itemIsNotFound">
|
||||
}
|
||||
@else if (itemIsNotFound){
|
||||
<div class="fill-all">
|
||||
<div class="message-big">
|
||||
<br/><br/><br/>
|
||||
The season does not exist
|
||||
<br/><br/><br/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="fill-all" *ngIf="itemIsLoading">
|
||||
}
|
||||
@else if (itemIsLoading){
|
||||
<div class="fill-all">
|
||||
<div class="message-big">
|
||||
<br/><br/><br/>
|
||||
Loading ...<br/>
|
||||
@ -24,7 +29,9 @@
|
||||
<br/><br/><br/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="fill-all" *ngIf="!itemIsRemoved && !itemIsNotFound && !itemIsLoading">
|
||||
}
|
||||
@else {
|
||||
<div class="fill-all">
|
||||
<div class="request_raw">
|
||||
<div class="label">
|
||||
Number:
|
||||
@ -54,10 +61,10 @@
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
<!-- ------------------------- Cover section --------------------------------- -->
|
||||
<div class="title" *ngIf="!itemIsRemoved && !itemIsNotFound && !itemIsLoading">
|
||||
<div class="title">
|
||||
Covers
|
||||
</div>
|
||||
<div class="fill-all" *ngIf="!itemIsRemoved && !itemIsNotFound && !itemIsLoading">
|
||||
<div class="fill-all">
|
||||
<div class="hide-element">
|
||||
<input type="file"
|
||||
#fileInput
|
||||
@ -67,16 +74,18 @@
|
||||
</div>
|
||||
<div class="request_raw">
|
||||
<div class="input">
|
||||
<div class="cover" *ngFor="let element of coversDisplay">
|
||||
@for (data of coversDisplay; track data.id;) {
|
||||
<div class="cover" >
|
||||
<div class="cover-image">
|
||||
<img src="{{element.url}}"/>
|
||||
<img src="{{data.url}}"/>
|
||||
</div>
|
||||
<div class="cover-button">
|
||||
<button (click)="removeCover(element.id)">
|
||||
<button (click)="removeCover(data.id)">
|
||||
<i class="material-icons button-remove">highlight_off</i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
<div class="cover">
|
||||
<div class="cover-no-image">
|
||||
</div>
|
||||
@ -91,10 +100,10 @@
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
<!-- ------------------------- ADMIN section --------------------------------- -->
|
||||
<div class="title" *ngIf="!itemIsRemoved && !itemIsNotFound && !itemIsLoading">
|
||||
<div class="title">
|
||||
Administration
|
||||
</div>
|
||||
<div class="fill-all" *ngIf="!itemIsRemoved && !itemIsNotFound && !itemIsLoading">
|
||||
<div class="fill-all">
|
||||
<div class="request_raw">
|
||||
<div class="label">
|
||||
<i class="material-icons">data_usage</i> ID:
|
||||
@ -117,17 +126,22 @@
|
||||
<div class="label">
|
||||
<i class="material-icons">delete_forever</i> Trash:
|
||||
</div>
|
||||
<div class="input" *ngIf="(videoCount == '0')">
|
||||
@if(videoCount == '0') {
|
||||
<div class="input">
|
||||
<button class="button color-button-cancel color-shadow-black" (click)="removeItem()" type="submit">
|
||||
<i class="material-icons">delete</i> Remove season
|
||||
</button>
|
||||
</div>
|
||||
<div class="input" *ngIf="(videoCount != '0')">
|
||||
}
|
||||
@else {
|
||||
<div class="input">
|
||||
<i class="material-icons">new_releases</i> Can not remove season, video depending on it
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
<upload-progress [mediaTitle]="upload.labelMediaTitle"
|
||||
[mediaUploaded]="upload.mediaSendSize"
|
||||
|
||||
@ -1,29 +1,36 @@
|
||||
<div class="generic-page">
|
||||
<div class="fill-title colomn_mutiple">
|
||||
<div class="cover-area">
|
||||
<div class="cover" *ngIf="cover != null" >
|
||||
@if(cover) {
|
||||
<div class="cover">
|
||||
<img src="{{cover}}"/>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
<div [className]="cover != null ? 'description-area description-area-cover' : 'description-area description-area-no-cover'">
|
||||
<div *ngIf="seriesName" class="title">
|
||||
@if(seriesName) {
|
||||
<div class="title">
|
||||
{{seriesName}}
|
||||
</div>
|
||||
}
|
||||
<div class="sub-title-main">
|
||||
Season {{name}}
|
||||
</div>
|
||||
<div class="description" *ngIf="description">
|
||||
@if(description) {
|
||||
<div class="description">
|
||||
{{description}}
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
<div class="fill-content colomn_mutiple">
|
||||
<div class="clear"></div>
|
||||
<div class="title" *ngIf="videos.length > 1">Videos:</div>
|
||||
<div class="title" *ngIf="videos.length == 1">Video:</div>
|
||||
<div *ngFor="let data of videos" class="item item-video" (click)="onSelectVideo($event, data.id)" (auxclick)="onSelectVideo($event, data.id)">
|
||||
<div class="title">Video{{videos.length > 1?"s":""}}:</div>
|
||||
@for (data of videos; track data.id;) {
|
||||
<div class="item item-video" (click)="onSelectVideo($event, data.id)" (auxclick)="onSelectVideo($event, data.id)">
|
||||
<app-element-video [element]="data"></app-element-video>
|
||||
</div>
|
||||
}
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
</div>
|
||||
@ -2,21 +2,26 @@
|
||||
<div class="title">
|
||||
Edit series
|
||||
</div>
|
||||
<div class="fill-all" *ngIf="itemIsRemoved">
|
||||
@if(itemIsRemoved) {
|
||||
<div class="fill-all">
|
||||
<div class="message-big">
|
||||
<br/><br/><br/>
|
||||
The series has been removed
|
||||
<br/><br/><br/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="fill-all" *ngIf="itemIsNotFound">
|
||||
}
|
||||
@else if(itemIsNotFound) {
|
||||
<div class="fill-all">
|
||||
<div class="message-big">
|
||||
<br/><br/><br/>
|
||||
The series does not exist
|
||||
<br/><br/><br/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="fill-all" *ngIf="itemIsLoading">
|
||||
}
|
||||
@else if(itemIsLoading) {
|
||||
<div class="fill-all">
|
||||
<div class="message-big">
|
||||
<br/><br/><br/>
|
||||
Loading ...<br/>
|
||||
@ -24,7 +29,9 @@
|
||||
<br/><br/><br/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="fill-all" *ngIf="!itemIsRemoved && !itemIsNotFound && !itemIsLoading">
|
||||
}
|
||||
@else {
|
||||
<div class="fill-all">
|
||||
<div class="request_raw">
|
||||
<div class="label">
|
||||
Type:
|
||||
@ -32,7 +39,9 @@
|
||||
<div class="input">
|
||||
<select [ngModel]="typeId"
|
||||
(ngModelChange)="onChangeType($event)">
|
||||
<option *ngFor="let element of listType" [ngValue]="element.value">{{element.label}}</option>
|
||||
@for (data of listType; track data.value;) {
|
||||
<option [ngValue]="data.value">{{data.label}}</option>
|
||||
}
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
@ -66,10 +75,10 @@
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
<!-- ------------------------- Cover section --------------------------------- -->
|
||||
<div class="title" *ngIf="!itemIsRemoved && !itemIsNotFound && !itemIsLoading">
|
||||
<div class="title">
|
||||
Covers
|
||||
</div>
|
||||
<div class="fill-all" *ngIf="!itemIsRemoved && !itemIsNotFound && !itemIsLoading">
|
||||
<div class="fill-all">
|
||||
<div class="hide-element">
|
||||
<input type="file"
|
||||
#fileInput
|
||||
@ -79,16 +88,18 @@
|
||||
</div>
|
||||
<div class="request_raw">
|
||||
<div class="input">
|
||||
<div class="cover" *ngFor="let element of coversDisplay">
|
||||
@for (data of coversDisplay; track data.id;) {
|
||||
<div class="cover">
|
||||
<div class="cover-image">
|
||||
<img src="{{element.url}}"/>
|
||||
<img src="{{data.url}}"/>
|
||||
</div>
|
||||
<div class="cover-button">
|
||||
<button (click)="removeCover(element.id)">
|
||||
<button (click)="removeCover(data.id)">
|
||||
<i class="material-icons button-remove">highlight_off</i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
<div class="cover">
|
||||
<div class="cover-no-image">
|
||||
</div>
|
||||
@ -103,10 +114,10 @@
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
<!-- ------------------------- ADMIN section --------------------------------- -->
|
||||
<div class="title" *ngIf="!itemIsRemoved && !itemIsNotFound && !itemIsLoading">
|
||||
<div class="title">
|
||||
Administration
|
||||
</div>
|
||||
<div class="fill-all" *ngIf="!itemIsRemoved && !itemIsNotFound && !itemIsLoading">
|
||||
<div class="fill-all">
|
||||
<div class="request_raw">
|
||||
<div class="label">
|
||||
<i class="material-icons">data_usage</i> ID:
|
||||
@ -138,17 +149,22 @@
|
||||
<div class="label">
|
||||
<i class="material-icons">delete_forever</i> Trash:
|
||||
</div>
|
||||
<div class="input" *ngIf="(videoCount == '0' && seasonsCount == '0')">
|
||||
@if(videoCount == '0' && seasonsCount == '0') {
|
||||
<div class="input">
|
||||
<button class="button color-button-cancel color-shadow-black" (click)="removeItem()" type="submit">
|
||||
<i class="material-icons">delete</i> Remove Series
|
||||
</button>
|
||||
</div>
|
||||
<div class="input" *ngIf="(videoCount != '0' || seasonsCount != '0')">
|
||||
}
|
||||
@else {
|
||||
<div class="input">
|
||||
<i class="material-icons">new_releases</i> Can not remove season or video depending on it
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
|
||||
<upload-progress [mediaTitle]="upload.labelMediaTitle"
|
||||
|
||||
@ -1,34 +1,44 @@
|
||||
<div class="generic-page">
|
||||
<div class="fill-title colomn_mutiple">
|
||||
<div class="cover-area">
|
||||
<div class="cover" *ngIf="cover != null" >
|
||||
@if(cover) {
|
||||
<div class="cover" >
|
||||
<img src="{{cover}}"/>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
<div [className]="cover != null ? 'description-area description-area-cover' : 'description-area description-area-no-cover'">
|
||||
<div class="title">
|
||||
{{name}}
|
||||
</div>
|
||||
<div class="description" *ngIf="description">
|
||||
@if(description) {
|
||||
<div class="description">
|
||||
{{description}}
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
<div class="fill-content colomn_mutiple" *ngIf="seasons.length != 0">
|
||||
@if(seasons.length != 0) {
|
||||
<div class="fill-content colomn_mutiple">
|
||||
<div class="clear"></div>
|
||||
<div class="title" *ngIf="seasons.length > 1">Seasons:</div>
|
||||
<div class="title" *ngIf="seasons.length == 1">Season:</div>
|
||||
<div *ngFor="let data of seasons" class="item-list" (click)="onSelectSeason($event, data.id)" (auxclick)="onSelectSeason($event, data.id)">
|
||||
<div class="title">Season{{seasons.length > 1?"s":""}}:</div>
|
||||
@for (data of seasons; track data.id;) {
|
||||
<div class="item-list" (click)="onSelectSeason($event, data.id)" (auxclick)="onSelectSeason($event, data.id)">
|
||||
<app-element-season [element]="data"></app-element-season>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
<div class="fill-content colomn_mutiple" *ngIf="videos.length != 0">
|
||||
}
|
||||
@if(videos.length != 0) {
|
||||
<div class="fill-content colomn_mutiple">
|
||||
<div class="clear"></div>
|
||||
<div class="title" *ngIf="videos.length > 1">Videos:</div>
|
||||
<div class="title" *ngIf="videos.length == 1">Video:</div>
|
||||
<div *ngFor="let data of videos" class="item item-video" (click)="onSelectVideo($event, data.id)" (auxclick)="onSelectVideo($event, data.id)">
|
||||
<div class="title">Video{{videos.length > 1?"s":""}}:</div>
|
||||
@for (data of videos; track data.id;) {
|
||||
<div class="item item-video" (click)="onSelectVideo($event, data.id)" (auxclick)="onSelectVideo($event, data.id)">
|
||||
<app-element-video [element]="data"></app-element-video>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
}
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
@ -1,30 +1,38 @@
|
||||
<div class="generic-page">
|
||||
<div class="fill-title colomn_mutiple">
|
||||
<div class="cover-area">
|
||||
<div class="cover" *ngIf="cover != null" >
|
||||
@if(cover) {
|
||||
<div class="cover" >
|
||||
<img src="{{cover}}"/>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
<div [className]="cover != null ? 'description-area description-area-cover' : 'description-area description-area-no-cover'">
|
||||
<div class="title">
|
||||
{{name}}
|
||||
</div>
|
||||
<div class="description" *ngIf="description">
|
||||
@if(description) {
|
||||
<div class="description">
|
||||
{{description}}
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
<div class="fill-content colomn_mutiple">
|
||||
<div class="clear"></div>
|
||||
<div *ngFor="let data of series" class="item" (click)="onSelectSeries($event, data.id)" (auxclick)="onSelectSeries($event, data.id)">
|
||||
@for (data of series; track data.id;) {
|
||||
<div class="item" (click)="onSelectSeries($event, data.id)" (auxclick)="onSelectSeries($event, data.id)">
|
||||
<app-element-series [element]="data"></app-element-series>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
<div class="fill-content colomn_mutiple">
|
||||
<div class="clear"></div>
|
||||
<div *ngFor="let data of videos" class="item item-video" (click)="onSelectVideo($event, data.id)" (auxclick)="onSelectVideo($event, data.id)">
|
||||
@for (data of videos; track data.id;) {
|
||||
<div class="item item-video" (click)="onSelectVideo($event, data.id)" (auxclick)="onSelectVideo($event, data.id)">
|
||||
<app-element-video [element]="data"></app-element-video>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
@ -32,12 +32,12 @@
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<div *ngIf="this.parsedElement.length !== 0" class="title">
|
||||
@if(parsedElement.length !== 0) {
|
||||
<div class="title">
|
||||
Meta-data:
|
||||
</div>
|
||||
<div class="clear"><br/></div>
|
||||
<div *ngIf="this.parsedElement.length !== 0" class="fill-all">
|
||||
<div class="fill-all">
|
||||
<div class="request_raw_table">
|
||||
<table>
|
||||
<colgroup>
|
||||
@ -52,7 +52,9 @@
|
||||
<select [ngModel]="typeId"
|
||||
(ngModelChange)="onChangeType($event)"
|
||||
[class.error]="typeId === undefined">
|
||||
<option *ngFor="let element of listType" [ngValue]="element.value">{{element.label}}</option>
|
||||
@for (data of listType; track data.value;) {
|
||||
<option [ngValue]="data.value">{{data.label}}</option>
|
||||
}
|
||||
</select>
|
||||
</td>
|
||||
</tr>
|
||||
@ -71,7 +73,9 @@
|
||||
<td class="right-colomn">
|
||||
<select [ngModel]="seriesId"
|
||||
(ngModelChange)="onChangeSeries($event)">
|
||||
<option *ngFor="let element of listSeries" [ngValue]="element.value">{{element.label}}</option>
|
||||
@for (data of listSeries; track data.value;) {
|
||||
<option [ngValue]="data.value">{{data.label}}</option>
|
||||
}
|
||||
</select>
|
||||
</td>
|
||||
<td class="tool-colomn">
|
||||
@ -111,7 +115,8 @@
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr *ngFor="let data of this.parsedElement">
|
||||
@for (data of parsedElement; track data.id;) {
|
||||
<tr>
|
||||
<td class="left-colomn">
|
||||
<input type="number"
|
||||
pattern="[0-9]{0-4}"
|
||||
@ -128,9 +133,11 @@
|
||||
(input)="onTitle(data, $event.target.value)"
|
||||
[class.error]="data.title === ''"
|
||||
/>
|
||||
<span *ngIf="data.nameDetected === true" class="error">
|
||||
@if(data.nameDetected === true) {
|
||||
<span class="error">
|
||||
^^^This title already exist !!!
|
||||
</span>
|
||||
}
|
||||
</td>
|
||||
<td class="tool-colomn" >
|
||||
<button class="button color-button-cancel color-shadow-black"
|
||||
@ -141,6 +148,7 @@
|
||||
</button>
|
||||
</td>
|
||||
</tr>
|
||||
}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
@ -154,7 +162,8 @@
|
||||
</button>
|
||||
</div>
|
||||
<div class="clear"></div>
|
||||
<div class="request_raw_table" *ngIf="this.listFileInBdd !== undefined">
|
||||
@if(listFileInBdd !== undefined) {
|
||||
<div class="request_raw_table">
|
||||
<table>
|
||||
<colgroup>
|
||||
<col style="width:10%">
|
||||
@ -168,15 +177,18 @@
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr *ngFor="let data of this.listFileInBdd">
|
||||
@for (data of listFileInBdd; track data.id;) {
|
||||
<tr>
|
||||
<td class="left-colomn" [class.error]="data.episodeDetected === true">{{data.episode}}</td>
|
||||
<td class="right-colomn" [class.error]="data.nameDetected === true">{{data.name}}</td>
|
||||
</tr>
|
||||
}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
<div *ngIf="this.parsedElement.length !== 0" class="fill-all">
|
||||
<div class="fill-all">
|
||||
<div class="request_raw_table">
|
||||
<table>
|
||||
<colgroup>
|
||||
@ -184,24 +196,19 @@
|
||||
<col style="width:80%">
|
||||
</colgroup>
|
||||
<tbody>
|
||||
<!-- no need
|
||||
<tr *ngFor="let data of this.parsedElement">
|
||||
<td class="left-colomn">Keep:</td>
|
||||
<td class="right-colomn">
|
||||
{{data.file.name}}
|
||||
</td>
|
||||
</tr>
|
||||
-->
|
||||
<tr *ngFor="let data of this.parsedFailedElement">
|
||||
@for (data of parsedFailedElement; track data.file;) {
|
||||
<tr>
|
||||
<td class="left-colomn">Rejected:</td>
|
||||
<td class="right-colomn">
|
||||
{{data.file.name}}<br/> ==> {{data.reason}}
|
||||
</td>
|
||||
</tr>
|
||||
}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
<upload-progress [mediaTitle]="upload.labelMediaTitle"
|
||||
[mediaUploaded]="upload.mediaSendSize"
|
||||
|
||||
@ -23,6 +23,7 @@ export class FileParsedElement {
|
||||
public nameDetected: boolean = false;
|
||||
public episodeDetected: boolean = false;
|
||||
constructor(
|
||||
public id: number,
|
||||
public file: File,
|
||||
public series: string,
|
||||
public season: number,
|
||||
@ -55,7 +56,7 @@ export class UploadScene implements OnInit {
|
||||
saisonId: number = null;
|
||||
needSend: boolean = false;
|
||||
|
||||
// list of all files already registered in the bdd to compare with the curent list of files.
|
||||
// list of all files already registered in the bdd to compare with the current list of files.
|
||||
listFileInBdd: any = null;
|
||||
|
||||
// section tha define the upload value to display in the pop-in of upload
|
||||
@ -304,7 +305,7 @@ export class UploadScene implements OnInit {
|
||||
}
|
||||
// remove extention
|
||||
title = title.replace(new RegExp('\\.(mkv|MKV|Mkv|webm|WEBM|Webm|mp4)'), '');
|
||||
let tmp = new FileParsedElement(file, series, season, episode, title);
|
||||
let tmp = new FileParsedElement(this.parsedElement.length, file, series, season, episode, title);
|
||||
console.log(`==>${JSON.stringify(tmp)}`);
|
||||
// add it in the list.
|
||||
this.parsedElement.push(tmp);
|
||||
|
||||
@ -2,21 +2,26 @@
|
||||
<div class="title">
|
||||
Edit Media
|
||||
</div>
|
||||
<div class="fill-all" *ngIf="itemIsRemoved">
|
||||
@if(itemIsRemoved) {
|
||||
<div class="fill-all">
|
||||
<div class="message-big">
|
||||
<br/><br/><br/>
|
||||
The media has been removed
|
||||
<br/><br/><br/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="fill-all" *ngIf="itemIsNotFound">
|
||||
}
|
||||
@else if(itemIsNotFound) {
|
||||
<div class="fill-all">
|
||||
<div class="message-big">
|
||||
<br/><br/><br/>
|
||||
The media does not exist
|
||||
<br/><br/><br/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="fill-all" *ngIf="itemIsLoading">
|
||||
}
|
||||
@else if(itemIsLoading) {
|
||||
<div class="fill-all">
|
||||
<div class="message-big">
|
||||
<br/><br/><br/>
|
||||
Loading ...<br/>
|
||||
@ -24,8 +29,9 @@
|
||||
<br/><br/><br/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="fill-all" *ngIf="!itemIsRemoved && !itemIsNotFound && !itemIsLoading">
|
||||
}
|
||||
@else {
|
||||
<div class="fill-all">
|
||||
<div class="request_raw">
|
||||
<div class="label">
|
||||
Title:
|
||||
@ -69,7 +75,9 @@
|
||||
<div class="input">
|
||||
<select [ngModel]="data.typeId"
|
||||
(ngModelChange)="onChangeType($event)">
|
||||
<option *ngFor="let element of listType" [ngValue]="element.value">{{element.label}}</option>
|
||||
@for (data of listType; track data.value;) {
|
||||
<option [ngValue]="data.value">{{data.label}}</option>
|
||||
}
|
||||
</select>
|
||||
</div>
|
||||
<div class="input_add">
|
||||
@ -85,7 +93,9 @@
|
||||
<div class="input">
|
||||
<select [ngModel]="data.seriesId"
|
||||
(ngModelChange)="onChangeSeries($event)">
|
||||
<option *ngFor="let element of listSeries" [ngValue]="element.value">{{element.label}}</option>
|
||||
@for (data of listSeries; track data.value;) {
|
||||
<option [ngValue]="data.value">{{data.label}}</option>
|
||||
}
|
||||
</select>
|
||||
</div>
|
||||
<div class="input_add">
|
||||
@ -101,7 +111,9 @@
|
||||
<div class="input">
|
||||
<select [ngModel]="data.seasonId"
|
||||
(ngModelChange)="onChangeSeason($event)">
|
||||
<option *ngFor="let element of listSeason" [ngValue]="element.value">{{element.label}}</option>
|
||||
@for (data of listSeason; track data.value;) {
|
||||
<option [ngValue]="data.value">{{data.label}}</option>
|
||||
}
|
||||
</select>
|
||||
</div>
|
||||
<div class="input_add">
|
||||
@ -128,10 +140,10 @@
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
<!-- ------------------------- Cover section --------------------------------- -->
|
||||
<div class="title" *ngIf="!itemIsRemoved && !itemIsNotFound && !itemIsLoading">
|
||||
<div class="title">
|
||||
Covers
|
||||
</div>
|
||||
<div class="fill-all" *ngIf="!itemIsRemoved && !itemIsNotFound && !itemIsLoading">
|
||||
<div class="fill-all">
|
||||
<div class="hide-element">
|
||||
<input type="file"
|
||||
#fileInput
|
||||
@ -141,16 +153,18 @@
|
||||
</div>
|
||||
<div class="request_raw">
|
||||
<div class="input">
|
||||
<div class="cover" *ngFor="let element of coversDisplay">
|
||||
@for (data of coversDisplay; track data.id;) {
|
||||
<div class="cover">
|
||||
<div class="cover-image">
|
||||
<img src="{{element.url}}"/>
|
||||
<img src="{{data.url}}"/>
|
||||
</div>
|
||||
<div class="cover-button">
|
||||
<button (click)="removeCover(element.id)">
|
||||
<button (click)="removeCover(data.id)">
|
||||
<i class="material-icons button-remove">highlight_off</i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
<div class="cover">
|
||||
<div class="cover-no-image">
|
||||
</div>
|
||||
@ -165,10 +179,10 @@
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
<!-- ------------------------- ADMIN section --------------------------------- -->
|
||||
<div class="title" *ngIf="!itemIsRemoved && !itemIsNotFound && !itemIsLoading">
|
||||
<div class="title">
|
||||
Administration
|
||||
</div>
|
||||
<div class="fill-all" *ngIf="!itemIsRemoved && !itemIsNotFound && !itemIsLoading">
|
||||
<div class="fill-all">
|
||||
<div class="request_raw">
|
||||
<div class="label">
|
||||
<i class="material-icons">data_usage</i> ID:
|
||||
@ -190,6 +204,7 @@
|
||||
</div>
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
|
||||
<create-type ></create-type>
|
||||
|
||||
@ -1,69 +1,91 @@
|
||||
<div class="main-reduce">
|
||||
<div class="fill-all" *ngIf="mediaIsNotFound">
|
||||
@if(mediaIsNotFound) {
|
||||
<div class="fill-all">
|
||||
<div class="title">
|
||||
Play media<br /><br /><br /><br /><br />
|
||||
The media does not exist
|
||||
</div>
|
||||
</div>
|
||||
<div class="fill-all" *ngIf="mediaIsLoading">
|
||||
}
|
||||
@else if(mediaIsLoading) {
|
||||
<div class="fill-all">
|
||||
<div class="title">
|
||||
Play media<br /><br /><br /><br /><br />
|
||||
Loading ...<br />
|
||||
Please wait.
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="fill-all" *ngIf="!mediaIsNotFound && !mediaIsLoading && !playVideo">
|
||||
}
|
||||
@else if(!playVideo) {
|
||||
<div class="fill-all">
|
||||
<div class="title">
|
||||
{{name}}
|
||||
</div>
|
||||
<div class="cover-full">
|
||||
<div class="cover">
|
||||
<div class="cover-image" *ngIf="covers">
|
||||
@if(covers) {
|
||||
<div class="cover-image">
|
||||
<img src="{{covers[0]}}" />
|
||||
</div>
|
||||
<div class="cover-no-image" *ngIf="covers"></div>
|
||||
}
|
||||
@else {
|
||||
<div class="cover-no-image"></div>
|
||||
}
|
||||
<div class="cover-button">
|
||||
<button (click)="onRequirePlay()">
|
||||
<i class="material-icons big-button">play_circle_outline</i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="cover-button-next" *ngIf="haveNext !== null">
|
||||
@if(haveNext) {
|
||||
<div class="cover-button-next">
|
||||
<button (click)="onRequireNext($event)" (auxclick)="onRequireNext($event)">
|
||||
<i class="material-icons big-button">arrow_forward_ios</i>
|
||||
</button>
|
||||
</div>
|
||||
<div class="cover-button-previous" *ngIf="havePrevious !== null">
|
||||
}
|
||||
@if(havePrevious) {
|
||||
<div class="cover-button-previous">
|
||||
<button (click)="onRequirePrevious($event)" (auxclick)="onRequirePrevious($event)">
|
||||
<i class="material-icons big-button">arrow_back_ios</i>
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
<div class="clear"></div>
|
||||
<div class="episode" *ngIf="seriesName!=null">
|
||||
@if(seriesName) {
|
||||
<div class="episode">
|
||||
<b>Series:</b> {{seriesName}}
|
||||
</div>
|
||||
<div class="episode" *ngIf="seasonName!=null">
|
||||
}
|
||||
@if(seasonName) {
|
||||
<div class="episode">
|
||||
<b>Season:</b> {{seasonName}}
|
||||
</div>
|
||||
<div class="episode" *ngIf="episode!=null">
|
||||
}
|
||||
@if(episode) {
|
||||
<div class="episode">
|
||||
<b>Episode:</b> {{episode}}
|
||||
</div>
|
||||
}
|
||||
<div class="episode">
|
||||
<b>generatedName:</b> {{generatedName}}
|
||||
</div>
|
||||
<div class="episode" *ngIf="userMetaData">
|
||||
@if(userMetaData) {
|
||||
<div class="episode">
|
||||
<b>Number of view:</b> {{userMetaData.count}}<br />
|
||||
<b>Position:</b> {{userMetaData.percentDisplay}} % ==> {{convertIndisplayTime(userMetaData.time)}}
|
||||
</div>
|
||||
}
|
||||
<div class="description">
|
||||
{{description}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="fill-all bg-black" *ngIf="playVideo">
|
||||
}
|
||||
@else {
|
||||
<div class="fill-all bg-black">
|
||||
<div class="video" #globalVideoElement (mousemove)="startHideTimer()"
|
||||
(fullscreenchange)="onFullscreenChange($event)">
|
||||
(fullscreenchange)="onFullscreenChange()">
|
||||
<div class="video-elem">
|
||||
<video src="{{videoSource}}" #videoPlayer preload (play)="changeStateToPlay()"
|
||||
(pause)="changeStateToPause()" (timeupdate)="changeTimeupdate($event.currentTime)"
|
||||
@ -73,9 +95,14 @@
|
||||
<!--<p>Your browser does not support HTML5 video player. download video: <a href="{{videoSource}}>link here</a>.</p>-->
|
||||
</video>
|
||||
</div>
|
||||
<div class="controls" *ngIf="!displayNeedHide || !isPlaying">
|
||||
<button (click)="onPlay()" *ngIf="!isPlaying"><i class="material-icons">play_arrow</i></button>
|
||||
<button (click)="onPause()" *ngIf="isPlaying"><i class="material-icons">pause</i></button>
|
||||
@if(!displayNeedHide || !isPlaying) {
|
||||
<div class="controls">
|
||||
@if(isPlaying) {
|
||||
<button (click)="onPause()"><i class="material-icons">pause</i></button>
|
||||
}
|
||||
@else {
|
||||
<button (click)="onPlay()"><i class="material-icons">play_arrow</i></button>
|
||||
}
|
||||
<button (click)="onStop()"><i class="material-icons">stop</i></button>
|
||||
<div class="timer">
|
||||
<div>
|
||||
@ -91,41 +118,51 @@
|
||||
<button (click)="onForward()"><i class="material-icons">fast_forward</i></button>
|
||||
<!--<button (click)="onNext()"><i class="material-icons">navigate_next</i></button>-->
|
||||
<!--<button (click)="onMore()" ><i class="material-icons">more_vert</i></button>-->
|
||||
<button (click)="onFullscreen()" *ngIf="!isFullScreen"><i class="material-icons">fullscreen</i></button>
|
||||
<button (click)="onFullscreenExit()" *ngIf="isFullScreen"><i
|
||||
class="material-icons">fullscreen_exit</i></button>
|
||||
@if(isFullScreen) {
|
||||
<button (click)="onFullscreenExit()"><i class="material-icons">fullscreen_exit</i></button>
|
||||
}
|
||||
@else {
|
||||
<button (click)="onFullscreen()"><i class="material-icons">fullscreen</i></button>
|
||||
}
|
||||
<!--<button (click)="onTakeScreenShoot()"><i class="material-icons">add_a_photo</i></button>-->
|
||||
<button (click)="onVolumeMenu()"><i class="material-icons">volume_up</i></button>
|
||||
|
||||
<button class="bigPause" (click)="onPauseToggle()"><i *ngIf="!isPlaying"
|
||||
class="material-icons">play_circle_outline</i></button>
|
||||
<button class="bigRewind" (click)="onRewind()"><i *ngIf="!isPlaying"
|
||||
class="material-icons">fast_rewind</i></button>
|
||||
<button class="bigForward" (click)="onForward()"><i *ngIf="!isPlaying"
|
||||
class="material-icons">fast_forward</i></button>
|
||||
@if(!isPlaying) {
|
||||
<button class="bigPause" (click)="onPauseToggle()"><i class="material-icons">play_circle_outline</i></button>
|
||||
<button class="bigRewind" (click)="onRewind()"><i class="material-icons">fast_rewind</i></button>
|
||||
<button class="bigForward" (click)="onForward()"><i class="material-icons">fast_forward</i></button>
|
||||
}
|
||||
</div>
|
||||
|
||||
<div class="title-inline" *ngIf="!isFullScreen || !isPlaying">
|
||||
}
|
||||
@if(!isFullScreen || !isPlaying) {
|
||||
<div class="title-inline">
|
||||
{{generatedName}}
|
||||
</div>
|
||||
<div class="video-button" *ngIf="!isFullScreen || !isPlaying">
|
||||
<div class="video-button">
|
||||
<button (click)="onRequireStop()">
|
||||
<i class="material-icons big-button">highlight_off</i>
|
||||
</button>
|
||||
</div>
|
||||
<div class="volume" *ngIf="displayVolumeMenu && (!displayNeedHide || !isPlaying)">
|
||||
}
|
||||
@if(displayVolumeMenu && (!displayNeedHide || !isPlaying)) {
|
||||
<div class="volume">
|
||||
<div class="volume-menu">
|
||||
<div class="slidecontainer">
|
||||
<input type="range" min="0" max="100" class="slider" [value]="volumeValue"
|
||||
(input)="onVolume($event.target)">
|
||||
</div>
|
||||
<button (click)="onVolumeMute()" *ngIf="!videoPlayer.muted"><i
|
||||
class="material-icons">volume_mute</i></button>
|
||||
<button (click)="onVolumeUnMute()" *ngIf="videoPlayer.muted"><i
|
||||
@if(videoPlayer.muted) {
|
||||
<button (click)="onVolumeUnMute()"><i
|
||||
class="material-icons">volume_off</i></button>
|
||||
}
|
||||
@else {
|
||||
<button (click)="onVolumeMute()"><i
|
||||
class="material-icons">volume_mute</i></button>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
<canvas #canvascreenshoot style="overflow:auto"></canvas>
|
||||
</div>
|
||||
@ -1 +1 @@
|
||||
Subproject commit c3489422f2df7f16465b4358e868664af9cda81c
|
||||
Subproject commit 147a955b195eb7c90e445d404f043d9a363087ca
|
||||
Loading…
Reference in New Issue
Block a user