Video

کامپوننت x-video برای نمایش ویدیوهای تعاملی و مدرن در صفحات Blade استفاده می‌شود. این کامپوننت مبتنی بر video.js بوده و امکانات متنوعی برای کنترل ظاهر و رفتار ویدیو را در اختیار شما قرار می‌دهد. همچنین از فایل‌های مدل Dornica و آدرس‌های مستقیم ویدیو پشتیبانی می‌کند.

ویژگی‌ها

نام پراپ	نوع داده	مقدار پیش‌فرض	توضیحات
`src`	`string\|int\|object`	-	آدرس ویدیو (مستقیم، عدد آی‌دی فایل، یا مدل فایل)
`id`	`string`	`تصادفی`	شناسه یکتا برای ویدیو (در صورت عدم تعیین، به صورت تصادفی ساخته می‌شود)
`containerClass`	`string`	`null`	کلاس CSS اضافی برای کانتینر اصلی
`class`	`string`	`null`	کلاس CSS اضافی برای تگ `<video>`
`controls`	`boolean`	`true`	نمایش کنترل‌های ویدیو
`autoplay`	`boolean`	`false`	پخش خودکار ویدیو
`loop`	`boolean`	`false`	تکرار ویدیو پس از اتمام
`muted`	`boolean`	`false`	بی‌صدا بودن ویدیو
`poster`	`string`	`null`	آدرس تصویر پیش‌نمایش (پوستر)

نکات مهم

پراپرتی src می‌تواند یک آدرس مستقیم، آی‌دی فایل (int)، یا مدل فایل باشد. اگر عدد یا مدل فایل باشد، آدرس فایل از FileManager استخراج می‌شود.
اگر id تعیین نشود، به صورت خودکار یک مقدار یکتا تولید می‌شود.

مثال‌ها

نمونه پایه

<div class="col-md-6">
    <x-video src="https://vjs.zencdn.net/v/oceans.mp4" />
</div>

<div class="col-md-6">
    <x-video
        src="https://vjs.zencdn.net/v/oceans.mp4"
        poster="https://dornica.net/wp-content/uploads/2025/07/slider.webp"
    />
</div>

ویژگی‌ها​

نکات مهم​

مثال‌ها​

نمونه پایه​

ویژگی‌ها

نکات مهم

مثال‌ها

نمونه پایه