import { h } from '../ema.core.js';

import './chunk-de721f0a.js';
import { f as ConfigService, l as Wordpress } from './chunk-f41c48db.js';

class AppWordpress {
    constructor() {
        this.loading = true;
        this.authenticated = false;
        this.config = ConfigService.instance;
        this.wordpress = new Wordpress();
        this.loginModal = document.getElementById('login-modal');
        document.getElementById('app-login-form').addEventListener('formSubmit', (e) => {
            this.login(e.detail.username, e.detail.password);
        });
    }
    componentWillLoad() {
        let router = document.getElementsByTagName('ema-router')[0];
        router.getState().then((routerState) => {
            this.currentPostId = routerState.context.params.pid;
        });
        this.wordpress.init(this.config.get('wordpress')['wordpress-dev-local']).then((arg) => {
            this.getData().then(() => {
                this.authenticated = this.wordpress.authenticated;
                let frontpage = this.wordpress.settings.frontpage;
                this.currentPost = this.wordpress.model.collections[frontpage.type][frontpage.id];
                this.model = this.wordpress.model;
                this.loading = false;
            });
        });
    }
    componentDidLoad() {
    }
    async getData() {
        await this.wordpress.getPosts().then((res) => {
            this.posts = res;
            this.wordpress.saveLocal();
        });
        return;
    }
    login(username, password) {
        console.log(username, password);
    }
    logout() {
    }
    async onMenuClick(item) {
        this.currentPost = await this.wordpress.getPost(item.object_id, item.object);
    }
    showLoginModal() {
        this.loginModal['show']();
    }
    render() {
        if (this.model && this.currentPostId) {
            return (h("div", { class: 'ema-app-wordpress' },
                !this.authenticated &&
                    h("button", { class: "btn btn-primary float-right", id: "login-button", onClick: () => this.showLoginModal() }, "login"),
                this.authenticated &&
                    h("button", { class: "btn btn-primary float-right", id: "logout-button", onClick: () => this.logout() }, "logout"),
                h("ema-post", { "data-json": JSON.stringify(this.currentPost) }),
                h("footer", null,
                    h("nav", { class: "navbar navbar-expand-md fixed-bottom" },
                        h("div", { class: "collapse navbar-collapse", id: "navbarCollapse" },
                            h("ul", { class: "navbar-nav" }, this.model.menus[this.wordpress.settings.mainMenu].items.map(item => h("li", null,
                                h("a", { onClick: (e) => this.onMenuClick(item), class: "nav-link" }, item.title)))))))));
        }
    }
    static get is() { return "ema-app-wordpress"; }
    static get properties() { return {
        "authenticated": {
            "state": true
        },
        "currentPost": {
            "state": true
        },
        "currentPostId": {
            "state": true
        },
        "loading": {
            "state": true
        },
        "model": {
            "state": true
        }
    }; }
    static get style() { return ":root{--ema-color:#343a40;--ema-primary:#007bff;--ema-secondary:#6c757d;--ema-success:#28a745;--ema-info:#17a2b8;--ema-warning:#ffc107;--ema-danger:#dc3545;--ema-light:#f8f9fa;--ema-dark:#343a40;--ema-background:#fff;--ema-background-diap:rgba(29,29,29,0.97);--ema-border-color:#c5c9cd;--ema-border:1px solid #c5c9cd;--ema-border-radius:3px 3px 3px 3px;--ema-box-shadow:1px 1px 10px 1px #ccc;--ema-margin:0.25rem;--ema-margin-sm:0.5rem;--ema-margin-md:1rem;--ema-margin-lg:1.5rem;--ema-margin-xl:2rem;--ema-padding:0.25rem;--ema-padding-sm:0.5rem;--ema-padding-md:1rem;--ema-padding-lg:1.5rem;--ema-padding-xl:2rem;--ema-gray-100:#f8f9fa;--ema-gray-200:#e9ecef;--ema-gray-300:#dee2e6;--ema-gray-400:#ced4da;--ema-gray-500:#adb5bd;--ema-gray-600:#868e96;--ema-gray-700:#495057;--ema-gray-800:#343a40;--ema-gray-900:#212529}ema-app-wordpress #login-button,ema-app-wordpress #logout-button{position:fixed;top:.5rem;right:.5rem;z-index:11000}\@media screen and (max-width:767px){ema-app-wordpress #login-button,ema-app-wordpress #logout-button{right:4rem}}ema-app-wordpress ema-post .post{text-align:center;padding:1rem 0}ema-app-wordpress ema-post .post.post-type-iframe{padding:0}ema-app-wordpress ema-post .post.post-type-iframe .field--name-title{display:none}ema-app-wordpress ema-post .post .field{margin-bottom:.5rem}"; }
}

class Post {
    componentDidLoad() {
        this.postRender();
    }
    componentDidUpdate() {
        this.postRender();
    }
    postRender() {
        let titleField = this.el.querySelector('.field--name-title');
        let bodyField = this.el.querySelector('.field--name-content');
        if (this.data.title)
            titleField.innerHTML = this.data.title.rendered;
        if (this.data.content) {
            bodyField.innerHTML = this.data.content.rendered;
        }
        else {
            bodyField.innerHTML = '';
        }
    }
    parsePost(post) {
        return post;
    }
    render() {
        if (this.dataJson) {
            var post = this.parsePost(JSON.parse(this.dataJson));
            this.data = post;
        }
        return (h("article", { class: 'post post-type-' + post.type + ' clearfix', id: 'post-' + post.id },
            h("header", null,
                h("h2", { class: "field field--name-title" })),
            h("div", { class: "content clearfix" },
                h("div", { class: "field field--name-content" }),
                post.type == 'iframe' && post.url &&
                    h("div", { class: "field field--name-url" },
                        h("ema-iframe", { src: post.url, width: post.width, height: post.height })))));
    }
    static get is() { return "ema-post"; }
    static get properties() { return {
        "data": {
            "state": true
        },
        "dataJson": {
            "type": String,
            "attr": "data-json"
        },
        "el": {
            "elementRef": true
        }
    }; }
    static get style() { return ":root{--ema-color:#343a40;--ema-primary:#007bff;--ema-secondary:#6c757d;--ema-success:#28a745;--ema-info:#17a2b8;--ema-warning:#ffc107;--ema-danger:#dc3545;--ema-light:#f8f9fa;--ema-dark:#343a40;--ema-background:#fff;--ema-background-diap:rgba(29,29,29,0.97);--ema-border-color:#c5c9cd;--ema-border:1px solid #c5c9cd;--ema-border-radius:3px 3px 3px 3px;--ema-box-shadow:1px 1px 10px 1px #ccc;--ema-margin:0.25rem;--ema-margin-sm:0.5rem;--ema-margin-md:1rem;--ema-margin-lg:1.5rem;--ema-margin-xl:2rem;--ema-padding:0.25rem;--ema-padding-sm:0.5rem;--ema-padding-md:1rem;--ema-padding-lg:1.5rem;--ema-padding-xl:2rem;--ema-gray-100:#f8f9fa;--ema-gray-200:#e9ecef;--ema-gray-300:#dee2e6;--ema-gray-400:#ced4da;--ema-gray-500:#adb5bd;--ema-gray-600:#868e96;--ema-gray-700:#495057;--ema-gray-800:#343a40;--ema-gray-900:#212529}ema-post .node .field{margin-bottom:var(--ema-padding-md,1rem)}"; }
}

export { AppWordpress as EmaAppWordpress, Post as EmaPost };
