From 0120735ce102421a2d5178e4293f244c9225c114 Mon Sep 17 00:00:00 2001
From: Jules Laplace <julescarbon@gmail.com>
Date: Mon, 11 Dec 2017 01:06:34 +0100
Subject: rearranging.

---
 bucky/app/router.js            |  6 ++++++
 bucky/search/search.js         |  1 -
 public/assets/css/bucky.css    | 31 ++++++++++++++++++++++++++-----
 public/assets/js/lib/router.js | 27 ++++++++++++++-------------
 views/pages/index.ejs          | 19 +++++--------------
 views/pages/search.ejs         | 13 +++++++++----
 views/partials/searchform.ejs  |  4 ++++
 views/partials/threads.ejs     |  2 +-
 8 files changed, 65 insertions(+), 38 deletions(-)
 create mode 100644 views/partials/searchform.ejs

diff --git a/bucky/app/router.js b/bucky/app/router.js
index a793192..4f4396f 100644
--- a/bucky/app/router.js
+++ b/bucky/app/router.js
@@ -26,6 +26,12 @@ module.exports = function(app){
       hoot_text: fortune("hoots"),
     })
   })
+  app.get("/index/:keyword", middleware.ensureAuthenticated, function(req, res){
+    res.render("pages/index", {
+      title: fortune("titles"),
+      hoot_text: fortune("hoots"),
+    })
+  })
   app.get("/details/:id", middleware.ensureAuthenticated, function(req, res){
     res.render("pages/details", {})
   })
diff --git a/bucky/search/search.js b/bucky/search/search.js
index 6e1fd01..1236a4c 100644
--- a/bucky/search/search.js
+++ b/bucky/search/search.js
@@ -4,7 +4,6 @@ var STOPWORDS = require('./stopwords')
 
 var wordRegexp = new RegExp("[^a-z0-9]+", 'g');
 function parse_terms (s) {
-console.log(s, wordRegexp)
   return s.toLowerCase().split(wordRegexp).filter((term) => !!term)
 }
 function cmp (a,b){ return (a<b)?-1:(a===b)?0:1 }
diff --git a/public/assets/css/bucky.css b/public/assets/css/bucky.css
index 3950585..9bce371 100644
--- a/public/assets/css/bucky.css
+++ b/public/assets/css/bucky.css
@@ -70,9 +70,8 @@ h1 {
 .bluebox big {
   display: block;
   text-align: center;
-  margin-bottom: 4px;
-  margin-left: 3px;
   margin-top: 2px;
+  margin-bottom: 4px;
 }
 a:link    { color: #2050ca; text-decoration: underline; }
 a:visited { color: #1030aa; text-decoration: none; }
@@ -527,9 +526,7 @@ code br {
 }
 
 #search {
-  background: #f8f8f8;
   padding: 5px;
-  border: 1px solid #ddd;
   color: #333;
 }
 #search b {
@@ -538,7 +535,6 @@ code br {
 #search a b {
   color: #000;
 }
-
 #search .preamble {
   font-size: 14px;
   margin: 10px;
@@ -584,6 +580,31 @@ code br {
 #search .next_page {
   font-size: 14px;
 }
+#search_form .button {
+  background-image: url("data:image/svg+xml,%3C%3Fxml version=%221.0%22 encoding=%22UTF-8%22%3F%3E%0A%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2212%22 height=%2213%22%3E%0A%09%3Cg fill=%22none%22 stroke=%22%2354595d%22 stroke-width=%222%22%3E%0A%09%09%3Cpath d=%22M11.29 11.71l-4-4%22/%3E%0A%09%09%3Ccircle cx=%225%22 cy=%225%22 r=%224%22/%3E%0A%09%3C/g%3E%0A%3C/svg%3E%0A");
+  background-position: center center;
+  background-repeat: no-repeat;
+  width: 16px; height: 16px;
+  position: relative;
+  top: 3px;
+  display: inline-block;
+}
+#search_form input[type='text'] {
+  border-top: 0;
+  border-left: 0;
+  border-right: 0;
+  border-bottom: 1px solid #ddd;
+  padding-bottom: 3px;
+  font-size: 14px;
+  font-family: 'Trebuchet MS', sans-serif;
+  background: transparent;
+  outline: 0;
+  width: 300px;
+}
+#search_form input[type='text']:focus {
+  border-bottom: 1px solid #211;
+  color: #211;
+}
 
 #messages {
   width: 100%;
