var sActionButtons = '<a href="javascript:void(0);" class="btn btn-secondary btn-circle action-edit" title="Modificar"><i class="fas fa-pencil-alt"></i></a><a href="javascript:void(0);" class="btn btn-danger btn-circle action-delete" title="Eliminar"><i class="fas fa-trash"></i></a>';

function initTable(module, aColumns, initCustomTableButtons){


	$('#tabla').DataTable({
		"order": [],
		"language": {
			"url": "./resources/vendor/datatables/es_es.json"
		},
		"ajax": {
			"url": "./app/backend/ajax.php?module=" + module + "_list",
			"dataSrc": ""
		},
		"initComplete":function( settings, json){
			initTableButtons(module);

			if(initCustomTableButtons != undefined){
				initCustomTableButtons();
			}

		},
		"fnDrawCallback": function( settings ) {
			initTableButtons(module);

			if(initCustomTableButtons != undefined){
				initCustomTableButtons();
			}

		},
		columns: aColumns
	});

}

const callWebservice = (url, type, datos, callBack) => {
	var jqxhr = $.ajax({
		url: 	url,
		type: 	type,
		data: 	datos
	})
	.done(function(response) {
		callBack(response);
	})
	.fail(function(error) {
		console.log( error );
	})
	.always(function() {
	});
};

function initTableButtons(module){
	$('.action-edit').unbind('click').click(function(){
		var id = $(this).parent().parent().find('input#id').val();
		location.href= "index.php?app=backend/" + module + "_edit&id=" + id;
	});

	$('.action-delete').unbind('click').click(function(){
		var id = $(this).parent().parent().find('input#id').val();
		Swal.fire({
		  title: '¿Desea eliminar el elemento?',
		  text: "El cambio no se podrá revertir.",
		  icon: 'warning',
		  showCancelButton: true,
		  confirmButtonColor: '#d33',
		  cancelButtonColor: '#3085d6',
		  confirmButtonText: 'Eliminar',
		  cancelButtonText: 'Cancelar'
		}).then((result) => {
		  if (result.isConfirmed) {
			  location.href= "index.php?app=backend/" + module + "_delete&id=" + id;
		  }
		});
	});
}

//Función generica de guardado de formulario
function initForm(urlBack){
	$('.form-save').click(function(){
		if(validate("datos")){
			$('form#datos').submit();
		}
	});

	$('.form-cancel').click(function(){
		location.href = urlBack;
	});

}

function redirect(urlBack){
	location.href = urlBack;
}

function validate(form){
	form = form.replace("#","");
	var form = document.getElementById(form);
	pristine = new Pristine(form);
	var valid = pristine.validate();
	return valid;
}

function initTextEditor(){
	tinymce.remove();
	tinymce.init({
		selector:'textarea',
		languaje:'es',
		height:	350,
		branding: false,
		menubar: false,
		plugins: [
		    "link image media filemanager responsivefilemanager"
	    ],
		toolbar1: "undo redo | bold italic underline | forecolor backcolor | link unlink | image media | code",
		external_filemanager_path:"filemanager/",
		filemanager_title:"Responsive Filemanager" ,
		external_plugins: {
			"responsivefilemanager": "../../js/tinymce/plugins/responsivefilemanager/plugin.min.js",
			"filemanager": "../../../filemanager/plugin.min.js"
		},
	});
}

//Definimos un obj con todos los metodos de la gestión por idiomas.
let formLanguage = {};

//Definimos las tres variables necesarias para la gestion del formulario de idiomas
formLanguage.module_get 	= '';
formLanguage.module_save 	= '';
formLanguage.module_delete 	= '';
formLanguage.form_name 		= '';
formLanguage.id 			= 0;

