diff --git a/js/ui/select.js b/js/ui/select.js new file mode 100644 index 0000000000000000000000000000000000000000..7722f2a7221cf9dd67edb3beb428e77d3deb27da --- /dev/null +++ b/js/ui/select.js @@ -0,0 +1,48 @@ +App.UI.Select = class Select { + /** + * Creates a new dropdown with available and unavailable options. + * @param {string[]} options A list of options to display. + * @param {string} [display] The default option to display when one is not selected. + */ + constructor(options, display) { + this.options = options; + this.display = display; + } + + /** + * Creates a list of all options, available and unavailable. + * @returns {HTMLOptionElement[]} + * @private + */ + _createOptions() { + const arr = []; + + this.options.forEach(option => { + arr.push(new Option(option)); + }); + + return arr; + } + + /** + * Renders the dropdown onscreen. + * @returns {HTMLSelectElement} + */ + render() { + const select = document.createElement("select"); + + const options = this._createOptions(); + + options.forEach(option => { + select.add(option); + + if (this.display) { + if (option.nodeValue === this.display) { + option.selected = true; + } + } + }); + + return select; + } +};