Redesign and consolidate.

diff --git a/src/main/resources/static/css/sone.css b/src/main/resources/static/css/sone.css
index ef6b0d7..919b033 100644 (file)
--- a/src/main/resources/static/css/sone.css
+++ b/src/main/resources/static/css/sone.css
@@ -31,9 +31,8 @@
        color: rgb(255, 172, 0);
 }
 
-#sone #sidebar {
-       width: 200px;
-       position: absolute;
+#sone #profile {
+       height: 80px;
 }
 
 #sone .profile-link {
@@ -68,8 +67,7 @@
 }
 
 #sone #main {
-       margin-left: 200px;
-       padding-left: 1em;
+       padding: 1em;
 }
 
 #sone .post {
@@ -89,6 +87,7 @@
 
 #sone .post .status-line {
        clear: both;
+       margin-top: 0.5ex;
        font-size: 85%;
 }
 
@@ -242,6 +241,6 @@
        font-weight: bold;
 }
 
-#sone input.createpost.default, input.reply-input.default {
+#sone input.status-input.default, input.reply-input.default {
        color: #888;
 }

diff --git a/src/main/resources/static/javascript/sone.js b/src/main/resources/static/javascript/sone.js
index 44cff7c..97c3da5 100644 (file)
--- a/src/main/resources/static/javascript/sone.js
+++ b/src/main/resources/static/javascript/sone.js
@@ -16,3 +16,32 @@ function registerInputTextareaSwap(inputSelector, defaultText) {
                }
        });
 }
+
+/* hide all the “create reply” forms until a link is clicked. */
+function addCommentLinks() {
+       $("#sone .post").each(function() {
+               postId = $(this).attr("id");
+               commentElement = (function(postId) {
+                       var commentElement = $("<div>Comment</div>").addClass("show-reply-form").click(function() {
+                               replyElement = $("#sone .post#" + postId + " .create-reply");
+                               replyElement.removeClass("hidden");
+                               replyElement.removeClass("light");
+                               (function(replyElement) {
+                                       replyElement.find("input.reply-input").blur(function() {
+                                               if ($(this).hasClass("default")) {
+                                                       replyElement.addClass("light");
+                                               }
+                                       }).focus(function() {
+                                               replyElement.removeClass("light");
+                                       });
+                               })(replyElement);
+                               replyElement.find("input.reply-input").focus();
+                       });
+                       return commentElement;
+               })(postId);
+               $(this).find(".create-reply").addClass("hidden");
+               $(this).find(".status-line .time").each(function() {
+                       $(this).after(commentElement.clone(true));
+               });
+       });
+}

diff --git a/src/main/resources/templates/include/head.html b/src/main/resources/templates/include/head.html
index 9b27cc7..b1d01bc 100644 (file)
--- a/src/main/resources/templates/include/head.html
+++ b/src/main/resources/templates/include/head.html
@@ -3,17 +3,19 @@
        <script src="javascript/jquery-1.4.2.js" language="javascript"></script>
        <script src="javascript/sone.js" language="javascript"></script>
 
-       <div id="sidebar">
+       <script language="javascript">
+               $(document).ready(function() {
+                       registerInputTextareaSwap("#sone #update-status .status-input", "What are you doing?");
+               });
+       </script>
+
+       <div id="main">
 
                <div id="profile" class="<%ifnull currentSone>offline<%else>online<%/if>">
                        <div class="picture"></div>
                        <div class="nice-name profile-link"><a href="viewSone.html?sone=<% currentSone.id>"><% currentSone.niceName|html></a></div>
                        <div class="edit-profile-link"><a href="editProfile.html"><%= View.Head.ProfileLink.Text|l10n|html></a></div>
+                       <%ifnull ! currentSone>
+                               <%include include/updateStatus.html>
+                       <%/if>
                </div>
-
-               <div id="links">
-               </div>
-
-       </div>
-
-       <div id="main">

diff --git a/src/main/resources/templates/include/updateStatus.html b/src/main/resources/templates/include/updateStatus.html
new file mode 100644 (file)
index 0000000..129c526
--- /dev/null
+++ b/src/main/resources/templates/include/updateStatus.html
@@ -0,0 +1,8 @@
+<div id="update-status">
+       <form action="createPost.html" method="post">
+               <input type="hidden" name="formPassword" value="<% formPassword|html>" />
+               <label for="text"><%= Page.Index.Label.Text|l10n|html></label>
+               <input class="status-input" name="text" />
+               <button type="submit"><%= Page.Index.Button.Post|l10n|html></button>
+       </form>
+</div>

diff --git a/src/main/resources/templates/index.html b/src/main/resources/templates/index.html
index c4c251a..3f9dc57 100644 (file)
--- a/src/main/resources/templates/index.html
+++ b/src/main/resources/templates/index.html
@@ -3,52 +3,11 @@
        <script language="javascript">
                /* register input field/textarea swap. */
                $(document).ready(function() {
-                       registerInputTextareaSwap("#sone input.createpost", "What are you doing?");
                        registerInputTextareaSwap("#sone input.reply-input", "Write a Reply…");
-
-                       /* hide all the “create reply” forms until a link is clicked. */
-                       $("#sone .post").each(function() {
-                               postId = $(this).attr("id");
-                               commentElement = (function(postId) {
-                                       var commentElement = $("<div>Comment</div>").addClass("show-reply-form").click(function() {
-                                               replyElement = $("#sone .post#" + postId + " .create-reply");
-                                               replyElement.removeClass("hidden");
-                                               replyElement.removeClass("light");
-                                               (function(replyElement) {
-                                                       replyElement.find("input.reply-input").blur(function() {
-                                                               if ($(this).hasClass("default")) {
-                                                                       replyElement.addClass("light");
-                                                               }
-                                                       }).focus(function() {
-                                                               replyElement.removeClass("light");
-                                                       });
-                                               })(replyElement);
-                                               replyElement.find("input.reply-input").focus();
-                                       });
-                                       return commentElement;
-                               })(postId);
-                               $(this).find(".create-reply").addClass("hidden");
-                               $(this).find(".status-line .time").each(function() {
-                                       $(this).after(commentElement.clone(true));
-                               });
-                       });
+                       addCommentLinks();
                });
        </script>
 
-       <h1><%= Page.Index.Page.Title|l10n|insert needle="{sone}" key=currentSone.name|html></h1>
-
-       <div>
-               <form action="createPost.html" method="post">
-                       <div>
-                               <label for="text"><%= Page.Index.Label.Text|l10n|html></label>
-                               <input class="createpost" name="text" />
-                       </div>
-                       <div>
-                               <button type="submit"><%= Page.Index.Button.Post|l10n|html></button>
-                       </div>
-               </form>
-       </div>
-
        <h1><%= Page.Index.PostList.Title|l10n|html></h1>
 
        <div id="posts">