import { AppService } from "../../global/app-service";
import { DomUtil, Util } from "@ema/core";
export class Home {
    constructor() {
        this.app = AppService.instance;
    }
    iframeLoaded(e) {
        console.log(e.detail);
    }
    componentWillLoad() {
        this.data = {
            title: 'js-base'
        };
        Util.fetchJson('assets/documentation.json').then((res) => {
            this.docData = res;
        });
    }
    componentDidLoad() {
        this.postRender();
    }
    componentDidUpdate() {
        this.postRender();
    }
    postRender() {
        if (this.docData) {
            DomUtil.fadeIn(this.el.querySelector('.jumbotron'), 350, 1400);
        }
    }
    render() {
        return (h("div", { class: 'text-center' },
            h("ema-svg", { src: '../assets/sketch-index/home-content/images/home-content.svg', "data-json": JSON.stringify(this.data), class: 'img-responsive' }),
            this.docData &&
                h("div", { class: 'jumbotron pt-3 pb-3 hidden' },
                    h("h5", null, 'webcomponents'),
                    h("ul", { class: 'list-inline' }, this.app.components.map((item) => {
                        return h("li", { class: "list-inline-item" },
                            h("ema-route-link", { url: '/components/' + item.tag }, '<' + item.tag + '>'));
                    })),
                    h("h5", null, 'modules'),
                    h("ul", { class: 'list-inline' }, this.docData.children.map((item) => {
                        if (item.flags.isExported) {
                            { }
                            return h("li", { class: "list-inline-item" },
                                h("ema-route-link", { url: '/documentation/classes/' + item.name.toLowerCase() }, item.name));
                        }
                    })))));
    }
    static get is() { return "ema-app-home"; }
    static get properties() { return {
        "data": {
            "state": true
        },
        "docData": {
            "state": true
        },
        "el": {
            "elementRef": true
        }
    }; }
    static get listeners() { return [{
            "name": "iframeLoaded",
            "method": "iframeLoaded"
        }]; }
    static get style() { return "/**style-placeholder:ema-app-home:**/"; }
}
