wip

app/Filament/Clusters/VisaMasterPayments/Resources/VisaMasterPaymentOrders/Schemas/VisaMasterPaymentOrderInfolist.php

@@ -6,6 +6,7 @@ use App\Modules\OrderStatus\Repositories\OrderStatusRepository;
 use App\Modules\Region\Repositories\RegionRepository;
 use App\Modules\TurkmenPassport\Repositories\TurkmenPassportRepository;
 use App\Modules\VisaMasterPaymentOrder\Models\VisaMasterPaymentOrder;
+use Filament\Forms\Components\SpatieMediaLibraryFileUpload;
 use Filament\Infolists\Components\IconEntry;
 use Filament\Infolists\Components\SpatieMediaLibraryImageEntry;
 use Filament\Infolists\Components\TextEntry;
@@ -68,6 +69,10 @@ class VisaMasterPaymentOrderInfolist
                 Tabs::make('Order Information')
                     ->tabs([
                         Tab::make(__('Payment sender data'))
+                            ->columns(8)
+                            ->schema([
+                                Fieldset::make(__('Data'))
+                                    ->columnSpan(8)
                                     ->columns(8)
                                     ->schema([
                                         TextEntry::make('sender_full_name')
@@ -100,6 +105,7 @@ class VisaMasterPaymentOrderInfolist
                                             ->label(__('Address'))
                                             ->columnSpan(4)
                                             ->placeholder('-'),
+                                    ]),
 
                                 Section::make(__('Files'))
                                     ->description('PNG, JPEG, PDF')

composer.json

@@ -49,6 +49,12 @@
             "Tests\\": "tests/"
         }
     },
+    "repositories": [
+        {
+            "type": "composer",
+            "url": "https://satis.ralphjsmit.com"
+        }
+    ],
     "scripts": {
         "post-autoload-dump": [
             "Illuminate\\Foundation\\ComposerScripts::postAutoloadDump",

lang/tk.json

@@ -727,5 +727,6 @@
     "Payment": "Töleg",
     "Online payments": "Onlaýn tölegler",
     "USD rate": "USD kursy",
-    "Total": "Jemi"
+    "Total": "Jemi",
+    "Data": "Maglumatlar"
 }

lang/vendor/filament-media-action/en/media-action.php

@@ -0,0 +1,7 @@
+<?php
+
+// translations for Hugomyb/FilamentMediaAction
+return [
+    'loading' => 'Loading...',
+    'unsupported-media-type' => 'Unsupported media type.',
+];

lang/vendor/filament-media-action/fr/media-action.php

@@ -0,0 +1,6 @@
+<?php
+
+return [
+    'loading' => 'Chargement...',
+    'unsupported-media-type' => 'Type de média non pris en charge.',
+];

lang/vendor/filament-media-action/it/media-action.php

@@ -0,0 +1,7 @@
+<?php
+
+// translations for Hugomyb/FilamentMediaAction
+return [
+    'loading' => 'Caricamento...',
+    'unsupported-media-type' => 'Tipo di file non supportato.',
+];

resources/views/vendor/filament-media-action/actions/media-modal-content.blade.php

@@ -0,0 +1,147 @@
+<div class="w-full flex flex-col justify-center items-center h-full"
+     x-data="{
+            loading: true,
+            autoplayed: false,
+
+            init() {
+                this.loading = true;
+                let mediaElement = this.$refs.mediaFrame;
+
+                if (!mediaElement) {
+                    this.loading = false;
+                    return;
+                }
+
+                if (mediaElement.tagName === 'VIDEO' || mediaElement.tagName === 'AUDIO') {
+                    mediaElement.load();
+
+                    mediaElement.onload = () => {
+                        this.loading = false;
+                    };
+                    mediaElement.oncanplaythrough = () => {
+                        this.loading = false;
+                    };
+                    mediaElement.onloadstart = () => {
+                        this.loading = true;
+                    };
+                    mediaElement.onerror = () => {
+                        this.loading = false;
+                    };
+
+                    if (mediaElement.readyState >= 3) {
+                        this.loading = false;
+                    }
+
+                    // Autoplay logic
+                    if (@js($autoplay) && mediaElement.play) {
+                        this.autoplayed = true;
+                        mediaElement.play().catch(() => {
+                            console.log('Autoplay failed or was blocked.');
+                        });
+                    }
+                } else {
+                    this.loading = true;
+
+                    mediaElement.onload = () => {
+                        setTimeout(() => {
+                            this.loading = false;
+                        }, 200);
+                    };
+                    mediaElement.onerror = () => {
+                        this.loading = false;
+                    };
+                }
+            },
+
+            resetAutoplay() {
+                this.autoplayed = false;
+            }
+        }"
+     @open-modal.window="resetAutoplay"
+>
+
+    <div class="flex h-full flex-col justify-center items-center" x-show="loading">
+        <x-filament::loading-indicator class="h-10 w-10" />
+        <span class="text-center font-bold">{{ __('filament-media-action::media-action.loading') }}</span>
+    </div>
+
+    <div class="mediaContainer w-full flex flex-col justify-center items-center h-full" x-show="!loading">
+        @if ($mediaType === \Hugomyb\FilamentMediaAction\Actions\MediaAction::TYPE_YOUTUBE)
+            @php
+                $youtubeId = '';
+
+                // Parse the URL to get components
+                $parsedUrl = parse_url($media);
+
+                if (isset($parsedUrl['host'])) {
+                    // Check if it's a youtu.be short URL
+                    if (str_contains($parsedUrl['host'], 'youtu.be')) {
+                        $youtubeId = ltrim($parsedUrl['path'], '/');
+                    }
+                    // Check if it's a regular youtube.com URL
+                    elseif (str_contains($parsedUrl['host'], 'youtube.com')) {
+                        parse_str($parsedUrl['query'] ?? '', $queryParams);
+                        $youtubeId = $queryParams['v'] ?? '';
+                    }
+                }
+            @endphp
+
+            @if ($youtubeId)
+                <iframe x-ref="mediaFrame" class="rounded-lg" width="100%"
+                        src="https://www.youtube.com/embed/{{ $youtubeId }}{{ $autoplay ? '?autoplay=1' : '' }}"
+                        frameborder="0"
+                        style="aspect-ratio: 16 / 9;"
+                        allowfullscreen
+                ></iframe>
+            @else
+                <p>Invalid YouTube URL.</p>
+            @endif
+
+        @elseif ($mediaType === \Hugomyb\FilamentMediaAction\Actions\MediaAction::TYPE_AUDIO)
+            <audio
+                    x-ref="mediaFrame"
+                    class="rounded-lg w-full"
+                    style="width: 100%"
+                    controls
+                    @if($controlsList) controlsList="{{ $controlsList }}" @endif
+                    @canplay="loading = false"
+                    @loadeddata="loading = false"
+                    @play="loading = false"
+                    {{ $preload ? '' : 'preload="none"' }}
+            >
+                <source src="{{ $media }}" @if($mime && $mime !== 'unknown') type="{{ $mime }}" @endif>
+                Your browser does not support the audio element.
+            </audio>
+
+        @elseif ($mediaType === \Hugomyb\FilamentMediaAction\Actions\MediaAction::TYPE_VIDEO)
+            <video
+                    x-ref="mediaFrame"
+                    class="rounded-lg w-full"
+                    width="100%"
+                    style="aspect-ratio: 16 / 9;"
+                    controls
+                    playsinline
+                    @if($controlsList) controlsList="{{ $controlsList }}" @endif
+                    @canplaythrough="loading = false"
+                    {{ $preload ? '' : 'preload="none"' }}
+            >
+                <source src="{{ $media }}" @if($mime && $mime !== 'unknown') type="{{ $mime }}" @endif>
+                Your browser does not support the video tag.
+            </video>
+
+        @elseif ($mediaType === \Hugomyb\FilamentMediaAction\Actions\MediaAction::TYPE_IMAGE)
+
+            <img x-ref="mediaFrame" class="rounded-lg" src="{{ $media }}" alt="Media Image"
+                 style="max-width: 100%; height: auto;" @load="loading = false">
+
+        @elseif ($mediaType === \Hugomyb\FilamentMediaAction\Actions\MediaAction::TYPE_PDF)
+
+            <iframe x-ref="mediaFrame" class="rounded-lg" style="min-height: 600px"
+                    src="{{ $media }}" width="100%" height="100%"
+                    @load="loading = false"></iframe>
+
+        @else
+            <p>{{ __('filament-media-action::unsupported-media-type') }}</p>
+        @endif
+    </div>
+</div>