Test

From Dxx

(Difference between revisions)
Line 9: Line 9:
<plain_html>
<plain_html>
-
<SCRIPT LANGUAGE="javascript">
+
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
-
var roomname="DXXPedia";
+
<html>
-
var SKIN="http://imchat.pwp.blueyonder.co.uk/nd/login.html";
+
<head>
-
// change this to "0" if you want people from other rooms to see this room
+
<base href="http://www.ajaxdaddy.com/ajax/jquery/shoutbox/">
-
var CLOSED="1";
+
<style type="text/css">
-
function login() {
+
body {color: white;background: #52616F;}
-
  window.open(SKIN+"?" + document.details.NICK.value + "|||||||" + document.details.PASS.value + "||0|0|0||" + roomname + "|"+CLOSED+"|0", "qlogin", "width=779,height=500,toolbar=0,location=0,directories=0,status=0,menuBar=0,scrollBars=0,resizable=1");
+
a { color: white; }
 +
</style>
 +
 
 +
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
 +
<title>jQuery</title>
 +
<style type="text/css">
 +
#daddy-shoutbox {
 +
padding: 5px;
 +
background: #3E5468;
 +
color: white;
 +
width: 600px;
 +
font-family: Arial,Helvetica,sans-serif;
 +
font-size: 11px;
}
}
-
</SCRIPT>
+
.shoutbox-list {
-
<FORM NAME="details">
+
border-bottom: 1px solid #627C98;
-
<TABLE BORDER="0" CELLSPACING="0" CELLPADDING="4" style="border-collapse: collapse" bordercolorlight="#CCCCCC" bordercolordark="#808080">
+
 
-
<TR><TD COLSPAN="3" ALIGN="CENTER" BGCOLOR="#cccccc">
+
padding: 5px;
-
<B><FONT COLOR="#000000" FACE="Arial" SIZE ="4">Chat Room Login</FONT></B></TD>
+
display: none;
-
</TR><TR><TD BGCOLOR="#6666FF" WIDTH="89"><B><FONT COLOR="#ffffff" FACE="Arial" SIZE ="3">Nickname</FONT></B></TD>
+
}
-
<TD BGCOLOR="#6666FF" WIDTH="120"><INPUT NAME="NICK" TYPE="text" SIZE="16" MAXLENGTH="16"></TD>
+
#daddy-shoutbox-list {
-
<TD BGCOLOR="#CCCCCC" WIDTH="60">
+
text-align: left;
-
&nbsp;</TD>
+
margin: 0px auto;
-
</TR><TR><TD BGCOLOR="#6666FF" WIDTH="89"><B><FONT COLOR="#ffffff" FACE="Arial" SIZE ="3">*Password</FONT></B></TD>
+
}
-
<TD BGCOLOR="#6666FF" WIDTH="120"><INPUT NAME="PASS" TYPE="password" SIZE="16" MAXLENGTH="200"></TD>
+
#daddy-shoutbox-form {
-
<TD BGCOLOR="#CCCCCC" WIDTH="60">
+
text-align: left;
-
<INPUT ID="cLoginButton" NAME="LOGIN" TYPE="button" VALUE="LOGIN" ONCLICK="login();"></TD></TR><TR><TD COLSPAN="3" BGCOLOR="#cccccc"><P>
+
 
-
<p align="center"><b><font size="2" FACE="Arial">* A password is only required if you<BR>have registered your nickname.</font><font size="2"><SCRIPT LANGUAGE="javascript" SRC="http://imchat.pwp.blueyonder.co.uk/nd/skindata.js"></SCRIPT>
+
}
-
</font></b></TD></TR></TABLE></FORM>
+
.shoutbox-list-time {
 +
color: #8DA2B4;
 +
}
 +
.shoutbox-list-nick {
 +
margin-left: 5px;
 +
font-weight: bold;
 +
}
 +
.shoutbox-list-message {
 +
margin-left: 5px;
 +
}
 +
 
 +
</style>
 +
<script type="text/javascript" src="javascript/jquery.js"></script>
 +
<script type="text/javascript" src="javascript/jquery.form.js"></script>
 +
</head>
 +
<body>
 +
 
 +
<center>
 +
<div id="daddy-shoutbox">
 +
<div id="daddy-shoutbox-list"></div>
 +
<br />
 +
<form id="daddy-shoutbox-form" action="daddy-shoutbox.php?action=add" method="post">
 +
Nick: <input type="text" name="nickname" /> Say: <input type="text" name="message" />
 +
<input type="submit" value="Submit" />
 +
<span id="daddy-shoutbox-response"></span>
 +
</form>
 +
</div>
 +
</center>
 +
 
 +
<script type="text/javascript">
 +
var count = 0;
 +
var files = '';
 +
var lastTime = 0;
 +
 
 +
function prepare(response) {
 +
var d = new Date();
 +
count++;
 +
d.setTime(response.time*1000);
 +
var mytime = d.getHours()+':'+d.getMinutes()+':'+d.getSeconds();
 +
var string = '<div class="shoutbox-list" id="list-'+count+'">'
 +
+ '<span class="shoutbox-list-time">'+mytime+'</span>'
 +
+ '<span class="shoutbox-list-nick">'+response.nickname+':</span>'
 +
+ '<span class="shoutbox-list-message">'+response.message+'</span>'
 +
+'</div>';
 +
 
 +
return string;
 +
}
 +
 
 +
