- Added scanning and metadata tracking for non-markdown files (images, PDFs, videos, code files) - Redesigned drawings editor header with new toolbar layout and dropdown menus - Added file picker dropdown to easily open existing .excalidraw files - Implemented new file creation flow with auto-generated filenames - Added export options menu with PNG/SVG/JSON export variants - Updated proxy config to support vault file access - Adde
77 lines
2.2 KiB
TypeScript
77 lines
2.2 KiB
TypeScript
import { Component, Input, computed, inject } from '@angular/core';
|
|
import { CommonModule } from '@angular/common';
|
|
import { DomSanitizer, SafeResourceUrl } from '@angular/platform-browser';
|
|
|
|
@Component({
|
|
selector: 'app-pdf-viewer',
|
|
standalone: true,
|
|
imports: [CommonModule],
|
|
template: `
|
|
<div class="pdf-container">
|
|
<div class="pdf-header">
|
|
<span class="pdf-icon">📄</span>
|
|
<span class="pdf-title">PDF</span>
|
|
<span class="pdf-filename">{{ fileName() }}</span>
|
|
</div>
|
|
<iframe class="viewer" [src]="safeSrc()" title="PDF Viewer"></iframe>
|
|
</div>
|
|
`,
|
|
styles: [`
|
|
:host { display:flex; flex:1 1 auto; width:100%; min-width:0; min-height:0; padding: 0; }
|
|
.pdf-container {
|
|
flex:1 1 auto;
|
|
display:flex;
|
|
flex-direction:column;
|
|
min-height:0;
|
|
border-radius: 0.5rem;
|
|
border: 1px solid var(--border);
|
|
background: var(--card);
|
|
overflow: hidden;
|
|
}
|
|
.pdf-header {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 0.5rem;
|
|
padding: 0.75rem 1rem;
|
|
border-bottom: 1px solid var(--border);
|
|
background: color-mix(in srgb, var(--card) 95%, var(--text-main) 5%);
|
|
font-size: 0.875rem;
|
|
}
|
|
.pdf-icon { font-size: 1.25rem; }
|
|
.pdf-title {
|
|
font-weight: 600;
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.05em;
|
|
color: var(--text-muted);
|
|
}
|
|
.pdf-filename {
|
|
margin-left: auto;
|
|
font-weight: 500;
|
|
color: var(--text-main);
|
|
max-width: 50%;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
.viewer { flex:1 1 auto; display:block; width:100%; height:100%; border:0; min-height:0; }
|
|
`]
|
|
})
|
|
export class PdfViewerComponent {
|
|
@Input() src: string = '';
|
|
@Input() path: string = '';
|
|
private sanitizer = inject(DomSanitizer);
|
|
|
|
safeSrc = computed<SafeResourceUrl>(() => this.sanitizer.bypassSecurityTrustResourceUrl(this.src || ''));
|
|
|
|
fileName = computed(() => {
|
|
const p = this.path || this.src || '';
|
|
try {
|
|
const u = decodeURI(p);
|
|
return u.split('/').pop() || u.split('\\').pop() || 'document.pdf';
|
|
} catch {
|
|
return p.split('/').pop() || p.split('\\').pop() || 'document.pdf';
|
|
}
|
|
});
|
|
|
|
}
|