diff --git a/bootstrap/web/config.php b/bootstrap/web/config.php index 8c20a7c..d4d7135 100644 --- a/bootstrap/web/config.php +++ b/bootstrap/web/config.php @@ -23,6 +23,11 @@ return [ 'assets', 'styles' ])), + 'scripts' => DI\string(implode('/', [ + '{urls.base}', + 'assets', + 'scripts' + ])), 'images' => DI\string(implode('/', [ '{urls.base}', 'assets', diff --git a/public/assets/scripts/admin/eventos.js b/public/assets/scripts/admin/eventos.js new file mode 100644 index 0000000..8c48f05 --- /dev/null +++ b/public/assets/scripts/admin/eventos.js @@ -0,0 +1,157 @@ +class Elem { + constructor(tag, attrs, close = true) { + this.tag = '<' + tag + if (close) { + this.tag += '>' + tag + '>' + } else { + this.tag += '/>' + } + this.attrs = attrs + this.children = [] + } + addChild(child) { + if (typeof child != 'object' || typeof child.tag == 'undefined') { + return this + } + this.children.push(child) + return this + } + html(text) { + this.text = text + return this + } + build() { + let obj = $(this.tag) + $.each(this.attrs, (key, el) => { + obj.attr(key, el) + }) + $.each(this.children, (i, el) => { + obj.append(el.build()) + }) + if (typeof this.text !== 'undefined') { + obj.html(this.text) + } + return obj + } +} +var imagenes = { + imagenes: [], + url: '', + evento: '', + setup: () => { + $('#agregar_imagen').css('cursor', 'pointer').click(() => { + imagenes.add() + }) + $('.trash.icon').css('cursor', 'pointer').click(function() { + let i = $(this).attr('data-media') + imagenes.deleteImage(i) + }) + }, + buildForm: () => { + let form = new Elem('form', {class: 'ui form', id: 'add_image'}).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: 'imagen[]', 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') + ) + ).addChild( + new Elem('div', {class: 'fourteen wide column'}).addChild( + new Elem('div', {id: 'resultado', class: 'ui fluid basic segment'}) + ) + ) + ) + ) + return form.build() + }, + add: () => { + var imgs = $('#imagenes') + var div = imgs.next('.modal') + if (div.length > 0) { + div.remove() + } + div = $('
').attr('class', 'ui modal').append( + $('').attr('class', 'inside close icon') + ) + if (imagenes.imagenes.length >= 12) { + div.append( + $('').attr('class', 'header').html('Media') + ).append( + $('').attr('class', 'content').html('Se ha llegado al máximo de media.') + ) + imgs.after(div) + div.modal('show') + return + } + + div.append( + $('').attr('class', 'header').html('Media') + ).append( + $('').attr('class', 'content').append(imagenes.buildForm()) + ) + imgs.after(div) + div.modal('show') + div.find('form .button').click((e) => { + div.find('form').submit() + }) + div.find('form').submit((e) => { + e.preventDefault() + imagenes.addImage() + return false + }) + }, + addImage: () => { + let form = $('#add_image') + $('#resultado').html('') + $('#resultado').append( + $('').attr('class', 'ui active loader') + ) + let data = new FormData(form[0]) + let url = imagenes.url + '/evento/' + imagenes.evento + '/add' + let fallo = () => { + $('#resultado').html('') + $('#resultado').append( + $('').attr('class', 'ui negative message') + .append($('').attr('class', 'inline close icon')) + .append('No se pudo agregar.
') + ) + $('#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() + } + }) + } +} diff --git a/public/assets/scripts/home.js b/public/assets/scripts/home.js new file mode 100644 index 0000000..d03994b --- /dev/null +++ b/public/assets/scripts/home.js @@ -0,0 +1,115 @@ +let clientes = { + clientes: [], + current: 0, + rows: 2, + cols: 6, + decreaseClientes: () => { + $('#img_clientes').find('.row').find('.column:last-child').remove() + clientes.current -= clientes.rows + if (clientes.current < - clientes.cols * clientes.rows) { + clientes.current = clientes.clientes.length - (clientes.cols - 1) * clientes.rows + } + n = clientes.current + if (n < 0) { + n = clientes.clientes.length + n + } + $('#img_clientes').find('.row:first-child').prepend( + $('').attr('class', 'five wide tablet two wide computer column').append(clientes.clientes[n]) + ) + $('#img_clientes').find('.row:last-child').prepend( + $('').attr('class', 'five wide tablet two wide computer column').append(clientes.clientes[n + 1]) + ) + }, + increaseClientes: () => { + $('#img_clientes').find('.row').find('.column:first-child').remove() + clientes.current += 2 + if (clientes.current > clientes.clientes.length - clientes.cols * clientes.rows) { + clientes.current = - (clientes.cols - 1) * clientes.rows + } + $('#img_clientes').find('.row:first-child').append( + $('').attr('class', 'five wide tablet two wide computer column').append(clientes.clientes[clientes.current + (clientes.cols - 1) * clientes.rows]) + ) + $('#img_clientes').find('.row:last-child').append( + $('').attr('class', 'five wide tablet two wide computer column').append(clientes.clientes[clientes.current + clientes.cols * clientes.rows - 1]) + ) + }, + setup: () => { + $('.ci .icon').css('cursor', 'pointer').click(function() { + if ($(this).attr('class').indexOf('left') != -1) { + clientes.decreaseClientes() + return + } + clientes.increaseClientes() + }) + } +} +let eventos = { + eventos: [], + current_tab: 'none', + base_url: '', + changeEventos: (filter) => { + let grid = $('#eventos_cards') + grid.html('') + $.each(eventos.eventos, function(i, el) { + if (filter != 'none' && el.servicio != filter) { + return + } + console.debug(el.image) + grid.append( + $('').attr('class', 'eight wide tablet four wide computer column').append( + $('').attr('class', 'ui basic segment').append( + $('').attr('href', eventos.base_url + '/evento/' + i).append( + $('').attr('class', 'ui image').append(el.image) + ).append( + $('').attr('class', 'ui center aligned header').append(el.titulo).append( + $('