function success(response, status) {
 +
if(status == 'success') {
 +
lastTime = response.time;
 +
$('#daddy-shoutbox-response').html('<img src="'+files+'images/accept.png" />');
 +
$('#daddy-shoutbox-list').append(prepare(response));
 +
$('input[@name=message]').attr('value', '').focus();
 +
$('#list-'+count).fadeIn('slow');
 +
timeoutID = setTimeout(refresh, 3000);
 +
}
 +
}
 +
 
 +
function validate(formData, jqForm, options) {
 +
for (var i=0; i < formData.length; i++) {
 +
if (!formData[i].value) {
 +
alert('Please fill in all the fields');
 +
$('input[@name='+formData[i].name+']').css('background', 'red');
 +
return false;
 +
}
 +
}
 +
$('#daddy-shoutbox-response').html('<img src="'+files+'images/loader.gif" />');
 +
clearTimeout(timeoutID);
 +
}
 +
 
 +
function refresh() {
 +
$.getJSON(files+"daddy-shoutbox.php?action=view&time="+lastTime, function(json) {
 +
if(json.length) {
 +
for(i=0; i < json.length; i++) {
 +
$('#daddy-shoutbox-list').append(prepare(json[i]));
 +
$('#list-' + count).fadeIn('slow');
 +
}
 +
var j = i-1;
 +
lastTime = json[j].time;
 +
}
 +
//alert(lastTime);
 +
});
 +
timeoutID = setTimeout(refresh, 3000);
 +
}
 +
 
 +
// wait for the DOM to be loaded
 +
$(document).ready(function() {
 +
var options = {
 +
dataType: 'json',
 +
beforeSubmit: validate,
 +
success: success
 +
};
 +
$('#daddy-shoutbox-form').ajaxForm(options);
 +
timeoutID = setTimeout(refresh, 100);
 +
});
 +
</script>
 +
</body>
 +
</html>
</plain_html>
</plain_html>

Revision as of 17:05, 5 January 2009

<plain_html>

<object width="425" height="350"><param name="movie" value="http://www.youtube.com/v/kTV1CcS53JQ"></param><param name="wmode" value="transparent"></param><embed src="http://www.youtube.com/v/kTV1CcS53JQ" type="application/x-shockwave-flash" wmode="transparent" width="425" height="350"></embed></object>

</plain_html>



<plain_html> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <base href="http://www.ajaxdaddy.com/ajax/jquery/shoutbox/"> <style type="text/css"> body {color: white;background: #52616F;} a { color: white; } </style>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <title>jQuery</title> <style type="text/css">

  1. daddy-shoutbox {

padding: 5px; background: #3E5468; color: white; width: 600px; font-family: Arial,Helvetica,sans-serif; font-size: 11px; } .shoutbox-list { border-bottom: 1px solid #627C98;

padding: 5px; display: none; }

  1. daddy-shoutbox-list {

text-align: left; margin: 0px auto; }

  1. daddy-shoutbox-form {

text-align: left;

} .shoutbox-list-time { color: #8DA2B4; } .shoutbox-list-nick { margin-left: 5px; font-weight: bold; } .shoutbox-list-message { margin-left: 5px; }

</style> <script type="text/javascript" src="javascript/jquery.js"></script> <script type="text/javascript" src="javascript/jquery.form.js"></script> </head> <body>


<form id="daddy-shoutbox-form" action="daddy-shoutbox.php?action=add" method="post"> Nick: <input type="text" name="nickname" /> Say: <input type="text" name="message" /> <input type="submit" value="Submit" /> </form>

<script type="text/javascript"> var count = 0; var files = ; var lastTime = 0;

function prepare(response) { var d = new Date(); count++; d.setTime(response.time*1000); var mytime = d.getHours()+':'+d.getMinutes()+':'+d.getSeconds();

var string = '
'

+ ''+mytime+'' + ''+response.nickname+':' + ''+response.message+''

+'
';

return string; }

function success(response, status) { if(status == 'success') { lastTime = response.time; $('#daddy-shoutbox-response').html('<img src="'+files+'images/accept.png" />'); $('#daddy-shoutbox-list').append(prepare(response)); $('input[@name=message]').attr('value', ).focus(); $('#list-'+count).fadeIn('slow'); timeoutID = setTimeout(refresh, 3000); } }

function validate(formData, jqForm, options) { for (var i=0; i < formData.length; i++) { if (!formData[i].value) { alert('Please fill in all the fields'); $('input[@name='+formData[i].name+']').css('background', 'red'); return false; } } $('#daddy-shoutbox-response').html('<img src="'+files+'images/loader.gif" />'); clearTimeout(timeoutID); }

function refresh() { $.getJSON(files+"daddy-shoutbox.php?action=view&time="+lastTime, function(json) { if(json.length) { for(i=0; i < json.length; i++) { $('#daddy-shoutbox-list').append(prepare(json[i])); $('#list-' + count).fadeIn('slow'); } var j = i-1; lastTime = json[j].time; } //alert(lastTime); }); timeoutID = setTimeout(refresh, 3000); }

// wait for the DOM to be loaded $(document).ready(function() { var options = { dataType: 'json', beforeSubmit: validate, success: success }; $('#daddy-shoutbox-form').ajaxForm(options); timeoutID = setTimeout(refresh, 100); }); </script> </body> </html> </plain_html>

Personal tools
DXX Roster