<?php if(false){ ?><style><?php } ?>
<?php function dialogo_loading_css(){ ?>
#_dialogo_loading{
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: center;
	align-items: center;
	align-content: center;
	z-index: 9000;
}
#_dialogo_loading img{
	width:30%;
	max-width:150px;
	user-select: none;
}
<?php } ?>
<?php function dialogo_image_css(){ ?>
#_dialogo_imagen .window_body ul{
	list-style: none;
	border: 0px;
	padding 0px;
	margin: 0px;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	align-content: flex-start;
}
#_dialogo_imagen .window_body ul li{
	width: 150px;
	height: 150px;
	border: 0px;
	padding: 0px;
	margin: 0px;
}
#_dialogo_imagen .window_body ul li label{
	width: 130px;
	height: 130px;
	border: 1px solid #999999;
	margin: 9px;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	align-content: flex-end;
	cursor:pointer;
	background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
}
#_dialogo_imagen .window_body ul li label input{
	margin-bottom: 10px;
}
<?php } ?>
<?php function dialogo_alert_css(){ ?>
#_dialogo_alert .window{
	max-width:350px;
	max-height:140px;
}
#_dialogo_alert .window .window_body{
	padding: 15px;
}
<?php } ?>
<?php function dialogo_confirm_css(){ ?>
#_dialogo_confirm .window{
	max-width:350px;
	max-height:140px;
}
#_dialogo_confirm .window .window_body{
	padding: 15px;
}
#_dialogo_input .window{
	max-width:350px;
	max-height:140px;
}
#_dialogo_input .window .window_body{
	padding: 15px;
}
<?php } ?>
<?php function dialogo_document_css(){ ?>
<?php } ?>
<?php if(false){ ?></style><?php } ?>
<?php function dialogo_loading_html(){ ?>
<div id="_dialogo_loading">
	<img src="libreria/imagenes/loading.gif" />
</div>
<?php } ?>
<?php function dialogo_image_html(){ ?>
	<div class="background_window" id="_dialogo_imagen" style="z-index:9100;">
		<div class="window" style="max-width:70%;max-height:70%;">
			<div class="window_title">
				<svg width="25px" height="25px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" stroke="#000000"><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier"> <circle cx="15" cy="9" r="2" stroke="#003cff" stroke-width="1.5"></circle> <path d="M19.9999 17.6001L17.7764 15.599C16.7368 14.6634 15.1887 14.5702 14.0445 15.3744L13.7463 15.5839C12.9511 16.1428 11.8693 16.0491 11.1821 15.3618L6.89237 11.0721C6.03616 10.2159 4.66274 10.1702 3.75147 10.9675L2.28101 12.2542" stroke="#003cff" stroke-width="1.5" stroke-linecap="round"></path> <path d="M7 3.33782C8.47087 2.48697 10.1786 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12C2 10.1786 2.48697 8.47087 3.33782 7" stroke="#003cff" stroke-width="1.5" stroke-linecap="round"></path> </g></svg>
				<div>Seleccionar imagen</div>
				<svg width="25px" height="25px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" class="btn_close">
					<path d="M10.0303 8.96967C9.73741 8.67678 9.26253 8.67678 8.96964 8.96967C8.67675 9.26256 8.67675 9.73744 8.96964 10.0303L10.9393 12L8.96966 13.9697C8.67677 14.2626 8.67677 14.7374 8.96966 15.0303C9.26255 15.3232 9.73743 15.3232 10.0303 15.0303L12 13.0607L13.9696 15.0303C14.2625 15.3232 14.7374 15.3232 15.0303 15.0303C15.3232 14.7374 15.3232 14.2625 15.0303 13.9697L13.0606 12L15.0303 10.0303C15.3232 9.73746 15.3232 9.26258 15.0303 8.96969C14.7374 8.6768 14.2625 8.6768 13.9696 8.96969L12 10.9394L10.0303 8.96967Z" fill="#ff0000"></path> 
					<path fill-rule="evenodd" clip-rule="evenodd" d="M12.0574 1.25H11.9426C9.63424 1.24999 7.82519 1.24998 6.41371 1.43975C4.96897 1.63399 3.82895 2.03933 2.93414 2.93414C2.03933 3.82895 1.63399 4.96897 1.43975 6.41371C1.24998 7.82519 1.24999 9.63422 1.25 11.9426V12.0574C1.24999 14.3658 1.24998 16.1748 1.43975 17.5863C1.63399 19.031 2.03933 20.1711 2.93414 21.0659C3.82895 21.9607 4.96897 22.366 6.41371 22.5603C7.82519 22.75 9.63423 22.75 11.9426 22.75H12.0574C14.3658 22.75 16.1748 22.75 17.5863 22.5603C19.031 22.366 20.1711 21.9607 21.0659 21.0659C21.9607 20.1711 22.366 19.031 22.5603 17.5863C22.75 16.1748 22.75 14.3658 22.75 12.0574V11.9426C22.75 9.63423 22.75 7.82519 22.5603 6.41371C22.366 4.96897 21.9607 3.82895 21.0659 2.93414C20.1711 2.03933 19.031 1.63399 17.5863 1.43975C16.1748 1.24998 14.3658 1.24999 12.0574 1.25ZM3.9948 3.9948C4.56445 3.42514 5.33517 3.09825 6.61358 2.92637C7.91356 2.75159 9.62177 2.75 12 2.75C14.3782 2.75 16.0864 2.75159 17.3864 2.92637C18.6648 3.09825 19.4355 3.42514 20.0052 3.9948C20.5749 4.56445 20.9018 5.33517 21.0736 6.61358C21.2484 7.91356 21.25 9.62177 21.25 12C21.25 14.3782 21.2484 16.0864 21.0736 17.3864C20.9018 18.6648 20.5749 19.4355 20.0052 20.0052C19.4355 20.5749 18.6648 20.9018 17.3864 21.0736C16.0864 21.2484 14.3782 21.25 12 21.25C9.62177 21.25 7.91356 21.2484 6.61358 21.0736C5.33517 20.9018 4.56445 20.5749 3.9948 20.0052C3.42514 19.4355 3.09825 18.6648 2.92637 17.3864C2.75159 16.0864 2.75 14.3782 2.75 12C2.75 9.62177 2.75159 7.91356 2.92637 6.61358C3.09825 5.33517 3.42514 4.56445 3.9948 3.9948Z" fill="#ff0000"></path>
				</svg>
			</div>
			<div class="window_body">
				<ul>
					<li><label><input type="radio" name="dialog_radio_img" /></label></li>
					<li><label><input type="radio" name="dialog_radio_img" /></label></li>
					<li><label><input type="radio" name="dialog_radio_img" /></label></li>
				</ul>
			</div>
			<div class="window_buttons">
				<input type="file" accept="image/*" style="display:none;">
				<select class="btn_load">
					<option value="" selected>Cargar imagen</option>
					<option value="512">Resolución 512</option>
					<option value="1024">Resolución 1024</option>
					<option value="2048">Resolución 2048</option>
				</select>
				<input type="hidden" value="" />
				<span style="flex:1;"></span>
				<button class="btn_accept buttons_active"><span>Aceptar</span></button>&nbsp;
				<button class="btn_close buttons_active"><span>Cancelar</span></button>
			</div>
		</div>
	</div>
<?php } ?>
<?php function dialogo_alert_html(){ ?>
	<div class="background_window" id="_dialogo_alert">
		<div class="window">
			<div class="window_title">
				<svg width="25px" height="25px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier"> <path d="M12 17V11" stroke="#a2c200" stroke-width="1.5" stroke-linecap="round"></path> <circle cx="1" cy="1" r="1" transform="matrix(1 0 0 -1 11 9)" fill="#a2c200"></circle> <path d="M7 3.33782C8.47087 2.48697 10.1786 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12C2 10.1786 2.48697 8.47087 3.33782 7" stroke="#a2c200" stroke-width="1.5" stroke-linecap="round"></path> </g></svg>
				<div>Alerta</div>
				<span style="width:25px;"></span>
			</div>
			<div class="window_body">
			</div>
			<div class="window_buttons">
				<span style="flex:1;"></span>
				<button class="btn_close buttons_active"><span>Cerrar</span></button>
			</div>
		</div>
	</div>
<?php } ?>
<?php function dialogo_confirm_html(){ ?>
	<div class="background_window" id="_dialogo_confirm">
		<div class="window">
			<div class="window_title">
				<svg width="25px" height="25px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier"> <path d="M10.125 8.875C10.125 7.83947 10.9645 7 12 7C13.0355 7 13.875 7.83947 13.875 8.875C13.875 9.56245 13.505 10.1635 12.9534 10.4899C12.478 10.7711 12 11.1977 12 11.75V13" stroke="#ff0000" stroke-width="1.5" stroke-linecap="round"></path> <circle cx="12" cy="16" r="1" fill="#ff0000"></circle> <path d="M7 3.33782C8.47087 2.48697 10.1786 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12C2 10.1786 2.48697 8.47087 3.33782 7" stroke="#ff0000" stroke-width="1.5" stroke-linecap="round"></path> </g></svg>
				<div>Confirmar</div>
				<span style="width:25px;"></span>
			</div>
			<div class="window_body">
			</div>
			<div class="window_buttons">
				<span style="flex:1;"></span>
				<button class="btn_accept buttons_active"><span>Aceptar</span></button>
				<button class="btn_close buttons_active"><span>Cancelar</span></button>
			</div>
		</div>
	</div>
	<div class="background_window" id="_dialogo_input">
		<div class="window">
			<div class="window_title">
				<svg width="25px" height="25px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier"> <path d="M10.125 8.875C10.125 7.83947 10.9645 7 12 7C13.0355 7 13.875 7.83947 13.875 8.875C13.875 9.56245 13.505 10.1635 12.9534 10.4899C12.478 10.7711 12 11.1977 12 11.75V13" stroke="#ff0000" stroke-width="1.5" stroke-linecap="round"></path> <circle cx="12" cy="16" r="1" fill="#ff0000"></circle> <path d="M7 3.33782C8.47087 2.48697 10.1786 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12C2 10.1786 2.48697 8.47087 3.33782 7" stroke="#ff0000" stroke-width="1.5" stroke-linecap="round"></path> </g></svg>
				<div>Confirmar</div>
				<span style="width:25px;"></span>
			</div>
			<div class="window_body">
				<div></div>
				<input type="text" />
			</div>
			<div class="window_buttons">
				<span style="flex:1;"></span>
				<button class="btn_accept buttons_active"><span>Aceptar</span></button>
				<button class="btn_close buttons_active"><span>Cancelar</span></button>
			</div>
		</div>
	</div>
<?php } ?>
<?php function dialogo_document_html(){ ?>
	<div class="background_window" id="dialogo_imprimir" style="z-index:5100;">
		<div class="window" style="width:85%;max-width:350px;min-height:150px;height:auto;">
			<div class="window_title">
				<svg width="25px" height="25px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" stroke="#000000"><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier"> <circle cx="15" cy="9" r="2" stroke="#003cff" stroke-width="1.5"></circle> <path d="M19.9999 17.6001L17.7764 15.599C16.7368 14.6634 15.1887 14.5702 14.0445 15.3744L13.7463 15.5839C12.9511 16.1428 11.8693 16.0491 11.1821 15.3618L6.89237 11.0721C6.03616 10.2159 4.66274 10.1702 3.75147 10.9675L2.28101 12.2542" stroke="#003cff" stroke-width="1.5" stroke-linecap="round"></path> <path d="M7 3.33782C8.47087 2.48697 10.1786 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12C2 10.1786 2.48697 8.47087 3.33782 7" stroke="#003cff" stroke-width="1.5" stroke-linecap="round"></path> </g></svg>
				<div>Vista previa</div>
				<svg width="25px" height="25px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" class="btn_close">
					<path d="M10.0303 8.96967C9.73741 8.67678 9.26253 8.67678 8.96964 8.96967C8.67675 9.26256 8.67675 9.73744 8.96964 10.0303L10.9393 12L8.96966 13.9697C8.67677 14.2626 8.67677 14.7374 8.96966 15.0303C9.26255 15.3232 9.73743 15.3232 10.0303 15.0303L12 13.0607L13.9696 15.0303C14.2625 15.3232 14.7374 15.3232 15.0303 15.0303C15.3232 14.7374 15.3232 14.2625 15.0303 13.9697L13.0606 12L15.0303 10.0303C15.3232 9.73746 15.3232 9.26258 15.0303 8.96969C14.7374 8.6768 14.2625 8.6768 13.9696 8.96969L12 10.9394L10.0303 8.96967Z" fill="#ff0000"></path> 
					<path fill-rule="evenodd" clip-rule="evenodd" d="M12.0574 1.25H11.9426C9.63424 1.24999 7.82519 1.24998 6.41371 1.43975C4.96897 1.63399 3.82895 2.03933 2.93414 2.93414C2.03933 3.82895 1.63399 4.96897 1.43975 6.41371C1.24998 7.82519 1.24999 9.63422 1.25 11.9426V12.0574C1.24999 14.3658 1.24998 16.1748 1.43975 17.5863C1.63399 19.031 2.03933 20.1711 2.93414 21.0659C3.82895 21.9607 4.96897 22.366 6.41371 22.5603C7.82519 22.75 9.63423 22.75 11.9426 22.75H12.0574C14.3658 22.75 16.1748 22.75 17.5863 22.5603C19.031 22.366 20.1711 21.9607 21.0659 21.0659C21.9607 20.1711 22.366 19.031 22.5603 17.5863C22.75 16.1748 22.75 14.3658 22.75 12.0574V11.9426C22.75 9.63423 22.75 7.82519 22.5603 6.41371C22.366 4.96897 21.9607 3.82895 21.0659 2.93414C20.1711 2.03933 19.031 1.63399 17.5863 1.43975C16.1748 1.24998 14.3658 1.24999 12.0574 1.25ZM3.9948 3.9948C4.56445 3.42514 5.33517 3.09825 6.61358 2.92637C7.91356 2.75159 9.62177 2.75 12 2.75C14.3782 2.75 16.0864 2.75159 17.3864 2.92637C18.6648 3.09825 19.4355 3.42514 20.0052 3.9948C20.5749 4.56445 20.9018 5.33517 21.0736 6.61358C21.2484 7.91356 21.25 9.62177 21.25 12C21.25 14.3782 21.2484 16.0864 21.0736 17.3864C20.9018 18.6648 20.5749 19.4355 20.0052 20.0052C19.4355 20.5749 18.6648 20.9018 17.3864 21.0736C16.0864 21.2484 14.3782 21.25 12 21.25C9.62177 21.25 7.91356 21.2484 6.61358 21.0736C5.33517 20.9018 4.56445 20.5749 3.9948 20.0052C3.42514 19.4355 3.09825 18.6648 2.92637 17.3864C2.75159 16.0864 2.75 14.3782 2.75 12C2.75 9.62177 2.75159 7.91356 2.92637 6.61358C3.09825 5.33517 3.42514 4.56445 3.9948 3.9948Z" fill="#ff0000"></path>
				</svg>
			</div>
			<div class="window_body" style="background-color:white;">
				<div class="dialogo_mensaje" style="width: 100%;height:100%;overflow:auto;margin:auto;">
				</div>
			</div>
			<div class="window_buttons">
						<button class="btn_close buttons_active" style="min-width: auto;padding:0px 5px;"><span>Cerrar</span></button>
						<button class="btn_whatsapp buttons_active" style="min-width: auto;padding:0px 5px;"><span>Whatsapp</span></button>
						<span style="flex:1;"></span>
						<button class="btn_change buttons_active" style="min-width: auto;padding:0px 5px;"><span>Cambiar vista</span></button>
						<button class="btn_print buttons_active" style="min-width: auto;padding:0px 5px;"><span>Imprimir</span></button>
			</div>
		</div>
	</div>
<?php } ?>
<?php if(false){ ?><script><?php } ?>
<?php function dialogo_loading_javascript(){ ?>
function open_loading(){
	$("#_dialogo_loading").css("display", "flex");
}
function close_loading(){
	$("#_dialogo_loading").css("display", "none");
}
<?php } ?>
<?php function dialogo_loading_ready(){ ?>
<?php } ?>
<?php function dialogo_image_javascript(){ ?>
var _dialog_image_options = {
	func_accept: function(){},
	func_cancel: function(){},
	tipo: "",
	resolucion: 512,
	archivo: null,
	directorio: "",
	input: null,
}
function list_dialog_image(){
	$("#_dialogo_imagen .window_body ul").html('');
	$.ajax({
		url: "control/ctrl_imagen.php",
		dataType: "json",
		type: 'POST',
		data: {
			accion: "listar_imagenes",
			tipo: _dialog_image_options.tipo,
		},
		success: function (data) {
			//console.log(data);
			$("#_dialogo_imagen .window_body ul").append('<li><label style="background-image:url(libreria/imagenes/sin_imagen.png);"><input type="radio" name="dialog_radio_img" data-nombre="" data-directorio="'+data.directorio_base+'" /></label></li>');
			if(data.estado == "ok"){
				for (let idx=0; idx<data.lista.length; idx++){
					let img = "libreria/imagenes/"+_dialog_image_options.tipo+"/"+data.lista[idx];
					let html = '<li><label style="background-image:url('+img+');"><input type="radio" name="dialog_radio_img" data-nombre="'+data.lista[idx]+'" data-directorio="'+data.directorio+'" /></label></li>';
					$("#_dialogo_imagen .window_body ul").append(html);
				}
			} else {
			}
		}
	});
}
function open_dialog_image(codigo_imagen, func_accept, func_cancel){
	let max_height = $("#_dialogo_imagen .window").innerHeight();
	let title_height = $("#_dialogo_imagen .window .window_title").outerHeight();
	let buttons_height = $("#_dialogo_imagen .window .window_buttons").outerHeight();
	$("#_dialogo_imagen .window .window_body").height(max_height-(title_height+buttons_height));
	_dialog_image_options.tipo = codigo_imagen;
	_dialog_image_options.func_accept = func_accept;
	_dialog_image_options.func_cancel = func_cancel;
	_dialog_image_options.archivo = null;
	_dialog_image_options.input = null;
	_dialog_image_options.directorio = "";
	$("#_dialogo_imagen .window_body ul").html('');
	list_dialog_image();
	$("#_dialogo_imagen").css("display", "flex");
}
function obtenerTipoMIME(extension) {
	let formatos = {'jpeg':'image/jpeg',
					'jpg':'image/jpg',
					'png':'image/png',
					'gif':'image/gif',
					'bmp':'image/bmp',
					'tiff':'image/tiff',
					'tif':'image/tif',
					'webp':'image/webp',
					'svg':'image/svg+xml',
					'raw':'image/x-raw',
					'cr2':'image/x-canon-cr2',
					'nef':'image/x-nikon-nef',
					'dng':'image/x-adobe-dng',
					'ico':'image/x-icon',
					'heif':'image/heif',
					'heic':'image/heic',
					'pbm':'image/x-portable-bitmap',
					'pgm':'image/x-portable-graymap',
					'ppm':'image/x-portable-pixmap',
					'xpm':'image/x-xpixmap',
					'xbm':'image/x-xbitmap',
					'avif':'image/avif'
				};
    if (extension in formatos) {
		return formatos[extension]; // Devuelve el tipo MIME correspondiente
	} else {
		return 'image/jpeg'; // Tipo MIME predeterminado si no se encuentra la extensión
	}
}
<?php } ?>
<?php function dialogo_image_ready(){ ?>
	$("#_dialogo_imagen .window_body ul").on("change", "input", function(){
		_dialog_image_options.archivo = $(this).attr("data-nombre");
		_dialog_image_options.directorio = $(this).attr("data-directorio");
	});
	$("#_dialogo_imagen .btn_load").change(function (){
		_dialog_image_options.input = $(this).next();
		_dialog_image_options.resolucion = $(this).val();
		$("#_dialogo_imagen .btn_load").val("");
		$(this).prev().click();
	});
	$("#_dialogo_imagen .btn_accept").click(function (){
		if (_dialog_image_options.archivo == null){
			return;
		}
		_dialog_image_options.func_accept(_dialog_image_options.archivo, _dialog_image_options.directorio);
		$("#_dialogo_imagen").css("display", "none");
	});
	$("#_dialogo_imagen .btn_close").click(function (){
		$("#_dialogo_imagen").css("display", "none");
	});
	$("#_dialogo_imagen").find('input[type="file"]').change(function(evt){
		var tgt = evt.target || window.event.srcElement;
		var files = tgt.files;
		var data_save = {
							accion: "registrar_imagen",
							imagen: "",
							tipo: _dialog_image_options.tipo
						};
		if (FileReader && files && files.length>0) {
			var fr = new FileReader();
			fr.onload = function (e) {
				var img = new Image();
				img.src = e.target.result;
				img.onload = function() {
					var canvas = document.createElement('canvas');
					var ctx = canvas.getContext('2d');
					var maxWidth = _dialog_image_options.resolucion;
					var maxHeight = _dialog_image_options.resolucion;
					var cw=canvas.width;
					var ch=canvas.height;
					var iw=img.width;
					var ih=img.height;
					var scale=Math.min((maxWidth/iw),(maxHeight/ih));
					var iwScaled=iw*scale;
					var ihScaled=ih*scale;
					canvas.width=iwScaled;
					canvas.height=ihScaled;
					ctx.drawImage(img,0,0,iwScaled,ihScaled);
					var extension = files[0].name.split('.').pop(); // Obtener la extensión del archivo
					var tipoMIME = obtenerTipoMIME(extension);
					var dataURL = canvas.toDataURL(tipoMIME);
					data_save.imagen = dataURL;
					$(canvas).css("display", "none");//$(canvas).remove();
					$.ajax({
						url: "control/ctrl_imagen.php",
						dataType: "json",
						type: 'POST',
						data: data_save,
						success: function (data) {
							//console.log(data);
							if(data.estado == "ok"){
								list_dialog_image();
							} else {
							}
						}
					});
				};
			}
			fr.readAsDataURL(files[0]);
		} else {
		}
	});
<?php } ?>
<?php function dialogo_alert_javascript(){ ?>
var _dialog_alert_options = {
	func_close: function(){},
}
function open_dialog_message(mensaje, func_close=function(){}){
	_dialog_alert_options.func_close = func_close;
	let max_height = $("#_dialogo_alert .window").innerHeight();
	let title_height = $("#_dialogo_alert .window .window_title").outerHeight();
	let buttons_height = $("#_dialogo_alert .window .window_buttons").outerHeight();
	$("#_dialogo_alert .window .window_body").height(max_height-(title_height+buttons_height));
	$("#_dialogo_alert .window_title").children().first().html('<g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier"> <path d="M16 2H8C4 2 2 4 2 8V21C2 21.55 2.45 22 3 22H16C20 22 22 20 22 16V8C22 4 20 2 16 2ZM14 15.25H7C6.59 15.25 6.25 14.91 6.25 14.5C6.25 14.09 6.59 13.75 7 13.75H14C14.41 13.75 14.75 14.09 14.75 14.5C14.75 14.91 14.41 15.25 14 15.25ZM17 10.25H7C6.59 10.25 6.25 9.91 6.25 9.5C6.25 9.09 6.59 8.75 7 8.75H17C17.41 8.75 17.75 9.09 17.75 9.5C17.75 9.91 17.41 10.25 17 10.25Z" fill="#00ff00"></path> </g>');
	$("#_dialogo_alert .window_title div").html("Mensaje");
	$("#_dialogo_alert .window_body").html(mensaje);
	$("#_dialogo_alert").css("display", "flex");
}
function open_dialog_alert(mensaje, func_close=function(){}){
	_dialog_alert_options.func_close = func_close;
	let max_height = $("#_dialogo_alert .window").innerHeight();
	let title_height = $("#_dialogo_alert .window .window_title").outerHeight();
	let buttons_height = $("#_dialogo_alert .window .window_buttons").outerHeight();
	$("#_dialogo_alert .window .window_body").height(max_height-(title_height+buttons_height));
	$("#_dialogo_alert .window_title").children().first().html('<g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier"> <g clip-path="url(#clip0_949_22799)"> <path fill-rule="evenodd" clip-rule="evenodd" d="M9.82664 2.22902C10.7938 0.590326 13.2063 0.590325 14.1735 2.22902L23.6599 18.3024C24.6578 19.9933 23.3638 22 21.4865 22H2.51362C0.63634 22 -0.657696 19.9933 0.340215 18.3024L9.82664 2.22902ZM10.0586 7.05547C10.0268 6.48227 10.483 6 11.0571 6H12.9429C13.517 6 13.9732 6.48227 13.9414 7.05547L13.5525 14.0555C13.523 14.5854 13.0847 15 12.554 15H11.446C10.9153 15 10.477 14.5854 10.4475 14.0555L10.0586 7.05547ZM14 18C14 19.1046 13.1046 20 12 20C10.8954 20 10 19.1046 10 18C10 16.8954 10.8954 16 12 16C13.1046 16 14 16.8954 14 18Z" fill="#ffff00"></path> </g> <defs> <clipPath id="clip0_949_22799"> <rect width="24" height="24" fill="white"></rect> </clipPath> </defs> </g>');
	$("#_dialogo_alert .window_title div").html("Alerta");
	$("#_dialogo_alert .window_body").html(mensaje);
	$("#_dialogo_alert").css("display", "flex");
}
<?php } ?>
<?php function dialogo_alert_ready(){ ?>
	$("#_dialogo_alert .btn_close").click(function (){
		$("#_dialogo_alert").css("display", "none");
		$("#_dialogo_alert .window_body").html("");
		_dialog_alert_options.func_close();
	});
<?php } ?>
<?php function dialogo_confirm_javascript(){ ?>
var _dialog_confirm_options = {
	func_accept: function(){},
	func_cancel: function(){},
}
function open_dialog_confirm(mensaje, func_accept, func_cancel=function(){}){
	let max_height = $("#_dialogo_confirm .window").innerHeight();
	let title_height = $("#_dialogo_confirm .window .window_title").outerHeight();
	let buttons_height = $("#_dialogo_confirm .window .window_buttons").outerHeight();
	$("#_dialogo_confirm .window .window_body").height(max_height-(title_height+buttons_height));
	_dialog_confirm_options.func_accept = func_accept;
	_dialog_confirm_options.func_cancel = func_cancel;
	$("#_dialogo_confirm .window_body").html(mensaje);
	$("#_dialogo_confirm").css("display", "flex");
}
var _dialog_input_options = {
	func_accept: function(){},
	func_cancel: function(){},
}
function open_dialog_input(mensaje, func_accept, func_cancel=function(){}){
	let max_height = $("#_dialogo_input .window").innerHeight();
	let title_height = $("#_dialogo_input .window .window_title").outerHeight();
	let buttons_height = $("#_dialogo_input .window .window_buttons").outerHeight();
	$("#_dialogo_input .window .window_body").height(max_height-(title_height+buttons_height));
	_dialog_input_options.func_accept = func_accept;
	_dialog_input_options.func_cancel = func_cancel;
	$("#_dialogo_input .window_body div").html(mensaje);
	$("#_dialogo_input input[type='text']").val("");
	$("#_dialogo_input").css("display", "flex");
}
<?php } ?>
<?php function dialogo_confirm_ready(){ ?>
	$("#_dialogo_confirm .btn_accept").click(function (){
		_dialog_confirm_options.func_accept();
		$("#_dialogo_confirm").css("display", "none");
	});
	$("#_dialogo_confirm .btn_close").click(function (){
		_dialog_confirm_options.func_cancel();
		$("#_dialogo_confirm").css("display", "none");
	});
	$("#_dialogo_input .btn_accept").click(function (){
		_dialog_input_options.func_accept($("#_dialogo_input input[type='text']").val());
		$("#_dialogo_input").css("display", "none");
	});
	$("#_dialogo_input .btn_close").click(function (){
		_dialog_input_options.func_cancel();
		$("#_dialogo_input").css("display", "none");
	});
<?php } ?>
<?php function dialogo_document_javascript(){ ?>
var ctrl_documento = {
	dialogo_impresion_tipo: 1,
	dialogo_impresion_ticket: "",
	dialogo_impresion_documento: "",
	dialogo_width_ticket: 300,
	dialogo_width_documento: 500,
}
function cargar_documentos_vista(html_ticket, html_documento, width_ticket, width_documento){
    ctrl_documento.dialogo_impresion_tipo = 1;
    ctrl_documento.dialogo_impresion_ticket = html_ticket;
    ctrl_documento.dialogo_impresion_documento = html_documento;
    ctrl_documento.dialogo_width_ticket = width_ticket;
    ctrl_documento.dialogo_width_documento = width_documento;
}
function mostrar_dialogo_imprimir(){
	ctrl_documento.dialogo_impresion_tipo = 1;
	$("#dialogo_imprimir .dialogo_mensaje").html(ctrl_documento.dialogo_impresion_ticket);
	$("#dialogo_imprimir .window").css("max-width", ctrl_documento.dialogo_width_ticket);
	$("#dialogo_imprimir").css("display", "flex");
}
<?php } ?>
<?php function dialogo_document_ready(){ ?>
	$("#dialogo_imprimir .btn_change").click(function(){
		if (ctrl_documento.dialogo_impresion_tipo == 1){
	        ctrl_documento.dialogo_impresion_tipo = 2;
	        $("#dialogo_imprimir .window").css("max-width", ctrl_documento.dialogo_width_documento);
	        $("#dialogo_imprimir .dialogo_mensaje").html("<p>" + ctrl_documento.dialogo_impresion_documento + "</p>");
		} else {
		    ctrl_documento.dialogo_impresion_tipo = 1;
	        $("#dialogo_imprimir .window").css("max-width", ctrl_documento.dialogo_width_ticket);
		    $("#dialogo_imprimir .dialogo_mensaje").html("<p>" + ctrl_documento.dialogo_impresion_ticket + "</p>");
		}
	});
	$("#dialogo_imprimir .btn_whatsapp").click(function (){
		open_dialog_input("Ingrese el número telefónico del destino<br /><strong>Ejm: 51999999999</strong>", function(telefono){
			let divElement = $('#dialogo_imprimir .dialogo_mensaje')[0];
			html2canvas(divElement).then(function(canvas) {
				var imagenBase64 = canvas.toDataURL('image/png');
				$(canvas).css("display", "none");//remove();
				$.ajax({
					type: 'POST',
					url: 'control/ctrl_imagen.php',
					dataType: "json",
					data: { 
						accion: "preparar_imagen_whatsapp",
						imagen: imagenBase64
					},
					success: function(datos) {
						//console.log(datos);
						var urlImagen = datos.url;
						/*window.open(urlImagen);
						$('#imagenConvertida').html('<a href="' + urlImagen + '" target="_blank">Enlace a la imagen</a>');*/
						window.open('https://web.whatsapp.com/send/?phone='+telefono+'&text='+urlImagen+'');
					}
				});
				document.body.appendChild(canvas);
			});
		});
	});
	$("#dialogo_imprimir .btn_close").click(function (){
		$("#dialogo_imprimir").css("display", "none");
	});
	$("#dialogo_imprimir .btn_print").click(function(){
		var divContents = $("#dialogo_imprimir .window_body").html();
		var a = window.open('', '', 'height=500, width=500');
		a.document.write('<html>');
		a.document.write('<body >');
		a.document.write(divContents);
		a.document.write('</body></html>');
		a.document.close();
		a.print();
	});
<?php } ?>
<?php if(false){ ?></script><?php } ?>
