You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@roller.apache.org by sn...@apache.org on 2016/05/27 22:50:46 UTC

[24/47] roller git commit: Comment management page done.

Comment management page done.


Project: http://git-wip-us.apache.org/repos/asf/roller/repo
Commit: http://git-wip-us.apache.org/repos/asf/roller/commit/a5ec43be
Tree: http://git-wip-us.apache.org/repos/asf/roller/tree/a5ec43be
Diff: http://git-wip-us.apache.org/repos/asf/roller/diff/a5ec43be

Branch: refs/heads/bootstrap-ui
Commit: a5ec43bea47baf3fe4f179644f1b0ca83ec3ed45
Parents: f73f35a
Author: Dave Johnson <sn...@apache.org>
Authored: Wed Dec 23 11:27:14 2015 -0500
Committer: Dave Johnson <sn...@apache.org>
Committed: Wed Dec 23 11:27:14 2015 -0500

----------------------------------------------------------------------
 .../webapp/WEB-INF/jsps/editor/Comments.jsp     | 484 ++++++++++---------
 .../WEB-INF/jsps/editor/CommentsSidebar.jsp     | 153 +++---
 .../main/webapp/WEB-INF/jsps/editor/Entries.jsp |   3 -
 .../WEB-INF/jsps/editor/EntriesSidebar.jsp      | 207 ++++----
 app/src/main/webapp/roller-ui/styles/roller.css |  45 ++
 5 files changed, 479 insertions(+), 413 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/roller/blob/a5ec43be/app/src/main/webapp/WEB-INF/jsps/editor/Comments.jsp
----------------------------------------------------------------------
diff --git a/app/src/main/webapp/WEB-INF/jsps/editor/Comments.jsp b/app/src/main/webapp/WEB-INF/jsps/editor/Comments.jsp
index 41543cb..e950843 100644
--- a/app/src/main/webapp/WEB-INF/jsps/editor/Comments.jsp
+++ b/app/src/main/webapp/WEB-INF/jsps/editor/Comments.jsp
@@ -19,6 +19,7 @@
 <%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
 <script src="<s:url value="/roller-ui/scripts/jquery-2.1.1.min.js" />"></script>
 
+<%-- are we on a blog's comment management page or the global admin's comment management page? --%>
 <s:if test="actionName == 'comments'">
     <s:set var="mainAction">comments</s:set>
 </s:if>
@@ -26,36 +27,6 @@
     <s:set var="mainAction">globalCommentManagement</s:set>
 </s:else>
 
-<script>
-<s:if test="pager.items != null">
-    $(document).ready(function(){
-        $('#checkallapproved').click(function() {
-            toggleFunction(true,"bean.approvedComments");
-        });
-        $('#clearallapproved').click(function() {
-            toggleFunction(false,"bean.approvedComments");
-        });
-        $('#checkallspam').click(function() {
-            toggleFunction(true,"bean.spamComments");
-        });
-        $('#clearallspam').click(function() {
-            toggleFunction(false,"bean.spamComments");
-        });
-        $('#checkalldelete').click(function() {
-            toggleFunction(true,"bean.deleteComments");
-        });
-        $('#clearalldelete').click(function() {
-            toggleFunction(false,"bean.deleteComments");
-        });
-    });
-</s:if>
-    function bulkDelete() {
-        if (window.confirm('<s:text name="commentManagement.confirmBulkDelete"><s:param value="bulkDeleteCount" /></s:text>')) {
-            document.commentQueryForm.method.value = "bulkDelete";
-            document.commentQueryForm.submit();
-        }
-    }
-</script>
 
 <p class="subtitle">
     <s:if test="actionName == 'comments'">
@@ -71,306 +42,372 @@
         </s:else>
     </s:if>
     <s:else>
-        <s:text name="commentManagement.subtitle" />
+        <s:text name="commentManagement.subtitle"/>
     </s:else>
 </p>
 
 <s:if test="pager.items.isEmpty">
-    <s:text name="commentManagement.noCommentsFound" />
+    <s:text name="commentManagement.noCommentsFound"/>
 </s:if>
 <s:else>
     <p class="pagetip">
         <s:if test="actionName == 'comments'">
-            <s:text name="commentManagement.tip" />
+            <s:text name="commentManagement.tip"/>
         </s:if>
         <s:else>
-            <s:text name="commentManagement.globalTip" />
+            <s:text name="commentManagement.globalTip"/>
         </s:else>
     </p>
 
-<%-- ============================================================= --%>
-<%-- Comment table / form with checkboxes --%>
-<%-- ============================================================= --%>
+    <%-- ============================================================= --%>
+    <%-- Comment table / form with checkboxes --%>
 
-<s:form action="%{#mainAction}!update">
-    <s:hidden name="salt" />
-    <s:hidden name="bean.ids" />
-    <s:hidden name="bean.startDateString" />
-    <s:hidden name="bean.endDateString" />
-    <s:if test="actionName == 'comments'">
-        <s:hidden name="bean.entryId" />
-        <s:hidden name="bean.searchString" />
-        <s:hidden name="bean.approvedString" />
-        <s:hidden name="weblog" />
-    </s:if>
-    <s:else>
-        <s:hidden name="bean.offset" />
-        <s:hidden name="bean.count" />
-        <s:hidden name="bean.pendingString" />
-    </s:else>
+    <s:form action="%{#mainAction}!update">
+        <s:hidden name="salt"/>
+        <s:hidden name="bean.ids"/>
+        <s:hidden name="bean.startDateString"/>
+        <s:hidden name="bean.endDateString"/>
+        <s:if test="actionName == 'comments'">
+            <s:hidden name="bean.entryId"/>
+            <s:hidden name="bean.searchString"/>
+            <s:hidden name="bean.approvedString"/>
+            <s:hidden name="weblog"/>
+        </s:if>
+        <s:else>
+            <s:hidden name="bean.offset"/>
+            <s:hidden name="bean.count"/>
+            <s:hidden name="bean.pendingString"/>
+        </s:else>
 
 
-<%-- ============================================================= --%>
-<%-- Number of comments and date message --%>
-<%-- ============================================================= --%>
+        <%-- ============================================================= --%>
+        <%-- Number of comments and date message --%>
 
         <div class="tablenav">
 
             <div style="float:left;">
                 <s:text name="commentManagement.nowShowing">
