An SubModule for the Definable ModMenu for Drawaria.Online.
// ==UserScript==
// @name BotPlayer
// @namespace Definable
// @version 0.1.1
// @description An SubModule for the Definable ModMenu for Drawaria.Online.
// @homepage https://drawaria.online/profile/?uid=63196790-c7da-11ec-8266-c399f90709b7
// @author ≺ᴄᴜʙᴇ³≻
// @match https://drawaria.online/
// @match https://drawaria.online/test
// @match https://drawaria.online/room/*
// @icon data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAYAAACqaXHeAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAGRSURBVHhe7dkxbsJAEAXQP3ZJwyWQLOUENKGg5xYRR+AMHAHlFvQUpOEEkSxxCRpKPGmwlIyUxesMMWj+65g12vXXsGsAICIioqjEFqzJZKLfXx+Pxx/vsePW0NfbcauwhWgYgC0QEUWSPCPR41wdWu56w58CyXSQmehsU1eNXNYA5iIY2fG/UMUZwK7QcrVfVrUdb+WsF54dcL35gwgW3jcPACIYiWDRyOUw29SVHe/LLYBGLmsRjG3dmwjG1y5z4RYAgLkt3JHbXG4B3KPtf+M5l1sAzyq5Q+Z4ff9Mfm/39vH24rL28B3AAGwhmpufo65PVo+yB3Rdbyt8BzAAW4iGAdhCNAzAFqJJnpE5HuU5IFf4DmAAthDNzc9R12frR9kDuq63Fb4D3AK4/m7/LzzncgsAwM4W7shtLrcACi1XqjjZujdVnAotV7bel1sA+2VVF1pOVbH1bNGWKs6q2BZaTlN/jeVK7pDosasOLXe9bh1ARPSMkjskOuyqdtwa+no7boU/BRiALRARERFF8QWXXJ5ITbASawAAAABJRU5ErkJggg==
// @grant none
// @license GNU GPLv3
// ==/UserScript==
//#region TypeDefinitions
/**
* @typedef {Object} PlayerInstance
* @property {string} name - The name of the player.
* @property {string} uid - The unique identifier for the player.
* @property {string} wt - The weight of the player.
* @property {string} roomID - The room ID the player is in.
* @property {WebSocket} socket - The WebSocket connection for the player.
* @property {Map<string, Function[]>} events - The events map for the player.
* @property {boolean} isConnected - Whether the player is connected.
* @property {(invitelink:string)=>void} connect - Connects the player to a room.
* @property {()=>void} disconnect - Disconnects the player.
* @property {()=>void} reconnect - Reconnects the player.
* @property {(invitelink:string)=>void} enterRoom - Enters a room.
* @property {()=>void} nextRoom - Moves the player to the next room.
* @property {()=>void} leaveRoom - Leaves the current room.
* @property {(payload:string)=>void} send - Sends a message through the WebSocket.
* @property {(event:string,handler:Function)=>void} addEventListener - Adds an event listener.
* @property {(event:string)=>boolean} hasEventListener - Checks if an event listener exists.
* @property {()=>void} __invokeEvent - Invokes an event.
*/
/**
* @typedef {Object} DrawariaOnlineMessageTypes
* @property {(message: string) => string} chatmsg - Sends a chat message.
* @property {() => string} passturn - Passes the turn.
* @property {(playerid: number|string) => string} pgdrawvote - Votes for a player to draw.
* @property {() => string} pgswtichroom - Switches the room.
* @property {() => string} playerafk - Marks the player as AFK.
* @property {() => string} playerrated - Rates the player.
* @property {(gestureid: number|string) => string} sendgesture - Sends a gesture.
* @property {() => string} sendvote - Sends a vote.
* @property {(playerid: number|string) => string} sendvotekick - Votes to kick a player.
* @property {(wordid: number|string) => string} wordselected - Selects a word.
* @property {Object} clientcmd - Client commands.
* @property {(itemid: number|string, isactive: boolean) => string} clientcmd.activateitem - Activates an item.
* @property {(itemid: number|string) => string} clientcmd.buyitem - Buys an item.
* @property {(itemid: number|string, target: "zindex"|"shared", value: any) => string} clientcmd.canvasobj_changeattr - Changes an attribute of a canvas object.
* @property {() => string} clientcmd.canvasobj_getobjects - Gets canvas objects.
* @property {(itemid: number|string) => string} clientcmd.canvasobj_remove - Removes a canvas object.
* @property {(itemid: number|string, positionX: number|string, positionY: number|string, speed: number|string) => string} clientcmd.canvasobj_setposition - Sets the position of a canvas object.
* @property {(itemid: number|string, rotation: number|string) => string} clientcmd.canvasobj_setrotation - Sets the rotation of a canvas object.
* @property {(value: any) => string} clientcmd.customvoting_setvote - Sets a custom vote.
* @property {(value: any) => string} clientcmd.getfpid - Gets the FPID.
* @property {() => string} clientcmd.getinventory - Gets the inventory.
* @property {() => string} clientcmd.getspawnsstate - Gets the spawn state.
* @property {(positionX: number|string, positionY: number|string) => string} clientcmd.moveavatar - Moves the avatar.
* @property {() => string} clientcmd.setavatarprop - Sets the avatar properties.
* @property {(flagid: number|string, isactive: boolean) => string} clientcmd.setstatusflag - Sets a status flag.
* @property {(playerid: number|string, tokenid: number|string) => string} clientcmd.settoken - Sets a token.
* @property {(playerid: number|string, value: any) => string} clientcmd.snapchatmessage - Sends a Snapchat message.
* @property {() => string} clientcmd.spawnavatar - Spawns an avatar.
* @property {() => string} clientcmd.startrollbackvoting - Starts rollback voting.
* @property {() => string} clientcmd.trackforwardvoting - Tracks forward voting.
* @property {(trackid: number|string) => string} clientcmd.votetrack - Votes for a track.
* @property {(roomID: string, name?: string, uid?: string, wt?: string) => string} startplay - Starts the play.
* @property {Object} clientnotify - Client notifications.
* @property {(playerid: number|string) => string} clientnotify.requestcanvas - Requests a canvas.
* @property {(playerid: number|string, base64: string) => string} clientnotify.respondcanvas - Responds with a canvas.
* @property {(playerid: number|string, imageid: number|string) => string} clientnotify.galleryupload - Uploads to the gallery.
* @property {(playerid: number|string, type: any) => string} clientnotify.warning - Sends a warning.
* @property {(playerid: number|string, targetname: string, mute?: boolean) => string} clientnotify.mute - Mutes a player.
* @property {(playerid: number|string, targetname: string, hide?: boolean) => string} clientnotify.hide - Hides a player.
* @property {(playerid: number|string, reason: string, targetname: string) => string} clientnotify.report - Reports a player.
* @property {Object} drawcmd - Drawing commands.
* @property {(x1: number|string, y1: number|string, x2: number|string, y2: number|string, color: number|string, size?: number|string, ispixel?: boolean, playerid?: number|string) => string} drawcmd.line - Draws a line.
* @property {(x1: number|string, y1: number|string, x2: number|string, y2: number|string, color: number|string, size: number|string, ispixel?: boolean, playerid?: number|string) => string} drawcmd.erase - Erases a part of the drawing.
* @property {(x: number|string, y: number|string, color: number|string, tolerance: number|string, r: number|string, g: number|string, b: number|string, a: number|string) => string} drawcmd.flood - Flood fills an area.
* @property {(playerid: number|string) => string} drawcmd.undo - Undoes the last action.
* @property {() => string} drawcmd.clear - Clears the drawing.
*/
/**
* @typedef {Object} PlayerClass
* @property {PlayerInstance[]} instances
* @property {PlayerInstance} noConflict
* @property {(inviteLink:string)=>URL} getSocketServerURL
* @property {(inviteLink:string)=>string} getRoomID
* @property {DrawariaOnlineMessageTypes} parseMessage
*/
/**
* @typedef {Object} UI
* @property {(selectors: string, parentElement?: ParentNode) => Element|null} querySelect - Returns the first element that is a descendant of node that matches selectors.
* @property {(selectors: string, parentElement?: ParentNode) => NodeListOf<Element>} querySelectAll - Returns all element descendants of node that match selectors.
* @property {(tagName: string, properties?: object) => Element} createElement - Creates an element and assigns properties to it.
* @property {(element: Element, attributes: object) => void} setAttributes - Assigns attributes to an element.
* @property {(element: Element, styles: object) => void} setStyles - Assigns styles to an element.
* @property {(name?: string) => HTMLDivElement} createContainer - Creates a container element.
* @property {() => HTMLDivElement} createRow - Creates a row element.
* @property {(name: string) => HTMLElement} createIcon - Creates an icon element.
* @property {(type: string, properties?: object) => HTMLInputElement} createInput - Creates an input element.
* @property {(input: HTMLInputElement, properties?: object) => HTMLLabelElement} createLabelFor - Creates a label for an input element.
* @property {(className?: string) => HTMLElement & { show: Function, hide: Function }} createSpinner - Creates a spinner element.
* @property {(input: HTMLInputElement, addon: HTMLLabelElement|HTMLInputElement|HTMLButtonElement|HTMLElement) => HTMLDivElement} createGroup - Creates an input group element.
* @property {(inputs: Array<HTMLLabelElement|HTMLInputElement|HTMLButtonElement|HTMLElement>) => HTMLDivElement} createInputGroup - Creates an input group element.
*/
/**
* @typedef {Object} Other
* @property {(message: string, styles?: string, application?: string) => void} log - Logs a message with styles.
* @property {(size?: number) => string} uid - Generates a random UID.
* @property {(byteArray: number[]) => string} toHexString - Converts a byte array to a hex string.
* @property {(key: string, value: string) => void} setCookie - Sets a cookie.
* @property {() => Array<*>&{addEventListener:(event:"delete"|"set",handler:(property:string,value:*)=>void)=>}} makeObservableArray - Creates an observable array.
* @property {(message: string) => (Array<any> | object)} tryParseJSON - Tries to parse a JSON string.
*/
/**
* @class
* @typedef {Object} DefinableCore
* @property {PlayerClass} Player
* @property {UI} UI
* @property {Other} helper
*/
/**
* @typedef {Object} Definable
* @property {PlayerClass} Player
* @property {UI} UI
* @property {()=>HTMLElement} createRow
* @property {(submodule:Core)=>void} registerModule
*/
/**
* @typedef {Object} Position
* @prop {number} x
* @prop {number} y
*/
/**
* @typedef {Object} Color
* @prop {number} r
* @prop {number} g
* @prop {number} b
* @prop {number} a
*/
/**
* @typedef {Object} Volume
* @prop {number} width
* @prop {number} height
*/
/**
* @typedef {Position & Color} Pixel
*/
/**
* @typedef {Pixel & Volume} Area
*/
/**
* @typedef {Object} PromiseResponse
* @prop {*} data
* @prop {Error|string|undefined} error
*/
//#endregion TypeDefinitions
(function () {
"use strict";
/**
* @param {Definable} definable
* @param {DefinableCore} $core
*/
function initialize(definable, $core) {
/** @type {Definable} */
const botplayer = new $core("Bot Player", "robot");
const ui = $core.UI;
definable.registerModule(botplayer);
/* Row 1 */ {
const row = botplayer.createRow();
{
const input = ui.createInput("button");
const label = ui.createLabelFor(input, { title: "Enter Room" });
label.appendChild(ui.createIcon("check"));
label.classList.add("col");
label.className = label.className.replace("secondary", "success");
row.appendChild(label);
input.addEventListener("click", function () {
$core.Player.noConflict.enterRoom(ui.querySelect("#invurl").value);
});
}
{
const input = ui.createInput("button");
const label = ui.createLabelFor(input, { title: "Switch Room" });
label.appendChild(ui.createIcon("exchange-alt"));
label.classList.add("col");
row.appendChild(label);
input.addEventListener("click", function () {
$core.Player.noConflict.nextRoom();
});
}
{
const input = ui.createInput("button");
const label = ui.createLabelFor(input, { title: "Leave Room" });
label.appendChild(ui.createIcon("times"));
label.classList.add("col");
label.className = label.className.replace("secondary", "danger");
row.appendChild(label);
input.addEventListener("click", function () {
$core.Player.noConflict.leaveRoom();
});
}
}
/* Row 2 */ {
const row = botplayer.createRow();
{
const input = ui.createInput("file", { accept: "image/*" });
const label = ui.createLabelFor(input, { title: "Upload Avatar" });
label.appendChild(ui.createIcon("upload"));
input.addEventListener("input", function () {
loadFileAsImage(input.files[0]).then((response) => {
if (response.data) {
/** @type {HTMLImageElement} */
const image = response.data;
$core.helper.setCookie("uid", "_");
fetch("https://drawaria.online/uploadavatarimage", {
method: "POST",
body: "imagedata=" + encodeURIComponent(image.src.replace("image/gif", "image/png")) + "&fromeditor=true",
headers: { "Content-Type": "application/x-www-form-urlencoded; charset=UTF-8" },
})
.then((res) => {
if (res.status === 200) {
res.text().then((body) => {
const data = body.split(".");
const player = $core.Player.noConflict;
player.uid = data[0];
player.wt = data[1];
if (player.isConnected) {
player.reconnect();
}
ui.querySelect("i,img", label).remove();
label.appendChild(
ui.createElement("img", {
src: `https://drawaria.online/avatar/cache/${body}.jpg`,
style: "width: 100%;",
})
);
});
} else {
ui.querySelect("#chatbox_messages").appendChild(ui.createElement("div", { textContent: res.statusText, className: "chatmessage systemchatmessage" }));
}
})
.catch((reason) => {
ui.querySelect("#chatbox_messages").appendChild(ui.createElement("div", { textContent: reason, className: "chatmessage systemchatmessage" }));
});
input.value = null;
}
});
});
row.appendChild(label);
}
{
const botNameInput = ui.createInput("text");
const botNameUpdateInput = ui.createInput("button");
const botNameUpdateLabel = ui.createLabelFor(botNameUpdateInput, { title: "Update Name" });
botNameUpdateLabel.appendChild(ui.createIcon("i-cursor"));
botNameUpdateInput.addEventListener("click", function () {
const player = $core.Player.noConflict;
player.name = botNameInput.value;
if (player.isConnected) {
player.reconnect();
}
});
const group = ui.createInputGroup(botNameInput, botNameUpdateLabel);
group.style.flexGrow = "1";
group.style.width = "min-content";
row.appendChild(group);
}
}
window.dispatchEvent(new CustomEvent("definable:playerbot:init", { detail: { main: botplayer, core: $core } }));
}
/**
* @param {File} file
* @returns {Promise<PromiseResponse>}
*/
function loadFileAsImage(file) {
return new Promise((resolve, reject) => {
if (!(FileReader && file)) {
reject({ data: undefined, error: "Native FileReader not present." });
} else {
const reader = new FileReader();
reader.onload = function () {
const image = new Image();
image.src = reader.result;
image.onload = function () {
resolve({ data: image, error: undefined });
};
};
reader.readAsDataURL(file);
}
});
}
window.addEventListener("definable:init", function (event) {
const { main, core } = event.detail;
if (!main || !core) return console.error("main: %o & core: %o", main, core);
initialize(main, core);
});
})();
(function () {
"use strict";
/**
* @param {Definable} playerbot
* @param {DefinableCore} $core
*/
function initialize(playerbot, $core) {
/** @type {Definable} */
const sozials = new $core("Sozials", "comments");
const ui = $core.UI;
playerbot.registerModule(sozials);
/* Row 1 */ {
const row = sozials.createRow();
const input = ui.createInput("button");
const label = ui.createLabelFor(input, { title: "Send Message" });
const messageInput = ui.createInput("text");
label.appendChild(ui.createIcon("paper-plane"));
input.addEventListener("click", function () {
$core.Player.noConflict.send($core.Player.parseMessage.chatmsg(messageInput.value));
});
const group = ui.createInputGroup(messageInput, label);
row.appendChild(group);
}
/* Row 2 */ {
const row = sozials.createRow();
["thumbs-up", "heart", "paint-brush", "cocktail", "hand-peace", "feather-alt", "trophy", "mug-hot", "gift"].forEach((token, index) => {
const input = ui.createInput("button");
const label = ui.createLabelFor(input);
label.appendChild(ui.createIcon(token));
input.addEventListener("click", function () {
ui.querySelectAll("#playerlist>.playerlist-row").forEach((player) => {
$core.Player.noConflict.send($core.Player.parseMessage.clientcmd.settoken(Number(player.dataset.playerid), index));
});
});
row.appendChild(label);
});
}
/* Row 3 */ {
const row = sozials.createRow();
ui.querySelectAll("#gesturespickerselector .gesturespicker-container .gesturespicker-item img").forEach((node, index) => {
const input = ui.createInput("button");
const label = ui.createLabelFor(input);
label.appendChild(ui.createElement("img", { src: node.src, style: "width: 100%;" }));
input.addEventListener("click", function () {
$core.Player.noConflict.send($core.Player.parseMessage.sendgesture(index));
});
row.appendChild(label);
});
}
ui.querySelect("#definableStyles").textContent += "\n#definable .row>label:has(img) { width: 2rem; padding: 0; }";
}
window.addEventListener("definable:playerbot:init", function (event) {
const { main, core } = event.detail;
if (!main || !core) return console.error("main: %o & core: %o", main, core);
initialize(main, core);
});
})();