joachim/openwebrx-clone
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

use jquery to store progressbar objects

Browse Source
This commit is contained in:
Jakob Ketterl 2020-05-08 21:18:03 +02:00
parent ceafcbf850
commit fc7188145b
3 changed files with 43 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
htdocs/index.html
View File

@ -134,12 +134,12 @@
</div> </div>
</div> </div>
<div class="openwebrx-panel" id="openwebrx-panel-status" data-panel-name="status" style="width: 615px;" data-panel-transparent="true"> <div class="openwebrx-panel" id="openwebrx-panel-status" data-panel-name="status" style="width: 615px;" data-panel-transparent="true">
<div class="openwebrx-progressbar" id="openwebrx-bar-audio-buffer"> <span class="openwebrx-progressbar-text">Audio buffer [0 ms]</span><div class="openwebrx-progressbar-bar"></div></div> <div class="openwebrx-progressbar" id="openwebrx-bar-audio-buffer" data-type="audiobuffer"> <span class="openwebrx-progressbar-text">Audio buffer [0 ms]</span><div class="openwebrx-progressbar-bar"></div></div>
<div class="openwebrx-progressbar" id="openwebrx-bar-audio-output"> <span class="openwebrx-progressbar-text">Audio output [0 sps]</span><div class="openwebrx-progressbar-bar"></div></div> <div class="openwebrx-progressbar" id="openwebrx-bar-audio-output" data-type="audiooutput"> <span class="openwebrx-progressbar-text">Audio output [0 sps]</span><div class="openwebrx-progressbar-bar"></div></div>
<div class="openwebrx-progressbar" id="openwebrx-bar-audio-speed"> <span class="openwebrx-progressbar-text">Audio stream [0 kbps]</span><div class="openwebrx-progressbar-bar"></div></div> <div class="openwebrx-progressbar" id="openwebrx-bar-audio-speed" data-type="audiospeed"> <span class="openwebrx-progressbar-text">Audio stream [0 kbps]</span><div class="openwebrx-progressbar-bar"></div></div>
<div class="openwebrx-progressbar" id="openwebrx-bar-network-speed"> <span class="openwebrx-progressbar-text">Network usage [0 kbps]</span><div class="openwebrx-progressbar-bar"></div></div> <div class="openwebrx-progressbar" id="openwebrx-bar-network-speed" data-type="networkspeed"> <span class="openwebrx-progressbar-text">Network usage [0 kbps]</span><div class="openwebrx-progressbar-bar"></div></div>
<div class="openwebrx-progressbar" id="openwebrx-bar-server-cpu"> <span class="openwebrx-progressbar-text">Server CPU [0%]</span><div class="openwebrx-progressbar-bar"></div></div> <div class="openwebrx-progressbar" id="openwebrx-bar-server-cpu" data-type="cpu"> <span class="openwebrx-progressbar-text">Server CPU [0%]</span><div class="openwebrx-progressbar-bar"></div></div>
<div class="openwebrx-progressbar" id="openwebrx-bar-clients"> <span class="openwebrx-progressbar-text">Clients [1]</span><div class="openwebrx-progressbar-bar"></div></div> <div class="openwebrx-progressbar" id="openwebrx-bar-clients" data-type="clients"> <span class="openwebrx-progressbar-text">Clients [1]</span><div class="openwebrx-progressbar-bar"></div></div>
</div> </div>
</div> </div>
<div id="openwebrx-panels-container-right"> <div id="openwebrx-panels-container-right">

31
htdocs/lib/ProgressBar.js
View File

