118 lines
3.8 KiB
PHP
118 lines
3.8 KiB
PHP
<div id="indicadores">
|
|
<div class="marquee slideshow">
|
|
</div>
|
|
</div>
|
|
|
|
@push('scripts')
|
|
<script type="text/javascript">
|
|
var slideshow = {
|
|
slides: [],
|
|
id: '.slideshow',
|
|
slide_id: '.slide',
|
|
current: 0,
|
|
speed: 1,
|
|
delay: 10,
|
|
move: () => {
|
|
var ini = parseInt($(slideshow.id).find(slideshow.slide_id + ':first-child').css('left'))
|
|
if (isNaN(ini)) {
|
|
ini = 0
|
|
}
|
|
console.debug(ini)
|
|
$(slideshow.id).find(slideshow.slide_id + ':first-child').css('left', ini - slideshow.speed)
|
|
var w = parseInt($(slideshow.id).find(slideshow.slide_id + ':first-child').css('width'))
|
|
var p0 = 0
|
|
var p = parseInt($(slideshow.id).find(slideshow.slide_id + ':first-child').css('left'))
|
|
if (p + w < p0) {
|
|
slideshow.addNext()
|
|
}
|
|
setTimeout(slideshow.move, slideshow.delay)
|
|
},
|
|
addNext: () => {
|
|
var data = [
|
|
$(slideshow.id).find(slideshow.slide_id + ':first-child').attr('class'),
|
|
$(slideshow.id).find(slideshow.slide_id + ':first-child').html()
|
|
]
|
|
var c = slideshow.current + 1
|
|
if (c >= slideshow.slides.length) {
|
|
c = 0
|
|
}
|
|
$(slideshow.id).find(slideshow.slide_id + ':first-child').remove()
|
|
slideshow.slides.shift()
|
|
var div = $('<div></div>').attr('class', data[0]).attr('data-title', data[1]).attr('data-content', data[2]).html(
|
|
data[3]
|
|
)
|
|
$(slideshow.id).append(
|
|
div
|
|
)
|
|
div.popup(9)
|
|
slideshow.slides.push(div)
|
|
slideshow.current = c
|
|
},
|
|
setup: () => {
|
|
$(slideshow.id).parent().css('overflow', 'hidden')
|
|
$(slideshow.id).find(slideshow.slide_id).each((i, el) => {
|
|
slideshow.slides.push($(el).html())
|
|
})
|
|
var w = $(slideshow.id).find(slideshow.slide_id + ':first-child').css('width')
|
|
var div = $('<div></div>').attr('class', 'slide').html(slideshow.slides[0])
|
|
$(slideshow.id).append(div)
|
|
setTimeout(slideshow.move, slideshow.delay)
|
|
}
|
|
}
|
|
var indicadores = {
|
|
indicadores: [
|
|
@foreach ($indicadores as $indicador => $titulo)
|
|
{
|
|
sim: '{{$indicador}}',
|
|
titulo: '{{$titulo}}'
|
|
},
|
|
@endforeach
|
|
],
|
|
data: [],
|
|
id: '#indicadores',
|
|
current: {{count($indicadores)}},
|
|
findIndicador: (i) => {
|
|
var indicador = indicadores.indicadores[i]
|
|
return $.ajax({
|
|
url: '{{$urls->base}}/indicador/' + indicador.sim,
|
|
success: (data) => {
|
|
indicadores.data.push(data.valor)
|
|
indicadores.putIndicador(indicador.titulo, data.valor)
|
|
}
|
|
})
|
|
},
|
|
putIndicador: (titulo, data) => {
|
|
var div = $('<div></div>').attr('class', 'slide').append(
|
|
$('<div></div>').attr('class', 'ui horizontal mini statistic').attr('data-title', 'Fecha').attr('data-content', data.fecha).append(
|
|
$('<div></div>').attr('class', 'value').html(titulo)
|
|
).append(
|
|
$('<div></div>').attr('class', 'value').html(data.valor)
|
|
)
|
|
)
|
|
div.find('.header').popup()
|
|
$(indicadores.id).find('.slideshow').append(div)
|
|
},
|
|
setup: () => {
|
|
var promises = []
|
|
promise = null
|
|
$.each(indicadores.indicadores, (i, el) => {
|
|
promise = indicadores.findIndicador(i)
|
|
promises.push(promise)
|
|
})
|
|
Promise.all(promises).then(() => {
|
|
$.each(indicadores.data, (i, el) => {
|
|
indicadores.putIndicador(indicadores.indicadores[i].titulo, el)
|
|
})
|
|
$('.marquee').marquee({
|
|
duration: 20000,
|
|
gap: 50
|
|
})
|
|
})
|
|
}
|
|
}
|
|
$(document).ready(() => {
|
|
indicadores.setup()
|
|
})
|
|
</script>
|
|
@endpush
|