Ppjoke 0.1 (Web embedded chat) provides download

Ppjoke is a set of Ajax-based Web embedded chat Program Currently, ASP version download is provided. The. Net version has a higher load, but it is still being debugged. It has been dragging on for a long time and has been busy learning and has not been updated. Download is provided first.
In addition, we have been studying the persistent connection technology, the so-called push technology, and enterprise-class Ajax technologies such as jssocket. We hope to have experienced friends to talk about it.

Ppjoke
Features
Ajax-based technology
Mature and stable prototype/scriptaculous framework
Small Data transfer volume
Embedded page chat
Customize and highlight personalization
Supports skin replacement
Supported emojis
Drag and zoom
Change color

Ppjoke is rewritten based on the otalk I previously wrote. Demo address: Turn right --> it has been embedded in my blog.
Http://www.ppjoke.com
Ppjoke provides download for the entire site.
Modify the UI color
For details, see 'ppjoke/ppjoke.css 'in rar. You only need to change it to the website color.

Webpage integration description
Copy the ppjokein rarto the directory to be embedded.CodeCopy it to the embedded DIV in the webpage.Copy codeThe Code is as follows: <SCRIPT type = "text/JavaScript">
Document. Write ("<Div id = 'load'> loading... </div> ");
VaR style = Document. createelement ("Link ");
Style. rel = "stylesheet ";
Style. type = "text/CSS ";
Style. href = 'ppjoke/ppjoke.css ';
Style. Title = 'ppjob ';
VaR head = Document. getelementsbytagname ("head") [0];
Head. appendchild (style );
</SCRIPT>

<Script language = "JavaScript" type = "text/JavaScript" src = "ppjoke/lib/prototype. js"> </SCRIPT>

<SCRIPT type = "text/JavaScript" src = "ppjoke/src/scriptaculous. js? Load = effects, dragdrop, builder, controls, Slider "> </SCRIPT>

<Script language = "JavaScript" type = "text/JavaScript">

VaR talktime = 3500; // set the time interval for retrieving content
VaR talkpath = 'ppjoke/ppjoke. asp ';
VaR talkcolor = 'blue ';
VaR info_shaping = 'do not screen refresh ';
VaR info_talkfail = 'sending failed ';
VaR barinf_logining = 'logged in ';
VaR barinf_regging = 'registering ';
VaR barinf_neterro = 'data transmission error ';
VaR barinf_loginready = 'login successful ';
VaR barinf_loginerro = 'incorrect password ';
VaR barinf_blank = 'Enter the chat content ';
VaR barinf_logoutok = 'logout successful ';
VaR barinf_logouterro = 'logout failed ';
VaR barinf_regerro = 'user name already exists ';
VaR barinf_regok = 'registration successful, automatic login ';
VaR barinf_checkuser = 'automatic login in progress ';
VaR barinf_checkbad = 'illegal identity, please log on ';
VaR colorarr = ['red', 'Blue ', 'green', 'darkorange', 'black', 'teal', 'deppink ', 'bluevilet ', 'springgreen'];
VaR anonymous = 'anonymous ';

VaR COUNT = 0;
VaR lastworld = '';
VaR lastalk = '';
VaR lastworldtime = false;
VaR getmsgtime;
VaR nomemotimes = 0;
VaR cookiename;
VaR cookiepass;

// Event. Observe (window, 'load', ppjokeinit, false );

Function ppjokeinit (){
Talkcolor = colorarr [math. Round (math. Random () * 9)];
Window. setTimeout (getmsg, talktime );
$ ('Load'). style. Display = 'none ';
$ ('Ppjoke _ main'). style. Display = 'block ';
Event. Observe ('ppjoke _ sendbox', 'keylow', keydownall, false );
Field. Select ('tal ');
New draggable ('ppjoke _ main', {handle: 'ppjoke _ topbar '});
Createfacelist ();
Getcookie ();
Logined ();
}

VaR ppjokews = {
Letback: function (){
$ ('Ppjoke _ main'). style. Left = '';
$ ('Ppjoke _ main'). style. Top = '';
$ ('Ppjoke _ main'). style. zindex = '';
$ ('Ppjoke _ main'). style. width = '150px ';
$ ('Ppjoke _ msgbox'). style. Height = '200px ';
$ ('Ppjoke _ facediv '). style. Height = '100px ';
},
Letbig: function (){
$ ('Ppjoke _ main'). style. width = '580px ';
$ ('Ppjoke _ msgbox'). style. Height = '400px ';
$ ('Ppjoke _ facediv '). style. Height = '25px ';
}
}

