[DEV] add edit on saison and group (cover adder too) corect edit button on top bar

front/src/app/app-routing.module.ts

@@ -18,6 +18,8 @@ import { LoginComponent } from './scene/login/login.component';
 import { SignUpComponent } from './scene/sign-up/sign-up.component';
 import { SettingsComponent } from './scene/settings/settings.component';
 import { VideoEditComponent } from './scene/video-edit/video-edit';
+import { GroupEditComponent } from './scene/group-edit/group-edit';
+import { SaisonEditComponent } from './scene/saison-edit/saison-edit';
 //import { HelpComponent } from './help/help.component';
 
 
@@ -25,13 +27,17 @@ const routes: Routes = [
 	{ path: '', redirectTo: '/home', pathMatch: 'full'},
 	{ path: 'home', component: HomeComponent },
 	{ path: 'type/:type_id', component: TypeComponent },
+	
 	{ path: 'univers/:univers_id', component: UniversComponent },
+	
 	//{ path: 'type/:type_id/univers/:univers_id',                 component: UniversComponent },
 	{ path: 'group/:group_id', component: GroupComponent },
+	{ path: 'group-edit/:group_id', component: GroupEditComponent },
 	//{ path: 'type/:type_id/group/:group_id',                     component: GroupComponent },
 	//{ path: 'type/:type_id/univers/:univers_id/group/:group_id', component: GroupComponent },
 	//{ path: 'univers/:univers_id/group/:group_id',               component: GroupComponent },
 	{ path: 'saison/:saison_id', component: SaisonComponent },
+	{ path: 'saison-edit/:saison_id', component: SaisonEditComponent },
 	//{ path: 'type/:type_id/univers/:univers_id/group/:group_id/saison/:saison_id',    component: SaisonComponent },
 	{ path: 'video/:video_id', component: VideoComponent },
 	//{ path: 'type/:type_id/univers/:univers_id/group/:group_id/saison/:saison_id/video/:video_id',    component: VideoComponent },

front/src/app/app.module.ts

@@ -35,6 +35,8 @@ import { SettingsComponent } from './scene/settings/settings.component';
 import { ErrorViewerComponent } from './scene/error-viewer/error-viewer.component';
 import { ErrorComponent } from './error/error.component';
 import { VideoEditComponent } from './scene/video-edit/video-edit';
+import { SaisonEditComponent } from './scene/saison-edit/saison-edit';
+import { GroupEditComponent } from './scene/group-edit/group-edit';
 
 import { AuthService } from './service/auth.service';
 import { ArianeService } from './service/ariane.service';
@@ -75,7 +77,9 @@ import { AppComponent } from './app.component';
 		SettingsComponent,
 		ErrorViewerComponent,
 		ErrorComponent,
-		VideoEditComponent
+		VideoEditComponent,
+		SaisonEditComponent,
+		GroupEditComponent
 		],
 	imports: [
 		BrowserModule,

front/src/app/component/top-menu/top-menu.component.html

@@ -15,7 +15,7 @@
 					{{ariane_type_name}}
 				</div>
 				<div class="xmobile">
-					U
+					T
 				</div>
 			</button>
 			<div class="item_ariane_separator" *ngIf="ariane_univers_id != null && ariane_type_id != null" >/</div>
@@ -75,11 +75,11 @@
 			<img class="avatar" src="{{avatar}}"/>
 		</button>
 		<button class="item"
-		        *ngIf="editable == true"
+		        *ngIf="edit != null"
 		        style="float:right; height:56px;"
 		        (click)="onEdit()">
 			<div class="xdesktop">
-				<i class="material-icons">edit</i> Edit
+				<i class="material-icons">edit</i> Edit {{edit}}
 			</div>
 			<div class="xmobile">
 				<i class="material-icons">edit</i>

front/src/app/component/top-menu/top-menu.component.ts

@@ -35,7 +35,7 @@ export class TopMenuComponent implements OnInit {
 	public ariane_saison_id: number = null;
 	public ariane_saison_name: string = null;
 	
-	public editable:boolean = false;
+	public edit: string = "";
 	
 	constructor(private router: Router,
 	            private sessionService: SessionService,
@@ -43,13 +43,6 @@ export class TopMenuComponent implements OnInit {
 		
 	}
 	
-	updateEditable() {
-		if (this.arianeService.getVideoId() != null) {
-			this.editable = true;
-		} else {
-			this.editable = false;
-		}
-	}
 	ngOnInit() {
 		this.sessionService.change.subscribe(isConnected => {
 			console.log("receive event from session ..." + isConnected);
@@ -94,11 +87,54 @@ export class TopMenuComponent implements OnInit {
 		this.displayUserMenu = !this.displayUserMenu;
 	}
 	
+	updateEditable() {
+		if (this.arianeService.getVideoId() != null) {
+			this.edit = "video";
+			return;
+		}
+		if (this.arianeService.getSaisonId() != null) {
+			this.edit = "saison";
+			return;
+		}
+		if (this.arianeService.getGroupId() != null) {
+			this.edit = "group";
+			return;
+		}
+		/*
+		if (this.arianeService.getUniversId() != null) {
+			this.edit = "univers";
+			return;
+		}
+		if (this.arianeService.getTypeId() != null) {
+			this.edit = "type";
+			return;
+		}
+		*/
+		this.edit = null;
+	}
 	onEdit(): void {
 		console.log("onEdit()");
 		if (this.arianeService.getVideoId() != null) {
 			this.router.navigate(['video-edit/' + this.arianeService.getVideoId()]);
+			return;
 		}
+		if (this.arianeService.getSaisonId() != null) {
+			this.router.navigate(['saison-edit/' + this.arianeService.getSaisonId()]);
+			return;
+		}
+		if (this.arianeService.getGroupId() != null) {
+			this.router.navigate(['group-edit/' + this.arianeService.getGroupId()]);
+			return;
+		}
+		if (this.arianeService.getUniversId() != null) {
+			this.router.navigate(['univers-edit/' + this.arianeService.getUniversId()]);
+			return;
+		}
+		if (this.arianeService.getTypeId() != null) {
+			this.router.navigate(['type-edit/' + this.arianeService.getTypeId()]);
+			return;
+		}
+		this.edit = null;
 	}
 	
 	onHome(): void {
@@ -146,33 +182,35 @@ export class TopMenuComponent implements OnInit {
 	onArianeType(): void {
 		console.log("onArianeType(" + this.ariane_type_id + ")");
 		this.router.navigate(['type/' + this.ariane_type_id ]);
-		this.ariane_univers_id = null;
+		this.arianeService.setVideo(null);
-		this.ariane_univers_name = null;
+		this.arianeService.setSaison(null);
-		this.ariane_group_id = null;
+		this.arianeService.setGroup(null);
-		this.ariane_group_name = null;
+		this.arianeService.setUnivers(null);
-		this.ariane_saison_id = null;
+		this.updateEditable();
-		this.ariane_saison_name = null;
 	}
 	
 	onArianeUnivers(): void {
 		console.log("onArianeUnivers(" + this.ariane_univers_id + ")");
 		this.router.navigate(['univers/' + this.ariane_univers_id ]);
-		this.ariane_group_id = null;
+		this.arianeService.setVideo(null);
-		this.ariane_group_name = null;
+		this.arianeService.setSaison(null);
-		this.ariane_saison_id = null;
+		this.arianeService.setGroup(null);
-		this.ariane_saison_name = null;
+		this.updateEditable();
 	}
 	
 	onArianeGroup(): void {
 		console.log("onArianeGroup(" + this.ariane_group_id + ")");
 		this.router.navigate(['group/' + this.ariane_group_id ]);
-		this.ariane_saison_id = null;
+		this.arianeService.setVideo(null);
-		this.ariane_saison_name = null;
+		this.arianeService.setSaison(null);
+		this.updateEditable();
 	}
 	
 	onArianeSaison(): void {
 		console.log("onArianeSaison(" + this.ariane_saison_id + ")");
 		this.router.navigate(['saison/' + this.ariane_saison_id ]);
+		this.arianeService.setVideo(null);
+		this.updateEditable();
 	}
 
 }

front/src/app/scene/group-edit/group-edit.html

@@ -0,0 +1,49 @@
+<div class="main-reduce">
+	<div class="fill-all">
+		<div class="request_raw">
+			<div class="label">
+				Name:
+			</div>
+			<div class="input">
+				<input type="text"
+				       placeholder="Name of the Group"
+				       [value]="name"
+				       (input)="onName($event.target.value)"
+				       />
+			</div>
+		</div>
+		<div class="request_raw">
+			<div class="label">
+				Description:
+			</div>
+			<div class="input">
+				<input type="text"
+				       placeholder="Description of the Media"
+				       [value]="description"
+				       (input)="onDescription($event.target.value)"/>
+			</div>
+		</div>
+		<div class="request_raw">
+			<div class="label">
+				Covers:
+			</div>
+			<div class="input">
+				<div *ngFor="let element of covers_display" class="cover_div"><img src="{{element}}" class="cover"/></div>
+			</div>
+		</div>
+		<div class="send_value">
+			<button class="button fill-x color-button-validate color-shadow-black" (click)="sendValues()" type="submit"><i class="material-icons">save_alt</i> Save</button>
+		</div>
+		<div class="request_raw">
+			<div class="label">
+				Covers:
+			</div>
+			<div class="input">
+				<input type="file" 
+				       (change)="onChangeCover($event.target)"
+				       placeholder="Select a cover file"
+				       accept=".png,.jpg"/>{{upload_file_value}}
+			</div>
+		</div>
+	</div>
+</div>

front/src/app/scene/group-edit/group-edit.less

@@ -0,0 +1,103 @@
+.fill-all{
+	//width:100%;
+	max-width:80%;
+	height:100%;
+	margin: 20px auto;
+	padding: 20px;
+	border:0;
+	background-color: rgba(200, 200, 200, 0.5);
+	box-shadow: 0px 2px 4px 0 rgba(0, 0, 0, 0.6);
+}
+
+.request_raw {
+	width: 90%;
+	margin: 0 auto;
+	height: 45px;
+	.label {
+		width: 20%;
+		margin-right: 10px;
+		text-align: right;
+		float: left;
+		display: block;
+	}
+	.input {
+		width: 75%;
+		float: left;
+		display: block;
+		input {
+			width: 100%;
+			font-size: 20px;
+		}
+		select {
+			width: 100%;
+			font-size: 20px;
+		}
+	}
+	.cover_div {
+		//float: left;
+		display: block;
+	}
+	.cover {
+		max-width: 30%;
+	}
+}
+.send_value {
+	width: 300px;
+	margin: 0 auto;
+	padding: 10px;
+	display: block;
+}
+
+.item {
+	font-size: 20px;
+	height: 21%;
+	width: 23%;
+	margin: 1%;
+	padding: 0;
+	overflow: hidden;
+	//box-shadow: 0 1px 1.5px 0 rgba(0,0,0,.12),0 1px 1px 0 rgba(0,0,0,.24);
+	box-shadow: 0px 2px 4px 0 rgba(0, 0, 0, 0.6);
+	line-height: normal;
+	border: none;
+	font-family: "Roboto","Helvetica","Arial",sans-serif;
+	font-weight: 500;
+	text-transform: uppercase;
+	letter-spacing: 0;
+	will-change: box-shadow;
+	outline: none;
+	cursor: pointer;
+	text-decoration: none;
+	text-align: center;
+	vertical-align: middle;
+	transition-duration: 0.4s;
+	float:left;
+	display:block;
+	
+	h1 {
+		font-size: 24px;
+	}
+	
+	&:hover {
+		background-color: #F00;
+	}
+	
+	.material-icons {
+		vertical-align: middle;
+	}
+	
+	.material-icons {
+		position: absolute;
+		top: 50%;
+		left: 50%;
+		transform: ~"translate(-12px,-12px)";
+		line-height: 24px;
+		width: 24px;
+	}
+}
+
+.item-video {
+	&:hover {
+		background-color: #0F0;
+	}
+}
+

front/src/app/scene/group-edit/group-edit.ts

@@ -0,0 +1,142 @@
+/** @file
+ * @author Edouard DUPIN
+ * @copyright 2018, Edouard DUPIN, all right reserved
+ * @license PROPRIETARY (see license file)
+ */
+
+import { Component, OnInit } from '@angular/core';
+import { Router, ActivatedRoute, ParamMap } from '@angular/router';
+import { Location } from '@angular/common';
+import { NgForm } from '@angular/forms';
+import { FormGroup, FormControl } from "@angular/forms";
+import { fadeInAnimation } from '../../_animations/index';
+
+import { GroupService } from '../../service/group.service';
+import { DataService } from '../../service/data.service';
+
+export class ElementList {
+	value: number;
+	label: string;
+	constructor(_value: number, _label: string) {
+		this.value = _value;
+		this.label = _label;
+	}
+}
+
+@Component({
+	selector: 'app-group-edit',
+	templateUrl: './group-edit.html',
+	styleUrls: ['./group-edit.less'],
+	animations: [fadeInAnimation],
+	host: { '[@fadeInAnimation]': '' }
+})
+// https://www.sitepoint.com/angular-forms/
+export class GroupEditComponent implements OnInit {
+	id_group:number = -1;
+	
+	error:string = ""
+	
+	name:string = ""
+	description:string = ""
+	coverFile:File;
+	upload_file_value:string = ""
+	selectedFiles:FileList;
+	
+	covers_display:Array<string> = [];
+	
+	constructor(private route: ActivatedRoute,
+	            private router: Router,
+	            private locate: Location,
+	            private dataService: DataService,
+	            private groupService: GroupService) {
+		
+	}
+	
+	ngOnInit() {
+		this.id_group = parseInt(this.route.snapshot.paramMap.get('group_id'));
+		let self = this;
+		this.groupService.get(this.id_group)
+			.then(function(response) {
+				console.log("get response of video : " + JSON.stringify(response, null, 2));
+				self.name = response.name;
+				self.description = response.description;
+				if (response.covers !== undefined && response.covers !== null) {
+					for (let iii=0; iii<response.covers.length; iii++) {
+						self.covers_display.push(self.groupService.getCoverUrl(response.covers[iii]));
+					}
+				} else {
+					self.covers_display = []
+				}
+				console.log("covers_list : " + JSON.stringify(self.covers_display, null, 2));
+			}).catch(function(response) {
+				self.error = "Can not get the data";
+				self.name = "";
+				self.description = "";
+				self.covers_display = [];
+			});
+	}
+	
+	onName(_value:any):void {
+		this.name = _value;
+	}
+	
+	onDescription(_value:any):void {
+		this.description = _value;
+	}
+	
+	sendValues():void {
+		console.log("send new values....");
+		let data = {
+			"name": this.name,
+			"description": this.description
+		};
+		this.groupService.put(this.id_group, data);
+	}
+	
+	// At the drag drop area
+	// (drop)="onDropFile($event)"
+	onDropFile(_event: DragEvent) {
+		_event.preventDefault();
+		this.uploadFile(_event.dataTransfer.files[0]);
+	}
+	
+	// At the drag drop area
+	// (dragover)="onDragOverFile($event)"
+	onDragOverFile(_event) {
+		_event.stopPropagation();
+		_event.preventDefault();
+	}
+	
+	// At the file input element
+	// (change)="selectFile($event)"
+	onChangeCover(_value:any):void {
+		this.selectedFiles = _value.files
+		this.coverFile = this.selectedFiles[0];
+		console.log("select file " + this.coverFile.name);
+		this.uploadFile(this.coverFile);
+	}
+	
+	uploadFile(_file:File) {
+		if (_file == undefined) {
+			console.log("No file selected!");
+			return;
+		}
+		let self = this;
+		this.dataService.sendFile(_file)
+			.then(function(response) {
+				console.log("get response of video : " + JSON.stringify(response, null, 2));
+				let id_of_image = response.id;
+				self.groupService.addCover(self.id_group, id_of_image)
+					.then(function(response) {
+						console.log("cover added");
+						self.covers_display.push(self.groupService.getCoverUrl(id_of_image));
+					}).catch(function(response) {
+						console.log("Can not cover in the cover_list...");
+					});
+			}).catch(function(response) {
+				//self.error = "Can not get the data";
+				console.log("Can not add the data in the system...");
+			});
+	}
+
+}

front/src/app/scene/saison-edit/saison-edit.html

@@ -0,0 +1,49 @@
+<div class="main-reduce">
+	<div class="fill-all">
+		<div class="request_raw">
+			<div class="label">
+				Number:
+			</div>
+			<div class="input">
+				<input type="number"
+				       placeholder="Id of the saison"
+				       [value]="numberVal"
+				       (input)="onName($event.target.value)"
+				       />
+			</div>
+		</div>
+		<div class="request_raw">
+			<div class="label">
+				Description:
+			</div>
+			<div class="input">
+				<input type="text"
+				       placeholder="Description of the Media"
+				       [value]="description"
+				       (input)="onDescription($event.target.value)"/>
+			</div>
+		</div>
+		<div class="request_raw">
+			<div class="label">
+				Covers:
+			</div>
+			<div class="input">
+				<div *ngFor="let element of covers_display" class="cover_div"><img src="{{element}}" class="cover"/></div>
+			</div>
+		</div>
+		<div class="send_value">
+			<button class="button fill-x color-button-validate color-shadow-black" (click)="sendValues()" type="submit"><i class="material-icons">save_alt</i> Save</button>
+		</div>
+		<div class="request_raw">
+			<div class="label">
+				Covers:
+			</div>
+			<div class="input">
+				<input type="file" 
+				       (change)="onChangeCover($event.target)"
+				       placeholder="Select a cover file"
+				       accept=".png,.jpg"/>{{upload_file_value}}
+			</div>
+		</div>
+	</div>
+</div>

front/src/app/scene/saison-edit/saison-edit.less

@@ -0,0 +1,103 @@
+.fill-all{
+	//width:100%;
+	max-width:80%;
+	height:100%;
+	margin: 20px auto;
+	padding: 20px;
+	border:0;
+	background-color: rgba(200, 200, 200, 0.5);
+	box-shadow: 0px 2px 4px 0 rgba(0, 0, 0, 0.6);
+}
+
+.request_raw {
+	width: 90%;
+	margin: 0 auto;
+	height: 45px;
+	.label {
+		width: 20%;
+		margin-right: 10px;
+		text-align: right;
+		float: left;
+		display: block;
+	}
+	.input {
+		width: 75%;
+		float: left;
+		display: block;
+		input {
+			width: 100%;
+			font-size: 20px;
+		}
+		select {
+			width: 100%;
+			font-size: 20px;
+		}
+	}
+	.cover_div {
+		//float: left;
+		display: block;
+	}
+	.cover {
+		max-width: 30%;
+	}
+}
+.send_value {
+	width: 300px;
+	margin: 0 auto;
+	padding: 10px;
+	display: block;
+}
+
+.item {
+	font-size: 20px;
+	height: 21%;
+	width: 23%;
+	margin: 1%;
+	padding: 0;
+	overflow: hidden;
+	//box-shadow: 0 1px 1.5px 0 rgba(0,0,0,.12),0 1px 1px 0 rgba(0,0,0,.24);
+	box-shadow: 0px 2px 4px 0 rgba(0, 0, 0, 0.6);
+	line-height: normal;
+	border: none;
+	font-family: "Roboto","Helvetica","Arial",sans-serif;
+	font-weight: 500;
+	text-transform: uppercase;
+	letter-spacing: 0;
+	will-change: box-shadow;
+	outline: none;
+	cursor: pointer;
+	text-decoration: none;
+	text-align: center;
+	vertical-align: middle;
+	transition-duration: 0.4s;
+	float:left;
+	display:block;
+	
+	h1 {
+		font-size: 24px;
+	}
+	
+	&:hover {
+		background-color: #F00;
+	}
+	
+	.material-icons {
+		vertical-align: middle;
+	}
+	
+	.material-icons {
+		position: absolute;
+		top: 50%;
+		left: 50%;
+		transform: ~"translate(-12px,-12px)";
+		line-height: 24px;
+		width: 24px;
+	}
+}
+
+.item-video {
+	&:hover {
+		background-color: #0F0;
+	}
+}
+

front/src/app/scene/saison-edit/saison-edit.ts

@@ -0,0 +1,142 @@
+/** @file
+ * @author Edouard DUPIN
+ * @copyright 2018, Edouard DUPIN, all right reserved
+ * @license PROPRIETARY (see license file)
+ */
+
+import { Component, OnInit } from '@angular/core';
+import { Router, ActivatedRoute, ParamMap } from '@angular/router';
+import { Location } from '@angular/common';
+import { NgForm } from '@angular/forms';
+import { FormGroup, FormControl } from "@angular/forms";
+import { fadeInAnimation } from '../../_animations/index';
+
+import { SaisonService } from '../../service/saison.service';
+import { DataService } from '../../service/data.service';
+
+export class ElementList {
+	value: number;
+	label: string;
+	constructor(_value: number, _label: string) {
+		this.value = _value;
+		this.label = _label;
+	}
+}
+
+@Component({
+	selector: 'app-saison-edit',
+	templateUrl: './saison-edit.html',
+	styleUrls: ['./saison-edit.less'],
+	animations: [fadeInAnimation],
+	host: { '[@fadeInAnimation]': '' }
+})
+// https://www.sitepoint.com/angular-forms/
+export class SaisonEditComponent implements OnInit {
+	id_saison:number = -1;
+	
+	error:string = "";
+	
+	numberVal:number = null;
+	description:string = "";
+	coverFile:File;
+	upload_file_value:string = ""
+	selectedFiles:FileList;
+	
+	covers_display:Array<string> = [];
+	
+	constructor(private route: ActivatedRoute,
+	            private router: Router,
+	            private locate: Location,
+	            private dataService: DataService,
+	            private saisonService: SaisonService) {
+		
+	}
+	
+	ngOnInit() {
+		this.id_saison = parseInt(this.route.snapshot.paramMap.get('saison_id'));
+		let self = this;
+		this.saisonService.get(this.id_saison)
+			.then(function(response) {
+				console.log("get response of saison : " + JSON.stringify(response, null, 2));
+				self.numberVal = response.number;
+				self.description = response.description;
+				if (response.covers !== undefined && response.covers !== null) {
+					for (let iii=0; iii<response.covers.length; iii++) {
+						self.covers_display.push(self.saisonService.getCoverUrl(response.covers[iii]));
+					}
+				} else {
+					self.covers_display = []
+				}
+				console.log("covers_list : " + JSON.stringify(self.covers_display, null, 2));
+			}).catch(function(response) {
+				self.error = "Can not get the data";
+				self.numberVal = null;
+				self.description = "";
+				self.covers_display = [];
+			});
+	}
+	
+	onNumber(_value:any):void {
+		this.numberVal = _value;
+	}
+	
+	onDescription(_value:any):void {
+		this.description = _value;
+	}
+	
+	sendValues():void {
+		console.log("send new values....");
+		let data = {
+			"number": this.numberVal,
+			"description": this.description
+		};
+		this.saisonService.put(this.id_saison, data);
+	}
+	
+	// At the drag drop area
+	// (drop)="onDropFile($event)"
+	onDropFile(_event: DragEvent) {
+		_event.preventDefault();
+		this.uploadFile(_event.dataTransfer.files[0]);
+	}
+	
+	// At the drag drop area
+	// (dragover)="onDragOverFile($event)"
+	onDragOverFile(_event) {
+		_event.stopPropagation();
+		_event.preventDefault();
+	}
+	
+	// At the file input element
+	// (change)="selectFile($event)"
+	onChangeCover(_value:any):void {
+		this.selectedFiles = _value.files
+		this.coverFile = this.selectedFiles[0];
+		console.log("select file " + this.coverFile.name);
+		this.uploadFile(this.coverFile);
+	}
+	
+	uploadFile(_file:File) {
+		if (_file == undefined) {
+			console.log("No file selected!");
+			return;
+		}
+		let self = this;
+		this.dataService.sendFile(_file)
+			.then(function(response) {
+				console.log("get response of saison : " + JSON.stringify(response, null, 2));
+				let id_of_image = response.id;
+				self.saisonService.addCover(self.id_saison, id_of_image)
+					.then(function(response) {
+						console.log("cover added");
+						self.covers_display.push(self.saisonService.getCoverUrl(id_of_image));
+					}).catch(function(response) {
+						console.log("Can not cover in the cover_list...");
+					});
+			}).catch(function(response) {
+				//self.error = "Can not get the data";
+				console.log("Can not add the data in the system...");
+			});
+	}
+
+}

front/src/app/service/ariane.service.ts

@@ -102,8 +102,15 @@ export class ArianeService {
 	*/
 	
 	setType(id:number):void {
+		if (this.type_id == id) {
+			return;
+		}
 		this.type_id = id;
 		this.type_name = "??--??";
+		if (this.type_id == null) {
+			this.type_change.emit(this.type_id);
+			return;
+		}
 		let self = this;
 		this.typeService.get(id)
 			.then(function(response) {
@@ -121,8 +128,15 @@ export class ArianeService {
 	}
 	
 	setUnivers(id:number) {
+		if (this.univers_id == id) {
+			return;
+		}
 		this.univers_id = id;
 		this.univers_name = "??--??";
+		if (this.univers_id == null) {
+			this.univers_change.emit(this.univers_id);
+			return;
+		}
 		let self = this;
 		this.universService.get(id)
 			.then(function(response) {
@@ -140,8 +154,15 @@ export class ArianeService {
 	}
 	
 	setGroup(id:number):void {
+		if (this.group_id == id) {
+			return;
+		}
 		this.group_id = id;
 		this.group_name = "??--??";
+		if (this.group_id == null) {
+			this.group_change.emit(this.group_id);
+			return;
+		}
 		let self = this;
 		this.groupService.get(id)
 			.then(function(response) {
@@ -159,8 +180,15 @@ export class ArianeService {
 	}
 	
 	setSaison(id:number):void {
+		if (this.saison_id == id) {
+			return;
+		}
 		this.saison_id = id;
 		this.saison_name = "??--??";
+		if (this.saison_id == null) {
+			this.saison_change.emit(this.saison_id);
+			return;
+		}
 		let self = this;
 		this.saisonService.get(id)
 			.then(function(response) {
@@ -178,6 +206,9 @@ export class ArianeService {
 	}
 	
 	setVideo(id:number):void {
+		if (this.video_id == id) {
+			return;
+		}
 		this.video_id = id;
 		this.video_change.emit(this.video_id);
 	}

front/src/app/service/group.service.ts

@@ -26,6 +26,12 @@ export class GroupService {
 		return this.http.get_specific("group", _id, "saison", _select);
 	};
 	
+	put(_id:number, _data:any):any {
+		return this.http.put_specific("group", _id, _data);
+	};
+	addCover(_id:number, _coverId:number):any {
+		return this.http.post_specific("group", _id, {"data_id":_coverId}, "add_cover");
+	};
 	getCoverUrl(_coverId:number):any {
 		return this.http.createRESTCall("data/" + _coverId);
 	};

front/src/app/service/saison.service.ts

@@ -13,11 +13,15 @@ export class SaisonService {
 	get(_id:number):any {
 		return this.http.get_specific("saison", _id);
 	};
-	
 	getVideo(_id:number):any {
 		return this.http.get_specific("saison", _id, "video");
 	};
-	
+	put(_id:number, _data:any):any {
+		return this.http.put_specific("saison", _id, _data);
+	};
+	addCover(_id:number, _coverId:number):any {
+		return this.http.post_specific("saison", _id, {"data_id":_coverId}, "add_cover");
+	};
 	getCoverUrl(_coverId:number):any {
 		return this.http.createRESTCall("data/" + _coverId);
 	};

front/src/app/service/univers.service.ts

@@ -26,5 +26,14 @@ export class UniversService {
 		return this.http.get_specific("univers", _id, "video", _select);
 	};
 	
+	put(_id:number, _data:any):any {
+		return this.http.put_specific("univers", _id, _data);
+	};
+	addCover(_id:number, _coverId:number):any {
+		return this.http.post_specific("univers", _id, {"data_id":_coverId}, "add_cover");
+	};
+	getCoverUrl(_coverId:number):any {
+		return this.http.createRESTCall("data/" + _coverId);
+	};
 }