263 lines
9.3 KiB
JavaScript
263 lines
9.3 KiB
JavaScript
/* global WaveSurfer calcPolarPlotSVG */
|
|
|
|
$(document).ready(function() {
|
|
'use strict';
|
|
|
|
// Format time for the player
|
|
function formatTime(timeSeconds) {
|
|
var minute = Math.floor(timeSeconds / 60);
|
|
var tmp = Math.round(timeSeconds - (minute * 60));
|
|
var second = (tmp < 10 ? '0' : '') + tmp;
|
|
var seconds_rounded = Math.round(timeSeconds);
|
|
return String(minute + ':' + second + ' / ' + seconds_rounded + ' s');
|
|
}
|
|
|
|
// Set width for not selected tabs
|
|
var panelWidth = $('.tab-content').first().width();
|
|
$('.tab-pane').css('width', panelWidth);
|
|
|
|
// Waveform loading
|
|
$('.wave').each(function(){
|
|
var $this = $(this);
|
|
var wid = $this.data('id');
|
|
var data_audio_url = $this.data('audio');
|
|
var container_el = '#data-' + wid;
|
|
$(container_el).css('opacity', '0');
|
|
var loading = '#loading-' + wid;
|
|
var $playbackTime = $('#playback-time-' + wid);
|
|
var progressDiv = $('#progress-bar-' + wid);
|
|
var progressBar = $('.progress-bar', progressDiv);
|
|
|
|
var showProgress = function (percent) {
|
|
if (percent == 100) {
|
|
$(loading).text('Analyzing data...');
|
|
}
|
|
progressDiv.css('display', 'block');
|
|
progressBar.css('width', percent + '%');
|
|
progressBar.text(percent + '%');
|
|
};
|
|
|
|
var hideProgress = function () {
|
|
progressDiv.css('display', 'none');
|
|
};
|
|
|
|
var wavesurfer = WaveSurfer.create({
|
|
container: container_el,
|
|
waveColor: '#bf7fbf',
|
|
progressColor: 'purple',
|
|
plugins: [
|
|
WaveSurfer.spectrogram.create({
|
|
wavesurfer: wavesurfer,
|
|
container: '#wave-spectrogram',
|
|
fftSamples: 256,
|
|
windowFunc: 'hann'
|
|
})
|
|
]
|
|
});
|
|
|
|
wavesurfer.on('destroy', hideProgress);
|
|
wavesurfer.on('error', hideProgress);
|
|
|
|
wavesurfer.on('loading', function(percent) {
|
|
showProgress(percent);
|
|
$(loading).show();
|
|
});
|
|
|
|
$this.parents('.observation-data').find('.playpause').click( function(){
|
|
wavesurfer.playPause();
|
|
});
|
|
|
|
$('a[href="#tab-audio"]').on('shown.bs.tab', function () {
|
|
wavesurfer.load(data_audio_url);
|
|
$('a[href="#tab-audio"]').off('shown.bs.tab');
|
|
});
|
|
|
|
wavesurfer.on('ready', function() {
|
|
hideProgress();
|
|
|
|
//$playbackTime.text(formatTime(wavesurfer.getCurrentTime()));
|
|
$playbackTime.text(formatTime(wavesurfer.getCurrentTime()));
|
|
|
|
wavesurfer.on('audioprocess', function(evt) {
|
|
$playbackTime.text(formatTime(evt));
|
|
});
|
|
wavesurfer.on('seek', function(evt) {
|
|
$playbackTime.text(formatTime(wavesurfer.getDuration() * evt));
|
|
});
|
|
$(loading).hide();
|
|
$(container_el).css('opacity', '1');
|
|
});
|
|
});
|
|
|
|
// Handle Observation tabs
|
|
var uri = new URL(location.href);
|
|
var tab = uri.hash;
|
|
$('.observation-tabs li a[href="' + tab + '"]').tab('show');
|
|
|
|
// Delete confirmation
|
|
var message = 'Do you really want to delete this Observation?';
|
|
var actions = $('#obs-delete');
|
|
if (actions.length) {
|
|
actions[0].addEventListener('click', function(e) {
|
|
if (! confirm(message)) {
|
|
e.preventDefault();
|
|
}
|
|
});
|
|
}
|
|
//Vetting help functions
|
|
function show_alert(type, msg){
|
|
$('#alert-messages').html(
|
|
`<div class="col-md-12">
|
|
<div class="alert alert-` + type + `" role="alert">
|
|
<button type="button" class="close" data-dismiss="alert" aria-label="Close">
|
|
<span class="glyphicon glyphicon-remove"></span>
|
|
</button>` + msg +`
|
|
</div>
|
|
</div>`);
|
|
}
|
|
|
|
function change_vetting_labels(status, status_display, user, datetime){
|
|
$('#vetting-status').find('button').each(function(){
|
|
if(this.dataset.status == status){
|
|
$(this).addClass('hidden');
|
|
} else {
|
|
$(this).removeClass('hidden');
|
|
}
|
|
});
|
|
var label_classes = 'label-unknown label-good label-bad label-failed';
|
|
$('#vetting-status-label').removeClass(label_classes).addClass('label-' + status);
|
|
$('#vetting-status-label').text(status_display);
|
|
var title = 'Vetted ' + status + ' on ' + datetime + ' by ' + user;
|
|
if(status == 'unknown'){
|
|
title = 'This observation needs vetting';
|
|
}
|
|
$('#vetting-status-label').prop('title', title).tooltip('fixTitle');
|
|
}
|
|
|
|
//Vetting request
|
|
function vet_observation(id, vet_status){
|
|
var data = {};
|
|
data.status = vet_status;
|
|
var url = '/observation_vet/' + id + '/';
|
|
$.ajax({
|
|
type: 'POST',
|
|
url: url,
|
|
data: data,
|
|
dataType: 'json',
|
|
beforeSend: function(xhr) {
|
|
xhr.setRequestHeader('X-CSRFToken', $('[name="csrfmiddlewaretoken"]').val());
|
|
$('#vetting-status').hide();
|
|
$('#vetting-spinner').show();
|
|
}
|
|
}).done(function(results) {
|
|
if (Object.prototype.hasOwnProperty.call(results, 'error')) {
|
|
var error_msg = results.error;
|
|
show_alert('danger',error_msg);
|
|
} else {
|
|
show_alert('success', 'Observation is vetted succesfully as ' + results.vetted_status);
|
|
change_vetting_labels(results.vetted_status, results.vetted_status_display, results.vetted_user, results.vetted_datetime);
|
|
}
|
|
$('#vetting-spinner').hide();
|
|
$('#vetting-status').show();
|
|
return;
|
|
}).fail(function() {
|
|
var error_msg = 'Something went wrong, please try again';
|
|
show_alert('danger', error_msg);
|
|
$('#vetting-spinner').hide();
|
|
$('#vetting-status').show();
|
|
return;
|
|
});
|
|
}
|
|
|
|
$('#vetting-status button').click( function(){
|
|
var vet_status = $(this).data('status');
|
|
var id = $(this).data('id');
|
|
$(this).blur();
|
|
vet_observation(id, vet_status);
|
|
});
|
|
|
|
//JSON pretty renderer
|
|
var metadata = $('#json-renderer').data('json');
|
|
$('#json-renderer').jsonViewer(metadata, {collapsed: true});
|
|
|
|
// Draw orbit in polar plot
|
|
var tleLine1 = $('svg#polar').data('tle1');
|
|
var tleLine2 = $('svg#polar').data('tle2');
|
|
|
|
var timeframe = {
|
|
start: new Date($('svg#polar').data('timeframe-start')),
|
|
end: new Date($('svg#polar').data('timeframe-end'))
|
|
};
|
|
|
|
var groundstation = {
|
|
lon: $('svg#polar').data('groundstation-lon'),
|
|
lat: $('svg#polar').data('groundstation-lat'),
|
|
alt: $('svg#polar').data('groundstation-alt')
|
|
};
|
|
|
|
const polarPlotSVG = calcPolarPlotSVG(timeframe,
|
|
groundstation,
|
|
tleLine1,
|
|
tleLine2);
|
|
|
|
$('svg#polar').append(polarPlotSVG);
|
|
|
|
// Function to convert hex data in each data blob to ASCII, while storing
|
|
// the original blob in a jquery .data, for later reversal back to hex
|
|
// (see next function)
|
|
$('#asciibutton').click(function(){
|
|
$('.hex').each(function(){
|
|
$(this).data('hex', $(this).text());
|
|
var hex = $(this).text().replace(/ /g,'').replace(/\r?\n|\r/g, '');
|
|
var str = '';
|
|
for (var i = 0; i < hex.length; i += 2) {
|
|
str += String.fromCharCode(parseInt(hex.substr(i, 2), 16));
|
|
}
|
|
$(this).html(str);
|
|
});
|
|
$('#asciibutton').toggleClass('btn-default');
|
|
$('#asciibutton').toggleClass('btn-primary');
|
|
$('#hexbutton').toggleClass('btn-default');
|
|
$('#hexbutton').toggleClass('btn-primary');
|
|
$('#asciibutton').attr('disabled', 'disabled');
|
|
$('#hexbutton').removeAttr('disabled');
|
|
});
|
|
|
|
// retrieve saved hex data and replace the decoded blob with the original
|
|
// hex text
|
|
$('#hexbutton').click(function(){
|
|
$('.hex').each(function(){
|
|
$(this).html($(this).data('hex'));
|
|
});
|
|
$('#asciibutton').toggleClass('btn-default');
|
|
$('#asciibutton').toggleClass('btn-primary');
|
|
$('#hexbutton').toggleClass('btn-default');
|
|
$('#hexbutton').toggleClass('btn-primary');
|
|
$('#hexbutton').attr('disabled', 'disabled');
|
|
$('#asciibutton').removeAttr('disabled');
|
|
});
|
|
|
|
// Hotkeys bindings
|
|
$(document).bind('keyup', function(event){
|
|
if (event.which == 88) {
|
|
var link_delete = $('#obs-delete');
|
|
link_delete[0].click();
|
|
} else if (event.which == 68) {
|
|
var link_discuss = $('#obs-discuss');
|
|
link_discuss[0].click();
|
|
} else if (event.which == 85) {
|
|
var link_unknown = $('#unknown-data');
|
|
link_unknown[0].click();
|
|
} else if (event.which == 71) {
|
|
var link_good = $('#good-data');
|
|
link_good[0].click();
|
|
} else if (event.which == 66) {
|
|
var link_bad = $('#bad-data');
|
|
link_bad[0].click();
|
|
} else if (event.which == 70) {
|
|
var link_failed = $('#failed-data');
|
|
link_failed[0].click();
|
|
}
|
|
});
|
|
});
|