aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src/app/videos/+video-edit/video-add.component.html
diff options
context:
space:
mode:
authorChocobozzz <florian.bigard@gmail.com>2017-12-07 16:32:06 +0100
committerChocobozzz <florian.bigard@gmail.com>2017-12-07 16:32:06 +0100
commit27e1a06c331278e5d37bc5172ee7e4fc968e4b5e (patch)
treeb00296c59e573a80dc8f826dce6fe857eea123c5 /client/src/app/videos/+video-edit/video-add.component.html
parent4cc66133abf1e37873316999b660c93ab92eb4a0 (diff)
downloadPeerTube-27e1a06c331278e5d37bc5172ee7e4fc968e4b5e.tar.gz
PeerTube-27e1a06c331278e5d37bc5172ee7e4fc968e4b5e.tar.zst
PeerTube-27e1a06c331278e5d37bc5172ee7e4fc968e4b5e.zip
First step upload with new design
Diffstat (limited to 'client/src/app/videos/+video-edit/video-add.component.html')
-rw-r--r--client/src/app/videos/+video-edit/video-add.component.html142
1 files changed, 23 insertions, 119 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 b4e0f9f7c..f8355f3db 100644
--- a/client/src/app/videos/+video-edit/video-add.component.html
+++ b/client/src/app/videos/+video-edit/video-add.component.html
@@ -1,141 +1,45 @@
1<div class="row"> 1<div class="margin-content">
2 <div class="content-padding"> 2 <div class="title-page title-page-single">
3 Upload your video
4 </div>
3 5
4 <h3>Upload a video</h3> 6 <div *ngIf="error" class="alert alert-danger">{{ error }}</div>
5 7
6 <div *ngIf="error !== undefined" class="alert alert-danger">{{ error }}</div> 8 <div class="upload-video-container">
9 <div class="upload-video">
10 <div class="icon icon-upload"></div>
7 11
8 <form novalidate [formGroup]="form"> 12 <div class="button-file">
9 <div class="form-group"> 13 <span>Select the file to upload</span>
10 <label for="name">Name</label> 14 <input #videofileInput type="file" name="videofile" id="videofile" (change)="fileChange($event)" />
11 <input
12 type="text" class="form-control" id="name"
13 formControlName="name"
14 >
15 <div *ngIf="formErrors.name" class="alert alert-danger">
16 {{ formErrors.name }}
17 </div>
18 </div> 15 </div>
19 16
20 <div class="form-group"> 17 <div class="form-group">
21 <label for="privacy">Privacy</label> 18 <select [(ngModel)]="firstStepPrivacy">
22 <select class="form-control" id="privacy" formControlName="privacy">
23 <option></option>
24 <option *ngFor="let privacy of videoPrivacies" [value]="privacy.id">{{ privacy.label }}</option> 19 <option *ngFor="let privacy of videoPrivacies" [value]="privacy.id">{{ privacy.label }}</option>
25 </select> 20 </select>
26
27 <div *ngIf="formErrors.privacy" class="alert alert-danger">
28 {{ formErrors.privacy }}
29 </div>
30 </div>
31
32 <div class="form-group">
33 <input
34 type="checkbox" id="nsfw"
35 formControlName="nsfw"
36 >
37 <label for="nsfw">This video contains mature or explicit content</label>
38 </div> 21 </div>
39 22
40 <div class="form-group"> 23 <div class="form-group">
41 <label for="category">Channel</label> 24 <select [(ngModel)]="firstStepChannel">
42 <select class="form-control" id="channelId" formControlName="channelId">
43 <option *ngFor="let channel of userVideoChannels" [value]="channel.id">{{ channel.label }}</option> 25 <option *ngFor="let channel of userVideoChannels" [value]="channel.id">{{ channel.label }}</option>
44 </select> 26 </select>
45
46 <div *ngIf="formErrors.channelId" class="alert alert-danger">
47 {{ formErrors.channelId }}
48 </div>
49 </div> 27 </div>
28 </div>
50 29
51 <div class="form-group">
52 <label for="category">Category</label>
53 <select class="form-control" id="category" formControlName="category">
54 <option></option>
55 <option *ngFor="let category of videoCategories" [value]="category.id">{{ category.label }}</option>
56 </select>
57 30
58 <div *ngIf="formErrors.category" class="alert alert-danger"> 31 <form *ngIf="isUploadingVideo" novalidate [formGroup]="form">
59 {{ formErrors.category }} 32 <my-video-edit
60 </div> 33 [form]="form" [formErrors]="formErrors"
61 </div> 34 [validationMessages]="validationMessages" [videoPrivacies]="videoPrivacies"
62 35 ></my-video-edit>
63 <div class="form-group">
64 <label for="licence">Licence</label>
65 <select class="form-control" id="licence" formControlName="licence">
66 <option></option>
67 <option *ngFor="let licence of videoLicences" [value]="licence.id">{{ licence.label }}</option>
68 </select>
69
70 <div *ngIf="formErrors.licence" class="alert alert-danger">
71 {{ formErrors.licence }}
72 </div>
73 </div>
74
75 <div class="form-group">
76 <label for="language">Language</label>
77 <select class="form-control" id="language" formControlName="language">
78 <option></option>
79 <option *ngFor="let language of videoLanguages" [value]="language.id">{{ language.label }}</option>
80 </select>
81 36
82 <div *ngIf="formErrors.language" class="alert alert-danger"> 37 <div class="submit-container">
83 {{ formErrors.language }} 38 <div class="submit-button" [ngClass]="{ disabled: !form.valid }">
39 <span class="icon icon-validate"></span>
40 <input type="button" value="Publish" (click)="upload()" />
84 </div> 41 </div>
85 </div> 42 </div>
86
87 <div class="form-group">
88 <label class="label-tags">Tags</label> <span class="little-information">(press enter to add the tag)</span>
89 <tag-input
90 [ngModel]="tags" [validators]="tagValidators" [errorMessages]="tagValidatorsMessages"
91 formControlName="tags" maxItems="5" modelAsStrings="true"
92 ></tag-input>
93 </div>
94
95 <div class="form-group">
96 <label for="videofile">File</label>
97 <div class="btn btn-default btn-file">
98 <span>Select the video...</span>
99 <input #videofileInput type="file" name="videofile" id="videofile" (change)="fileChange($event)" />
100 <input type="hidden" name="videofileHidden" formControlName="videofile"/>
101 </div>
102 </div>
103
104 <div class="file-to-upload">
105 <div class="file" *ngIf="filename">
106 <span class="filename">{{ filename }}</span>
107 <span class="glyphicon glyphicon-remove" (click)="removeFile()"></span>
108 </div>
109 </div>
110
111 <div *ngIf="formErrors.videofile" class="alert alert-danger">
112 {{ formErrors.videofile }}
113 </div>
114
115 <div class="form-group">
116 <label for="description">Description</label>
117 <my-video-description formControlName="description"></my-video-description>
118
119 <div *ngIf="formErrors.description" class="alert alert-danger">
120 {{ formErrors.description }}
121 </div>
122 </div>
123
124 <div class="progress">
125 <progressbar [value]="progressPercent" max="100">
126 <ng-template [ngIf]="progressPercent === 100">
127 <span class="glyphicon glyphicon-refresh glyphicon-refresh-animate"></span>
128 Server is processing the video
129 </ng-template>
130 </progressbar>
131 </div>
132
133 <div class="form-group">
134 <input
135 type="button" value="Upload" class="btn btn-default form-control"
136 (click)="upload()"
137 >
138 </div>
139 </form> 43 </form>
140 </div> 44 </div>
141</div> 45</div>