[DEV] set back edition adn add many small GUI adaptations

back/src/api/data.py

@@ -191,8 +191,8 @@ def add(_app, _name_api):
 	@doc.summary("get a specific resource")
 	@doc.description("Get a resource with all the needed datas ... It permeit seek for video stream.")
 	@doc.produces(content_type='application/json')
-	async def retrive2(request, id, custom_user_video_name):
+	def retrive2(request, id, custom_user_video_name):
-		return retrive2(request, id)
+		return retrive(request, id)
 	
 	@elem_blueprint.get('/' + _name_api + '/<id:int>', strict_slashes=True)
 	@doc.summary("get a specific resource")

back/src/data_interface.py

@@ -233,7 +233,7 @@ class DataInterface():
 			raise ServerError("INTERNAL_ERROR fail request SQL ...", status_code=500)
 		
 		self.mark_to_store();
-		return self.get(iddd);
+		return self.get(_id);
 	
 	def post(self, _value):
 		debug.info("post " + self.name)

front/src/app/component/element-saison/element-saison.component.html

@@ -10,6 +10,9 @@
 <div class="saison-small">
 	Saison {{numberSaison}}
 </div>
-<div class="description-small" *ngIf="count">
+<div class="description-small" *ngIf="count > 1">
 	{{count}} Episodes
+</div>
+<div class="description-small" *ngIf="count <= 1">
+	{{count}} Episode
 </div>

front/src/app/component/element-saison/element-saison.component.ts