-                    <s:param value="pager.items.size()" />
+                    <s:param value="pager.items.size()"/>
                 </s:text>
             </div>
             <div style="float:right;">
                 <s:if test="firstComment.postTime != null">
                     <s:text name="commentManagement.date.toStringFormat">
-                        <s:param value="firstComment.postTime" />
+                        <s:param value="firstComment.postTime"/>
                     </s:text>
                 </s:if>
                 ---
                 <s:if test="lastComment.postTime != null">
                     <s:text name="commentManagement.date.toStringFormat">
-                        <s:param value="lastComment.postTime" />
+                        <s:param value="lastComment.postTime"/>
                     </s:text>
                 </s:if>
             </div>
-            <br />
+            <br/>
 
 
-    <%-- ============================================================= --%>
-    <%-- Next / previous links --%>
-    <%-- ============================================================= --%>
+                <%-- ============================================================= --%>
+                <%-- Next / previous links --%>
 
-            <s:if test="pager.prevLink != null && pager.nextLink != null">
-                <br /><center>
-                    &laquo;
-                    <a href='<s:property value="pager.prevLink" />'>
-                    <s:text name="commentManagement.prev" /></a>
-                    | <a href='<s:property value="pager.nextLink" />'>
-                    <s:text name="commentManagement.next" /></a>
-                    &raquo;
-                </center><br />
-            </s:if>
-            <s:elseif test="pager.prevLink != null">
-                <br /><center>
-                    &laquo;
-                    <a href='<s:property value="pager.prevLink" />'>
-                    <s:text name="commentManagement.prev" /></a>
-                    | <s:text name="commentManagement.next" />
-                    &raquo;
-                </center><br />
-            </s:elseif>
-            <s:elseif test="pager.nextLink != null">
-                <br /><center>
-                    &laquo;
-                    <s:text name="commentManagement.prev" />
-                    | <a class="" href='<s:property value="pager.nextLink" />'>
-                    <s:text name="commentManagement.next" /></a>
-                    &raquo;
-                </center><br />
-            </s:elseif>
-            <s:else><br /></s:else>
+            <nav>
+                <ul class="pager">
+                    <s:if test="pager.prevLink != null">
+                        <li class="previous">
+                            <a href='<s:property value="pager.prevLink" />'>
+                                <span aria-hidden="true">&larr;</span>Newer</a>
+                        </li>
+                    </s:if>
+                    <s:if test="pager.nextLink != null">
+                        <li class="next">
+                            <a href='<s:property value="pager.nextLink"/>'>Older
+                                <span aria-hidden="true">&rarr;</span></a>
+                        </li>
+                    </s:if>
+                </ul>
+            </nav>
 
         </div> <%-- class="tablenav" --%>
 
 
-<%-- ============================================================= --%>
-<%-- Bulk comment delete link --%>
-<%-- ============================================================= --%>
+        <%-- ============================================================= --%>
+        <%-- Bulk comment delete link --%>
+        <%-- ============================================================= --%>
 
         <s:if test="bulkDeleteCount > 0">
             <p>
                 <s:text name="commentManagement.bulkDeletePrompt1">
-                    <s:param value="bulkDeleteCount" />
+                    <s:param value="bulkDeleteCount"/>
                 </s:text>
                 <a href="#" onclick="bulkDelete()">
-                    <s:text name="commentManagement.bulkDeletePrompt2" />
+                    <s:text name="commentManagement.bulkDeletePrompt2"/>
                 </a>
             </p>
         </s:if>
 
+        <table class="rollertable table table-striped" width="100%">
 
-        <table class="rollertable" width="100%">
-
-            <%-- ======================================================== --%>
-            <%-- Comment table header --%>
+                <%-- ======================================================== --%>
+                <%-- Comment table header --%>
 
             <tr>
                 <s:if test="actionName == 'comments'">
                     <th class="rollertable" width="5%">
-                        <s:text name="commentManagement.columnApproved" />
+                        <s:text name="commentManagement.columnApproved"/>
                     </th>
                 </s:if>
                 <th class="rollertable" width="5%">
-                    <s:text name="commentManagement.columnSpam" />
+                    <s:text name="commentManagement.columnSpam"/>
                 </th>
-                <th class="rollertable" width="5%" >
-                    <s:text name="generic.delete" />
+                <th class="rollertable" width="5%">
+                    <s:text name="generic.delete"/>
                 </th>
                 <th class="rollertable">
-                    <s:text name="commentManagement.columnComment" />
+                    <s:text name="commentManagement.columnComment"/>
                 </th>
             </tr>
 
-            <%-- ======================================================== --%>
-            <%-- Select ALL and NONE buttons --%>
+                <%-- ======================================================== --%>
+                <%-- Select ALL and NONE buttons --%>
 
             <tr class="actionrow">
                 <s:if test="actionName == 'comments'">
                     <td align="center">
-                        <s:text name="commentManagement.select" /><br/>
+                        <s:text name="commentManagement.select"/><br/>
 
