Hello all,
Ive been a member here for a couple of years now, and throughout that time, ive been creating a V2 game for me and my friends to play.
Ive found this forum to be extremely helpful through advice, free mods and everything ive learnt just from reading people's posts's.
Now i'll be the first to admit, i'm crap when it comes to coding, but i wanted to give something back to the community.
So ive put together a V2 Login/Register Layout... Yes im aware it's not the best out there, but its free and done to the best of MY ability..
I must stress this is only a layout, it is not a ready-to-use template (there's nothing stopping you from using it as is, i just wouldn't.) the graphics will need to be changed to suit your game.
If there's anything wrong with it please post here and i'll do my best to fix it.
first replace login.php with
<?php
session_start();
include "config.php";
global $_CONFIG;
define("MONO_ON", 1);
require "class/class_db_{$_CONFIG['driver']}.php";
$db=new database;
$db->configure($_CONFIG['hostname'],
$_CONFIG['username'],
$_CONFIG['password'],
$_CONFIG['database'],
$_CONFIG['persistent']);
$db->connect();
$c=$db->connection_id;
$set=array();
$settq=$db->query("SELECT * FROM settings");
while($r=$db->fetch_row($settq))
{
$set[$r['conf_name']]=$r['conf_value'];
}
//thx to http://www.phpit.net/code/valid-email/ for valid_email
function valid_email($email) {
// First, we check that there's one @ symbol, and that the lengths are right
if (!ereg("^[^@]{1,64}@[^@]{1,255}$", $email)) {
// Email invalid because wrong number of characters in one section, or wrong number of @ symbols.
return false;
}
// Split it into sections to make life easier
$email_array = explode("@", $email);
$local_array = explode(".", $email_array[0]);
for ($i = 0; $i < sizeof($local_array); $i++) {
if (!ereg("^(([A-Za-z0-9!#$%&'*+/=?^_`{|}~-][A-Za-z0-9!#$%&'*+/=?^_`{|}~\.-]{0,63})|(\"[^(\\|\")]{0,62}\"))$", $local_array[$i])) {
return false;
}
}
if (!ereg("^\[?[0-9\.]+\]?$", $email_array[1])) { // Check if domain is IP. If not, it should be valid domain name
$domain_array = explode(".", $email_array[1]);
if (sizeof($domain_array) < 2) {
return false; // Not enough parts to domain
}
for ($i = 0; $i < sizeof($domain_array); $i++) {
if (!ereg("^(([A-Za-z0-9][A-Za-z0-9-]{0,61}[A-Za-z0-9])|([A-Za-z0-9]+))$", $domain_array[$i])) {
return false;
}
}
}
return true;
}
print <<<EOF
<!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN' 'http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd'>
<html>
<head>
<meta http-equiv='Content-Type' content='text/html; charset=utf-8' />
<title>Game Name Here | Free To Play Text Based MMORPG | Login </title>
<link href='css/login.css' rel='stylesheet' type='text/css'>
<script language="JavaScript">
<!--
function getCookieVal (offset) {
var endstr = document.cookie.indexOf (";", offset);
if (endstr == -1)
endstr = document.cookie.length;
return unescape(document.cookie.substring(offset, endstr));
}
function GetCookie (name) {
var arg = name + "=";
var alen = arg.length;
var clen = document.cookie.length;
var i = 0;
while (i < clen) {
var j = i + alen;
if (document.cookie.substring(i, j) == arg)
return getCookieVal (j);
i = document.cookie.indexOf(" ", i) + 1;
if (i == 0) break;
}
return null;
}
function SetCookie (name,value,expires,path,domain,secure) {
document.cookie = name + "=" + escape (value) +
((expires) ? "; expires=" + expires.toGMTString() : "") +
((path) ? "; path=" + path : "") +
((domain) ? "; domain=" + domain : "") +
((secure) ? "; secure" : "");
}
function DeleteCookie (name,path,domain) {
if (GetCookie(name)) {
document.cookie = name + "=" +
((path) ? "; path=" + path : "") +
((domain) ? "; domain=" + domain : "") +
"; expires=Thu, 01-Jan-70 00:00:01 GMT";
}
}
// -->
</script>
<script language="JavaScript">
var usr;
var pw;
var sv;
function getme()
{
usr = document.login.username;
pw = document.login.password;
sv = document.login.save;
if (GetCookie('player') != null)
{
usr.value = GetCookie('username')
pw.value = GetCookie('password')
if (GetCookie('save') == 'true')
{
sv[0].checked = true;
}
}
}
function saveme()
{
if (usr.value.length != 0 && pw.value.length != 0)
{
if (sv[0].checked)
{
expdate = new Date();
expdate.setTime(expdate.getTime()+(365 * 24 * 60 * 60 * 1000));
SetCookie('username', usr.value, expdate);
SetCookie('password', pw.value, expdate);
SetCookie('save', 'true', expdate);
}
if (sv[1].checked)
{
DeleteCookie('username');
DeleteCookie('password');
DeleteCookie('save');
}
}
else
{
alert('You must enter a username/password.');
return false;
}
}
</script>
<script type="text/javascript">
var xmlHttp // xmlHttp variable
function GetXmlHttpObject(){ // This function we will use to call our xmlhttpobject.
var objXMLHttp=null // Sets objXMLHttp to null as default.
if (window.XMLHttpRequest){ // If we are using Netscape or any other browser than IE lets use xmlhttp.
objXMLHttp=new XMLHttpRequest() // Creates a xmlhttp request.
}else if (window.ActiveXObject){ // ElseIf we are using IE lets use Active X.
objXMLHttp=new ActiveXObject("Microsoft.XMLHTTP") // Creates a new Active X Object.
} // End ElseIf.
return objXMLHttp // Returns the xhttp object.
} // Close Function
function CheckPasswords(password){ // This is our fucntion that will check to see how strong the users password is.
xmlHttp=GetXmlHttpObject() // Creates a new Xmlhttp object.
if (xmlHttp==null){ // If it cannot create a new Xmlhttp object.
alert ("Browser does not support HTTP Request") // Alert Them!
return // Returns.
} // End If.
var url="check.php?password="+escape(password) // Url that we will use to check the password.
xmlHttp.open("GET",url,true) // Opens the URL using GET
xmlHttp.onreadystatechange = function () { // This is the most important piece of the puzzle, if onreadystatechange = equal to 4 than that means the request is done.
if (xmlHttp.readyState == 4) { // If the onreadystatechange is equal to 4 lets show the response text.
document.getElementById("passwordresult").innerHTML = xmlHttp.responseText; // Updates the div with the response text from check.php
} // End If.
}; // Close Function
xmlHttp.send(null); // Sends NULL insted of sending data.
} // Close Function.
function CheckUsername(password){ // This is our fucntion that will check to see how strong the users password is.
xmlHttp=GetXmlHttpObject() // Creates a new Xmlhttp object.
if (xmlHttp==null){ // If it cannot create a new Xmlhttp object.
alert ("Browser does not support HTTP Request") // Alert Them!
return // Returns.
} // End If.
var url="checkun.php?password="+escape(password) // Url that we will use to check the password.
xmlHttp.open("GET",url,true) // Opens the URL using GET
xmlHttp.onreadystatechange = function () { // This is the most important piece of the puzzle, if onreadystatechange = equal to 4 than that means the request is done.
if (xmlHttp.readyState == 4) { // If the onreadystatechange is equal to 4 lets show the response text.
document.getElementById("usernameresult").innerHTML = xmlHttp.responseText; // Updates the div with the response text from check.php
} // End If.
}; // Close Function
xmlHttp.send(null); // Sends NULL insted of sending data.
} // Close Function.
function CheckEmail(password){ // This is our fucntion that will check to see how strong the users password is.
xmlHttp=GetXmlHttpObject() // Creates a new Xmlhttp object.
if (xmlHttp==null){ // If it cannot create a new Xmlhttp object.
alert ("Browser does not support HTTP Request") // Alert Them!
return // Returns.
} // End If.
var url="checkem.php?password="+escape(password) // Url that we will use to check the password.
xmlHttp.open("GET",url,true) // Opens the URL using GET
xmlHttp.onreadystatechange = function () { // This is the most important piece of the puzzle, if onreadystatechange = equal to 4 than that means the request is done.
if (xmlHttp.readyState == 4) { // If the onreadystatechange is equal to 4 lets show the response text.
document.getElementById("emailresult").innerHTML = xmlHttp.responseText; // Updates the div with the response text from check.php
} // End If.
}; // Close Function
xmlHttp.send(null); // Sends NULL insted of sending data.
} // Close Function.
function PasswordMatch()
{
pwt1=document.getElementById('pw1').value;
pwt2=document.getElementById('pw2').value;
if(pwt1 == pwt2)
{
document.getElementById('cpasswordresult').innerHTML="<font color='green'>OK</font>";
}
else
{
document.getElementById('cpasswordresult').innerHTML="<font color='red'>Not Matching</font>";
}
}
</script>
EOF;
$IP = ($_SERVER['HTTP_X_FORWARDED_FOR'])
? $_SERVER['HTTP_X_FORWARDED_FOR']
: $_SERVER['REMOTE_ADDR'];
if(file_exists('ipbans/'.$IP))
{
die("</head><body><b><font color=red size=+1>Your IP has been banned, there is no way around this.</font></b></body></html>");
}
$year=date('Y');
if($_POST['username'])
{
if($set['regcap_on'])
{
if(!$_SESSION['captcha'] or $_SESSION['captcha'] != $_POST['captcha'])
{
unset($_SESSION['captcha']);
die("Captcha Test Failed<br />
><a href='login.php'>Back</a>");
}
unset($_SESSION['captcha']);
}
if(!valid_email($_POST['email']))
{
die("Sorry, the email is invalid.<br />
><a href='login.php'>Back</a>");
}
if(strlen($_POST['username']) < 4)
{
die("Sorry, the username is too short.<br />
><a href='login.php'>Back</a>");
}
$sm=100;
if($_POST['promo'] == "Your Promo Code Here")
{
$sm+=100;
}
$username=$_POST['username'];
$username=str_replace(array("<", ">"), array("<", ">"), $username);
$q=$db->query("SELECT * FROM users WHERE username='{$username}' OR login_name='{$username}'");
$q2=$db->query("SELECT * FROM users WHERE email='{$_POST['email']}'");
if($db->num_rows($q))
{
print "Username already in use. Choose another.<br />
><a href='login.php'>Back</a>";
}
else if($db->num_rows($q2))
{
print "E-Mail already in use. Choose another.<br />
><a href='login.php'>Back</a>";
}
else if($_POST['password'] != $_POST['cpassword'])
{
print "The passwords did not match, go back and try again.<br />
><a href='login.php'>Back</a>";
}
else
{
$_POST['ref'] = abs((int) $_POST['ref']);
$q=$db->query("SELECT * FROM users WHERE lastip='$IP' AND userid={$_POST['ref']}");
if($db->num_rows($q))
{
die("No creating referral multies. Bad dog.<br />
><a href='login.php'>Back</a>");
}
if($_POST['ref']) {
$q=$db->query("SELECT * FROM users WHERE userid={$_POST['ref']}");
$r=$db->fetch_row($q);
}
$db->query("INSERT INTO users (username, login_name, userpass, level, money, crystals, donatordays, user_level, energy, maxenergy, will, maxwill, brave, maxbrave, hp, maxhp, location, gender, signedup, email, bankmoney, lastip, lastip_signup) VALUES( '{$username}', '{$username}', md5('{$_POST['password']}'), 1, $sm, 0, 0, 1, 12, 12, 100, 100, 5, 5, 100, 100, 1, '{$_POST['gender']}', unix_timestamp(), '{$_POST['email']}', -1, '$IP', '$IP')");
$i=$db->insert_id();
$db->query("INSERT INTO userstats VALUES($i, 10, 10, 10, 10, 10)");
if($_POST['ref']) {
require "global_func.php";
$db->query("UPDATE users SET crystals=crystals+2 WHERE userid={$_POST['ref']}");
event_add($_POST['ref'],"For refering $username to the game, you have earnt 2 valuable crystals!",$c);
$db->query("INSERT INTO referals VALUES('', {$_POST['ref']}, $i, unix_timestamp(),'{$r['lastip']}','$IP')");
}
print "You have signed up, enjoy the game.<br>
> <a href='login.php'>Login</a>";
}
}
else
{
if($set['regcap_on'])
{ $chars="123456789abcdefghijklmnpqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ!?\\/%^";
$len=strlen($chars);
$_SESSION['captcha']="";
for($i=0;$i<6;$i++)
$_SESSION['captcha'].=$chars[rand(0, $len - 1)];
}
print "
</head>
<body>
<!-- Begin Wrapper -->
<div id='wrapper'>
<!-- Begin Header -->
<div id='header'>
</div>
<!-- End Header -->
<!-- Begin Login -->
<div id='login'>
<form action=authenticate.php method=post name=login onsubmit=\"return saveme();\">Username: <input type=text name=username>
Password: <input type=password name=password>
Remember me?
<input type=\"radio\" value=\"ON\" name=\"save\">Yes <input type=\"radio\" name=\"save\" value=\"OFF\" checked>No
<input type=submit value=Login></form>
</div>
<!-- End Login -->
<!-- Begin Left Column -->
<div id='leftcolumn'>
<br> {$set['game_description']}
</div>
<!-- End Left Column -->
<!-- Begin Right Column -->
<div id='rightcolumn'>
<img src='/img/register.png' alt='register image' height='75' width='200'/><br>
<form action=login.php method=post>
<table width='80%' class='table' cellspacing='1'>
<tr>
<td width='5%'></td>
<td width='20%'>Username</td>
<td width='25%'><input type=text name=username onkeyup='CheckUsername(this.value);'></td>
<td width='50%'><div id='usernameresult'></div></td>
</tr>
<tr>
<td></td>
<td>Password</td>
<td><input type=password id='pw1' name=password onkeyup='CheckPasswords(this.value);PasswordMatch();'></td>
<td><div id='passwordresult'></div></td>
</tr>
<tr>
<td></td>
<td>Confirm Password</td><td><input type=password name=cpassword id='pw2' onkeyup='PasswordMatch();'></td>
<td><div id='cpasswordresult'></div></td>
</tr>
<tr>
<td></td>
<td>Email</td><td><input type=text name=email onkeyup='CheckEmail(this.value);'></td>
<td><div id='emailresult'></div></td>
</tr>
<tr>
<td></td>
<td>Gender</td>
<td colspan='2'><select name='gender' type='dropdown'>
<option value='Male'>Male
<option value='Female'>Female</select></td>
</tr>
<tr>
<td></td>
<td>Promo Code</td><td colspan=2><input type=text name=promo></td>
</tr>
<input type=hidden name=ref value='";
if($_GET['REF']) { print $_GET['REF']; }
print "' />";
if($set['regcap_on'])
{
print "<tr>
<td></td><td></td>
<td colspan=2><img src='captcha_verify.php?bgcolor=C3C3C3' width='170' height='70'/><br />
</td></tr><tr><td></td><td></td><td colspan=2>
<input type='text' name='captcha' /></td>
</tr>";
}
print "
<tr>
<td colspan=3 align=center><input type=submit value=Register></td>
</tr>
</table>
</form><br />
</div>
<!-- End Right Column -->
<!-- Begin Footer -->
<div id='footer'>
Copyright ©{$year} {$set['game_owner']}
</div>
<!-- End Footer -->
";
}
print <<<OUT
</div>
<!-- End Wrapper -->
</body>
</html>
OUT;
?>
delete register.php
then the css (my css is in a folder named "css". if you put this somewhere else, change the path in login.php)
login.css
/*
Hedge 2011
*/
* { padding: 0; margin: 0; }
body {
color:#ffffff;
background-color:#333333;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
}
#wrapper {
margin: 0 auto;
width: 922px;
}
#header {
width: 900px;
float: left;
padding: 5px;
height: 100px;
margin: 10px 0px 5px 0px;
background-image:url('/img/login_header.png');
background-repeat:no-repeat;
background-position:center;
}
#login {
float: left;
width: 900px;
height: 25px;
padding: 5px;
margin: 0px 0px 5px 0px;
background-image: url('/img/login_nav.png');
background-repeat:no-repeat;
background-position:center;
text-align: center;
}
#leftcolumn {
margin: 0px 0px 0px -3px;
padding: 5px;
height: 350px;
width: 450px;
float: left;
background-image:url('/img/login_left.png');
background-repeat:no-repeat;
background-position:center;
text-align: center;
}
#rightcolumn {
float: right;
margin: 0px 0px 0px -3px;
padding: 5px;
height: 350px;
width: 450px;
display: inline;
background-image:url('/img/login_right.png');
background-repeat:no-repeat;
background-position:center;
}
#footer {
width: 900px;
clear: both;
height: 15px;
background-image:url('/img/login_footer.png');
background-repeat:no-repeat;
background-position:center;
margin: 0px 0px 10px 0px;
padding: 10px;
text-align: center;
}
then upload the images (again mine are in a folder name "img" , adjust accordingly)
images can be downloaded from my dropbox
http://dl.dropbox.com/u/19429425/hedge.zip
Then to customize the layout, just edit the images.
The description, and footer are edited via the staff menu.
Screenshot:
http://imageshack.us/photo/my-images/543/screenshotat20120126202.png
Enjoy....
Hedge
