public/scripts/chatclient.js

   1 $expires = 30;       //クッキーの保持日数\r
   2 $afk_time = 1000 * 60 * 60;     //AFKと判定する時間（ミリ秒で指定すること）\r
   3 $log_file_name = "logfile%d.txt";       //ログファイル名(%dはそのままにしておくこと)\r
   4 $pastlogfile_pattern = "logfile%d(_+.*)?\.txt"; //過去ログと判定する正規表現\r
   5 $system_name = "system";        //システム発言を表す名前(chat.phpと同じにすること)\r
   6 $entered_message = "%sが入室しました";\r
   7 $quited_message = "%sが退室しました";\r
   8 $system_msg_color ="#000000";\r
   9 $profile_link = "/profile/detail?name=%n"       //プロフィールシステムへのリンク先（%nで名前を表す）\r
  10 $fanble_message = "[color=blue]%s ファンブル![/color]";\r
  11 $critical_message = "[color=red]%s クリティカル![/color]";\r
  12 $send_message = "%sからの送信　%s";\r
  13 $failed_connect_message = "接続に失敗しました";\r
  14 $invaild_name_message = "名前を空欄にすることはできません";\r
  15 $free_password1 = "最初に入室する人が自由にパスワードを設定できます";   //自由パスワードメッセージ１\r
  16 $free_password2 = "この部屋は使用されています。パスワードを入力してください";       //自由パスワードメッセージ２\r
  17 $fixed_password = "この部屋にはパスワードが設定されています";       //固定パスワードルーム\r
  18 $hidden_log_to_rom = "この部屋ではROMできないようになっています";    //ROM禁止ルーム\r
  19 $romcount_msg = "ROM(%d人)"    //ROMカウント\r
  20 \r
  21 //ここから先は変更しないでください\r
  22 $prefix_filelist = "!";\r
  23 $socket = new Object();\r
  24 $names = {};\r
  25 $roominfo = {};\r
  26 $romcount = 0;\r
  27 //ここまで\r
  28 \r
  29 $(document).ready(function(){\r
  30         CreateColorList();\r
  31 \r
  32         //クッキーからフォームに読み込む\r
  33         var temp = $.cookie("name");\r
  34         if(temp)        document.enter_form.name.value = temp;\r
  35         temp = $.cookie("color_index");\r
  36         if(temp)        document.enter_form.color.selectedIndex = temp;\r
  37 \r
  38         $("input[name=sid]").click(sidEventListener);\r
  39         $("input[name=enter]").click(enterEventListener);\r
  40         $("input[name=quit]").click(quitEventListener);\r
  41         $("input[name=help]").click(function(e){\r
  42                 $("#help_frame").css("display","block");\r
  43         });\r
  44         $("input[name=close]").click(function(e){\r
  45                 $("#help_frame").css("display","none");\r
  46         });\r
  47         $("#whisper_list_view").click(function(e){\r
  48                 $("#whisper_list").toggle();\r
  49         });\r
  50         $("#decoration_list_view").click(function(e){\r
  51                 $("#decoration_list").toggle();\r
  52         });\r
  53         document.chat_form.onsubmit = function(){return false;};\r
  54         document.enter_form.onsubmit = function(){return false;};\r
  55 \r
  56         $socket = io.connect(location.hostname  + "/" + document.chat_form.rno.value + "?token="+ encodeURIComponent(document.chat_form._csrf.value));\r
  57         $socket.on("error",getErrorMessage);\r
  58         $socket.on("send roominfo",sendRoomInfoListerner);\r
  59         $socket.on("send romcount",sendRomCountListerner);\r
  60         $socket.on("connect",function(){\r
  61                 $socket.on("req pastlog",pastLogEventListerner);\r
  62                 $socket.on("req msg",getMessageEventListerner);\r
  63         });\r
  64 });\r
  65 \r
  66 function sendRomCountListerner(count)\r
  67 {\r
  68         $romcount = count;\r
  69         createNameList();\r
  70 }\r
  71 \r
  72 function sendRoomInfoListerner(info)\r
  73 {\r
  74         $roominfo = info;\r
  75         var logflag = true;\r
  76         var msg = "";\r
  77         if(info.type == 1){\r
  78                 if(info.IsOwned)\r
  79                         msg = $free_password2;\r
  80                 else\r
  81                         msg = $free_password1;\r
  82                 logflag = false;\r
  83         }else if(info.type == 2){\r
  84                 msg = $fixed_password;\r
  85                 logflag = false;\r
  86         }else if(info.type == 3){\r
  87                 msg = $hidden_log_to_rom;\r
  88                 logflag = false;\r
  89         }\r
  90         if(msg != "")\r
  91                 $("#enter_message").append(msg);\r
  92         if(logflag)\r
  93         {\r
  94                 getCurretLog();\r
  95         }\r
  96 }\r
  97 \r
  98 function CreateColorList()\r
  99 {\r
 100         var c = new Array("00","33","66","99","CC","FF");\r
 101         for(var r = 0; r < c.length; r++){\r
 102                 for(var g = 0; g < c.length; g++){\r
 103                         for(var b = 0; b < c.length; b++){\r
 104                                 var t = document.createElement("option");\r
 105                                 t.value = "#"+c[r]+c[g]+c[b];\r
 106                                 t.style.backgroundColor = "#"+c[r]+c[g]+c[b];\r
 107                                 t.appendChild(document.createTextNode("#"+c[r]+c[g]+c[b]));\r
 108                                 $("#enter_frame form select[name=color]").append(t);\r
 109                         }\r
 110                 }\r
 111         }\r
 112 }\r
 113 \r
 114 function getCurretLog()\r
 115 {\r
 116         var rno = document.chat_form.rno.value;\r
 117         var url = sprintf($log_file_name,rno);\r
 118         $socket.emit("get pastLog",url);\r
 119 }\r
 120 \r
 121 function pastLogEventListerner(msg)\r
 122 {\r
 123         if(IsRomMode() && $roominfo.type != 0 && $roominfo.admin == false)\r
 124                 return;\r
 125         for(var i = 0; i < msg.length; i++)\r
 126                 ParseMessage(msg[i]);\r
 127         createNameList();\r
 128 }\r
 129 \r
 130 function getMessageEventListerner(msg)\r
 131 {\r
 132         if(IsRomMode() && $roominfo.type != 0)\r
 133                 return;\r
 134         ParseMessage(msg);\r
 135         createNameList();\r
 136         if( document.getElementById("bell").checked == true && msg.name != document.enter_form.name.value)\r
 137                 document.getElementById("NoticeSound").play();\r
 138 }\r
 139 \r
 140 var $messageTag = null;\r
 141 function ParseMessage(msg)\r
 142 {\r
 143         var util = new Util();\r
 144         msg.message = util.htmlspecialchars(msg.message);\r
 145         var childtag = $GetCommandParser.parse(msg);\r
 146 \r
 147         if(childtag == null)\r
 148                 return;\r
 149         if(typeof(childtag) == "string")\r
 150                 childtag = $("<span/>").append(childtag);\r
 151 \r
 152         var trtag = $("<tr/>");\r
 153         var namepart,msgpart;\r
 154 \r
 155         var color = $system_msg_color;\r
 156 \r
 157         var mailto = "";\r
 158         var date = new Date(Date.parse(msg.date));\r
 159         var name = util.htmlspecialchars(msg.name);\r
 160         if(name != $system_name)\r
 161         {\r
 162                 color = $names[name].color;\r
 163                 $names[name].time = date.getTime();\r
 164                 namepart = $("<a/>")\r
 165                         .attr("href",GetNameLink(name))\r
 166                         .attr("target","_blank")\r
 167                         .css("color",color)\r
 168                         .text(name);\r
 169         }else{\r
 170                 namepart = $("<span/>").append(name);\r
 171         }\r
 172         if(msg.ip != "")\r
 173                 namepart.append("@" + msg.ip);\r
 174         trtag.append($("<td/>").append(namepart));\r
 175 \r
 176         msgpart = childtag\r
 177                 .append("(" + date.toFormat("YYYY/MM/DD HH:MI:SS") +")")\r
 178                 .css("color",color);\r
 179         trtag.append($("<td/>").append(msgpart));\r
 180 \r
 181         if($messageTag == null)\r
 182                 $messageTag = $("#message");\r
 183 \r
 184         $messageTag.prepend(trtag);\r
 185 }\r
 186 \r
 187 function GetNameLink(name)\r
 188 {\r
 189         var util = new Util();\r
 190         if($names[name].mailto == "")\r
 191                 return $profile_link.replace("%n",encodeURIComponent(name));\r
 192         return "mailto:" + util.htmlspecialchars($names[name].mailto);\r
 193 }\r
 194 \r
 195 function createNameList()\r
 196 {\r
 197         var date = new Date();\r
 198         $("#whisper_list").empty();\r
 199         $("#whisper_list").append("<ul></ul>");\r
 200 \r
 201         $("#namelist").empty();\r
 202         $("#namelist").append("<ul></ul>");\r
 203         $("#namelist > ul").append($("<li/>").append(sprintf($romcount_msg,$romcount)));\r
 204 \r
 205         for(var name in $names)\r
 206         {\r
 207                 var diff = date.getTime() - $names[name].time;\r
 208                 if(diff >= $afk_time)\r
 209                         continue;\r
 210                 if(name != $system_name)\r
 211                 {\r
 212                         var atag = $("<a/>")\r
 213                                 .attr("href",GetNameLink(name))\r
 214                                 .attr("target","_blank")\r
 215                                 .css("color",$names[name].color)\r
 216                                 .text(name);\r
 217                         var spantag = $("<span/>")\r
 218                                 .click(clickNameEventListener)\r
 219                                 .text(name);\r
 220                         $("#whisper_list > ul").append($("<li/>").append(spantag));\r
 221                         $("#namelist > ul").append($("<li/>").append(atag));\r
 222                 }\r
 223         }\r
 224 }\r
 225 \r
 226 function clickNameEventListener(e)\r
 227 {\r
 228         document.chat_form.message.value = "/tell " + $(this).text();\r
 229         document.chat_form.message.focus();\r
 230 }\r
 231 \r
 232 function AddBold()\r
 233 {\r
 234         var text = GetSelection(document.chat_form.message);\r
 235         ReplaceSelection(document.chat_form.message,sprintf("[b]%s[/b]",text));\r
 236 }\r
 237 \r
 238 function AddItalic()\r
 239 {\r
 240         var text = GetSelection(document.chat_form.message);\r
 241         ReplaceSelection(document.chat_form.message,sprintf("[i]%s[/i]",text));\r
 242 }\r
 243 \r
 244 function AddStrike()\r
 245 {\r
 246         var text = GetSelection(document.chat_form.message);\r
 247         ReplaceSelection(document.chat_form.message,sprintf("[s]%s[/s]",text));\r
 248 }\r
 249 \r
 250 function AddFontSize(size)\r
 251 {\r
 252         var text = GetSelection(document.chat_form.message);\r
 253         ReplaceSelection(document.chat_form.message,sprintf("[size=%f]%s[/size]",size,text));\r
 254 }\r
 255 \r
 256 function GetSelection(element)\r
 257 {\r
 258     if (document.selection) {\r
 259         element.focus();\r
 260         var sel = document.selection.createRange();\r
 261         return sel.text;\r
 262     } else if (element.selectionStart || element.selectionStart === 0) {\r
 263         var startPos = element.selectionStart;\r
 264         var endPos = element.selectionEnd;\r
 265         var scrollTop = element.scrollTop;\r
 266         return element.value.substring(startPos,endPos);\r
 267     }else{\r
 268         return "";\r
 269     }\r
 270 }\r
 271 \r
 272 function ReplaceSelection(element,text)\r
 273 {\r
 274     if (document.selection) {\r
 275         element.focus();\r
 276         var sel = document.selection.createRange();\r
 277         sel.text = text;\r
 278     } else if (element.selectionStart || element.selectionStart === 0) {\r
 279         var startPos = element.selectionStart;\r
 280         var endPos = element.selectionEnd;\r
 281         element.value = element.value.substring(0, startPos) + text + element.value.substring(endPos, element.value.length);\r
 282     } else{\r
 283        element.value = text;\r
 284     }\r
 285 }\r
 286 \r
 287 function enterEventListener()\r
 288 {\r
 289         if(document.enter_form.name.value == "")\r
 290         {\r
 291                 alert($invaild_name_message);\r
 292                 return;\r
 293         }\r
 294 \r
 295         $("#enter_frame").css("display","none");\r
 296         $("#chat_frame").css("display","block");\r
 297 \r
 298         var color = document.enter_form.color.options[document.enter_form.color.selectedIndex].value;\r
 299 \r
 300         $.cookie("name",document.enter_form.name.value,{ expires: $expires });\r
 301         $.cookie("color_index",document.enter_form.color.selectedIndex,{ expires: $expires });\r
 302 \r
 303         $socket.json.emit("join",{name:document.enter_form.name.value,color:color,mailto:document.enter_form.mailto.value,password:document.enter_form.password.value});\r
 304 }\r
 305 \r
 306 function quitEventListener(){\r
 307         $socket.json.emit("quit",{name:document.enter_form.name.value});\r
 308 \r
 309         $("#enter_frame").css("display","block");\r
 310         $("#chat_frame").css("display","none");\r
 311 \r
 312         if($roominfo.type != 0 && $roominfo.admin == false)\r
 313         {\r
 314                 $("#message").empty();\r
 315                 $("#namelist").empty();\r
 316                 $names = {};\r
 317                 createNameList();\r
 318         }\r
 319         else\r
 320                 $socket.json.emit("get pastLogList",{rno:document.chat_form.rno.value});\r
 321 }\r
 322 \r
 323 function sidEventListener(){\r
 324         var msg = {\r
 325                 name:document.enter_form.name.value,\r
 326                 message:document.chat_form.message.value\r
 327         };      \r
 328         msg.message = $PostCommandParser.parse(msg);\r
 329 \r
 330         if(msg.message != null && msg.message != "")\r
 331                 $socket.json.emit("send msg",msg);\r
 332 \r
 333         document.chat_form.message.value ="";\r
 334 }\r
 335 \r
 336 function ReflushChatMessage(flag)\r
 337 {\r
 338         if(flag)        $("#message").empty();\r
 339 }\r
 340 \r
 341 function getErrorMessage(text)\r
 342 {\r
 343         if(text == "")\r
 344                 alert($failed_connect_message);\r
 345         else\r
 346                 alert(text);\r
 347 }\r
 348 \r
 349 function IsRomMode()\r
 350 {\r
 351         return $("#chat_frame").css("display") == "none";\r
 352 }\r
 353 \r
 354 //NameCollectionクラス\r
 355 function GetNameCollection(text)\r
 356 {\r
 357         var output = new Array();\r
 358         var list = text.split("\n");\r
 359         for(var i = 0; i < list.length; i++)\r
 360         {\r
 361                 if(list[i] == "")\r
 362                         continue;\r
 363                 output.push(new NameElement(list[i]));\r
 364         }\r
 365         return output;\r
 366 }\r
 367 \r
 368 //\r
 369 // NamesElementsクラス\r
 370 //\r
 371 function NameElement(s)\r
 372 {\r
 373         this.data = s.split("<>");\r
 374         this.getName = function()\r
 375         {\r
 376                 return this.data[0];\r
 377         }\r
 378 }\r
 379 \r
 380 // NameInfoクラス\r
 381 function CreateNameInfo(time,color,mailto)\r
 382 {\r
 383         var result = { time:time,color:color,mailto:""};\r
 384         if(typeof(mailto) != "undifined")\r
 385                 result.mailto = mailto;\r
 386         return result;\r
 387 }\r
 388 \r
 389 //\r
 390 // Utilクラス\r
 391 //\r
 392 function Util()\r
 393 {\r
 394         this.get_random_number = function (a,b)\r
 395         {\r
 396                 return Math.floor(a + Math.random() * b);\r
 397         }\r
 398 \r
 399         this.htmlspecialchars = function (ch) {\r
 400                 ch = ch.replace(/&/g,"&amp;") ;\r
 401                 ch = ch.replace(/"/g,"&quot;") ;\r
 402                 ch = ch.replace(/'/g,"&#039;") ;\r
 403                 ch = ch.replace(/</g,"&lt;") ;\r
 404                 ch = ch.replace(/>/g,"&gt;") ;\r
 405           return ch ;\r
 406         }\r
 407 \r
 408 }\r