42 lines
928 B
HTML
42 lines
928 B
HTML
|
<!DOCTYPE html>
|
||
|
|
<html lang="en">
|
||
|
|
<head>
|
||
|
|
<meta charset="UTF-8">
|
||
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
|
|
<title>Document</title>
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
<div id="app"></div>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
// modell
|
||
|
|
let board = "73541 286";
|
||
|
|
|
||
|
|
// view
|
||
|
|
updateView();
|
||
|
|
function updateView(){
|
||
|
|
createSquareHtml(1)
|
||
|
|
+ createSquareHtml(2)
|
||
|
|
}
|
||
|
|
|
||
|
|
function createSquareHtml(index1, index2){
|
||
|
|
return /*HTML*/ `
|
||
|
|
<div onclick="swap(${index})">${board.charAt(index)}</div>
|
||
|
|
`;
|
||
|
|
}
|
||
|
|
// controller
|
||
|
|
function swap(){
|
||
|
|
let blankIndex = board.indexOf(' ');
|
||
|
|
let selectedNumber = board.charAt(index);
|
||
|
|
board = board.replace(' ', selectedNumber);
|
||
|
|
|
||
|
|
updateView();
|
||
|
|
};
|
||
|
|
function areNeighbours(){
|
||
|
|
|
||
|
|
};
|
||
|
|
|
||
|
|
</script>
|
||
|
|
|
||
|
|
</body>
|
||
|
|
</html>
|