You are on page 1of 7

<!

DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Mastermind</title>
<link rel="stylesheet" href="prova.css" type="text/css"/>
</head>
<body>
<h1>Mastermind</h1>
<div id="textbox2">
<p id ="important2">
<a id="logOrRegisterLeft" class="alignleft">Please login or register
</a>
</p>
</div>
<div id="textbox1" style='display: none'>
<p id ="important">
<a href="no-javascript.html" id="newGame" class="alignleft">New Gam
e <span class="bar">|</span></a>
<a href="no-javascript.html" id="gameHistory" class="alignleft" >Ga
me History <span class="bar">|</span></a>
<a href="no-javascript.html" id="globalScores" class="alignleft" >Gl
obal Scores <span class="bar">|</span></a>
<a href="" id="documentation" class="alignleft" >Documentation</a>
<a id="logOrRegisterRight" class="alignright">Welcome&nbsp;</a>
</p>
</div>
</br>
<div class="two-col">
<div id="login" class="login">
<form id='login'>
<label for="nickname">Nickname</label><br/>
<input type="text" name="nickname" value="" id="nickname"/><br/>
<label for="password">Password</label><br/>
<input type="password" name="password" value="" id="password"/><b
r/>
<br/>
<input type="submit" value="Log in" />
</form>
</div>
<div id="register" class="register">
<form id='register'>
<label for="nickname">Nickname</label><br/>
<input type="text" name="registerNickname" value="" id="registerN
ickname"/><br/>
<label for="email">Email</label><br/>
<input type="email" name="email" value="" id="email"/><br/>
<label for="password">Password</label><br/>
<input type="password" name="registerPassword" value="" id="regis
terPassword"/><br/>
<label for="password">Repeat Password</label><br/>
<input type="password" name="repeatedPassword" value="" id="repea
tedPassword"/><br/>
<br/>
<input type="submit" value="Register" />
</form>
</div>
</div>
<div id="game" style='display: none'>
<h2>Current Game</h2>

<h3 id="gameStatus">Status: playing</h3>


