Final fixed to bandplan display.
This commit is contained in:
parent
8472181f8f
commit
45fcd0a772
|
|
@ -1,7 +1,8 @@
|
|||
function Bandplan(el) {
|
||||
this.el = el;
|
||||
this.bands = [];
|
||||
this.ctx = null;
|
||||
this.el = el;
|
||||
this.bands = [];
|
||||
this.ctx = null;
|
||||
this.enabled = false;
|
||||
|
||||
// Make sure canvas fills the container
|
||||
el.style.width = '100%';
|
||||
|
|
@ -15,10 +16,10 @@ function Bandplan(el) {
|
|||
|
||||
// Colors used for band types
|
||||
this.colors = {
|
||||
'hamradio' : 'rgba(0, 255, 0, 0.5)',
|
||||
'broadcast': 'rgba(0, 0, 255, 0.5)',
|
||||
'public' : 'rgba(191, 64, 0, 0.5)',
|
||||
'service' : 'rgba(255, 0, 0, 0.5)'
|
||||
'hamradio' : '#006000',
|
||||
'broadcast': '#000080',
|
||||
'public' : '#400040',
|
||||
'service' : '#800000'
|
||||
};
|
||||
};
|
||||
|
||||
|
|
@ -33,25 +34,35 @@ Bandplan.prototype.update = function(bands) {
|
|||
};
|
||||
|
||||
Bandplan.prototype.draw = function() {
|
||||
// Must be enabled to draw
|
||||
if (!this.enabled) return;
|
||||
|
||||
var width = this.el.offsetWidth;
|
||||
var height = this.el.offsetHeight;
|
||||
|
||||
// Do not draw if not shown
|
||||
if (!height) return;
|
||||
// If new dimensions are available...
|
||||
if ((height>0) && (width>0)) {
|
||||
// If canvas got resized or no context yet...
|
||||
if (!this.ctx || width!=this.el.width || height!=this.el.height) {
|
||||
this.el.width = width;
|
||||
this.el.height = height;
|
||||
|
||||
// If canvas got resized, or no context yet...
|
||||
if (!this.ctx || width!=this.el.width || height!=this.el.height) {
|
||||
this.el.width = width;
|
||||
this.el.height = height;
|
||||
|
||||
this.ctx = this.el.getContext('2d');
|
||||
this.ctx.lineWidth = height;
|
||||
this.ctx.fillStyle = 'rgba(255, 255, 255, 1.0)';
|
||||
this.ctx.textAlign = 'center';
|
||||
this.ctx.font = 'bold 11px sans-serif';
|
||||
this.ctx.textBaseline = 'middle';
|
||||
this.ctx = this.el.getContext('2d');
|
||||
this.ctx.lineWidth = height - 2;
|
||||
this.ctx.fillStyle = '#FFFFFF';
|
||||
this.ctx.textAlign = 'center';
|
||||
this.ctx.font = 'bold 11px sans-serif';
|
||||
this.ctx.textBaseline = 'middle';
|
||||
}
|
||||
}
|
||||
|
||||
// Use whatever dimensions we have at the moment
|
||||
width = this.el.width;
|
||||
height = this.el.height;
|
||||
|
||||
// Must have context and dimensions here
|
||||
if (!this.ctx || !height || !width) return;
|
||||
|
||||
// Clear canvas to transparency
|
||||
this.ctx.clearRect(0, 0, width, height);
|
||||
|
||||
|
|
@ -60,7 +71,7 @@ Bandplan.prototype.draw = function() {
|
|||
if (!range || !this.bands.length) return;
|
||||
|
||||
// Center of the ribbon
|
||||
height /= 2;
|
||||
height = (height - 2) / 2;
|
||||
|
||||
//console.log("Drawing range of " + range.start + " - " + range.end);
|
||||
|
||||
|
|
@ -89,13 +100,17 @@ Bandplan.prototype.draw = function() {
|
|||
};
|
||||
|
||||
Bandplan.prototype.toggle = function(on) {
|
||||
// If no argument given, toggle spectrum
|
||||
if (typeof(on) === 'undefined') on = !this.el.offsetHeight;
|
||||
// If no argument given, toggle bandplan
|
||||
if (typeof(on) === 'undefined') on = !this.enabled;
|
||||
|
||||
// Toggle based on the current redraw timer state
|
||||
if (this.el.offsetHeight && !on) {
|
||||
this.el.parentElement.classList.remove('expanded');
|
||||
} else if (!this.el.offsetHeight && on) {
|
||||
this.el.parentElement.classList.add('expanded');
|
||||
if (on != this.enabled) {
|
||||
this.enabled = on;
|
||||
if (on) {
|
||||
this.el.parentElement.classList.add('expanded');
|
||||
// Try drawing right away, since we may know dimensions
|
||||
this.draw();
|
||||
} else {
|
||||
this.el.parentElement.classList.remove('expanded');
|
||||
}
|
||||
}
|
||||
};
|
||||
|
|
|
|||
Loading…
Reference in New Issue