split up partials and stub in mailbox frontend

10 files changed, 187 insertions, 114 deletions

diff --git a/views/pages/details.ejs b/views/pages/details.ejs
index 113ff53..769db9d 100644
--- a/views/pages/details.ejs
+++ b/views/pages/details.ejs
@@ -3,75 +3,19 @@
 <hr>
 
 <div id="details_rapper">
-  <div id="details">
-    <div class="left">
-      <table id="comments" width="450">
-        <script class="template" type="text/html">
-          <tr>
-            <td class="user">
-              <a href="/profile/{{username}}"><img src="//www.carbonpictures.com/bucky/data/profile/.thumb/al.{{username}}.jpg"></a><br>
-              <a href="/profile/{{username}}">{{username}}</a>
-            </td>
-            <td colspan="2" class="comment">
-              <div>
-                {{comment}}
-              </div>
-              <span class="date">
-                {{date}} {{time}}
-              </span>
-              <span class="edit-links">
-                <a href="/comment/{{id}}/edit">edit</a> &middot;
-                <a href="/comment/{{id}}/remove">remove</a> &middot;
-                <a href="/comment/{{id}}/reply">reply</a>
-              </span>
-            </td>
-          </tr>
-        </script>
-      </table>
-    </div>
+  <table id="details">
+    <tr>
+      <td class="left">
+        <% include ../partials/comments %>
+      </td>
   
-    <div class="right">
-      <div id="gallery">
-        <script class="template" type="text/html">
-          <div>
-            <a href="{{link}}"><img src="{{thumb}}"></a>
-            <br>(<a href="/profile/{{username}}">{{username}}</a>, {{age}})
-          </div>
-        </script>
-      </div>
-      <div id="audio"></div>
-  
-      <table id="files">
-        <script class="template" type="text/html">
-          <tr class="row">
-            <td>
-              <a href="{{link}}" class="file">{{filename}}</a>
-            </td>
-            <td class="{{date_class}}">
-              {{date}}
-            </td>
-            <td class="{{date_class}}">
-              {{time}}
-            </td>
-            <td>
-              {{size}}
-            </td>
-            <td class="user">
-              <a href="/profile/{{username}}">{{username}}</a>
-            </td>
-          </tr>
-        </script>
-        <script class="templateTotal" type="text/html">
-          <tr class="total">
-            <td colspan="5">
-              total size: <span class="{{size_class}}">{{size}}</span>
-            </td>
-          </tr>
-        </script>
-      </table>
-    </div>
-
-  </div>
+      <td class="right">
+        <% include ../partials/gallery %>
+        <% include ../partials/files %>
+        <% include ../partials/threads %>
+      </td>
+    </tr>
+  </table>
 </div>
 
 
diff --git a/views/pages/index.ejs b/views/pages/index.ejs
index 82ef8ab..454e358 100644
--- a/views/pages/index.ejs
+++ b/views/pages/index.ejs
@@ -12,55 +12,11 @@
       <button>SEARCH</button>
     </form>
   </div>
-  <div class="bluebox" id="hootbox">
-    <form>
-      <input type="text" name="hoot">
-      <button><%= hoot_text %></button>
-    </form>
-    <table id="hoots">
-      <script class="template" type="text/html">
-        <tr>
-          <td style="background-image:url(//www.carbonpictures.com/bucky/data/profile/.thumb/am.{{username}}.jpg)"><a href="/profile/{{username}}"><div></div></a></td>
-          <td>
-            {{comment}}
-          </td>
-        </tr>
-      </script>
-    </table>
-  </div>
+  <% include ../partials/hootbox %>
 </div>
 
 <div id="content">
