Ajax IM For UCenter Home มาทำห้องสนทนากัน

acaz

Original

1. http://www.discuz.net/thread-1096971-1-1.html

คัดลอกไปที่คลิปบอร์ด

Original Ajax IM Chat

1. http://www.ajaxim.com/

คัดลอกไปที่คลิปบอร์ด

Screen Shout


Demo
http://www.czspaces.com
เข้าระบบ แล้วคลิ๊กที่เมนู เลือกห้องสนทนา

หากคุณเคยเล่น MSN ตัวนี้ละม้ายคล้ายๆ กันครับ

1. ดาวน์โหลดไฟลล์ด้านล่าง
2. ทำการแตกไฟลล์
เปิดไฟลล์ config_im.php
แก้ไข

1. $sql_user   = 'USER';              //User DB
   
2. $sql_pass   = 'PASS';              //PASS DB
   
3. $sql_host   = 'localhost';            
   
4. $sql_db     = 'DB';                 //DB

คัดลอกไปที่คลิปบอร์ด

เปิดไฟลล์ js/config.js
แก้ไขโดเมน

1. var yourdomain              = 'localhost';         // ajax im theme

คัดลอกไปที่คลิปบอร์ด

รวมไปถึงการตั้งค่าต่างๆ อยู่ที่ไฟลล์นี้ครับ
บันทึก

3. อัพโหลดไฟลล์และโฟเดอร์ที่อยู่ใน โฟเดอร์ Upload ขึ้นไปยัง
root ของ ucenter home

4. เข้าระบบ phpMyadmin
แล้วอัพเดทฐานข้อมูลด้วยไฟลล์ sql ที่อยู่ในโฟเดอร์ SQL
หรือคัดลอกจากที่นี่ไป

1. #
   
2. # โครงสร้างตาราง `uchome_messages`
   
3. #
   
4. 
   
5. CREATE TABLE IF NOT EXISTS `uchome_messages` (
   
6.   `recipient` text,
   
7.   `sender` text,
   
8.   `message` text,
   
9.   `type` text,
   
10.   `stamp` text,
    
11.   `id` bigint(20) unsigned NOT NULL auto_increment,
    
12.   UNIQUE KEY `id` (`id`)
    
13. ) TYPE=MyISAM;
    
14. 
    
15. #
    
16. # โครงสร้างตาราง `uchome_backmessages`
    
17. #
    
18. 
    
19. CREATE TABLE IF NOT EXISTS `uchome_backmessages` (
    
20.   `recipient` text,
    
21.   `sender` text,
    
22.   `message` text,
    
23.   `type` text,
    
24.   `stamp` text,
    
25.   `id` bigint(20) unsigned NOT NULL auto_increment,
    
26.   UNIQUE KEY `id` (`id`)
    
27. ) TYPE=MyISAM;
    
28. 
    
29. 
    
30. #
    
31. # เพิ่มฟิลด์โครงสร้างตาราง `uchome_member`
    
32. #
    
33. 
    
34. ALTER TABLE `uchome_member` ADD `email` mediumtext;
    
35. ALTER TABLE `uchome_member` ADD `is_online` int(11) default 0;
    
36. ALTER TABLE `uchome_member` ADD `last_ping` text;
    
37. ALTER TABLE `uchome_member` ADD `last_ip` varchar(15) default NULL;
    
38. ALTER TABLE `uchome_member` ADD `banned` tinyint(1) default 0;
    
39. ALTER TABLE `uchome_member` ADD `admin` tinyint(1) default 0;
    
40. ALTER TABLE `uchome_member` ADD `buddyicon` varchar(4) default 'none';
    
41. ALTER TABLE `uchome_member` ADD `profile` text;
    
42. 
    
43. #
    
44. # โครงสร้างตาราง `uchome_chats`
    
45. #
    
46. 
    
47. CREATE TABLE IF NOT EXISTS `uchome_chats` (
    
48.   `room` text,
    
49.   `user` text,
    
50.   `id` bigint(20) unsigned NOT NULL auto_increment,
    
51.   UNIQUE KEY `id` (`id`)
    
52. ) TYPE=MyISAM;
    
53. 
    
54. #
    
55. # โครงสร้างตาราง `uchome_buddylists`
    
56. #
    
57. 
    
58. CREATE TABLE IF NOT EXISTS `uchome_buddylists` (
    
59.   `id` int(11) NOT NULL auto_increment,
    
60.   `user` varchar(255) NOT NULL default '',
    
61.   `buddy` varchar(255) NOT NULL default '',
    
62.   `group` varchar(100) NOT NULL default '',
    
63.   PRIMARY KEY  (`id`),
    
64.   KEY `user` (`user`,`group`)
    
65. ) TYPE=MyISAM;
    
