From 145852361d049d4d51e727f7f62f970418f2a34a Mon Sep 17 00:00:00 2001 From: Ugnich Anton Date: Thu, 24 Oct 2013 02:14:29 +0700 Subject: PM on Home (initial) --- src/java/com/juick/http/www/Home.java | 14 +- src/java/com/juick/http/www/PageTemplates.java | 4 +- web/scripts3.js | 405 +++++++++++++++++++++++++ web/style3.css | 11 +- 4 files changed, 430 insertions(+), 4 deletions(-) diff --git a/src/java/com/juick/http/www/Home.java b/src/java/com/juick/http/www/Home.java index b9009a80..dae573ca 100644 --- a/src/java/com/juick/http/www/Home.java +++ b/src/java/com/juick/http/www/Home.java @@ -17,7 +17,9 @@ */ package com.juick.http.www; +import com.juick.json.Users; import com.juick.server.MessagesQueries; +import com.juick.server.PMQueries; import java.io.IOException; import java.io.PrintWriter; import java.sql.Connection; @@ -77,6 +79,15 @@ public class Home { PageTemplates.pageHead(out, title, null); PageTemplates.pageNavigation(out, locale, visitor, null); + ArrayList lastconv = PMQueries.getPMLastConversationsUsers(sql, visitor.UID, 10); + String lastConvJSON = Users.arrayToString(lastconv); + + out.println(""); + out.println("
"); out.println("
"); out.println("
"); @@ -101,13 +112,14 @@ public class Home { out.println("
"); out.println(" "); out.println("
"); + out.println("
    "); out.println("
    "); out.println("
    "); // topwrapper diff --git a/src/java/com/juick/http/www/PageTemplates.java b/src/java/com/juick/http/www/PageTemplates.java index 0c98f26f..3e08cd97 100644 --- a/src/java/com/juick/http/www/PageTemplates.java +++ b/src/java/com/juick/http/www/PageTemplates.java @@ -50,10 +50,10 @@ public class PageTemplates { out.println(""); out.print(""); out.print(""); - out.print(""); + out.print(""); out.print(""); out.print(""); - out.print(""); + out.print(""); if (headers != null) { out.print(headers); } diff --git a/web/scripts3.js b/web/scripts3.js index e1cc5952..9b16e33a 100644 --- a/web/scripts3.js +++ b/web/scripts3.js @@ -1,3 +1,406 @@ +var ws=null; +var currentPMUser=""; +var currentMID=0; + +/******************************************************************************/ + +function initWS() { + ws = new WebSocket("wss://ws.juick.com/?hash="+hash); + ws.onopen = function() { + $('#sidepanel').addClass('online'); + }; + ws.onclose = function() { + $('#sidepanel').removeClass('online'); + ws=null; + initWS(); + }; + ws.onmessage = function(msg) { + if(msg.data==' ') { + ws.send(' '); + } else { + try { + var jsonMsg=$.parseJSON(msg.data); + if(jsonMsg.rid>0) { + incomingComment(jsonMsg); + } else if(jsonMsg.mid>0) { + incomingPost(jsonMsg); + } else { + incomingPM(jsonMsg); + } + } catch(err) { + console.log(err); + } + } + }; + setInterval(wsSendKeepAlive, 90000); +} + +function wsSendKeepAlive() { + if(ws!=null) { + ws.send(' '); + } +} + +/******************************************************************************/ + +function initPMUList() { + var ul=$('#pmulist'); + ul.empty(); + $.each(lastConversations,function(i,item) { + var img=$("").attr("src","https://i.juick.com/as/"+item.uid+".png"); + var a=$("").attr("href","#").attr("onclick","return showPM('"+item.uname+"')"); + a.append(img).append(item.uname); + if(item.MessagesCount) { + a.append($("
    ").attr("class","unreadcnt").text(item.MessagesCount)); + } + var li=$("
  • ").append(a); + ul.append(li); + }); +} + +/******************************************************************************/ + +function incomingPost(msg) { + console.log(msg); + if(groups[0].MessagesCount>0) { + groups[0].MessagesCount++; + } else { + groups[0].MessagesCount=1; + } + initGroupsList(); +} + +function incomingComment(msg) { + console.log(msg); +} + +function showGroup(gid) { + currentPMUser=""; + currentMID=0; + groups[0].MessagesCount=0; + initGroupsList(); + + $.getJSON('https://api.juick.com/home?hash='+hash+'&callback=?').done(function(data) { + var ul=$('
      '); + ul.attr("id","msglist"); + $.each(data,function(i,item) { + var tags=""; + if(item.tags) { + $.each(item.tags,function(t,tag) { + tags+=" *"+tag; + }); + } + var photo=""; + if(item.photo) { + photo="
      "; + } + var replies=""; + if(item.replies>0) { + replies="
      "+item.replies+" "; + if(item.replies%10==1) { + replies+="reply"; + } else { + replies+="replies"; + } + replies+=" "; + if(item.repliesby) { + replies+=" by "+item.repliesby; + } + replies+="
      "; + } + var li=$("
    • ").attr("class","msg").html( + "
      "+ + "
      "+ + "
      "+ + "
      @"+item.user.uname+":"+tags+"
      "+ + "
      "+item.timestamp+"
      "+ + "
      "+ + "
      "+item.body+"
      "+ + photo+ + "
      "+ + replies + ); + ul.append(li); + }); + $('#toppanel').css("display","none"); + $('#bottompanel').css("display","none"); + var content=$('#content'); + content.attr("class",""); + content.empty(); + content.append(ul); + $(window).scrollTop(0); + }); + return false; +} + +function showMessages(param) { + currentPMUser=""; + currentMID=0; + $.getJSON('https://api.juick.com/messages?hash='+hash+'&'+param+'&callback=?').done(function(data) { + var ul=$('
        '); + ul.attr("id","msglist"); + $.each(data,function(i,item) { + var tags=""; + if(item.tags) { + $.each(item.tags,function(t,tag) { + tags+=" *"+tag+""; + }); + } + var photo=""; + if(item.photo) { + photo="
        "; + } + var replies=""; + if(item.replies>0) { + replies="
        "+item.replies+" "; + if(item.replies%10==1) { + replies+="reply"; + } else { + replies+="replies"; + } + replies+=" "; + if(item.repliesby) { + replies+=" by "+item.repliesby; + } + replies+="
        "; + } + var li=$("
      • ").attr("class","msg").html( + "
        "+ + "
        "+ + "
        "+ + "
        @"+item.user.uname+":"+tags+"
        "+ + "
        "+item.timestamp+"
        "+ + "
        "+ + "
        "+item.body+"
        "+ + photo+ + "
        "+ + replies + ); + ul.append(li); + }); + $('#toppanel').css("display","none"); + $('#bottompanel').css("display","none"); + var content=$('#content'); + content.attr("class",""); + content.empty(); + content.append(ul); + $(window).scrollTop(0); + }); + return false; +} + +/******************************************************************************/ + +function showUser(uname) { + showMessages('uname='+uname); + return false; +} + +/******************************************************************************/ + +function showMessage(mid) { + currentPMUser=""; + currentMID=mid; + $.getJSON('https://api.juick.com/thread?mid='+mid+'&hash='+hash+'&callback=?').done(function(data) { + var ul=$('
          '); + ul.attr("id","thread"); + + var post=data.shift(); + var tags=""; + if(post.tags) { + $.each(post.tags,function(t,tag) { + tags+=" *"+tag+""; + }); + } + var photo=""; + if(post.photo) { + photo="
          "; + } + var li=$("
        • ").attr("class","msg").html( + "
          "+ + "
          "+ + "
          "+ + "
          @"+post.user.uname+":"+tags+"
          "+ + "
          "+post.timestamp+"
          "+ + "
          "+ + "
          "+post.body+"
          "+ + photo+ + "
          " + ); + ul.append(li); + + var content=$('#content'); + var maxmargin=content.width()-li.width()-50; + + var start,end; + start=new Date(); + showThread(ul,data,0,20,maxmargin); + end=new Date(); + console.log("Execution time: "+(end.getTime()-start.getTime())); + + $('#toppanel').css("display","none"); + $('#bottompanel').css("display","none"); + content.attr("class",""); + content.empty(); + content.append($('
          ').attr("id","threadwrap").append(ul)); + $(window).scrollTop(0); + }); + return false; +} + +function showThread(ul,data,rid,margin,maxmargin) { + $.each(data,function(i,item) { + var replyto=item.replyto || 0; + if(replyto==rid) { + var photo=""; + if(item.photo) { + photo="
          "; + } + var li=$("
        • ").attr("class","msg").css("margin-left",margin).html( + "
          "+ + "
          "+ + "
          "+ + "
          @"+item.user.uname+":
          "+ + "
          "+item.timestamp+"
          "+ + "
          "+ + "
          "+item.body+"
          "+ + photo//+ + //"
          " + ); + ul.append(li); + + var newmargin=margin+20; + if(newmargin>maxmargin) { + newmargin=maxmargin; + } + showThread(ul,data.slice(i),item.rid,newmargin,maxmargin); + } + }); +} + +/******************************************************************************/ + +function incomingPM(msg) { + try { + if(msg.user.uname===currentPMUser) { + $('#pmlist').append($("
        • ").attr("class","pm-in").text(msg.body)); + $(window).scrollTop($(document).height()); + } else { + var modified=false; + $.each(lastConversations,function(i,item) { + if(item.uname===msg.user.uname) { + if(item.MessagesCount>0) { + item.MessagesCount++; + } else { + item.MessagesCount=1; + } + modified=true; + } + }); + if(!modified) { + lastConversations.unshift({ + uname:msg.user.uname, + uid:msg.user.uid, + MessagesCount:"1" + }); + } + initPMUList(); + } + } catch(err) { } +} + +function showPM(uname) { + currentMID=0; + + var modified=false; + $.each(lastConversations,function(i,item) { + if(item.uname===uname && item.MessagesCount>0) { + item.MessagesCount=0; + modified=true; + } + }); + if(modified) { + initPMUList(); + } + + $.getJSON('https://api.juick.com/pm?hash='+hash+'&uname='+uname+'&callback=?').done(function(data) { + var ul=$('
            '); + ul.attr("id","pmlist"); + $.each(data,function(i,item) { + var li=$("
          • "); + if(item.user.uid==user_id) { + li.attr("class","pm-out"); + } else { + li.attr("class","pm-in"); + } + li.text(item.body); + ul.append(li); + }); + + currentPMUser=uname; + +/* + var toppanel=$('#toppanel'); + toppanel.css("display","block"); + toppanel.html("

            "+uname+"

            "); + + var bottompanel=$('#bottompanel'); + bottompanel.html("\" id=\"replypmbutton\" onclick=\"return sendPM()\"/>"); + bottompanel.css("display","block"); +*/ + + var content=$('#content'); + content.empty(); + content.append(ul); + $(window).scrollTop($(document).height()); + //$('#replypmtext').focus(); + }); + return false; +} + +function sendPMformListener(formEl,ev) { + if(ev.ctrlKey && (ev.keyCode==10 || ev.keyCode==13)) { + sendPM(); + } +} + +function sendPM() { + var replypmtext=$('#replypmtext'); + var replypmbutton=$('#replypmbutton'); + replypmtext.prop('disabled', true); + replypmbutton.prop('disabled', true); + + var body=replypmtext.val(); + + $.ajax({ + url:"https://api.juick.com/pm", + type:"POST", + data:{ + hash:hash, + uname:currentPMUser, + body:body + }, + success:function(data) { + replypmtext.val(""); + $('#pmlist').append($("
          • ").attr("class","pm-out").text(body)); + $(window).scrollTop($(document).height()); + }, + error:function(jqxhr,status) { + alert("Error: "+status); + }, + complete:function() { + replypmtext.removeAttr("disabled"); + replypmbutton.removeAttr("disabled"); + replypmtext.focus(); + } + }); + return false; +} + +/******************************************************************************/ +/******************************************************************************/ +/******************************************************************************/ + function inlinevideo(mid) { var flashvars={ file:'http://i.juick.com/video/'+mid+'.mp4', @@ -401,6 +804,8 @@ jQuery.fn.selectText = function(){ /******************************************************************************/ $(document).ready(function() { + initPMUList(); + var tareply=$('textarea.reply'); tareply.autoResize({ extraSpace: 0, diff --git a/web/style3.css b/web/style3.css index cd66bc20..211c759c 100644 --- a/web/style3.css +++ b/web/style3.css @@ -93,6 +93,12 @@ blockquote { border-left: 1px dashed #CCC; margin: 10px 0 10px 10px; padding-lef /********/ +.pm-in,.pm-out { border: 1px solid #E0E0E0; margin: 10px 0; padding: 10px; } +.pm-in { width: 85%; background: #FFF; } +.pm-out { margin-left: 15%; background: #DFD; } + +/********/ + #column { width: 230px; top: 0; padding-top: 10px; overflow: hidden; } #column ul, #column p, #column hr { margin: 10px 0; } #column li { margin: 6px 0; } @@ -109,6 +115,9 @@ blockquote { border-left: 1px dashed #CCC; margin: 10px 0 10px 10px; padding-lef .abs { position: absolute; } .fix { position: fixed; } +#pmulist img { width: 32px; height: 32px; margin-right: 5px; vertical-align: middle; } +#pmulist .unreadcnt { float: right; margin-top: 4px; background: #CCC; padding: 2px 4px; } + /********/ #dialogb { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; opacity: 0.5; background: #000; z-index: 10; } @@ -134,7 +143,7 @@ blockquote { border-left: 1px dashed #CCC; margin: 10px 0 10px 10px; padding-lef #topwrapper { margin-top: 3em; } #header li { line-height: 42px; } - #search { position: absolute; left: 84px; right: 222px; min-width: 55px; } + #search { position: absolute; left: 84px; right: 222px; min-width: 32px; } #header a { padding: 0 7px; } #header .text { width: 100%; } #header label { display: none; } -- cgit v1.2.3