-
-  <table class="threads">
-    <script class="template" type="text/html">
-      <tr>
-        <td>
-          <a href="/profile/{{username}}">{{username}}</a>
-          {{privacy_dot}}
-        </td>
-        <td class="{{color}}">
-          <a href="/details/{{id}}">{{title}}</a>
-        </td>
-        <td class="{{date_class}}">
-          {{date}} <small>{{time}}</small>
-        </td>
-        <td class="{{views_class}}">
-          {{views}}
-        </td>
-        <td class="{{comments_class}}">
-          {{comments}}
-        </td>
-        <td class="{{show_files}}">
-          <span class="size">
-            <span class="{{size_class}}">{{size}}</span>
-            in
-          </span>
-          <span class="{{files_class}}">{{files}}</span>
-        </td>
-      </tr>
-    </script>
-  </table>
+  <% include ../partials/threads %>
 </div>
 
 <% include ../partials/footer %>
diff --git a/views/pages/mailbox.ejs b/views/pages/mailbox.ejs
new file mode 100644
index 0000000..d97755a
--- /dev/null
+++ b/views/pages/mailbox.ejs
@@ -0,0 +1,53 @@
+<% include ../partials/header %>
+
+<hr>
+
+<div id="sidebar">
+  <div class="bluebox">
+    <b><big>message center</big></b>
+  </div>
+  <div class="bluebox" id="boxes">
+    <table>
+      <tr>
+        <th>Folders</th>
+        <td>msgs</td>
+      </tr>
+    </table>
+    <script type="text/html" class="boxTemplate">
+      <tr>
+        <td><a href="/mail/{{box}}">{{box}}</a></td>
+        <td>{{count}}</td>
+      </tr>
+    </script>
+  </div>
+</div>
+
+<div id="content">
+
+  <table class="messages">
+    <script class="template" type="text/html">
+      <tr>
+        <td>
+          <a href="/profile/{{username}}">{{username}}</a>
+          {{privacy_dot}}
+        </td>
+        <td>
+          <a href="/mail/read/{{id}}">{{subject}}</a>
+        </td>
+        <td class="{{date_class}}">
+          {{date}} <small>{{time}}</small>
+        </td>
+        <td>
+          <span class="{{size_class}}">{{size}}</span>
+        </td>
+        <td>
+          [reply]
+          [delete]
+        </td>
+      </tr>
+    </script>
+  </table>
+
+</div>
+
+<% include ../partials/footer %>
diff --git a/views/pages/message.ejs b/views/pages/message.ejs
new file mode 100644
index 0000000..e69de29
--- /dev/null
+++ b/views/pages/message.ejs
diff --git a/views/partials/comments.ejs b/views/partials/comments.ejs
new file mode 100644
index 0000000..97d4cea
--- /dev/null
+++ b/views/partials/comments.ejs
@@ -0,0 +1,23 @@
+<table id="comments" width="450">
+  <script class="template" type="text/html">
+    <tr>
+      <td class="user">
+        <a href="/profile/{{username}}"><img src="//www.carbonpictures.com/bucky/data/profile/.thumb/al.{{username}}.jpg"></a><br>
+        <a href="/profile/{{username}}">{{username}}</a>
+      </td>
+      <td colspan="2" class="comment">
+        <div>
+          {{comment}}
+        </div>
+        <span class="date">
+          {{date}} {{time}}
+        </span>
+        <span class="edit-links">
+          <a href="/comment/{{id}}/edit">edit</a> &middot;
+          <a href="/comment/{{id}}/remove">remove</a> &middot;
+          <a href="/comment/{{id}}/reply">reply</a>
+        </span>
+      </td>
+    </tr>
+  </script>
+</table>
\ No newline at end of file
diff --git a/views/partials/files.ejs b/views/partials/files.ejs
new file mode 100644
index 0000000..d72dcdc
--- /dev/null
+++ b/views/partials/files.ejs
@@ -0,0 +1,29 @@
+<div id="audio"></div>
+<table id="files">
+  <script class="template" type="text/html">
+    <tr class="row">
+      <td>
+        <a href="{{link}}" class="file">{{filename}}</a>
+      </td>
+      <td class="{{date_class}}">
+        {{date}}
+      </td>
+      <td class="{{date_class}}">
+        {{time}}
+      </td>
+      <td>
+        {{size}}
+      </td>
+      <td class="user">
+        <a href="/profile/{{username}}">{{username}}</a>
+      </td>
+    </tr>
+  </script>
+  <script class="templateTotal" type="text/html">
+    <tr class="total">
+      <td colspan="5">
+        total size: <span class="{{size_class}}">{{size}}</span>
+      </td>
+    </tr>
+  </script>
+</table>
diff --git a/views/partials/gallery.ejs b/views/partials/gallery.ejs
new file mode 100644
index 0000000..8fac271
--- /dev/null
+++ b/views/partials/gallery.ejs
@@ -0,0 +1,8 @@
+<div id="gallery">
+  <script class="template" type="text/html">
+    <div>
+      <a href="{{link}}"><img src="{{thumb}}"></a>
+      <br>(<a href="/profile/{{username}}">{{username}}</a>, {{age}})
+    </div>
+  </script>
+</div>
\ No newline at end of file
diff --git a/views/partials/hootbox.ejs b/views/partials/hootbox.ejs
new file mode 100644
index 0000000..c65d264
--- /dev/null
+++ b/views/partials/hootbox.ejs
@@ -0,0 +1,16 @@
+<div class="bluebox" id="hootbox">
+  <form>
+    <input type="text" name="hoot">
+    <button><%= hoot_text %></button>
+  </form>
+  <table id="hoots">
+    <script class="template" type="text/html">
+      <tr>
+        <td style="background-image:url(//www.carbonpictures.com/bucky/data/profile/.thumb/am.{{username}}.jpg)"><a href="/profile/{{username}}"><div></div></a></td>
+        <td>
+          {{comment}}
+        </td>
+      </tr>
+    </script>
+  </table>
+</div>
\ No newline at end of file
diff --git a/views/partials/scripts.ejs b/views/partials/scripts.ejs
index b773598..da76d88 100644
--- a/views/partials/scripts.ejs
+++ b/views/partials/scripts.ejs
@@ -25,4 +25,7 @@
 <script src="/assets/js/lib/views/details/files.js"></script>
 <script src="/assets/js/lib/views/details/gallery.js"></script>
 
