Finished Readable Bad/Good

ryanmcdermott · Mar 1, 2017 · 150830a · 150830a
1 parent 2bd29eb
commit 150830a
Show file tree

Hide file tree

Showing 2 changed files with 96 additions and 52 deletions.
diff --git a/src/1-readable/bad/index.js b/src/1-readable/bad/index.js
@@ -1,11 +1,13 @@
 import React, { Component } from 'react';
 
-class inventory extends Component
+class inv extends Component
 {
-  constructor() {
+  constructor()
+  {
     super();
     this.state =
     {
+      c: 'usd',
       i: [
         {
           product: 'Flashlight',
@@ -32,76 +34,52 @@ class inventory extends Component
     }
   }
 
-  curConv(am, fC, tC)
-  {
-    var c = [
-      {
-        usd:
-        {
-          rupee: 66.78,
-          yuan: 6.87,
-        },
-        yuan: {
-          usd: 0.15,
-          rupee: 9.72,
-        },
-        rupee: {
-          yuan: .10,
-          usd: .015,
-        },
-      }
-    ];
-
-
-    return am * c[fC][tC];
-  }
-
   render () {
     return (
       <table style={{width: '100%'}}>
       <tbody>
       <tr>
-        <th>
-          Product
-        </th>
+      <th>
+        Product
+      </th>
 
-        <th>
-          Image
-        </th>
+      <th>
+        Image
+      </th>
 
-        <th>
-          Description
-        </th>
+      <th>
+        Description
+      </th>
 
-        <th>
-          Price
-        </th>
+      <th>
+        Price
+      </th>
       </tr>
-        {this.state.i.map(function(item, i) {
+        {this.state.i.map(function(i, idx) {
           return (
-            <tr>
+            <tr key = {idx}>
               <td>
-                {item.product}
+                {i.product}
               </td>
 
               <td>
-                <img src={item.img} alt=""/>
+              <img src={i.img} alt=""/>
               </td>
 
               <td>
-                {item.desc}
+              {i.desc}
               </td>
 
               <td>
-                {item.price}
+                {i.price}
               </td>
             </tr>
           );
         })}
-      </tbody>
+    </tbody>
     </table>
     );
   }
 }
 
-export default inventory;
+export default inv;
diff --git a/src/1-readable/good/index.js b/src/1-readable/good/index.js
@@ -1,14 +1,80 @@
-
 import React, { Component } from 'react';
 
-class ReadableGood extends Component {
+class Inventory extends Component {
+  constructor() {
+    super();
+    this.state = {
+      localCurrency: 'usd',
+      inventory: [
+        {
+          product: 'Flashlight',
+          img: '/flashlight.jpg',
+          desc: 'A really great flashlight',
+          price: 100,
+          currency: 'usd',
+        },
+        {
+          product: 'Tin can',
+          img: '/tin_can.jpg',
+          desc: 'Pretty much what you would expect from a tin can',
+          price: 32,
+          currency: 'usd',
+        },
+        {
+          product: 'Cardboard Box',
+          img: '/cardboard_box.png',
+          desc: 'It holds things',
+          price: 5,
+          currency: 'usd',
+        },
+      ],
+    };
+  }
+
   render() {
     return (
-      <div>
-        Readable Good
-      </div>
+      <table style={{ width: '100%' }}>
+        <tbody>
+          <tr>
+            <th>
+              Product
+            </th>
+
+            <th>
+              Image
+            </th>
+
+            <th>
+              Description
+            </th>
+
+            <th>
+              Price
+            </th>
+          </tr>
+          {this.state.inventory.map((item, idx) => (
+            <tr key={idx}>
+              <td>
+                {item.product}
+              </td>
+
+              <td>
+                <img src={item.img} alt="" />
+              </td>
+
+              <td>
+                {item.desc}
+              </td>
+
+              <td>
+                {item.price}
+              </td>
+            </tr>
+            ))}
+        </tbody>
+      </table>
     );
   }
 }
 
-export default ReadableGood;
+export default Inventory;