260 lines
5.2 KiB
HTML
260 lines
5.2 KiB
HTML
|
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||
|
<html xmlns="http://www.w3c.org/1999/xhtml" xml:lang="da">
|
||
|
<head>
|
||
|
<title>ChadChat</title>
|
||
|
<style type='text/css'>
|
||
|
* {
|
||
|
margin:0;
|
||
|
}
|
||
|
|
||
|
body {
|
||
|
background:#fff;
|
||
|
font:16px 'trebuchet ms';
|
||
|
}
|
||
|
|
||
|
#wrapper {
|
||
|
position:absolute;
|
||
|
top:50%;
|
||
|
left:50%;
|
||
|
margin:-200px 0 0 -200px;
|
||
|
width:400px;
|
||
|
height:400px;
|
||
|
background:#fff url(img/ccbg.gif) no-repeat;
|
||
|
}
|
||
|
|
||
|
#lefteyeball {
|
||
|
position:absolute;
|
||
|
top:118px;
|
||
|
left:106px;
|
||
|
width:8px;
|
||
|
height:6px;
|
||
|
background:url(img/ccleb.gif) no-repeat;
|
||
|
}
|
||
|
|
||
|
#righteyeball {
|
||
|
position:absolute;
|
||
|
top:114px;
|
||
|
left:128px;
|
||
|
width:8px;
|
||
|
height:6px;
|
||
|
background:url(img/ccreb.gif) no-repeat;
|
||
|
}
|
||
|
|
||
|
#mouth {
|
||
|
position:absolute;
|
||
|
top:181px;
|
||
|
left:70px;
|
||
|
width:70px;
|
||
|
height:15px;
|
||
|
background:url(img/ccm1.gif) no-repeat;
|
||
|
}
|
||
|
|
||
|
#text {
|
||
|
position:absolute;
|
||
|
top:15px;
|
||
|
left:17px;
|
||
|
width:357px;
|
||
|
height:370px;
|
||
|
padding:5px;
|
||
|
}
|
||
|
|
||
|
#movetext {
|
||
|
float:left;
|
||
|
width:186px;
|
||
|
height:195px;
|
||
|
}
|
||
|
|
||
|
#output {
|
||
|
display:inline;
|
||
|
}
|
||
|
|
||
|
#inputwrapper {
|
||
|
position:absolute;
|
||
|
top:372px;
|
||
|
left:23px;
|
||
|
}
|
||
|
|
||
|
#inputwrapper a:link,a:visited {
|
||
|
color:#000;
|
||
|
text-decoration:none;
|
||
|
background:url(img/askme.gif) no-repeat 0 0;
|
||
|
display:block;
|
||
|
float:left;
|
||
|
height:23px;
|
||
|
width:69px;
|
||
|
padding:0 0 0 7px;
|
||
|
margin:1px 0 0 15px;
|
||
|
}
|
||
|
|
||
|
#inputwrapper a:hover {
|
||
|
color:#fff;
|
||
|
background:url(img/askme.gif) no-repeat 0 -23px;
|
||
|
}
|
||
|
|
||
|
#input {
|
||
|
width:277px;
|
||
|
margin-top:3px;
|
||
|
border:0;
|
||
|
float:left;
|
||
|
}
|
||
|
</style>
|
||
|
<script type='text/javascript'>
|
||
|
function askme() {
|
||
|
i=document.getElementById("input")
|
||
|
o=document.getElementById("output")
|
||
|
oh=o.className
|
||
|
if (oh=="t")
|
||
|
movepartsload()
|
||
|
|
||
|
iv=i.value
|
||
|
il=iv.toLowerCase()
|
||
|
|
||
|
if (instr("hi"))
|
||
|
f="Hi!"
|
||
|
else if (instr("help"))
|
||
|
f="Try typing something like <b>How are you?</b> or <b>My name is ___</b>.."
|
||
|
else if (instr("how are you") || instr("how are u") || instr("how r you") || instr("how r u"))
|
||
|
f="I'm fine, thanks!"
|
||
|
else if (il=="links")
|
||
|
f="None at the moment.. Try <a href='http://www.google.com/'>Google</a>..."
|
||
|
else if (instr("my name is ") || instr("my name's ")) {
|
||
|
if (i.name=="") {
|
||
|
|
||
|
if (instr("my name is "))
|
||
|
namevariation="name is"
|
||
|
else
|
||
|
namevariation="name's"
|
||
|
|
||
|
namesearch=iv.search(namevariation+" ")
|
||
|
namesearch=namesearch+1+namevariation.length
|
||
|
name=iv.substr(namesearch)
|
||
|
i.name=name
|
||
|
f="Oh, really? So your name is "+name+", huh? Well, let me tell you one thing.. My name is Chad!"
|
||
|
}
|
||
|
else
|
||
|
f="You already told me my name. Your name is "+i.name+", right? And I don't believe a person is able to change one's name in this short matter of time.. You wanna change your name?"
|
||
|
}
|
||
|
else if (instr("what is my name") || instr("what's my name")) {
|
||
|
if (i.name=="")
|
||
|
f="I don't know what your name is.. What is it? Please, tell me!"
|
||
|
else
|
||
|
f="You can't even remember your own name.. Well, if you insist..<br />YOUR NAME IS "+i.name+"!"
|
||
|
}
|
||
|
else if (i.name!="" && instr(i.name))
|
||
|
f="You're correct.. Your name sure is "+i.name+"..<br /><br /><br />(Next, it might be a good idea to learn the alphabet..)"
|
||
|
else
|
||
|
f="Hmmm... I don't quite understand you.."
|
||
|
|
||
|
i.value=""
|
||
|
o.innerHTML=f
|
||
|
i.focus()
|
||
|
}
|
||
|
|
||
|
function instr(str) {
|
||
|
id=document.getElementById("input").value
|
||
|
itl=id.toLowerCase()
|
||
|
result=itl.search(str)
|
||
|
|
||
|
if (result!=-1)
|
||
|
return true
|
||
|
else
|
||
|
return false
|
||
|
}
|
||
|
|
||
|
function cleartimes() {
|
||
|
clearTimeout(countseconds)
|
||
|
clearTimeout(eyetime)
|
||
|
clearTimeout(mouthtime)
|
||
|
}
|
||
|
|
||
|
function movepartsload() {
|
||
|
c=0
|
||
|
movemouth()
|
||
|
moveeyes()
|
||
|
moveparts()
|
||
|
}
|
||
|
|
||
|
function moveparts() {
|
||
|
if (c==3) {
|
||
|
document.getElementById("output").className="t"
|
||
|
cleartimes()
|
||
|
}
|
||
|
else {
|
||
|
c=c+1
|
||
|
document.getElementById("output").className=""
|
||
|
countseconds=setTimeout("moveparts()",1000)
|
||
|
}
|
||
|
}
|
||
|
|
||
|
lebl=106
|
||
|
rebl=128
|
||
|
function moveeyes() {
|
||
|
leb=document.getElementById("lefteyeball")
|
||
|
reb=document.getElementById("righteyeball")
|
||
|
|
||
|
if (lebl==106)
|
||
|
leb.className="t"
|
||
|
else if (lebl==90)
|
||
|
leb.className=""
|
||
|
|
||
|
if (rebl==144)
|
||
|
reb.className="t"
|
||
|
else if (rebl==128)
|
||
|
reb.className=""
|
||
|
|
||
|
if (leb.className=="")
|
||
|
lebl=lebl+1
|
||
|
else
|
||
|
lebl=lebl-1
|
||
|
|
||
|
if (reb.className=="")
|
||
|
rebl=rebl+1
|
||
|
else
|
||
|
rebl=rebl-1
|
||
|
|
||
|
leb.style.left=lebl+"px"
|
||
|
reb.style.left=rebl+"px"
|
||
|
eyetime=setTimeout("moveeyes()",50)
|
||
|
}
|
||
|
mouthimg=1
|
||
|
function movemouth() {
|
||
|
mouth=document.getElementById("mouth")
|
||
|
if (mouthimg==1) {
|
||
|
mouth.style.backgroundImage="url(img/ccm2.gif)"
|
||
|
mouthimg=2
|
||
|
}
|
||
|
else {
|
||
|
mouth.style.backgroundImage="url(img/ccm1.gif)"
|
||
|
mouthimg=1
|
||
|
}
|
||
|
|
||
|
mouthtime=setTimeout("movemouth()",300)
|
||
|
}
|
||
|
|
||
|
function loadstuff() {
|
||
|
i=document.getElementById("input")
|
||
|
i.focus()
|
||
|
}
|
||
|
|
||
|
window.onload=loadstuff
|
||
|
</script>
|
||
|
</head>
|
||
|
<body>
|
||
|
<div id='wrapper'>
|
||
|
<div id='lefteyeball'></div>
|
||
|
<div id='righteyeball'></div>
|
||
|
<div id='mouth'></div>
|
||
|
<div id='text'>
|
||
|
<div id='movetext'></div>
|
||
|
<div id='output' class='t'>
|
||
|
Welcome to ChadChat.<br />I'm Chad, and you can ask me all kinds of questions (even though I can't guarantee an intelligent answer..)<br />Type <b>help</b> if you're completely lost.<br />Type <b>links</b> to see what cool links I know of..<br />And finally, just chat with me!
|
||
|
</div>
|
||
|
</div>
|
||
|
<div id='inputwrapper'>
|
||
|
<form action='javascript:askme()'>
|
||
|
<input type='text' id='input' /> <a href='javascript:askme()'>Ask me!</a>
|
||
|
</form>
|
||
|
</div>
|
||
|
</div>
|
||
|
</body>
|
||
|
</html>
|