-                        <span id="checkallapproved"><a href="#"><s:text name="generic.all" /></a></span><br />
-                        <span id="clearallapproved"><a href="#"><s:text name="generic.none" /></a></span>
+                        <span id="checkallapproved"><a href="#"><s:text name="generic.all"/></a></span><br/>
+                        <span id="clearallapproved"><a href="#"><s:text name="generic.none"/></a></span>
                     </td>
                 </s:if>
                 <td align="center">
-                    <s:text name="commentManagement.select" /><br/>
+                    <s:text name="commentManagement.select"/><br/>
 
-                    <span id="checkallspam"><a href="#"><s:text name="generic.all" /></a></span><br />
-                    <span id="clearallspam"><a href="#"><s:text name="generic.none" /></a></span>
+                    <span id="checkallspam"><a href="#"><s:text name="generic.all"/></a></span><br/>
+                    <span id="clearallspam"><a href="#"><s:text name="generic.none"/></a></span>
                 </td>
                 <td align="center">
-                    <s:text name="commentManagement.select" /><br/>
+                    <s:text name="commentManagement.select"/><br/>
 
-                    <span id="checkalldelete"><a href="#"><s:text name="generic.all" /></a></span><br />
-                    <span id="clearalldelete"><a href="#"><s:text name="generic.none" /></a></span>
+                    <span id="checkalldelete"><a href="#"><s:text name="generic.all"/></a></span><br/>
+                    <span id="clearalldelete"><a href="#"><s:text name="generic.none"/></a></span>
                 </td>
                 <td align="right">
-                    <br />
+                    <br/>
                     <span class="pendingCommentBox">&nbsp;&nbsp;&nbsp;&nbsp;</span>
-                    <s:text name="commentManagement.pending" />&nbsp;&nbsp;
+                    <s:text name="commentManagement.pending"/>&nbsp;&nbsp;
                     <span class="spamCommentBox">&nbsp;&nbsp;&nbsp;&nbsp;</span>
-                    <s:text name="commentManagement.spam" />&nbsp;&nbsp;
+                    <s:text name="commentManagement.spam"/>&nbsp;&nbsp;
                 </td>
             </tr>
 
 
-            <%-- ========================================================= --%>
-<%-- Loop through comments --%>
-<%-- ========================================================= --%>
+                <%-- ========================================================= --%>
+                <%-- Loop through comments --%>
+
+                <%-- it is a bit funky to use checkbox list here, but using checkbox didn't work for me :( 
+                we are effectively just creating a checkbox list of 1 item for each iteration of our collection. --%>
 
             <s:iterator id="comment" value="pager.items" status="rowstatus">
                 <tr>
                     <s:if test="actionName == 'comments'">
+                        <%-- only blog admins (not the global admin) can approve blog comments --%>
                         <td>
-                            <%-- a bit funky to use checkbox list here, but using checkbox didn't work for me :(
-                 we are effectively just creating a checkbox list of 1 item for each iteration of our collection --%>
-                            <s:checkboxlist name="bean.approvedComments" list="{#comment}" listKey="id" listValue="name" />
+                            <s:checkboxlist name="bean.approvedComments" theme="simple" cssClass="comment-select"
+                                            list="{#comment}" listKey="id" listValue="name"/>
                         </td>
                     </s:if>
                     <td>
-                        <%-- a bit funky to use checkbox list here, but using checkbox didn't work for me :(
-             we are effectively just creating a checkbox list of 1 item for each iteration of our collection --%>
-                        <s:checkboxlist name="bean.spamComments" list="{#comment}" listKey="id" listValue="name" />
+                        <s:checkboxlist name="bean.spamComments" label="" theme="simple" cssClass="comment-select" 
+                                        list="{#comment}" listKey="id" listValue="name"/>
                     </td>
                     <td>
-                        <%-- a bit funky to use checkbox list here, but using checkbox didn't work for me :(
-             we are effectively just creating a checkbox list of 1 item for each iteration of our collection --%>
-                        <s:checkboxlist name="bean.deleteComments" list="{#comment}" listKey="id" listValue="name" />
+                        <s:checkboxlist name="bean.deleteComments" label="" theme="simple" cssClass="comment-select" 
+                                        list="{#comment}" listKey="id" listValue="name"/>
                     </td>
 
-                    <%-- ======================================================== --%>
-    <%-- Display comment details and text --%>
+                        <%-- ======================================================== --%>
+                        <%-- Display comment details and text --%>
 
-    <%-- <td> with style if comment is spam or pending --%>
+                        <%-- <td> with style if comment is spam or pending --%>
                     <s:if test="#comment.status.name() == 'SPAM'">
-                        <td class="spamcomment">
-                    </s:if>
-                    <s:elseif test="#comment.status.name() == 'PENDING'">
-                        <td class="pendingcomment">
-                    </s:elseif>
-                    <s:else>
-                        <td>
-                    </s:else>
+                    <td class="spamcomment">
+                        </s:if>
+                        <s:elseif test="#comment.status.name() == 'PENDING'">
+                    <td class="pendingcomment">
+                        </s:elseif>
+                        <s:else>
+                    <td>
+                        </s:else>
 
-                        <%-- comment details table in table --%>
-                        <table class="innertable" >
+                            <%-- comment details table in table --%>
+                        <table class="innertable">
                             <tr>
                                 <td class="viewbody">
