Track stats on match page

app/views/mats/_match_edit_form.html.erb

@@ -10,8 +10,66 @@
       </ul>
     </div>
   <% end %>
-
-<h4>Bout <%= @match.bout_number %> <%= @w1.name %> VS. <%= @w2.name %></h4>
+  <h4>Bout <%= @match.bout_number %></h4>
+<table class="table">
+  <thead>
+      <tr>
+        <th><%= @w1.name %> <select id="w1-color" onchange="changeW1Color(this)">
+            <option value="green">Green</option>
+            <option value="red">Red</option>
+        </select></th>
+        <th><%= @w2.name %> <select id="w2-color" onchange="changeW2Color(this)">
+            <option value="red">Red</option>
+            <option value="green">Green</option>
+        </select></th>
+      </tr>
+    </thead>
+    <tbody>
+      <tr>
+        <td><%= @w1.name %> Stats: <br><%= f.text_area :w1_stat, cols: "30", rows: "10"  %></td>
+        <td><%= @w2.name %> Stats: <br><%= f.text_area :w2_stat, cols: "30", rows: "10"  %></td>
+      </tr>
+      <tr>
+        <td><%= @w1.name %> Scoring <br><button id="w1-takedown" type="button" class="btn btn-success btn-sm" onclick="updateStats(w1,'T2')">T2</button>
+        <button id="w1-escape" type="button" class="btn btn-success btn-sm" onclick="updateStats(w1,'E1')">E1</button>
+        <button id="w1-reversal" type="button" class="btn btn-success btn-sm" onclick="updateStats(w1,'R2')">R2</button>
+        <button id="w1-nf2" type="button" class="btn btn-success btn-sm" onclick="updateStats(w1,'N2')">N2 </button>
+        <button id="w1-nf3" type="button" class="btn btn-success btn-sm" onclick="updateStats(w1,'N3')">N3</button>
+        <button id="w1-nf4" type="button" class="btn btn-success btn-sm" onclick="updateStats(w1,'N4')">N4</button>
+        <button id="w1-penalty" type="button" class="btn btn-success btn-sm" onclick="updateStats(w1,'P1')">P1</button></td>
+        <td><%= @w2.name %> Scoring <br><button id="w2-takedown" type="button" class="btn btn-danger btn-sm" onclick="updateStats(w2,'T2')">T2</button>
+        <button id="w2-escape" type="button" class="btn btn-danger btn-sm" onclick="updateStats(w2,'E1')">E1</button>
+        <button id="w2-reversal" type="button" class="btn btn-danger btn-sm" onclick="updateStats(w2,'R2')">R2</button>
+        <button id="w2-nf2" type="button" class="btn btn-danger btn-sm" onclick="updateStats(w2,'N2')">N2</button>
+        <button id="w2-nf3" type="button" class="btn btn-danger btn-sm" onclick="updateStats(w2,'N3')">N3</button>
+        <button id="w2-nf4" type="button" class="btn btn-danger btn-sm" onclick="updateStats(w2,'N4')">N4</button>
+        <button id="w2-penalty" type="button" class="btn btn-danger btn-sm" onclick="updateStats(w2,'P1')">P1</button></td>
+      </tr>
+      <tr>
+        <td><%= @w1.name %> Choice <br><button id="w1-top" type="button" class="btn btn-success btn-sm" onclick="updateStats(w1,'|Chose Top|')">Chose Top</button>
+        <button id="w1-bottom" type="button" class="btn btn-success btn-sm" onclick="updateStats(w1,'|Chose Bottom|')">Chose Bottom</button>
+        <button id="w1-nuetral" type="button" class="btn btn-success btn-sm" onclick="updateStats(w1,'|Chose Nuetral|')">Chose Nuetral</button>
+        <button id="w1-differ" type="button" class="btn btn-success btn-sm" onclick="updateStats(w1,'|Differed|')">Differed</button></td>
+        <td><%= @w2.name %> Choice <br><button id="w2-top" type="button" class="btn btn-danger btn-sm" onclick="updateStats(w2,'|Chose Top|')">Chose Top</button>
+        <button id="w2-bottom" type="button" class="btn btn-danger btn-sm" onclick="updateStats(w2,'|Chose Bottom|')">Chose Bottom</button>
+        <button id="w2-nuetral" type="button" class="btn btn-danger btn-sm" onclick="updateStats(w2,'|Chose Nuetral|')">Chose Nuetral</button>
+        <button id="w2-differ" type="button" class="btn btn-danger btn-sm" onclick="updateStats(w2,'|Differed|')">Differed</button></td>
+      </tr>
+      <tr>
+        <td><%= @w1.name %> Warnings <br><button id="w1-stalling" type="button" class="btn btn-success btn-sm" onclick="updateStats(w1,'S')">Stalling</button>
+        <button id="w1-caution" type="button" class="btn btn-success btn-sm" onclick="updateStats(w1,'C')">Caution</button></td>
+        <td><%= @w2.name %> Warnings <br><button id="w2-stalling" type="button" class="btn btn-danger btn-sm" onclick="updateStats(w2,'S')">Stalling</button>
+        <button id="w2-caution" type="button" class="btn btn-danger btn-sm" onclick="updateStats(w2,'C')">Caution</button></td>
+      </tr>
+      <tr>
+        <td>Match Options <br><button type="button" class="btn btn-primary btn-sm" onclick="updateStats(w2,'|End Period|');updateStats(w1,'|End Period|')">End Period</button></td>
+      </tr>
+    </tbody>
+</table>
+<br>
+<br>
+<br>
+<h4>Match Results</h4>
 <br>
   <div class="field">
     <%= f.label "Win Type" %><br>
