Crafty.c("Card", {
  required: "2D, Canvas, Mouse, Tween",

  init: function () {
    this.attr({
      w: 1* CONF.card.w,
      h: 1* CONF.card.h,
      tapped: false,
      rotation: 0,
    });
    this.origin("center");
  },

  remove: function () {
    Crafty.log("Card was removed!");
  },

  place: function (px, py) {
    this.tween({ x: px, y: py }, CONF.anim.time, CONF.anim.func);
    return this;
  },

  events: {
    Tap: function (newState) {
      this.tapped = !!newState;
      let _rotation = this.baseRot + 90 * this.tapped;
      this.tween({ rotation: _rotation }, CONF.anim.time, CONF.anim.func);
    },

    ToggleTap: function () {
      this.trigger("Tap", !this.tapped);
    },

    MouseOver: function () {
      this.z_old = this._z;
      this.z = 1;
    },

    MouseOut: function () {
      this.z = this.z_old;
      delete this.z_old;
    }
  },

});

Crafty.c("EnemyCard", {
  required: "Card",

  init: function () {
    this.baseRot = 180;
    this.rotation = this.baseRot;
  },

});

Crafty.c("AllyCard", {
  required: "Card, Draggable",

  init: function () {
    this.baseRot = 0;
    this.rotation = this.baseRot;
  },

  events: {
    DoubleClick: function () {
      this.trigger("ToggleTap");
    },

    StopDrag: function () {
      function round100(v) {
        return Math.round(v / 100) * 100;
      }
      this.place(round100(this._x), round100(this._y));
    },
  },

});