$table = null
+state = {
+ card_types: [
+ {text: "Rusty Camel"}
+ {text: "Angry Ocelot"}
+ {text: "Unruly Parsnip"}
+ ],
+ # values are indexes into card_types array
+ my_cards: [0, 0, 0, 1, 1, 2],
+ your_cards: [0, 1, 1, 2, 2, 2],
+ auto_shuffle: true
+}
+
+unless Array::shuffle?
+ Array::shuffle = ->
+ return if @length is 0
+ top = @length
+
+ while --top
+ current = Math.floor(Math.random() * (top + 1))
+ tmp = @[current]
+ @[current] = @[top]
+ @[top] = tmp
+ return
+
+new_button = (text) -> $ $ "<div class=\"button\">#{text}</div>"
+
add_card = (text, x, y) ->
- card = $ $ "<div class=\"card\" style=\"left: #{x}px; top: #{y}px\">#{text}</div>"
+ card = $ $ "<div class=\"card\" style=\"left: #{x}px; top: #{y}px\"><span class=\"cardtext\">#{text}</span></div>"
+ button_box = $ $ '<div/>'
+ flip_button = new_button "flip over"
+ mark_button = new_button "mark"
+ flip_button.bind 'click', ->
+ card.toggleClass 'flipped'
+ # FIXME tell server
+ mark_button.bind 'click', ->
+ card.toggleClass 'marked'
+ # FIXME tell server
+ button_box.append flip_button
+ button_box.append mark_button
+ card.append button_box
$table.append card
- card.draggable()
-
+ card.draggable stack: '.card'
+ card.bind 'dragstop', (event, ui) ->
+ p = card.position()
+ #card.children().html("(#{p.left}, #{p.top})")
+
init = ->
- $table = $ '#table'
- add_card "card 1", 100, 20
- add_card "two", 250, 20
- add_card "third card", 290, 50
+ if state.auto_shuffle
+ state.my_cards.shuffle()
+ state.your_cards.shuffle() # FIXME have the server or other player do this
+ state.auto_shuffle = false
+ left = 15
+ top = 450
+ for card in state.my_cards
+ add_card state.card_types[card].text, left, top
+ left += 120
+ left = 15
+ top = 250
+ for card in state.your_cards
+ add_card state.card_types[card].text, left, top
+ left += 120
$ ->
+ $table = $ '#table'
init()