@@ -39,7 +39,7 @@ export class ElementSaisonComponent implements OnInit {
 		this.saisonService.get(this.id_saison)
 			.then(function(response) {
 				self.error = "";
-				self.numberSaison = response.number;
+				self.numberSaison = response.name;
 				self.description = response.description;
 				if (response.covers == undefined || response.covers == null || response.covers.length == 0) {
 					self.cover = null;

front/src/app/scene/saison/saison.component.ts

@@ -47,7 +47,7 @@ export class SaisonComponent implements OnInit {
 		let self = this;
 		this.saisonService.get(this.id_saison)
 			.then(function(response) {
-				self.name = response.number;
+				self.name = response.name;
 				self.group_id = response.parent_id;
 				self.description = response.description;
 				if (response.covers == undefined || response.covers == null || response.covers.length == 0) {

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

@@ -1,5 +1,8 @@
 <div class="main-reduce">
 	<div class="fill-all">
+		<div class="title">
+			Edit media
+		</div>
 		<div class="request_raw">
 			<div class="label">
 				Title:
@@ -14,7 +17,7 @@
 		</div>
 		<div class="request_raw2">
 			<div class="label">
-				Description:
+				<i class="material-icons">description</i> Description:
 			</div>
 			<div class="input">
 				<textarea (input)="onDescription($event.target.value)" placeholder="Description of the Media" rows=6>{{data.description}}</textarea>
@@ -26,7 +29,7 @@
 		</div>
 		<div class="request_raw">
 			<div class="label">
-				Date:
+				<i class="material-icons">date_range</i> Date:
 			</div>
 			<div class="input">
 				<input type="number"
@@ -46,6 +49,11 @@
 					<option *ngFor="let element of listType" [ngValue]="element.value">{{element.label}}</option>
 				</select>
 			</div>
+			<div class="input_add">
+				<button class="button color-button-normal color-shadow-black" (click)="newType()" type="submit">
+					<i class="material-icons">add_circle_outline</i>
+				</button>
+			</div>
 		</div>
 		<div class="request_raw">
 			<div class="label">
@@ -57,17 +65,27 @@
 					<option *ngFor="let element of listUnivers" [ngValue]="element.value">{{element.label}}</option>
 				</select>
 			</div>
+			<div class="input_add">
+				<button class="button color-button-normal color-shadow-black" (click)="newUnivers()" type="submit">
+					<i class="material-icons">add_circle_outline</i>
+				</button>
+			</div>
 		</div>
 		<div class="request_raw">
 			<div class="label">
-				Group:
+				Serie:
 			</div>
 			<div class="input">
-				<select [ngModel]="data.group_id"
+				<select [ngModel]="data.serie_id"
 				        (ngModelChange)="onChangeGroup($event)">
 					<option *ngFor="let element of listGroup" [ngValue]="element.value">{{element.label}}</option>
 				</select>
 			</div>
+			<div class="input_add">
+				<button class="button color-button-normal color-shadow-black" (click)="newSerie()" type="submit">
+					<i class="material-icons">add_circle_outline</i>
+				</button>
+			</div>
 		</div>
 		<div class="request_raw">
 			<div class="label">
@@ -79,6 +97,11 @@
 					<option *ngFor="let element of listSaison" [ngValue]="element.value">{{element.label}}</option>
 				</select>
 			</div>
+			<div class="input_add">
+				<button class="button color-button-normal color-shadow-black" (click)="newSaison()" type="submit">
+					<i class="material-icons">add_circle_outline</i>
+				</button>
+			</div>
 		</div>
 		<div class="request_raw">
 			<div class="label">
@@ -94,33 +117,53 @@
 		</div>
 		<div class="request_raw">
 			<div class="label">
-				Data ID:
+				<i class="material-icons">data_usage</i> Data ID:
 			</div>
 			<div class="input">
 				{{data.data_id}}
 			</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" [disabled]="!need_send" (click)="sendValues()" type="submit"><i class="material-icons">save_alt</i> Save</button>
 		</div>
+		<div class="clear"><hr/></div>
 		<div class="request_raw">
 			<div class="label">
-				Covers:
+				Add covers:
 			</div>
 			<div class="input">
-				<input type="file" 
+				<input type="file"
 				       (change)="onChangeCover($event.target)"
 				       placeholder="Select a cover file"
 				       accept=".png,.jpg,.jpeg,.webp"/>{{upload_file_value}}
 			</div>
 		</div>
+		<div class="request_raw">
+			<div class="label">
+				Actual Covers:
+			</div>
+			<div class="input">
+				<div *ngFor="let element of covers_display" class="cover_div">
+					<img src="{{element.url}}" class="cover"/>
+					<div class="cover_remove_div">
+						<button class="button color-button-cancel color-shadow-black" (click)="removeCover(element.id)" type="submit">
+							<i class="material-icons">delete</i> Remove Cover
+						</button>
+					</div>
+				</div>
+			</div>
+		</div>
+		<div class="clear"><hr/></div>
+		<div class="request_raw">
+			<div class="label">
+				<i class="material-icons">warning</i> Administration:
+			</div>
+			<div class="input">
+				<button class="button color-button-cancel color-shadow-black" (click)="removeMedia()" type="submit">
+					<i class="material-icons">delete</i> Remove Media
+				</button>
+			</div>
+		</div>
+		<div class="clear"></div>
 	</div>
 </div>

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

@@ -9,12 +9,19 @@
 	box-shadow: 0px 2px 4px 0 rgba(0, 0, 0, 0.6);
 }
 
+.title {
+	width: 90%;
+	margin: 0 auto;
+	font-size: 50px;
+	text-align: center;
+}
+
 .request_raw2 {
 	width: 90%;
 	margin: 0 auto;
 	height: 160px;
 	.label {
-		width: 20%;
+		width: 15%;
 		margin-right: 10px;
 		text-align: right;
 		float: left;
@@ -36,7 +43,7 @@
 	margin: 0 auto;
 	height: 45px;
 	.label {
-		width: 20%;
+		width: 15%;
 		margin-right: 10px;
 		text-align: right;
 		float: left;
@@ -59,8 +66,17 @@
 			font-size: 20px;
 		}
 	}
+	.input_add {
+		width: 5%;
+		float: right;
+		display: block;
+	}
 	.cover_div {
-		//float: left;
+		float: left;
+		display: block;
+	}
+	.cover_remove_div {
+		float: left;
 		display: block;
 	}
 	.cover {

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

@@ -36,7 +36,7 @@ class DataToSend {
 	description:string = ""
 	episode:number = undefined
 	univers_id:number = undefined
-	group_id:number = undefined
+	serie_id:number = undefined
 	saison_id:number = undefined
 	data_id:number = -1
 	time:number = undefined
@@ -49,7 +49,7 @@ class DataToSend {
 		tmp.description = this.description
 		tmp.episode = this.episode
 		tmp.univers_id = this.univers_id
-		tmp.group_id = this.group_id
+		tmp.serie_id = this.serie_id
 		tmp.saison_id = this.saison_id
 		tmp.data_id = this.data_id
 		tmp.time = this.time
@@ -128,7 +128,7 @@ export class VideoEditComponent implements OnInit {
 		if (this.data.univers_id != this.data_ori.univers_id) {
 			this.need_send = true;
 		}
-		if (this.data.group_id != this.data_ori.group_id) {
+		if (this.data.serie_id != this.data_ori.serie_id) {
 			this.need_send = true;
 		}
 		if (this.data.saison_id != this.data_ori.saison_id) {
@@ -161,10 +161,12 @@ export class VideoEditComponent implements OnInit {
 			}).catch(function(response2) {
 				console.log("get response22 : " + JSON.stringify(response2, null, 2));
 			});
-		this.groupService.getOrder()
+		//this.groupService.getOrder()
+		this.groupService.getData()
 			.then(function(response3) {
 				for(let iii= 0; iii < response3.length; iii++) {
 					self.listGroup.push({value: response3[iii].id, label: response3[iii].name});
+					console.log("[" + self.data.data_id + "] Get serie: " + response3[iii].id + ", label:" + response3[iii].name)
 				}
 			}).catch(function(response3) {
 				console.log("get response3 : " + JSON.stringify(response3, null, 2));
@@ -180,13 +182,13 @@ export class VideoEditComponent implements OnInit {
 				self.data.time = response.time;
 				self.data.generated_name = response.generated_name;
 				self.onChangeType(response.type_id);
-				self.onChangeGroup(response.group_id);
+				self.onChangeGroup(response.serie_id);
 				self.data.saison_id = response.saison_id;
 				self.data_ori = self.data.clone();
 				if (response.covers !== undefined && response.covers !== null) {
 					for (let iii=0; iii<response.covers.length; iii++) {
 						self.data.covers.push(response.covers[iii]);
-						self.covers_display.push(self.videoService.getCoverUrl(response.covers[iii]));
+						self.covers_display.push({id:response.covers[iii],url:self.videoService.getCoverUrl(response.covers[iii])});
 					}
 				} else {
 					self.covers_display = []
@@ -205,10 +207,10 @@ export class VideoEditComponent implements OnInit {
 	onChangeType(_value:any):void {
 		console.log("Change requested of type ... " + _value);
 		this.data.type_id = _value;
-		this.data.group_id = null;
+		//this.data.serie_id = null;
-		this.data.saison_id = null;
+		//this.data.saison_id = null;
 		//this.listGroup = [{value: undefined, label: '---'}];
-		this.listSaison = [{value: undefined, label: '---'}];
+		//this.listSaison = [{value: undefined, label: '---'}];
 		let self = this;
 		this.updateNeedSend();
 		/*
@@ -231,15 +233,15 @@ export class VideoEditComponent implements OnInit {
 	}
 	
 	onChangeGroup(_value:any):void {
-		this.data.group_id = _value;
+		this.data.serie_id = _value;
 		this.data.saison_id = null;
 		this.listSaison = [{value: undefined, label: '---'}];
 		let self = this;
-		if (this.data.group_id != undefined) {
+		if (this.data.serie_id != undefined) {
-			self.groupService.getSaison(this.data.group_id, ["id", "number"])
+			self.groupService.getSaison(this.data.serie_id, ["id", "name"])
 				.then(function(response3) {
 					for(let iii= 0; iii < response3.length; iii++) {
-						self.listSaison.push({value: response3[iii].id, label: "saison " + response3[iii].number});
+						self.listSaison.push({value: response3[iii].id, label: "saison " + response3[iii].name});
 					}
 				}).catch(function(response3) {
 					console.log("get response22 : " + JSON.stringify(response3, null, 2));
@@ -304,8 +306,8 @@ export class VideoEditComponent implements OnInit {
 		if (this.data.univers_id != this.data_ori.univers_id) {
 			data["univers_id"] = this.data.univers_id;
 		}
-		if (this.data.group_id != this.data_ori.group_id) {
+		if (this.data.serie_id != this.data_ori.serie_id) {
-			data["group_id"] = this.data.group_id;
+			data["serie_id"] = this.data.serie_id;
 		}
 		if (this.data.saison_id != this.data_ori.saison_id) {
 			data["saison_id"] = this.data.saison_id;
@@ -368,5 +370,24 @@ export class VideoEditComponent implements OnInit {
 				console.log("Can not add the data in the system...");
 			});
 	}
-
+	removeCover(_id) {
+		console.log("Request remove cover: " + _id);
+	}
+	removeMedia() {
+		console.log("Request remove Media...");
+	}
+	newSaison() {
+		console.log("Request new Saison...");
+	}
+	newSerie() {
+		console.log("Request new Serie...");
+	}
+	newType() {
+		console.log("Request new Type...");
+	}
+	newUnivers() {
+		console.log("Request new Univers...");
+	}
 }
+
+

front/src/app/scene/video/video.component.html

@@ -6,17 +6,23 @@
 		<div class="cover" *ngIf="cover != null" >
 			<img src="{{cover}}"/>
 		</div>
+		<div class="episode" *ngIf="group_name!=null">
+			<b>Serie:</b> {{group_name}}
+		</div>
+		<div class="episode" *ngIf="saison_name!=null">
+			<b>Saison:</b> {{saison_name}}
+		</div>
+		<div class="episode" *ngIf="episode!=null">
+			<b>Episode:</b> {{episode}}
+		</div>
+		<div class="episode">
+			<b>generated_name:</b> {{generated_name}}
+		</div>
 		<div class="description">
 			{{description}}
 		</div>
-		<div class="episode" *ngIf="episode!=null">
-			Episode <b>{{episode}}</b>
-		</div>
-		<div class="generated_name">
-			generated_name <b>{{generated_name}}</b>
-		</div>
 		<div class="video_div">
-			<video class="video_object" src="{{video_source}}" controls preload="none">
+			<video class="video_object" src="{{video_source}}/{{generated_name}}" controls preload="none">
 				<!--<p>Your browser des not suport HTML5 video player. download video: <a href="{{video_source}}>link here</a>.</p>-->
 			</video>
 		</div>

front/src/app/scene/video/video.component.ts

@@ -10,6 +10,8 @@ import { Location } from '@angular/common';
 import { fadeInAnimation } from '../../_animations/index';
 import { HttpWrapperService } from '../../service/http-wrapper.service';
 import { VideoService } from '../../service/video.service';
+import { GroupService } from '../../service/group.service';
+import { SaisonService } from '../../service/saison.service';
 import { ArianeService } from '../../service/ariane.service';
 
 @Component({
@@ -29,7 +31,9 @@ export class VideoComponent implements OnInit {
 	description:string = ""
 	episode:number = undefined
 	group_id:number = undefined
+	group_name:string = undefined
 	saison_id:number = undefined
+	saison_name:string = undefined
 	data_id:number = -1
 	time:number = undefined
 	type_id:number = undefined
@@ -42,11 +46,35 @@ export class VideoComponent implements OnInit {
 	            private router: Router,
 	            private locate: Location,
 	            private videoService: VideoService,
+	            private groupService: GroupService,
+	            private saisonService: SaisonService,
 	            private httpService: HttpWrapperService,
 	            private arianeService: ArianeService) {
 		
 	}
 	
+	generateName() {
+		this.generated_name = "";
+		if (this.group_name != undefined) {
+			this.generated_name += this.group_name + "-";
+		}
+		if (this.saison != undefined) {
+			if (this.saison_name.length < 2) {
+				this.generated_name += "s0" + this.saison_name + "-";
+			} else {
+				this.generated_name += "s" + this.saison_name + "-";
+			}
+		}
+		if (this.episode != undefined) {
+			if (this.episode < 10) {
+				this.generated_name += "e0" + this.episode + "-";
+			} else {
+				this.generated_name += "e" + this.episode + "-";
+			}
+		}
+		this.generated_name += this.name;
+	}
+	
 	ngOnInit() {
 		this.id_video = parseInt(this.route.snapshot.paramMap.get('video_id'));
 		this.arianeService.setVideo(this.id_video);
@@ -76,6 +104,25 @@ export class VideoComponent implements OnInit {
 						self.covers.push(self.videoService.getCoverUrl(response.covers[iii]));
 					}
 				}
+				self.generateName();
+				if (self.group_id !== undefined && self.group_id !== null) {
+					self.groupService.get(self.group_id)
+						.then(function(response) {
+							self.group_name = response.name;
+							self.generateName();
+						}).catch(function(response) {
+							// nothing to do ...
+						});
+				}
+				if (self.saison_id !== undefined && self.saison_id !== null) {
+					self.saisonService.get(self.saison_id)
+						.then(function(response) {
+							self.saison_name = response.name;
+							self.generateName();
+						}).catch(function(response) {
+							// nothing to do ...
+						});
+				}
 				//console.log("display source " + self.video_source);
 				//console.log("set transformed : " + JSON.stringify(self, null, 2));
 			}).catch(function(response) {
@@ -90,6 +137,8 @@ export class VideoComponent implements OnInit {
 				self.generated_name = "";
 				self.video_source = "";
 				self.cover = null;
+				self.group_name = undefined;
+				self.saison_name = undefined;
 			});
 	}
 

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

@@ -17,9 +17,6 @@ export class GroupService {
 	}
 	
 	get(_id:number):any {
-		if (environment.localBdd != true) {
-			return this.http.get_specific(this.serviceName, _id);
-		}
 		let self = this;
 		return new Promise((resolve, reject) => {
 			self.bdd.getGroup()
@@ -35,17 +32,30 @@ export class GroupService {
 				});
 		});
 	};
-	getOrder():any {
+	
-		if (environment.localBdd != true) {
+	getData():any {
-			return this.http.get_specific(this.serviceName, null, "", ["name","id"]);
-		}
 		let self = this;
 		return new Promise((resolve, reject) => {
 			self.bdd.getGroup()
 				.then(function(response) {
-					let data = response.gets_where([["!=", "id", null]], ["id"], ["name","id"])
+					let data = response.gets();
 					resolve(data);
 				}).catch(function(response) {
+					console.log("[E] " + self.constructor.name + ": can not retrive BDD values");
+					reject(response);
+				});
+		});
+	};
+	
+	getOrder():any {
+		let self = this;
+		return new Promise((resolve, reject) => {
+			self.bdd.getGroup()
+				.then(function(response) {
+					let data = response.gets_where([["!=", "id", null]], ["id", "name"], ["name","id"])
+					resolve(data);
+				}).catch(function(response) {
+					console.log("[E] " + self.constructor.name + ": can not retrive BDD values");
 					reject(response);
 				});
 		});