89 lines
2.9 KiB
JavaScript
89 lines
2.9 KiB
JavaScript
/**
|
|
* Functions related to VU meters.
|
|
* These functions are intimately tied to the markup defined in the
|
|
* VU templates in _vu_meters.html.erb
|
|
*/
|
|
(function(context, $) {
|
|
|
|
"use strict";
|
|
|
|
context.JK = context.JK || {};
|
|
|
|
// As these are helper functions, just have a single
|
|
// static object with functions. Each function should
|
|
// take all necessary arguments to complete its work.
|
|
context.JK.VuHelpers = {
|
|
|
|
/**
|
|
* Render a VU meter into the provided selector.
|
|
* vuType can be either "horizontal" or "vertical"
|
|
*/
|
|
renderVU: function(selector, userOptions) {
|
|
/**
|
|
* The default options for rendering a VU
|
|
*/
|
|
var renderVUDefaults = {
|
|
vuType: "vertical",
|
|
lightCount: 12,
|
|
lightWidth: 3,
|
|
lightHeight: 17
|
|
};
|
|
|
|
var options = $.extend({}, renderVUDefaults, userOptions);
|
|
var templateSelector = "#template-vu-v";
|
|
if (options.vuType === "horizontal") {
|
|
templateSelector = "#template-vu-h";
|
|
}
|
|
var templateSource = $(templateSelector).html();
|
|
$(selector).empty();
|
|
|
|
$(selector).html(context._.template(templateSource, options, {variable: 'data'}));
|
|
},
|
|
|
|
/**
|
|
* Given a selector representing a container for a VU meter and
|
|
* a value between 0.0 and 1.0, light the appropriate lights.
|
|
*/
|
|
updateVU: function (selector, value) {
|
|
// There are 13 VU lights. Figure out how many to
|
|
// light based on the incoming value.
|
|
var countSelector = 'tr';
|
|
var horizontal = ($('table.horizontal', selector).length);
|
|
if (horizontal) {
|
|
countSelector = 'td';
|
|
}
|
|
|
|
var lightCount = $(countSelector, selector).length;
|
|
var i = 0;
|
|
var state = 'on';
|
|
var lights = Math.round(value * lightCount);
|
|
var redSwitch = Math.round(lightCount * 0.6666667);
|
|
|
|
var $light = null;
|
|
var colorClass = 'vu-green-';
|
|
var lightSelectorPrefix = selector + ' td.vu';
|
|
var thisLightSelector = null;
|
|
|
|
// Remove all light classes from all lights
|
|
var allLightsSelector = selector + ' td.vulight';
|
|
$(allLightsSelector).removeClass('vu-green-off vu-green-on vu-red-off vu-red-on');
|
|
|
|
// Set the lights
|
|
for (i=0; i<lightCount; i++) {
|
|
colorClass = 'vu-green-';
|
|
state = 'on';
|
|
if (i >= redSwitch) {
|
|
colorClass = 'vu-red-';
|
|
}
|
|
if (i >= lights) {
|
|
state = 'off';
|
|
}
|
|
thisLightSelector = lightSelectorPrefix + i;
|
|
$light = $(thisLightSelector);
|
|
$light.addClass(colorClass + state);
|
|
}
|
|
}
|
|
|
|
};
|
|
|
|
})(window, jQuery); |