aboutsummaryrefslogtreecommitdiff
path: root/juick-www
diff options
context:
space:
mode:
authorGravatar Vitaly Takmazov2016-08-29 14:39:47 +0300
committerGravatar Vitaly Takmazov2016-08-29 14:39:47 +0300
commitecbb51593fb5dc0831b97d7c3ba5a04faaa47159 (patch)
tree46dcb0e40cf15dca3a1bf6bcf60418fca3f29f8a /juick-www
parentba63a47bcd933f74e95038d6348a8a654d1021c4 (diff)
parente7e858bf508c04379a7fd46c2f07540659dc8025 (diff)
Merge remote-tracking branch 'origin/design'
Diffstat (limited to 'juick-www')
-rw-r--r--juick-www/src/main/java/com/juick/www/PageTemplates.java18
-rw-r--r--juick-www/src/main/java/com/juick/www/UserThread.java41
-rw-r--r--juick-www/src/main/static/scripts.js4
-rw-r--r--juick-www/src/main/static/style.css44
4 files changed, 57 insertions, 50 deletions
diff --git a/juick-www/src/main/java/com/juick/www/PageTemplates.java b/juick-www/src/main/java/com/juick/www/PageTemplates.java
index 5715acd3..0cdf2184 100644
--- a/juick-www/src/main/java/com/juick/www/PageTemplates.java
+++ b/juick-www/src/main/java/com/juick/www/PageTemplates.java
@@ -60,7 +60,7 @@ public class PageTemplates {
out.print("<html>");
out.print("<head>");
out.println("<meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">");
- out.print("<link rel=\"stylesheet\" href=\"/style.css\"/>");
+ out.print("<link rel=\"stylesheet\" href=\"/style.css?v=2\"/>");
out.print("<script type=\"text/javascript\" src=\"/scripts.js\"></script>");
if (headers != null) {
out.print(headers);
@@ -191,7 +191,7 @@ public class PageTemplates {
for (Tag tag : tags) {
String tagName = StringEscapeUtils.escapeHtml4(tag.getName());
try {
- ret += " *<a href=\"/tag/" + URLEncoder.encode(tag.getName(), "utf-8") + "\"";
+ ret += "<a href=\"/tag/" + URLEncoder.encode(tag.getName(), "utf-8") + "\"";
if (tag.UsageCnt < 2) {
ret += " rel=\"nofollow\"";
}
@@ -398,13 +398,13 @@ public class PageTemplates {
List<Tag> tags = MessagesQueries.getMessageTags(sql, msg.getMID());
String tagsStr = formatTags(tags);
if (msg.ReadOnly) {
- tagsStr += " *readonly";
+ tagsStr += "<a>readonly</a>";
}
if (msg.Privacy < 0) {
- tagsStr += " *friends";
+ tagsStr += "<a>friends</a>";
}
if (msg.getMID() == ad_mid) {
- tagsStr += " *реклама";
+ tagsStr += "<a>реклама</a>";
}
String txt;
@@ -416,8 +416,12 @@ public class PageTemplates {
out.println("<article data-mid=\"" + msg.getMID() + "\">");
out.println(" <aside><a href=\"/" + msg.getUser().getUName() + "/\"><img src=\"//i.juick.com/a/" + msg.getUser().getUID() + ".png\" alt=\"" + msg.getUser().getUName() + "\"/></a></aside>");
- out.println(" <header class=\"u\">@<a href=\"/" + msg.getUser().getUName() + "/\">" + msg.getUser().getUName() + "</a>:" + tagsStr + "</header>");
- out.println(" <header class=\"t\"><a href=\"/" + msg.getUser().getUName() + "/" + msg.getMID() + "\"><time datetime=\"" + sdfSQL.format(msg.getDate()) + "Z\" title=\"" + sdfSQL.format(msg.getDate()) + " GMT\">" + formatDate(msg.TimeAgo, msg.getDate()) + "</time></a></header>");
+ out.println(" <header class=\"u\">");
+ out.println(" <header class=\"t\"><a href=\"/" + msg.getUser().getUName() + "/" + msg.getMID() + "\"><time datetime=\"" + sdfSQL.format(msg.getDate()) + "Z\" title=\"" + sdfSQL.format(msg.getDate()) + " GMT\">" + formatDate(msg.TimeAgo, msg.getDate()) + "</time></a></header>");
+ out.println(" @<a href=\"/" + msg.getUser().getUName() + "/\">" + msg.getUser().getUName() + "</a>:");
+ out.println(" <div class=\"tags\">" + tagsStr + "</div>");
+ out.println(" </header>");
+
if (msg.AttachmentType != null) {
String fname = msg.getMID() + "." + msg.AttachmentType;
out.println(" <p class=\"ir\"><a href=\"//i.juick.com/photos-512/" + fname + "\" data-fname=\"" + fname + "\"><img src=\"//i.juick.com/photos-512/" + fname + "\" alt=\"\"/></a></p>");
diff --git a/juick-www/src/main/java/com/juick/www/UserThread.java b/juick-www/src/main/java/com/juick/www/UserThread.java
index a048d795..c201fca3 100644
--- a/juick-www/src/main/java/com/juick/www/UserThread.java
+++ b/juick-www/src/main/java/com/juick/www/UserThread.java
@@ -97,11 +97,11 @@ public class UserThread {
List<Tag> tags = MessagesQueries.getMessageTags(sql, msg.getMID());
String tagsStr = PageTemplates.formatTags(tags);
if (msg.ReadOnly) {
- tagsStr += " *readonly";
+ tagsStr += "<a>readonly</a>";
msg.VisitorCanComment = false;
}
if (msg.Privacy < 0) {
- tagsStr += " *friends";
+ tagsStr += "<a>friends</a>";
}
String txt;
@@ -112,17 +112,17 @@ public class UserThread {
}
if (!tags.isEmpty()) {
- tagsStr = "<span class=\"msg-tags\">" + tagsStr + "</span>";
+ tagsStr = "<div class=\"msg-tags\">" + tagsStr + "</div>";
}
out.println("<ul>");
out.println(" <li id=\"msg-" + msg.getMID() + "\" data-mid=\"" + msg.getMID() + "\" class=\"msg msgthread\">");
- out.println(" <div class=\"msg-avatar\"><a href=\"/" + msg.getUser().getUName() + "/\"><img src=\"//i.juick.com/a/" + msg.getUser().getUID() + ".png\" alt=\"" + msg.getUser().getUName() + "\"/></a></div>");
out.println(" <div class=\"msg-cont\">");
- out.println(" <div class=\"msg-menu\"><a href=\"#\"></a></div>");
- out.println(" <div class=\"msg-header\"><a href=\"/" + msg.getUser().getUName() + "/\">@" + msg.getUser().getUName() + "</a>:" + tagsStr + "</div>");
- out.println(" <div class=\"msg-ts\">" + PageTemplates.formatJSLocalTime(msg.getDate()) + "</div>");
- out.println(" <div class=\"msg-txt\">" + txt + "</div>");
+ out.println(" <div class=\"msg-menu\"><a href=\"#\"></a></div>");
+ out.println(" <div class=\"msg-ts\">" + PageTemplates.formatJSLocalTime(msg.getDate()) + "</div>");
+ out.println(" <div class=\"msg-avatar\"><a href=\"/" + msg.getUser().getUName() + "/\"><img src=\"//i.juick.com/a/" + msg.getUser().getUID() + ".png\" alt=\"" + msg.getUser().getUName() + "\"/></a></div>");
+ out.println(" <div class=\"msg-header\">@<a href=\"/" + msg.getUser().getUName() + "/\">" + msg.getUser().getUName() + "</a>:" + tagsStr + "</div>");
+ out.println(" <div class=\"msg-txt\">" + txt + "</div>");
if (msg.AttachmentType != null) {
out.println(" <div class=\"msg-media\"><a href=\"//i.juick.com/p/" + msg.getMID() + "." + msg.AttachmentType + "\"><img src=\"//i.juick.com/photos-512/" + msg.getMID() + "." + msg.AttachmentType + "\" alt=\"\"/></a></div>");
@@ -278,19 +278,16 @@ public class UserThread {
out.print("display:none;");
}
out.println("\">");
+ out.println(" <div class=\"msg-cont\">");
+ out.println(" <div class=\"msg-menu\"><a href=\"#\" class=\"a-thread-links\"></a></div>");
+ out.println(" <div class=\"msg-ts\"><a href=\"/" + msg.getMID() + "#" + msg.getRID() + "\" title=\"" + PageTemplates.sdfSQL.format(msg.getDate()) + " GMT\">" + PageTemplates.formatDate(msg.TimeAgo, msg.getDate()) + "</a></div>");
if (!msg.getUser().Banned) {
out.println(" <div class=\"msg-avatar\"><a href=\"/" + msg.getUser().getUName() + "/\"><img src=\"//i.juick.com/a/" + msg.getUser().getUID() + ".png\" alt=\"" + msg.getUser().getUName() + "\"/></a></div>");
+ out.println(" <div class=\"msg-header\">@<a href=\"/" + msg.getUser().getUName() + "/\">" + msg.getUser().getUName() + "</a>:</div>");
} else {
out.println(" <div class=\"msg-avatar\"><img src=\"//i.juick.com/av-96.png\"/></div>");
- }
- out.println(" <div class=\"msg-cont\">");
- out.println(" <div class=\"msg-menu\"><a href=\"#\" class=\"a-thread-links\"></a></div>");
- if (!msg.getUser().Banned) {
- out.println(" <div class=\"msg-header\"><a href=\"/" + msg.getUser().getUName() + "/\">@" + msg.getUser().getUName() + "</a>:</div>");
- } else {
out.println(" <div class=\"msg-header\">[удалено]:</div>");
}
- out.println(" <div class=\"msg-ts\"><a href=\"/" + msg.getMID() + "#" + msg.getRID() + "\" title=\"" + PageTemplates.sdfSQL.format(msg.getDate()) + " GMT\">" + PageTemplates.formatDate(msg.TimeAgo, msg.getDate()) + "</a></div>");
out.println(" <div class=\"msg-txt\">" + PageTemplates.formatMessage(msg.getText()) + "</div>");
if (msg.AttachmentType != null) {
out.println(" <div class=\"msg-media\"><a href=\"//i.juick.com/p/" + msg.getMID() + "-" + msg.getRID() + "." + msg.AttachmentType + "\"><img src=\"//i.juick.com/photos-512/" + msg.getMID() + "-" + msg.getRID() + "." + msg.AttachmentType + "\" alt=\"\"/></a></div>");
@@ -321,19 +318,17 @@ public class UserThread {
public static void printList(PrintWriter out, List<com.juick.Message> replies, com.juick.User visitor) {
for (Message msg : replies) {
out.print(" <li id=\"" + msg.getRID() + "\" class=\"msg\">");
- if (!msg.getUser().Banned) {
- out.println(" <div class=\"msg-avatar\"><a href=\"/" + msg.getUser().getUName() + "/\"><img src=\"//i.juick.com/a/" + msg.getUser().getUID() + ".png\" alt=\"" + msg.getUser().getUName() + "\"/></a></div>");
- } else {
- out.println(" <div class=\"msg-avatar\"><img src=\"//i.juick.com/av-96.png\"/></div>");
- }
out.println(" <div class=\"msg-cont\">");
- out.println(" <div class=\"msg-menu\"><a href=\"#\" class=\"a-thread-links\"></a></div>");
+ out.println(" <div class=\"msg-menu\"><a href=\"#\" class=\"a-thread-links\"></a></div>");
+ out.println(" <div class=\"msg-ts\"><a href=\"/" + msg.getMID() + "#" + msg.getRID() + "\" title=\"" + PageTemplates.sdfSQL.format(msg.getDate()) + " GMT\">" + PageTemplates.formatDate(msg.TimeAgo, msg.getDate()) + "</a></div>");
if (!msg.getUser().Banned) {
- out.println(" <div class=\"msg-header\"><a href=\"/" + msg.getUser().getUName() + "/\">@" + msg.getUser().getUName() + "</a>:</div>");
+ out.println(" <div class=\"msg-avatar\"><a href=\"/" + msg.getUser().getUName() + "/\"><img src=\"//i.juick.com/a/" + msg.getUser().getUID() + ".png\" alt=\"" + msg.getUser().getUName() + "\"/></a></div>");
+ out.println(" <div class=\"msg-header\">@<a href=\"/" + msg.getUser().getUName() + "/\">" + msg.getUser().getUName() + "</a>:</div>");
} else {
+ out.println(" <div class=\"msg-avatar\"><img src=\"//i.juick.com/av-96.png\"/></div>");
out.println(" <div class=\"msg-header\">[удалено]:</div>");
}
- out.println(" <div class=\"msg-ts\"><a href=\"/" + msg.getMID() + "#" + msg.getRID() + "\" title=\"" + PageTemplates.sdfSQL.format(msg.getDate()) + " GMT\">" + PageTemplates.formatDate(msg.TimeAgo, msg.getDate()) + "</a></div>");
+
out.println(" <div class=\"msg-txt\">" + PageTemplates.formatMessage(msg.getText()) + "</div>");
if (msg.AttachmentType != null) {
out.println(" <div class=\"msg-media\"><a href=\"//i.juick.com/p/" + msg.getMID() + "-" + msg.getRID() + "." + msg.AttachmentType + "\"><img src=\"//i.juick.com/photos-512/" + msg.getMID() + "-" + msg.getRID() + "." + msg.AttachmentType + "\" alt=\"\"/></a></div>");
diff --git a/juick-www/src/main/static/scripts.js b/juick-www/src/main/static/scripts.js
index 3a656364..36b6fc36 100644
--- a/juick-www/src/main/static/scripts.js
+++ b/juick-www/src/main/static/scripts.js
@@ -92,7 +92,6 @@ function wsIncomingReply(msg) {
msgAvatarImg.setAttribute('src', '//i.juick.com/a/' + msg.user.uid + '.png');
msgAvatarLink.appendChild(msgAvatarImg);
msgAvatar.appendChild(msgAvatarLink);
- li.appendChild(msgAvatar);
var msgCont = document.createElement('div');
msgCont.setAttribute('class', 'msg-cont');
@@ -140,8 +139,9 @@ function wsIncomingReply(msg) {
msgComment.setAttribute('class', 'msg-comment');
msgComment.style.display = 'none';
msgCont.appendChild(msgMenu);
+ msgCont.appendChild(msgTimestamp);
+ msgCont.appendChild(msgAvatar);
msgCont.appendChild(msgHeader);
- msgCont.appendChild(msgTimestamp);
msgCont.appendChild(msgTxt);
msgCont.appendChild(msgLinks);
msgCont.appendChild(msgComment);
diff --git a/juick-www/src/main/static/style.css b/juick-www/src/main/static/style.css
index a755fe32..001c3e52 100644
--- a/juick-www/src/main/static/style.css
+++ b/juick-www/src/main/static/style.css
@@ -54,13 +54,13 @@ body>header p { color: #000; font-size: 13pt; margin: 12px 0; text-align: center
#newmessage .tags { width: 500px; }
#newmessage .subm { width: 150px; background: #EEEEE5; }
-article { margin: 10px 0 20px 58px; background: #FFF; padding: 12px 13px; }
-article>aside { margin: -12px 0 0 -71px; width: 48px; height: 48px; float: left; }
+article { margin-bottom: 20px; padding: 20px; line-height: 140%; background: #fff; /* box-shadow: 0 0 0 1px #ccc;*/ }
+article>aside { margin-right: 10px; float: left; }
article>aside img { width: 48px; height: 48px; }
-article>header.u { overflow: hidden; display: inline-block; width: 460px; }
-article>header.t { width: 140px; text-align: right; float: right; }
+article>header.u { display: inline-block; width: 630px; }
+article header.t { float: right; text-align: right; margin-top: -1px; }
article time { color: #999; font-size: 10pt; border-bottom: 1px dotted #999; }
-article p { margin: 10px 0 15px 0; }
+article p { margin: 5px 0 15px 0; clear: left; }
article p.i { text-align: center; }
article p.ir { float: right; margin-left: 10px; margin-bottom: 10px; }
article p.ir a { cursor: -webkit-zoom-in; cursor: -moz-zoom-in; }
@@ -75,6 +75,16 @@ article a.replies { margin-left: 18px; }
article footer.comm { margin: 13px 0 0 0; }
article textarea { width: 530px; padding: 2px; resize: vertical; vertical-align: top; min-height: 12pt; height: 12pt; border: 0; }
article input { width: 50px; margin-left: 6px; vertical-align: top; border: 1px solid #CCC; background: #EEE; color: #999; }
+article .tags { margin-top: 3px; }
+.msg-tags { margin-top: 5px; }
+article .tags>a, .msg-tags>a {
+ display: inline-block;
+ margin-bottom: 5px;
+ margin-right: 5px;
+ padding: 0 10px;
+ border: 1px dotted #ccc;
+ color: #222;
+}
#yandex_ad_728 { width: 728px; height: 90px; margin: 20px 0; padding: 15px 0; background: #FFF; }
.adslot1 { display: inline-block; width: 320px; height: 90px; }
@@ -88,21 +98,20 @@ article input { width: 50px; margin-left: 6px; vertical-align: top; border: 1px
.msg { margin: 10px 0 20px 0; }
.ads { padding: 13px 10px 5px 10px; margin: 8px 0 16px 58px; background: #FFF; }
.msgthread { margin-bottom: 0; }
-.msg-avatar { float: left; width: 48px; height: 48px; }
+.msg-avatar { float: left; width: 48px; height: 48px; margin-right: 10px }
.msg-avatar img { width: 48px; height: 48px; vertical-align: top; }
-.msg-cont { background: #FFF; margin-left: 58px; padding: 12px 15px; width: 640px; }
-.msg-menu { float: right; width: 16px; height: 16px; }
+.msg-cont { background: #FFF; margin-bottom: 20px; padding: 20px; width: 640px; line-height: 140%; /* box-shadow: 0 0 0 1px #ccc; */ }
+.msg-menu { float: right; width: 16px; height: 16px; margin-top: 2.4px; margin-left: 10px; }
.msg-menu>a { display: block; width: 16px; height: 16px; vertical-align: top; background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAMAAAAoLQ9TAAAAAXNSR0IArs4c6QAAALRQTFRFAAAAldX/ncT/ksj/ltL/nMb/lMn/mcz/l9H/lcr/mZmZmcz/m83/mJiYmZmZmcz/mM7/mpqamsr/l8v/m83/mJiYmM7/l8v/mZmZmcz/mpqamMv/mcz/mM3/ms3/msv/mMv/mMz/mcz/msz/mc3/mMz/mcz/msz/mc3/mcv/mc3/mcv/mcz/mcz/mcz/mcz/mZmZmZmZmcz/mcz/mcz/mcz/mcz/mcz/mcz/mcz/mcz/mZmZiZsGCAAAADx0Uk5TAAwNDhESExQWGC0tLi8yMjQ1NTY4OTk7PDxESktNUVNUd3h5eoGCg4mKmMvMzc7P29zd3uLj7O3u8vT2+A5wCAAAAJFJREFUGBkFwQlCgkAAAMDRxEySkryyzDxSAc+gkvX//2oGAAB42J5COG46AJ+/+SiKxvl1DsyqJyCtZnBXxgDxdxPrHQDZCvvUNIFkalAgtCSXHr1LIqpRt+ifu91zn6hG8YLh7TbEoMAyg8kEsgWaZQzwWDbgvXoG0p83YH7Nx+32a/73AdDZHEIovu4BAMA/t6QMuyHliCkAAAAASUVORK5CYII=") no-repeat; }
-.msg-header { overflow: hidden; }
-.msg-ts { font-size: small; vertical-align: top; margin: 5px 0; }
+.msg-header { /* overflow: hidden; */ }
+.msg-ts { font-size: small; vertical-align: top; float: right; }
.msg-ts, .msg-ts>a { color: #999; }
.msg-place { font-size: small; }
.msg-place>a { color: #999; }
-.msg-txt { overflow: hidden; margin: 10px 0 12px 0; }
+.msg-txt { margin: 10px 0 12px; }
.msg-media { text-align: center; }
.msg-links { font-size: small; color: #999; margin: 5px 0 0 0; }
.msg-comments { overflow: hidden; font-size: small; color: #AAA; text-indent: 10px; margin-top: 10px; }
-.msg-comment { margin: 5px 0; }
.ta-wrapper { display: inline-block; border: 1px solid #DDD; }
.msg-comment textarea { width: 634px; padding: 2px; resize: vertical; vertical-align: top; min-height: 12pt; height: 12pt; border: 0; }
.msg-comment .narrow { width: 554px; }
@@ -115,11 +124,13 @@ article input { width: 50px; margin-left: 6px; vertical-align: top; border: 1px
q:before, q:after { content: "";}
q { border-left: 1px dashed #CCC; margin: 10px 0 10px 10px; padding-left: 10px; display: block; color: #666; }
-#mtoolbar { width: 670px; margin-left: 58px; background: #E5E5DD; border-top: 1px solid #CCC; }
+#mtoolbar { width: 680px; background: #E5E5DD; border-top: 1px solid #CCC; }
#mtoolbar ul, #mtoolbar a { padding: 5px; }
#mtoolbar li { display: inline; }
#mtoolbar div { display: inline-block; width: 16px; height: 16px; background: url(//static.juick.com/toolbar-icons.png) no-repeat; vertical-align: middle; margin: 5px; }
+#replies .msg-txt { clear: both; margin: 0; padding-top: 10px; }
+
.newmessage { width: 695px; padding: 2px; resize: vertical; border: 1px solid #DDD; } /* textarea */
.users { width: 100%; margin: 10px 0; } /* table */
@@ -242,8 +253,7 @@ q { border-left: 1px dashed #CCC; margin: 10px 0 10px 10px; padding-left: 10px;
#column { float: none; padding-top: 0; width: auto; margin: 0 10px; }
article { margin: 8px; overflow: auto; }
- article>aside { margin: 0 10px 0 0; width: 40px; height: 40px; }
- article>aside img { width: 40px; height: 40px; }
+
article>header.u { margin: 0; width: auto; display: block; }
article>header.t { float: none; text-align: left; margin: 0; width: auto; display: block; }
article p { margin: 10px 0 8px 0; }
@@ -255,9 +265,7 @@ q { border-left: 1px dashed #CCC; margin: 10px 0 10px 10px; padding-left: 10px;
#content textarea { width: 100%; }
.msg,.msg-cont { width: auto; min-width: 280px; }
- .msg-cont,.ads { margin-left: 0; }
- .msg-avatar { margin: 10px 10px 0 10px; width: 40px; height: 40px; }
- .msg-avatar img { width: 40px; height: 40px; }
+ .msg-cont,.ads { margin: 8px; }
.msg-comment textarea { width: 100%; }
.msg-txt { margin: 8px 0 0 0; }
.msg-media { overflow: auto; }
generated by cgit v1.2.3 (git 2.39.1) at 2024-11-22 13:59:54 +0000