1 <div *
ngIf=
"!isUploadingVideo" class=
"upload-video-container" myDragDrop (fileDropped)=
"onFileDropped($event)">
2 <div class=
"first-step-block">
3 <my-global-icon class=
"upload-icon" iconName=
"upload" aria-hidden=
"true"></my-global-icon>
5 <div class=
"button-file form-control" [ngbTooltip]=
"'(extensions: ' + videoExtensions + ')'">
6 <span i18n
>Select the file to upload
</span>
8 aria-label=
"Select the file to upload"
11 [accept]=
"videoExtensions"
12 (change)=
"onFileChange($event)"
18 <div class=
"form-group form-group-channel">
19 <label i18n
for=
"first-step-channel">Channel
</label>
21 labelForId=
"first-step-channel" [items]=
"userVideoChannels" [(ngModel)]=
"firstStepChannelId"
25 <div class=
"form-group">
26 <label i18n
for=
"first-step-privacy">Privacy
</label>
28 labelForId=
"first-step-privacy" [items]=
"videoPrivacies" [(ngModel)]=
"firstStepPrivacyId"
32 <ng-container *
ngIf=
"isUploadingAudioFile">
33 <div class=
"form-group audio-preview">
34 <label i18n
for=
"previewfileUpload">Video background image
</label>
36 <div i18n
class=
"audio-image-info">
37 Image that will be merged with your audio file.
39 The chosen image will be definitive and cannot be modified.
43 i18n-inputLabel
inputLabel=
"Edit" inputName=
"previewfileUpload" [(ngModel)]=
"previewfileUpload"
44 previewWidth=
"360px" previewHeight=
"200px"
48 <div class=
"form-group upload-audio-button">
50 className=
"orange-button"
51 [label]=
"getAudioUploadLabel()"
53 (click)=
"uploadAudio()"
61 <!-- Upload progress/cancel/error/success header -->
62 <div *
ngIf=
"isUploadingVideo && !error" class=
"upload-progress-cancel">
63 <div class=
"progress" i18n-title
title=
"Total video uploaded">
64 <div class=
"progress-bar" role=
"progressbar" [style]=
"{ width: videoUploadPercents + '%' }" [attr.aria-valuenow]=
"videoUploadPercents" aria-valuemin=
"0" [attr.aria-valuemax]=
"100">
65 <span *
ngIf=
"videoUploadPercents === 100 && videoUploaded === false" i18n
>Processing…
</span>
66 <span *
ngIf=
"videoUploadPercents !== 100 || videoUploaded">{{ videoUploadPercents }}%
</span>
69 <input *
ngIf=
"videoUploaded === false" type=
"button" i18n-value=
"Cancel ongoing upload of a video" value=
"Cancel" (click)=
"cancelUpload()" />
72 <div *
ngIf=
"error && enableRetryAfterError" class=
"upload-progress-retry">
73 <div class=
"progress">
74 <div class=
"progress-bar red" role=
"progressbar" [style]=
"{ width: '100%' }" [attr.aria-valuenow]=
"100" aria-valuemin=
"0" [attr.aria-valuemax]=
"100">
75 <span>{{ error }}
</span>
79 <div class=
"btn-group" role=
"group">
80 <input type=
"button" class=
"btn" i18n-value=
"Retry failed upload of a video" value=
"Retry" (click)=
"retryUpload()" />
81 <input type=
"button" class=
"btn" i18n-value=
"Cancel ongoing upload of a video" value=
"Cancel" (click)=
"cancelUpload()" />
85 <div *
ngIf=
"error && !enableRetryAfterError" class=
"alert alert-danger">
86 <div i18n
>Sorry, but something went wrong
</div>
90 <div *
ngIf=
"videoUploaded && !error" class=
"alert alert-info" i18n
>
91 Congratulations! Your video is now available in your private library.
94 <!-- Hidden because we want to load the component -->
95 <form [hidden]=
"!isUploadingVideo" novalidate [formGroup]=
"form" class=
"mb-3">
97 [form]=
"form" [formErrors]=
"formErrors" [videoCaptions]=
"videoCaptions"
98 [validationMessages]=
"validationMessages" [userVideoChannels]=
"userVideoChannels"
99 [waitTranscodingEnabled]=
"true" [forbidScheduledPublication]=
"false"
103 <div class=
"submit-container">
104 <div i18n *
ngIf=
"videoUploaded === false" class=
"message-submit">Publish will be available when upload is finished
</div>
106 <my-button className=
"orange-button" i18n-label
label=
"Publish" icon=
"circle-tick"
107 (click)=
"updateSecondStep()" (keydown.enter)=
"updateSecondStep()"
108 [disabled]=
"isPublishingButtonDisabled()"