Homework Help is Here – Start Your Trial Now!
Engineering
Computer Science
why isint this working in javascript  var rows = 3; var columns = 3; var currTile; var otherTile; //blank tile var turns = 0; // var imgOrder = ["1", "2", "3", "4", "5", "6", "7", "8", "9"]; var imgOrder = ["4", "2", "8", "5", "1", "6", "7", "9", "3"]; window.onload = function() { for (let r=0; r < rows; r++) { for (let c=0; c < columns; c++) { // let tile = document.createElement("img"); tile.id = r.toString() + "-" + c.toString(); tile.src = imgOrder.shift() + ".jpg"; //DRAG FUNCTIONALITY tile.addEventListener("dragstart", dragStart); //click an image to drag tile.addEventListener("dragover", dragOver); //moving image around while clicked tile.addEventListener("dragenter", dragEnter); //dragging image onto another one tile.addEventListener("dragleave", dragLeave); //dragged image leaving anohter image tile.addEventListener("drop", dragDrop); //drag an image over another image, drop the image tile.addEventListener("dragend", dragEnd); //after drag drop, swap the two tiles document.getElementById("board").append(tile); } } } function dragStart() { currTile = this; //this refers to the img tile being dragged } function dragOver(e) { e.preventDefault(); } function dragEnter(e) { e.preventDefault(); } function dragLeave() { } function dragDrop() { otherTile = this; //this refers to the img tile being dropped on } function dragEnd() { if (!otherTile.src.includes("9.jpg")) { return; } let currCoords = currTile.id.split("-"); //ex) "0-0" -> ["0", "0"] let r = parseInt(currCoords[0]); let c = parseInt(currCoords[1]); let otherCoords = otherTile.id.split("-"); let r2 = parseInt(otherCoords[0]); let c2 = parseInt(otherCoords[1]); let moveLeft = r == r2 && c2 == c-1; let moveRight = r == r2 && c2 == c+1; let moveUp = c == c2 && r2 == r-1; let moveDown = c == c2 && r2 == r+1; let isAdjacent = moveLeft || moveRight || moveUp || moveDown; if (isAdjacent) { let currImg = currTile.src; let otherImg = otherTile.src; currTile.src = otherImg; otherTile.src = currImg; turns += 1; document.getElementById("turns").innerText = turns; } }

why isint this working in javascript  var rows = 3; var columns = 3; var currTile; var otherTile; //blank tile var turns = 0; // var imgOrder = ["1", "2", "3", "4", "5", "6", "7", "8", "9"]; var imgOrder = ["4", "2", "8", "5", "1", "6", "7", "9", "3"]; window.onload = function() { for (let r=0; r < rows; r++) { for (let c=0; c < columns; c++) { // let tile = document.createElement("img"); tile.id = r.toString() + "-" + c.toString(); tile.src = imgOrder.shift() + ".jpg"; //DRAG FUNCTIONALITY tile.addEventListener("dragstart", dragStart); //click an image to drag tile.addEventListener("dragover", dragOver); //moving image around while clicked tile.addEventListener("dragenter", dragEnter); //dragging image onto another one tile.addEventListener("dragleave", dragLeave); //dragged image leaving anohter image tile.addEventListener("drop", dragDrop); //drag an image over another image, drop the image tile.addEventListener("dragend", dragEnd); //after drag drop, swap the two tiles document.getElementById("board").append(tile); } } } function dragStart() { currTile = this; //this refers to the img tile being dragged } function dragOver(e) { e.preventDefault(); } function dragEnter(e) { e.preventDefault(); } function dragLeave() { } function dragDrop() { otherTile = this; //this refers to the img tile being dropped on } function dragEnd() { if (!otherTile.src.includes("9.jpg")) { return; } let currCoords = currTile.id.split("-"); //ex) "0-0" -> ["0", "0"] let r = parseInt(currCoords[0]); let c = parseInt(currCoords[1]); let otherCoords = otherTile.id.split("-"); let r2 = parseInt(otherCoords[0]); let c2 = parseInt(otherCoords[1]); let moveLeft = r == r2 && c2 == c-1; let moveRight = r == r2 && c2 == c+1; let moveUp = c == c2 && r2 == r-1; let moveDown = c == c2 && r2 == r+1; let isAdjacent = moveLeft || moveRight || moveUp || moveDown; if (isAdjacent) { let currImg = currTile.src; let otherImg = otherTile.src; currTile.src = otherImg; otherTile.src = currImg; turns += 1; document.getElementById("turns").innerText = turns; } }

