From 4cde74e469598bc54878311812acd66924e2d876 Mon Sep 17 00:00:00 2001
From: "Jesse C. Fisher" <jessecfisher@gmail.com>
Date: Sat, 20 Feb 2016 04:33:30 -0800
Subject: [PATCH] Add hand to beat images

---
 .../javascripts/components/player_list.js.jsx      |  5 ++---
 app/assets/javascripts/components/table.js.jsx     |  2 +-
 app/assets/stylesheets/game.css.sass               | 14 ++++++++++++++
 app/assets/stylesheets/tables.css.scss             |  7 +++++++
 app/views/games/show.json.jbuilder                 |  2 ++
 spec/features/tables/table_show_spec.rb            |  2 +-
 6 files changed, 27 insertions(+), 5 deletions(-)

diff --git a/app/assets/javascripts/components/player_list.js.jsx b/app/assets/javascripts/components/player_list.js.jsx
index 2e110f27..40ff4939 100644
--- a/app/assets/javascripts/components/player_list.js.jsx
+++ b/app/assets/javascripts/components/player_list.js.jsx
@@ -1,3 +1,4 @@
+//TODO: Rename PlaerList to something appropriate
 var PlayerList = React.createClass({
   propTypes: {
     players: React.PropTypes.array,
@@ -25,8 +26,6 @@ var PlayerList = React.createClass({
       <div id="playerList">
         <div id="top">
           <div className="game-seat position-1">
-            {console.log("Hello from player_list.jsx")}
-            {console.log(this.props.onPlayHandSubmit)}
             <Seat
               {...this.props.game.seats[0]}
               game={this.props.game}
@@ -44,7 +43,7 @@ var PlayerList = React.createClass({
               current_user={this.props.current_user}
               onSeatSubmit={this.props.onSeatSubmit} />
           </div>
-          <div id="play-to-beat">Hand to beat: {this.props.game.play_to_beat_string}</div>
+          <HandToBeat cards={this.props.game.cards_to_beat} />
           <div className="game-seat position-3">
             <Seat
               {...this.props.game.seats[2]}
diff --git a/app/assets/javascripts/components/table.js.jsx b/app/assets/javascripts/components/table.js.jsx
index 5a345ae0..6b28004f 100644
--- a/app/assets/javascripts/components/table.js.jsx
+++ b/app/assets/javascripts/components/table.js.jsx
@@ -50,7 +50,7 @@ var Table = React.createClass({
       return <div>Loading...</div>;
     }
     return (
-      <div id={"table-" + this.state.data.id}>
+      <div className="table" id={"table-" + this.state.data.id}>
         <h1>{this.state.data.title}</h1>
         {/* TODO: DEPRECATED seats are now rendered within games <SeatList current_user={this.state.data.current_user} seats={this.state.data.seats} onSeatSubmit={this.handleSeatSubmit} /> */}
         <Game id={this.state.data.current_game_id} current_user={this.state.data.current_user} onSeatSubmit={this.handleSeatSubmit} />
diff --git a/app/assets/stylesheets/game.css.sass b/app/assets/stylesheets/game.css.sass
index 019903ad..382fe8c8 100644
--- a/app/assets/stylesheets/game.css.sass
+++ b/app/assets/stylesheets/game.css.sass
@@ -103,6 +103,20 @@ button
     flex: 0 0 100%
     align-self: flex-end
 
+////// Cards to beat
+
+ol#cards-to-beat
+  display: flex
+  flex-wrap: wrap
+  text-align: center
+  li
+    flex: 1 1 auto
+  img
+    width: 6vmin
+    border: 1px solid black
+    border-radius: .3vmin
+
+
 ////// Inventory
 
 .player form
diff --git a/app/assets/stylesheets/tables.css.scss b/app/assets/stylesheets/tables.css.scss
index ea3e587a..0c519cce 100644
--- a/app/assets/stylesheets/tables.css.scss
+++ b/app/assets/stylesheets/tables.css.scss
@@ -1,3 +1,10 @@
 // Place all the styles related to the Tables controller here.
 // They will automatically be included in application.css.
 // You can use Sass (SCSS) here: http://sass-lang.com/
+
+#table-component-container-container,
+#table-component-container,
+.table {
+  width: 100%;
+  height: 100%;
+}
diff --git a/app/views/games/show.json.jbuilder b/app/views/games/show.json.jbuilder
index c136e61a..35e067e7 100644
--- a/app/views/games/show.json.jbuilder
+++ b/app/views/games/show.json.jbuilder
@@ -1,8 +1,10 @@
 json.extract! @game, :id, :title, :created_at, :updated_at, :controlling_player_id
 if  @game.controlling_player_id == @game.player_to_beat.try(:id)
   json.play_to_beat_string "None"
+  json.cards_to_beat []
 else
   json.play_to_beat_string @game.play_to_beat.try(:play).try(:to_s)
+  json.cards_to_beat @game.play_to_beat.try(:play).try(:player_cards)
 end
 
 json.winner_player_id @game.winner_player_id
diff --git a/spec/features/tables/table_show_spec.rb b/spec/features/tables/table_show_spec.rb
index 0e3fb57a..15bf4701 100644
--- a/spec/features/tables/table_show_spec.rb
+++ b/spec/features/tables/table_show_spec.rb
@@ -53,7 +53,7 @@ feature 'Table show', :devise do
       #TODO: Fix race condition
       visit table_path @table
       #TODO: Write a better expectation
-      expect(page).to have_content "Hand to beat"
+      expect(page).to have_content "Inventory"
     end
 
   end