diff --git a/behaviors/default/menus.js b/behaviors/default/menus.js new file mode 100644 index 0000000..de03f30 --- /dev/null +++ b/behaviors/default/menus.js @@ -0,0 +1,76 @@ +// Menus +// Croquet Microverse + +// the following import statement is solely for the type checking and +// autocompletion features in IDE. A Behavior cannot inherit from +// another behavior or a base class but can use the methods and +// properties of the card to which it is installed. +// The prototype classes ActorBehavior and PawnBehavior provide +// the features defined at the card object. + +import {ActorBehavior, PawnBehavior} from "../PrototypeBehavior"; + +class MenuActor extends ActorBehavior { + setup() { + } +} + +class MenuPawn extends PawnBehavior { + setup(){ + if(this.menuItems)this.teardown(); + this.menuItems = []; + this.installMenu("+100 bots", "./assets/images/masks-theater.png", ()=>this.publish("menu", "addBots")); + this.installMenu("Remove bots", "./assets/images/masks-theater-off.png", ()=>this.publish("menu", "killBots")); + this.installMenu("Toggle Fireball", "./assets/images/fireball.png", ()=>this.publish("menu","FireballToggle")); + this.installMenu("Toggle Sound", "./assets/images/speaker-icon.png", ()=>this.publish("menu", "startStopWind")); + this.installMenu("Code on Github", "./assets/images/github.png", ()=>this.linkTo("https://github.com/croquet/mythos")); + + } + + linkTo(url) { + let div = document.createElement("div"); + url = url || "https://croquet.io"; // default to Croquet + div.innerHTML = ``; + let a = div.querySelector("#link"); + a.click(); + div.remove(); + } + + installMenu(menuText, menuImage, callback){ + let menu = document.body.querySelector("#worldMenu"); + if (menu) { + let menuItemDiv = document.createElement("div"); + menuItemDiv.innerHTML = + `
`; + let menuItem = menuItemDiv.firstChild; + if (menuImage) { + let menuIcon = menuItem.querySelector(".menu-icon"); + menuIcon.style.setProperty("background-image", `url(${menuImage})`); + menuIcon.style.setProperty("background-size", "contain"); + } + menuItem.addEventListener("click", callback); + menu.appendChild(menuItem); + + this.menuItems.push(menuItem); // needs to be an array + } + } + + teardown() { + this.menuItems.forEach( m=>m.remove()); + this.menuItems = []; + } +} + + +export default { + modules: [ + { + name: "Menus", + actorBehaviors: [MenuActor], + pawnBehaviors: [MenuPawn], + } + ] +} diff --git a/worlds/default.js b/worlds/default.js index 2f12f61..3a2585c 100644 --- a/worlds/default.js +++ b/worlds/default.js @@ -21,7 +21,7 @@ export function init(Constants) { Constants.UserBehaviorDirectory = "behaviors/default"; Constants.UserBehaviorModules = [ - "lights.js", "terrain.js", "ambientSound.js", "blowing.js", "urlLink.js", "replaceWorld.js", "walker.js" + "lights.js", "terrain.js", "ambientSound.js", "menus.js", "blowing.js", "urlLink.js", "replaceWorld.js", "walker.js" ];