aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src/app/videos/video-edit
diff options
context:
space:
mode:
authorChocobozzz <florian.bigard@gmail.com>2017-04-21 18:26:09 +0200
committerChocobozzz <florian.bigard@gmail.com>2017-04-26 21:23:19 +0200
commit897ec54d766902878d78abe04aa5b749f6b627f3 (patch)
tree821062ecb881286d45931c32c6b67b078ba47823 /client/src/app/videos/video-edit
parentea9f487b40c7f1d7348d9f88703cb9d52c7e8603 (diff)
downloadPeerTube-897ec54d766902878d78abe04aa5b749f6b627f3.tar.gz
PeerTube-897ec54d766902878d78abe04aa5b749f6b627f3.tar.zst
PeerTube-897ec54d766902878d78abe04aa5b749f6b627f3.zip
Client: beautiful watch page
Diffstat (limited to 'client/src/app/videos/video-edit')
-rw-r--r--client/src/app/videos/video-edit/video-add.component.html231
-rw-r--r--client/src/app/videos/video-edit/video-update.component.html143
2 files changed, 192 insertions, 182 deletions
diff --git a/client/src/app/videos/video-edit/video-add.component.html b/client/src/app/videos/video-edit/video-add.component.html
index 04f4f85b0..7ad671ae7 100644
--- a/client/src/app/videos/video-edit/video-add.component.html
+++ b/client/src/app/videos/video-edit/video-add.component.html
@@ -1,114 +1,119 @@
1<h3>Upload a video</h3> 1<div class="row">
2 2 <div class="content-padding">
3<div *ngIf="error" class="alert alert-danger">{{ error }}</div> 3
4 4 <h3>Upload a video</h3>
5<form novalidate [formGroup]="form"> 5
6 <div class="form-group"> 6 <div *ngIf="error" class="alert alert-danger">{{ error }}</div>
7 <label for="name">Name</label> 7
8 <input 8 <form novalidate [formGroup]="form">
9 type="text" class="form-control" id="name" 9 <div class="form-group">
10 formControlName="name" 10 <label for="name">Name</label>
11 > 11 <input
12 <div *ngIf="formErrors.name" class="alert alert-danger"> 12 type="text" class="form-control" id="name"
13 {{ formErrors.name }} 13 formControlName="name"
14 </div> 14 >
15 <div *ngIf="formErrors.name" class="alert alert-danger">
16 {{ formErrors.name }}
17 </div>
18 </div>
19
20 <div class="form-group">
21 <label for="nsfw">NSFW</label>
22 <input
23 type="checkbox" id="nsfw"
24 formControlName="nsfw"
25 >
26 </div>
27
28 <div class="form-group">
29 <label for="category">Category</label>
30 <select class="form-control" id="category" formControlName="category">
31 <option></option>
32 <option *ngFor="let category of videoCategories" [value]="category.id">{{ category.label }}</option>
33 </select>
34
35 <div *ngIf="formErrors.category" class="alert alert-danger">
36 {{ formErrors.category }}
37 </div>
38 </div>
39
40 <div class="form-group">
41 <label for="licence">Licence</label>
42 <select class="form-control" id="licence" formControlName="licence">
43 <option></option>
44 <option *ngFor="let licence of videoLicences" [value]="licence.id">{{ licence.label }}</option>
45 </select>
46
47 <div *ngIf="formErrors.licence" class="alert alert-danger">
48 {{ formErrors.licence }}
49 </div>
50 </div>
51
52 <div class="form-group">
53 <label for="language">Language</label>
54 <select class="form-control" id="language" formControlName="language">
55 <option></option>
56 <option *ngFor="let language of videoLanguages" [value]="language.id">{{ language.label }}</option>
57 </select>
58
59 <div *ngIf="formErrors.language" class="alert alert-danger">
60 {{ formErrors.language }}
61 </div>
62 </div>
63
64 <div class="form-group">
65 <label for="tags" class="label-tags">Tags</label> <span class="little-information">(press enter to add the tag)</span>
66 <tag-input
67 [ngModel]="tags" [validators]="tagValidators" [errorMessages]="tagValidatorsMessages"
68 formControlName="tags" maxItems="3" modelAsStrings="true"
69 ></tag-input>
70 </div>
71
72 <div class="form-group">
73 <label for="videofile">File</label>
74 <div class="btn btn-default btn-file" [ngClass]="{ 'disabled': filename !== null }" >
75 <span>Select the video...</span>
76 <input
77 type="file" name="videofile" id="videofile"
78 ng2FileSelect [uploader]="uploader" [disabled]="filename !== null"
79 (change)="fileChanged()"
80 >
81 </div>
82 </div>
83
84 <div class="file-to-upload">
85 <div class="file" *ngIf="uploader.queue.length > 0">
86 <span class="filename">{{ filename }}</span>
87 <span class="glyphicon glyphicon-remove" (click)="removeFile()"></span>
88 </div>
89 </div>
90
91 <div *ngIf="fileError" class="alert alert-danger">
92 {{ fileError }}
93 </div>
94
95 <div class="form-group">
96 <label for="description">Description</label>
97 <textarea
98 id="description" class="form-control" placeholder="Description..."
99 formControlName="description"
100 >
101 </textarea>
102 <div *ngIf="formErrors.description" class="alert alert-danger">
103 {{ formErrors.description }}
104 </div>
105 </div>
106
107 <div class="progress">
108 <progressbar [value]="uploader.progress" max="100"></progressbar>
109 </div>
110
111 <div class="form-group">
112 <input
113 type="button" value="Upload" class="btn btn-default form-control"
114 (click)="upload()"
115 >
116 </div>
117 </form>
15 </div> 118 </div>
16 119</div>
17 <div class="form-group">
18 <label for="nsfw">NSFW</label>
19 <input
20 type="checkbox" id="nsfw"
21 formControlName="nsfw"
22 >
23 </div>
24
25 <div class="form-group">
26 <label for="category">Category</label>
27 <select class="form-control" id="category" formControlName="category">
28 <option></option>
29 <option *ngFor="let category of videoCategories" [value]="category.id">{{ category.label }}</option>
30 </select>
31
32 <div *ngIf="formErrors.category" class="alert alert-danger">
33 {{ formErrors.category }}
34 </div>
35 </div>
36
37 <div class="form-group">
38 <label for="licence">Licence</label>
39 <select class="form-control" id="licence" formControlName="licence">
40 <option></option>
41 <option *ngFor="let licence of videoLicences" [value]="licence.id">{{ licence.label }}</option>
42 </select>
43
44 <div *ngIf="formErrors.licence" class="alert alert-danger">
45 {{ formErrors.licence }}
46 </div>
47 </div>
48
49 <div class="form-group">
50 <label for="language">Language</label>
51 <select class="form-control" id="language" formControlName="language">
52 <option></option>
53 <option *ngFor="let language of videoLanguages" [value]="language.id">{{ language.label }}</option>
54 </select>
55
56 <div *ngIf="formErrors.language" class="alert alert-danger">
57 {{ formErrors.language }}
58 </div>
59 </div>
60
61 <div class="form-group">
62 <label for="tags" class="label-tags">Tags</label> <span class="little-information">(press enter to add the tag)</span>
63 <tag-input
64 [ngModel]="tags" [validators]="tagValidators" [errorMessages]="tagValidatorsMessages"
65 formControlName="tags" maxItems="3" modelAsStrings="true"
66 ></tag-input>
67 </div>
68
69 <div class="form-group">
70 <label for="videofile">File</label>
71 <div class="btn btn-default btn-file" [ngClass]="{ 'disabled': filename !== null }" >
72 <span>Select the video...</span>
73 <input
74 type="file" name="videofile" id="videofile"
75 ng2FileSelect [uploader]="uploader" [disabled]="filename !== null"
76 (change)="fileChanged()"
77 >
78 </div>
79 </div>
80
81 <div class="file-to-upload">
82 <div class="file" *ngIf="uploader.queue.length > 0">
83 <span class="filename">{{ filename }}</span>
84 <span class="glyphicon glyphicon-remove" (click)="removeFile()"></span>
85 </div>
86 </div>
87
88 <div *ngIf="fileError" class="alert alert-danger">
89 {{ fileError }}
90 </div>
91
92 <div class="form-group">
93 <label for="description">Description</label>
94 <textarea
95 id="description" class="form-control" placeholder="Description..."
96 formControlName="description"
97 >
98 </textarea>
99 <div *ngIf="formErrors.description" class="alert alert-danger">
100 {{ formErrors.description }}
101 </div>
102 </div>
103
104 <div class="progress">
105 <progressbar [value]="uploader.progress" max="100"></progressbar>
106 </div>
107
108 <div class="form-group">
109 <input
110 type="button" value="Upload" class="btn btn-default form-control"
111 (click)="upload()"
112 >
113 </div>
114</form>
diff --git a/client/src/app/videos/video-edit/video-update.component.html b/client/src/app/videos/video-edit/video-update.component.html
index bedbc91b8..7f4faf21b 100644
--- a/client/src/app/videos/video-edit/video-update.component.html
+++ b/client/src/app/videos/video-edit/video-update.component.html
@@ -1,87 +1,92 @@
1<h3>Update {{ video?.name }}</h3> 1<div class="row">
2 <div class="content-padding">
2 3
3<div *ngIf="error" class="alert alert-danger">{{ error }}</div> 4 <h3>Update {{ video?.name }}</h3>
4 5
5<form novalidate [formGroup]="form"> 6 <div *ngIf="error" class="alert alert-danger">{{ error }}</div>
6 <div class="form-group"> 7
7 <label for="name">Name</label> 8 <form novalidate [formGroup]="form">
8 <input 9 <div class="form-group">
9 type="text" class="form-control" id="name" 10 <label for="name">Name</label>
10 formControlName="name" 11 <input
11 > 12 type="text" class="form-control" id="name"
12 <div *ngIf="formErrors.name" class="alert alert-danger"> 13 formControlName="name"
13 {{ formErrors.name }} 14 >
15 <div *ngIf="formErrors.name" class="alert alert-danger">
16 {{ formErrors.name }}
17 </div>
14 </div> 18 </div>
15 </div>
16 19
17 <div class="form-group"> 20 <div class="form-group">
18 <label for="nsfw">NSFW</label> 21 <label for="nsfw">NSFW</label>
19 <input 22 <input
20 type="checkbox" id="nsfw" 23 type="checkbox" id="nsfw"
21 formControlName="nsfw" 24 formControlName="nsfw"
22 > 25 >
23 </div> 26 </div>
24 27
25 <div class="form-group"> 28 <div class="form-group">
26 <label for="category">Category</label> 29 <label for="category">Category</label>
27 <select class="form-control" id="category" formControlName="category"> 30 <select class="form-control" id="category" formControlName="category">
28 <option></option> 31 <option></option>
29 <option *ngFor="let category of videoCategories" [value]="category.id">{{ category.label }}</option> 32 <option *ngFor="let category of videoCategories" [value]="category.id">{{ category.label }}</option>
30 </select> 33 </select>
31 34
32 <div *ngIf="formErrors.category" class="alert alert-danger"> 35 <div *ngIf="formErrors.category" class="alert alert-danger">
33 {{ formErrors.category }} 36 {{ formErrors.category }}
37 </div>
34 </div> 38 </div>
35 </div>
36 39
37 <div class="form-group"> 40 <div class="form-group">
38 <label for="licence">Licence</label> 41 <label for="licence">Licence</label>
39 <select class="form-control" id="licence" formControlName="licence"> 42 <select class="form-control" id="licence" formControlName="licence">
40 <option></option> 43 <option></option>
41 <option *ngFor="let licence of videoLicences" [value]="licence.id">{{ licence.label }}</option> 44 <option *ngFor="let licence of videoLicences" [value]="licence.id">{{ licence.label }}</option>
42 </select> 45 </select>
43 46
44 <div *ngIf="formErrors.licence" class="alert alert-danger"> 47 <div *ngIf="formErrors.licence" class="alert alert-danger">
45 {{ formErrors.licence }} 48 {{ formErrors.licence }}
49 </div>
46 </div> 50 </div>
47 </div>
48 51
49 <div class="form-group"> 52 <div class="form-group">
50 <label for="language">Language</label> 53 <label for="language">Language</label>
51 <select class="form-control" id="language" formControlName="language"> 54 <select class="form-control" id="language" formControlName="language">
52 <option></option> 55 <option></option>
53 <option *ngFor="let language of videoLanguages" [value]="language.id">{{ language.label }}</option> 56 <option *ngFor="let language of videoLanguages" [value]="language.id">{{ language.label }}</option>
54 </select> 57 </select>
55 58
56 <div *ngIf="formErrors.language" class="alert alert-danger"> 59 <div *ngIf="formErrors.language" class="alert alert-danger">
57 {{ formErrors.language }} 60 {{ formErrors.language }}
61 </div>
58 </div> 62 </div>
59 </div>
60 63
61 <div class="form-group"> 64 <div class="form-group">
62 <label for="tags" class="label-tags">Tags</label> <span class="little-information">(press enter to add the tag)</span> 65 <label for="tags" class="label-tags">Tags</label> <span class="little-information">(press enter to add the tag)</span>
63 <tag-input 66 <tag-input
64 [ngModel]="tags" [validators]="tagValidators" [errorMessages]="tagValidatorsMessages" 67 [ngModel]="tags" [validators]="tagValidators" [errorMessages]="tagValidatorsMessages"
65 formControlName="tags" maxItems="3" modelAsStrings="true" 68 formControlName="tags" maxItems="3" modelAsStrings="true"
66 ></tag-input> 69 ></tag-input>
67 </div> 70 </div>
68 71
69 <div class="form-group"> 72 <div class="form-group">
70 <label for="description">Description</label> 73 <label for="description">Description</label>
71 <textarea 74 <textarea
72 id="description" class="form-control" placeholder="Description..." 75 id="description" class="form-control" placeholder="Description..."
73 formControlName="description" 76 formControlName="description"
74 > 77 >
75 </textarea> 78 </textarea>
76 <div *ngIf="formErrors.description" class="alert alert-danger"> 79 <div *ngIf="formErrors.description" class="alert alert-danger">
77 {{ formErrors.description }} 80 {{ formErrors.description }}
81 </div>
78 </div> 82 </div>
79 </div>
80 83
81 <div class="form-group"> 84 <div class="form-group">
82 <input 85 <input
83 type="button" value="Update" class="btn btn-default form-control" 86 type="button" value="Update" class="btn btn-default form-control"
84 (click)="update()" 87 (click)="update()"
85 > 88 >
89 </div>
90 </form>
86 </div> 91 </div>
87</form> 92</div>