Np Ms Office 365/Excel 2016 I Ntermed
Np Ms Office 365/Excel 2016 I Ntermed
1st Edition
ISBN:9781337508841
Author:Carey
Publisher:Carey
Chapter6: Managing Multiple Worksheets And Workbooks
Section: Chapter Questions
Problem 2.11CP
See similar textbooks
icon
Related questions
Question

why isint this working in javascript 

var rows = 3;
var columns = 3;

var currTile;
var otherTile; //blank tile

var turns = 0;

// var imgOrder = ["1", "2", "3", "4", "5", "6", "7", "8", "9"];
var imgOrder = ["4", "2", "8", "5", "1", "6", "7", "9", "3"];

window.onload = function() {
for (let r=0; r < rows; r++) {
for (let c=0; c < columns; c++) {

//<img id="0-0" src="1.jpg">
let tile = document.createElement("img");
tile.id = r.toString() + "-" + c.toString();
tile.src = imgOrder.shift() + ".jpg";

//DRAG FUNCTIONALITY
tile.addEventListener("dragstart", dragStart); //click an image to drag
tile.addEventListener("dragover", dragOver); //moving image around while clicked
tile.addEventListener("dragenter", dragEnter); //dragging image onto another one
tile.addEventListener("dragleave", dragLeave); //dragged image leaving anohter image
tile.addEventListener("drop", dragDrop); //drag an image over another image, drop the image
tile.addEventListener("dragend", dragEnd); //after drag drop, swap the two tiles

document.getElementById("board").append(tile);

}
}
}

function dragStart() {
currTile = this; //this refers to the img tile being dragged
}

function dragOver(e) {
e.preventDefault();
}

function dragEnter(e) {
e.preventDefault();
}

function dragLeave() {

}

function dragDrop() {
otherTile = this; //this refers to the img tile being dropped on
}

function dragEnd() {
if (!otherTile.src.includes("9.jpg")) {
return;
}

let currCoords = currTile.id.split("-"); //ex) "0-0" -> ["0", "0"]
let r = parseInt(currCoords[0]);
let c = parseInt(currCoords[1]);

let otherCoords = otherTile.id.split("-");
let r2 = parseInt(otherCoords[0]);
let c2 = parseInt(otherCoords[1]);

let moveLeft = r == r2 && c2 == c-1;
let moveRight = r == r2 && c2 == c+1;

let moveUp = c == c2 && r2 == r-1;
let moveDown = c == c2 && r2 == r+1;

let isAdjacent = moveLeft || moveRight || moveUp || moveDown;

if (isAdjacent) {
let currImg = currTile.src;
let otherImg = otherTile.src;

currTile.src = otherImg;
otherTile.src = currImg;

turns += 1;
document.getElementById("turns").innerText = turns;
}


}
Turns: 0
Transcribed Image Text:Turns: 0
Expert Solution
steps

Step by step

Solved in 3 steps

SEE SOLUTIONCheck out a sample Q&A here
Blurred answer
Knowledge Booster
Passing Array as Argument
Learn more about
Need a deep-dive on the concept behind this application? Look no further. Learn more about this topic, computer-science and related others by exploring similar questions and additional content below.
Recommended textbooks for you
Np Ms Office 365/Excel 2016 I Ntermed
Np Ms Office 365/Excel 2016 I Ntermed
Computer Science
ISBN:
9781337508841
Author:
Carey
Publisher:
Cengage
SEE MORE TEXTBOOKS