SlickUI.namespace('Element');

/**
 * Create a Slider to control defined values
 *
 * @author Richard Snijders <richard@fizz.nl>
 * @param x
 * @param y
 * @param size
 * @param value
 * @param orientation
 * @constructor
 */
SlickUI.Element.Slider = function (x, y, size, value, orientation) {
    this._x = x;
    this._y = y;
    this._size = size;
    this._value = value;
    this._orientation = orientation || "horizontal";
    this.container = null;
    if(typeof value == 'undefined') {
        this._value = 1;
    }
};

/**
 * Internal Container handling.
 *
 * @param container
 */
SlickUI.Element.Slider.prototype.setContainer = function (container) {
    this.container = container;
};

/**
 * Adds the Slider and makes it interactable
 */
SlickUI.Element.Slider.prototype.init = function() {
    var theme = game.cache.getJSON('slick-ui-theme');
    this.onDragStart = new Phaser.Signal();
    this.onDrag = new Phaser.Signal();
    this.onDragStop = new Phaser.Signal();

    var x = this.container.x + this._x;
    var y = this.container.y + this._y;
    var width = Math.min(this.container.width - this._y, this._size);
    var height = Math.min(this.container.height - this._y, this._size);
    var initialPosition = {
        x: Math.min(1, Math.max(0, this._value)) * width + x,
        y: Math.min(1, Math.max(0, this._value)) * height + y
    };
    var renderedSprites = this.renderSprites(width, height);

    var sprite_base = renderedSprites[0];
    var handle_off = renderedSprites[1];
    var handle_on = renderedSprites[2];
    sprite_base.x = x;
    sprite_base.y = y;

    sprite_handle = this.makeSprite(x, y, initialPosition, handle_off.texture);
    sprite_handle.anchor.setTo(0.5);

    sprite_handle.inputEnabled = true;
    sprite_handle.input.useHandCursor = true;
    var dragging = false;

    sprite_handle.events.onInputDown.add(function () {
        sprite_handle.loadTexture(handle_on.texture);
        dragging = true;
        this.onDragStart.dispatch(this.getCoord(sprite_handle, x, y, width, height));
    }, this);
    sprite_handle.events.onInputUp.add(function () {
        sprite_handle.loadTexture(handle_off.texture);
        dragging = false;
        this.onDragStop.dispatch(this.getCoord(sprite_handle, x ,y, width, height));
    }, this);

    game.input.addMoveCallback(function (pointer, pointer_x,pointer_y) {
        if(!dragging) {
            return;
        }
        this.modifySpriteHandle(sprite_handle, x, y, width, height,
            pointer_x - this.container.displayGroup.x,
            pointer_y - this.container.displayGroup.y);
        this.onDrag.dispatch(this.getCoord(sprite_handle, x ,y, width, height));
    }, this);

    this.container.displayGroup.add(sprite_base);
    this.container.displayGroup.add(sprite_handle);
};

/**
 * render the sprites
 * @param width
 * @param height
 * @returns {*}
 */
SlickUI.Element.Slider.prototype.renderSprites = function (width, height) {
    var rendererString, renderedSprites;
    if(this._orientation === "horizontal"){
        rendererString = 'slider';
        renderedSprites = this.container.root.getRenderer(rendererString).render(width);
    }
    else{
        rendererString = 'Slider';
        renderedSprites = this.container.root.getRenderer(rendererString).render(height);
    }
    return renderedSprites;
};

/**
 * @param sprite_handle
 * @param x
 * @param y
 * @param width
 * @param height
 * @returns {number}
 */
SlickUI.Element.Slider.prototype.getCoord = function (sprite_handle, x, y, width, height) {
    if(this._orientation === "horizontal"){
        return (sprite_handle.x - x) / width;
    }
    else{//vertical orientation
        return (sprite_handle.y - y) / height;
    }
};

/**
 * @param x
 * @param y
 * @param initialPosition
 * @param texture
 * @returns {*}
 */
SlickUI.Element.Slider.prototype.makeSprite = function (x, y, initialPosition, texture) {
    var sprite_handle;
    if(this._orientation === "horizontal"){
        sprite_handle = game.make.sprite(initialPosition.x, y, texture);
    }
    else{//vertical orientation
        sprite_handle = game.make.sprite(x, initialPosition.x, texture);
    }
        return sprite_handle;
};

/**
 *
 * @param sprite_handle
 * @param x
 * @param y
 * @param width
 * @param height
 * @param pointer_x
 * @param pointer_y
 */
SlickUI.Element.Slider.prototype.modifySpriteHandle = function (sprite_handle, x, y, width, height, pointer_x, pointer_y) {
    if(this._orientation === "horizontal"){
        sprite_handle.x = Math.min(x + width, Math.max(x, pointer_x));
    }
    else{//vertical orientation
        sprite_handle.y = Math.min(y + height, Math.max(y, pointer_y));
    }
};