Untitled

 avatar
unknown
php
2 years ago
2.2 kB
3
Indexable
<div>
    @if($link->isUploadedOnStorage())
        <div
            x-data="{
                      storageLink : null,
                      timestamp : $wire.entangle('timestamp').defer,
                    }"
            x-init='storageLink = $refs.storageLink;
                    $watch("timestamp", value => $dispatch("update-file-timestamp", value)); '
            class="my-5">

            <div class="relative w-full">
                @if($canCapture)
                    <div class="relative">
                        <video class="w-full h-full bg-striped rounded-md" style="max-height: 30rem"
                               src="{{ $link->stream_url }}#t={{ $timestamp }}"
                               crossorigin="anonymous"
                               x-ref="video"
                               controls>
                        </video>

                        <div class="absolute top-2 right-2">
                            <x-buttons.primary type="button"
                                               class=" flex items-center gap-1"
                                               @click="$dispatch('video-captured', snapshotVideo($refs.video))">
                                <x:icons.captured class="w-4 h-4"/>
                                <span>Snapshot</span>
                            </x-buttons.primary>
                        </div>
                    </div>
                @else
                    <div class="storage-video">
                        <video class="w-full h-full bg-striped rounded-md" style="max-height: 30rem"
                               x-on:click.away="storageLink.pause(); timestamp = storageLink.currentTime"
                               x-ref="storageLink"
                               src="{{ $link->stream_url }}#t={{ $timestamp }}"
                               id="video-{{ $link->id }}" controls>
                        </video>
                    </div>
                @endif
            </div>
        </div>
    @else
        <div>
            <div class="my-5">
                <iframe class="w-full" style="height: 32rem;"
                        src="{{ $link->stream_url }}"></iframe>
            </div>
        </div>
    @endif
</div>
Editor is loading...