ProVM/totalsport
3
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

FIX: no se podia subir los videos

Browse Source
This commit is contained in:
Aldarien
2020-06-18 02:16:32 -04:00
parent 0f26b53546
commit ef453fef56
9 changed files with 317 additions and 79 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
bootstrap/web/setup.php
View File

@ -17,15 +17,6 @@ return [
);
},
ProVM\TotalSport\Common\Service\MediaLoader::class => function(Container $c) {
$obj = new ProVM\TotalSport\Common\Service\MediaLoader($c->get('folders.images'), $c->get('urls')['images']);
$obj->setFFMpeg($c->get(FFMpeg\FFMpeg::class));
return $obj;
},
FFMpeg\FFMpeg::class => function(Container $c) {
$obj = null;
try {
$obj = FFMpeg\FFMpeg::create();
} catch (\Exception $e) {}
return $obj;
return new ProVM\TotalSport\Common\Service\MediaLoader($c->get('folders.images'), $c->get('urls')['images']);
}
];

34
common/Controller/Web/Admin/Eventos.php
View File

@ -123,4 +123,38 @@ class Eventos {
->withHeader('Content-Type', 'application/json')
->withStatus(201);
}
public function addVideo(Request $request, Response $response, Container $container, DataHandler $handler, MediaLoader $loader, $evento): Response {
$post = $request->getParsedBody();
$files = $request->getUploadedFiles();
if (count($files) == 0) {
$output = [
'informacion' => '',
'evento' => $evento,
'estado' => false
];
$response->getBody()->write(json_encode($output));
return $response->withHeader('Location', implode('/', [
$container->get('urls')['admin'],
'evento',
$evento
]));
}
$file = $files['video'];
$eventos = $handler->load('eventos');
$e = $eventos[$evento];
if (is_array($file)) {
$status = false;
foreach ($file as $f) {
$status |= $loader->add($e, $f);
}
} else {
$status = $loader->add($e, $file);
}
$response->getBody()->write(json_encode($output));
return $response->withHeader('Location', implode('/', [
$container->get('urls')['admin'],
'evento',
$evento
]));
}
}

54
common/Service/MediaLoader.php
View File

