import ngModule from '../module';
import Component from 'core/lib/component';
import './style.scss';

class Controller extends Component {
    constructor($element, $) {
        super($element, $);
        this.item = null;
        this._quicklinks = {};
    }

    set itemFk(id) {
        if (id == this._itemFk) return;

        this._itemFk = id;
        this.item = null;
        this._quicklinks = {
            btnThree: {
                icon: 'icon-transaction',
                state: `item.card.diary({
                    id: ${id}, 
                })`,
                tooltip: 'Item diary'
            }
        };
        this.getCard();
    }

    set item(value) {
        this._item = value;
        this.$timeout(() => this.$.popover.relocate());
    }

    get item() {
        return this._item;
    }

    get quicklinks() {
        return this._quicklinks;
    }

    set quicklinks(value = {}) {
        Object.keys(value).forEach(key => {
            this._quicklinks[key] = value[key];
        });
    }

    show() {
        this.$.popover.parent = this.parent;
        this.$.popover.show();
    }

    getCard() {
        if (this.canceler)
            this.canceler.resolve();

        this.canceler = this.$q.defer();

        let options = {timeout: this.canceler.promise};
        this.$http.get(`Items/${this._itemFk}/getCard`, options).then(
            response => {
                this.item = response.data;
                this.canceler = null;
            }
        );
    }
}
Controller.$inject = ['$element', '$scope'];

ngModule.component('vnItemDescriptorPopover', {
    template: require('./index.html'),
    controller: Controller,
    bindings: {
        itemFk: '<',
        quicklinks: '<'
    }
});