[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_149":150,"_151":152},"routes/_app.x.$handle.$name",{"_93":92,"_31":43,"_101":83,"_26":102,"_13":14,"_103":-5,"_11":104,"_105":106,"_107":108,"_109":110,"_111":112,"_20":-5,"_113":-5,"_114":-5,"_115":24,"_116":117,"_118":24,"_119":-5,"_120":-5,"_121":122},"routes/_app.x.$handle.$name.branch.$branch.version.$version.diff",{"_11":12,"_13":14,"_15":16,"_17":-5,"_18":-5},"project",{"_41":42,"_31":43,"_36":44,"_45":-5,"_46":24,"_47":48,"_49":48,"_50":-5,"_51":-5,"_18":52,"_53":30,"_54":55,"_56":55,"_57":-5,"_58":59,"_60":61,"_62":-5,"_63":-5,"_64":-5,"_65":-5,"_66":67,"_68":67,"_69":70,"_71":70,"_72":70,"_73":67,"_74":67,"_75":76,"_77":78,"_79":80,"_81":24},"version",1,"changes",[19],"aiChatInfo","userId",{"_20":21,"_22":-7,"_23":24,"_25":24,"_26":27,"_28":27},"file",{"_29":30,"_31":27,"_32":33,"_34":35,"_36":37,"_38":14,"_39":40,"_23":24},"previous","deleted",false,"deletedHere","path","index.ts","latestPath","fileId","b1ab860a-4792-11f0-b8d5-76b3cceeab13","name","fileType","script","content","// Convert image URL to base64\nasync function getImageBase64(url: string): Promise {\n const res = await fetch(url);\n const buffer = await res.arrayBuffer();\n const base64 = btoa(String.fromCharCode(...new Uint8Array(buffer)));\n const contentType = res.headers.get(\"content-type\") || \"image/png\";\n return `data:${contentType};base64,${base64}`;\n}\n\nexport const generatePDF = async (options: {\n pageId: string;\n date: string;\n customerName: string;\n customerEmail: string;\n agentName: string;\n agentEmail: string;\n items: any[];\n}): Promise => {\n const { jsPDF } = await import(\"npm:jspdf\");\n const { applyPlugin } = await import(\"npm:jspdf-autotable\");\n\n const logoDataUrl = await getImageBase64(\n \"https://www.glance.cx/hs-fs/hubfs/raw_assets/public/Glance/images/gradientLogo.png\"\n );\n\n applyPlugin(jsPDF);\n\n const doc = new jsPDF();\n const {\n pageId,\n date,\n customerName,\n customerEmail,\n agentName,\n agentEmail,\n items,\n } = options;\n \n // variables for tabular content\n const keys = Object.keys(items[0]); // get column names\n const head = [keys];\n const tableBody = items.map((row) => keys.map((k) => row[k]));\n\n // Set initial y position for content\n let y = 20;\n // Set invoice header\n doc.setFontSize(18);\n\n // Add image: (imageData, format, x, y, width, height)\n doc.addImage(logoDataUrl, \"PNG\", 10, 10); // adjust width/height as needed\n\n doc.text(\"Glance cobrowse demo receipt\", 20, y);\n y += 7;\n doc.setFontSize(12);\n doc.text(`Date: ${date}`, 20, y);\n y += 20;\n doc.text(`For:`, 20, y);\n doc.text(`From:`, 100, y);\n y += 5;\n doc.text(`${customerName}`, 20, y);\n doc.text(`${agentName}`, 100, y);\n y += 5;\n doc.text(`${customerEmail}`, 20, y);\n doc.text(`${agentEmail}`, 100, y);\n // Set customer information\n y += 20;\n doc.autoTable({\n startY: y,\n head: head,\n body: tableBody,\n });\n y = doc.lastAutoTable.finalY + 20; // add some spacing\n\n // doc.line(20, y, 180, y);\n // y += 10;\n doc.text(\"Notes:\", 20, y);\n y += 10;\n doc.text(\"Thanks for cobrowsing with me!\", 20, y);\n // https://help.glance.cx/glance-cobrowse/features/pdf_cobrowse/\n y += 10;\n doc.text(\n \"If you want to learn more about cobrowsing and PDFs, check out our Docs:\",\n 20,\n y\n );\n y += 5;\n doc.text(\n \"https://help.glance.cx/glance-cobrowse/features/pdf_cobrowse/\",\n 20,\n y\n );\n\n y += 10;\n doc.text(`- ${agentName}`, 20, y);\n y += 20;\n doc.text(`${pageId}`, 20, y);\n\n return doc.output();\n};\n\nexport default async function(req: Request): Promise {\n const url = new URL(req.url);\n \n if (req.method === \"GET\" && url.pathname === \"/\") {\n // Serve the test form\n const html = `\n\n\n\n \n \n PDF Generator Test\n \n\n\n

PDF Generator Test

\n \n

\n Page ID\n \n

\n \n

\n Date\n \n

\n \n

\n Customer Name\n \n

\n \n

\n Customer Email\n \n

\n \n

\n Agent Name\n \n

\n \n

\n Agent Email\n \n

\n \n

\n Items (JSON format)\n \n

\n \n

\n \n \n

\n \n

Generated PDF Preview

\n \n

\n \n \n

\n\n \n\n`;\n \n return new Response(html, {\n headers: { \"Content-Type\": \"text/html\" }\n });\n }\n \n if (req.method === \"POST\" && url.pathname === \"/generate\") {\n try {\n const data = await req.json();\n \n // Validate required fields\n const requiredFields = ['pageId', 'date', 'customerName', 'customerEmail', 'agentName', 'agentEmail', 'items'];\n for (const field of requiredFields) {\n if (!data[field]) {\n return new Response(JSON.stringify({ error: `Missing required field: ${field}` }), {\n status: 400,\n headers: { \"Content-Type\": \"application/json\" }\n });\n }\n }\n \n if (!Array.isArray(data.items) || data.items.length === 0) {\n return new Response(JSON.stringify({ error: 'Items must be a non-empty array' }), {\n status: 400,\n headers: { \"Content-Type\": \"application/json\" }\n });\n }\n \n // Generate PDF\n const pdfOutput = await generatePDF(data);\n \n // Convert the PDF output to a proper binary response\n const pdfBuffer = new Uint8Array(pdfOutput.length);\n for (let i = 0; i < pdfOutput.length; i++) {\n pdfBuffer[i] = pdfOutput.charCodeAt(i);\n }\n \n return new Response(pdfBuffer, {\n headers: {\n \"Content-Type\": \"application/pdf\",\n \"Content-Disposition\": \"inline; filename=glance-receipt.pdf\"\n }\n });\n \n } catch (error) {\n console.error('PDF generation error:', error);\n return new Response(JSON.stringify({ \n error: 'Failed to generate PDF', \n details: error.message \n }), {\n status: 500,\n headers: { \"Content-Type\": \"application/json\" }\n });\n }\n }\n \n return new Response(\"Not Found\", { status: 404 });\n}","createdAt",["D",1749735582002],"branchVersion","branchId","7e2ab33c-4792-11f0-8e25-76b3cceeab13","id","7e2a6c4c-4792-11f0-8e25-76b3cceeab13","pdf-image",["D",1749735495597],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","imageUrl","a0bf3b31-15a5-4d5c-880e-4b1e22c9bc18","pinnedFileId","pinPreview",true,"pinMigrated","screenshotVersion","likeCount",0,"orgId","e81e7335-6d4c-4764-a902-d0962bbfa9f7","tursoName","tursoHostname","tursoMeasuredAt","pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_93":92,"_100":96},"org",{"_93":92,"_94":-5,"_95":96,"_18":52,"_97":98,"_99":24},"branch",{"_13":82,"_31":83,"_41":40,"_84":42,"_85":-5,"_86":-5,"_87":-5,"_88":-5,"_89":-5,"_90":43,"_91":92},"isOwned",18,"main","projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","stevekrouse","handle","displayName","avatar","https://images.clerk.dev/uploaded/img_2PqHa2Gsy93xQrjh2w78Xu0cChW.jpeg","tier","pro","canRestrictVals","profileImageUrl","branchName","","adoptOrgId",{"_41":42,"_31":43,"_36":145,"_45":-5,"_46":24,"_47":48,"_49":48,"_50":-5,"_51":-5,"_18":52,"_53":30,"_54":55,"_56":55,"_57":-5,"_58":59,"_60":61,"_62":-5,"_63":-5,"_64":-5,"_65":-5,"_66":67,"_68":67,"_69":70,"_71":70,"_72":70,"_73":67,"_74":67,"_75":146,"_77":147,"_79":148,"_81":24},"tree",[140],"files",[140],"counts",{"_130":59,"_131":14,"_132":59,"_133":134,"_135":136},"contents",[123],"upstreamProject","upstreamBranch","emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},{"_41":124,"_31":27,"_29":30,"_125":-5,"_39":40,"_38":14,"_126":24,"_36":127,"_13":59,"_32":33,"_34":35,"_23":24,"_128":-5,"_26":129},"b1ab851a-4792-11f0-b8d5-76b3cceeab13","parentId","latest",["D",1749735582002],"label",[27],"pulls","branches","forks","envVars",{"_137":59,"_139":59},"connections",{"_137":59,"_138":59},"count","unfilledCount","emptyCount",{"_41":124,"_31":27,"_29":30,"_125":-5,"_39":40,"_38":14,"_126":24,"_36":141,"_13":59,"_32":33,"_34":35,"_23":24,"_128":-5,"_142":143,"_26":144},["D",1749735582002],"children",[],[27],["D",1749735495597],{"_93":92,"_100":96},{"_93":92,"_94":-5,"_95":96,"_18":52,"_97":98,"_99":24},{"_13":82,"_31":83,"_41":40,"_84":42,"_85":-5,"_86":-5,"_87":-5,"_88":-5,"_89":-5,"_90":43,"_91":92},"ctx",{"_75":-5,"_120":182,"_183":184,"_185":186,"_187":24,"_188":24,"_189":24,"_190":55,"_191":-5,"_192":-7,"_193":-7,"_194":59,"_195":24,"_196":24,"_197":-5,"_198":24,"_199":24,"_200":24,"_201":-5},"ENV",{"_153":154,"_155":156,"_157":83,"_158":159,"_160":161,"_162":163,"_164":165,"_166":167,"_168":169,"_170":171,"_172":173,"_174":175,"_176":177,"_178":179,"_180":181},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","a3e067d4463eea85f6334f8e583e8516ae58c4f6","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",[],"preferencesKeybindings","default","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","preferencesCloseBrackets","preferencesChatPanelState","preferencesDprint","preferencesDenofmt","notificationCount","flagDenols","isBusinessOrgMember","businessOrgHandle","isBusinessOrgAdmin","isHigherTownieTier","navCollapsed","currentOrgId"]

Diff · v1