yo

.nodemonignore

@@ -1,2 +1,3 @@
 .concept.MD
-.git/*
+.git/*
+/Users/arvidkahl/Projects/spark/spark/public/less/bootstrap.css

main.coffee

@@ -39,10 +39,17 @@ scene = new Articler config.mainDBHost, config.mainDBPort, config.mainDB
 
 app.get '/', (req, res) ->
 	scene.findAll (err, docs) ->
+		threeDocs = []
+		for tempDoc in [1..3]
+			position= Math.floor(Math.random() * docs.length)
+			threeDocs.push docs[position]
+			docs.splice position, 1
+
+		console.log threeDocs
 		res.render 'index', {
 			locals: {
 				title: 'Spark.'
-				articles: docs
+				docs: threeDocs
 			}
 		}
 
@@ -51,9 +58,10 @@ app.get '/scenes', (req, res) ->
 		res.render 'scenes', {
 			locals: {
 				title: 'Spark.'
-				articles: docs
+				docs: docs
 			}
 		}	
+
 app.get '/new', (req, res) ->
 	res.render 'new', {
 		locals: {

public/less/bootstrap.css

@@ -3723,3 +3723,16 @@ h1 {
   margin-bottom: 0;
   padding: 5px;
 }
+#indexHeroUnit {
+  background-image: url(../img/bg-hero.jpg);
+  background-position: 0 -25px;
+}
+#indexHeroUnit h1 {
+  text-shadow: 1px 1px 2px #333333;
+}
+#indexHeroUnit p {
+  text-shadow: 0px 0px 3px #ffffff;
+}
+#indexRandomScenes h2 {
+  margin-top: -15px;
+}

public/less/utilities.less

@@ -74,4 +74,21 @@ h1 {
 #scenes li div.well {
 	margin-bottom:0;
 	padding:5px;
+}
+
+#indexHeroUnit{
+	background-image: url(../img/bg-hero.jpg);
+	background-position: 0 -25px;
+}
+
+#indexHeroUnit h1 {
+	text-shadow: 1px 1px 2px @grayDark;
+}
+
+#indexHeroUnit p {
+	text-shadow: 0px 0px 3px @white;
+}
+
+#indexRandomScenes h2 {
+	margin-top:-15px;
 }

views/index.jade

@@ -1,18 +1,43 @@
 .row
   div.span12
-    .hero-unit
+    .hero-unit#indexHeroUnit
       h1 Ignite your imagination. 
       p Let fantastic concept art inspire you. Share your stories with other imagineers. 
       p
         a.btn.btn-primary(href="/howto") Show me how it works! »
         | 
         a.btn(href="/random") Take me to a scene already! »
+.row#indexRandomScenes
   div.span4
     .well 
       h2 Check!
+      a(href='/'+docs[0]._id)
+        div.image
+          img(id=docs[0]._id,src=docs[0].url, alt=docs[0].body) 
+        div
+          h6= docs[0].title 
+            small.pull-right= "by "+docs[0].createUserName
+          a.btn(href='/'+docs[0]._id ) Show me the Stories »
+
   div.span4
     .well
       h2 These!
+      a(href='/'+docs[1]._id)
+        div.image
+          img(id=docs[1]._id,src=docs[1].url, alt=docs[1].body) 
+        div
+          h6= docs[1].title 
+            small.pull-right= "by "+docs[1].createUserName
+          a.btn(href='/'+docs[1]._id ) Show me the Stories »
+
   div.span4
     .well
-      h2 Out!
+      h2 Out!
+      a(href='/'+docs[2]._id)
+        div.image
+          img(id=docs[2]._id,src=docs[2].url, alt=docs[2].body) 
+        div
+          h6= docs[2].title 
+            small.pull-right= "by "+docs[2].createUserName
+          a.btn(href='/'+docs[2]._id ) Show me the Stories »
+

views/scenes.jade

@@ -1,16 +1,16 @@
 div.row#sceneRow
   div.span12  
     ul#scenes
-      - each article in articles
+      - each doc in docs
         li
          .well
-          a(href='/'+article._id)
+          a(href='/'+doc._id)
             div.image
-              img(id=article._id,src=article.url, alt=article.body) 
+              img(id=doc._id,src=doc.url, alt=doc.body) 
             div
-              h6= article.title 
-                small.pull-right= "by "+article.createUserName
-              a.btn(href= article._id ) Show me the Stories »
+              h6= doc.title 
+                small.pull-right= "by "+doc.createUserName
+              a.btn(href= doc._id ) Show me the Stories »
 
 script
  $('#scenes li').wookmark({container:$('#scenes'),offset:5,itemWidth:260,autoResize:true});

views/single.jade

@@ -17,7 +17,7 @@ div.row
         i.icon-comment 
         | 
         strong Stories for this Scene
-        span.pull-right 2
+        span.pull-right #{doc.stories.length}
       p
         i.icon-exclamation-sign 
         |