Function keydownall (event ){
VaR E = event | window. event;
If (E. keycode = 13) {sendmsg ()}
}

Function logined (){
Function loginok (req ){
If (req. responsetext = "OK "){
$ ('Name'). value = cookiename;
$ ('Alogin '). style. Display = 'none ';
$ ('Ppjoke _ alogout'). style. Display = 'inline ';
$ ('Name'). Blur ();
$ ('Name'). Disabled = 'true ';
Field. Select ('tal ');
} Else {
}
}
If (cookiename ){
VaR timestamps = new date (). gettime () + math. Random ();
Creatinfo (barinf_checkuser );
VaR sendajax = new Ajax. Request (talkpath + '? Act = login × tamp = '+ timestamps, {method: 'post', parameters: 'regname =' + cookiename + "Pass =" + cookiepass, oncomplete: loginok });
}
}

// Obtain information
Function getmsg (){
VaR timestamps = new date (). gettime () + math. Random ();
VaR getajax = new Ajax. Request (talkpath + '? Act = getmsg × tamps = '+ timestamps, {method: 'get', parameters: '', onsuccess: showmsg });

Function showmsg (req ){

Window. setTimeout (getmsg, talktime );

VaR newmsg = eval ('+ Req. responsetext + ')');

Function appendtime (){
$ ('Ppjoke _ msgbox '). appendchild (builder. node ('P', {ID: 'thelasttime', style: 'background-color: # ffccff'}, 'message sending time: '+ lastworldtime ));
Appendtimok = true;
}

If (nomemotimes = 5) {appendtime (); nomemotimes = 0}
Nomemotimes? Nomemotimes ++: nomemotimes = 0;

// process chat Information
newmsg. MSG. each (function (data) {
If (nomemotimes> = 5) {element. remove ('thelasttime') ;}< br> nomemotimes = 1;
count ++;
var P = document. createelement ('P');
If (count % 2 = 0) {
element. addclassname (p, 'p1');
}else {
element. addclassname (p, 'p2');
}< br> var userspan = document. createelement ('span ');
var usertext = document. createtextnode (data. U + ':');
If (data. V = "true") {
userspan. appendchild (usertext);
}else {
userspan. style. color = '# cacaca';
userspan. appendchild (usertext);
}< br> var msgspan = document. createelement ('span ');
msg2face (data. m, msgspan);
msgspan. style. color = data. c;
P. appendchild (userspan);
P. appendchild (msgspan);
$ ('ppjoke _ msgbox '). appendchild (p);
lastworldtime = data. t;
}< br>);
$ ('ppjoke _ msgbox '). scrolltop = $ ('ppjoke _ msgbox '). scrollheight;
}< BR >}

