I'm making a Numerology conversion web app with JavaScript and HTML5. I've ran into a strange issue with a variable and loops. Below is my whole project in its current form.
<html>
<body>
<h1>My First Numerology Project</h1>
<form>
Month:<br>
<input type="text" maxlength="2" name="userInputMonth" id='userInputMonth'>
<br>
Day:<br>
<input type="text" maxlength="2" name="userInputDay" id='userInputDay'>
<br>
Year:<br>
<input type="text" maxlength="4" name="userInputYear" id='userInputYear'>
<br><br>
First Name:<br>
<input type="text" name="userInputFirstName" id='userInputFirstName'>
<br>
Middle Name:<br>
<input type="text" name="userInputMiddleName" id='userInputMiddleName'>
<br>
Last Name:<br>
<input type="text" name="userInputLastName" id='userInputLastName'>
<br><br>
<input type="button" value="Calculate" name="Calculate" onclick="BirthDayCalculation()"/>
</form>
<p id="LLNResult"></p>
<br>
<p id="OPNResult"></p>
<br>
<p id="SNResult"></p>
<br>
<p id="PODNResult"></p>
<script type="text/javascript">
//Defined var
var LLNTemp1;
var LLNTemp2;
var LLNReduce1;
var LLNReduce2;
var NameTemp1;
var NameTemp2;
var OPNReduce1;
var OPNReduce2;
var SNReduce1;
var SNReduce2;
var PODNReduce1;
var PODNReduce2;
function BirthDayCalculation() {
var Reduction1 = 0;
var LLNReduceFinal2 = 0;
var Day = document.getElementById('userInputDay').value;
var Month = document.getElementById('userInputMonth').value;
var Year = document.getElementById('userInputYear').value;
var FirstName = document.getElementById('userInputFirstName').value;
var MiddleName = document.getElementById('userInputMiddleName').value;
var LastName = document.getElementById('userInputLastName').value;
var LLN = ("" + Day + Month + Year).toString();
var FullName = ("" + FirstName + MiddleName + LastName).toString().toUpperCase();
var FullNameLength = parseInt(FullName.length);
var LLNLength = parseInt(("" + Day + Month + Year).length);
var i = 0;
var LLNTemp2 = 0;
while (i < LLNLength) {
LLNTemp1 = parseInt(LLN.charAt(i));
LLNTemp2 += LLNTemp1;
i++;
}
if (LLNTemp2 > 9) {
var i = 0;
var a = parseInt(LLNTemp2.toString().length);
var LLNReduceFinal1 = 0;
var LLNTemp3String = LLNTemp2.toString();
while (i < a) {
LLNReduce1 = parseInt(LLNTemp3String.charAt(i));
LLNReduceFinal1 += LLNReduce1;
i++;
}
var LLNReduceFinal2 = 0;
var Reduction1 = LLNReduceFinal1;
if (LLNReduceFinal1 > 9) {
var i = 0;
var a = parseInt(Reduction1.toString().length);
var LLNTemp3String = Reduction1.toString();
while (i < a) {
LLNReduce1 = parseInt(LLNTemp3String.charAt(i));
LLNReduceFinal2 += LLNReduce1;
i++;
}
}
}
var OPN = 0;
var SN = 0;
var PODN = 0;
var PODNWhole = 0;
var i = 0;
while (i < FullNameLength) {
NameTemp1 = FullName.charAt(i);
var OPNTemp = 0;
var SNTemp = 0;
if (NameTemp1 == "A") SNTemp = 1;
if (NameTemp1 == "J" || NameTemp1 == "S") OPNTemp = 1;
if (NameTemp1 == "B" || NameTemp1 == "K" || NameTemp1 == "T") OPNTemp = 2;
if (NameTemp1 == "C" || NameTemp1 == "L") OPNTemp = 3;
if (NameTemp1 == "U") SNTemp = 3;
if (NameTemp1 == "D" || NameTemp1 == "M" || NameTemp1 == "V") OPNTemp = 4;
if (NameTemp1 == "E") SNTemp = 5;
if (NameTemp1 == "N" || NameTemp1 == "W") OPNTemp = 5;
if (NameTemp1 == "F" || NameTemp1 == "X") OPNTemp = 6;
if (NameTemp1 == "O") SNTemp = 6;
if (NameTemp1 == "G" || NameTemp1 == "P" || NameTemp1 == "Y") OPNTemp = 7;
if (NameTemp1 == "H" || NameTemp1 == "Q" || NameTemp1 == "Z") OPNTemp = 8;
if (NameTemp1 == "I") SNTemp = 9;
if (NameTemp1 == "R") OPNTemp =9;
OPN += OPNTemp;
SN += SNTemp;
PODNWhole += SNTemp;
PODNWhole += OPNTemp;
i++;
}
var PODN = PODNWhole
var OPNReduceFinal = 0;
if (OPN > 9) {
var OPNLength = parseInt(OPN.toString().length);
var OPNTempString = OPN.toString();
var i = 0;
while (i < OPNLength) {
OPNReduce1 = parseInt(OPNTempString.charAt(i));
OPNReduceFinal += OPNReduce1;
i++;
}
}
var SNReduceFinal = 0;
if (SN > 9) {
var SNLength = parseInt(SN.toString().length);
var SNTempString = SN.toString();
var i = 0;
while (i < SNLength) {
SNReduce1 = parseInt(SNTempString.charAt(i));
SNReduceFinal += SNReduce1;
i++;
}
}
var PODNReduceFinal = 0;
if (PODN > 9) {
var PODNLength = parseInt(PODN.toString().length);
var PODNTempString = PODN.toString();
var i = 0;
while (i < PODNLength) {
PODNReduce1 = parseInt(PODNTempString.charAt(i));
PODNReduceFinal += PODNReduce1;
i++;
}
// var PODNReduceFinal = PODNReduce2;
// var PODN = PODNReduce2;
}
var LLNResult = "Your Life Lesson Number Is:" + LLNTemp2 + "/" + Reduction1;
if (LLNReduceFinal2 != 0) {
LLNResult = LLNResult + "/" + LLNReduceFinal2;
}
var OPNResult = "Your Outer Personality Number is:" + OPN;
if (OPNReduceFinal != 0) {
var OPNResult = OPNResult + "/" + OPNReduceFinal;
}
var SNResult = "Your Soul Number is:" + SN;
if (SNReduceFinal != 0) {
var SNResult = SNResult + "/" + SNReduceFinal;
}
var PODNResult = "Your Path of Destiny Number is:" + PODNWhole;
if (PODNReduceFinal != 0) {
var PODNResult = PODNResult + "/" + PODNReduceFinal;
}
if (LLNTemp2 != 0) {
document.getElementById("LLNResult").innerHTML = LLNResult;
}
if (PODNWhole != 0) {
document.getElementById("OPNResult").innerHTML = OPNResult;
document.getElementById("SNResult").innerHTML = SNResult;
document.getElementById("PODNResult").innerHTML = PODNResult;
}
}
</script>
</body>
</html>
So basically you enter your birthday and full name into a form. the script will then convert the name to numbers A = 1, B = 2.... and reduce both to single digits. the numbers will be added one by one. example. 13=4, 55=10, 63=9.
Here is the general code used to make reductions. Let's make PODN = 55
var PODNReduceFinal = 0;
var PODN = 55;
if (PODN > 9) {
var PODNLength = parseInt(PODN.toString().length);
var PODNTempString = PODN.toString();
var i = 0;
while (i < PODNLength) {
PODNReduce1 = parseInt(PODNTempString.charAt(i));
PODNReduceFinal += PODNReduce1;
i++;
}
}
Currently, it only loops once but I would like to have it get reduced to the lowest number possible. 1 in this case. I was thinking that if I change the if to a while it would accomplish this but it doesn't work the way I thought it would. I tried to make some changes and got stuck in a loop. So I started to troubleshoot. I added another variable to prevent the whole loop from looping infinitely.
var PODNReduceFinal = 0;
var PODN = 55;
while (PODN > 9) {
var PODNLength = parseInt(PODN.toString().length);
var PODNTempString = PODN.toString();
var i = 0;
while (i < PODNLength) {
PODNReduce1 = parseInt(PODNTempString.charAt(i));
PODNReduce2 += PODNReduce1;
i++;
}
var PODNReduceFinal = PODNReduce2;
var PODN = PODNReduce2;
}
Using this I thought when PODN would be checked by the while loop first it would run through the first steps. Get the length of the number, in this case 2. Convert it to a string so it can pull the digits one by one. Pull the digits in sequence with the length of the loop and convert them to numbers. Add them together in PODNReduce2, 55=10. Set PODNReduceFinal = 10, set PODN = 10. Then return to the first condition and check that PODN is now 10 and is greater than 9. Loop again to reduce further. Doing this until it's a single digit stored in PODNReduceFinal. But that's not what happens. When I try to display PODNReduceFinal I get NaN. Even if I revert the first "while" to "if" it still doesn't work. I'm at a loss. Please help.
I have a dynamic form and in that many fields I want to be autocalculated when user goes on with the form. In the form I have 2 radio button mrp and rate. By default mrp is selected. If user doesn't change the default button selected, the value totalCst will be calculated as qty*mrp*cstpercent of all the rows.
If user selects rate radiobutton the value will be calculated as qty*rate*cstpercent of all the rows. I'll add the onchange event later. First I want to get the value totalCst calculated on mrp only or rate whichever is selected.
Radio Button code -
<div class="form-group pull-right">
<label class="radio-inline"><input type="radio" name="taxon" id="mrp" value="mrp" checked="checked">MRP</label>
<label class="radio-inline"><input type="radio" name="taxon" id="rate" value="rate">Rate</label>
</div>
JS
<?php
/* start getting the total amount */
$this->registerJs('
function getSum() {
var sum = 0;
var totalDiscount = 0;
var totalMrp = 0;
var totalCst = 0;
var totalWbst = 0;
var totalCstonamount = 0;
var totalWbstonamount = 0;
var totalCstonmrp = 0;
var totalWbstonmrp = 0;
var cstperValue = $(".cstPercent").val();
var wbstperValue = $(".wbstPercent").val();
var selectedValue = $("input[name=taxon]:checked").val();
alert(selectedValue);
var items = $(".item");
items.each(function (index, elem) {
var qtyValue = $(elem).find(".qty").val();
var rateValue = $(elem).find(".rate").val();
var discValue = $(elem).find(".disc").val();
var mrpValue = $(elem).find(".mrp").val();
var freeValue = $(elem).find(".free").val();
sum = (parseFloat(sum) + (parseFloat(qtyValue) * parseFloat(rateValue))).toFixed(2);
totalDiscount = (parseFloat(totalDiscount) + ((parseFloat(qtyValue) * parseFloat(rateValue) * parseFloat(discValue))/100)).toFixed(2);
totalMrp = (parseFloat(totalMrp) + ((parseFloat(qtyValue) + parseFloat(freeValue)) * parseFloat(mrpValue))).toFixed(2);
totalCstonamount = (parseFloat(totalCst) + ((parseFloat(qtyValue) * parseFloat(rateValue)) * parseFloat(cstperValue))/100).toFixed(2);
totalWbstonamount = (parseFloat(totalWbst) + ((parseFloat(qtyValue) * parseFloat(rateValue)) * parseFloat(wbstperValue))/100).toFixed(2);
totalCstonmrp = (parseFloat(totalCst) + (((parseFloat(qtyValue) + parseFloat(freeValue)) * parseFloat(mrpValue)) * parseFloat(cstperValue))/100).toFixed(2);
totalWbstonmrp = (parseFloat(totalWbst) + (((parseFloat(qtyValue) + parseFloat(freeValue)) * parseFloat(mrpValue)) * parseFloat(wbstperValue))/100).toFixed(2);
});
if(isNaN(sum) || sum.length == 0) {
sum = 0;
}
if(isNaN(totalDiscount) || totalDiscount.length == 0) {
totalDiscount = 0;
}
if(isNaN(totalMrp) || totalMrp.length == 0) {
totalMrp = 0;
}
if(isNaN(totalCstonamount) || totalCstonamount.length == 0) {
totalCstonamount = 0;
}
if(isNaN(totalWbstonamount) || totalWbstonamount.length == 0) {
totalWbstonamount = 0;
}
if(isNaN(totalCstonmrp) || totalCstonmrp.length == 0) {
totalCstonmrp = 0;
}
if(isNaN(totalWbstonmrp) || totalWbstonmrp.length == 0) {
totalWbstonmrp = 0;
}
$(".sum").val(sum);
$(".totalDiscount").val(totalDiscount);
$(".totalMrp").val(totalMrp);
if (selectedValue == "mrp") {
getSum();
$(".totalCst").val(totalCstonmrp);
}
else if (selectedValue == "rate") {
getSum();
$(".totalCst").val(totalCstonamount);
}
}
$(".container-items").on("change", function() {
getSum();
});
$(".cstPercent").on("change", function() {
getSum();
});
$(".wbstPercent").on("change", function() {
getSum();
});
jQuery(".dynamicform_wrapper").on("afterDelete", function(e) {
getSum();
});
');
/*end getting the total amount */
?>
I'm getting the value selected in alert but too many popup and getting error -
Too much recursion
Updated JS
<?php
/* start getting the total amount */
$this->registerJs('
var totalCstonamount = 0;
var totalWbstonamount = 0;
var totalCstonmrp = 0;
var totalWbstonmrp = 0;
function getSum() {
var sum = 0;
var totalDiscount = 0;
var totalMrp = 0;
var totalCst = 0;
var totalWbst = 0;
// var totalCstonamount = 0;
// var totalWbstonamount = 0;
// var totalCstonmrp = 0;
// var totalWbstonmrp = 0;
var cstperValue = $(".cstPercent").val();
var wbstperValue = $(".wbstPercent").val();
//var selectedValue = $("input[name=taxon]:checked").val();
//alert(selectedValue);
var items = $(".item");
items.each(function (index, elem) {
var qtyValue = $(elem).find(".qty").val();
var rateValue = $(elem).find(".rate").val();
var discValue = $(elem).find(".disc").val();
var mrpValue = $(elem).find(".mrp").val();
var freeValue = $(elem).find(".free").val();
sum = (parseFloat(sum) + (parseFloat(qtyValue) * parseFloat(rateValue))).toFixed(2);
totalDiscount = (parseFloat(totalDiscount) + ((parseFloat(qtyValue) * parseFloat(rateValue) * parseFloat(discValue))/100)).toFixed(2);
totalMrp = (parseFloat(totalMrp) + ((parseFloat(qtyValue) + parseFloat(freeValue)) * parseFloat(mrpValue))).toFixed(2);
totalCstonamount = (parseFloat(totalCst) + ((parseFloat(qtyValue) * parseFloat(rateValue)) * parseFloat(cstperValue))/100).toFixed(2);
totalWbstonamount = (parseFloat(totalWbst) + ((parseFloat(qtyValue) * parseFloat(rateValue)) * parseFloat(wbstperValue))/100).toFixed(2);
totalCstonmrp = (parseFloat(totalCst) + (((parseFloat(qtyValue) + parseFloat(freeValue)) * parseFloat(mrpValue)) * parseFloat(cstperValue))/100).toFixed(2);
totalWbstonmrp = (parseFloat(totalWbst) + (((parseFloat(qtyValue) + parseFloat(freeValue)) * parseFloat(mrpValue)) * parseFloat(wbstperValue))/100).toFixed(2);
});
if(isNaN(sum) || sum.length == 0) {
sum = 0;
}
if(isNaN(totalDiscount) || totalDiscount.length == 0) {
totalDiscount = 0;
}
if(isNaN(totalMrp) || totalMrp.length == 0) {
totalMrp = 0;
}
if(isNaN(totalCstonamount) || totalCstonamount.length == 0) {
totalCstonamount = 0;
}
if(isNaN(totalWbstonamount) || totalWbstonamount.length == 0) {
totalWbstonamount = 0;
}
if(isNaN(totalCstonmrp) || totalCstonmrp.length == 0) {
totalCstonmrp = 0;
}
if(isNaN(totalWbstonmrp) || totalWbstonmrp.length == 0) {
totalWbstonmrp = 0;
}
$(".sum").val(sum);
$(".totalDiscount").val(totalDiscount);
$(".totalMrp").val(totalMrp);
// if (selectedValue == "mrp") {
// getSum();
// $(".totalCst").val(totalCstonmrp);
// }
// else if (selectedValue == "rate") {
// getSum();
// $(".totalCst").val(totalCstonamount);
// }
}
function getSumonclick(){
}
$(".container-items").on("change", function() {
getSum();
});
$(".cstPercent").on("change", function() {
getSum();
});
$(".wbstPercent").on("change", function() {
getSum();
});
getSum();
var selectedValue = $("input[name=taxon]:checked").val();
// var totalCstonamount = 200;
// var totalWbstonamount = 0;
// var totalCstonmrp = 100;
// var totalWbstonmrp = 0;
if (selectedValue == "mrp") {
getSum();
if(isNaN(totalCstonmrp) || totalCstonmrp.length == 0) {
totalCstonmrp = 0;
}
$(".totalCst").val(totalCstonmrp);
}
else if (selectedValue == "rate") {
getSum();
if(isNaN(totalCstonamount) || totalCstonamount.length == 0) {
totalCstonamount = 0;
}
$(".totalCst").val(totalCstonamount);
}
jQuery(".dynamicform_wrapper").on("afterDelete", function(e) {
getSum();
});
');
/*end getting the total amount */
?>
As per my understanding, Now the issue turns out to be to get the calculated values from inside of getSum function to outside of it.
First I want to get the value totalCst calculated on mrp only or rate
whichever is selected.
You can use the ternary operator here, rather than if... else...:
var factor = (factorMrp.checked ? 'mrp' : 'rate');
Working Example:
var factors = document.getElementById('factors');
var factorMrp = document.getElementById('mrp');
var factorRate = document.getElementById('rate');
var paragraph = document.getElementsByTagName('p')[0];
factorMrp.checked = true;
function checkFactor() {
var factor = (factorMrp.checked ? 'mrp' : 'rate');
paragraph.textContent = 'The value totalCst will be calculated as qty * ' + factor + ' * cstpercent of all the rows.';
}
factors.addEventListener('change',checkFactor,false);
window.addEventListener('load',checkFactor,false);
fieldset {
display: inline-block;
}
<form>
<fieldset id="factors">
<label class="radio-inline"><input type="radio" name="taxon" id="mrp" value="mrp" checked="checked">MRP</label>
<label class="radio-inline"><input type="radio" name="taxon" id="rate" value="rate">Rate</label>
</fieldset>
</form>
<p></p>
I am attempting to create a Tic Tac Toe game using Javascript as part of my learning on FreeCodeCamp and after my 5th attempt still haven't managed to get it to work. I think i'm doing the correct thing, but the computer AI is still making very stupid decisions and loosing.
Here is my entire AI function, which can be called using a console log to see the recommended move from the AI. However when i hard code values for moves already taken and ask for the next move, it doesn't pick what i would expect.
/*
Attempt to inplement a Tic Tac Toe minimax game
5th attempt, so hopefully this time it works!
*/
var util = require("util");
//These are all the winning square sequences, as string to make various things easier
var validRows = [
['00','01','02'], // left column
['10','11','12'], // middle column
['20','21','22'], // right column
['00','10','20'], // top row
['01','11','21'], // middle row
['02','12','22'], // bottom row
['00','11','22'], // Diag TL to BR
['20','11','02'] // Diag BL to TR
];
//Our scoring arrays for evaulating moves
var max1 = ['100','010','001'];
var min1 = ['200','020','002'];
var max2 = ['110','011'];
var min2 = ['220','022'];
var max3 = ['111'];
var min3 = ['222'];
//All the valid squares
var validSquaresFactory = ['00','10','20','01','11','21','02','12','22'];
//Store all the moves somewhere
//var computerMoves = ['10','22'];
//var userMoves = ['00','02'];
//Store all the moves somewhere
var computerMoves = ['11','22'];
var userMoves = ['00','01'];
function Board(minOrMax,computerMoves,userMoves){
this.computer = computerMoves;
this.user = userMoves;
this.minOrMax = minOrMax;
this.remaining = this.genRemaining();
this.complete = this.genComplete();
var results = this.getScore();
this.score = results[0];
this.winOrLoose = results[1];
}
Board.prototype.genRemaining = function(){
//Create an array of all moves taken
var takenMoves = this.computer.concat(this.user);
//Calculate all remaining squares
var validSquares = validSquaresFactory.filter(function(object){
return takenMoves.indexOf(object) === -1;
});
return validSquares;
}
Board.prototype.genComplete = function(){
return ((this.computer.length + this.user.length) === 9);
}
Board.prototype.flipMinOrMax = function(){
return (this.minOrMax === 'max') ? 'min' : 'max'
}
Board.prototype.genArrays = function(minOrMax,square){
var tempUser = this.user.slice(0);
var tempComputer = this.computer.slice(0);
if(minOrMax === 'min'){
tempUser.push(square);
} else {
tempComputer.push(square);
}
return [tempComputer,tempUser];
}
Board.prototype.generateBoards = function(minOrMax){
var boards = [];
var that = this;
this.remaining.forEach(function(remainingSquare){
var moves = that.genArrays(minOrMax,remainingSquare);
boards.push(new Board(minOrMax,moves[0],moves[1]));
})
//console.log(boards);
return boards;
}
Board.prototype.getScore = function(){
var that = this;
var winOrLoose = false;
var returnScore = validRows.reduce(function(storage,row,index,array){
var score = row.reduce(function(storage1,square){
if (that.computer.indexOf(square) !== -1) {
storage1 += '1';
} else if (that.user.indexOf(square) !== -1) {
storage1 += '2';
} else {
storage1 += '0';
}
return storage1;
},'')
var finalScore = 0;
if(max1.indexOf(score) != -1){
finalScore = 1;
} else if(min1.indexOf(score) != -1){
finalScore = -1;
} else if(max2.indexOf(score) != -1){
finalScore = 10;
} else if(min2.indexOf(score) != -1){
finalScore = -10;
} else if(max3.indexOf(score) != -1){
winOrLoose = true;
finalScore = 100;
} else if(min3.indexOf(score) != -1){
winOrLoose = false;
finalScore = -100;
}
storage.push(finalScore);
return storage;
},[])
var condensedReturnScore = returnScore.reduce(function(storage,score){
return storage+score;
})
return [condensedReturnScore,winOrLoose];
}
function generateMove(){
var board = new Board('max',computerMoves,userMoves);
var scores = [];
var boards = board.generateBoards('max');
boards.forEach(function(board){
scores.push(testMove(board,4));
});
scores = scores.map(function(score,index){
return [board.remaining[index],score];
});
var returnValue = scores.reduce(function(storage,score){
return (score[1].score > storage[1].score) ? score : storage;
});
return [returnValue[0],returnValue[1].score];
}
function testMove(masterBoard,count){
count --;
var boards = [];
boards = masterBoard.generateBoards(generateMinOrMax(masterBoard.minOrMax));
//console.log('/////////Master Board/////////');
//console.log(masterBoard);
//console.log(boards);
//console.log('//////////////////////////////');
boards = boards.map(function (move) {
if (move.complete === true || count === 0 || move.winOrLoose === true){
return move;
} else {
var returnScore = testMove(move,count);
return returnScore;
}
});
returnBoard = boards.reduce(function(storage,board,index,array){
if(board.minOrMax === 'max'){
return (board.score > storage.score) ? board : storage;
} else {
return (board.score < storage.score) ? board : storage;
}
});
return returnBoard;
}
function generateMinOrMax(minOrMax){
return (minOrMax === 'max') ? 'min' : 'max'
}
I've checked the scoring function and from what i can see it is returning the expected score for any move i try, but because of the shear number of possibilities calculated it's very hard to debug efficiently.
Any help/pointers on this would be most appreciated as i have really hit a brick wall with this, can't see the forrest for the trees e.t.c
If you would like to test this with the GUI, it's on codepen at - http://codepen.io/gazzer82/pen/yYZmvJ?editors=001
So after banging my head against this for day, as soon as i posted this i found the issues. Firstly using the wrong variable for minormax in my reduce function, so it wasn't flipping correctly and not setting the winOrLoose value correctly for a score of -100. Here is the corrected version.
*
Attempt to inplement a Tic Tac Toe minimax game
5th attempt, so hopefully this time it works!
*/
var util = require("util");
//These are all the winning square sequences, as string to make various things easier
var validRows = [
['00','01','02'], // left column
['10','11','12'], // middle column
['20','21','22'], // right column
['00','10','20'], // top row
['01','11','21'], // middle row
['02','12','22'], // bottom row
['00','11','22'], // Diag TL to BR
['20','11','02'] // Diag BL to TR
];
//Our scoring arrays for evaulating moves
var max1 = ['100','010','001'];
var min1 = ['200','020','002'];
var max2 = ['110','011'];
var min2 = ['220','022'];
var max3 = ['111'];
var min3 = ['222'];
//All the valid squares
var validSquaresFactory = ['00','10','20','01','11','21','02','12','22'];
//Store all the moves somewhere
//var computerMoves = ['10','22'];
//var userMoves = ['00','02'];
//Store all the moves somewhere
var computerMoves = ['00','20','01'];
var userMoves = ['10','11','02'];
//01,21,22 - 01//
function Board(minOrMax,computerMoves,userMoves){
this.computer = computerMoves;
this.user = userMoves;
this.minOrMax = minOrMax;
this.remaining = this.genRemaining();
this.complete = this.genComplete();
var results = this.getScore();
this.score = results[0];
this.winOrLoose = results[1];
}
Board.prototype.genRemaining = function(){
//Create an array of all moves taken
var takenMoves = this.computer.concat(this.user);
//Calculate all remaining squares
var validSquares = validSquaresFactory.filter(function(object){
return takenMoves.indexOf(object) === -1;
});
return validSquares;
}
Board.prototype.genComplete = function(){
return ((this.computer.length + this.user.length) === 9);
}
Board.prototype.flipMinOrMax = function(){
return (this.minOrMax === 'max') ? 'min' : 'max'
}
Board.prototype.genArrays = function(minOrMax,square){
var tempUser = this.user.slice(0);
var tempComputer = this.computer.slice(0);
if(minOrMax === 'min'){
tempUser.push(square);
} else {
tempComputer.push(square);
}
return [tempComputer,tempUser];
}
Board.prototype.generateBoards = function(minOrMax){
var boards = [];
var that = this;
this.remaining.forEach(function(remainingSquare){
var moves = that.genArrays(minOrMax,remainingSquare);
boards.push(new Board(minOrMax,moves[0],moves[1]));
})
//console.log(boards);
return boards;
}
Board.prototype.getScore = function(){
var that = this;
var winOrLoose = false;
var returnScore = validRows.reduce(function(storage,row,index,array){
var score = row.reduce(function(storage1,square){
if (that.computer.indexOf(square) !== -1) {
storage1 += '1';
} else if (that.user.indexOf(square) !== -1) {
storage1 += '2';
} else {
storage1 += '0';
}
return storage1;
},'')
var finalScore = 0;
if(max1.indexOf(score) != -1){
finalScore = 1;
} else if(min1.indexOf(score) != -1){
finalScore = -1;
} else if(max2.indexOf(score) != -1){
finalScore = 10;
} else if(min2.indexOf(score) != -1){
finalScore = -10;
} else if(max3.indexOf(score) != -1){
winOrLoose = true;
finalScore = 100;
} else if(min3.indexOf(score) != -1){
winOrLoose = true;
finalScore = -100;
}
storage.push(finalScore);
return storage;
},[])
var condensedReturnScore = returnScore.reduce(function(storage,score){
return storage+score;
})
return [condensedReturnScore,winOrLoose];
}
function generateMove() {
var board = new Board('max', computerMoves, userMoves);
if (board.remaining.length === 1) {
return [board.remaining[0], 0];
} else {
var scores = [];
var boards = board.generateBoards('max');
boards.forEach(function (board) {
scores.push(testMove(board, 4));
});
scores = scores.map(function (score, index) {
return [board.remaining[index], score];
});
var returnValue = scores.reduce(function (storage, score) {
return (score[1].score > storage[1].score) ? score : storage;
});
return [returnValue[0], returnValue[1].score];
}
}
function testMove(masterBoard,count){
count --;
var boards = [];
boards = masterBoard.generateBoards(generateMinOrMax(masterBoard.minOrMax));
boards = boards.map(function (move) {
if (move.complete === true || count <= 0 || move.winOrLoose === true){
return move;
} else {
var returnScore = testMove(move,count);
return returnScore;
}
});
returnBoard = boards.reduce(function(storage,board,index,array){
if(generateMinOrMax(masterBoard.minOrMax) === 'max'){
return (board.score > storage.score) ? board : storage;
} else {
return (board.score < storage.score) ? board : storage;
}
});
return returnBoard;
}
function generateMinOrMax(minOrMax){
return (minOrMax === 'max') ? 'min' : 'max'
}
function getScore(user,computer,minOrMax){
var that = this;
that.computer = computer;
that.user = user;
that.minOrMax = minOrMax;
var returnScore = validRows.reduce(function(storage,row,index,array){
var score = row.reduce(function(storage1,square){
if (that.computer.indexOf(square) !== -1) {
storage1 += '1';
} else if (that.user.indexOf(square) !== -1) {
storage1 += '2';
} else {
storage1 += '0';
}
return storage1;
},'')
var finalScore = 0;
if(max1.indexOf(score) != -1){
finalScore = 1;
} else if(min1.indexOf(score) != -1){
finalScore = -1;
} else if(max2.indexOf(score) != -1){
finalScore = 10;
} else if(min2.indexOf(score) != -1){
finalScore = -10;
} else if(max3.indexOf(score) != -1){
finalScore = 100;
} else if(min3.indexOf(score) != -1){
finalScore = -100;
}
storage.push(finalScore);
return storage;
},[])
var condensedReturnScore = returnScore.reduce(function(storage,score){
if(that.minOrMax === 'max'){
return (score >= storage) ? score : storage;
} else {
return (score <= storage) ? score : storage;
}
})
return condensedReturnScore;
}
I am creating a website application that allows users to select a seat, if it is not already reserved, and reserve it.
I have created a very round about way of getting the seats that are previously reserved using iFrames, however that was temporarily, now I need to make it secure and "proper javascript code" using proper practices. I have no clue what AJAX (or JSON) is, nor how to add it to this code, but it needs to get the file "seatsReserved"+this.id(that is the date)+"Que.html" and compare the string of previously reserved seats to see which class to make the element. If this is horrible, or if any of the other things could work better, I am open to criticism to everything. Thank you all!
Here is the javascript code:
A little side note, all of the if statements are due to different amount of seats in each row
<script>
var i = " 0 ";
var counter = 0;
var leng=0;
document.getElementById("Show1").addEventListener("click", changeDay);
document.getElementById("Show2").addEventListener("click", changeDay);
document.getElementById("Show3").addEventListener("click", changeDay);
function changeDay() {
var iFrame = document.getElementById("seatList");
iFrame.src = "seatsReserved" + this.id + "Que.html";
document.getElementById('date').innerHTML = this.id;
var seatsTaken = iFrame.contentWindow.document.body.innerHTML;
var k = 0;
let = 'a';
var lc = 0;
for (lc = 1; lc <= 14; lc++) {
if (lc == 1) {
leng = 28;
}
else if (lc == 2) {
leng = 29;
}
else if (lc == 3) {
leng = 32;
}
else if (lc == 4 || lc == 6 || lc == 12 || lc == 14) {
leng = 33;
}
else if (lc == 5 || lc == 13) {
leng = 34;
}
else if (lc == 8 || lc == 10) {
leng = 35;
}
else {
leng = 36;
}
for (k = 1; k <= leng; k++) {
if (seatsTaken.indexOf((" " +
let +k + " ")) <= -1) {
seat = document.getElementById(let +k);
seat.removeEventListener("click", selectedSeat);
}
else {
document.getElementById(let +k).className = "openseat";
document.getElementById(let +k).removeEventListener("click", doNothing);
}
}
let = String.fromCharCode(let.charCodeAt(0) + 1);
}
}
function loadChanges() {
var iFrame = document.getElementById("seatList");
var seatsTaken = iFrame.contentWindow.document.body.innerHTML;
var k = 0;
let = 'a';
var lc = 0;
var leng = 0;
for (lc = 1; lc <= 14; lc++) {
if (lc == 1) {
leng = 28;
}
else if (lc == 2) {
leng = 29;
}
else if (lc == 3) {
leng = 32;
}
else if (lc == 4 || lc == 6 || lc == 12 || lc == 14) {
leng = 33;
}
else if (lc == 5 || lc == 13) {
leng = 34;
}
else if (lc == 8 || lc == 10) {
leng = 35;
}
else {
leng = 36;
}
for (k = 1; k <= leng; k++) {
if (seatsTaken.indexOf((" " +
let +k + " ")) <= -1) {
seat = document.getElementById(let +k);
seat.addEventListener("click", selectedSeat);
seat.className = "openseat";
}
else {
document.getElementById(let +k).className = "notAvailible";
document.getElementById(let +k).addEventListener("click", doNothing);
}
}
let = String.fromCharCode(let.charCodeAt(0) + 1);
}
i = " 0 ";
counter = 0;
document.getElementById("seatString").innerHTML = i;
document.getElementById("getSeats").value = i;
document.getElementById("seatnums").innerHTML = counter;
}
i = document.getElementById("seatString").innerHTML;
counter = document.getElementById("seatnums").innerHTML;
function selectedSeat() {
var w = this.id;
var l = (" " + w);
var b = (" " + w + " ");
if (counter < 5) {
if (i.indexOf(b) <= 0) {
this.className = "closedseat";
i = i + b;
i = i.replace(" 0 ", " ");
document.getElementById("seatString").innerHTML = i;
document.getElementById("getSeats").value = i;
counter = counter + 1;
document.getElementById("seatnums").innerHTML = counter;
}
else if (i.indexOf(b) > 0) {
this.className = "openseat";
i = i.replace(b, "");
document.getElementById("seatString").innerHTML = i;
document.getElementById("getSeats").value = i;
counter = counter - 1;
document.getElementById("seatnums").innerHTML = counter;
}
}
else if (i.indexOf(b) > 0) {
this.className = "openseat";
i = i.replace(b, "");
document.getElementById("seatString").innerHTML = i;
document.getElementById("getSeats").value = i;
counter = counter - 1;
document.getElementById("seatnums").innerHTML = counter;
}
}
function doNothing() {
}
var rannum = Math.random() * 1000;
document.getElementById('getConfirmation').value = rannum;
</script>
I have a problem i want to check a variable.If its 0 then gain ++ after 1.5s.If its 10 then gain ++ after .4s.Its complicated.It doesnt really work.My code so far:
if(road == 1){setInterval(function(){stamina = stamina+1;document.getElementById("stamina").innerHTML = stamina;},1400);}
else if(road == 2){setInterval(function(){stamina = stamina+1;document.getElementById("stamina").innerHTML = stamina;},1300);}
else if(road == 3){setInterval(function(){stamina = stamina+1;document.getElementById("stamina").innerHTML = stamina;},1200);}
else if(road == 4){setInterval(function(){stamina = stamina+1;document.getElementById("stamina").innerHTML = stamina;},1100);}
else if(road == 5){setInterval(function(){stamina = stamina+1;document.getElementById("stamina").innerHTML = stamina;},1000);}
else if(road == 6){setInterval(function(){stamina = stamina+1;document.getElementById("stamina").innerHTML = stamina;},900);}
else if(road == 7){setInterval(function(){stamina = stamina+1;document.getElementById("stamina").innerHTML = stamina;},800);}
else if(road == 8){setInterval(function(){stamina = stamina+1;document.getElementById("stamina").innerHTML = stamina;},600);}
else if(road == 9){setInterval(function(){stamina = stamina+1;document.getElementById("stamina").innerHTML = stamina;},400);}
else if(road == 10){setInterval(function(){stamina = stamina+1;document.getElementById("stamina").innerHTML = stamina;},200);}
else{setInterval(function(){stamina++;document.getElementById("stamina").innerHTML = stamina;},1500);}
And the code to build a road is this:
function build_road() {
if ((wood + tavern) >= 29 && stone > 4 && road < 10) {
road++;
document.getElementById("road_count").innerHTML = road;
wood = (wood + tavern) - 20;
stone = stone - 5;
document.getElementById("wood").innerHTML = wood;
document.getElementById("stone").innerHTML = stone;
exp = exp + 20;
var x = document.getElementById("PROGRESS");
x.setAttribute("value", exp);
x.setAttribute("max", max);
if (exp == 100) {
exp = 0;
level++;
document.getElementById("level").innerHTML = level;
}
alert("Congratulations,You've create a Road,Now you gain stamina slightly faster.");
}
else {
alert("You need: 30Wood,5Stone .Maximum 10 Roads.")
}
}
Make reusable functions (it's often a good practice, when you a difficulties with a piece of code, to break it into small functions):
var staminaIncreaseTimer = null;
function configureStaminaIncrease(delay) {
if (staminaIncreaseTimer !== null)
clearInterval(staminaIncreaseTimer);
staminaIncreaseTimer = setInterval(function () {
increaseStamina();
}, delay);
}
function increaseStamina() {
stamina += 1;
document.getElementById("stamina").innerHTML = stamina;
}
Solution with an array (suggested by Jay Harris)
var roadIndex = road-1;
var ROAD_DELAYS = [1400, 1300, 1200, /*...*/];
var DEFAULT_DELAY = 1500;
if (roadIndex < ROAD_DELAYS.length) {
configureStaminaIncrease(ROAD_DELAYS[roadIndex]);
} else {
configureStaminaIncrease(DEFAULT_DELAY);
}
Solution with a switch instead of you if-elseif mess:
switch (road) {
case 1:
configureStaminaIncrease(1400);
break;
case 2:
configureStaminaIncrease(1300);
break;
case 3:
configureStaminaIncrease(1200);
break;
//and so on...
default:
configureStaminaIncrease(1500);
}