@@ -24,7 +82,7 @@
   </div>
   <br>
   <div class="field">
-    <%= f.label "Score" %> Also put pin time here if applicable. If default or forfeit, leave blank. Example: 7-2, 17-2, or 2:34<br>
+    <%= f.label "Final Score" %> Also put pin time here if applicable. If default or forfeit, leave blank. Example: 7-2, 17-2, or 2:34<br>
     <%= f.text_field :score %>
   </div>
   <br>
@@ -39,3 +97,132 @@
      
   </div>
 <% end %>
+
+<script>
+  //Create person object
+  function Person(stats){
+  	this.stats=stats;
+  }
+
+  //Declare variables
+  var w1=new Person("");
+  var w2=new Person("");
+
+  function updatehtmlvalues(){
+  	document.getElementById("match_w1_stat").value = w1.stats;
+  	document.getElementById("match_w2_stat").value = w2.stats;
+  }
+  function updatejsvalues(){
+  	w1.stats=document.getElementById("match_w1_stat").value;
+  	w2.stats=document.getElementById("match_w2_stat").value;
+  }
+  
+  function takedown(wrestler){
+  	updateStats(wrestler,"T2")
+  }
+  
+  function updateStats(wrestler,text){
+    updatejsvalues();
+  	wrestler.stats = wrestler.stats + text + " ";
+  	updatehtmlvalues();
+  }
+  
+  //For Changing button colors
+  function changeW1Color(color){
+    if (color.value == "red") {
+        w1Red();
+        w2Green();
+        document.getElementById("w2-color").value = "green";
+    }
+    if (color.value == "green") {
+        w1Green();
+        w2Red();
+        document.getElementById("w2-color").value = "red";
+    }
+  }
+  
+  function changeW2Color(color){
+    if (color.value == "red") {
+        w2Red();
+        w1Green();
+        document.getElementById("w1-color").value = "green";
+    }
+    if (color.value == "green") {
+        w2Green();
+        w1Red();
+        document.getElementById("w1-color").value = "red";
+    }
+  }
+  
+  function redColor(id){
+    document.getElementById(id).className = "btn btn-danger btn-sm";
+  }
+  
+  function greenColor(id){
+    document.getElementById(id).className = "btn btn-success btn-sm";
+  }
+  
+  function w1Red(){
+    redColor("w1-takedown");
+    redColor("w1-escape");
+    redColor("w1-reversal");
+    redColor("w1-penalty");
+    redColor("w1-nf4");
+    redColor("w1-nf3");
+    redColor("w1-nf2");
+    redColor("w1-top");
+    redColor("w1-bottom");
+    redColor("w1-nuetral");
+    redColor("w1-differ");
+    redColor("w1-stalling");
+    redColor("w1-caution");
+  }
+  
+  function w1Green(){
+    greenColor("w1-takedown");
+    greenColor("w1-escape");
+    greenColor("w1-reversal");
+    greenColor("w1-penalty");
+    greenColor("w1-nf4");
+    greenColor("w1-nf3");
+    greenColor("w1-nf2");
+    greenColor("w1-top");
+    greenColor("w1-bottom");
+    greenColor("w1-nuetral");
+    greenColor("w1-differ");
+    greenColor("w1-stalling");
+    greenColor("w1-caution");
+  }
+  
+  function w2Red(){
+    redColor("w2-takedown");
+    redColor("w2-escape");
+    redColor("w2-reversal");
+    redColor("w2-penalty");
+    redColor("w2-nf4");
+    redColor("w2-nf3");
+    redColor("w2-nf2");
+    redColor("w2-top");
+    redColor("w2-bottom");
+    redColor("w2-nuetral");
+    redColor("w2-differ");
+    redColor("w2-stalling");
+    redColor("w2-caution");
+  }
+  
+  function w2Green(){
+    greenColor("w2-takedown");
+    greenColor("w2-escape");
+    greenColor("w2-reversal");
+    greenColor("w2-penalty");
+    greenColor("w2-nf4");
+    greenColor("w2-nf3");
+    greenColor("w2-nf2");
+    greenColor("w2-top");
+    greenColor("w2-bottom");
+    greenColor("w2-nuetral");
+    greenColor("w2-differ");
+    greenColor("w2-stalling");
+    greenColor("w2-caution");
+  }
+</script>

db/migrate/20151216154211_rename_stats.rb

@@ -0,0 +1,6 @@
+class RenameStats < ActiveRecord::Migration
+  def change
+    rename_column :matches, :g_stat, :w1_stat
+    rename_column :matches, :r_stat, :w2_stat
+  end
+end

db/schema.rb

@@ -11,13 +11,13 @@
 #
 # It's strongly recommended that you check this file into your version control system.
 
-ActiveRecord::Schema.define(version: 20151117152454) do
+ActiveRecord::Schema.define(version: 20151216154211) do
 
   create_table "matches", force: :cascade do |t|
     t.integer  "w1"
     t.integer  "w2"
-    t.text     "g_stat"
-    t.text     "r_stat"
+    t.text     "w1_stat"
+    t.text     "w2_stat"
     t.integer  "winner_id"
     t.string   "win_type"
     t.string   "score"