92 lines
2.4 KiB
PHP
92 lines
2.4 KiB
PHP
@extends('layout.base')
|
|
|
|
@section('page_content')
|
|
<div id="galeria">
|
|
<div class="ui container">
|
|
<div class="ui two columns stackable grid">
|
|
<div class="column">
|
|
<div class="ui image" id="seleccionada">
|
|
@if ($imagenes !== false)
|
|
{!!array_values($imagenes)[0]->media->html!!}
|
|
@else
|
|
Imagen no encontrada.
|
|
@endif
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<h2 class="ui header">
|
|
<strong>
|
|
{{mb_strtoupper($evento->titulo)}}
|
|
</strong>
|
|
{{$evento->empresa}}
|
|
<div class="sub header">
|
|
<i>
|
|
{{ucwords($evento->servicio)}}
|
|
</i>
|
|
</div>
|
|
</h2>
|
|
<p>
|
|
{{$evento->descripcion}}
|
|
</p>
|
|
<div class="ui four column grid" id="thumbs">
|
|
@if ($imagenes !== false)
|
|
@foreach (array_values($imagenes) as $i => $imagen)
|
|
<div class="column">
|
|
<div class="ui image imagen" data-id="{{$i}}">
|
|
{!!$imagen->thumb->html!!}
|
|
</div>
|
|
</div>
|
|
@endforeach
|
|
@else
|
|
<div class="column">
|
|
No hay imagenes.
|
|
</div>
|
|
@endif
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@endsection
|
|
|
|
@push('styles')
|
|
<link rel="stylesheet" type="text/css" href="{{$urls->styles}}/galeria.css" />
|
|
@endpush
|
|
|
|
@push('readyjs')
|
|
let media = [
|
|
@foreach ($imagenes as $media)
|
|
'{!!$media->media->html!!}',
|
|
@endforeach
|
|
]
|
|
let thumbs = $('#thumbs .image img')
|
|
thumbs.each((i, el) => {
|
|
let src = $(el).attr('src')
|
|
if (src == '#') {
|
|
return
|
|
}
|
|
let w = el.width
|
|
let h = el.height
|
|
let parent = $(el).parent()
|
|
let r = w / h
|
|
if (r > 1) {
|
|
$(el).height(parent.height())
|
|
$(el).width(parent.height() * r)
|
|
} else {
|
|
$(el).width(parent.width())
|
|
$(el).height(parent.width() / r)
|
|
}
|
|
})
|
|
$('.imagen').css('cursor', 'pointer').click(function() {
|
|
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
|