added clips list theme part

added dor clip theme part
fixed some clip upload bug
fixe product preview permission
optimized mp3 & mp4 player
pull/49/head
A1Gard 3 months ago
parent 65bc608437
commit 211c0de4c8

@ -88,6 +88,9 @@ class ClipController extends XController
config('app.media.watermark_size'), Unit::Percent, Fit::Contain,
config('app.media.watermark_opacity'));
}
if (!file_exists(storage_path() . '/app/public/cover')){
mkdir(storage_path() . '/app/public/cover/');
}
$i->save(storage_path() . '/app/public/cover/optimized-'. $clip->$key);
}

@ -4,6 +4,7 @@ namespace App\Http\Controllers;
use App\Models\Attachment;
use App\Models\Category;
use App\Models\Clip;
use App\Models\Comment;
use App\Models\Customer;
use App\Models\Gallery;
@ -44,6 +45,18 @@ class ClientController extends Controller
return view('client.post', compact('area', 'post', 'title', 'subtitle'));
}
public function clip(Clip $clip)
{
if ($clip->status = 0 && !auth()->check()) {
return abort(403);
}
$area = 'clip';
$title = $clip->title;
$subtitle = '';
return view('client.default-list', compact('area', 'clip', 'title', 'subtitle'));
}
public function gallery(Gallery $gallery)
{
if ($gallery->status = 0 && !auth()->check()) {
@ -85,6 +98,15 @@ class ClientController extends Controller
->orderByDesc('id')->paginate($this->paginate);
return view('client.default-list', compact('area', 'galleries', 'title', 'subtitle'));
}
public function clips()
{
$area = 'clips-list';
$title = __("Video clips list");
$subtitle = '';
$clips = Clip::where('status', 1)
->orderByDesc('id')->paginate($this->paginate);
return view('client.default-list', compact('area', 'clips', 'title', 'subtitle'));
}
public function attachments()
{
@ -167,6 +189,9 @@ class ClientController extends Controller
public function product(Product $product)
{
if ($product->status = 0 && !auth()->check()) {
return abort(403);
}
$area = 'product';
$title = $product->name;
$subtitle = $product->excerpt; // WIP SEO

@ -25,7 +25,7 @@ class ClipSaveRequest extends FormRequest
'title' => ['required', 'string', 'max:255','min:5'],
'body' => ['nullable', 'string',],
'active' => ['nullable', 'boolean'],
'clip' => ['nullable', 'mimes:mp4', 'max:'.'max:'.getMaxUploadSize()],
'clip' => ['nullable', 'mimes:mp4', 'max:'.getMaxUploadSize()],
'cover' => ['nullable', 'image', 'mimes:jpeg,png,jpg,gif,svg', 'max:2048'],
];
}

@ -22,10 +22,10 @@ class Clip extends Model
public function imgUrl()
{
if ($this->cover == null) {
return asset('assets/upload/logo.svg');;
return asset('assets/upload/logo.svg');
}
return \Storage::url('clips/optimized-' . $this->cover);
return \Storage::url('cover/optimized-' . $this->cover);
}
public function imgOriginalUrl()
{
@ -55,8 +55,7 @@ class Clip extends Model
}
public function webUrl(){
return '#';// WIP
return route('');
return route('client.clip',$this->slug);
}

@ -64,14 +64,14 @@ export default {
}
},
mounted() {
// window.addEventListener('load',()=>{
window.addEventListener('load',()=>{
setTimeout(() => {
this.link = this.asset;
}, 500);
setInterval(() => {
this.updatePlayer();
}, 300);
// });
});
},
computed: {

@ -1,6 +1,6 @@
<template>
<div class="mp4-player">
<video ref="p" :src="link" class="video"></video>
<video ref="p" :src="link" class="video" :poster="cover"></video>
<div class="seek-container">
<div ref="seekbar" class="seekbar" @click="seek">
<div class="progress-seek" :style="progressPercent"></div>
@ -61,17 +61,21 @@ export default {
props: {
asset: {
required: true
},
cover:{
default: null,
}
},
mounted() {
// window.addEventListener('load',()=>{
window.addEventListener('load',()=>{
setTimeout(() => {
this.link = this.asset;
document.querySelector('#video-preview-botz').style.display = 'none';
}, 500);
setInterval(() => {
this.updatePlayer();
}, 300);
// });
});
},
computed: {
@ -148,6 +152,7 @@ export default {
border: 1px solid var(--xshop-primary);
padding: 1rem;
border-radius: var(--xshop-border-radius);
overflow: hidden;
}

@ -0,0 +1,15 @@
<section class='DorClip content'>
<div class="{{gfx()['container']}}">
<h1>
{{$title}}
</h1>
<div id="video-preview-botz">
<video controls src="{{$clip->fileUrl()}}" poster="{{$clip->imgUrl()}}"></video>
</div>
<mp4player
asset="{{$clip->fileUrl()}}" cover="{{$clip->imgUrl()}}"></mp4player>
<div class="text-muted clip-body ps-4 border-end-0 mt-4">
{!! $clip->body !!}
</div>
</div>
</section>

@ -0,0 +1,10 @@
{
"name": "DorClip",
"version": "1.0",
"author": "xStack",
"email": "xshop@xstack.ir",
"license": "GPL-3.0-or-later",
"url": "https:\/\/xstack.ir",
"author_url": "https:\/\/4xmen.ir",
"packages": []
}

@ -0,0 +1,21 @@
<?php
namespace Resources\Views\Segments;
use App\Models\Part;
class DorClip
{
public static function onAdd(Part $part = null)
{
}
public static function onRemove(Part $part = null)
{
}
public static function onMount(Part $part = null)
{
return $part;
}
}

@ -0,0 +1,16 @@
.DorClip {
padding: 3rem 0;
h1{
font-size: 30px;
font-weight: 300;
margin-bottom: 1rem;
}
.clip-body{
border: 3px solid var(--xshop-primary);
border-top: 0;
border-bottom: 0;
}
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 458 KiB

@ -0,0 +1,26 @@
<section class='ClipListGrid content'>
<div class="{{gfx()['container']}}">
<h1>
{{$title}}
</h1>
<div class="row">
@foreach($clips as $clip)
<div class="col-lg-4">
<div class="clip-grid-item">
<a href="{{$clip->webUrl()}}">
<img src="{{$clip->imgUrl()}}" alt="">
<h2>
<span>
{{$clip->title}}
</span>
<i class="ri-play-circle-line"></i>
</h2>
</a>
</div>
</div>
@endforeach
</div>
</div>
</section>

@ -0,0 +1,10 @@
{
"name": "ClipListGrid",
"version": "1.0",
"author": "xStack",
"email": "xshop@xstack.ir",
"license": "GPL-3.0-or-later",
"url": "https:\/\/xstack.ir",
"author_url": "https:\/\/4xmen.ir",
"packages": []
}

@ -0,0 +1,21 @@
<?php
namespace Resources\Views\Segments;
use App\Models\Part;
class ClipListGrid
{
public static function onAdd(Part $part = null)
{
}
public static function onRemove(Part $part = null)
{
}
public static function onMount(Part $part = null)
{
return $part;
}
}

@ -0,0 +1,79 @@
.ClipListGrid {
.container,.container-fluid{
overflow: hidden;
}
h1{
font-size: 30px;
font-weight: 200;
text-align: center;
margin-bottom: 1rem;
}
padding: 2rem 0;
.clip-grid-item {
position: relative;
height: 25vh;
border-radius: var(--xshop-border-radius);
overflow: hidden;
margin-bottom: 2rem;
img {
position: absolute;
width: 100%;
height: 100%;
left: 0;
right: 0;
bottom: 0;
top: 0;
object-fit: cover;
}
h2 {
display: flex;
position: absolute;
z-index: 2;
background: rgba($xshop-diff, .7);
padding: 7px;
bottom: 0;
left: 0;
right: 0;
backdrop-filter: blur(5px);
margin-bottom: 0;
font-weight: 400;
justify-content: center;
align-items: center;
text-align: center;
transition: 500ms;
height: 3.5rem;
i{
transition: 500ms;
font-size: 0;
}
span{
transition: 500ms;
font-size: 20px;
}
}
&:hover {
h2 {
right: 1rem;
left: 1rem;
bottom: 1rem;
border-radius: var(--xshop-border-radius);
height: calc(100% - 2rem);
span{
font-size: 0;
}
i{
font-size: 75px;
}
}
}
}
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 501 KiB

@ -370,11 +370,13 @@ Route::middleware([\App\Http\Middleware\VisitorCounter::class])
Route::get('/customer/profile', [\App\Http\Controllers\ClientController::class,'profile'])->name('profile');
Route::get('/compare', [\App\Http\Controllers\ClientController::class,'compare'])->name('compare');
Route::get('/galleries', [\App\Http\Controllers\ClientController::class,'galleries'])->name('galleries');
Route::get('/videos', [\App\Http\Controllers\ClientController::class,'clips'])->name('clips');
Route::get('/products', [\App\Http\Controllers\ClientController::class,'products'])->name('products');
Route::get('/attachments', [\App\Http\Controllers\ClientController::class,'attachments'])->name('attachments');
Route::get('/attachment/{attachment}', [\App\Http\Controllers\ClientController::class,'attachment'])->name('attachment');
Route::get('/tag/{post}', [\App\Http\Controllers\ClientController::class,'tag'])->name('tag'); // wip
Route::get('/tag/{slug}', [\App\Http\Controllers\ClientController::class,'tag'])->name('tag'); // wip
Route::get('/product/{product}', [\App\Http\Controllers\ClientController::class,'product'])->name('product');
Route::get('/video/{clip}', [\App\Http\Controllers\ClientController::class,'clip'])->name('clip');
Route::get('/category/{category}', [\App\Http\Controllers\ClientController::class,'category'])->name('category');
Route::get('/gallery/{gallery}', [\App\Http\Controllers\ClientController::class,'gallery'])->name('gallery');
Route::get('/search', [\App\Http\Controllers\ClientController::class,'search'])->name('search');

Loading…
Cancel
Save