<p id="utile"> </p>
<form id='try'>
<div id="tableGame">
</div>
</br>
<input type="text" name="code" value="" id="sequenceTried" autofocus
='autofocus'/>
<input type='submit' value='try' id="tryButton"/>
</form>
</div>
<div id="gameHistoryTable" style='display: none'>
<h2>Game History</h2>
<div id="historyTable">
</div>
</div>
<div id="globalScoresDiv" style='display: none'>
<h2>Global Scores</h2>
<div id="globalScoresTable">
</div>
</div>
<footer>
<hr>
<div id="textbox">
<a class="alignleft">Autore: Squillaci Jacopo 716147</a>
<a class="alignright">Appello: settembre 2014</a>
</div>
</footer>
<script id='table-template' type="application/x-tmpl-mustache">
<table>
<tbody>
<TR>
<TD COLSPAN = 2>Tries</TD>
<TD >Result<BR></TD>
</TR>
{{#tentativo}}
<TR >
<TD>{{numero}}</TD>
<TD>{{combinazione}}</TD>
<TD>{{risultato}}</TD>
</TR>
{{/tentativo}}
</tbody>
</table>

</script>
<script id='game-history-template' type="application/x-tmpl-mustache">
<table id="gameHistoryTablet" >
<tbody>
<TR>
<TD>Started</TD>
<TD >Finished</TD>
<TD>Tries</TD>
</TR>
{{#gameInfo}}

<TR >
<TD>{{start_date}}</TD>
<TD>{{finish_date}}</TD>
<TD>{{tries}}</TD>
</TR>
{{/gameInfo}}
</tbody>
</table>

</script>
<script id='global-scores-template' type="application/x-tmpl-mustache">
<table id="globalScoresTableT">
<tbody>
<TR>
<TD>User</TD>
<TD >Score</TD>
</TR>
{{#globalScores}}
<TR >
<TD><a href="javascript: submitform({{nicknames}})" id="link">{{nicknam
e}}</a></TD>
<TD>{{score}}</TD>
</TR>
{{/globalScores}}
</tbody>
</table>
</>
</script>
<script src='/js/lib/jquery-1.10.2.min.js'></script>
<script src='/js/lib/mustache.js'></script>
<script src='/js/game.js'></script>
<script src='/js/game_view.js'></script>
<script src='/js/game_history.js'></script>
<script src='/js/game_history_view.js'></script>
<script src='/js/global_scores.js'></script>
<script src='/js/global_scores_view.js'></script>
<script>
var p=new Game();
function on_login_success(data) {
$("#login-register-message").text("OK login");
$("#logOrRegisterRight").text("Welcome, "+data.id);
$("#textbox2").fadeOut();
$("#textbox1").fadeIn();
$("#login").fadeOut(100);
$("#register").fadeOut(100);

}
function on_login_error(data) {
$("#login-register-message").text("Bad login");
}
function on_register_success(data) {
$("#login-register-message").text("Succesfully Registered. Ple
ase Login.");
}
function on_register_error(data) {
}
function submitform(data){
}
function on_login() {
$.ajax({
url: '/authenticate',
method: 'post',
success: on_login_success,
error: on_login_error,
data: {
nickname: $("#nickname").val(),
password: $("#password").val()
},
});
return false;
}

function on_register() {
$.ajax({
url: '/register',
method: 'post',
success: on_register_success,
error: on_register_error,
data: {
registerNickname: $("#registerNickname").val(),
registerPassword: $("#registerPassword").val(),
repeatedPassword: $("#repeatedPassword").val(),
email:$("#email").val()
},
});
return false;
}

function on_try_success(data) {

$("#utile").text("Succesfully tried.");
p.on_try_performed(data.sequenceTried, data.result);
if(data.status=="finished"){
$("#sequenceTried").fadeOut();
$("#tryButton").fadeOut();
$("#gameStatus").text("Status: finished.");
}
}
function on_try_error(data) {
$("#utile").text("Not Succesfully tried.");
}
function on_try() {
$.ajax({
url: '/try',
method: 'post',
success: on_try_success,
error: on_try_error,
data: {
nickname: $("#nickname").val(),
gameId: p.id(),
sequenceTried:$("#sequenceTried").val()
},
});
return false;
}
function on_new_game_success(data) {
var game_view = new GameView("#table-template", "#tableGame");
p=new Game(data.gameId);
p.add_observer(game_view);
p.notify_all_observers();
$("#gameHistoryTable").fadeOut(100);
$("#globalScoresDiv").fadeOut(100);
$("#game").fadeIn(100);
$("#sequenceTried").fadeIn();
$("#tryButton").fadeIn();
return false;
}
function on_new_game() {
$.ajax({
url: '/newGame',
method: 'post',
success: on_new_game_success,
error: on_try_error,
data: {
nickname: $("#nickname").val(),
},
});
return false;
}

function on_game_history() {
$.ajax({
url: '/gameHistory',
method: 'post',
success: on_game_history_success,
error: on_try_error,
data: {
nickname: $("#nickname").val(),
},
});
return false;
}
function on_game_history_success(data) {
console.log( "ok" );
var gameInfos = (data.array).split(";");
var game_history_view = new GameHistoryView("#game-history-temp
late", "#historyTable");
var gameHistory=new GameHistory();
for (var i=0; i < gameInfos.length; i++){
gameHistory.on_one_game_info(gameInfos[i].split(","));
}
gameHistory.add_observer(game_history_view);
gameHistory.notify_all_observers();
$("#game").fadeOut(100);
$("#globalScoresDiv").fadeOut(100);
$("#gameHistoryTable").fadeIn(100);
console.log( "ok2" );
}
function on_global_scores() {
$.ajax({
url: '/globalScores',
method: 'post',
success: on_global_scores_success,
error: on_try_error,
data: {
},
});
return false;
}
function on_global_scores_success(data){
console.log( "ok" );
var userInfos = (data.array).split(";");
var global_scores_view = new GlobalScoresView("#global-scores-t
emplate", "#globalScoresTable");
var globalScores=new GlobalScores();
for (var i=0; i < userInfos.length; i++){
globalScores.on_one_global_score(userInfos[i].split("-"

));
}
globalScores.add_observer(global_scores_view);
globalScores.notify_all_observers();
$("#game").fadeOut(100);
$("#gameHistoryTable").fadeOut(100);
$("#globalScoresDiv").fadeIn(100);
console.log( "ok2" );
}
function on_link_clicked() {
$.ajax({
url: '/linkClicked',
method: 'post',
success: on_global_scores_success,
error: on_try_error,
data: {
},
});
return false;
}
$(document).ready(function() {
$("#login").submit(on_login);
$("#register").submit(on_register);
console.log( "ready!" );
var el = document.getElementById('newGame');
el.onclick = on_new_game;
var el2 = document.getElementById('gameHistory');
el2.onclick = on_game_history;
var el3 = document.getElementById('globalScores');
el3.onclick = on_global_scores;
$("#try").submit(on_try);
});
</script>
</body>
</html>

You might also like