[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8},"actionData","errors","root",{"_111":112,"_113":114},"routes/embed.x.$handle.$name.$",{"_9":10,"_11":12,"_13":14,"_15":16,"_17":18,"_19":20,"_21":-5},"handle","noelgonzalezsuchi","name","suchi-house-pedidos","path","frontend/lib/impresora.ts","project",{"_22":49,"_11":12,"_35":50,"_51":-5,"_52":44,"_53":54,"_55":54,"_56":57,"_58":-5,"_59":60,"_61":62,"_63":34,"_64":-5,"_65":-5,"_66":67,"_68":69,"_70":71,"_72":73,"_74":75,"_76":-5,"_77":78,"_79":78,"_80":81,"_82":81,"_83":81,"_84":78,"_85":78,"_86":87,"_88":89,"_90":91,"_92":44},"file",{"_22":23,"_11":24,"_25":26,"_27":28,"_29":30,"_31":32,"_33":34,"_35":36,"_37":38,"_39":40,"_41":42,"_43":44,"_45":-5,"_13":46},"permalink","https://www.val.town/x/noelgonzalezsuchi/suchi-house-pedidos/code/frontend/lib/impresora.ts","extension","id","91fac50a-c450-4b17-a714-c6ee3ec5199a","impresora.ts","fileId","5b0e1b7c-a6b0-11f1-a3dc-1607ee4eb77e","parentId","23ccd461-0e81-4776-b28e-9b862f1f7433","branchId","8c0e03b9-4364-49a7-9f88-4b3a597ffffc","branchVersion",357,"latest",true,"createdAt",["D",1788481949249],"version",8,"fileType","script","content","/** @jsxImportSource https://esm.sh/react@18.2.0 */\n// Impresión térmica directa por Bluetooth (Web Bluetooth + ESC/POS), pensada para usarse desde\n// el celular sin depender de que Android reconozca la impresora como \"impresora del sistema\"\n// (la mayoría de las impresoras térmicas chinas baratas NO traen ese soporte — solo entienden\n// comandos ESC/POS crudos por Bluetooth). Esto le manda los bytes directo a la impresora.\n//\n// IMPORTANTE — soporte de navegador: Web Bluetooth funciona en Chrome/Edge en Android, Windows,\n// Mac y Linux. NO funciona en Safari/iOS (Apple lo bloquea en TODOS los navegadores de iPhone/\n// iPad, sea Safari, Chrome o el que sea). Si el celular que se va a usar es iPhone, esta función\n// nunca va a poder conectarse — en ese caso hay que usar la impresora por USB a una computadora.\n\nlet dispositivo: any = null;\nlet caracteristica: any = null;\nlet escuchas: Array<() => void> = [];\n\nfunction notificar() {\n escuchas.forEach((f) => f());\n}\n\n/** Se suscribe a cambios de conexión (conectado/desconectado). Devuelve función para cancelar. */\nexport function suscribirseImpresora(fn: () => void): () => void {\n escuchas.push(fn);\n return () => {\n escuchas = escuchas.filter((f) => f !== fn);\n };\n}\n\nexport function estadoImpresora(): { conectada: boolean; nombre: string | null } {\n return { conectada: !!caracteristica, nombre: dispositivo?.name || null };\n}\n\nexport function bluetoothDisponible(): boolean {\n return typeof navigator !== \"undefined\" && \"bluetooth\" in navigator;\n}\n\n// UUIDs de servicio conocidos que usan la mayoría de las impresoras térmicas ESC/POS chinas\n// (Zjiang/Goojprt/Kinwodon y clones). Se piden como optionalServices para poder verlos y\n// escribirles aunque el navegador nos deje elegir \"cualquier dispositivo\" al emparejar.\nconst SERVICIOS_CONOCIDOS = [\n \"000018f0-0000-1000-8000-00805f9b34fb\",\n \"49535343-fe7d-4ae5-8fa9-9fafd205e455\",\n \"e7810a71-73ae-499d-8c15-faa9aef0c3f2\",\n \"0000ff00-0000-1000-8000-00805f9b34fb\",\n \"0000ffe0-0000-1000-8000-00805f9b34fb\",\n];\n\nasync function conectarGatt() {\n if (!dispositivo) return;\n const servidor = await dispositivo.gatt.connect();\n const servicios = await servidor.getPrimaryServices();\n caracteristica = null;\n for (const servicio of servicios) {\n let caracteristicas: any[] = [];\n try {\n caracteristicas = await servicio.getCharacteristics();\n } catch {\n continue;\n }\n const escribible = caracteristicas.find((c) => c.properties?.write || c.properties?.writeWithoutResponse);\n if (escribible) {\n caracteristica = escribible;\n break;\n }\n }\n if (!caracteristica) {\n throw new Error(\"Se conectó pero no se encontró un canal de impresión en este dispositivo.\");\n }\n dispositivo.addEventListener(\"gattserverdisconnected\", () => {\n caracteristica = null;\n notificar();\n });\n notificar();\n}\n\n/** Abre el selector de dispositivos Bluetooth del navegador (requiere que lo dispare un clic\n * del usuario — no se puede llamar automáticamente). Una vez elegida y conectada, el navegador\n * recuerda el permiso para la próxima vez (reconectarSiEsPosible). */\nexport async function conectarImpresora(): Promise {\n if (!bluetoothDisponible()) {\n throw new Error(\"Este navegador no soporta Bluetooth (usa Chrome en Android o en computadora, no Safari/iPhone).\");\n }\n dispositivo = await (navigator as any).bluetooth.requestDevice({\n acceptAllDevices: true,\n optionalServices: SERVICIOS_CONOCIDOS,\n });\n await conectarGatt();\n}\n\nexport function desconectarImpresora() {\n try {\n dispositivo?.gatt?.disconnect();\n } catch {\n // ignorar\n }\n caracteristica = null;\n dispositivo = null;\n notificar();\n}\n\n/** Al cargar la app, intenta reconectar solo si el navegador ya recuerda un permiso concedido\n * antes (Chrome guarda el permiso de Bluetooth entre sesiones) — así no hay que reconectar a\n * mano cada vez que se abre la app. Si no hay nada recordado, no hace nada (ni truena). */\nexport async function reconectarSiEsPosible(): Promise {\n try {\n if (!bluetoothDisponible() || !(navigator as any).bluetooth.getDevices) return;\n const dispositivos = await (navigator as any).bluetooth.getDevices();\n if (dispositivos && dispositivos.length > 0) {\n dispositivo = dispositivos[0];\n await conectarGatt();\n }\n } catch {\n // sin permiso previo o el navegador no soporta reconexión automática — se conecta a mano\n }\n}\n\nasync function enviarBytes(datos: Uint8Array) {\n if (!caracteristica) throw new Error(\"No hay impresora Bluetooth conectada.\");\n const TAMANO_CHUNK = 180; // esta impresora sí aguanta bien este tamaño de escritura\n for (let i = 0; i < datos.length; i += TAMANO_CHUNK) {\n const trozo = datos.slice(i, i + TAMANO_CHUNK);\n if (caracteristica.properties?.writeWithoutResponse) {\n await caracteristica.writeValueWithoutResponse(trozo);\n } else {\n await caracteristica.writeValue(trozo);\n }\n await new Promise((r) => setTimeout(r, 20));\n }\n}\n\n// Tabla CP850 para los caracteres en español que no son ASCII plano. La mayoría de las\n// impresoras térmicas ESC/POS clonadas usan tablas de códigos estilo Epson; le mandamos el\n// comando para pedir la página 2 (PC850) como mejor esfuerzo — si en la impresora real de Noel\n// sale un caracter incorrecto en vez de una tilde, aquí es donde se ajusta el número de página.\nconst TABLA_CP850: Record = {\n \"á\": 0xA0,\n \"é\": 0x82,\n \"í\": 0xA1,\n \"ó\": 0xA2,\n \"ú\": 0xA3,\n \"ñ\": 0xA4,\n \"Ñ\": 0xA5,\n \"ü\": 0x81,\n \"Ü\": 0x9A,\n \"¿\": 0xA8,\n \"¡\": 0xAD,\n \"Á\": 0xB5,\n \"É\": 0x90,\n \"Í\": 0xD6,\n \"Ó\": 0xE0,\n \"Ú\": 0xE9,\n};\n\n/** Convierte el texto (UTF-16 de JS) a bytes que la impresora entienda. Los caracteres fuera del\n * ASCII básico y de la tabla de español (por ejemplo emojis) se omiten en vez de mandar basura,\n * porque una impresora térmica de un solo byte por caracter no los puede dibujar de todos modos. */\nfunction codificarTexto(texto: string): number[] {\n const bytes: number[] = [];\n for (const char of texto) {\n const code = char.codePointAt(0) || 0;\n if (code < 128) {\n bytes.push(code);\n } else if (TABLA_CP850[char] !== undefined) {\n bytes.push(TABLA_CP850[char]);\n }\n // cualquier otro caracter (emojis, símbolos raros) se omite\n }\n return bytes;\n}\n\nfunction construirComandosESCPOS(texto: string, opts: { bold?: boolean; alturaDoble?: boolean; cortar?: boolean } = {}): Uint8Array {\n const { cortar = true } = opts;\n const partes: number[] = [];\n partes.push(0x1B, 0x40); // ESC @ — inicializar\n partes.push(0x1B, 0x74, 2); // ESC t 2 — página de códigos PC850 (mejor esfuerzo para acentos/Ñ)\n\n let modo = 0;\n if (opts.bold) modo |= 0x08;\n if (opts.alturaDoble) modo |= 0x10;\n partes.push(0x1B, 0x21, modo); // ESC ! n — modo de impresión (negritas / doble alto)\n\n partes.push(...codificarTexto(texto));\n\n partes.push(0x1B, 0x21, 0x00); // reset del modo\n if (cortar) {\n partes.push(0x0A, 0x0A, 0x0A, 0x0A); // avance de papel antes de cortar\n partes.push(0x1D, 0x56, 0x01); // GS V 1 — corte (parcial; casi todos los modelos lo respetan)\n } else {\n // cortar:false — todavía sigue más contenido en el mismo ticket (p. ej. el logo justo\n // después), así que solo se avanza un poco de papel, SIN cortar.\n partes.push(0x0A, 0x0A);\n }\n\n return new Uint8Array(partes);\n}\n\n/** Imprime directo por Bluetooth (sin abrir el diálogo de impresión del navegador). Lanza error\n * si no hay ninguna impresora conectada — quien lo llama debe tener un plan B (ver imprimir() en\n * App.tsx, que cae de regreso a la ventana de impresión normal si esto falla). */\nexport async function imprimirBluetooth(texto: string, opts: { bold?: boolean; alturaDoble?: boolean; cortar?: boolean } = {}) {\n const datos = construirComandosESCPOS(texto, opts);\n await enviarBytes(datos);\n}\n\nfunction centrarTexto(texto: string, ancho = 48): string {\n if (texto.length >= ancho) return texto;\n const relleno = ancho - texto.length;\n const izq = Math.floor(relleno / 2);\n return \" \".repeat(izq) + texto;\n}\n\n/** Convierte una imagen (un /logo servido por el mismo val, para no toparse con problemas\n * de CORS) a bits blanco/negro listos para el comando ESC/POS de imagen rasterizada.\n *\n * La impresora siempre imprime la imagen empezando desde el borde izquierdo del papel — si el\n * lienzo que le mandamos mide lo mismo que el logo, el logo queda pegado a la izquierda en vez\n * de centrado. Por eso aquí el logo (anchoLogoPx, más angosto) se dibuja centrado dentro de un\n * lienzo del ancho TOTAL de la línea de impresión (anchoTotalPx — 576px = 80mm a 203dpi), con\n * relleno blanco a los lados; así la impresora sí lo muestra centrado en el papel.\n * Ambos anchos deben ser múltiplo de 8. */\nasync function rasterizarImagen(\n url: string,\n anchoLogoPx = 360,\n anchoTotalPx = 576,\n): Promise<{ ancho: number; alto: number; bits: Uint8Array }> {\n const img = new Image();\n await new Promise((resolve, reject) => {\n img.onload = () => resolve();\n img.onerror = () => reject(new Error(`No se pudo cargar la imagen del logo (${url})`));\n img.src = url;\n });\n const altoLogo = Math.max(1, Math.round((img.naturalHeight / img.naturalWidth) * anchoLogoPx) || anchoLogoPx);\n const canvas = document.createElement(\"canvas\");\n canvas.width = anchoTotalPx;\n canvas.height = altoLogo;\n const ctx = canvas.getContext(\"2d\")!;\n ctx.fillStyle = \"#ffffff\"; // fondo blanco: si el logo tiene transparencia, que no quede negro\n ctx.fillRect(0, 0, anchoTotalPx, altoLogo);\n const offsetX = Math.max(0, Math.floor((anchoTotalPx - anchoLogoPx) / 2)); // centra el logo en el lienzo\n ctx.drawImage(img, offsetX, 0, anchoLogoPx, altoLogo);\n const { data } = ctx.getImageData(0, 0, anchoTotalPx, altoLogo);\n\n const bytesPorFila = anchoTotalPx / 8;\n const bits = new Uint8Array(bytesPorFila * altoLogo);\n for (let y = 0; y < altoLogo; y++) {\n for (let x = 0; x < anchoTotalPx; x++) {\n const i = (y * anchoTotalPx + x) * 4;\n const r = data[i], g = data[i + 1], b = data[i + 2], a = data[i + 3];\n const gris = a === 0 ? 255 : (r + g + b) / 3;\n const esNegro = gris < 170; // umbral simple; si sale muy tenue/oscuro en la impresora real, se ajusta aquí\n if (esNegro) {\n const byteIdx = y * bytesPorFila + (x >> 3);\n bits[byteIdx] |= 0x80 >> (x % 8);\n }\n }\n }\n return { ancho: anchoTotalPx, alto: altoLogo, bits };\n}\n\n/** Imprime una imagen (el logo de Suchi House) centrada por Bluetooth, usando el comando ESC/POS\n * de imagen rasterizada (GS v 0) — es el comando más compatible, lo entienden hasta las\n * impresoras térmicas chinas más genéricas (a diferencia de comandos de imagen más nuevos que\n * solo traen impresoras de marca). Por defecto se usa el logotipo (logo-wordmark.svg), que ya\n * trae el texto \"Suchi House\" integrado en el diseño, así que no hace falta imprimir texto\n * aparte debajo — si algún día se usa el ícono solo (sin texto), pasar incluirTexto:true. */\nexport async function imprimirLogoBluetooth(\n url: string,\n opts: { anchoPx?: number; anchoTotalPx?: number; cortar?: boolean; incluirTexto?: boolean } = {},\n) {\n const { anchoPx = 360, anchoTotalPx = 576, cortar = true, incluirTexto = false } = opts;\n const { ancho, alto, bits } = await rasterizarImagen(url, anchoPx, anchoTotalPx);\n const bytesPorFila = ancho / 8;\n const cabecera = [\n 0x1D, 0x76, 0x30, 0x00, // GS v 0 m=0 — imagen rasterizada normal\n bytesPorFila & 0xFF, (bytesPorFila >> 8) & 0xFF,\n alto & 0xFF, (alto >> 8) & 0xFF,\n ];\n const pie: number[] = [0x0A];\n const datosImagen = new Uint8Array(cabecera.length + bits.length + pie.length);\n datosImagen.set(cabecera, 0);\n datosImagen.set(bits, cabecera.length);\n datosImagen.set(pie, cabecera.length + bits.length);\n await enviarBytes(datosImagen);\n\n if (incluirTexto) {\n await imprimirBluetooth(centrarTexto(\"SUCHI HOUSE\"), { bold: true, cortar });\n } else {\n // Nada más avanza/corta el papel — el logo ya trae el texto integrado.\n await enviarBytes(construirComandosESCPOS(\"\", { cortar }));\n }\n}\n","deleted",false,"label",[47,48,24],"frontend","lib","8f3a6802-82b2-4247-8cf7-f627cfe596c3",["D",1788198568874],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","Sistema de pedidos por botones + inventario para Suchi House","imageUrl","userId","fb83bb5a-9aee-4548-804a-06dc8e5f8bba","pinnedFileId","01a058f0-c40d-736f-b689-e16a000d9213","pinPreview","pinMigrated","screenshotVersion","likeCount",0,"orgId","01a058ef-c604-7433-a919-134dbc7b0e08","tursoName","8f3a680282b242478cf7f627cfe596c3","tursoHostname","8f3a680282b242478cf7f627cfe596c3-val-town.aws-us-east-2.turso.io","tursoMeasuredAt",["D",1789501878689],"pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_9":10,"_110":106},"org",{"_9":10,"_103":104,"_105":106,"_59":60,"_107":108,"_109":44},"branch",{"_37":93,"_11":94,"_22":30,"_95":49,"_96":-5,"_97":-5,"_98":-5,"_99":-5,"_100":-5,"_101":12,"_102":10},"isOwned",469,"main","projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","displayName","Gonzalez Garcia Noel","avatar","https://lh3.googleusercontent.com/a/ACg8ocIrFrculUXpRQjUt_dP3J-Hz7IQ4pouMXM2lew629FNmup_Ecm8=s96-c","tier","free","canRestrictVals","profileImageUrl","ctx",{"_86":-5,"_144":145,"_146":147,"_148":149,"_150":44,"_151":44,"_152":44,"_153":34,"_154":-5,"_155":-7,"_156":-7,"_157":67,"_158":44,"_159":44,"_160":-5,"_161":44,"_162":44,"_163":44,"_164":-5},"ENV",{"_115":116,"_117":118,"_119":94,"_120":121,"_122":123,"_124":125,"_126":127,"_128":129,"_130":131,"_132":133,"_134":135,"_136":137,"_138":139,"_140":141,"_142":143},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","e87eb04e707cf64e7e532c8e8ec395f209e17f15","RENDER_GIT_BRANCH","POSTHOG_API_TOKEN","phc_nmoyuAkStEZuUp69rYlg1DZgrIt19Gx0Y4Hwf8tGgJP","POSTHOG_API_HOST","https://wart.val.town","WEB_API_TEMPLATE","https://{val}.web.val.run","APP_URL","https://www.val.town","MODULE_URL","https://esm.town","VANITY_WEB_API_TEMPLATE","https://{label}.val.run/","DENOLS_URL","https://lsp.val.town","NODE_ENV","production","CLOUDFLARE_TURNSTILE_SITE_KEY","0x4AAAAAACtaIZJH7s9rBMZ6","GOOGLE_CLIENT_ID","875989696899-jtsqkhlbdv5jrlsk8631p7ipjg3c6o62.apps.googleusercontent.com","STRIPE_PUBLISHABLE_KEY","pk_live_51N2zvWEpZTTLipIkVEwXrUG9AT0yeOOEYxszarZT1jpsZV58Ly6wlg3SltZpHN26CUalOBmUSY7adQRQiSkCZz2500qSXNkf8Y","API_URL","https://api.val.town","orgs",[],"preferencesKeybindings","default","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","preferencesCloseBrackets","preferencesChatPanelState","preferencesDprint","preferencesDenofmt","notificationCount","flagDenols","isBusinessOrgMember","businessOrgHandle","isBusinessOrgAdmin","isHigherTownieTier","navCollapsed","currentOrgId"]