// Initialization of all the variables
let buttonsVisible = true;
let pHtmlMsg;
let serialOptions = { baudRate: 115200 };
let serial;
let data= "";
let newdataavailable = false;
let font;
let img; // cat experiment
let meow;
let n;
let trimmed;
let final_string="";
var vid1;
var vid2;
var errorVid;
let videoPlaying = false;
let wrongAnswer = false;
var level = 1;
let screen1;
let screen2;
let yayScreen;
// Initialization of all the variables
// function to preload all the images, videos and audios
function preload(){
// load our image
screen1 = loadImage("Screens/screen1.png");
screen2 = loadImage("Screens/screen2.png")
yayScreen = loadImage("Screens/BunnyYay.png")
font = loadFont('font/PaytoneOne-Regular.ttf');
meow = loadSound('Screens/audio.mp3', soundLoaded, soundError);
}
// function to preload all the images, videos and audios
function setup() {
createCanvas(windowWidth,windowHeight);
// Setup Web Serial using serial.js
serial = new Serial();
serial.on(SerialEvents.CONNECTION_OPENED, onSerialConnectionOpened);
serial.on(SerialEvents.CONNECTION_CLOSED, onSerialConnectionClosed);
serial.on(SerialEvents.DATA_RECEIVED, onSerialDataReceived);
serial.on(SerialEvents.ERROR_OCCURRED, onSerialErrorOccurred);
// Setup Web Serial using serial.js
// establishing connection
if (!serial.isOpen()) {
serial.connectAndOpen(null, serialOptions);
}
// establishing connection
//code to display the submit, clear and audio buttons
if(buttonsVisible)
{
let button = createButton('Submit');
button.style('font-size', '20px');
button.position(600, 700);
button.mouseClicked(submitButtonPress);
let button2 = createButton('Clear');
button2.style('font-size', '20px');
button2.position(700, 700);
button2.mousePressed(clearButtonPress);
let button3 = createButton('Audio');
button3.style('font-size', '20px');
button3.position(800, 700);
button3.mousePressed(audioButtonPress);
}
//code to display the submit, clear and audio buttons
// code to display animations
vid1 = createVideo("Screens/turtle_video.mov");
vid1.size(windowWidth, windowHeight);
vid1.volume(0);
vid1.hide();
vid2 = createVideo("Screens/bunny_video.mov");
vid2.size(windowWidth, windowHeight);
vid2.volume(0);
vid2.hide();
errorVid = createVideo("Screens/error.mp4");
errorVid.size(windowWidth, windowHeight);
errorVid.volume(0);
errorVid.hide();
// code to display videos
}
// validations to check if the answer entered by the user is correct
function submitButtonPress(){
final_string = final_string.trim();
if(level == 2 && final_string === "The rabbit decided to take a nap")
{
vid2.play();
videoPlaying = true;
console.log("true sentence",final_string);
}
else if(level == 1 && final_string === "l e n")
{
vid1.play();
videoPlaying = true;
console.log("true word",final_string);
}
else
{
wrongAnswer = true;
videoPlaying = true;
console.log("wrong word");
errorVid.play();
}
}
// validations to check if the answer entered by the user is correct
// function to clear all the data scanned by the user
function clearButtonPress(){
final_string = "";
}
// function to play the audio out loud
function audioButtonPress(){
data="%%";
meow.play();
}
function soundLoaded() {
console.log("Meow sound loaded!");
}
function soundError(err) {
console.error('Sound load error:', err);
}
// display the error window
function playVideo() {
if(wrongAnswer)
{
let vidFrame = errorVid.get();
image(vidFrame, 0, 0);
errorVid.onended(videoDone);
return;
}
if (level == 1)
{
let vidFrame = vid1.get();
image(vidFrame, 0, 0);
vid1.onended(videoDone);
} else{
let vidFrame = vid2.get();
image(vidFrame, 0, 0);
vid2.onended(videoDone);
}
}
// once the error video plays, nullify the string and give the user another chance
function videoDone() {
videoPlaying = false;
if (!wrongAnswer)
level+=1;
wrongAnswer = false;
final_string = "";
}
function draw() {
// setting the correct screen based on the level of the game
if (level == 1)
{
screen1.resize(windowWidth,windowHeight);
image(screen1, 0, 0);
}
else if (level == 2){
screen2.resize(windowWidth, windowHeight);
image(screen2, 0, 0);
}
else{
yayScreen.resize(windowWidth, windowHeight);
image(yayScreen, 0, 0);
return;
}
fill(255); // Set text color
noStroke(); // No outline for text
textAlign(CENTER, CENTER);
textFont(font);
textSize(38);
text(final_string, windowWidth/2, 105);
if(videoPlaying)
{
console.log("going here");
playVideo();
}
// validating the elements being scanned
if (level <=2 && !videoPlaying && newdataavailable){
background(220);
console.log("Z"+data+"Z");
let d="Z"+data+"Z";
if(d === "ZenmmZ")
{
data="m";
final_string= final_string +" "+data;
}
else if(d === "ZenllZ")
{
data="l";
final_string= final_string +" "+data;
}
else if(d === "ZenttZ")
{
data="t";
final_string= final_string +" "+data;
}
else if(d === "ZeneeZ")
{
data="e";
final_string= final_string +" "+data;
}
else if(d === "ZennnZ")
{
data="n";
final_string= final_string +" "+data;
}
else if(d === "ZenaaZ")
{
data="a";
final_string= final_string +" "+data;
}
else if(d === "ZenmmZ")
{
data="m";
final_string= final_string +" "+data;
}
else if(d === "ZenTheTheZ")
{
data="The";
final_string= final_string +" "+data;
}
else if(d === "ZenrabbitrabbitZ")
{
data="rabbit";
final_string= final_string +" "+data;
}
else if(d === "ZendecideddecidedZ")
{
data="decided";
final_string= final_string +" "+data;
}
else if(d === "Zento taketo takeZ")
{
data="to take";
final_string= final_string +" "+data;
}
else if(d === "ZennapnapZ")
{
data="nap";
final_string= final_string +" "+data;
}
else if(d === "ZSubmitZ")
{
submitButtonPress();
}
else if(d === "ZClearZ")
{
clearButtonPress();
}
else if(d === "ZAudioZ")
{
audioButtonPress();
}
newdataavailable = false;
console.log("The character I just scanned is:",final_string);
fill(0);
}
}
// validating the elements being scanned
function drawTextWithRect(x, y, cat_text, rectWidth, rectHeight) {
// Calculate rectangle position for centering
let rectX = x - rectWidth / 2;
let rectY = y - rectHeight / 2;
// Draw rectangle
fill(163, 188, 227); // Set rectangle fill color with some transparency
stroke(0); // Set outline color
rect(rectX, rectY, rectWidth, rectHeight); // Draw rectangle
// Draw text
fill(96); // Set text color
noStroke(); // No outline for text
textAlign(CENTER, CENTER);
// fill(93, 132, 194);
textSize(20);
textFont(font);
text(cat_text, x, y);
}
//Mandatory code for serial port from arduino
function onSerialConnectionClosed(eventSender) {
console.log("onSerialConnectionClosed");
// pHtmlMsg.html("onSerialConnectionClosed");
}
function onSerialDataReceived(eventSender, newData) {
console.log("onSerialDataReceived", newData);
// pHtmlMsg.html("onSerialDataReceived: " + newData);
// data=newData;
if (!(newData === "System initialized" || newData === "Found chip PN532" || newData === "Firmware ver. 1.6"))
{
if (newData != data)
{
data = newData;
newdataavailable = true;
}
}
}
function onSerialConnectionOpened(eventSender) {
console.log("onSerialConnectionOpened");
// pHtmlMsg.html("Serial connection opened successfully");
}
function onSerialErrorOccurred(eventSender, error) {
console.log("onSerialErrorOccurred", error);
// pHtmlMsg.html(error);
}
function mouseClicked() {
if (!serial.isOpen()) {
serial.connectAndOpen(null, serialOptions);
}
}