From 7a996340c1f9d160c8066402697029e001154b53 Mon Sep 17 00:00:00 2001 From: Andrea Fazzi Date: Mon, 19 Aug 2024 15:03:30 +0200 Subject: [PATCH] Add "Treasure Chest - Custom Events" project --- structure-and-scale/main.go | 1 + .../treasure-chest-custom-events/README.md | 10 ++ .../treasure-chest-custom-events/index.html | 14 +++ .../treasure-chest-custom-events/script.js | 117 ++++++++++++++++++ 4 files changed, 142 insertions(+) create mode 100644 structure-and-scale/treasure-chest-custom-events/README.md create mode 100644 structure-and-scale/treasure-chest-custom-events/index.html create mode 100644 structure-and-scale/treasure-chest-custom-events/script.js diff --git a/structure-and-scale/main.go b/structure-and-scale/main.go index 2b85aa1..3c78e08 100644 --- a/structure-and-scale/main.go +++ b/structure-and-scale/main.go @@ -15,6 +15,7 @@ func main() { mux.Handle("GET /treasure-chest-user-options/", http.StripPrefix("/treasure-chest-user-options", http.FileServer(http.Dir("treasure-chest-user-options")))) mux.Handle("GET /treasure-chest-js-class/", http.StripPrefix("/treasure-chest-js-class", http.FileServer(http.Dir("treasure-chest-js-class")))) mux.Handle("GET /treasure-chest-private/", http.StripPrefix("/treasure-chest-private", http.FileServer(http.Dir("treasure-chest-private")))) + mux.Handle("GET /treasure-chest-custom-events/", http.StripPrefix("/treasure-chest-custom-events", http.FileServer(http.Dir("treasure-chest-custom-events")))) log.Println("Start the web server...") err := http.ListenAndServe(":8080", mux) diff --git a/structure-and-scale/treasure-chest-custom-events/README.md b/structure-and-scale/treasure-chest-custom-events/README.md new file mode 100644 index 0000000..0b52977 --- /dev/null +++ b/structure-and-scale/treasure-chest-custom-events/README.md @@ -0,0 +1,10 @@ +# Treasure Chest Library - Chaining and Static Methods + +A library that pirates can use to track the amount of loot they find +on their travels. + +The library willsupport chained methods and add static methods. + +# References + +* https://leanwebclub.com/learn/structure-and-scale/project-treasure-chest-library-chaining-and-static-methods/ diff --git a/structure-and-scale/treasure-chest-custom-events/index.html b/structure-and-scale/treasure-chest-custom-events/index.html new file mode 100644 index 0000000..22f8faf --- /dev/null +++ b/structure-and-scale/treasure-chest-custom-events/index.html @@ -0,0 +1,14 @@ + + + + + + + Treasure Chest - Private Class Custom Events + + +

Treasure Chest - Custom Events

+

All of the magic here happens in the console.

+ + + diff --git a/structure-and-scale/treasure-chest-custom-events/script.js b/structure-and-scale/treasure-chest-custom-events/script.js new file mode 100644 index 0000000..8d9f5c9 --- /dev/null +++ b/structure-and-scale/treasure-chest-custom-events/script.js @@ -0,0 +1,117 @@ +/** + * Emit a custom event + * @param {String} type The event type + * @param {*} detail Any details to pass along with the event + */ +function emit (type, detail) { + + // Create a new event + let event = new CustomEvent(type, { + bubbles: true, + cancelable: true, + detail: detail + }); + + // Dispatch the event + return document.dispatchEvent(event); + +} + +class TreasureChest { + + #gold; + #silver; + #bronze; + + constructor (initialLoot = {}) { + + // Merge options into defaults + let {bronze, silver, gold} = Object.assign({ + bronze: 0, + silver: 0, + gold: 0, + }, initialLoot); + + this.#bronze = bronze; + this.#silver = silver; + this.#gold = gold; + } + + addGold (qty) { + this.#gold += qty; + emit('treasurechest:add', {type: 'gold', qty: qty}); + + return this; + } + + addSilver (qty) { + this.#silver += qty; + emit('treasurechest:add', {type: 'silver', qty: qty}); + + return this; + } + + addBronze (qty) { + this.#bronze += qty; + emit('treasurechest:add', {type: 'bronze', qty: qty}); + + return this; + } + + getBronze () { + return this.#bronze; + } + + getSilver () { + return this.#silver; + } + + getGold () { + return this.#gold; + } + + getLoot () { + return `Gold: ${this.#gold}, Silver: ${this.#silver}, Bronze: ${this.#bronze}`; + } + + /** + * Randomly shuffle an array + * https://stackoverflow.com/a/2450976/1293256 + * @param {Array} array The array to shuffle + * @return {Array} The shuffled array + */ + static #shuffle (array) { + let currentIndex = array.length; + let temporaryValue, randomIndex; + + // While there remain elements to shuffle... + while (0 !== currentIndex) { + // Pick a remaining element... + randomIndex = Math.floor(Math.random() * currentIndex); + currentIndex -= 1; + + // And swap it with the current element. + temporaryValue = array[currentIndex]; + array[currentIndex] = array[randomIndex]; + array[randomIndex] = temporaryValue; + } + + return array; + } + + static getRandomLoot () { + let amount = []; + + for (let qty = 0; qty < 50; qty++) { + amount.push(qty+1); + } + + return { + gold: this.#shuffle(amount)[0], + silver: this.#shuffle(amount)[0], + bronze: this.#shuffle(amount)[0], + } + } + +}; +