@ -11,10 +11,6 @@ class MediaLoader {
$this->folder = $media_folder;
$this->media_url = $media_assets_url;
}
protected $ffmpeg;
public function setFFMpeg(FFMpeg $ffmpeg) {
$this->ffmpeg = $ffmpeg;
}
protected function getFolder($event) {
return implode(DIRECTORY_SEPARATOR, [
$this->folder,
@ -40,7 +36,7 @@ class MediaLoader {
case 'avi':
case 'ogg':
case 'webm':
return implode(PHP_EOL, [
return implode('', [
'<video class="media" controls="controls">',
implode('', [
'<source src="',
@ -104,6 +100,9 @@ class MediaLoader {
$medias[$name]->{$type} = $obj;
}
array_walk($medias, function(&$item) {
if ($item->media === null) {
$item->media = $item->original;
}
if ($item->thumb === null) {
$item->thumb = $item->media;
}
@ -259,10 +258,6 @@ class MediaLoader {
]);
$file->moveTo($filename);
if ($this->ffmpeg === null) {
return file_exists($filename);
}
$thumb = implode(DIRECTORY_SEPARATOR, [
$folder,
implode('.', [
@ -274,23 +269,32 @@ class MediaLoader {
])
]);
$video = $this->ffmpeg->open($filename);
$video
->filters()
->resize(new FFMpeg\Coordinate\Dimension(320, 240))
->synchronize();
$video
->frame(FFMpeg\Coordinate\TimeCode::fromSeconds(1))
->save($thumb);
$media = implode(DIRECTORY_SEPARATOR, [
$folder,
implode('.', [
$base_name,
$extension
])
$image = imagecreatetruecolor(300, 300);
$black = imagecolorallocate($image, 0, 0, 0);
imagefill($image, 0, 0, $black);
$pfile = implode(DIRECTORY_SEPARATOR, [
dirname($this->folder, 3),
'resources',
'data',
'play.png'
]);
$video
->save(new FFMpeg\Format\Video\X264(), $media);
$play = imagecreatefrompng($pfile);
list($w, $h) = getimagesize($pfile);
$r = $w / $h;
$w = 100;
$h = $r * $w;
$play = imagescale($play, $w, $h);
$x = (300 - $w) / 2;
$y = (300 - $h) / 2;
$x2 = (300 + $w) / 2 - $x;
$y2 = (300 + $h) / 2 - $y;
imagecopyresampled($image, $play, $x, $y, 0, 0, $x2, $y2, $w, $h);
imagejpeg($image, $thumb, 50);
return file_exists($filename);
}
public function delete($event, $filename) {

141
public/assets/scripts/admin/eventos.js
View File

@ -42,7 +42,7 @@ var imagenes = {
$('#agregar_imagen').css('cursor', 'pointer').click(() => {
imagenes.add()
})
$('.trash.icon').css('cursor', 'pointer').click(function() {
$('#imagenes .trash.icon').css('cursor', 'pointer').click(function() {
let i = $(this).attr('data-media')
imagenes.deleteImage(i)
})
@ -80,11 +80,11 @@ var imagenes = {
div = $('<div></div>').attr('class', 'ui modal').append(
$('<i></i>').attr('class', 'inside close icon')
)
if (imagenes.imagenes.length >= 12) {
if (imagenes.imagenes.length + videos.videos.length >= 12) {
div.append(
$('<div></div>').attr('class', 'header').html('Media')
$('<div></div>').attr('class', 'header').html('Foto')
).append(
$('<div></div>').attr('class', 'content').html('Se ha llegado al máximo de media.')
$('<div></div>').attr('class', 'content').html('Se ha llegado al máximo de elementos.')
)
imgs.after(div)
div.modal('show')
@ -92,7 +92,7 @@ var imagenes = {
}
div.append(
$('<div></div>').attr('class', 'header').html('Media')
$('<div></div>').attr('class', 'header').html('Foto')
).append(
$('<div></div>').attr('class', 'content').append(imagenes.buildForm())
)
@ -108,6 +108,129 @@ var imagenes = {
})
},
addImage: () => {
let form = $('#add_image')
$('#add_image #resultado').html('')
$('#add_image #resultado').append(
$('<div></div>').attr('class', 'ui active loader')
)
let data = new FormData(form[0])
let url = imagenes.url + '/evento/' + imagenes.evento + '/image/add'
let fallo = () => {
$('#add_image #resultado').html('')
$('#add_image #resultado').append(
$('<div></div>').attr('class', 'ui negative message')
.append($('<i></i>').attr('class', 'inline close icon'))
.append('<p>No se pudo agregar.</p>')
)
$('#add_image #resultado .message .close').on('click', function() {
$(this).closest('.message')
.transition('fade');
});
}
$.ajax({
url: url,
data: data,
processData: false,
contentType: false,
type: 'POST',
success: (output) => {
if (output.estado) {
window.location.reload()
return
}
fallo()
},
error: () => {
fallo()
}
})
},
deleteImage: (i) => {
let media = imagenes.imagenes[i]
let url = imagenes.url + '/evento/' + imagenes.evento + '/image/delete'
$.post(url, {media: media}, (output) => {
if (output.estado) {
window.location.reload()
}
})
}
}
var videos = {
videos: [],
url: '',
evento: '',
setup: () => {
$('#agregar_video').css('cursor', 'pointer').click(() => {
videos.add()
})
$('#videos .trash.icon').css('cursor', 'pointer').click(function() {
let i = $(this).attr('data-media')
videos.deleteVideo(i)
})
},
buildForm: () => {
let form = new Elem('form', {
class: 'ui form',
id: 'add_video',
method: 'post',
enctype: 'multipart/form-data',
action: videos.url + '/evento/' + videos.evento + '/video/add'
}).addChild(
new Elem('div', {class: 'ui grid'}).addChild(
new Elem('div', {class: 'row'}).addChild(
new Elem('div', {class: 'sixteen wide column'}).addChild(
new Elem('div', {class: 'ui fluid input'}).addChild(
new Elem('input', {type: 'file', name: 'video[]', multiple: 'multiple'}, false)
)
)
)
).addChild(
new Elem('div', {class: 'row'}).addChild(
new Elem('div', {class: 'two wide column'}).addChild(
new Elem('div', {class: 'ui fluid button', type: 'submit'}).html('Agregar')
)
)
)
)
return form.build()
},
add: () => {
var vds = $('#videos')
var div = vds.next('.modal')
if (div.length > 0) {
div.remove()
}
div = $('<div></div>').attr('class', 'ui modal').append(
$('<i></i>').attr('class', 'inside close icon')
)
if (imagenes.imagenes.length + videos.videos.length >= 12) {
div.append(
$('<div></div>').attr('class', 'header').html('Video')
).append(
$('<div></div>').attr('class', 'content').html('Se ha llegado al máximo de elementos.')
)
vds.after(div)
div.modal('show')
return
}
div.append(
$('<div></div>').attr('class', 'header').html('Video')
).append(
$('<div></div>').attr('class', 'content').append(videos.buildForm())
)
vds.after(div)
div.modal('show')
div.find('form .button').click((e) => {
div.find('form').submit()
})
/*div.find('form').submit((e) => {
e.preventDefault()
videos.addImage()
return false
})*/
},
/*addImage: () => {
let form = $('#add_image')
$('#resultado').html('')
$('#resultado').append(
@ -144,10 +267,10 @@ var imagenes = {
fallo()
}
})
},
deleteImage: (i) => {
let media = imagenes.imagenes[i]
let url = imagenes.url + '/evento/' + imagenes.evento + '/image/delete'
},*/
deleteVideo: (i) => {
let media = videos.videos[i]
let url = videos.url + '/evento/' + videos.evento + '/video/delete'
$.post(url, {media: media}, (output) => {
if (output.estado) {
window.location.reload()

10
resources/data/eventos.yml
View File

@ -169,3 +169,13 @@
incididunt ut labore et dolore magna
aliqua. Ut enim ad minim veniam, quis
nos
-
titulo: 4° Colonia de Invierno 2019
empresa: Dimerc
servicio: Eventos Recreativos
descripcion: >
Lorem ipsum dolor sit amet, consectetur
adipiscing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna
aliqua. Ut enim ad minim veniam, quis
nos

BIN
resources/data/play.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 14 KiB

10
resources/routes/web/admin/eventos.php
View File

@ -10,8 +10,14 @@ $app->group('/eventos', function($app) {
});
$app->group('/evento/{evento}', function($app) {
$app->post('/edit', [Eventos::class, 'edit']);
$app->post('/add', [Eventos::class, 'addImage']);
$app->get('/delete', [Eventos::class, 'delete']);
$app->post('/image/delete', [Eventos::class, 'deleteImage']);
$app->group('/image', function($app) {
$app->post('/add', [Eventos::class, 'addImage']);
$app->post('/delete', [Eventos::class, 'deleteImage']);
});
$app->group('/video', function($app) {
$app->post('/add', [Eventos::class, 'addVideo']);
$app->post('/delete', [Eventos::class, 'deleteImage']);
});
$app->get('[/]', [Eventos::class, 'show']);
});

74
resources/views/admin/eventos/show.blade.php
View File

@ -66,8 +66,13 @@
</div>
</form>
<div class="ui header">
Media
Elementos
</div>
<div class="ui equal width grid">
<div class="column">
<h4 class="ui header">
Fotos
</h4>
<table class="ui collapsing table" id="imagenes">
<thead>
<tr>
@ -83,6 +88,9 @@
<tbody>
@if ($imagenes)
@foreach (array_values($imagenes) as $i => $imagen)
@if (strpos($imagen->media->html, '<img') === false)
@continue
@endif
<tr>
<td>
<div class="ui mini image">
@ -99,6 +107,46 @@
</tbody>
</table>
</div>
<div class="column">
<h4 class="ui header">
Videos
</h4>
<table class="ui collapsing table" id="videos">
<thead>
<tr>
<th colspan="2" class="right aligned">
<i class="plus icon" id="agregar_video"></i>
</th>
</tr>
<tr>
<th>Archivo</th>
<th>Borrar</th>
</tr>
</thead>
<tbody>
@if ($imagenes)
@foreach (array_values($imagenes) as $i => $imagen)
@if (strpos($imagen->media->html, '<img') !== false)
@continue
@endif
<tr>
<td>
<div class="ui mini image">
<img src="{{$imagen->thumb->filename}}" />
</div>
{{$imagen->media->n}}</span>
</td>
<td class="center aligned">
<i class="trash icon" data-media="{{$i}}"></i>
</td>
</tr>
@endforeach
@endif
</tbody>
</table>
</div>
</div>
</div>
@endsection
@push('scripts')
@ -106,15 +154,31 @@
@endpush
@push('readyjs')
imagenes.imagenes = [
imagenes.imagenes = {
@if ($imagenes)
@foreach (array_values($imagenes) as $imagen)
'{{$imagen->media->n}}',
@foreach (array_values($imagenes) as $i => $imagen)
@if (strpos($imagen->media->html, '<img') === false)
@continue
@endif
{{$i}}: '{{$imagen->media->n}}',
@endforeach
@endif
]
}
imagenes.url = '{{$urls->admin}}'
imagenes.evento = '{{$evento->id}}'
imagenes.setup()
videos.videos = {
@if ($imagenes)
@foreach (array_values($imagenes) as $i => $imagen)
@if (strpos($imagen->media->html, '<img') !== false)
@continue
@endif
{{$i}}: '{{$imagen->media->n}}',
@endforeach
@endif
}
videos.url = imagenes.url
videos.evento = imagenes.evento
videos.setup()
$('#servicio').dropdown()
@endpush

6
resources/views/evento.blade.php
View File

@ -81,5 +81,11 @@
var id = $(this).attr('data-id')
var src = media[id]
$('#seleccionada').html(src)
if (src.indexOf('<img') < 0) {
$('#seleccionada').removeClass('image').addClass('embed')
$('#seleccionada').find('video').width($('#seleccionada').width())
} else {
$('#seleccionada').removeClass('embed').addClass('image')
}
})
@endpush