@ -25,13 +25,16 @@ ProgressBar.prototype.setOver = function(over) {
this.$innerBar.css('backgroundColor', (over) ? "#ff6262" : "#00aba6"); this.$innerBar.css('backgroundColor', (over) ? "#ff6262" : "#00aba6");
}; };
AudioBufferProgressBar = function(el, sampleRate) { AudioBufferProgressBar = function(el) {
ProgressBar.call(this, el); ProgressBar.call(this, el);
this.sampleRate = sampleRate;
}; };
AudioBufferProgressBar.prototype = new ProgressBar(); AudioBufferProgressBar.prototype = new ProgressBar();
AudioBufferProgressBar.prototype.setSampleRate = function(sampleRate) {
this.sampleRate = sampleRate;
};
AudioBufferProgressBar.prototype.setBuffersize = function(buffersize) { AudioBufferProgressBar.prototype.setBuffersize = function(buffersize) {
var audio_buffer_value = buffersize / this.sampleRate; var audio_buffer_value = buffersize / this.sampleRate;
var overrun = audio_buffer_value > audio_buffer_maximal_length_sec; var overrun = audio_buffer_value > audio_buffer_maximal_length_sec;
@ -70,12 +73,15 @@ AudioSpeedProgressBar.prototype.setSpeed = function(speed) {
AudioOutputProgressBar = function(el, sampleRate) { AudioOutputProgressBar = function(el, sampleRate) {
ProgressBar.call(this, el); ProgressBar.call(this, el);
this.maxRate = sampleRate * 1.25;
this.minRate = sampleRate * .25;
}; };
AudioOutputProgressBar.prototype = new ProgressBar(); AudioOutputProgressBar.prototype = new ProgressBar();
AudioOutputProgressBar.prototype.setSampleRate = function(sampleRate) {
this.maxRate = sampleRate * 1.25;
this.minRate = sampleRate * .25;
};
AudioOutputProgressBar.prototype.setAudioRate = function(audioRate) { AudioOutputProgressBar.prototype.setAudioRate = function(audioRate) {
this.set(audioRate / this.maxRate, "Audio output [" + (audioRate / 1000).toFixed(1) + " ksps]", audioRate > this.maxRate || audioRate < this.minRate); this.set(audioRate / this.maxRate, "Audio output [" + (audioRate / 1000).toFixed(1) + " ksps]", audioRate > this.maxRate || audioRate < this.minRate);
}; };
@ -111,3 +117,20 @@ CpuProgressBar.prototype = new ProgressBar();
CpuProgressBar.prototype.setUsage = function(usage) { CpuProgressBar.prototype.setUsage = function(usage) {
this.set(usage, "Server CPU [" + Math.round(usage * 100) + "%]", usage > .85); this.set(usage, "Server CPU [" + Math.round(usage * 100) + "%]", usage > .85);
}; };
ProgressBar.types = {
cpu: CpuProgressBar,
audiobuffer: AudioBufferProgressBar,
audiospeed: AudioSpeedProgressBar,
audiooutput: AudioOutputProgressBar,
clients: ClientsProgressBar,
networkspeed: NetworkSpeedProgressBar
}
$.fn.progressbar = function() {
if (!this.data('progressbar')) {
var constructor = ProgressBar.types[this.data('type')] || ProgressBar;
this.data('progressbar', new constructor(this));
}
return this.data('progressbar');
};

30
htdocs/openwebrx.js
View File

@ -739,7 +739,7 @@ function on_ws_recv(evt) {
divlog("Audio stream is " + ((audio_compression === "adpcm") ? "compressed" : "uncompressed") + "."); divlog("Audio stream is " + ((audio_compression === "adpcm") ? "compressed" : "uncompressed") + ".");
fft_compression = config['fft_compression']; fft_compression = config['fft_compression'];
divlog("FFT stream is " + ((fft_compression === "adpcm") ? "compressed" : "uncompressed") + "."); divlog("FFT stream is " + ((fft_compression === "adpcm") ? "compressed" : "uncompressed") + ".");
clientProgressBar.setMaxClients(config['max_clients']); $('#openwebrx-bar-clients').progressbar().setMaxClients(config['max_clients']);
waterfall_init(); waterfall_init();
var demodulatorPanel = $('#openwebrx-panel-receiver').demodulatorPanel(); var demodulatorPanel = $('#openwebrx-panel-receiver').demodulatorPanel();
@ -773,10 +773,10 @@ function on_ws_recv(evt) {
setSmeterAbsoluteValue(smeter_level); setSmeterAbsoluteValue(smeter_level);
break; break;
case "cpuusage": case "cpuusage":
cpuProgressBar.setUsage(json['value']); $('#openwebrx-bar-server-cpu').progressbar().setUsage(json['value']);
break; break;
case "clients": case "clients":
clientProgressBar.setClients(json['value']); $('#openwebrx-bar-clients').progressbar().setClients(json['value']);
break; break;
case "profiles": case "profiles":
var listbox = e("openwebrx-sdr-profiles-listbox"); var listbox = e("openwebrx-sdr-profiles-listbox");
@ -1121,7 +1121,7 @@ function on_ws_opened() {
if (!networkSpeedMeasurement) { if (!networkSpeedMeasurement) {
networkSpeedMeasurement = new Measurement(); networkSpeedMeasurement = new Measurement();
networkSpeedMeasurement.report(60000, 1000, function(rate){ networkSpeedMeasurement.report(60000, 1000, function(rate){
networkSpeedProgressBar.setSpeed(rate); $('#openwebrx-bar-network-speed').progressbar().setSpeed(rate);
}); });
} else { } else {
networkSpeedMeasurement.reset(); networkSpeedMeasurement.reset();
@ -1352,33 +1352,23 @@ function init_header() {
}); });
} }
var audioBufferProgressBar;
var networkSpeedProgressBar;
var audioSpeedProgressBar;
var audioOutputProgressBar;
var clientProgressBar;
var cpuProgressBar;
function initProgressBars() { function initProgressBars() {
audioBufferProgressBar = new AudioBufferProgressBar($('#openwebrx-bar-audio-buffer'), audioEngine.getSampleRate()); $('#openwebrx-bar-audio-buffer, #openwebrx-bar-audio-output').each(function() {
networkSpeedProgressBar = new NetworkSpeedProgressBar($('#openwebrx-bar-network-speed')); $(this).progressbar().setSampleRate(audioEngine.getSampleRate());
audioSpeedProgressBar = new AudioSpeedProgressBar($('#openwebrx-bar-audio-speed')); });
audioOutputProgressBar = new AudioOutputProgressBar($('#openwebrx-bar-audio-output'), audioEngine.getSampleRate());
clientProgressBar = new ClientsProgressBar($('#openwebrx-bar-clients'));
cpuProgressBar = new CpuProgressBar($('#openwebrx-bar-server-cpu'));
} }
function audioReporter(stats) { function audioReporter(stats) {
if (typeof(stats.buffersize) !== 'undefined') { if (typeof(stats.buffersize) !== 'undefined') {
audioBufferProgressBar.setBuffersize(stats.buffersize); $('#openwebrx-bar-audio-buffer').progressbar().setBuffersize(stats.buffersize);
} }
if (typeof(stats.audioByteRate) !== 'undefined') { if (typeof(stats.audioByteRate) !== 'undefined') {
audioSpeedProgressBar.setSpeed(stats.audioByteRate * 8); $('#openwebrx-bar-audio-speed').progressbar().setSpeed(stats.audioByteRate * 8);
} }
if (typeof(stats.audioRate) !== 'undefined') { if (typeof(stats.audioRate) !== 'undefined') {
audioOutputProgressBar.setAudioRate(stats.audioRate); $('#openwebrx-bar-audio-output').progressbar().setAudioRate(stats.audioRate);
} }
} }