aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src/app/videos/+video-watch/modal/video-share.component.html
blob: 02f5f0f44872ba7cf41595d887163de42ffa1929 (plain) (blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
<ng-template #modal let-hide="close">
  <div class="modal-header">
    <h4 i18n class="modal-title">Share</h4>
    <span class="close" aria-hidden="true" (click)="hide()"></span>
  </div>

  <div class="modal-body">
    <div class="form-group">
      <label i18n>URL</label>
      <div class="input-group input-group-sm">
        <input #urlInput (click)="urlInput.select()" type="text" class="form-control input-sm readonly" readonly [value]="getVideoUrl()" />
        <div class="input-group-append">
          <button [ngxClipboard]="urlInput" (click)="activateCopiedMessage()" type="button" class="btn btn-outline-secondary">
            <span class="glyphicon glyphicon-copy"></span>
          </button>
        </div>
      </div>
    </div>

    <div class="form-group">
      <label i18n>Embed</label>
      <div class="input-group input-group-sm">
        <input #shareInput (click)="shareInput.select()" type="text" class="form-control input-sm readonly" readonly [value]="getVideoIframeCode()" />
        <div class="input-group-append">
          <button [ngxClipboard]="shareInput" (click)="activateCopiedMessage()" type="button" class="btn btn-outline-secondary">
            <span class="glyphicon glyphicon-copy"></span>
          </button>
        </div>
      </div>
    </div>

    <div i18n *ngIf="notSecure()" class="alert alert-warning">
      The url is not secured (no HTTPS), so the embed video won't work on HTTPS websites (web browsers block non secured HTTP requests on HTTPS websites).
    </div>

    <div class="form-group qr-code-group">
      <label i18n>QR-Code</label>
      <ngx-qrcode qrc-element-type="url" [qrc-value]="getVideoUrl()" qrc-errorCorrectionLevel="Q"></ngx-qrcode>
    </div>
  </div>

  <div class="modal-footer inputs">
    <span i18n class="action-button action-button-cancel" (click)="hide()">Cancel</span>
  </div>

</ng-template>