+<script src="/assets/js/lib/views/mail/mailbox.js"></script>
+<script src="/assets/js/lib/views/mail/message.js"></script>
+
 <script src="/assets/js/index.js"></script>
diff --git a/views/partials/threads.ejs b/views/partials/threads.ejs
new file mode 100644
index 0000000..8fb52ac
--- /dev/null
+++ b/views/partials/threads.ejs
@@ -0,0 +1,41 @@
+
+<table class="threads">
+  <script class="keywordTemplate" type="text/html">
+    <tr>
+      <th>
+        <b>{{keyword}}</b>
+        &middot;
+      </th>
+      <th>
+        <a href="/post/{{keyword}}">post</a>
+      </th>
+    </tr>
+  </script>
+  <script class="template" type="text/html">
+    <tr>
+      <td>
+        <a href="/profile/{{username}}">{{username}}</a>
+        {{privacy_dot}}
+      </td>
+      <td class="{{color}}">
+        <a href="/details/{{id}}">{{title}}</a>
+      </td>
+      <td class="{{date_class}}">
+        {{date}} <small>{{time}}</small>
+      </td>
+      <td class="{{views_class}}">
+        {{views}}
+      </td>
+      <td class="{{comments_class}}">
+        {{comments}}
+      </td>
+      <td class="{{show_files}}">
+        <span class="size">
+          <span class="{{size_class}}">{{size}}</span>
+          in
+        </span>
+        <span class="{{files_class}}">{{files}}</span>
+      </td>
+    </tr>
+  </script>
+</table>