New post form

2 files changed, 41 insertions, 13 deletions

diff --git a/web/scripts3.js b/web/scripts3.js
index 3ad5a5cf..626c4020 100644
--- a/web/scripts3.js
+++ b/web/scripts3.js
@@ -44,7 +44,29 @@ function wsSendKeepAlive() {
 /******************************************************************************/
 
 function postformListener(formEl,ev) {
-    if(ev.ctrlKey && (ev.keyCode==10 || ev.keyCode==13)) formEl.submit();
+    if(ev.ctrlKey && (ev.keyCode==10 || ev.keyCode==13)) {
+        if(!formEl.onsubmit || formEl.onsubmit()) {
+            formEl.submit();
+        }
+    }
+}
+
+function unfoldPostForm() {
+    if(window.location.pathname==="/" && window.location.hash==="#post") {
+        $('#newmessage>div').css('display','block');
+        $('#newmessage textarea')[0].focus();
+    }
+}
+
+function onsubmitNewMessage() {
+    if($('#newmessage .tags').val().length==0) {
+        openDialog('<p class="dialogtxt">Пожалуйста, введите теги сообщения</p>');
+        return false;
+    } else if($('#newmessage textarea').val().length==0) {
+        openDialog('<p class="dialogtxt">Пожалуйста, введите текст сообщения</p>');
+        return false;
+    }
+    return true;
 }
 
 function showMoreReplies(id) {
@@ -490,29 +512,26 @@ jQuery.fn.selectText = function(){
 /******************************************************************************/
 
 $(document).ready(function() {
-    var tareply=$('textarea.reply');
-    tareply.autoResize({
+    $('textarea').autoResize({
         extraSpace: 0,
         minHeight: 1
     });
-    tareply.click(function () {
+
+    $('textarea.reply').click(function () {
         $(this).addClass("narrow");
         $(this).after('<div class="attach-photo" onclick="attachCommentPhoto(this)"/>');
         $(this).parent().after('<input type="submit" value="OK"/>');
         $(this).off('click');
     });
     
-    var pmreply=$('textarea.replypm');
-    pmreply.autoResize({
-        extraSpace: 0,
-        minHeight: 1
-    });
-    pmreply.click(function () {
+    $('textarea.replypm').click(function () {
         $(this).addClass("narrowpm");
         $(this).parent().after('<input type="submit" value="OK"/>');
         $(this).off('click');
     });
     
+    unfoldPostForm();
     unfoldReply();
+    $(window).bind('hashchange',unfoldPostForm);
     $(window).bind('hashchange',unfoldReply);
 });
diff --git a/web/style3.css b/web/style3.css
index 2fdcb5e3..b90d849e 100644
--- a/web/style3.css
+++ b/web/style3.css
@@ -1,5 +1,5 @@
 html,body,div,h1,h2,ul,li,p,form,input,textarea,pre { margin: 0; padding: 0; }
-html,input { font-family: sans-serif; font-size: 12pt; }
+html,input,textarea { font-family: sans-serif; font-size: 12pt; }
 html { background: #EEEEE5; color: #000; }
 body { width: 1010px; margin: 0 auto; }
 h1,h2 { font-weight: normal; }
@@ -38,6 +38,14 @@ body>header p { color: #000; font-size: 13pt; margin: 12px 0; text-align: center
 
 #content>p, #content>h1, #content>h2 { margin: 1em 0; }
 
+#newmessage { background: #E5E5E0; padding: 15px; margin-bottom: 20px; text-align: right; }
+#newmessage textarea { border: 1px solid #CCC; padding: 4px; width: 660px; resize: vertical; min-height: 14pt; height: 14pt; }
+#newmessage>div { display: none; margin-top: 8px; }
+#newmessage input { border: 1px solid #CCC; padding: 2px 4px; }
+#newmessage .tags { width: 400px; float: left; }
+#newmessage .attach-photo, #newmessage .attach-photo-active { margin-right: 10px; }
+#newmessage .subm { width: 120px; 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>aside img { width: 48px; height: 48px; }
@@ -84,8 +92,8 @@ article input { width: 50px; margin-left: 6px; vertical-align: top; border: 1px
 .msg-comment textarea { width: 604px; padding: 2px; resize: vertical; vertical-align: top; min-height: 12pt; height: 12pt; border: 0; }
 .msg-comment .narrow { width: 524px; }
 .msg-comment .narrowpm { width: 550px; }
-.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; }
+.attach-photo { display: inline-block; padding: 2px 4px; cursor: pointer; width: 16px; height: 13px; overflow: hidden; 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; overflow: hidden; 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; }
@@ -149,6 +157,7 @@ blockquote { border-left: 1px dashed #CCC; margin: 10px 0 10px 10px; padding-lef
 .dialogshare li { float: left; margin: 5px 10px 0 0; }
 .dialogshare a { display: block; width: 32px; height: 32px; background-image: url(//static.juick.com/sharesocial.png); }
 
+.dialogtxt { background: #EEEEE5; padding: 20px; }
 /********/
 
 #footer { clear: both; font-size: 10pt; padding: 10px 0; color: #999; }