//Función que obtiene la información de la bd de contenido
formLanguage.getContent = ( language ) => {

	//Mostramos la ventana de contenido, mostramos la ventana de cargando y ocultamos la ventana de información mientras cargamos.
	$('#form-content-info').hide();
	$('#form-content-loading').show();
	$('#form-content-info div#datos').html('');

	let datos = {
		'id' : formLanguage.id
	};

	//Si pasamos un language, generamos el form añadiendo un nuevo idioma.
	if(language){
		datos.language = language;
	}

	$.ajax({
        url: './app/backend/ajax.php?module=' + formLanguage.module_get,
        type: "post",
        data: datos ,
        success: function (response) {
			if( response ){

				$('#form-content-info').show();
				$('#form-content-loading').hide();
				$('#form-content-info div#datos').html(response);
				initTextEditor();
				initDatepicker('input.datepicker');

				$('.form-cancel').unbind('click').bind("click", (e) =>{
					redirect(url_back);
				});

				$('.form-save').unbind('click').bind('click', (e) =>{
					if(validate(formLanguage.form_name)){
						formLanguage.saveContent();
						setTimeout(function(){
							redirect(url_back);
						}, 500);
					}

				});

				$('.add-language').click(function(event) {
					launchLangModal(saveLanguage);
				});

				$('.delete-language').click(function(event) {
					//Obtenemos el idioma del objeto html que le hemos
					const lang = $(this).attr('id').replace('-delete','');
					formLanguage.deleteLanguage( lang );
				});

			}
        },
        error: function(jqXHR, textStatus, errorThrown) {
           console.log(textStatus, errorThrown);
        }
    });

};

//Función que guarda la información en la bd por idiomas
formLanguage.saveContent = () => {

	//Actualizamos los textarea con la información de los editores.
	tinymce.triggerSave();

	//Serializamos el form, con el nombre que hemos definido en la clase ajax.
	const postdata = $(formLanguage.form_name).serialize();

	const datos = {
		'id' : formLanguage.id,
		postdata
	};

	$.ajax({
        url: './app/backend/ajax.php?module=' + formLanguage.module_save,
        type: "post",
        data: datos ,
        success: function (response) {
			//Asignamos el id a la variable id creada, sólo si es insert
			if( formLanguage.id == 0 ){
				formLanguage.id = response;
			}
			console.log(formLanguage.id);
        },
        error: function(jqXHR, textStatus, errorThrown) {
           console.log(textStatus, errorThrown);
        }
    });

};

//Eliminar un idioma creado
formLanguage.deleteLanguage = ( language ) => {
	Swal.fire({
		title: '¿Desea eliminar el idioma?',
		text: "Se perderán los datos asociados a ese idioma.",
		icon: 'warning',
		showCancelButton: true,
		confirmButtonColor: '#d33',
		cancelButtonColor: '#3085d6',
		confirmButtonText: 'Eliminar',
		cancelButtonText: 'Cancelar'
	}).then((result) => {
		if (result.isConfirmed) {
			formLanguage.deleteLanguageContent(language);
		}
	});
};

//Función que elimina la información en la bd
formLanguage.deleteLanguageContent = ( language ) => {

	formLanguage.saveContent();
	const datos = {
		'id' : formLanguage.id,
		language
	};

	$.ajax({
        url: './app/backend/ajax.php?module=' + formLanguage.module_delete,
        type: "post",
        data: datos ,
        success: function (response) {
			formLanguage.getContent();
        },
        error: function(jqXHR, textStatus, errorThrown) {
           console.log(textStatus, errorThrown);
        }
    });

};

function initDatepicker(selector, hours, defaultDate){

	let format 		= "DD/MM/YYYY HH:mm";
	let timePicker 	= false;

	if(hours == undefined){
		hours 		= true;
		timePicker 	= true;
	}

	if(!hours){
		format = "DD/MM/YYYY";
	}

	let options = {
		"singleDatePicker": true,
		"autoApply":		true,
		"timePicker": 		timePicker,
		"timePicker24Hour":	true,
		"locale": {
			"format" 	: format,
			"separator"	: " - ",
			"applyLabel": "Aceptar",
			"cancelLabel": "Cancel",
			"fromLabel": "Desde",
			"toLabel": "Hasta",
			"customRangeLabel": "Custom",
			"weekLabel": "S",
			"daysOfWeek": [
				"Do",
				"Lu",
				"Ma",
				"Mi",
				"Ju",
				"Vi",
				"Sa"
			],
			"monthNames": [
				"Enero",
				"Febrero",
				"Marzo",
				"Abril",
				"Mayo",
				"Junio",
				"Julio",
				"Agosto",
				"Septiembre",
				"Octubre",
				"Noviembre",
				"Diciembre"
			],
			"firstDay": 1
		}
	};

	if(defaultDate != undefined){
		options.startDate = defaultDate;
	}
	//console.log(options);
	$(selector).daterangepicker(options);
}