move rx_photo code to header

This commit is contained in:
Jakob Ketterl 2020-05-09 01:03:43 +02:00
parent 3a5e227ab5
commit 149ad8dcc6
3 changed files with 54 additions and 64 deletions

View File

@ -1,11 +1,6 @@
@import url("openwebrx-header.css");
@import url("openwebrx-globals.css");
/* expandable photo not implemented on map page */
#webrx-top-photo-clip {
max-height: 67px;
}
body {
display: flex;
flex-direction: column;

View File

@ -4,16 +4,69 @@ function Header(el) {
this.el.find('#openwebrx-main-buttons').find('[data-toggle-panel]').click(function () {
toggle_panel($(this).data('toggle-panel'));
});
this.init_rx_photo();
};
Header.prototype.setDetails = function(details) {
this.el.find('#webrx-rx-title').html(details['receiver_name']);
var query = encodeURIComponent(details['receiver_gps']['lat'] + ',' + details['receiver_gps']['lon']);
this.el.find('#webrx-rx-desc').html(details['receiver_location'] + ' | Loc: ' + details['locator'] + ', ASL: ' + details['receiver_asl'] + ' m, <a href="https://www.google.com/maps/search/?api=1&query=' + query + '" target="_blank" onclick="dont_toggle_rx_photo();">[maps]</a>');
this.el.find('#webrx-rx-desc').html(details['receiver_location'] + ' | Loc: ' + details['locator'] + ', ASL: ' + details['receiver_asl'] + ' m, <a href="https://www.google.com/maps/search/?api=1&query=' + query + '" target="_blank">[maps]</a>');
this.el.find('#webrx-rx-photo-title').html(details['photo_title']);
this.el.find('#webrx-rx-photo-desc').html(details['photo_desc']);
};
Header.prototype.init_rx_photo = function() {
var clip = this.el.find("#webrx-top-photo-clip")[0];
this.rx_photo_height = clip.clientHeight;
clip.style.maxHeight = this.rx_photo_height + "px";
this.rx_photo_state = 1;
$.extend($.easing, {
easeOutCubic:function(x) {
return 1 - Math.pow( 1 - x, 3 );
}
});
window.setTimeout(function () {
$('#webrx-rx-photo-title').animate({opacity: 0}, 500);
}, 1000);
window.setTimeout(function () {
$('#webrx-rx-photo-desc').animate({opacity: 0}, 500);
}, 1500);
window.setTimeout(this.close_rx_photo.bind(this), 2500);
$('#webrx-top-container').find('.openwebrx-photo-trigger').click(this.toggle_rx_photo.bind(this));
};
Header.prototype.close_rx_photo = function() {
this.rx_photo_state = 0;
this.el.find("#webrx-rx-photo-desc").animate({opacity: 0});
this.el.find("#webrx-rx-photo-title").animate({opacity: 0});
this.el.find('#webrx-top-photo-clip').animate({maxHeight: 67}, {duration: 1000, easing: 'easeOutCubic'});
this.el.find("#openwebrx-rx-details-arrow-down").show();
this.el.find("#openwebrx-rx-details-arrow-up").hide();
}
Header.prototype.open_rx_photo = function() {
this.rx_photo_state = 1;
this.el.find("#webrx-rx-photo-desc").animate({opacity: 1});
this.el.find("#webrx-rx-photo-title").animate({opacity: 1});
this.el.find('#webrx-top-photo-clip').animate({maxHeight: this.rx_photo_height}, {duration: 1000, easing: 'easeOutCubic'});
this.el.find("#openwebrx-rx-details-arrow-down").hide();
this.el.find("#openwebrx-rx-details-arrow-up").show();
}
Header.prototype.toggle_rx_photo = function(ev) {
if (ev && ev.target && ev.target.tagName == 'A') {
return;
}
if (this.rx_photo_state) {
this.close_rx_photo();
} else {
this.open_rx_photo();
}
};
$.fn.header = function() {
if (!this.data('header')) {
this.data('header', new Header(this));

View File

@ -31,68 +31,11 @@ var fft_compression = "none";
var fft_codec;
var waterfall_setup_done = 0;
var secondary_fft_size;
var rx_photo_state = 1;
function e(what) {
return document.getElementById(what);
}
var rx_photo_height;
function init_rx_photo() {
var clip = e("webrx-top-photo-clip");
rx_photo_height = clip.clientHeight;
clip.style.maxHeight = rx_photo_height + "px";
$.extend($.easing, {
easeOutCubic:function(x) {
return 1 - Math.pow( 1 - x, 3 );
}
});
window.setTimeout(function () {
$('#webrx-rx-photo-title').animate({opacity: 0}, 500);
}, 1000);
window.setTimeout(function () {
$('#webrx-rx-photo-desc').animate({opacity: 0}, 500);
}, 1500);
window.setTimeout(function () {
close_rx_photo()
}, 2500);
$('#webrx-top-container').find('.openwebrx-photo-trigger').click(toggle_rx_photo);
}
var dont_toggle_rx_photo_flag = 0;
function dont_toggle_rx_photo() {
dont_toggle_rx_photo_flag = 1;
}
function toggle_rx_photo() {
if (dont_toggle_rx_photo_flag) {
dont_toggle_rx_photo_flag = 0;
return;
}
if (rx_photo_state) close_rx_photo();
else open_rx_photo()
}
function close_rx_photo() {
rx_photo_state = 0;
$('#webrx-top-photo-clip').animate({maxHeight: 67}, {duration: 1000, easing: 'easeOutCubic'});
e("openwebrx-rx-details-arrow-down").style.display = "block";
e("openwebrx-rx-details-arrow-up").style.display = "none";
}
function open_rx_photo() {
rx_photo_state = 1;
e("webrx-rx-photo-desc").style.opacity = 1;
e("webrx-rx-photo-title").style.opacity = 1;
$('#webrx-top-photo-clip').animate({maxHeight: rx_photo_height}, {duration: 1000, easing: 'easeOutCubic'});
e("openwebrx-rx-details-arrow-down").style.display = "none";
e("openwebrx-rx-details-arrow-up").style.display = "block";
}
function updateVolume() {
audioEngine.setVolume(parseFloat(e("openwebrx-panel-volume").value) / 100);
}
@ -1378,7 +1321,6 @@ function openwebrx_init() {
}
fft_codec = new ImaAdpcmCodec();
initProgressBars();
init_rx_photo();
open_websocket();
secondary_demod_init();
digimodes_init();