-                                <div class="viewdetails bot">
-                                    <div class="details">
-                                        <s:text name="commentManagement.entryTitled" />&nbsp;:&nbsp;
-                                        <a href='<s:property value="#comment.weblogEntry.permalink" />'>
-                                        <s:property value="#comment.weblogEntry.title" /></a>
-                                    </div>
-                                    <div class="details">
-                                        <s:text name="commentManagement.commentBy" />&nbsp;:&nbsp;
-                                        <s:if test="#comment.email != null && #comment.name != null">
-                                        <s:text name="commentManagement.commentByBoth" >
-                                            <s:param><s:property value="#comment.name" /></s:param>
-                                            <s:param><s:property value="#comment.email" /></s:param>
-                                            <s:param><s:property value="#comment.email" /></s:param>
-                                            <s:param><s:property value="#comment.remoteHost" /></s:param>
-                                        </s:text>
+
+                                    <div class="viewdetails bot">
+
+                                        <div class="details">
+                                            <s:text name="commentManagement.entryTitled"/>&nbsp;:&nbsp;
+                                            <a href='<s:property value="#comment.weblogEntry.permalink" />'>
+                                                <s:property value="#comment.weblogEntry.title"/></a>
+                                        </div>
+
+                                        <div class="details">
+                                            <s:text name="commentManagement.commentBy"/>&nbsp;:&nbsp;
+                                            <s:if test="#comment.email != null && #comment.name != null">
+                                                <s:text name="commentManagement.commentByBoth">
+                                                    <s:param><s:property value="#comment.name"/></s:param>
+                                                    <s:param><s:property value="#comment.email"/></s:param>
+                                                    <s:param><s:property value="#comment.email"/></s:param>
+                                                    <s:param><s:property value="#comment.remoteHost"/></s:param>
+                                                </s:text>
+                                            </s:if>
+                                            <s:elseif test="#comment.email == null && #comment.name == null">
+                                                <s:text name="commentManagement.commentByIP">
+                                                    <s:param><s:property value="#comment.remoteHost"/></s:param>
+                                                </s:text>
+                                            </s:elseif>
+                                            <s:else>
+                                                <s:text name="commentManagement.commentByName">
+                                                    <s:param><s:property value="#comment.name"/></s:param>
+                                                    <s:param><s:property value="#comment.remoteHost"/></s:param>
+                                                </s:text>
+                                            </s:else>
+                                        </div>
+
+                                        <s:if test="#comment.url != null && !#comment.url.equals('')">
+                                            <div class="details">
+                                                <s:text name="commentManagement.commentByURL"/>&nbsp;:&nbsp;
+                                                <a href='<s:property value="#comment.url" />'>
+                                                    <str:truncateNicely upper="60" appendToEnd="..."><s:property
+                                                            value="#comment.url"/></str:truncateNicely></a>
+                                            </div>
                                         </s:if>
-                                        <s:elseif test="#comment.email == null && #comment.name == null">
-                                            <s:text name="commentManagement.commentByIP" >
-                                                <s:param><s:property value="#comment.remoteHost" /></s:param>
-                                            </s:text>
-                                        </s:elseif>
-                                        <s:else>
-                                            <s:text name="commentManagement.commentByName" >
-                                                <s:param><s:property value="#comment.name" /></s:param>
-                                                <s:param><s:property value="#comment.remoteHost" /></s:param>
-                                            </s:text>
-                                        </s:else>
-                                    </div>
-                                    <s:if test="#comment.url != null && !#comment.url.equals('')">
+
                                         <div class="details">
-                                            <s:text name="commentManagement.commentByURL" />&nbsp;:&nbsp;
-                                            <a href='<s:property value="#comment.url" />'>
-                                            <str:truncateNicely upper="60" appendToEnd="..."><s:property value="#comment.url" /></str:truncateNicely></a>
+                                            <s:text name="commentManagement.postTime"/>&nbsp;:&nbsp;
+                                            <s:date name="#comment.postTime"/>
                                         </div>
-                                    </s:if>
-                                    <div class="details">
-                                        <s:text name="commentManagement.postTime" />&nbsp;:&nbsp;
-                                        <s:date name="#comment.postTime"/>
+
                                     </div>
-                                </div>
-                                <div class="viewdetails bot">
-                                     <div class="details bot">
-                                          <s:if test="#comment.content.length() > 1000">
-                                               <div class="bot" id="comment-<s:property value="#comment.id"/>">
-                                                   <str:truncateNicely upper="1000" appendToEnd="...">
-                                                       <s:property value="#comment.content" escape="true" />
-                                                   </str:truncateNicely>
-                                               </div>
-                                               <div id="link-<s:property value="#comment.id"/>">
-                                                    <a onclick='readMoreComment("<s:property value="#comment.id"/>")'><s:text name="commentManagement.readmore" /></a>
-                                               </div>
-                                          </s:if>
-                                          <s:else>
-                                               <span width="200px" id="comment-<s:property value="#comment.id"/>"><s:property value="#comment.content" escape="true" /></span>
-                                          </s:else>
-                                     </div>
-                                     <s:if test="actionName == 'comments'">
-                                         <div class="details">
-                                              <a id="editlink-<s:property value="#comment.id"/>" onclick='editComment("<s:property value="#comment.id"/>")'>
-                                                   <s:text name="generic.edit" />
-                                              </a>
-                                         </div>
-                                         <div class="details">
-                                              <span id="savelink-<s:property value="#comment.id"/>" style="display: none">
-                                                   <a onclick='saveComment("<s:property value="#comment.id"/>")'><s:text name="generic.save" /></a> &nbsp;|&nbsp;
+
+                                    <div class="viewdetails bot">
+
+                                        <div class="details bot">
+
+                                            <s:if test="#comment.content.length() > 1000">
+                                                <div class="bot" id="comment-<s:property value="#comment.id"/>">
+                                                    <str:truncateNicely upper="1000" appendToEnd="...">
+                                                        <s:property value="#comment.content" escape="true"/>
+                                                    </str:truncateNicely>
+                                                </div>
+                                                <div id="link-<s:property value="#comment.id"/>">
+                                                    <a onclick='readMoreComment("<s:property
+                                                            value="#comment.id"/>")'><s:text
+                                                            name="commentManagement.readmore"/></a>
+                                                </div>
+                                            </s:if>
+                                            <s:else>
+                                                <span width="200px"
+                                                      id="comment-<s:property value="#comment.id"/>"><s:property
+                                                        value="#comment.content" escape="true"/></span>
+                                            </s:else>
+                                        </div>
+
+                                        <s:if test="actionName == 'comments'">
+                                            <div class="details">
+                                                <a id="editlink-<s:property value="#comment.id"/>"
+                                                   onclick='editComment("<s:property value="#comment.id"/>")'>
+                                                    <s:text name="generic.edit"/>
+                                                </a>
+                                            </div>
+                                            <div class="details">
+                                              <span id="savelink-<s:property value="#comment.id"/>"
+                                                    style="display: none">
+                                                   <a onclick='saveComment("<s:property value="#comment.id"/>")'><s:text
+                                                           name="generic.save"/></a> &nbsp;|&nbsp;
                                               </span>
