import {module} from '../module';
import Component from '../lib/component';
import './style.css';

/**
 * A spinner to inform the user about loading process.
 */
export default class Spinner extends Component {
    constructor($element, $scope) {
        super($element);
        this._enable = false;
        this.spinner = $element[0].firstChild;
        componentHandler.upgradeElement(this.spinner);
    }
    /**
     * Enables/disables the spinner.
     * 
     * @param {Boolean} %true to enable, %false to disable
     */
    set enable(value) {
        if (value)
            this.start();
        else
            this.stop();
    }
    /**
     * Returns the current spinner state.
     * 
     * @return {Boolean} %true if it's enabled, %false otherwise
     */
    get enable() {
        return this._enable;
    }
    /**
     * Activates the spinner.
     */
    start() {
        this.spinner.MaterialSpinner.start();
        this._enable = true;
    }
    /**
     * Deactivates the spinner.
     */
    stop() {
        this.spinner.MaterialSpinner.stop();
        this._enable = false;
    }
}
Spinner.$inject = ['$element', '$scope'];

export const component = {
    template: require('./index.html'),
    bindings: {
        enable: '='
    },
    controller: Spinner
};
module.component('vnSpinner', component);