export class QuillEditor {
    constructor(editorId = 'quillEditor', previewId = 'contentPreview') {
        this.quill = null;
        this.editorId = editorId;
        this.previewId = previewId;
        this.initialize();
    }

    initialize() {
        console.log('Initializing Quill editor...'); // Debug log
        
        const editorContainer = document.getElementById(this.editorId);
        if (!editorContainer) {
            console.error(`Editor container #${this.editorId} not found`);
            return;
        }

        this.quill = new Quill(`#${this.editorId}`, {
            theme: 'snow',
            modules: {
                toolbar: [
                    [{ 'header': [1, 2, false] }],
                    ['bold', 'italic', 'underline'],
                    ['blockquote', 'code-block'],
                    [{ 'list': 'ordered'}, { 'list': 'bullet' }],
                    [{ 'script': 'sub'}, { 'script': 'super' }],
                    ['link', 'image', 'formula'],
                    ['clean']
                ]
            },
            placeholder: 'Fügen Sie hier Ihren Inhalt ein...'
        });

        this.quill.on('text-change', () => this.updatePreview());
        console.log('Quill editor initialized');
    }

    updatePreview() {
        const content = this.quill.root.innerHTML;
        const preview = document.getElementById(this.previewId);
        
        if (preview) {
            preview.innerHTML = content;
            
            // Re-render math if present
            if (window.MathJax) {
                MathJax.typeset([preview]);
            }
            
            // Highlight code blocks if any
            if (window.Prism) {
                Prism.highlightAllUnder(preview);
            }
        }
    }

    getContent() {
        return this.quill.root.innerHTML;
    }

    setContent(content) {
        if (this.quill) {
            this.quill.root.innerHTML = content;
            this.updatePreview();
        }
    }

    undo() {
        this.quill?.history.undo();
    }

    redo() {
        this.quill?.history.redo();
    }

    clear() {
        this.quill?.setContents([]);
        this.updatePreview();
    }
}