bigger version of target card. Sprites not implemented.

client/scripts/10-conf.coffee

@@ -8,6 +8,12 @@ CONF =
     w: 172
     h: 240
 
+  bigcard:
+    x: (1600 - 1200) / 2
+    y: (1800 - 1675) / 2
+    w: 1200
+    h: 1675
+
   anim:
     time: 300
     func: 'smootherStep'

client/scripts/20-comp-BigCard.coffee

@@ -0,0 +1,87 @@
+# intermediate config
+bcConf = Crafty.clone CONF.bigcard
+
+################
+# BigCard
+################
+Crafty.c 'BigCard',
+  # Mouse interactivity, Tween (animation smooth)
+  required: '2D, Canvas, Mouse, MouseWheel, Draggable, Tween'
+
+  # always in focus layer
+  init: ->
+    @z = CONF.layer.focus
+    return
+
+  events:
+    # copy attributes of target card
+    Copy: (target) ->
+      @target = target
+      @attr {
+        x: @target._x
+        y: @target._y
+        w: @target._w
+        h: @target._h
+        alpha: 0.5
+      }
+      return
+
+    # transition into zoom version
+    Enlarge: ->
+      @tween {
+        x: bcConf.x
+        y: bcConf.y
+        w: bcConf.w
+        h: bcConf.h
+        alpha: 1
+      }, CONF.anim.time, CONF.anim.func
+      return
+
+    # fade out and destroy
+    Fade: ->
+
+      # remove this on finished animation
+      @one 'TweenEnd', ->
+        @destroy()
+        return
+
+      # transition back to attributes of target card
+      @tween {
+        x: @target._x
+        y: @target._y
+        w: @target._w
+        h: @target._h
+        alpha: 0.5
+      }, CONF.anim.time, CONF.anim.func
+      return
+
+    # fade on right click, reset on middle click
+    MouseUp: (e) ->
+      switch e.mouseButton
+        when Crafty.mouseButtons.RIGHT
+          @trigger 'Fade'
+        when Crafty.mouseButtons.MIDDLE
+          # reset intermediate config, then re-zoom this
+          bcConf = Crafty.clone CONF.bigcard
+          @trigger 'Enlarge'
+      return
+
+    # zoom in and out
+    MouseWheelScroll: (e) ->
+      if e.target == @
+        # new attributes
+        @attr {
+          w: @_w * (1 + e.direction * 0.1)
+          h: @_h * (1 + e.direction * 0.1)
+        }
+        # update intermediate config
+        bcConf.w = @_w
+        bcConf.h = @_h
+        return
+      return
+
+    StopDrag: ->
+      # update intermediate config
+      bcConf.x = @_x
+      bcConf.y = @_y
+      return

client/scripts/20-comp-Card.coffee

@@ -53,6 +53,24 @@ Crafty.c 'Card',
       @z = CONF.layer.cards
       return
 
+    # show big version
+    Enlarge: ->
+      Crafty 'BigCard'
+        .each ->
+          @trigger 'Fade'
+          return
+
+      Crafty.e 'BigCard, Color'
+        .color 'black'
+        .trigger 'Copy', @
+        .trigger 'Enlarge'
+      return
+
+    MouseUp: (e) ->
+      if e.mouseButton == Crafty.mouseButtons.RIGHT
+        @trigger 'Enlarge'
+      return
+
 ################
 # EnemyCard
 ################
@@ -60,7 +78,7 @@ Crafty.c 'EnemyCard',
   # is a card
   required: 'Card'
 
-  # turned by default
+  # flipped by default
   init: ->
     @baseRot = 180
     @rotation = @baseRot
@@ -73,7 +91,7 @@ Crafty.c 'AllyCard',
   # is a card
   required: 'Card, Draggable'
 
-  # straight by default
+  # normally oriented by default
   init: ->
     @baseRot = 0
     @rotation = @baseRot

client/scripts/30-scene-Battle.coffee

@@ -5,12 +5,12 @@ Crafty.defineScene "Battle", ->
 
   # attach viewport to an (invisible) entity twice as big as a playmat
   Crafty.viewport.follow (
-    Crafty.e('2D, Canvas')
+    Crafty.e '2D, Canvas'
       .attr {
         w: 1 * CONF.playmat.w
         h: 2 * CONF.playmat.h
       }
-      .origin('center')
+      .origin 'center'
   )
 
   # scale viewport automatically (show that new entity)

client/scripts/40-test-entities.coffee

@@ -8,7 +8,7 @@ Crafty.sprite 480, 670, '//www.fftcgmognet.com/images/cards/hd/1/1/107.jpg',
     0
   ]
 
-card = Crafty.e('shantotto, AllyCard')
+card = Crafty.e 'shantotto, AllyCard'
   .attr {
     x: 0
     y: 0
@@ -17,14 +17,11 @@ card = Crafty.e('shantotto, AllyCard')
     @destroy()
     return
 
-Crafty.e('shantotto, AllyCard')
+Crafty.e 'shantotto, AllyCard'
   .place 300, 0
 
-Crafty.e('shantotto, AllyCard')
+Crafty.e 'shantotto, AllyCard'
   .place 600, 0
 
-Crafty.e('shantotto, EnemyCard')
+Crafty.e 'shantotto, EnemyCard'
   .place 900, 0
-
-# Crafty.e("shantotto, AllyCard")
-#   .attr({ x: 0, y: 0, w: 1200, h: 1675 });