generated from Labyricorn/labyricorn-project-template
124 lines
4.3 KiB
JavaScript
124 lines
4.3 KiB
JavaScript
/**
|
|
* CyberSim OS - Document & Spreadsheet Viewer
|
|
*/
|
|
|
|
export class DocViewerApp {
|
|
constructor({ windowManager, eventBus }) {
|
|
this.wm = windowManager;
|
|
this.eventBus = eventBus;
|
|
}
|
|
|
|
getIconSvg() {
|
|
return `<svg viewBox="0 0 24 24" fill="none" stroke="#16a34a" stroke-width="2"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"/><polyline points="14 2 14 8 20 8"/><line x1="16" y1="13" x2="8" y2="13"/><line x1="16" y1="17" x2="8" y2="17"/><polyline points="10 9 9 9 8 9"/></svg>`;
|
|
}
|
|
|
|
openDocument(file) {
|
|
const win = this.wm.createWindow({
|
|
id: `doc_${file.id}`,
|
|
title: `${file.name} - Document Viewer`,
|
|
iconSvg: this.getIconSvg(),
|
|
width: 820,
|
|
height: 600,
|
|
bodyContent: this.renderDocument(file)
|
|
});
|
|
|
|
this.eventBus.emit('DOC_VIEWED', {
|
|
target: file.name,
|
|
details: { fileId: file.id, type: file.type }
|
|
});
|
|
}
|
|
|
|
renderDocument(file) {
|
|
if (file.type === 'spreadsheet' && file.content) {
|
|
return `
|
|
<div class="doc-viewer-container">
|
|
<div class="doc-toolbar">
|
|
<div class="doc-title-info">
|
|
<span>📊 ${file.name}</span>
|
|
<span class="cs-badge cs-badge-success">Read-Only</span>
|
|
</div>
|
|
<div style="font-size:11px; color:#94a3b8;">Format: XLSX Tabular</div>
|
|
</div>
|
|
<div class="doc-canvas">
|
|
<div class="doc-page">
|
|
<h1>${file.content.title}</h1>
|
|
<p style="font-size:12px; color:#64748b; margin-bottom:14px;">Confidential — Internal Use Only — Prepared for NexaCore Leadership</p>
|
|
<table class="doc-table">
|
|
<thead>
|
|
<tr>
|
|
${file.content.headers.map(h => `<th>${h}</th>`).join('')}
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
${file.content.rows.map(row => `
|
|
<tr>
|
|
${row.map((cell, idx) => `<td style="${idx > 0 ? 'text-align:right;' : 'font-weight:500;'}">${cell}</td>`).join('')}
|
|
</tr>
|
|
`).join('')}
|
|
</tbody>
|
|
</table>
|
|
<div style="margin-top:20px; font-size:11px; color:#64748b;">
|
|
<strong>Notes:</strong> Operating margin buffer is currently aligned with Q2 audit targets. Prepared by Finance Ops.
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
`;
|
|
}
|
|
|
|
if (file.type === 'pdf' && file.content) {
|
|
return `
|
|
<div class="doc-viewer-container">
|
|
<div class="doc-toolbar">
|
|
<div class="doc-title-info">
|
|
<span>📑 ${file.name}</span>
|
|
<span class="cs-badge cs-badge-info">NexaCore Document</span>
|
|
</div>
|
|
<div style="font-size:11px; color:#94a3b8;">Format: PDF Document</div>
|
|
</div>
|
|
<div class="doc-canvas">
|
|
<div class="doc-page">
|
|
<h1>${file.content.title}</h1>
|
|
${file.content.sections ? file.content.sections.map(s => `
|
|
<h2>${s.heading}</h2>
|
|
<p>${s.text}</p>
|
|
`).join('') : ''}
|
|
|
|
${file.content.table ? `
|
|
<table class="doc-table" style="margin-top:16px;">
|
|
<thead>
|
|
<tr>
|
|
${file.content.table.headers.map(h => `<th>${h}</th>`).join('')}
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
${file.content.table.rows.map(r => `
|
|
<tr>
|
|
${r.map(c => `<td>${c}</td>`).join('')}
|
|
</tr>
|
|
`).join('')}
|
|
</tbody>
|
|
</table>
|
|
` : ''}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
`;
|
|
}
|
|
|
|
return `
|
|
<div class="doc-viewer-container">
|
|
<div class="doc-toolbar">
|
|
<div class="doc-title-info">${file.name}</div>
|
|
</div>
|
|
<div class="doc-canvas">
|
|
<div class="doc-page">
|
|
<h2>Archive Preview</h2>
|
|
<p>Archive file "${file.name}" contents cannot be executed directly within simulated document viewer.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
`;
|
|
}
|
|
}
|