diff --git a/public/index.js b/public/index.js index 6581c50..bc2baab 100644 --- a/public/index.js +++ b/public/index.js @@ -1,3 +1,6 @@ +/** + * @param {number} duration + */ const Frame = function (duration) { this.layers = []; this.duration = duration; @@ -18,6 +21,9 @@ COLOR_CLASS[LED_COLOR.RED] = 'led-red'; COLOR_CLASS[LED_COLOR.GREEN] = 'led-green'; COLOR_CLASS[LED_COLOR.BLUE] = 'led-blue'; +/** + * @param {string} id + */ const Selector = function (id) { this.items = []; this.currentItem = 0; @@ -45,6 +51,9 @@ const Selector = function (id) { this.onSelect = function () {}; + /** + * @param {number} index + */ this.selectItem = function (index) { this.htmlItems.hidden = true; @@ -58,11 +67,20 @@ const Selector = function (id) { }; } +/** + * @param {number} width + * @param {number} depth + * @param {number} height + */ const FrameFactory = function (width, depth, height) { this.width = width; this.depth = depth; this.height = height; + /** + * @param {number} duration + * @returns Frame + */ this.getFrame = function (duration) { const frame = new Frame(duration); @@ -80,6 +98,11 @@ const FrameFactory = function (width, depth, height) { } } +/** + * @param {number} width + * @param {number} depth + * @param {number} height + */ const Cube = function (width, depth, height) { this.width = width; this.depth = depth; @@ -92,26 +115,43 @@ const Cube = function (width, depth, height) { this._setupHtml(); } + /** + * @param {number} frameIndex + */ this.setCurrentFrame = function (frameIndex) { this.currentFrame = frameIndex; this._loadFrame(frameIndex); } + /** + * @param {Frame} frame + */ this.addFrame = function (frame) { this.frames.push(frame); } + /** + * @param {number} frameIndex + */ this.deleteFrame = function (frameIndex) { this.frames = this.frames.slice(0, frameIndex).concat( this.frames.slice(frameIndex + 1) ); } + /** + * @param {number} layerIndex + * @param {number} ledIndex + */ this.switchLed = function (layerIndex, ledIndex) { this.frames[this.currentFrame].layers[layerIndex][ledIndex] = !this.frames[this.currentFrame].layers[layerIndex][ledIndex]; } + /** + * @param {number} layerIndex + * @param {boolean} state + */ this.setLayer = function (layerIndex, state) { for (let index = 0; index < this.width * this.depth; index++) { this.frames[this.currentFrame].layers[layerIndex][index] = state; @@ -124,6 +164,9 @@ const Cube = function (width, depth, height) { } } + /** + * @param {LED_COLOR} color + */ this.setLedColor = function (color) { for (const layer of this.html.children) { for (const row of layer.children) { @@ -138,6 +181,9 @@ const Cube = function (width, depth, height) { } } + /** + * @param {number} frameIndex + */ this._loadFrame = function (frameIndex) { for (let layer = 0; layer < this.frames[frameIndex].layers.length; layer++) { for (let row = 0; row < this.depth; row++) { @@ -197,6 +243,10 @@ const Cube = function (width, depth, height) { } } + /** + * @param {HTMLElement} ledHtml + * @param {boolean} state + */ this._setLed = function (ledHtml, state) { if (state) { ledHtml.classList.remove('led-off'); @@ -206,6 +256,9 @@ const Cube = function (width, depth, height) { } } +/** + * @param {string} id + */ const FrameMenu = function (id) { this.html = document.getElementById(id); this.htmlSlider = this.html.querySelector('#frame-slider'); @@ -302,11 +355,17 @@ const FrameMenu = function (id) { } ) + /** + * @param {number} frameIndex + */ this.slideToFrame = function (frameIndex) { this.htmlSlider.value = frameIndex + 1; this._updateFramePosition(); } + /** + * @param {number} frameIndex + */ this.setDuration = function (duration) { this.htmlInputDuration.value = duration; }