-                                              <span id="cancellink-<s:property value="#comment.id"/>" style="display: none">
-                                                   <a onclick='editCommentCancel("<s:property value="#comment.id"/>")'><s:text name="generic.cancel" /></a>
+                                              <span id="cancellink-<s:property value="#comment.id"/>"
+                                                    style="display: none">
+                                                   <a onclick='editCommentCancel("<s:property
+                                                           value="#comment.id"/>")'><s:text name="generic.cancel"/></a>
                                               </span>
-                                         </div>
-                                     </s:if>
-                                </div>
+                                            </div>
+                                        </s:if>
+
+                                    </div>
                             </tr>
-                        </table> <%-- end comment details table in table --%>
+                        </table>
+                            <%-- end comment details table in table --%>
                     </td>
                 </tr>
             </s:iterator>
         </table>
-        <br />
 
+        <%-- ============================================================= --%>
+        <%-- Next / previous links --%>
+
+        <nav>
+            <ul class="pager">
+                <s:if test="pager.prevLink != null">
+                    <li class="previous">
+                        <a href='<s:property value="pager.prevLink" />'>
+                            <span aria-hidden="true">&larr;</span>Newer</a>
+                    </li>
+                </s:if>
+                <s:if test="pager.nextLink != null">
+                    <li class="next">
+                        <a href='<s:property value="pager.nextLink"/>'>Older
+                            <span aria-hidden="true">&rarr;</span></a>
+                    </li>
+                </s:if>
+            </ul>
+        </nav>
+        
+        <%-- ========================================================= --%>
+        <%-- Save changes and cancel buttons --%>
+        
+        <hr size="1" noshade="noshade"/>
+        <s:submit cssClass="btn btn-primary" value="%{getText('commentManagement.update')}"/>
+
+    </s:form>
+
+</s:else>
+
+
+<script>
+    
+    <%-- setup check all/none checkbox controls --%>
+    <s:if test="pager.items != null">
+    $(document).ready(function () {
+        $('#checkallapproved').click(function () {
+            toggleFunction(true, "bean.approvedComments");
+        });
+        $('#clearallapproved').click(function () {
+            toggleFunction(false, "bean.approvedComments");
+        });
+        $('#checkallspam').click(function () {
+            toggleFunction(true, "bean.spamComments");
+        });
+        $('#clearallspam').click(function () {
+            toggleFunction(false, "bean.spamComments");
+        });
+        $('#checkalldelete').click(function () {
+            toggleFunction(true, "bean.deleteComments");
+        });
+        $('#clearalldelete').click(function () {
+            toggleFunction(false, "bean.deleteComments");
+        });
+    });
+    </s:if>
 
