import BuilderClient from "../api/BuilderClient";
import EventBus from "./EventBus";
import EventTypes from "./EventTypes";
import {triggerFlashNotification} from "../../flashbag_notification";

export default {
    setup(component) {
        this.handlePost(component, {
            title: component.title,
            html: component.html,
            errors: [],
        });
    },
    handlePost(component, data) {
        component.errors = [];// always reset errors
        for(var key in data) {
            if (typeof data[key] != 'undefined' && component.hasOwnProperty(key)) {
                component[key] = data[key];
            }
        }

        if (data.brick) {
            var returnedBrick = data.brick;
            // use reactivity to update brick in tree
            Object.keys(returnedBrick).forEach((k) => {
                component.extra.brick[k] = returnedBrick[k];
            });

            EventBus.emitEvent(EventTypes.BRICK_UPDATED, this);
        }

        // prepare next post
        component.$nextTick(() => {
            var innerNode = component.$el.querySelector(':scope .inner');

            if (window.AAForm) {
                window.AAForm.initialize(innerNode);
            }

            // init ajax form posting
            var form = innerNode.querySelector(':scope form');
            if (form) {
                form.addEventListener('submit', (e) => {
                    e.preventDefault();
                    // var form = e.target;
                    // var formActionUrl = form.attributes['action'].value;
                    // var method = form.attributes['method'].value.toUpperCase();

                    component.startLoading();
                    var data = new FormData(form);
                    data.append(e.submitter.attributes['name'].value, '');
                    BuilderClient
                        // .post(formActionUrl, new FormData(form))
                        .updateBrick(component.extra.brick.id, data)
                        .then((response) => {
                            component.finishLoading();
                            if(response.post_action && response.post_action === 'close-after-save') {
                                EventBus.emitEvent(EventTypes.BRICK_UPDATED, response.brick);
                                component.hide();
                                component.reset();
                            }else {
                                if (response.html) {
                                    this.handlePost(component, response);
                                }
                            }

                            if (response.status === true) {
                                this.handleNotification('success', response.message);
                            } else {
                                this.handleNotification('error', response.message);
                            }
                        })
                    ;
                });
            }
        })
    },
    handleNotification(type, message) {
        triggerFlashNotification(type, message);
    }
}