66. 
    
67. #
    
68. # โครงสร้างตาราง `uchome_blocklists`
    
69. #
    
70. 
    
71. CREATE TABLE IF NOT EXISTS `uchome_blocklists` (
    
72.   `id` int(11) NOT NULL auto_increment,
    
73.   `user` varchar(100) NOT NULL default '',
    
74.   `buddy` varchar(100) NOT NULL default '',
    
75.   PRIMARY KEY  (`id`),
    
76.   KEY `user` (`user`,`buddy`)
    
77. ) TYPE=MyISAM;
    
78. 
    
79. #
    
80. # อัพเดทโครงสร้างตาราง `uchome_member`
    
81. #
    
82. 
    
83. UPDATE `uchome_member` set admin=1 where username='เปลี่ยนชื่อเป็น uid แรกของคุณใน uch';

คัดลอกไปที่คลิปบอร์ด

ตรง

1. UPDATE `uchome_member` set admin=1 where username='เปลี่ยนชื่อเป็น uid แรกของคุณใน uch';

คัดลอกไปที่คลิปบอร์ด

อย่าลืมเปลี่ยนเป็นชื่อของคุณนะครับ
ผมแยก SQL มาทำใหม่
ไม่แนะนำให้ติดตั้งผ่าน install.php ครับ

เปิดไฟลล์
header.htm ใน template ucenter home ที่คุณใช้งาน
ค้นหา

1. <script language="javascript" type="text/javascript" src="source/script_face.js"></script>

คัดลอกไปที่คลิปบอร์ด

เพิ่มในบรรทัดต่อไป

1. <script src="js/prototype.js" type="text/javascript"></script>
   
2. <script src="js/effects.js" type="text/javascript"></script>
   
3. <script src="js/window.js" type="text/javascript"></script>
   
4. <script src="js/sm2.js" type="text/javascript"></script>
   
5. <script src="js/utils.js" type="text/javascript"></script>
   
6. <script src="js/config.js" type="text/javascript"></script>
   
7. <script src="js/im.basic.js" type="text/javascript"></script>
   
8. <script src="js/ajax_im.js" type="text/javascript"></script>
   
9. <script >
   
10. function isgoodok(){return true;}
    
11. window.onerror=isgoodok;
    
12. </script>

คัดลอกไปที่คลิปบอร์ด

เปิดไฟลล์ footer.htn ใน template ucenter home ที่คุณใช้งาน
เพิ่มโค๊ดต่อไปนี้

1. <div align="left">
   
2. <div id="modal" style="display:none;" align="left">
   
3.    <div id="loginDialog" style="display:none;" align="left">
   
4.      
   
5.       <p style="display:none;"><span id="login_error_msg" class="dialog_error" style="display:none">&nbsp;</span></p>
   
6. 
   
7.       <p style="display:none;" > <span class="dialog_input"><input type="text" id="username"  style="display:block" /></span></p>
   
8.       <div style="clear:both"></div>
   
9.       <p style="display:none;" ><span class="dialog_label lang-password langinsert-pre">:</span> <span class="dialog_input"><input type="password" id="password" onfoucs="this.select();" onkeypress="System.keyHandler(event, System.login);" /></span></p>
   
10.       <div style="clear:both;display:none;"></div>
    
11.       <p style="display:none;" >
    
12.          <span id="login_dialog_links" class="dialog_links" style="width:285px;" onselectstart="return false;" onmousedown="return false;" style="display:block" >
    
13.             <a href="#" class="stdButton lang-signOn" id="signon_button" onclick="System.login();return false;" onmouseover="ButtonCtl.hover(this);" onmousedown="ButtonCtl.down(this);" onmouseup="ButtonCtl.normal(this);" onmouseout="ButtonCtl.normal(this);"></a>
    
14.             <a href="#" class="stdButton lang-register registerObject" onclick="Dialogs.register();return false;" onmouseover="ButtonCtl.hover(this);" onmousedown="ButtonCtl.down(this);" onmouseup="ButtonCtl.normal(this);" onmouseout="ButtonCtl.normal(this);"></a>
    
15.             <a href="#" class="stdButton lang-forgotPassword langinsert-pre" onclick="Dialogs.forgotPass();return false;" onmouseover="ButtonCtl.hover(this);" onmousedown="ButtonCtl.down(this);" onmouseup="ButtonCtl.normal(this);" onmouseout="ButtonCtl.normal(this);"> </a>
    
16.          </span>
    
17.       </p>
    
18.       <div style="clear:both;display:none;"></div>
    
