show jobs route up

common/app/routes/Jobs/components/Jobs.jsx

@@ -1,6 +1,7 @@
-import React, { PropTypes } from 'react';
+import React, { cloneElement, PropTypes } from 'react';
 import { contain } from 'thundercats-react';
-import { Grid, Row } from 'react-bootstrap';
+import { Button, Jumbotron, Row } from 'react-bootstrap';
+import ShowJobs from './Show.jsx';
 
 export default contain(
   {
@@ -10,16 +11,51 @@ export default contain(
   React.createClass({
     displayName: 'Jobs',
     propTypes: {
+      children: PropTypes.element,
       jobs: PropTypes.array
     },
 
-    render() {
+    renderShow(jobs) {
       return (
-        <Grid>
+        <ShowJobs jobs={ jobs }/>
+      );
+    },
+
+    renderChild(child, jobs) {
+      if (!child) {
+        return null;
+      }
+      return cloneElement(
+        child,
+        { jobs }
+      );
+    },
+
+    render() {
+      const { children, jobs } = this.props;
+
+      return (
+        <div>
           <Row>
-            foo
+            <Jumbotron>
+              <h1>Free Code Camps' Job Board</h1>
+              <p>
+                Need to find the best junior developers?
+                Want to find dedicated developers eager to join your company?
+                Sign up now to post your job!
+              </p>
+              <Button
+                bsSize='large'
+                className='signup-btn'>
+                Try the first month 20% off!
+              </Button>
+            </Jumbotron>
           </Row>
-        </Grid>
+          <Row>
+            { this.renderChild(children, jobs) ||
+              this.renderShow(jobs) }
+            </Row>
+        </div>
       );
     }
   })

common/app/routes/Jobs/components/Show.jsx

@@ -0,0 +1,52 @@
+import React, { PropTypes } from 'react';
+import { contain } from 'thundercats-react';
+import { Accordion, Thumbnail, Panel } from 'react-bootstrap';
+
+export default contain(
+  {
+  },
+  React.createClass({
+    displayName: 'ShowJobs',
+
+    propTypes: {
+      jobs: PropTypes.array
+    },
+
+    renderJobs(jobs =[]) {
+      return jobs.map((
+        { id, company, position, description, logoUrl },
+        index
+      ) => {
+        const header = (
+          <div>
+            <h4 style={{ display: 'inline-block' }}>{ company }</h4>
+            <h5
+              className='pull-right'
+              style={{ display: 'inline-block' }}>
+              { position }
+            </h5>
+          </div>
+        );
+        return (
+          <Panel
+            collapsable={ true }
+            eventKey={ index }
+            header={ header }
+            key={ id }>
+            <Thumbnail alt='171x180' src={ logoUrl } />
+            <p>{ description }</p>
+          </Panel>
+        );
+      });
+    },
+
+    render() {
+      const { jobs } = this.props;
+      return (
+        <Accordion>
+          { this.renderJobs(jobs) }
+        </Accordion>
+      );
+    }
+  })
+);

common/models/job.json

@@ -10,14 +10,38 @@
     "company": {
       "type": "string"
     },
-    "logoUrl": {
+    "logo": {
       "type": "string"
     },
-    "postingUrl": {
+    "city": {
       "type": "string"
     },
-    "copy": {
-      "type": "array"
+    "contact": {
+      "type": "string"
+    },
+    "state": {
+      "type": "string"
+    },
+    "country": {
+      "type": "string"
+    },
+    "location": {
+      "type": "geopoint"
+    },
+    "description": {
+      "type": "string"
+    },
+    "isApproverd": {
+      "type": "bool"
+    },
+    "isHighlighted": {
+      "type": "bool"
+    },
+    "isValid": {
+      "type": "bool"
+    },
+    "createdOn": {
+      "type": "date"
     }
   },
   "validations": [],

seed/jobs.json

@@ -3,32 +3,28 @@
     "id": "bd7167d8c441cbafaeb5bdef",
     "company": "Livestream",
     "position": "Junior Backend Developer (Node.js)",
-    "logoUrl": "https://s3.amazonaws.com/prod-heroku/greenhouse_job_boards/logos/000/001/189/resized/livestream_logo-rgb_standard-cc718e67ce1a0f6fa400f609bdefe605.png?1429547161",
-    "postingUrl": "https://boards.greenhouse.io/livestream/jobs/59458?t=ek25h0#.VWeTk1xVhBc?source=freecodecamp.com",
+    "logo": "https://s3.amazonaws.com/prod-heroku/greenhouse_job_boards/logos/000/001/189/resized/livestream_logo-rgb_standard-cc718e67ce1a0f6fa400f609bdefe605.png?1429547161",
     "description": "foo job"
   },
   {
     "id": "bd7167d8c442cbafaeb5bdef",
     "company": "Adobe",
     "position": "Junior JavaScript Engineer",
-    "logoUrl": "http://cdn-3.famouslogos.us/images/adobe-logo.jpg",
-    "postingUrl": "https://adobe.taleo.net/careersection/2/jobdetail.ftl?job=32619&lang=en",
+    "logo": "http://cdn-3.famouslogos.us/images/adobe-logo.jpg",
     "description": "foo job"
   },
   {
     "id": "bd7167d8c443cbafaeb5bdef",
     "company": "Bookspan",
     "position": "Full Stack JavaScript Developer (Junior)",
-    "logoUrl": "https://tm-prod.global.ssl.fastly.net/uploaded/companies/227/small_logo.png?v=db9dbe",
-    "postingUrl": "http://bookspan.theresumator.com/apply/10190b666b74087b537f4659756f7c5679000704722064232c1d2e3b2b102501310437/Fullstack-Javascript-Developer-junior?source=freecodecamp.com&sid=zvi9YD9OcHwoDZNgM3XI9uPszGvqxJo6eHf",
+    "logo": "https://tm-prod.global.ssl.fastly.net/uploaded/companies/227/small_logo.png?v=db9dbe",
     "description": "foo job"
   },
   {
     "id": "bd7167d8c444cbafaeb5bdef",
     "company": "Good Eggs",
     "position": "Full Stack Developer",
-    "logoUrl": "https://d1qb2nb5cznatu.cloudfront.net/startups/i/72165-64efbd521cdfe3357c811758f5436e7d-medium_jpg.jpg",
-    "postingUrl": "http://www.jobscore.com/jobs2/goodeggs/full-stack-developer/cQ_hd-0USr4Om7eJe4iefn?Board=freecodecamp.com",
+    "logo": "https://d1qb2nb5cznatu.cloudfront.net/startups/i/72165-64efbd521cdfe3357c811758f5436e7d-medium_jpg.jpg",
     "description": "foo job"
   }
 ]