-    <script>
-    <!--
+    <%-- TODO: hook this up; it is currently not working in Roller trunk either --%>
+    function bulkDelete() {
+        if (window.confirm('<s:text name="commentManagement.confirmBulkDelete"><s:param value="bulkDeleteCount" /></s:text>')) {
+            document.commentQueryForm.method.value = "bulkDelete";
+            document.commentQueryForm.submit();
+        }
+    }
+    
     var comments = {};
 
     function editComment(id) {
@@ -393,7 +430,7 @@
         var salt = $("#comments_salt").val();
         $.ajax({
             type: "POST",
-            url: '<%= request.getContextPath()%>/roller-ui/authoring/commentdata?id=' + id +'&salt='+salt,
+            url: '<%= request.getContextPath()%>/roller-ui/authoring/commentdata?id=' + id + '&salt=' + salt,
             data: content,
             dataType: "text",
             processData: "false",
@@ -426,7 +463,7 @@
         $.ajax({
             type: "GET",
             url: '<%= request.getContextPath()%>/roller-ui/authoring/commentdata?id=' + id,
-            success: function(data) {
+            success: function (data) {
                 var cdata = eval("(" + data + ")");
                 $("#comment-" + cdata.id).html(cdata.content);
                 $("#link-" + id).detach();
@@ -434,16 +471,5 @@
             }
         });
     }
-    -->
+    
 </script>
-
-
-<%-- ========================================================= --%>
-<%-- Save changes and cancel buttons --%>
-<%-- ========================================================= --%>
-
-        <s:submit value="%{getText('commentManagement.update')}" />
-
-    </s:form>
-
-</s:else>

http://git-wip-us.apache.org/repos/asf/roller/blob/a5ec43be/app/src/main/webapp/WEB-INF/jsps/editor/CommentsSidebar.jsp
----------------------------------------------------------------------
diff --git a/app/src/main/webapp/WEB-INF/jsps/editor/CommentsSidebar.jsp b/app/src/main/webapp/WEB-INF/jsps/editor/CommentsSidebar.jsp
index fe145d7..ff6603c 100644
--- a/app/src/main/webapp/WEB-INF/jsps/editor/CommentsSidebar.jsp
+++ b/app/src/main/webapp/WEB-INF/jsps/editor/CommentsSidebar.jsp
@@ -17,7 +17,7 @@
 --%>
 <%@ include file="/WEB-INF/jsps/taglibs-struts2.jsp" %>
 
-<link rel="stylesheet" media="all" href='<s:url value="/roller-ui/jquery-ui-1.11.0/jquery-ui.min.css"/>' />
+<link rel="stylesheet" media="all" href='<s:url value="/roller-ui/jquery-ui-1.11.0/jquery-ui.min.css"/>'/>
 <script src="<s:url value="/roller-ui/scripts/jquery-2.1.1.min.js" />"></script>
 <script src='<s:url value="/roller-ui/jquery-ui-1.11.0/jquery-ui.min.js"/>'></script>
 
@@ -28,85 +28,92 @@
     <s:set var="mainAction">globalCommentManagement</s:set>
 </s:else>
 
-<div class="sidebarFade">
-    <div class="menu-tr">
-        <div class="menu-tl">
+<h3><s:text name="commentManagement.sidebarTitle"/></h3>
+<hr size="1" noshade="noshade"/>
 
-<div class="sidebarInner">
+<p><s:text name="commentManagement.sidebarDescription"/></p>
 
-<h3><s:text name="commentManagement.sidebarTitle" /></h3>
-<hr size="1" noshade="noshade" />
+<s:form action="%{#mainAction}!query" id="commentsQuery" theme="bootstrap" cssClass="form-vertical">
 
-<p><s:text name="commentManagement.sidebarDescription" /></p>
-    
- <s:form action="%{#mainAction}!query" id="commentsQuery">
-	<s:hidden name="salt" />
-    <s:hidden name="weblog" />
-    
-    <div class="sideformrow">
-        <label for="searchString" class="sideformrow"><s:text name="commentManagement.searchString" />:</label>   
-        <s:textfield name="bean.searchString" size="15" />
-    </div>
-    <br />
-    <br />
+    <s:hidden name="salt"/>
+    <s:hidden name="weblog"/>
+
+    <%-- ========================================================= --%>
+    <%-- filter by search string --%>
+
+    <s:textfield name="bean.searchString" label="%{getText('commentManagement.searchString')}" size="15"/>
+
+    <script>
+        $(function () {
+            $("#entries_bean_startDateString").datepicker();
+        });
+    </script>
+
+    <%-- ========================================================= --%>
+    <%-- filter by date --%>
+
+    <script>
+        // jQuery UI Date Picker
+        $(function () {
+            $("#commentsQuery_bean_startDateString").datepicker();
+        });
+    </script>
     
-    <div class="sideformrow">
-        <label for="startDateString" class="sideformrow"><s:text name="commentManagement.startDate" />:</label>
-            <script>
-            $(function() {
-                $( "#commentsQuery_bean_startDateString" ).datepicker({
-                    showOn: "button",
-                    buttonImage: "../../images/calendar.png",
-                    buttonImageOnly: true,
-                    changeMonth: true,
-                    changeYear: true
-                });
-            });
-            </script>
-            <s:textfield name="bean.startDateString" size="12" readonly="true"/>
-    </div>
-        
-    <div class="sideformrow">
-        <label for="endDateString" class="sideformrow"><s:text name="commentManagement.endDate" />:</label>
-            <script>
-            $(function() {
-                $( "#commentsQuery_bean_endDateString" ).datepicker({
-                    showOn: "button",
-                    buttonImage: "../../images/calendar.png",
-                    buttonImageOnly: true,
-                    changeMonth: true,
-                    changeYear: true
-                });
-            });
-            </script>
-            <s:textfield name="bean.endDateString" size="12" readonly="true"/>
-    </div>
-    <br />
-    <br />
-  
-    <div class="sideformrow">
-        <label for="approvedString" class="sideformrow">
-            <s:text name="commentManagement.pendingStatus" />
-            <br />
-            <br />
-            <br />
-            <br />            
-            <br />
-        </label> 
-        <div>
-            <s:radio theme="roller" name="bean.approvedString" list="commentStatusOptions" listKey="key" listValue="value" />
+    <div class="control-group">
+        <label for="bean.startDateString" class="control-label">
+            <s:text name="commentManagement.startDate"/>
+        </label>
+        <div class="controls">
+            <div class="input-group">
+
+                <s:textfield name="bean.startDateString" readonly="true"
+                             theme="simple" cssClass="date-picker form-control"/>
+                <label for="bean.startDateString" class="input-group-addon btn">
+                    <span class="glyphicon glyphicon-calendar"></span>
+                </label>
+
+            </div>
         </div>
-    </div> 
-    <br />
+    </div>
 
-    <s:submit value="%{getText('commentManagement.query')}" />
-            
-</s:form>
+    <script>
+        // jQuery UI Date Picker
+        $(function () {
+            $("#commentsQuery_bean_endDateString").datepicker();
+        });
+    </script>
+
+    <div class="control-group">
+        <label for="bean.endDateString" class="control-label">
+            <s:text name="commentManagement.endDate"/>
+        </label>
+        <div class="controls">
+            <div class="input-group">
 
-<br />
-<br />
-</div> <!-- sidebarInner -->
+                <s:textfield name="bean.endDateString" readonly="true"
+                             theme="simple" cssClass="date-picker form-control"/>
+                <label for="bean.endDateString" class="input-group-addon btn">
+                    <span class="glyphicon glyphicon-calendar"></span>
+                </label>
 
+            </div>
         </div>
     </div>
-</div>
+
+    <br/>
+
+    <%-- ========================================================= --%>
+    <%-- filter by status--%>
+
+    <s:radio name="bean.approvedString" 
+             label="%{getText('commentManagement.pendingStatus')}" 
+             list="commentStatusOptions" listKey="key" listValue="value"/>
+
+    
+    <%-- ========================================================= --%>
+    <%-- filter button --%>
+
+    <s:submit value="%{getText('commentManagement.query')}"/>
+
+</s:form>
+

http://git-wip-us.apache.org/repos/asf/roller/blob/a5ec43be/app/src/main/webapp/WEB-INF/jsps/editor/Entries.jsp
----------------------------------------------------------------------
diff --git a/app/src/main/webapp/WEB-INF/jsps/editor/Entries.jsp b/app/src/main/webapp/WEB-INF/jsps/editor/Entries.jsp
index 27b4aa6..682964a 100644
--- a/app/src/main/webapp/WEB-INF/jsps/editor/Entries.jsp
+++ b/app/src/main/webapp/WEB-INF/jsps/editor/Entries.jsp
@@ -29,7 +29,6 @@
 
 <%-- ============================================================= --%>
 <%-- Next / previous links --%>
-<%-- ============================================================= --%>
 
 <nav>
     <ul class="pager">
@@ -51,7 +50,6 @@
 
 <%-- ============================================================= --%>
 <%-- Entry table--%>
-<%-- ============================================================= --%>
 
 <p style="text-align: center">
     <span class="draftEntryBox">&nbsp;&nbsp;&nbsp;&nbsp;</span> 
@@ -155,7 +153,6 @@
 
 <%-- ============================================================= --%>
 <%-- Next / previous links --%>
-<%-- ============================================================= --%>
 
 <nav>
     <ul class="pager">

http://git-wip-us.apache.org/repos/asf/roller/blob/a5ec43be/app/src/main/webapp/WEB-INF/jsps/editor/EntriesSidebar.jsp
----------------------------------------------------------------------
diff --git a/app/src/main/webapp/WEB-INF/jsps/editor/EntriesSidebar.jsp b/app/src/main/webapp/WEB-INF/jsps/editor/EntriesSidebar.jsp
index 8d9f376..f330a8c 100644
--- a/app/src/main/webapp/WEB-INF/jsps/editor/EntriesSidebar.jsp
+++ b/app/src/main/webapp/WEB-INF/jsps/editor/EntriesSidebar.jsp
@@ -20,114 +20,105 @@
 <link rel="stylesheet" media="all" href='<s:url value="/roller-ui/jquery-ui-1.11.0/jquery-ui.min.css"/>'/>
 <script src='<s:url value="/roller-ui/jquery-ui-1.11.0/jquery-ui.min.js"/>'></script>
 
-<div class="sidebarFade">
-    <div class="menu-tr">
-        <div class="menu-tl">
-
-            <div class="sidebarInner">
-
-                <h3><s:text name="weblogEntryQuery.sidebarTitle"/></h3>
-                <hr size="1" noshade="noshade"/>
-
-                <p><s:text name="weblogEntryQuery.sidebarDescription"/></p>
-
-                <s:form action="entries" theme="bootstrap" cssClass="form-vertical">
-                    <s:hidden name="salt"/>
-                    <s:hidden name="weblog"/>
-
-                    <%-- ========================================================= --%>
-                    <%-- filter by category --%>
-
-                    <s:select name="bean.categoryName"
-                              label="%{getText('weblogEntryQuery.label.category')}"
-                              list="categories" listKey="name" listValue="name" size="1"/>
-
-                    <%-- ========================================================= --%>
-                    <%-- filter by tag --%>
-
-                    <s:textfield name="bean.tagsAsString" size="14"
-                                 label="%{getText('weblogEntryQuery.label.tags')}"/>
-
-                    <%-- ========================================================= --%>
-                    <%-- filter by text --%>
-
-                    <s:textfield name="bean.text" size="14"
-                                 label="%{getText('weblogEntryQuery.label.text')}"/>
-
-                    <%-- ========================================================= --%>
-                    <%-- filter by date --%>
-
-                    <script>
-                        $(function () {
-                            $("#entries_bean_startDateString").datepicker();
-                        });
-                    </script>
-
-                    <div class="control-group">
-                        <label for="bean.startDateString" class="control-label">
-                            <s:text name="weblogEntryQuery.label.startDate" />
-                        </label>
-                        <div class="controls">
-                            <div class="input-group">
-                                
-                                <s:textfield name="bean.startDateString" readonly="true"
-                                             theme="simple" cssClass="date-picker form-control" />
-                                <label for="bean.startDateString" class="input-group-addon btn">
-                                    <span class="glyphicon glyphicon-calendar"></span>
-                                </label>
-                                
-                            </div>
-                        </div>
-                    </div>
-                    
-                    <script>
-                        $(function () {
-                            $("#entries_bean_endDateString").datepicker();
-                        });
-                    </script>
-
-                    <div class="control-group">
-                        <label for="bean.endDateString" class="control-label">
-                            <s:text name="weblogEntryQuery.label.endDate" />
-                        </label>
-                        <div class="controls">
-                            <div class="input-group">
-
-                                <s:textfield name="bean.endDateString" readonly="true"
-                                             theme="simple" cssClass="date-picker form-control" />
-                                <label for="bean.endDateString" class="input-group-addon btn">
-                                    <span class="glyphicon glyphicon-calendar"></span>
-                                </label>
-
-                            </div>
-                        </div>
-                    </div>
-
-                    <br/>
-                    
-                    <%-- ========================================================= --%>
-                    <%-- filter by status --%>
-
-                    <s:radio name="bean.status"
-                             label="%{getText('weblogEntryQuery.label.status')}"
-                             list="statusOptions" listKey="key" listValue="value"/>
-
-                    <%-- ========================================================= --%>
-                    <%-- sort by --%>
-
-                    <s:radio name="bean.sortBy"
-                             label="%{getText('weblogEntryQuery.label.sortby')}"
-                             list="sortByOptions" listKey="key" listValue="value"/>
-
-                    <%-- ========================================================= --%>
-                    <%-- search button --%>
-
-                    <s:submit cssClass="btn" value="%{getText('weblogEntryQuery.button.query')}"/>
-
-                </s:form>
-
-            </div> <!-- sidebarInner -->
 
+<h3><s:text name="weblogEntryQuery.sidebarTitle"/></h3>
+<hr size="1" noshade="noshade"/>
+
+<p><s:text name="weblogEntryQuery.sidebarDescription"/></p>
+
+<s:form action="entries" theme="bootstrap" cssClass="form-vertical">
+    <s:hidden name="salt"/>
+    <s:hidden name="weblog"/>
+
+    <%-- ========================================================= --%>
+    <%-- filter by category --%>
+
+    <s:select name="bean.categoryName"
+              label="%{getText('weblogEntryQuery.label.category')}"
+              list="categories" listKey="name" listValue="name" size="1"/>
+
+    <%-- ========================================================= --%>
+    <%-- filter by tag --%>
+
+    <s:textfield name="bean.tagsAsString" size="14"
+                 label="%{getText('weblogEntryQuery.label.tags')}"/>
+
+    <%-- ========================================================= --%>
+    <%-- filter by text --%>
+
+    <s:textfield name="bean.text" size="14"
+                 label="%{getText('weblogEntryQuery.label.text')}"/>
+
+    <%-- ========================================================= --%>
+    <%-- filter by date --%>
+
+    <script>
+        $(function () {
+            $("#entries_bean_startDateString").datepicker();
+        });
+    </script>
+
+    <div class="control-group">
+        <label for="bean.startDateString" class="control-label">
+            <s:text name="weblogEntryQuery.label.startDate"/>
+        </label>
+        <div class="controls">
+            <div class="input-group">
+
+                <s:textfield name="bean.startDateString" readonly="true"
+                             theme="simple" cssClass="date-picker form-control"/>
+                <label for="bean.startDateString" class="input-group-addon btn">
+                    <span class="glyphicon glyphicon-calendar"></span>
+                </label>
+
+            </div>
         </div>
     </div>
-</div>
+
+    <script>
+        $(function () {
+            $("#entries_bean_endDateString").datepicker();
+        });
+    </script>
+
+    <div class="control-group">
+        <label for="bean.endDateString" class="control-label">
+            <s:text name="weblogEntryQuery.label.endDate"/>
+        </label>
+        <div class="controls">
+            <div class="input-group">
+
+                <s:textfield name="bean.endDateString" readonly="true"
+                             theme="simple" cssClass="date-picker form-control"/>
+                <label for="bean.endDateString" class="input-group-addon btn">
+                    <span class="glyphicon glyphicon-calendar"></span>
+                </label>
+
+            </div>
+        </div>
+    </div>
+
+    <br/>
+
+    <%-- ========================================================= --%>
+    <%-- filter by status --%>
+
+    <s:radio name="bean.status"
+             label="%{getText('weblogEntryQuery.label.status')}"
+             list="statusOptions" listKey="key" listValue="value"/>
+
+    <%-- ========================================================= --%>
+    <%-- sort by --%>
+
+    <s:radio name="bean.sortBy"
+             label="%{getText('weblogEntryQuery.label.sortby')}"
+             list="sortByOptions" listKey="key" listValue="value"/>
+
+    
+    <%-- ========================================================= --%>
+    <%-- filter button --%>
+
+    <s:submit cssClass="btn" value="%{getText('weblogEntryQuery.button.query')}"/>
+
+</s:form>
+

http://git-wip-us.apache.org/repos/asf/roller/blob/a5ec43be/app/src/main/webapp/roller-ui/styles/roller.css
----------------------------------------------------------------------
diff --git a/app/src/main/webapp/roller-ui/styles/roller.css b/app/src/main/webapp/roller-ui/styles/roller.css
index 4677e46..bd7b185 100644
--- a/app/src/main/webapp/roller-ui/styles/roller.css
+++ b/app/src/main/webapp/roller-ui/styles/roller.css
@@ -108,6 +108,51 @@ td.scheduledentry, tr.scheduledentry {
     background: #EEEEE0;
 }
 
+/* comments */
+
+td.spamcomment {
+    background: #ffcccc;
+}
+td.pendingcomment {
+    background: #ffffcc;
+}
+.approvedCommentBox {
+    background: #ffffff;
+    border: 1px gray solid;
+}
+.pendingCommentBox {
+    background: #ffffcc;
+    border: 1px gray solid;
+}
+.spamCommentBox {
+    background: #ffcccc;
+    border: 1px gray solid;
+}
+.rollertable label.checkboxLabel {
+    display: none;
+}
+table.innertable {
+    border-collapse: collapse;
+    width: 100%;
+    margin-bottom: 0;
+}
+table.innertable tbody td {
+    padding: 0;
+}
+table.rollertable .innertable td {
+    border: none;
+}
+table.innertable td.viewbody {
+    padding: 5px;
+}
+table.innertable tr .bot {
+    margin-bottom: 5px;
+}
+table.innertable tr .viewbody .bot {
+    padding-bottom: 10px;
+}
+
+
 /* sign-in */
 
 body {