19.    </div>
    
20.    
    
21.    <div id="registerDialog" class="registerObject" style="display:none;" align="left">
    
22.       <p><span class="dialog_modal_title lang-register"></span></p>
    
23.       <div style="clear:both;display:none;"></div>
    
24.       <p><span id="register_error_msg" class="dialog_error" style="display:none">&nbsp;</span></p>
    
25.       <div style="clear:both;display:none;"></div>
    
26.       <p><span class="dialog_label lang-username langinsert-pre">:</span> <span class="dialog_input"><input type="text" id="newusername" onkeypress="System.keyHandler(event, System.register);" /></span></p>
    
27.       <div style="clear:both;display:none;"></div>
    
28.       <p><span class="dialog_label lang-password langinsert-pre">:</span> <span class="dialog_input"><input type="password" id="newpassword" onkeypress="System.keyHandler(event, System.register);" /></span></p>
    
29.       <div style="clear:both;display:none;"></div>
    
30.       <p><span class="dialog_label lang-confirm langinsert-pre">:</span> <span class="dialog_input"><input type="password" id="newpassword2" onkeypress="System.keyHandler(event, System.register);" /></span></p>
    
31.       <div style="clear:both"style="display:none;"></div>
    
32.       <p><span class="dialog_label lang-email langinsert-pre">:</span> <span class="dialog_input"><input type="text" id="newemail" onkeypress="System.keyHandler(event, System.register);" /></span></p>
    
33.       <div style="clear:both;display:none;"></div>
    
34.       <p>
    
35.          <span class="dialog_links" style="width:190px;" onselectstart="return false;" onmousedown="return false;">
    
36.             <a href="#" class="stdButton lang-register" id="register_button" onclick="System.register();return false;" onmouseover="ButtonCtl.hover(this);" onmousedown="ButtonCtl.down(this);" onmouseup="ButtonCtl.normal(this);" onmouseout="ButtonCtl.normal(this);"></a>
    
37.             <a href="#" class="stdButton lang-cancel" onclick="Dialogs.login();return false;" onmouseover="ButtonCtl.hover(this);" onmousedown="ButtonCtl.down(this);" onmouseup="ButtonCtl.normal(this);" onmouseout="ButtonCtl.normal(this);"></a>
    
38.          </span>
    
39.       </p>
    
40.       <div style="clear:both;display:none;"></div>
    
41.    </div>
    
42.    
    
43.    <div id="forgotPassDialog" style="display:none;" align="left">
    
44.       <p><span class="dialog_modal_title lang-passwordReset"></span></p>
    
45.       <div style="clear:both;display:none;"></div>
    
46.       <p><span id="forgotpass_error_msg" class="dialog_error" style="display:none">&nbsp;</span></p>
    
47.       <div style="clear:both;display:none;"></div>
    
48.       <p><span class="dialog_label lang-emailAddress langinsert-pre">: </span> <span class="dialog_input"><input type="text" id="resetto" onkeypress="System.keyHandler(event, System.resetPass);" /></span></p>
    
49.       <div style="clear:both;display:none;"></div>
    
50.       <p>
    
51.          <span class="dialog_links" style="width:190px;" onselectstart="return false;" onmousedown="return false;" style="display:none;">
    
52.             <a href="#" class="stdButton lang-reset" id="forgotpass_button" onclick="System.resetPass();return false;" onmouseover="ButtonCtl.hover(this);" onmousedown="ButtonCtl.down(this);" onmouseup="ButtonCtl.normal(this);" onmouseout="ButtonCtl.normal(this);"></a>
    
53.             <a href="#" class="stdButton lang-cancel" onclick="Dialogs.login();return false;" onmouseover="ButtonCtl.hover(this);" onmousedown="ButtonCtl.down(this);" onmouseup="ButtonCtl.normal(this);" onmouseout="ButtonCtl.normal(this);"></a>
    
54.          </span>
    
55.       </p>
    
56.       <div style="clear:both;display:none;"></div>
    
57.    </div>
    
58. </div>
    
59. 
    
60. 
    
61. <div class="itemList" id="statusList" style="display:none;" align="left">
    
62.    <a href="#" class="lang-available langinsert-post" onclick="Status.set(0, Languages.get('available'));return false;"><img src="/themes/dark/online.png" style="border:0;" alt="" title="" />&nbsp;&nbsp;</a>
    
63.    <a href="#" class="lang-friendsOnly langinsert-post" style="border-bottom: 1px solid #bfbcb8;" onclick="Status.set(99, Languages.get('friendsOnly'));return false;"><img src="/themes/dark/online.png" style="border:0;" alt="" title="" />&nbsp;&nbsp;</a>
    