// Send chat information to process local messages
Function sendmsg (){
If (! Field. Present ('tal', 'name', 'email ')){
Creatinfo (barinf_blank );
Return;
}

If (lastworld = form. serialize ('talkform ')){
Sysinf (info_shaping );
} Else {

If ($ ('thelasttime') {element. Remove ('thelasttime ');}

VaR timestamps = new date (). gettime () + math. Random ();
VaR sendajax = new Ajax. Request (talkpath + '? Act = sendmsg & color = '+ talkcolor +' × tamp = '+ timestamps, {method: 'post', parameters: form. serialize ('talk'), onfailure: ajaxerro });
Lastworld = form. serialize ('talkform ');
Lastalk = $ F ('tal ');

Count ++;
VaR P = Document. createelement ('P ');
If (count % 2 = 0 ){
Element. addclassname (p, 'p1 ');
} Else {
Element. addclassname (p, 'p2 ');
}
VaR userspan = Document. createelement ('span ');
VaR usertext = Document. createtextnode ($ F ('name') + ':');
If ($ ('name'). Disabled = true ){
Userspan. appendchild (usertext );
} Else {
Userspan. style. Color = '# cacaca ';
Userspan. appendchild (usertext );
}
VaR msgspan = Document. createelement ('span ');
Msg2face ($ F ('tal'), msgspan );
Msgspan. style. Color = talkcolor;
P. appendchild (userspan );
P. appendchild (msgspan );
$ ('Ppjoke _ msgbox'). appendchild (P );
}
Field. Clear ('tal ');
Field. Select ('tal ');
$ ('Ppjoke _ msgbox'). scrolltop = $ ('ppjoke _ msgbox'). scrollheight;

Function ajaxerro (){
Sysinf (info_talkfail );
}
}

// send login information
function sendlogin () {
var timestamps = new date (). gettime () + math. random ();
creatinfo (barinf_logining);
var sendajax = new Ajax. request (talkpath + '? Act = login × tamp = '+ timestamps, {method: 'post', parameters: form. serialize ('logform'), oncomplete: sendloginok});
function sendloginok (req) {
If (req. responsetext = "OK") {
creatinfo (barinf_loginready);
$ ('alogin '). style. display = 'none';
$ ('ppjoke _ alogout '). style. display = 'inline';
$ ('name '). value = $ F ('regname');
$ ('name '). blur ();
$ ('name '). disabled = 'true';
effect. slideup ('ppjoke _ logdiv ', {Duration: 1.0});
field. select ('tal');
creactcookie ();
}else {
creatinfo (barinf_loginerro );
}< BR >}

// send registration information
function sendreg () {
var timestamps = new date (). gettime () + math. random ();
creatinfo (barinf_regging);
var sendajax = new Ajax. request (talkpath + '? Act = reg × tamp = '+ timestamps, {method: 'post', parameters: form. serialize ('logform'), oncomplete: sendregok});
function sendregok (req) {
If (req. responsetext = "OK") {
creatinfo (barinf_regok);
$ ('alogin '). style. display = 'none';
$ ('ppjoke _ alogout '). style. display = 'inline';
$ ('name '). value = $ F ('regname');
$ ('name '). blur ();
$ ('name '). disabled = 'true';
effect. slideup ('ppjoke _ logdiv ', {Duration: 1.0});
field. select ('tal');
creactcookie ();
}else {
creatinfo (barinf_regerro );
}< BR >}

// send logout Information
function sendlogout () {
var timestamps = new date (). gettime () + math. random ();
var sendajax = new Ajax. request (talkpath + '? Act = logout × tamp = '+ timestamps, {method: 'get', parameters: '', oncomplete: sendlogoutok});
function sendlogoutok (req) {
If (req. responsetext = "OK") {
creatinfo (barinf_logoutok);
$ ('ppjoke _ logdiv '). style. display = 'none';
$ ('alogin '). style. display = 'inline';
$ ('ppjoke _ alogout '). style. display = 'none';
$ ('name '). value = anonymous;
$ ('name '). blur ();
$ ('name '). disabled = ''
field. select ('tal');
clearchat ();
}else {
creatinfo (barinf_logouterro );
}< BR >}

Function msg2face (MSG, element ){
VaR msgtext = $ A (msg. Match (/([^ \ [] *) (\ [\ D \])? /Gim ));
If (msgtext [0]) {
Msgtext. Each (function (Word ){
VaR section = word. Match (/([^ \ [] *) \ [? (\ D )? \]? /I );
If (Section [1]) {
VaR msgtext = Document. createtextnode (Section [1]);
Element. appendchild (msgtext );
}
If (Section [2]) {
Msgimg = Document. createelement ('img ');
Msgimg. setattribute ('src', 'ppjoke/images/smilies/face_'?section=2}}'.gif ');
Element. appendchild (msgimg );
}
}
);
} Else {
Element. appendchild (document. createtextnode (MSG ));
}
}

Function creatinfo (text ){
$ ('Ppjoke _ otherinf '). innerhtml = text;
Window. setTimeout (function () {$ ('ppjoke _ otherinf '). innerhtml = ""}, 5000 );
}

Function sysinf (text ){
VaR P = builder. node ('P', {style: 'background-color: yellow'}, [builder. node ('span ', {style: 'color: red'}, 'system'), builder. node ('span ', {style: 'color: Blue'}, text)]);
$ ('Ppjoke _ msgbox'). appendchild (P );
$ ('Ppjoke _ msgbox'). scrolltop = $ ('ppjoke _ msgbox'). scrollheight;
}

Ajax. Responders. Register (
{
Oncreate: function (){
// Creatinfo (nomemotimes );
$ ('Ajaxing'). Show ();
},
Oncomplete: function (){
If (Ajax. activerequestcount = 0 ){
$ ('Ajaxing'). Hide ();
}
}
}
);

Function createfacelist (){
For (I = 1; I <= 24; I ++ ){
VaR J = I
If (j <10) {J = '0' + I}
VaR A = builder. node ('A', {href: '#'}, [builder. node ('img ', {SRC: 'ppjoke/images/smilies/face_'{j}'.gif'}, []);
A. Alt = J;
A. onclick = function () {$ ('tal '). value = $ F ('tal') + '[' + this. alt + ']'; field. focus ('tal'); Return false ;};
VaR li = builder. node ('lil', {}, [a]);
$ ('Ppjoke _ facelist'). appendchild (LI );
}
}

Function changecolor (color ){
Talkcolor = color;
}

Function creactcookie (){
VaR mydate = new date ();
Mydate. settime (mydate. gettime () + 48x60*60*100 );
Document. Cookie = "ppjokeusername =" + escape ($ F ('regname') + "; expires =" + mydate. togmtstring ();
Document. Cookie = "ppjokepass =" + escape ($ F ('regpass ') + "; expires =" + mydate. togmtstring ();
}

Function getcookie (){
VaR value = Unescape (document. Cookie );
VaR namepos = value. indexof ("ppjokeusername = ");
If (namepos! =-1 ){
VaR start = namepos + 14;
VaR end = value. indexof (";", start );
If (END =-1) End = value. length;
Cookiename = value. substring (START, end );
}
VaR passpos = value. indexof ("ppjokepass = ");
If (passpos! =-1 ){
VaR start = passpos + 10;
VaR end = value. indexof (";", start );
If (END =-1) End = value. length;
Cookiepass = value. substring (START, end );
}
}

Function delcookie (sname, svalue ){
Document. Cookie = sname + "=" + escape (svalue) + "; expires = Fri, 31 Dec 1999 23:59:59 GMT ;";
}

Function clearchat (){
VaR PS = $ A ($ ('ppjoke _ msgbox'). getelementsbytagname ('P '));
PS. Each (function (p ){
Element. Remove (P );
}
);
}

</SCRIPT>

<Div id = "ppjoke">

<Div id = "ppjoke_main">
<Div id = "ppjoke_topbar"> <a href = "javascript: void (0)" onclick = "ppjokews. letback () "> x </a> <a href =" javascript: void (0) "onclick =" ppjokews. letbig () "> B </a> <a href =" javascript: void (0) "onclick =" void (0) "> F </a> </div>

<Div id = "ppjoke_msgbox"> </div>

<Div id = "ppjoke_infbox">
<Span id = "ppjoke_otherinf"> </span>
<Span id = "ajaxing"> </span>
</Div>

<Div id = "ppjoke_operbox">

clear screen
logon
logout
:
color

<Div id = "ppjoke_facediv" style = "display: none;">
<Ul id = "ppjoke_facelist">
</Ul>
</Div>

<Div id = "ppjoke_logdiv" style = "display: none;">
<Form ID = "logform" Action = "#">
<Input type = "text" name = "regname" class = "smallinput" id = "regname" value = "username"/>
<Input type = "password" name = "regpass" class = "smallinput" id = "regpass" value = "pass"/>
<A href = "#" class = "Aex" onclick = "sendlogin (); Return false;"> OK </a>
<A href = "#" class = "Aex" onclick = "sendreg (); Return false;"> register </a>
</Form>
</Div>

<Div id = "ppjoke_colordiv" style = "display: none;">
<Ul>
<Li> <a style = "color: Red" href = "#" onclick = "changecolor ('red'); Return false; "> ■ </a> </LI>
<Li> <a style = "color: Blue" href = "#" onclick = "changecolor ('blue'); Return false; "> ■ </a> </LI>
<Li> <a style = "color: Green" href = "#" onclick = "changecolor ('green'); Return false; "> ■ </a> </LI>
<Li> <a style = "color: darkorange" href = "#" onclick = "changecolor ('darkorange '); Return false; "> ■ </a> </LI>
<Li> <a style = "color: Black" href = "#" onclick = "changecolor ('black'); Return false; "> ■ </a> </LI>
<Li> <a style = "color: teal" href = "#" onclick = "changecolor ('teal'); Return false; "> ■ </a> </LI>
<Li> <a style = "color: deeppink" href = "#" onclick = "changecolor ('deppink '); Return false; "> ■ </a> </LI>
<Li> <a style = "color: blueviolet" href = "#" onclick = "changecolor ('bluevilet'); Return false; "> ■ </a> </LI>
<Li> <a style = "color: springgreen" href = "#" onclick = "changecolor ('springgreen'); Return false; "> ■ </a> </LI>
</Ul>
</Div>

<Div id = "ppjoke_exdiv" style = "display: none;">
<Ul id = "ppjoke_onlinelist">
</Ul>
</Div>

</Div>

</Div>
</Div>
<SCRIPT type = "text/JavaScript">
Ppjokeinit ();
</SCRIPT>