Hey guys, since i love fatigue decks so much (Fatigue Warrior, Mill rogue...) I made a calculator for personal use to help me. I saw alot of people playing those decks on stream and on wild or legend ladder so I figured: Why not making the calculator more accessible for other people to use and release it?
I thought it would be a great idea to let people download an html file so they can store it wherever they want and use it. Now I know there are probably some calculators on the internet but I never searched for one since i have my own so feel free to use it if you want or stick with what you are already using.
<!DOCTYPE html> <html lang=""> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <!-- Created by TheWiggleStorm (HearthPawn) for the hearthstone community -->
<div class="selectCal"> <input class="selected" id="CheckOpponent" type="button" value="Check How much dmg you'r opponent will take"> <input id="CheckMe" type="button" value="Check How much dmg you will take"> </div> <!-- Created by TheWiggleStorm (HearthPawn) for the hearthstone community --> <div class="tips"> <div class="plusMinus"> + </div> <div class="showText"> Tips on how to use the calculator </div> <div class="hideMe"> <ul> <li>Do not include the card draw after you end your turn in the "How many cards is he going to draw" section, the calculator will do it for you.</li> <li> Choose Yes in the "Is it your turn" section if: <ul class="sub"> <li> It is your turn and you want the calculator to also calculate the card drawn after you end your turn. </li> </ul> </li> <li> Choose No in the "Is it your turn" section if: <ul class="sub"> <li> Your enemy will draw the cards in his turn, thus no additional draw after he end his turn. </li> <li> You want to calculate how much dmg will you take, thus no additional draw after you end your turn </li> </ul> </li> </ul> </div> </div> <!-- Created by TheWiggleStorm (HearthPawn) for the hearthstone community --> <div class="wrapper"> <div class="normal"> <h3>Is it your turn :</h3> <h4>(Defult is Yes)</h4> <select id="myTurn"> <option value="1">Yes</option> <option value="2">No</option> </select> </div> <div class="normal"> <h3>How many cards is he going to draw :</h3> <input class="text" type="text" id="howManyCards"> <h4>(Assuming he has no cards left in the deck)</h4> </div> <div> <h3>How much Fatigue dmg did he took last turn :</h3> <input class="text" type="text" id="howMuchDmg"> <h4>(Keep null if none or write 0)</h4> </div> <div class="normal"> <input type="button" id="send" value="Calculate"> </div> <div class="results"> </div> </div>
</body> </html> <!-- Created by TheWiggleStorm (HearthPawn) for the hearthstone community --> <script>
$("#send").on('click', function(){
var howManyCards = $("#howManyCards").val(); var howMuchDmg = $("#howMuchDmg").val(); var isItYourTurn = $("#myTurn").val();
if(!howManyCards || !howMuchDmg){ alert("Please fill out all fields"); } else{ var isItYourTurn = $("#myTurn").val(); var i = 1; if( isItYourTurn == 1){ i = 0; } var dmgEachTurn = 1+parseInt(howMuchDmg); var totalDmg = 0;
for(i; i <= howManyCards; i++){ totalDmg = totalDmg + dmgEachTurn; dmgEachTurn++; } if(isItYourTurn == 1){ $('div.results').html("Your opponent is going to take <span style=\"font-size: 24px;\">" + totalDmg + "</span> Fatigue dmg after you end your turn"); }else{ $('div.results').html("Your opponent is going to take <span style=\"font-size: 24px;\">" + totalDmg + "</span> Fatigue dmg"); }
$('div.results').slideDown(); }
});
var plusMinus = $('.plusMinus'); var hideMe = $('.hideMe'); plusMinus.text('+');
Hey guys, since i love fatigue decks so much (Fatigue Warrior, Mill rogue...) I made a calculator for personal use to help me.
I saw alot of people playing those decks on stream and on wild or legend ladder so I figured:
Why not making the calculator more accessible for other people to use and release it?
I thought it would be a great idea to let people download an html file so they can store it wherever they want and use it.
Now I know there are probably some calculators on the internet but I never searched for one since i have my own so feel free to use it if you want or stick with what you are already using.
Here's a pic of the calculator :
http://imgur.com/a/8jJ2P
So you can either download the html file from here :
http://www46.zippyshare.com/v/qHJgJbtQ/file.html
https://www.mediafire.com/?bbd3nrvgi0kna4m
Or make your own by pasting in this code :
<!DOCTYPE html>
<html lang="">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Created by TheWiggleStorm (HearthPawn) for the hearthstone community -->
<style>
body {
font-family: sans-serif, arial;
background-color: skyblue;
}
div.wrapper {
width: 560px;
background: #f5f5f5;
padding: 20px;
border-radius: 5px;
margin-top: 10px;
}
div.wrapper h3 {
display: inline-block;
margin: 0;
padding: 0;
font-size: 18px;
}
div.wrapper h4 {
display: inline-block;
margin: 0;
padding: 0;
color: grey;
font-weight: normal;
font-style: italic;
font-size: 14px;
}
div.wrapper div.normal {
margin-top: 10px;
width: 560px;
}
div.results {
padding: 5px;
margin-top: 10px;
background: black;
color: white;
font-weight: bolder;
font-size: 14px;
text-align: center;
display: none;
}
div.wrapper div:first-child {
margin: 0;
}
div.wrapper input.text {
width: 20px;
padding: 3px;
text-align: center;
border: none;
border-radius: 5px;
background: black;
color: white;
}
div.wrapper input#send {
padding: 6px;
font-weight: bold;
border: none;
border-radius: 5px;
background: black;
color: white;
}
div.selectCal input{
padding: 6px;
font-weight: bold;
border: none;
border-radius: 3px;
background: #f5f5f5;
color: black;
}
div.selectCal input.selected{
padding: 6px;
font-weight: bold;
border: none;
border-radius: 3px;
background: black;
color: white;
}
div.tips {
width: 560px;
margin-top: 10px;
background: #f5f5f5;
padding: 10px 20px;
border-radius: 5px;
font-size: 14px;
font-style: italic;
}
div.tips ul, li {
margin-left: 5px;
padding: 0;
}
div.tips li {
margin-top: 10px;
}
div.tips li:first-child {
margin-top: 0;
}
div.tips ul.sub li {
margin: 0;
font-size: 12px;
}
div.plusMinus {
float: right;
width: 15px;
height: 15px;
background: black;
color: white;
text-align: center;
cursor: pointer;
font-weight: bold;
margin: 2px -10px 2px 0;
border-radius: 2px;
}
div.showText {
font-style: normal;
font-weight: bold;
font-size: 18px;
}
div.hideMe {
display: none;
}
</style>
<title>Fatigue calculator</title>
</head>
<body>
<div class="selectCal">
<input class="selected" id="CheckOpponent" type="button" value="Check How much dmg you'r opponent will take">
<input id="CheckMe" type="button" value="Check How much dmg you will take">
</div>
<!-- Created by TheWiggleStorm (HearthPawn) for the hearthstone community -->
<div class="tips">
<div class="plusMinus">
+
</div>
<div class="showText">
Tips on how to use the calculator
</div>
<div class="hideMe">
<ul>
<li>Do not include the card draw after you end your turn in the "How many cards is he going to draw" section, the calculator will do it for you.</li>
<li>
Choose Yes in the "Is it your turn" section if:
<ul class="sub">
<li>
It is your turn and you want the calculator to also calculate the card drawn after you end your turn.
</li>
</ul>
</li>
<li>
Choose No in the "Is it your turn" section if:
<ul class="sub">
<li>
Your enemy will draw the cards in his turn, thus no additional draw after he end his turn.
</li>
<li>
You want to calculate how much dmg will you take, thus no additional draw after you end your turn
</li>
</ul>
</li>
</ul>
</div>
</div>
<!-- Created by TheWiggleStorm (HearthPawn) for the hearthstone community -->
<div class="wrapper">
<div class="normal">
<h3>Is it your turn :</h3>
<h4>(Defult is Yes)</h4>
<select id="myTurn">
<option value="1">Yes</option>
<option value="2">No</option>
</select>
</div>
<div class="normal">
<h3>How many cards is he going to draw :</h3>
<input class="text" type="text" id="howManyCards">
<h4>(Assuming he has no cards left in the deck)</h4>
</div>
<div>
<h3>How much Fatigue dmg did he took last turn :</h3>
<input class="text" type="text" id="howMuchDmg">
<h4>(Keep null if none or write 0)</h4>
</div>
<div class="normal">
<input type="button" id="send" value="Calculate">
</div>
<div class="results">
</div>
</div>
</body>
</html>
<!-- Created by TheWiggleStorm (HearthPawn) for the hearthstone community -->
<script>
$("#send").on('click', function(){
var howManyCards = $("#howManyCards").val();
var howMuchDmg = $("#howMuchDmg").val();
var isItYourTurn = $("#myTurn").val();
if(!howManyCards || !howMuchDmg){
alert("Please fill out all fields");
}
else{
var isItYourTurn = $("#myTurn").val();
var i = 1;
if( isItYourTurn == 1){
i = 0;
}
var dmgEachTurn = 1+parseInt(howMuchDmg);
var totalDmg = 0;
for(i; i <= howManyCards; i++){
totalDmg = totalDmg + dmgEachTurn;
dmgEachTurn++;
}
if(isItYourTurn == 1){
$('div.results').html("Your opponent is going to take <span style=\"font-size: 24px;\">" + totalDmg + "</span> Fatigue dmg after you end your turn");
}else{
$('div.results').html("Your opponent is going to take <span style=\"font-size: 24px;\">" + totalDmg + "</span> Fatigue dmg");
}
$('div.results').slideDown();
}
});
var plusMinus = $('.plusMinus');
var hideMe = $('.hideMe');
plusMinus.text('+');
plusMinus.on('click', function(){
if(plusMinus.text() === "+"){
hideMe.show();
plusMinus.text('-');
}else {
hideMe.hide();
plusMinus.text('+');
}
});
</script>
I hope you find this helpfull, enjoy!