Permalink
Browse files

NXP-9513: Style comments and like actions in library gadget

  • Loading branch information...
1 parent a36009a commit 9d9f91a962daa004be5c8ca3d8c27cb1e2632e7e @lkemen lkemen committed Jun 17, 2012
@@ -707,19 +707,10 @@ public Object docLike(@FormParam("docRef") String docRef) throws Exception {
}
}
- /**
- * Return like status (Likes number / if current user likes)
- */
- public String getLikeStatus(DocumentModel doc) {
+ public boolean hasUserLiked(DocumentModel doc) {
LikeService likeService = Framework.getLocalService(LikeService.class);
String userName = ctx.getPrincipal().getName();
- if (likeService.hasUserLiked(userName, doc)) {
- String data = "Unlike (" + String.valueOf(getLikesCount(doc)) + ")";
- return data;
- } else {
- String data = "Like (" + String.valueOf(getLikesCount(doc)) + ")";
- return data;
- }
+ return likeService.hasUserLiked(userName, doc);
}
public long getLikesCount(DocumentModel doc) {
@@ -1,24 +1,22 @@
-<tr><td colspan="4" style="border:0; padding-left:15px">
-<table style="width: 100%;">
+<tr><td colspan="4" class="messageRow">
+<table>
<tr>
- <td style="border-style:none;width:30%">
- <img src="${This.getAvatarURL(comment.comment.author)}" style="width:30px;"/>
- ${comment.comment.author}
- ${comment.comment.creationDate.getInstance().getTime()?string("dd/MM/yyyy")}
+ <td class="messageUserInfos">
+ <span class="avatar"><img src="${This.getAvatarURL(comment.comment.author)}"/></span>
+ <span class="username">${comment.comment.author}</span>
+ <span class="timestamp">${comment.comment.creationDate.getInstance().getTime()?string("dd/MM/yyyy")}</span>
</td>
- <td style="border-style:none;width:30%">
- ${comment.comment.text}
+ <td class="messageContent">
+ <span class="message comment">${comment.comment.text}</span>
</td>
- <td style="border-style:none;width:40%">
- <a href="#" id="comment_button_${comment.id}">Answer</a>
+ <td class="messageReply">
+ <a href="#" class="actionItem" id="comment_button_${comment.id}"><img src="${contextPath}/icons/reply.png" />Reply</a>
</td>
</tr>
<tr class="${comment.id}">
- <td style="border-style:none;"/>
- <td style="border-style:none;"/>
- <td style="border-style:none;">
+ <td colspan="3">
<div id="box_${comment.id}" style="display:none">
- <textarea id="commentContent_${comment.id}" ></textarea><br/>
+ <textarea id="commentContent_${comment.id}" ></textarea>
<input type="button" value="Comment" onclick="Library.addComment('${doc.id}','#commentContent_${comment.id}','${comment.id}')"/>
</div>
</td>
@@ -7,7 +7,6 @@
<title>Library Gadget</title>
<link rel="stylesheet" type="text/css" href="${contextPath}/nxthemes-lib/gadget-common.css,jquery.fancybox.style.css,gadget-library.css?path=${contextPath}&basepath=${contextPath}"/>
-
<script src="${contextPath}/nxthemes-lib/jquery.js,jquery.fancybox.js,gadget-library.js"></script>
<script type="text/javascript">
@@ -1,15 +1,23 @@
-<tr>
- <td colspan="4" style="border-style:none;">
+ <tr>
+ <td colspan="5" class="actions">
<#assign comments = This.getComments(doc)>
- <a href="#" id="comment_display_button_${doc.id}">Show ${comments?size} threads</a>
- <a href="#" id="root_comment_button_${doc.id}">Comment</a>
- <a href="#" id="like_${doc.id}" onclick="Library.docLike('${doc.id}');" class="like_link">${This.getLikeStatus(doc)}</a>
- <div class='panel' id="box_comment_${doc.id}" style="display:none">
- <textarea id="rootCommentContent_${doc.id}" style="width:390px;height:23px; border:1px solid #999999;"></textarea><br/>
- <input type="button" value="Comment" onclick="Library.addComment('${doc.id}','#rootCommentContent_${doc.id}')"/>
+ <a class="actionItem" href="#" id="comment_display_button_${doc.id}">Show ${comments?size} threads</a>
+ <a class="actionItem" href="#" id="root_comment_button_${doc.id}"><img src="${contextPath}/icons/comment.png" />Comment</a>
+ <a class="actionItem" href="#" id="like_${doc.id}" onclick="Library.docLike('${doc.id}');" class="like_link">
+ <#if This.hasUserLiked(doc)>
+ <img src="${contextPath}/icons/unlike.png" />
+ ${This.getLikesCount(doc)}
+ <#else>
+ <img src="${contextPath}/icons/like.png" />
+ ${This.getLikesCount(doc)}
+ </#if>
+ </a>
+ <div class="newMessageForm" id="box_comment_${doc.id}" style="display:none">
+ <textarea id="rootCommentContent_${doc.id}"></textarea>
+ <input class="button" type="button" value="Comment" onclick="Library.addComment('${doc.id}','#rootCommentContent_${doc.id}')"/>
</div>
<div id="display_${doc.id}" style="display:none">
- <table id="comments_list_${doc.id}" style="border-bottom: 0px;width: 100%">
+ <table id="comments_list_${doc.id}" class="documentThread">
<#list comments as comment>
<#include "@bricks/document_comments">
</#list>
@@ -6,4 +6,20 @@
.customSearchBox form { margin: 0 10px 0 0 }
.customSearchBox .wideDefinition { border: 1px solid #ccc; padding: .2em 0 .2em .2em }
.customSearchBox .searchBox { background: none transparent; border: none; width: 105px }
-.customSearchBox .button { background: transparent url(${basePath}/icons/gadget_library_search.png) no-repeat left center; border: none; cursor: pointer; width: 20px }
+.customSearchBox .button { background: transparent url(${basePath}/icons/gadget_library_search.png) no-repeat left center; border: none; cursor: pointer; width: 20px }
+
+/* Comments, threads and like actions */
+.dataList td.actions { background-color: #f4f4f4; border-top: 1px dotted #ddd; font-size: 10px }
+ .actions .actionItem { margin-right: .5em }
+ .actions a.actionItem:link, .actions a.actionItem:visited { color: #9db6d1 }
+ .actionItem img { margin: 0 .3em -0.2em -0.2em }
+
+.dataList .documentThread td { border-top: 1px dotted #ededed; border-bottom: none }
+.dataList .documentThread table { width: 90% }
+.dataList .messageUserInfos { width: 30% }
+.dataList .messageContent { width: 50% }
+.dataList .messageReply { width: 20% }
+.dataList td.messageRow { border: none; padding: 0 }
+
+.newMessageForm { margin: 0 auto; width: 90% }
+.newMessageForm textarea { height: 35px; margin: .5em 0 0; width: 75% }
Deleted file not rendered
Deleted file not rendered
Deleted file not rendered
Deleted file not rendered

0 comments on commit 9d9f91a

Please sign in to comment.