diff --git a/public/assets/js/lib/router.js b/public/assets/js/lib/router.js
index 95b0ac6..122822b 100644
--- a/public/assets/js/lib/router.js
+++ b/public/assets/js/lib/router.js
@@ -3,25 +3,26 @@ var SiteRouter = Router.extend({
 	el: "body",
 	
 	routes: {
-		"/":              'login',
-		"/index":         'index',
-		"/login":         'login',
-		"/details/:id":   'details',
-		"/post":          'post',
-		"/post/:keyword": 'post',
-		"/search":        'search',
-		"/mail":          'mailbox',
-		"/mail/:mailbox": 'mailbox',
-		"/mail/compose":  'compose',
-		"/message/:id":   'message',
+		"/":               'login',
+		"/index":          'index',
+		"/index/:keyword": 'index',
+		"/login":          'login',
+		"/details/:id":    'details',
+		"/post":           'post',
+		"/post/:keyword":  'post',
+		"/search":         'search',
+		"/mail":           'mailbox',
+		"/mail/:mailbox":  'mailbox',
+		"/mail/compose":   'compose',
+		"/message/:id":    'message',
 	},
 	
 	initialize: function(){
     this.route()
   },
   
-  index: function(){
-    app.view = new IndexView ()
+  index: function(keyword){
+    app.view = new IndexView (keyword)
   },
   
   login: function(){
diff --git a/views/pages/index.ejs b/views/pages/index.ejs
index 37f828e..ea9236a 100644
--- a/views/pages/index.ejs
+++ b/views/pages/index.ejs
@@ -1,25 +1,16 @@
 <% include ../partials/header %>
-<div class="subtitle">
-  <a href="/post">new post</a> |
-  <a href="/mail">inbox</a> |
-  <a href="/message">message</a> |
-  <a href="/profile">profile</a> |
-  <a href="/logout">logout</a>
-</div>
 
 <div id="content">
+  <% include ../partials/searchform %>
   <% include ../partials/threads %>
 </div>
 
 <div id="sidebar">
-  <div class="bluebox" id="searchbox">
+  <div class="bluebox">
     <b><big>welcome to bucky</big></b>
-
-    <form action="/search" method="get">
-      <input type="text" name="query" autofocus>
-      <button>SEARCH</button>
-    </form>
-
+    <a href="/mail">Inbox</a> |
+    <a href="/profile">Profile</a> |
+    <a href="/logout">Logout</a>
   </div>
 
   <span class="lastlog bluebox">
diff --git a/views/pages/search.ejs b/views/pages/search.ejs
index 0bf7819..3ee3f8e 100644
--- a/views/pages/search.ejs
+++ b/views/pages/search.ejs
@@ -1,12 +1,17 @@
 <% include ../partials/header %>
+<div class="subtitle">
+  <a href="/">&lt; Home</a> |
+  <a href="/post">New</a> |
+  <a href="/mail">Inbox</a> |
+  <a href="/message">Message</a> |
+  <a href="/profile">Profile</a> |
+  <a href="/logout">Logout</a>
+</div>
 
 <div id="content">
 
   <div id="search">
-    <form action="/search" method="get" style="margin: 10px;">
-      <input type="text" name="query" autofocus>
-      <button>SEARCH</button>
-    </form>
+    <% include ../partials/searchform %>
 
     <div id="results">
       <div class="preamble">
diff --git a/views/partials/searchform.ejs b/views/partials/searchform.ejs
new file mode 100644
index 0000000..be4bd97
--- /dev/null
+++ b/views/partials/searchform.ejs
@@ -0,0 +1,4 @@
+<form id="search_form" action="/search" method="get" style="margin: 10px;">
+  <div class='button'></div>
+  <input type="text" name="query" autofocus>
+</form>
diff --git a/views/partials/threads.ejs b/views/partials/threads.ejs
index 94a7a62..9711eff 100644
--- a/views/partials/threads.ejs
+++ b/views/partials/threads.ejs
@@ -28,7 +28,7 @@
       <td>
         <a href="/profile/{{username}}">{{username}}</a>&nbsp;{{privacy_dot}}
       </td>
-      <td class="{{color}}">
+      <td class="{{color}} title">
         <a href="/details/{{id}}">{{title}}</a>
       </td>
       <td class="{{date_class}}">
-- 
cgit v1.2.3-70-g09d2