64.    <a href="#" class="lang-busy langinsert-post" onclick="Status.set(1, Languages.get('busy'));return false;"><img src="/themes/dark/away.png" style="border:0;" alt="" title="" />&nbsp;&nbsp;</a>
    
65.    <a href="#" class="lang-beBackLater langinsert-post" onclick="Status.set(1, Languages.get('beBackLater'));return false;"><img src="/themes/dark/away.png" style="border:0;" alt="" title="" />&nbsp;&nbsp;</a>
    
66.    <a href="#" class="lang-away langinsert-post" onclick="Status.set(1, Languages.get('away'));return false;"><img src="/themes/dark/away.png" style="border:0;" alt="" title="" />&nbsp;&nbsp;</a>
    
67.    <a href="#" class="lang-custom langinsert-post" id="customMessage" style="border-top: 1px solid #bfbcb8;" onclick="Status.customAway();$('statusList').style.display='none';return false;"><img src="/themes/dark/away.png" style="border:0;" alt="" title="" />&nbsp;&nbsp;</a>
    
68.    <a href="#" class="lang-invisible langinsert-post" style="border-top: 1px solid #bfbcb8;" onclick="Status.set(49, Languages.get('invisible'));return false;"><img src="/themes/dark/offline.png" style="border:0;" alt="" title="" />&nbsp;&nbsp;</a>
    
69. </div>
    
70. <div class="itemList" id="fontsList" style="display:none;" align="left">
    
71.    <a href="#" onclick="IM.active.setFont('Song');return false;">Song</a>
    
72.    <a href="#" onclick="IM.active.setFont('Italics');return false;">Italics</a>
    
73.    <a href="#" onclick="IM.active.setFont('Lishu');return false;">Lishu</a>   
    
74.    <a href="#" onclick="IM.active.setFont('Bold');return false;">Bold</a>
    
75.    <a href="#" onclick="IM.active.setFont('Arial');return false;">Arial</a>
    
76.    <a href="#" onclick="IM.active.setFont('Comic Sans MS');return false;">Comic Sans MS</a>
    
77.    <a href="#" onclick="IM.active.setFont('Courier New');return false;">Courier New</a>
    
78.    <a href="#" onclick="IM.active.setFont('Garamond');return false;">Garamond</a>
    
79.    <a href="#" onclick="IM.active.setFont('Georgia');return false;">Georgia</a>
    
80.    <a href="#" onclick="IM.active.setFont('Impact');return false;">Impact</a>
    
81.    <a href="#" onclick="IM.active.setFont('Tahoma');return false;">Tahoma</a>
    
82.    <a href="#" onclick="IM.active.setFont('Times New Roman');return false;">Times New Roman</a>
    
83.    <a href="#" onclick="IM.active.setFont('Verdana');return false;">Verdana</a>
    
84. </div>
    
85. <div class="itemList" id="fontSizeList" oncontextmenu="return false;" style="display:none;" align="left">
    
86.    <a href="#" onclick="IM.active.setFontSize(8);return false;">8</a>
    
87.    <a href="#" onclick="IM.active.setFontSize(10);return false;">10</a>
    
88.    <a href="#" onclick="IM.active.setFontSize(12);return false;">12</a>
    
89.    <a href="#" onclick="IM.active.setFontSize(14);return false;">14</a>
    
90.    <a href="#" onclick="IM.active.setFontSize(16);return false;">16</a>
    
91.    <a href="#" onclick="IM.active.setFontSize(18);return false;">18</a>
    
92.    <a href="#" onclick="IM.active.setFontSize(20);return false;">20</a>
    
93.    <a href="#" onclick="IM.active.setFontSize(22);return false;">22</a>
    
94.    <a href="#" onclick="IM.active.setFontSize(24);return false;">24</a>
    
95. </div>
    
96. <div class="itemList" id="fontColorList" style="cursor: pointer;display:none;" align="left">
    
97.    <table class="tTable">
    
98.       <tr>
    
99.          <td class="colorItem" style="width:13px;height:13px;border:1px solid #000;background-color:#000000;" onclick="IM.active.setFontColor('#000000');"></td>
    
100.          <td class="colorItem" style="width:13px;height:13px;border:1px solid #000;background-color:#b8b8b8;" onclick="IM.active.setFontColor('#b8b8b8');"></td>
     
101.          <td class="colorItem" style="width:13px;height:13px;border:1px solid #000;background-color:#b4ad3b;" onclick="IM.active.setFontColor('#b4ad3b');"></td>
     
