/**
* @ojcomponent oj.ojLedGauge
* @augments oj.dvtBaseGauge
* @since 0.7
*
* @classdesc
* <h3 id="ledGaugeOverview-section">
* JET LED Gauge Component
* <a class="bookmarkable-link" title="Bookmarkable Link" href="#ledGaugeOverview-section"></a>
* </h3>
*
* <p>LED gauge component for JET. LED gauges are used to highlight a specific metric value in relation to its
* thresholds.<p>
*
* {@ojinclude "name":"warning"}
*
* <pre class="prettyprint">
* <code>
* <div data-bind="ojComponent: {
* component: 'ojLedGauge',
* value: 63, min: 0, max: 100,
* thresholds: [{max: 33}, {max: 67}, {}]
* }"/>
* </code>
* </pre>
*
* <h3 id="touch-section">
* Touch End User Information
* <a class="bookmarkable-link" title="Bookmarkable Link" href="#touch-section"></a>
* </h3>
*
* {@ojinclude "name":"touchDoc"}
*
* <h3 id="keyboard-section">
* Keyboard End User Information
* <a class="bookmarkable-link" title="Bookmarkable Link" href="#keyboard-section"></a>
* </h3>
*
* {@ojinclude "name":"keyboardDoc"}
*
* {@ojinclude "name":"a11y"}
*
* {@ojinclude "name":"rtl"}
*
* @desc Creates a JET LED Gauge.
* @example <caption>Initialize the LED Gauge with no options specified:</caption>
* $(".selector").ojLedGauge();
*
* @example <caption>Initialize the LED Gauge with some options:</caption>
* $(".selector").ojLedGauge({value: 63, min: 0, max: 100, thresholds: [{max: 33}, {max: 67}, {}]});
*
* @example <caption>Initialize the LED Gauge via the JET <code class="prettyprint">ojComponent</code> binding:</caption>
* <div data-bind="ojComponent: {component: 'ojLedGauge'}">
*/
oj.__registerWidget('oj.ojLedGauge', $['oj']['dvtBaseGauge'],
{
widgetEventPrefix : "oj",
options: {},
//** @inheritdoc */
_CreateDvtComponent : function(context, callback, callbackObj) {
return dvt.DvtLedGauge.newInstance(context, callback, callbackObj);
},
//** @inheritdoc */
_ConvertSubIdToLocator : function(subId) {
var locator = {};
if(subId == 'tooltip') {
locator['subId'] = 'oj-ledgauge-tooltip';
}
return locator;
},
//** @inheritdoc */
_GetComponentStyleClasses : function() {
var styleClasses = this._super();
styleClasses.push('oj-ledgauge');
return styleClasses;
},
//** @inheritdoc */
_Render : function() {
// Display the title of the surrounding div as the tooltip. Remove title from div to avoid browser default tooltip.
if(this.element.attr('title'))
{
this.options['shortDesc'] = this.element.attr('title');
this.element.data( this.element,'title', this.element.attr('title'));
this.element.removeAttr('title');
}
else if (this.element.data('title'))
this.options['shortDesc'] = this.element.data('title');
// Call the super to render
this._super();
},
/**
* Returns the gauge's metric label.
* @return {Object} The metric label object
* @expose
* @instance
* @memberof oj.ojLedGauge
*/
getMetricLabel: function() {
var auto = this._component.getAutomation();
return auto.getMetricLabel();
}
});
Source: src/main/javascript/oracle/oj/ojgauge/ojledgauge.js
Oracle® JavaScript Extension Toolkit (JET)
1.1.2
E65298-01