/** * display.js is the main Javascript file that is used to drive the display. */ /** * Background type enumeration */ var BackgroundType = { Transparent: "transparent", Solid: "solid", Gradient: "gradient", Video: "video", Image: "image" }; /** * Gradient type enumeration */ var GradientType = { Horizontal: "horizontal", LeftTop: "leftTop", LeftBottom: "leftBottom", Vertical: "vertical", Circular: "circular" }; /** * Horizontal alignment enumeration */ var HorizontalAlign = { Left: "left", Right: "right", Center: "center", Justify: "justify" }; /** * Vertical alignment enumeration */ var VerticalAlign = { Top: "top", Middle: "middle", Bottom: "bottom" }; /** * Audio state enumeration */ var AudioState = { Playing: "playing", Paused: "paused", Stopped: "stopped" }; /** * Transition state enumeration */ var TransitionState = { EntranceTransition: "entranceTransition", NoTransition: "noTransition", ExitTransition: "exitTransition" }; /** * Animation state enumeration */ var AnimationState = { NoAnimation: "noAnimation", ScrollingText: "scrollingText", NonScrollingText: "noScrollingText" }; /** * Alert location enumeration */ var AlertLocation = { Top: 0, Middle: 1, Bottom: 2 }; /** * Alert state enumeration */ var AlertState = { Displaying: "displaying", NotDisplaying: "notDisplaying" }; /** * Alert delay enumeration */ var AlertDelay = { FiftyMilliseconds: 50, OneSecond: 1000, OnePointFiveSeconds: 1500 }; /** * Return an array of elements based on the selector query * @param {string} selector - The selector to find elements * @returns {array} An array of matching elements */ function $(selector) { return Array.from(document.querySelectorAll(selector)); } /** * Build linear gradient CSS * @private * @param {string} startDir - Starting direction * @param {string} endDir - Ending direction * @param {string} startColor - The starting color * @param {string} endColor - The ending color * @returns {string} A string of the gradient CSS */ function _buildLinearGradient(startDir, endDir, startColor, endColor) { return "-webkit-gradient(linear, " + startDir + ", " + endDir + ", from(" + startColor + "), to(" + endColor + ")) fixed"; } /** * Build radial gradient CSS * @private * @param {string} width - Width of the gradient * @param {string} startColor - The starting color * @param {string} endColor - The ending color * @returns {string} A string of the gradient CSS */ function _buildRadialGradient(width, startColor, endColor) { return "-webkit-gradient(radial, " + width + " 50%, 100, " + width + " 50%, " + width + ", from(" + startColor + "), to(" + endColor + ")) fixed"; } /** * Get a style value from an element (computed or manual) * @private * @param {Object} element - The element whose style we want * @param {string} style - The name of the style we want * @returns {(Number|string)} The style value (type depends on the style) */ function _getStyle(element, style) { return document.defaultView.getComputedStyle(element).getPropertyValue(style); } /** * Convert newlines to
tags * @private * @param {string} text - The text to parse * @returns {string} The text now with
tags */ function _nl2br(text) { return text.replace("\r\n", "\n").replace("\n", "
"); } /** * Prepare text by creating paragraphs and calling _nl2br to convert newlines to
tags * @private * @param {string} text - The text to parse * @returns {string} The text now with

and
tags */ function _prepareText(text) { return "

" + _nl2br(text) + "

"; } /** * Change a camelCaseString to a camel-case-string * @private * @param {string} text * @returns {string} the Un-camel-case-ified string */ function _fromCamelCase(text) { return text.replace(/([A-Z])/g, function (match, submatch) { return '-' + submatch.toLowerCase(); }); } /** * Create a CSS style * @private * @param {string} selector - The selector for this style * @param {Object} rules - The rules to apply to the style */ function _createStyle(selector, rules) { var style; var id = selector.replace("#", "").replace(" .", "-").replace(".", "-").replace(" ", "_"); if ($("style#" + id).length != 0) { style = $("style#" + id)[0]; } else { style = document.createElement("style"); document.getElementsByTagName("head")[0].appendChild(style); style.type = "text/css"; style.id = id; } var rulesString = selector + " { "; for (var key in rules) { var ruleValue = rules[key]; var ruleKey = _fromCamelCase(key); rulesString += "" + ruleKey + ": " + ruleValue + ";"; } rulesString += " } "; if (style.styleSheet) { style.styleSheet.cssText = rulesString; } else { style.appendChild(document.createTextNode(rulesString)); } } /** * An audio player with a play list */ var AudioPlayer = function (audioElement) { this._audioElement = null; this._eventListeners = {}; this._playlist = []; this._currentTrack = null; this._canRepeat = false; this._state = AudioState.Stopped; this.createAudioElement(); }; /** * Call all listeners associated with this event * @private * @param {object} event - The event that was emitted */ AudioPlayer.prototype._callListener = function (event) { if (this._eventListeners.hasOwnProperty(event.type)) { this._eventListeners[event.type].forEach(function (listener) { listener(event); }); } else { console.warn("Received unknown event \"" + event.type + "\", doing nothing."); } }; /** * Create the