wowok/dist/cjs/w/messenger/templates/wts-html-template.js

Wowok Blockchain TypeScript API

export function escapeHtml(a){if(!a)return'';return a['replace'](/&/g,'&amp;')['replace'](/</g,'&lt;')['replace'](/>/g,'&gt;')['replace'](/"/g,'&quot;')['replace'](/'/g,'&#039;');}export function formatFileSize(a){if(a<0x400)return a+'\x20B';if(a<0x400*0x400)return(a/0x400)['toFixed'](0x1)+'\x20KB';return(a/(0x400*0x400))['toFixed'](0x1)+'\x20MB';}export function isNonTextMessage(a){return!!a['zipMetadata'];}export function getFileTypeLabel(a){if(a['zipMetadata']?.['contentType'])return a['zipMetadata']['contentType']['toUpperCase']();const b=a['zipMetadata']?.['fileName']||'';if(b['endsWith']('.wts'))return'WTS';if(b['endsWith']('.wip'))return'WIP';if(b['endsWith']('.zip'))return'ZIP';if(b['endsWith']('.json'))return'JSON';if(b['endsWith']('.txt'))return'TXT';if(a['zipMetadata'])return'ZIP';return'FILE';}export function getThemeColors(a){return{'bgColor':a==='dark'?'#1a1a1a':'#ffffff','textColor':a==='dark'?'#e0e0e0':'#333333','borderColor':a==='dark'?'#444444':'#e0e0e0'};}export function getMessageColors(a,b){return b?{'bgColor':a==='dark'?'#1a365d':'#e3f2fd','borderColor':a==='dark'?'#3b82f6':'#90caf9'}:{'bgColor':a==='dark'?'#1e3a2f':'#e8f5e9','borderColor':a==='dark'?'#10b981':'#a5d6a7'};}export function generateFileButton(a,b,c){if(!a['plaintext']||!a['zipMetadata']?.['fileName'])return'';const d=a['zipMetadata']['fileName'],e=a['plaintext'],f=a['zipMetadata']['fileSize']||0x0,g=getFileTypeLabel(a),h=c==='dark'?'#2a3f2a':'#e8f5e9',i=c==='dark'?'#4caf50':'#4caf50',j=c==='dark'?'#81c784':'#2e7d32',k='#4caf50',l='#45a049';return'\x0a\x09\x09<div\x20style=\x22margin:\x2012px\x200;\x20padding:\x2016px;\x20background:\x20'+h+';\x20border:\x201px\x20solid\x20'+i+';\x20border-radius:\x208px;\x20text-align:\x20center;\x22>\x0a\x09\x09\x09<div\x20style=\x22font-size:\x2014px;\x20color:\x20'+j+';\x20margin-bottom:\x208px;\x22>\x0a\x09\x09\x09\x09📎\x20'+escapeHtml(g)+'\x20File\x0a\x09\x09\x09\x09<span\x20style=\x22font-size:\x2012px;\x20color:\x20#666;\x22>('+formatFileSize(f)+')</span>\x0a\x09\x09\x09</div>\x0a\x09\x09\x09<button\x20\x0a\x09\x09\x09\x09onclick=\x22saveFile'+b+'()\x22\x0a\x09\x09\x09\x09style=\x22padding:\x2010px\x2024px;\x20background:\x20'+k+';\x20color:\x20white;\x20border:\x20none;\x20border-radius:\x204px;\x20cursor:\x20pointer;\x20font-size:\x2014px;\x22\x0a\x09\x09\x09\x09onmouseover=\x22this.style.background=\x27'+l+'\x27\x22\x0a\x09\x09\x09\x09onmouseout=\x22this.style.background=\x27'+k+'\x27\x22\x0a\x09\x09\x09>\x0a\x09\x09\x09\x09💾\x20Save\x20'+escapeHtml(d)+'\x0a\x09\x09\x09</button>\x0a\x09\x09</div>\x0a\x09\x09<script>\x0a\x09\x09\x09function\x20saveFile'+b+'()\x20{\x0a\x09\x09\x09\x09try\x20{\x0a\x09\x09\x09\x09\x09const\x20base64Data\x20=\x20\x22'+escapeHtml(e)+'\x22;\x0a\x09\x09\x09\x09\x09const\x20byteCharacters\x20=\x20atob(base64Data);\x0a\x09\x09\x09\x09\x09const\x20byteNumbers\x20=\x20new\x20Array(byteCharacters.length);\x0a\x09\x09\x09\x09\x09for\x20(let\x20i\x20=\x200;\x20i\x20<\x20byteCharacters.length;\x20i++)\x20{\x0a\x09\x09\x09\x09\x09\x09byteNumbers[i]\x20=\x20byteCharacters.charCodeAt(i);\x0a\x09\x09\x09\x09\x09}\x0a\x09\x09\x09\x09\x09const\x20byteArray\x20=\x20new\x20Uint8Array(byteNumbers);\x0a\x09\x09\x09\x09\x09\x0a\x09\x09\x09\x09\x09let\x20mimeType\x20=\x20\x22application/octet-stream\x22;\x0a\x09\x09\x09\x09\x09const\x20fileName\x20=\x20\x22'+escapeHtml(d)+'\x22;\x0a\x09\x09\x09\x09\x09if\x20(fileName.endsWith(\x27.json\x27))\x20mimeType\x20=\x20\x22application/json\x22;\x0a\x09\x09\x09\x09\x09else\x20if\x20(fileName.endsWith(\x27.zip\x27))\x20mimeType\x20=\x20\x22application/zip\x22;\x0a\x09\x09\x09\x09\x09else\x20if\x20(fileName.endsWith(\x27.txt\x27))\x20mimeType\x20=\x20\x22text/plain\x22;\x0a\x09\x09\x09\x09\x09\x0a\x09\x09\x09\x09\x09const\x20blob\x20=\x20new\x20Blob([byteArray],\x20{\x20type:\x20mimeType\x20});\x0a\x09\x09\x09\x09\x09const\x20url\x20=\x20URL.createObjectURL(blob);\x0a\x09\x09\x09\x09\x09const\x20a\x20=\x20document.createElement(\x22a\x22);\x0a\x09\x09\x09\x09\x09a.href\x20=\x20url;\x0a\x09\x09\x09\x09\x09a.download\x20=\x20fileName;\x0a\x09\x09\x09\x09\x09document.body.appendChild(a);\x0a\x09\x09\x09\x09\x09a.click();\x0a\x09\x09\x09\x09\x09document.body.removeChild(a);\x0a\x09\x09\x09\x09\x09URL.revokeObjectURL(url);\x0a\x09\x09\x09\x09}\x20catch\x20(e)\x20{\x0a\x09\x09\x09\x09\x09alert(\x27保存文件失败:\x20\x27\x20+\x20e.message);\x0a\x09\x09\x09\x09}\x0a\x09\x09\x09}\x0a\x09\x09</script>\x0a\x09';}export function generateMessageHtml(a,b,c){const {theme:d,borderColor:e,myAddress:f,maxLastReceivedLeafIndex:g}=c,h=isNonTextMessage(a),i=a['from']['toLowerCase']()===f['toLowerCase'](),j=i&&g>=0x0&&a['leafIndex']<=g,k=getMessageColors(d,i),l=d==='dark'?'#333333':'#ffffff';let m='';if(h)m=generateFileButton(a,b,d);else a['plaintext']&&(m='<div\x20style=\x22margin:\x2012px\x200;\x20padding:\x2012px;\x20background:\x20'+l+';\x20border:\x201px\x20solid\x20'+e+';\x20border-radius:\x204px;\x20font-size:\x2014px;\x20line-height:\x201.6;\x20max-height:\x20calc(1.6em\x20*\x206);\x20overflow-y:\x20auto;\x20white-space:\x20pre-wrap;\x20word-break:\x20break-word;\x22>'+escapeHtml(a['plaintext'])+'</div>');const n=['<div>Merkle\x20Root:\x20'+escapeHtml(a['merkleRoot'])+'</div>',a['arkConfirmed']?'<div>ARK\x20Confirmed:\x20'+escapeHtml(a['arkConfirmed']['recipient'])+'\x20at\x20'+new Date(a['arkConfirmed']['timestamp'])['toLocaleString']()+'</div>':'',a['guardAddress']?'<div>Guard:\x20'+escapeHtml(a['guardAddress'])+'</div>':'',a['passportAddress']?'<div>Passport:\x20'+escapeHtml(a['passportAddress'])+'</div>':'']['filter'](Boolean)['join']('');return'\x0a\x09\x09<div\x20style=\x22margin:\x2016px\x200;\x20padding:\x2016px;\x20border:\x201px\x20solid\x20'+k['borderColor']+';\x20border-radius:\x208px;\x20background:\x20'+k['bgColor']+';\x22>\x0a\x09\x09\x09<div\x20style=\x22display:\x20flex;\x20justify-content:\x20space-between;\x20margin-bottom:\x208px;\x20font-size:\x2012px;\x20color:\x20#666;\x22>\x0a\x09\x09\x09\x09<span>From:\x20'+escapeHtml(a['from']['slice'](0x0,0x6))+'...'+escapeHtml(a['from']['slice'](-0x3))+'\x20To:\x20'+escapeHtml(a['to']['slice'](0x0,0x6))+'...'+escapeHtml(a['to']['slice'](-0x3))+'</span>\x0a\x09\x09\x09\x09<span>'+new Date(a['timestamp'])['toLocaleString']()+'</span>\x0a\x09\x09\x09</div>\x0a\x09\x09\x09'+m+'\x0a\x09\x09\x09<div\x20style=\x22margin:\x208px\x200;\x20font-size:\x2011px;\x20color:\x20#666;\x22>\x0a\x09\x09\x09\x09'+n+'\x0a\x09\x09\x09</div>\x0a\x09\x09\x09<div\x20style=\x22font-size:\x2011px;\x20color:\x20#888;\x20margin-top:\x208px;\x20padding-top:\x208px;\x20border-top:\x201px\x20solid\x20'+e+';\x20display:\x20flex;\x20justify-content:\x20space-between;\x20align-items:\x20center;\x22>\x0a\x09\x09\x09\x09<div>Leaf\x20Index:\x20'+a['leafIndex']+'</div>\x0a\x09\x09\x09\x09'+(j?'<span\x20style=\x22color:\x20#4caf50;\x22>Delivered\x20&\x20Decrypted</span>':'')+'\x0a\x09\x09\x09</div>\x0a\x09\x09</div>\x0a\x09';}export function generateSignatureHtml(a,b,c){if(!a['signatures']||a['signatures']['length']===0x0)return'';const d=b==='dark'?'#2a3f2a':'#e8f5e9',e=b==='dark'?'#81c784':'#2e7d32',f=a['signatures']['map']((g,h)=>'\x0a\x09\x09\x09<div\x20style=\x22font-size:\x2010px;\x20color:\x20'+c+';\x20margin-left:\x208px;\x22>\x0a\x09\x09\x09\x09'+(h+0x1)+'.\x20'+(g['address']?escapeHtml(g['address']['slice'](0x0,0x6))+'...'+escapeHtml(g['address']['slice'](-0x3)):'Unknown')+':\x20\x0a\x09\x09\x09\x09'+(g['valid']?'<span\x20style=\x22color:\x20#4caf50;\x22>✓\x20Valid</span>':'<span\x20style=\x22color:\x20#f44336;\x22>✗\x20Invalid</span>')+'\x0a\x09\x09\x09</div>\x0a\x09\x09')['join']('');return'\x0a\x09\x09<div\x20style=\x22margin-top:\x208px;\x20padding:\x208px;\x20background:\x20'+d+';\x20border-radius:\x204px;\x22>\x0a\x09\x09\x09<div\x20style=\x22font-size:\x2011px;\x20color:\x20'+e+';\x20margin-bottom:\x204px;\x22>\x0a\x09\x09\x09\x09✓\x20Signature\x20Verification\x20('+a['signatures']['length']+'\x20signature'+(a['signatures']['length']>0x1?'s':'')+')\x0a\x09\x09\x09</div>\x0a\x09\x09\x09'+f+'\x0a\x09\x09</div>\x0a\x09';}const MESSAGES_PER_PAGE=0x64;export function generateHtmlPage(a){const {title:b,theme:c,bgColor:d,textColor:e,borderColor:f,meta:g,payload:h,verifyResult:i,maxLastReceivedLeafIndex:j}=a,k=h['messages']['length'],l=Math['ceil'](k/MESSAGES_PER_PAGE),m=[];for(let s=0x0;s<l;s++){const t=s*MESSAGES_PER_PAGE,u=Math['min'](t+MESSAGES_PER_PAGE,k),v=h['messages']['slice'](t,u),w=v['map']((x,y)=>generateMessageHtml(x,t+y,a))['join']('');m['push']({'pageNum':s+0x1,'html':'<div\x20class=\x22page\x22\x20data-page=\x22'+(s+0x1)+'\x22\x20style=\x22display:\x20'+(s===0x0?'block':'none')+';\x22>'+w+'</div>'});}const n=l>0x1?generatePaginationHtml(l,c,e):'',o=m['map'](x=>x['html'])['join'](''),p=generateSignatureHtml(i,c,e),q=i['valid']?'<span\x20style=\x22color:\x20#4caf50;\x20margin-left:\x208px;\x22>✓\x20The\x20accuracy,\x20sequentiality,\x20and\x20integrity\x20of\x20the\x20messages\x20are\x20verified\x20without\x20tampering</span>':'<span\x20style=\x22color:\x20#ff9800;\x20margin-left:\x208px;\x22>⚠\x20'+(i['error']||'Hash\x20mismatch\x20-\x20content\x20has\x20been\x20tampered')+'</span>',r=j>=0x0?'<div>Delivered\x20&\x20Decrypted\x20Leaf\x20Index:\x20'+j+'\x20(sent\x20messages\x20are\x20only\x20confirmed\x20as\x20decrypted\x20after\x20receiving\x20a\x20reply\x20from\x20the\x20other\x20party)</div>':'';return'<!DOCTYPE\x20html>\x0a<html\x20lang=\x22en\x22>\x0a<head>\x0a\x20\x20\x20\x20<meta\x20charset=\x22UTF-8\x22>\x0a\x20\x20\x20\x20<meta\x20name=\x22viewport\x22\x20content=\x22width=device-width,\x20initial-scale=1.0\x22>\x0a\x20\x20\x20\x20<title>'+escapeHtml(b)+'</title>\x0a\x20\x20\x20\x20<style>\x0a\x20\x20\x20\x20\x20\x20\x20\x20body\x20{\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20font-family:\x20-apple-system,\x20BlinkMacSystemFont,\x20\x22Segoe\x20UI\x22,\x20Roboto,\x20sans-serif;\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20max-width:\x20800px;\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20margin:\x200\x20auto;\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20padding:\x2020px;\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20background:\x20'+d+';\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20color:\x20'+e+';\x0a\x20\x20\x20\x20\x20\x20\x20\x20}\x0a\x20\x20\x20\x20\x20\x20\x20\x20.header\x20{\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20border-bottom:\x202px\x20solid\x20'+f+';\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20padding-bottom:\x2016px;\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20margin-bottom:\x2024px;\x0a\x20\x20\x20\x20\x20\x20\x20\x20}\x0a\x20\x20\x20\x20\x20\x20\x20\x20.meta\x20{\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20font-size:\x2012px;\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20color:\x20#666;\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20margin-top:\x208px;\x0a\x20\x20\x20\x20\x20\x20\x20\x20}\x0a\x20\x20\x20\x20\x20\x20\x20\x20.note\x20{\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20font-size:\x2011px;\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20color:\x20#999;\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20margin-top:\x2012px;\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20padding:\x208px;\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20background:\x20'+(c==='dark'?'#2a2a2a':'#f5f5f5')+';\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20border-radius:\x204px;\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20font-style:\x20italic;\x0a\x20\x20\x20\x20\x20\x20\x20\x20}\x0a\x20\x20\x20\x20\x20\x20\x20\x20.pagination\x20{\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20display:\x20flex;\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20justify-content:\x20center;\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20align-items:\x20center;\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20gap:\x208px;\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20margin-top:\x2024px;\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20padding:\x2016px;\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20border-top:\x201px\x20solid\x20'+f+';\x0a\x20\x20\x20\x20\x20\x20\x20\x20}\x0a\x20\x20\x20\x20\x20\x20\x20\x20.pagination\x20button\x20{\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20padding:\x208px\x2016px;\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20border:\x201px\x20solid\x20'+f+';\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20background:\x20'+(c==='dark'?'#333':'#fff')+';\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20color:\x20'+e+';\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20cursor:\x20pointer;\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20border-radius:\x204px;\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20font-size:\x2014px;\x0a\x20\x20\x20\x20\x20\x20\x20\x20}\x0a\x20\x20\x20\x20\x20\x20\x20\x20.pagination\x20button:hover:not(:disabled)\x20{\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20background:\x20'+(c==='dark'?'#444':'#f0f0f0')+';\x0a\x20\x20\x20\x20\x20\x20\x20\x20}\x0a\x20\x20\x20\x20\x20\x20\x20\x20.pagination\x20button:disabled\x20{\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20opacity:\x200.5;\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20cursor:\x20not-allowed;\x0a\x20\x20\x20\x20\x20\x20\x20\x20}\x0a\x20\x20\x20\x20\x20\x20\x20\x20.pagination\x20.page-info\x20{\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20font-size:\x2014px;\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20color:\x20#666;\x0a\x20\x20\x20\x20\x20\x20\x20\x20}\x0a\x20\x20\x20\x20\x20\x20\x20\x20.page\x20{\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20animation:\x20fadeIn\x200.3s\x20ease-in;\x0a\x20\x20\x20\x20\x20\x20\x20\x20}\x0a\x20\x20\x20\x20\x20\x20\x20\x20@keyframes\x20fadeIn\x20{\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20from\x20{\x20opacity:\x200;\x20}\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20to\x20{\x20opacity:\x201;\x20}\x0a\x20\x20\x20\x20\x20\x20\x20\x20}\x0a\x20\x20\x20\x20</style>\x0a</head>\x0a<body>\x0a\x20\x20\x20\x20<div\x20class=\x22header\x22>\x0a\x20\x20\x20\x20\x20\x20\x20\x20<h1>Witness\x20Timestamped\x20Sequence</h1>\x0a\x20\x20\x20\x20\x20\x20\x20\x20<div\x20class=\x22note\x22>\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20Important\x20Note:\x20This\x20page\x20is\x20for\x20message\x20browsing\x20and\x20verification\x20reference\x20only.\x20Please\x20verify\x20whether\x20the\x20message\x20sequence\x20has\x20been\x20tampered\x20with\x20through\x20the\x20\x27verify_wts\x27\x20API\x20using\x20the\x20WTS\x20file.\x0a\x20\x20\x20\x20\x20\x20\x20\x20</div>\x0a\x20\x20\x20\x20\x20\x20\x20\x20<div\x20style=\x22font-size:\x2014px;\x20color:\x20#666;\x20margin-top:\x204px;\x22>\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20'+new Date(g['startTime'])['toLocaleDateString']()+'\x20-\x20'+new Date(g['endTime'])['toLocaleDateString']()+'\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20'+q+'\x0a\x20\x20\x20\x20\x20\x20\x20\x20</div>\x0a\x20\x20\x20\x20\x20\x20\x20\x20<div\x20class=\x22meta\x22>\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20<div>Messages:\x20'+g['messageCount']+'\x20|\x20Time:\x20'+new Date(g['startTime'])['toLocaleString']()+'\x20-\x20'+new Date(g['endTime'])['toLocaleString']()+'</div>\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20<div\x20style=\x22word-break:\x20break-all;\x22>Merkle\x20Root:\x20'+escapeHtml(g['merkleRoot'])+'</div>\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20'+r+'\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20<div\x20style=\x22color:\x20'+(c==='dark'?'#3b82f6':'#1976d2')+';\x22>Creator:\x20'+escapeHtml(g['creator'])+'</div>\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20<div\x20style=\x22color:\x20'+(c==='dark'?'#10b981':'#2e7d32')+';\x22>Participant:\x20'+escapeHtml(g['participant'])+'</div>\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20'+p+'\x0a\x20\x20\x20\x20\x20\x20\x20\x20</div>\x0a\x20\x20\x20\x20</div>\x0a\x20\x20\x20\x20<div\x20id=\x22messages-container\x22>\x0a\x20\x20\x20\x20\x20\x20\x20\x20'+o+'\x0a\x20\x20\x20\x20</div>\x0a\x20\x20\x20\x20'+n+'\x0a\x20\x20\x20\x20<script>\x0a\x20\x20\x20\x20\x20\x20\x20\x20(function()\x20{\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20let\x20currentPage\x20=\x201;\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20const\x20totalPages\x20=\x20'+l+';\x0a\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20function\x20showPage(pageNum)\x20{\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20//\x20隐藏所有页面\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20document.querySelectorAll(\x27.page\x27).forEach(page\x20=>\x20{\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20page.style.display\x20=\x20\x27none\x27;\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20});\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20//\x20显示目标页面\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20const\x20targetPage\x20=\x20document.querySelector(\x27.page[data-page=\x22\x27\x20+\x20pageNum\x20+\x20\x27\x22]\x27);\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20if\x20(targetPage)\x20{\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20targetPage.style.display\x20=\x20\x27block\x27;\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20}\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20currentPage\x20=\x20pageNum;\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20updatePaginationButtons();\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20}\x0a\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20function\x20updatePaginationButtons()\x20{\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20const\x20prevBtn\x20=\x20document.getElementById(\x27prev-btn\x27);\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20const\x20nextBtn\x20=\x20document.getElementById(\x27next-btn\x27);\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20const\x20pageInfo\x20=\x20document.getElementById(\x27page-info\x27);\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20if\x20(prevBtn)\x20prevBtn.disabled\x20=\x20currentPage\x20===\x201;\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20if\x20(nextBtn)\x20nextBtn.disabled\x20=\x20currentPage\x20===\x20totalPages;\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20if\x20(pageInfo)\x20pageInfo.textContent\x20=\x20\x27Page\x20\x27\x20+\x20currentPage\x20+\x20\x27\x20of\x20\x27\x20+\x20totalPages;\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20}\x0a\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20//\x20绑定按钮事件\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20const\x20prevBtn\x20=\x20document.getElementById(\x27prev-btn\x27);\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20const\x20nextBtn\x20=\x20document.getElementById(\x27next-btn\x27);\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20if\x20(prevBtn)\x20{\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20prevBtn.addEventListener(\x27click\x27,\x20function()\x20{\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20if\x20(currentPage\x20>\x201)\x20showPage(currentPage\x20-\x201);\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20});\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20}\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20if\x20(nextBtn)\x20{\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20nextBtn.addEventListener(\x27click\x27,\x20function()\x20{\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20if\x20(currentPage\x20<\x20totalPages)\x20showPage(currentPage\x20+\x201);\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20});\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20}\x0a\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20//\x20初始化\x0a\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20\x20updatePaginationButtons();\x0a\x20\x20\x20\x20\x20\x20\x20\x20})();\x0a\x20\x20\x20\x20</script>\x0a</body>\x0a</html>';}function generatePaginationHtml(a,b,c){return'\x0a\x20\x20\x20\x20<div\x20class=\x22pagination\x22>\x0a\x20\x20\x20\x20\x20\x20\x20\x20<button\x20id=\x22prev-btn\x22\x20disabled>←\x20Previous</button>\x0a\x20\x20\x20\x20\x20\x20\x20\x20<span\x20class=\x22page-info\x22\x20id=\x22page-info\x22>Page\x201\x20of\x20'+a+'</span>\x0a\x20\x20\x20\x20\x20\x20\x20\x20<button\x20id=\x22next-btn\x22\x20'+(a<=0x1?'disabled':'')+'>Next\x20→</button>\x0a\x20\x20\x20\x20</div>';}