1
0
Fork 0

conversion from hex to ascii

Adds a pair of buttons that, using javascript in the browser, will convert the HEX blobs we display to ASCII, and allow for reverting back to HEX as well.

Resolves satnogs-network#460
environments/stage/deployments/224
Corey Shields 2018-11-30 23:43:52 -05:00
parent 1b7a6be535
commit cad0450f85
3 changed files with 56 additions and 5 deletions

View File

@ -68,6 +68,10 @@
color: white;
}
.decode-btn-group {
margin-top: 5px;
}
@media screen and (max-width: 835px) {
.vetting {

View File

@ -131,6 +131,41 @@ $(document).ready(function() {
$('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) {

View File

@ -330,19 +330,31 @@
</div>
<div role="tabpanel" class="tab-pane tab-data" id="tab-data">
{% if observation.demoddata.all %}
<div align="right">
<div class="btn-group btn-group-xs decode-btn-group" role="group">
<button type="button" class="btn btn-default" id="asciibutton">ASCII</button>
<button type="button" class="btn btn-primary" id="hexbutton" disabled>HEX</button>
</div>
</div>
{% for demoddata in observation.demoddata.all|sortdemoddata %}
<span class="label label-default data-label">
<a href="{{ demoddata.payload_demod.url }}" class="data-link">
{{ demoddata.payload_demod }}
</a>
</span>
<div class="well well-sm data-well">
{% if demoddata.is_image %}
{% if demoddata.is_image %}
<div class="well well-sm data-well">
<img src="{{ demoddata.payload_demod.url }}" alt="observation-{{ observation.pk }}" class="img-responsive">
{% else %}
</div>
{% elif observation.transmitter.mode == 'CW' %}
<div class="well well-sm data-well">
{{ demoddata.display_payload }}
{% endif %}
</div>
</div>
{% else %}
<div class="well well-sm data-well hex">
{{ demoddata.display_payload }}
</div>
{% endif %}
{% endfor %}
{% else %}
<div class="notice">