If you're more experienced, you can check out my other guides.
If you're very new to this, MPP stands for Multiplayer Piano.
The world of MPP bots is a very old one. There are bots that are still being updated that range back to 2013.
On MPP, bots are used to send miscallaneous info back and forth to the server automatically through the WebSocket server.
Don't worry about the server itself, everything should be easy to follow along with in the browser.
Currently, this guide doesn't have any screenshots.
- Tampermonkey
- Knowledge of some basic JavaScript
To create a tampermonkey script, make sure you're on MPP and click the tampermonkey icon in the top right of your browser (it might be hidden inside the hamburger menu) and click "Create a new script...".
Once you create a script, a big block of commented-out text is at the top of the page, and this is called the UserScript header.
You may edit the gray header values to match your bot. All you should have to change are the @name and @author tags in the UserScript header.
This next step is important: make sure you change the @match tag to include every possible URL on MPP.
For instance, if I'm on MPPClone, I would change @match to this:
// @match https://mppclone.com/*You can also add more than one @match tag:
// @match https://mppclone.com/*
// @match https://www.multiplayerpiano.org/*
// @match https://mpp.hri7566.info/*When MPP loads, a global variable called MPP is loaded for our convenience.
The MPP object has various useful functions for us, so we'll utilize this to create our bot.
The variable MPP.client holds our client's WebSocket connection and info about our user. The client already connects when we load the page, so we don't have to create a connection manually.
In order for the client to react and respond to the messages it's sent from the server, it uses events.
Events are an easy way to call a group of functions from one emission. Events are a bit complicated for beginner JavaScript programmers but they're easier to understand later on.
All we have to know for now is that the client uses the event 'a' for chat messages and 'participant added' for when a user joins.
In order to listen for events from the server, we can use the function MPP.client.on to add a function to that group.
The on function takes in a string for the first argument and a callback for the second.
If you don't know what a callback is, it's like writing a function, but it takes up less space and uses this arrow operator (=>).
We can utilize this knowledge now in our code. For these code blocks, I won't be including the tampermonkey header.
MPP.client.on("a", (msg) => {
});
MPP.client.on("participant added", (p) => {
});If you notice, I put msg and p in the callback functions. These are the objects that are sent to the functions when the event is emitted. These come from other parts of the code, and the data that comes through them can be quite arbitrary and hard to understand.
Everything should be fine, though, most of them are easy to explain.
From the a event, we get msg
If you were to log msg to your console with console.log(msg), you can see that the message the user sent is stored in msg.a. The user that sent the message is also in here, under msg.p. The data in msg.p is what we call a participant.
A participant is just how our user data is defined and it's quite easy to deal with. The username is msg.p.name, their user ID is msg.p.id (previously msg.p._id before MPPClone existed, which is why they're the same), and the user's hex color is in msg.p.color.
On "participant added", only a participant is emitted and there's no other message data.
Now, we're going to add our first commands. Since the message is stored in msg.a, we'll use if statements to check what they said. In order to send a message back, we'll use the function MPP.chat.send, which takes in a string.
For now, we'll manually handle commands and worry about Object-oriented programming in another lesson.
MPP.client.on("a", (msg) => {
if (msg.a == ".help") {
MPP.chat.send("Commands: .help, .about");
} else if (msg.a == ".about") {
MPP.chat.send("This is a tutorial bot.");
}
});
MPP.client.on("participant added", (p) => {
});Now, you can test by going back to MPP, reloading your page, and typing ".help" into chat.
Sample output:
๖ۣۜH͜r̬i͡7566: .help
๖ۣۜH͜r̬i͡7566: Commands: .help, .about
Sample output:
๖ۣۜH͜r̬i͡7566: .about
๖ۣۜH͜r̬i͡7566: This is a tutorial bot.
As you can see, the bot works fine here. You can add as many commands as you want, but keep in mind that the message character limit is 512 characters.
As described earlier, participant added emits a participant object. We can use this to interact with user data.
I will also add a toggle command to turn it on and off. I will also make sure to add it to my help list.
let welcomeMessageToggle = false;
MPP.client.on("a", (msg) => {
if (msg.a == ".help") {
MPP.chat.send("Commands: .help, .about, .welcome");
} else if (msg.a == ".about") {
MPP.chat.send("This is a tutorial bot.");
} else if (msg.a == ".welcome") {
if (welcomeMessageToggle == true) {
welcomeMessageToggle = false;
MPP.chat.send("Welcome messages have been turned off.");
} else {
welcomeMessageToggle = true;
MPP.chat.send("Welcome messages have been turned on.");
}
}
});
MPP.client.on("participant added", (p) => {
if (!welcomeMessageToggle) return;
MPP.chat.send("Welcome, " + p.name + ". Use .help to view my commands.");
});If you notice, I set the toggle to false by default. This is because it would flood chat on join otherwise.
As programmed, you can toggle it on and off with the .welcome command.
Sample output:
๖ۣۜH͜r̬i͡7566: .welcome
๖ۣۜH͜r̬i͡7566: Welcome messages have been turned on.
Sample output:
๖ۣۜH͜r̬i͡7566: .welcome
๖ۣۜH͜r̬i͡7566: Welcome messages have been turned off.
And the welcome messages should look like this:
๖ۣۜH͜r̬i͡7566: Welcome, Hyperflame. Use .help to view my commands.
With these skills, you should be able to start making a bot with simple comamnds. Once you get the gist of things, your programming will get quicker and more efficient.
To challenge you, I ask that you try to make "goodbye" messages as well. Here's a small tip to go along with that: you should use participant removed.
i already know too much javascript