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

class Controller extends Component {
    constructor($element, $scope, $http, $translate, vnApp) {
        super($element, $scope);

        this.$scope = $scope;
        this.$http = $http;
        this.$translate = $translate;
        this.vnApp = vnApp;
    }

    open() {
        this.$scope.SMSDialog.show();
    }

    charactersRemaining() {
        const element = this.$scope.message;
        const value = element.input.value;

        const maxLength = 160;
        const textAreaLength = new Blob([value]).size;
        return maxLength - textAreaLength;
    }

    onResponse(response) {
        if (response === 'accept') {
            try {
                if (!this.sms.destination)
                    throw new Error(`The destination can't be empty`);
                if (!this.sms.message)
                    throw new Error(`The message can't be empty`);
                if (this.charactersRemaining() < 0)
                    throw new Error(`The message it's too long`);

                this.$http.post(`Clients/${this.$params.id}/sendSms`, this.sms).then(res => {
                    this.vnApp.showMessage(this.$translate.instant('SMS sent!'));

                    if (res.data) this.emit('send', {response: res.data});
                });
            } catch (e) {
                this.vnApp.showError(this.$translate.instant(e.message));
                return false;
            }
        }
        return true;
    }
}

Controller.$inject = ['$element', '$scope', '$http', '$translate', 'vnApp'];

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