Shulou(Shulou.com)06/03 Report--

This article mainly introduces "how to achieve PPJOKE web page embedded chat". In daily operation, I believe many people have doubts about how to achieve PPJOKE web page embedded chat. The editor consulted all kinds of materials and sorted out simple and easy-to-use operation methods. I hope it will be helpful for you to answer the doubts of "how to achieve PPJOKE web page embedded chat"! Next, please follow the editor to study!

PPJOKE is rewritten based on the OTALK I wrote before. Demo address, turn right-- > has been embedded in my BLOG.

Http://www.ppjoke.com

PPJOKE is available for download throughout the site.

Modify interface color

See 'ppjoke/ppjoke.css'' in rar'OK as long as it is changed to website color matching accordingly.

Web page integration description

Copy the ppjoke from rar to the directory where you want to embed the page, and copy the following code from index.htm into the embedded div in the web page.

The code is as follows:

[xss_clean] ("loading....")

Var style = document.createElement ("link")

Style.rel= "stylesheet"

Style.type= "text/css"

Style.href='ppjoke/ppjoke.css'

Style.title='ppjoke'

Var head=document.getElementsByTagName ("head") [0]

Head.appendChild (style)

Var talktime = 3500ram / set the time interval for getting content

Var talkpath = 'ppjoke/ppjoke.asp'

Var talkcolor = 'blue'

Var info_shaping ='do not swipe the screen'

Var info_talkfail = 'failed to send'

Var barinf_logining = 'logging in'

Var barinf_regging = 'registering'

Var barinf_neterro = 'data transfer error'

Var barinf_loginready = 'login succeeded'

Var barinf_loginerro = 'password error'

Var barinf_blank = 'Please enter the chat content'

Var barinf_logoutok = 'logout successful'

Var barinf_logouterro = 'logout failed'

Var barinf_regerro = 'user name already exists'

Var barinf_regok = 'successfully registered and automatically logged in'

Var barinf_checkuser = 'automatic login'

Var barinf_checkbad = 'illegal identity, please log in by yourself'

Var colorArr = ['red','blue','green','darkorange','black','teal','deeppink','blueviolet','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',' keydown', keyDownAll, false)

Field.select ('talk')

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 ('talk')

} 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 (' padded, {id:'thelastTime',style:'background-color:#FFCCFF'}, 'message sent time:' + lastWorldTime))

Appendtimok=true

}

If (noMemoTimes= = 5) {appendtime (); noMemoTimes=0}

NoMemoTimes?noMemoTimes++:noMemoTimes=0

/ / deal with chat messages

NewMsg.msg.each (function (data) {

If (noMemoTimes > = 5) {Element.remove ('thelastTime');}

NoMemoTimes = 1

Count++

Var p = document.createElement ('p')

If (count%2==0) {

Element.addClassName (pcadence p1')

} else {

Element.addClassName (pcadence p2')

}

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)

}

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

}

);

('ppjoke_msgbox'). ScrollTop=$ (' ppjoke_msgbox'). ScrollHeight

}

}

/ / send chat messages and process local messages

Function sendMsg () {

If (! Field.present ('talk','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 (' talkform'), onFailure:ajaxErro})

Lastworld=Form.serialize ('talkform')

Lastalk=$F ('talk')

Count++

Var p = document.createElement ('p')

If (count%2==0) {

Element.addClassName (pcadence p1')

} else {

Element.addClassName (pcadence 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 ('talk'), msgspan)

Msgspan.style.color=talkcolor

P.appendChild (userspan)

P.appendChild (msgspan)

$('ppjoke_msgbox') .appendChild (p)

}

Field.clear ('talk')

Field.select ('talk')

('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 ('talk')

CreactCookie ()

} else {

CreatInfo (barinf_loginerro)

}

}

}

/ / 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 ('talk')

CreactCookie ()

} else {

CreatInfo (barinf_regerro)

}

}

}

/ / 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 ('talk')

ClearChat ()

} else {

CreatInfo (barinf_logouterro)

}

}

}

Function msg2face (msg,element) {

Var msgtext=$A (msg.match (/ ([^\ [] *) (\ [\ d\ d\])? / gim)

If (msgtext [0]) {

Msgtext.each (function (word) {

Var section = word.match (/ ([^\ [] *)\ [? (\ d\ 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') [xss_clean] = text

Window.setTimeout (function () {$('ppjoke_otherinf') [xss_clean] = "}, 5000)

}

Function sysinf (text) {

Var p = Builder.node ('packs, {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 (iTune1th iB) screen cleaning

Write off

Color

Register

■

■

■

■

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.