aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorGravatar Ugnich Anton2013-12-08 16:38:38 +0700
committerGravatar Ugnich Anton2013-12-08 16:38:38 +0700
commit3184680827e2a611e71c57dd2a74c4e7e754b8a6 (patch)
tree955caaf0eb4864c7968828851303c96476ea3079
parentd1cdc30fb66c800a236c6bc7bad067d0d46edbbd (diff)
attachCommentPhoto
-rw-r--r--src/java/com/juick/http/www/PageTemplates.java6
-rw-r--r--src/java/com/juick/http/www/UserThread.java2
-rw-r--r--web/scripts3.js25
-rw-r--r--web/style3.css7
4 files changed, 29 insertions, 11 deletions
diff --git a/src/java/com/juick/http/www/PageTemplates.java b/src/java/com/juick/http/www/PageTemplates.java
index 5b5681e0..1c958bd1 100644
--- a/src/java/com/juick/http/www/PageTemplates.java
+++ b/src/java/com/juick/http/www/PageTemplates.java
@@ -50,9 +50,9 @@ public class PageTemplates {
out.println("<!DOCTYPE html>");
out.print("<html>");
out.print("<head>");
- out.print("<link rel=\"stylesheet\" href=\"/style.2013102404.css\"/>");
+ out.print("<link rel=\"stylesheet\" href=\"/style.2013120400.css\"/>");
out.print("<script type=\"text/javascript\" src=\"//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js\" defer=\"defer\"></script>");
- out.print("<script type=\"text/javascript\" src=\"/scripts.2013102404.js\" defer=\"defer\"></script>");
+ out.print("<script type=\"text/javascript\" src=\"/scripts.2013120400.js\" defer=\"defer\"></script>");
if (headers != null) {
out.print(headers);
}
@@ -464,7 +464,7 @@ public class PageTemplates {
if (visitor != null && (msg.ReadOnly == false || visitor.UID == msg.User.UID)) {
out.println(" <form action=\"/post\" method=\"POST\" enctype=\"multipart/form-data\"><input type=\"hidden\" name=\"mid\" value=\"" + msg.MID + "\"/>");
- out.println(" <div class=\"msg-comment\"><textarea name=\"body\" rows=\"1\" class=\"reply\" placeholder=\"" + rb.getString("Add a comment") + "\" onkeypress=\"postformListener(this.form,event)\"></textarea></div>");
+ out.println(" <div class=\"msg-comment\"><div class=\"ta-wrapper\"><textarea name=\"body\" rows=\"1\" class=\"reply\" placeholder=\"" + rb.getString("Add a comment") + "\" onkeypress=\"postformListener(this.form,event)\"></textarea></div></div>");
out.println(" </form>");
}
if (msg.Replies > 0) {
diff --git a/src/java/com/juick/http/www/UserThread.java b/src/java/com/juick/http/www/UserThread.java
index 4862bd6c..925e9f02 100644
--- a/src/java/com/juick/http/www/UserThread.java
+++ b/src/java/com/juick/http/www/UserThread.java
@@ -153,7 +153,7 @@ public class UserThread {
if (msg.VisitorCanComment) {
out.println(" <form action=\"/post\" method=\"POST\" enctype=\"multipart/form-data\"><input type=\"hidden\" name=\"mid\" value=\"" + mid + "\"/>");
- out.println(" <div class=\"msg-comment\"><textarea name=\"body\" rows=\"1\" class=\"reply\" placeholder=\"" + rb.getString("Add a comment") + "\" onkeypress=\"postformListener(this.form,event)\"></textarea></div>");
+ out.println(" <div class=\"msg-comment\"><div class=\"ta-wrapper\"><textarea name=\"body\" rows=\"1\" class=\"reply\" placeholder=\"" + rb.getString("Add a comment") + "\" onkeypress=\"postformListener(this.form,event)\"></textarea></div></div>");
out.println(" </form>");
}
diff --git a/web/scripts3.js b/web/scripts3.js
index 087a2d66..dc2cc330 100644
--- a/web/scripts3.js
+++ b/web/scripts3.js
@@ -117,7 +117,7 @@ function showGroup(gid) {
"</div>"+
"<div class=\"msg-txt\">"+item.body+"</div>"+
photo+
- "<div class=\"msg-comment\"><textarea id=\"tareply-"+item.mid+"\" name=\"body\" rows=\"1\" class=\"reply\" placeholder=\"Add a comment...\" onkeypress=\"postformListener(this.form,event)\"></textarea></div>"+
+ "<div class=\"msg-comment\"><div class=\"ta-wrapper\"><textarea id=\"tareply-"+item.mid+"\" name=\"body\" rows=\"1\" class=\"reply\" placeholder=\"Add a comment...\" onkeypress=\"postformListener(this.form,event)\"></textarea></div></div>"+
replies
);
ul.append(li);
@@ -173,7 +173,7 @@ function showMessages(param) {
"</div>"+
"<div class=\"msg-txt\">"+item.body+"</div>"+
photo+
- "<div class=\"msg-comment\"><textarea name=\"body\" rows=\"1\" class=\"reply\" placeholder=\"Add a comment...\" onkeypress=\"postformListener(this.form,event)\"></textarea></div>"+
+ "<div class=\"msg-comment\"><div class=\"ta-wrapper\"><textarea name=\"body\" rows=\"1\" class=\"reply\" placeholder=\"Add a comment...\" onkeypress=\"postformListener(this.form,event)\"></textarea></div></div>"+
replies
);
ul.append(li);
@@ -225,7 +225,7 @@ function showMessage(mid) {
"</div>"+
"<div class=\"msg-txt\">"+post.body+"</div>"+
photo+
- "<div class=\"msg-comment\"><textarea name=\"body\" rows=\"1\" class=\"reply\" placeholder=\"Add a comment...\" onkeypress=\"postformListener(this.form,event)\"></textarea></div>"
+ "<div class=\"msg-comment\"><div class=\"ta-wrapper\"><textarea name=\"body\" rows=\"1\" class=\"reply\" placeholder=\"Add a comment...\" onkeypress=\"postformListener(this.form,event)\"></textarea></div></div>"
);
ul.append(li);
@@ -423,7 +423,7 @@ function showCommentForm(mid,rid) {
var c=$('#replies #'+rid+' .msg-comment');
c.wrap('<form action="/post" method="POST" enctype="multipart/form-data"/>');
c.before('<input type="hidden" name="mid" value="'+mid+'"/><input type="hidden" name="rid" value="'+rid+'"/>');
- c.append('<textarea name="body" rows="1" class="reply narrow" placeholder="Add a comment..." onkeypress="postformListener(this.form,event)"></textarea><input type="submit" value="OK"/>');
+ c.append('<div class="ta-wrapper"><textarea name="body" rows="1" class="reply narrow" placeholder="Add a comment..." onkeypress="postformListener(this.form,event)"></textarea><div class="attach-photo" onclick="attachCommentPhoto(this)"/></div><input type="submit" value="OK"/>');
}
// $('#replies #'+rid+' .msg-links').hide();
$('#replies #'+rid+' .msg-comment').show();
@@ -435,6 +435,20 @@ function showCommentForm(mid,rid) {
return false;
}
+function attachCommentPhoto(div) {
+ if($(div).children().length===0) {
+ var inp=$('<input type="file" name="attach" accept="image/jpeg,image/png" style="visibility: hidden"/>');
+ inp.on('change',function() {
+ $(this).parent().attr('class','attach-photo-active');
+ });
+ inp.trigger('click');
+ $(div).append(inp);
+ } else {
+ $(div).empty();
+ $(div).attr('class','attach-photo');
+ }
+}
+
function unfoldReply() {
if((0+window.location.hash.substring(1))>0) {
var el=$(window.location.hash);
@@ -795,7 +809,8 @@ $(document).ready(function() {
});
tareply.click(function () {
$(this).addClass("narrow");
- $(this).after('<input type="submit" value="OK"/>');
+ $(this).after('<div class="attach-photo" onclick="attachCommentPhoto(this)"/>');
+ $(this).parent().after('<input type="submit" value="OK"/>');
$(this).off('click');
});
diff --git a/web/style3.css b/web/style3.css
index 1a2c15c1..c23d2c1d 100644
--- a/web/style3.css
+++ b/web/style3.css
@@ -62,8 +62,11 @@ pre { white-space: pre-wrap; white-space: -moz-pre-wrap; white-space: -pre-wrap;
.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; }
-.msg-comment textarea { width: 506px; padding: 2px; resize: vertical; vertical-align: top; min-height: 12pt; height: 12pt; border: 1px solid #DDD; }
-.msg-comment .narrow { width: 450px; }
+.ta-wrapper { display: inline-block; border: 1px solid #DDD; }
+.msg-comment textarea { width: 506px; padding: 2px; resize: vertical; vertical-align: top; min-height: 12pt; height: 12pt; border: 0; }
+.msg-comment .narrow { width: 425px; }
+.attach-photo { display: inline-block; padding: 2px 4px; cursor: pointer; width: 16px; height: 13px; background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAANCAQAAAAKsiavAAAAAXNSR0IArs4c6QAAAKRJREFUGNNjZICC6Q5M+xlQwD/HzAMMDEwwLnM9AxqAiDDO/M+AFzCh8B4zhrDwsfAxBjHcggkhm/CY2SDlHYQ5TZD5EoMMmgmMhSnvZnrPfDLzyQyvrPf/CzGs+L2TgYFhBoM0gzTjDAaGX7uwuQG/I1ldGRj+pzM8YXjMmMrAwOGK6cibfy2z3sMdeYpBBTMcHjMU/9zJzsjo8r8DIk1yQGEBAFzpL+AuTCqZAAAAAElFTkSuQmCC") no-repeat 3px 4px; }
+.attach-photo-active { display: inline-block; padding: 2px 4px; cursor: pointer; width: 16px; height: 13px; background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAANCAMAAACXZR4WAAAAAXNSR0IArs4c6QAAAEVQTFRFAAAAAJUAAJ0AAJIAAJkAAJYAAJwAAJcAAJoAAJgAAJkAAJoAAJoAAJgAAJkAAJoAAJkAAJkAAJkAAJkAAJkAAJkAAJkA9z3GXQAAABZ0Uk5TAAwNDg8REkBHSktRU1RVv9jZ2+Lj5OeV7PgAAABSSURBVAhbdcjBFkAgFADRIUlE9Or9/6daUC0cs5pzAXD65niKFSJQv/aChHHcrg4yA9jcILCW4tkbDGRVwfzDhs+yEBqcFsCmBiqHmULSDr0P3JdgDbuscEckAAAAAElFTkSuQmCC") no-repeat 3px 4px; }
.msg-comment input { width: 50px; margin-left: 6px; vertical-align: top; border: 1px solid #CCC; background: #EEE; color: #999; }
.msg-recomms { margin-top: 10px; overflow: hidden; font-size: small; color: #AAA; text-indent: 10px; }
blockquote { border-left: 1px dashed #CCC; margin: 10px 0 10px 10px; padding-left: 10px; }