102.          <td class="colorItem" style="width:13px;height:13px;border:1px solid #000;background-color:#bb5c54;" onclick="IM.active.setFontColor('#bb5c54');"></td>
     
103.          <td class="colorItem" style="width:13px;height:13px;border:1px solid #000;background-color:#755a5c;" onclick="IM.active.setFontColor('#755a5c');"></td>
     
104.       </tr>
     
105.       <tr>
     
106.          <td class="colorItem" style="width:13px;height:13px;border:1px solid #000;background-color:#a9b5ef;" onclick="IM.active.setFontColor('#a9b5ef');"></td>
     
107.          <td class="colorItem" style="width:13px;height:13px;border:1px solid #000;background-color:#d65a20;" onclick="IM.active.setFontColor('#d65a20');"></td>
     
108.          <td class="colorItem" style="width:13px;height:13px;border:1px solid #000;background-color:#e39230;" onclick="IM.active.setFontColor('#e39230');"></td>
     
109.          <td class="colorItem" style="width:13px;height:13px;border:1px solid #000;background-color:#a71334;" onclick="IM.active.setFontColor('#a71334');"></td>
     
110.          <td class="colorItem" style="width:13px;height:13px;border:1px solid #000;background-color:#590099;" onclick="IM.active.setFontColor('#590099');"></td>
     
111.       </tr>
     
112.       <tr>
     
113.          <td class="colorItem" style="width:13px;height:13px;border:1px solid #000;background-color:#d40088;" onclick="IM.active.setFontColor('#d40088');"></td>
     
114.          <td class="colorItem" style="width:13px;height:13px;border:1px solid #000;background-color:#0030ac;" onclick="IM.active.setFontColor('#0030ac');"></td>
     
115.          <td class="colorItem" style="width:13px;height:13px;border:1px solid #000;background-color:#676f11;" onclick="IM.active.setFontColor('#676f11');"></td>
     
116.          <td class="colorItem" style="width:13px;height:13px;border:1px solid #000;background-color:#769321;" onclick="IM.active.setFontColor('#769321');"></td>
     
117.          <td class="colorItem" style="width:13px;height:13px;border:1px solid #000;background-color:#3966fe;" onclick="IM.active.setFontColor('#3966fe');"></td>
     
118.       </tr>
     
119.    </table>
     
120. </div>
     
121. <div class="itemList" id="divContext" oncontextmenu="return false;" style="display:none;" align="left">
     
122.    <a href="#" class="lang-contextGetInfo" onclick="Context.profile();return false;"></a>
     
123.    <a href="#" class="lang-contextIM" onclick="Context.createIM();return false;"></a>
     
124.    <a href="#" id="contextBlock" class="lang-contextBlock" onclick="Context.blockBuddy();return false;"></a>
     
125.    <a href="#" class="lang-contextRemove" onclick="Context.removeBuddy();return false;"></a>
     
126. </div>
     
127. <div id="languageList" style="display:none;" align="left">
     
128. </div>
     
129. </div>

คัดลอกไปที่คลิปบอร์ด

ก่อน

1. </body>

คัดลอกไปที่คลิปบอร์ด

เพิ่มเมนู
ค้นหา

1. <li class="app-share"><a href="space.php?do=share"><img src="image/app/share.gif" alt="แชร์" />แชร์</a></li>

คัดลอกไปที่คลิปบอร์ด

เพิ่มโค๊ดนี้ในบรรทัดต่อไป

1. <li class="app-chat"> <a href="javascript:"  onclick="System.login('$_SGLOBAL[supe_username]','qwe');"><img src="image/app/chat.gif" alt="ห้องสนทนา" />ห้องสนทนา</a></li>

คัดลอกไปที่คลิปบอร์ด

บันทึกทั้งหมดทำการอัพเดทแคชไฟลล์
แล้วทดสอบครับ
((12))

Nuknan

สิ่งที่รอมานาน ~:1:~

buachompoox

อันนี้เห็นแว้บๆที่ discuz.net ท่านโจ้เอามาจนได้อิๆ ขอบคุณมากมายครับ (~63~)

nakeo

~:3:~



จะจิ๊กไปดีใหมนาาา

An_ant

ใครจะอาสามาทำให้เป็นตัวธรรมดามั่ง เห็นแล้วอิจฉา

networkthai

ปล่อยมาแล้ว ดีใจจัง

seasonchange

ขอบคุงคร้าบบบบบบบบบบบบบบบบ

new2007

ขอบคุณมากงับ

น่าสนใจมาก ๆ

adman

ใช้ db อันเดียวกับเว้บเราหรือเปล่าครับ
หรือว่าสร้าง db ขึ้นมาใหม่

pratoonap

ขอบคุณครับ