add react version.

5 files changed, 82 insertions, 32 deletions

diff --git a/app/assets/javascripts/application.js b/app/assets/javascripts/application.js
deleted file mode 100644
index 6e8bec4..0000000
--- a/app/assets/javascripts/application.js
+++ /dev/null
@@ -1,32 +0,0 @@
-// This is a manifest file that'll be compiled into application.js, which will include all the files
-// listed below.
-//
-// Any JavaScript/Coffee file within this directory, lib/assets/javascripts, vendor/assets/javascripts,
-// or any plugin's vendor/assets/javascripts directory can be referenced here using a relative path.
-//
-// It's not advisable to add code directly here, but if you do, it'll appear at the bottom of the
-// compiled file.
-//
-// Read Sprockets README (https://github.com/sstephenson/sprockets#sprockets-directives) for details
-// about supported directives.
-//
-//= require clipboard
-//= require lodash
-//= require moment
-//= require jquery
-//= require jquery_ujs
-//= require ractive
-//= require backbone
-//= require ractive-backbone
-//= require Chart.bundle
-//= require chartkick
-//= require fullcalendar
-//= require vue
-//= require_self
-//= require_tree .
-//= require turbolinks
-
-var Stronglifters = Stronglifters || {};
-$(document).on('turbolinks:load', function(){
-  new Stronglifters.Startup().start();
-});
diff --git a/app/assets/javascripts/application.js.coffee b/app/assets/javascripts/application.js.coffee
new file mode 100644
index 0000000..f8269ba
--- /dev/null
+++ b/app/assets/javascripts/application.js.coffee
@@ -0,0 +1,36 @@
+# This is a manifest file that'll be compiled into application.js, which will include all the files
+# listed below.
+#
+# Any JavaScript/Coffee file within this directory, lib/assets/javascripts, vendor/assets/javascripts,
+# or any plugin's vendor/assets/javascripts directory can be referenced here using a relative path.
+#
+# It's not advisable to add code directly here, but if you do, it'll appear at the bottom of the
+# compiled file.
+#
+# Read Sprockets README (https:#github.com/sstephenson/sprockets#sprockets-directives) for details
+# about supported directives.
+#
+#= require clipboard
+#= require lodash
+#= require moment
+#= require jquery
+#= require jquery_ujs
+#= require ractive
+#= require backbone
+#= require ractive-backbone
+#= require Chart.bundle
+#= require chartkick
+#= require fullcalendar
+#= require vue
+#= require react
+#= require react_ujs
+#= require components
+
+#= require_self
+#= require_tree .
+#= require turbolinks
+
+window.Stronglifters ?= {}
+
+$(document).on 'turbolinks:load', () =>
+  new Stronglifters.Startup().start()
diff --git a/app/assets/javascripts/components.js b/app/assets/javascripts/components.js
new file mode 100644
index 0000000..9ce7a4f
--- /dev/null
+++ b/app/assets/javascripts/components.js
@@ -0,0 +1 @@
+//= require_tree ./components
diff --git a/app/assets/javascripts/components/.gitkeep b/app/assets/javascripts/components/.gitkeep
new file mode 100644
index 0000000..e69de29
--- /dev/null
+++ b/app/assets/javascripts/components/.gitkeep
diff --git a/app/assets/javascripts/components/recovery_day.js.jsx b/app/assets/javascripts/components/recovery_day.js.jsx
new file mode 100644
index 0000000..688c326
--- /dev/null
+++ b/app/assets/javascripts/components/recovery_day.js.jsx
@@ -0,0 +1,45 @@
+var RecoveryDay = React.createClass({
+  propTypes: {
+    squat: React.PropTypes.number,
+    benchPress: React.PropTypes.number,
+    overheadPress: React.PropTypes.number
+  },
+
+  render: function() {
+    return (
+      <div>
+        <h1 className="title">Wednesday</h1>
+        <h2 className="subtitle">Recovery Day</h2>
+        <table className="table">
+          <tbody>
+            <tr>
+              <td><strong>Squat</strong> 2x5 @ 80% of Monday's work weight</td>
+              <td>{this.rounded(this.rounded(this.props.squat * 0.9) * 0.8)}lbs</td>
+            </tr>
+            <tr>
+              <td><strong>*Bench Press</strong> (3x5 @ 90% 5RM)</td>
+              <td>{this.props.bench_press * 0.9}lbs</td>
+            </tr>
+            <tr>
+              <td>*<strong>Overhead Press</strong> 3x5 @ 90% 5RM</td>
+              <td>{this.props.overhead_press * 0.9}lbs</td>
+            </tr>
+            <tr>
+              <td><strong>Chin-up</strong> 3 x body weight</td>
+              <td></td>
+            </tr>
+            <tr>
+              <td><strong>Back Extension</strong> or <strong>Glute Ham Raise</strong> 5x10</td>
+              <td></td>
+            </tr>
+          </tbody>
+        </table>
+        <p className="content is-small">*Bench press if you overhead pressed on Monday.</p>
+      </div>
+    );
+  },
+
+  rounded: function(n) {
+    return n - (n % 5);
+  }
+});