Mr. Good Bot is mostly assembled and we’re not looking at any code today (okay maybe just a little) but we’re really just going to talk about how Mr. Good Bot works and all the recent commits I made to Mr Good Bot over on GitHub.

Also, here’s the featured image from today’s post as a wallpaper. It depicts Mr. Good Bot being mostly assembled… I liked the look of hanging wires instead of legs, hence the name. 😛

Mr Good Bot Mostly Assembled Wallpaper
Mr Good Bot Mostly Assembled Wallpaper

If you need a refresher on this series, here are the other Mr. Good Bot posts:

 

So with Mr Good Bot being mostly assembled I thought we would take this opportunity to go over the recent additions.

How Mr. Good Bot Works

Mr. Good Bot is a web browser based animated face and speech prototype system that I use like a digital puppet to play with and educate my son Xavier.

The software is hosted on a web server within my home intranet.

Xavier can launch Mr. Good Bot from a shortcut on his tablet that opens the intranet address where Mr. Good Bot is running.

The software loads MrGoodBot.php which finds the face image and voice audio elements in the DOM (Document Object Model) and loads them to his device.

It then contacts the server and begins the animation and also lets the database know that the bot isn’t speaking.

Additionally, an “On Ended” listener is added to the voice element so the database can know when the bot stops speaking.

This process is repeated recursively with the animation timer calling Face.php during it’s loop which generates/assembles the face image.

We discussed the face generation process in Random Assembly Required so I wont go over that again here but once the face animation image is complete the software runs Speech.php to see if there is anything to say, if so it generates the audio and we covered those details in DaisyBell.wav.

Once the updated image and audio (if there is any) are generated, Face.php checks the state of the bot with the server and if necessary updates the state and that’s new!

Then, it encodes the bot state as JSON (even if there is nothing to say) and echoes that as a return message to MrGoodBot.php for the JavaScript to parse, also new!

This code echos the bot state:

<?php

// Excerpt from the end of Face.php

// Handle bot state for speech
$conn = ConnectToMySQL();
$GoodBotState = GetBotState($conn, 'Mr. Good Bot');
$GoodBotState['HasSpeech'] = 0;
if($GoodBotState['Speaking'] == 0){
    
    include 'Speech.php';
    // Something_To_Say instantiated in Speech.php
    $GoodBotState['HasSpeech'] = $Something_To_Say;

    // Let the server know the bot will be speaking
    if($Something_To_Say == 1){
        $UpdatedBotState = $GoodBotState;
        $UpdatedBotState['Speaking'] = 1;
        SetBotState($conn, $UpdatedBotState); // update state
    }
}
DisconnectFromMySQL($conn); 

$GoodBotState = json_encode($GoodBotState); // Encode bot state as JSON
echo $GoodBotState;// echo JSON for AJAX request
?>

 

Here’s the JavaScript code in MrGoodBot.php that parses the bot state JSON returned from Face.php and determines if the bot has something to say and if isn’t speaking, in which case it will call the asynchronous Speak() function and play the generated text to speech audio.

This code parses the JSON bot state returned by the server:

// Excerpt from the JavaScript in MrGoodBot.php

//////////////
// Speak
 
var BotState = JSON.parse(this.responseText);
 
// If there is something to say and Mr. Good Bot isn't saying anything
if(BotState.HasSpeech == '1'
    && BotState.Speaking == '0'
    && Voice.className == ""){
    // Update Audio
    // Concatenate random numbers to prevent casheing from interfering with updates
    Voice.src = 'MrGoodBot.wav?' + Math.random();
    
    // Voice Speak
    Voice.oncanplay = function(){                         
        Speak(); 
    };                        
}
 
// / Speak
//////////////

 

Once Mr. Good Bot has finished speaking the “On Ended” Voice listener contacts NotSpeaking.php  and updates the serve that the bot is no longer speaking (so it can generate new speech if necessary) and that it completed it’s previous statement so that statement should be set to complete allowing the next thing (if there is something) to be said.

GitHub

All of the code for Mr. Good Bot is available for download on GitHub for free.

GitHub: MrGoodBot

I hope you have been enjoying building Mr. Good Bot!

As you can see he is “mostly assembled” now and all that remains is to build the admin interface that allows new statements to be added to the database and we’ll look at that in an upcoming post so I will see you then and thanks for reading!


If you enjoy building bots or just like my content then please like, share, comment and subscribe!

And if you happen to want to contribute financially to my efforts, I have a Patreon where you can pledge $1 or more a month for one or more months, cancel any time.

Much Love,

~Joy