/**
 * create a new snowball
 *
 * @param x - int
 * @param y - int
 */
xmas.Entity.Image.Snowball = function(x, y) {

    this.src          = 'snowball';

    // setting an offset to the image to have the ball spawn in the middle of the mouse click
    this.offsetX      = 0;
    this.offsetY      = 0;

    // use radius to check for collision later
    this.r            = 0;

    // actual draw points - should include some kind of offset calculation
    this.drawX        = 0;
    this.drawY        = 0;

    this.scaleX       = 1;
    this.scaleY       = 1;

    this.z            = 0;
    this.vx           = 0;
    this.vy           = 3;
    this.vz           = 5;

    this.gravity      = - 0.097;

    this._constructor(this.src, x, y, 1);

    this.update = function() {

      this.x  += this.vx;
      this.y  += this.vy;
      this.z  += this.vz;

      this.vy -= this.gravity;

      // need to check if on the ground later
      // todo

      // did I hit something somewhere "back" in the environment..?
      // todo
      // this.r   = ?

//      this.vx *= 0.99;
//      this.vy *= 0.99;
//      this.vz *= 0.99;

    };


    this.onImgLoaded = function() {
      this.img.inViewport   = true;
      this.img.widthScaled  = this.img.width;
      this.img.heightScaled = this.img.height;

      // set radius for later collision detection because the image is a ball :)
      this.r                =   this.img.widthScaled/2;

      // update coords for the offset to have the ball spawn at the center of the mouse position
      this.offsetX          = - this.img.widthScaled/2;
      this.offsetY          = - this.img.heightScaled/2;
      this.x               +=   this.offsetX;
      this.y               +=   this.offsetY;
    };

    this.debug = function() {
      console.log("coord", this.x, this.y, this.z);
      console.log("pos  ", this.drawX, this.drawY);
      console.log("scale", this.scaleX, this.scaleY);
      console.log("imgO ", this.img.width, this.img.height)
      console.log("img  ", this.img.widthScaled, this.img.heightScaled);
      console.log("---------------------------------");
    };

    /**
     * renders the image
     */
    this.render = function() {
      if(this.isVisible() && this.img.isLoaded && this.img.inViewport) {


        this.drawX  = this.x / this.z;
        this.drawY  = this.y / this.z;
        // using this instead will simply drop the ball
        //this.drawX  = this.x;
        //this.drawY  = this.y;

        // scaleX and scaleY becoming *very* low - about 10^(-100) - so no scaling is happening
        this.scaleX = this.scaleX / this.z;
        this.scaleY = this.scaleY / this.z;

        this.img.widthScaled  = this.img.width - this.img.width * this.scaleX;
        this.img.heightScaled = this.img.width - this.img.width * this.scaleY;

        //this.debug();

//        xmas.Draw.image(this.img, this.drawX, this.drawY, this.img.widthScaled, this.img.heightScaled);

        xmas.ctxPreRender.drawImage(this.img, this.drawX, this.drawY, this.img.widthScaled, this.img.heightScaled);

      }
    };


}


/**
 * create a new image
 *
 * @param src - string
 * @param x - int
 * @param y - int
 * @param opacity - float
 */
xmas.Entity.Image = function(src, x, y, opacity) {

    this.type         = 'image';
    this.group        = null;
    this.isLoaded     = false;
    this.img          = null;

    var self          = this;

    this._constructor  = function(src, x, y, opacity) {

      this.x            = x;              // the x coordinate
      this.y            = y;              // the y coordinate
      this.opacity      = opacity || 1;   // initial opacity; the dot will fade out
      // create image
      this.img          = new Image();
      this.img.opacity  = this.opacity;

      this.loadImage(src);

    };

    this.setOpacity  = function(opacity) {
      this.opacity     = opacity;
      this.img.opacity = opacity;
    };

    /**
     * loads an image
     *
     * @param src - string
     */
    this.loadImage = function(src) {

      var self            = this;
      this.img.isLoaded   = false;
      this.img.inViewport = false;

      this.img.onload   = function() {
        this.isLoaded   = true;
        this.calculateCenter();
        self.isLoaded   = true;
        self.onImgLoaded();
      }

      var source        = xmas.Resources.get(this.type, src);

      if(source) {
        this.img.src      = source;
      }
    };

    this.init   = function() {
      // nothing to do here
    };

    this.update = function() {
      // nothing to do here
    };

    this.onImgLoaded = function() {
      // do when image is loaded, nothing to do here
    }

    /**
     * when changing condition
     */
    this.onChangeCondition = function() {
      this.setImageSpriteByCondition(this.getCondition());
    };

    /**
     * set the image sprite by status, assuming all sprites have equal withs
     * and are set in one row
     *
     * sx = 0      sx = w      sx = w*2    sx = w*3
     * |-----------|-----------|-----------|-----------|
     * |  Default  |   Hover   |  Active   | InActive  |
     * |-----------|-----------|-----------|-----------|
     *
     * @param condition - int
     */
    this.setImageSpriteByCondition = function(condition) {
      if(this.img && this.img.isLoaded) {

        this.sy = 0;
        this.sw = this.w;
        this.sh = this.h;

        switch(condition) {
          case xmas.Entity.CONDITION._default:
            this.sx = 0;
          break;
          case xmas.Entity.CONDITION._hover:
            this.sx = this.w;
          break;
          case xmas.Entity.CONDITION._active:
            this.sx = this.w * 2;
          break;
          case xmas.Entity.CONDITION._inactive:
            this.sx = this.w * 3;
          break;
        }

      }
    };

    /**
     * renders the image
     * @param dw - int new width (optional)
     * @param dh - int new height (optional)
     */
    this.render = function(dw, dh) {
      if(this.isVisible() && this.img.isLoaded && this.img.inViewport) {
        xmas.Draw.image(this.img, this.x, this.y, dw, dh);
      }
    };

    this._constructor(src, x, y, opacity);

}


// inheritance
xmas.Entity.Image.prototype   = new xmas.Entity();
xmas.Entity.Image.constructor = xmas.Entity.Image;
xmas.Entity.Image.Snowball.prototype   = new xmas.Entity.Image();
xmas.Entity.Image.Snowball.constructor = xmas.Entity.Image.Snowball;