66 lines
1.6 KiB
JavaScript
66 lines
1.6 KiB
JavaScript
const canvas = document.getElementById('canvas');
|
|
const context = canvas.getContext('2d');
|
|
const choices = [
|
|
"It is certain", "It is decidedly so", "Without a doubt", "Yes definitely",
|
|
"You may rely on it", "As I see it, yes", "Most likely", "Outlook good", "Yes",
|
|
"Signs point to yes", "Better not tell you now", "Cannot predict now",
|
|
"Concentrate and ask again", "My sources say no", "Outlook not so good", "Very doubtful"
|
|
];
|
|
|
|
function start(choice = '') {
|
|
drawBall();
|
|
drawText('shake me uwu', colour='grey');
|
|
canvas.addEventListener('click', (event) => {
|
|
console.log('click');
|
|
canvas.onmousedown = function() {
|
|
drawBall();
|
|
}
|
|
eightball(getRandomAnswer());
|
|
});
|
|
}
|
|
|
|
function eightball(choice = '') {
|
|
drawBall();
|
|
if(choice !== '') {
|
|
drawText(choice)
|
|
}
|
|
}
|
|
|
|
function drawBall() {
|
|
console.log('Drawing ball');
|
|
drawCircle();
|
|
drawTriangle();
|
|
}
|
|
|
|
function drawText(choice, colour = 'white') {
|
|
console.log('Answer is: ' + choice);
|
|
context.fillStyle = colour;
|
|
context.font = '20px sans-serif';
|
|
context.textAlign = 'center';
|
|
context.fillText(choice, 150, 150);
|
|
}
|
|
|
|
function drawCircle() {
|
|
context.fillStyle = 'black';
|
|
context.beginPath();
|
|
context.arc(150, 150, 150, 0, 2 * Math.PI);
|
|
context.fill();
|
|
context.closePath();
|
|
}
|
|
|
|
function drawTriangle() {
|
|
context.fillStyle = 'blue';
|
|
context.beginPath();
|
|
context.moveTo(150, 50);
|
|
context.lineTo(250, 200);
|
|
context.lineTo(150, 50);
|
|
context.fill();
|
|
context.closePath();
|
|
}
|
|
|
|
function getRandomAnswer() {
|
|
let randomIndex = Math.floor(Math.random() * choices.length);
|
|
return choices[randomIndex];
|
|
}
|
|
|
|
start(); |