jQuery(document).ready(function($) {
    const zipArchiveApp = {
        init() {
            this.bindEvents();
            this.renderUI();
        },

        bindEvents() {
            $('#compress-files').on('click', this.handleCompress.bind(this));
            $('#extract-archive').on('click', this.handleExtract.bind(this));
        },

        renderUI() {
            $('#zip-archive-app').html(`
                <div class="zip-actions">
                    <div class="form-group">
                        <label>Files to compress (comma separated paths):</label>
                        <textarea id="files-to-compress" rows="3"></textarea>
                    </div>
                    <div class="form-group">
                        <label>Destination ZIP file path:</label>
                        <input type="text" id="compress-destination" placeholder="path/to/archive.zip">
                    </div>
                    <button id="compress-files" class="button button-primary">Compress Files</button>

                    <div class="form-group" style="margin-top: 20px;">
                        <label>Archive to extract:</label>
                        <input type="text" id="archive-to-extract" placeholder="path/to/archive.zip">
                    </div>
                    <div class="form-group">
                        <label>Destination folder:</label>
                        <input type="text" id="extract-destination" placeholder="path/to/destination">
                    </div>
                    <button id="extract-archive" class="button button-primary">Extract Archive</button>
                </div>
                <div id="zip-message" style="display:none;"></div>
            `);
        },

        handleCompress() {
            const files = $('#files-to-compress').val().split(',').map(f => f.trim());
            const destination = $('#compress-destination').val().trim();

            if (files.length === 0 || !destination) {
                this.showMessage('Please provide files and destination', 'error');
                return;
            }

            $.ajax({
                url: ajaxurl,
                type: 'POST',
                data: {
                    action: 'code_editor_compress',
                    files: files,
                    destination: destination,
                    security: codeEditorVars.nonce
                },
                success: (response) => {
                    if (response.success) {
                        this.showMessage(response.data.message);
                    } else {
                        this.showMessage(response.data.message || 'Compression failed', 'error');
                    }
                }
            });
        },

        handleExtract() {
            const archive = $('#archive-to-extract').val().trim();
            const destination = $('#extract-destination').val().trim();

            if (!archive || !destination) {
                this.showMessage('Please provide archive and destination', 'error');
                return;
            }

            $.ajax({
                url: ajaxurl,
                type: 'POST',
                data: {
                    action: 'code_editor_extract',
                    archive: archive,
                    destination: destination,
                    security: codeEditorVars.nonce
                },
                success: (response) => {
                    if (response.success) {
                        this.showMessage(response.data.message);
                    } else {
                        this.showMessage(response.data.message || 'Extraction failed', 'error');
                    }
                }
            });
        },

        showMessage(message, type = 'success') {
            const $message = $('#zip-message');
            $message.text(message).removeClass('error success').addClass(type).fadeIn();
            setTimeout(() => $message.fadeOut(), 3000);
        }
    };

    zipArchiveApp.init();
});