Made non-app portions of site friendlier.

tmiw · Aug 6, 2013 · 3977513 · 3977513
1 parent d341d93
commit 3977513
Show file tree

Hide file tree

Showing 6 changed files with 78 additions and 41 deletions.
diff --git a/src/main/scala/com/thoughtbug/newsrdr/NewsReaderServlet.scala b/src/main/scala/com/thoughtbug/newsrdr/NewsReaderServlet.scala
@@ -13,13 +13,9 @@ import org.openid4java.message._
 class NewsReaderServlet(dao: DataTables, db: Database) extends NewsrdrStack with AuthOpenId {
   val manager = new ConsumerManager
 
-  get("/") {        
-    <html>
-      <body>
-        <h1>test server</h1>
-        Real website coming soon. For now, <a href="/news/">click here</a> to get to the main app.
-      </body>
-    </html>
+  get("/") {
+    contentType = "text/html"
+    ssp("/index")
   }
 
   get("/auth/login") {

diff --git a/src/main/webapp/WEB-INF/templates/layouts/default.ssp b/src/main/webapp/WEB-INF/templates/layouts/default.ssp
@@ -1,7 +1,7 @@
 <%@ val body: String %>
 <html>
 <head>
-	<title>newsrdr</title>
+	<title>newsrdr beta</title>
 	<link href='http://fonts.googleapis.com/css?family=Roboto:400,700,700italic,400italic' rel='stylesheet' type='text/css' />
 	<link href='/static/css/layout.css' rel='stylesheet' type='text/css' />
 </head>
@@ -22,36 +22,5 @@
 	</div>
 </div>
 
-<!-- load scripts -->
-<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
-<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.5.1/underscore-min.js"></script>
-<script src="https://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.0.0/backbone-min.js"></script>
-<script src="https://cdnjs.cloudflare.com/ajax/libs/mustache.js/0.7.2/mustache.min.js"></script>
-
-<script src="/static/js/models/NewsFeed.js"></script>
-<script src="/static/js/models/NewsArticle.js"></script>
-<script src="/static/js/collections/NewsFeedCollection.js"></script>
-<script src="/static/js/collections/NewsArticleCollection.js"></script>
-<script src="/static/js/views/NewsFeedView.js"></script>
-<script src="/static/js/views/NewsArticleView.js"></script>
-<script src="/static/js/controllers/NewsFeedController.js"></script>
-
-<!-- start app once everything's loaded -->
-<script language="javascript">
-$.ajaxSetup({
-	beforeSend:function(){
-        // show gif here
-        $("#loading").show();
-    },
-    complete:function(){
-        // hide gif here
-        $("#loading").hide();
-    }
-});
-
-$(function(){
-	AppController = new NewsFeedController();
-});
-</script>
 </body>
 </html>
diff --git a/src/main/webapp/WEB-INF/templates/views/app.ssp b/src/main/webapp/WEB-INF/templates/views/app.ssp
@@ -17,10 +17,16 @@
 				<li class="feedmenuoption authonly"><a id="addNewFeedLink">add new feed</a></li>
 				<li class="feedmenuoption authonly"><a href="/auth/logout">logout</a></li>
 				<li class="feedmenuseparator authonly"><hr noshade/></li>
-				<li class="feedmenuoption"><a href="#">about newsrdr</a></li>
-				<li class="feedmenuoption"><a href="#">help</a></li>
+				<li class="feedmenuoption"><a href="/">about newsrdr</a></li>
+				<li class="feedmenuoption"><a href="https://github.com/tmiw/newsrdr/issues/new">help</a></li>
 			</ul>
 			<img src="/static/img/ajax-loader.gif" id="loading" />
+			<div class="welcomeblock">
+				<h1>welcome</h1>
+				<p>
+					To get started, select a feed from the left. Or, if you don't have any feeds yet, <a id="addNewFeedLink">add one</a>.
+				</p>
+			</div>
 			<ul class="feedpostlist" id="postlist">
 			</ul>
 			<ul class="feedpostlistend authonly feedonly allonly">
@@ -50,4 +56,36 @@
 	<div class="body">
 		{{{article.description}}}
 	</div>
+</script>
+
+<!-- load scripts -->
+<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
+<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.5.1/underscore-min.js"></script>
+<script src="https://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.0.0/backbone-min.js"></script>
+<script src="https://cdnjs.cloudflare.com/ajax/libs/mustache.js/0.7.2/mustache.min.js"></script>
+
+<script src="/static/js/models/NewsFeed.js"></script>
+<script src="/static/js/models/NewsArticle.js"></script>
+<script src="/static/js/collections/NewsFeedCollection.js"></script>
+<script src="/static/js/collections/NewsArticleCollection.js"></script>
+<script src="/static/js/views/NewsFeedView.js"></script>
+<script src="/static/js/views/NewsArticleView.js"></script>
+<script src="/static/js/controllers/NewsFeedController.js"></script>
+
+<!-- start app once everything's loaded -->
+<script language="javascript">
+$.ajaxSetup({
+	beforeSend:function(){
+        // show gif here
+        $("#loading").show();
+    },
+    complete:function(){
+        // hide gif here
+        $("#loading").hide();
+    }
+});
+
+$(function(){
+	AppController = new NewsFeedController();
+});
 </script>
diff --git a/src/main/webapp/WEB-INF/templates/views/index.ssp b/src/main/webapp/WEB-INF/templates/views/index.ssp
@@ -0,0 +1,21 @@
+<div class="rightcol">
+			<ul class="feedmenu">
+				<li class="feedmenuoption"><a href="/">about newsrdr</a></li>
+				<li class="feedmenuoption"><a href="https://github.com/tmiw/newsrdr/issues/new">help</a></li>
+				<li class="feedmenuoption"><a href="/auth/login">login</a></li>
+			</ul>
+			<div class="textblock">
+				<h1>newsrdr is a news reader without the extra fluff.</h1>
+				<p>
+					There was once Google Reader, but it soon became no more. People started looking for alternatives.<br/>
+					newsrdr stepped up to the plate.
+				</p>
+				<p>
+					Created in the middle of 2013, newsrdr set out to be the clean, simple news reader we all desire.<br/>
+					We stay out of your way so you can read what's most important in the world.
+				</p>
+				<p>
+					Best of all, it's easy to get started. <a href="/auth/login">Log in</a> with your Google account today.
+				</p>
+			</div>
+		</div>
diff --git a/src/main/webapp/static/css/layout.css b/src/main/webapp/static/css/layout.css
@@ -83,6 +83,12 @@ body {
 	padding-left: 15px;
 }
 
+.welcomeblock a {
+	text-decoration: none;
+	cursor: pointer;
+	color: blue;
+}
+
 .feed {
 	background-color: #fff;
 }
@@ -118,6 +124,11 @@ body {
 	list-style-type: none;
 }
 
+.textblock {
+	position: absolute;
+	top: 35%;
+}
+
 .feedpost {
 	max-width: 90%;
 	margin-top: 15px;

diff --git a/src/main/webapp/static/js/controllers/NewsFeedController.js b/src/main/webapp/static/js/controllers/NewsFeedController.js
@@ -91,6 +91,7 @@ NewsFeedController = Backbone.View.extend({
 	selectFeed: function(feed) {
 		this.clearPosts();
 
+		$(".welcomeblock").addClass("hide-element");
 		$("#homeEntry").removeClass("selectedfeed");
 		$("#allFeedEntry").removeClass("selectedfeed");
 		if (this.selectedFeed) {
@@ -174,6 +175,7 @@ NewsFeedController = Backbone.View.extend({
 		$(".selectedfeed").removeClass("selectedfeed");
 		$("#allFeedEntry").removeClass("selectedfeed");
 		$("#homeEntry").addClass("selectedfeed");
+		$(".welcomeblock").removeClass("hide-element");
 
 		this.selectedFeed = null;
 		this.showHideMenuOptions();