CryptoMessageInABottle/phpCryptoSite/index.html

89 lines
3.1 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Level2 decrypt challenge</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="theme/bootstrap.css" media="screen">
<link rel="stylesheet" href="theme/usebootstrap.css">
<link rel="stylesheet" href="theme/css.css">
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
<script src="bootstrap/html5shiv.js"></script>
<script src="bootstrap/respond.min.js"></script>
<![endif]-->
</head>
<body>
<div class="container">
<div class="page-header" id="banner">
<div class="row">
<div class="col-lg-6 col-lg-offset-6" id="mainDiv">
<h1>Welcome to level2 decrypt challenge</h1>
<form class="bs-component">
<div class="form-group">
<label class="control-label" for="enc">Encrypted message</label>
<input class="form-control" id="enc" type="text" placeholder="Mffmow mf pmiz!">
</div>
<div class="form-group">
<label class="control-label" for="dec">Decrypted message</label>
<input class="form-control" id="dec" type="text" value="">
</div>
<div class="form-group">
<div class="col-lg-10 col-lg-offset-2 pull-right">
<button id="decBtn" type="submit" class="btn btn-primary">Submit</button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
<script src="https://code.jquery.com/jquery-1.10.2.min.js"></script>
<script src="bootstrap/bootstrap.min.js"></script>
<script src="bootstrap/usebootstrap.js"></script>
<script>
var caesarShift = function(str, amount) {
if (amount < 0)
return caesarShift(str, amount + 26);
var output = '';
for (var i = 0; i < str.length; i ++) {
var c = str[i];
if (c.match(/[a-z]/i)) {
var code = str.charCodeAt(i);
if ((code >= 65) && (code <= 90))
c = String.fromCharCode(((code - 65 + amount) % 26) + 65);
else if ((code >= 97) && (code <= 122))
c = String.fromCharCode(((code - 97 + amount) % 26) + 97);
}
output += c;
}
return output;
};
$( document ).ready(function() {
$("#decBtn").click(function( event ) {
event.preventDefault();
var enc = $("#enc").val();
var dec = $("#dec").val();
var result = "";//caesarShift(enc,-12);
var succeed = false;
for (var i = 1; i <26; i++)
{
result = caesarShift(enc,i);
if (result === dec){
$("#mainDiv").empty().append("<h1 class='text-success'>You made it</h1><h3><a href='./index.html'>click here to<br>Try another code</a></h3>");
succeed = true;
}
if (!succeed)
$("#mainDiv").empty().append("<h1 class='text-danger'>You didn't made it</h1><h3><a href='./index.html'>click here to<br>Try again</a></h3>");
}
});
});
</script>
</body>
</html>