import Find from './Find/Find.js';

const ROOT_OBJECT = 'root';

class MyApp extends Find.createApp() {
    constructor(name) {
        const root = Find.search(name);
        super(root);
    }

    init() {
        this.select('com.example');
        this.setMeta();
        this.setTitle();
        this.setForms();
        this.render();
        this.attachEvents();
    }

    setMeta() {
        this.meta([
            Find.css('bulma.min.css'),
            Find.content('<meta name="viewport" content="width=device-width, initial-scale=1">'),
            Find.content(
                `<style>
                    body {
                        margin: 20px;
                    }
                </style>`
            )
        ]);
    }

    setTitle() {
        this.title('Минификатор FInd.js на Find.js');
    }

    setForms() {
        this.add([
            Find.content(
                `<div class="card">
                    <div class="card-header">
                        <p id="title" class="card-header-title">Минификация Find.js</p>
                    </div>
                    <div class="card-content">
                        <div class="content">
                            <button 
                                class="button"  
                                id="minify"
                                style="width: 100%"
                            >Минифицировать</button>
                        </div>
                    </div>
                </div>`
            )
        ]);
    }

    mwait(t) {
        const root = app.component();
        const title = root.id('title');
        if (t === true) {
            title.text('Минификация Find.js в процессе...');
        } else {
            if (typeof t === "string") {
                title.text(t);
            } else {
                title.text('Минификация Find.js');
            }
        }
    }

    attachEvents() {
        const root = this.component();
        const button = root.id('minify');
        button.attach('click', (app) => {
            this.mwait(true);
            this.minifyFind();
        });
    }

    async minifyFind() {
        let response = await fetch('Find/Find.js');
        if (response.ok) {
            let code = await response.text();
            let minif = await Terser.minify(code, { sourceMap: false });
            this.uploadJS("find.min.js", minif.code);
            this.mwait(false);
        } else {
            this.mwait("Ошибка HTTP: " + response.status);
        }
    }

    uploadJS(filename, content) {
        const blob = new Blob([content], { type: 'application/javascript' });
        const link = document.createElement('a');
        link.href = URL.createObjectURL(blob);
        link.download = filename;
        link.click();
        URL.revokeObjectURL(link.href);
    }
}

const app = new MyApp(ROOT_OBJECT);
app.init();