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

header is now collapsed by default; simpler javascript

Browse Source
This commit is contained in:
Jakob Ketterl 2020-05-10 16:07:14 +02:00
parent 59a7842c6d
commit a37e5ac93f
3 changed files with 9 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
htdocs/css/openwebrx-header.css
View File

@ -2,6 +2,7 @@
{ {
position: relative; position: relative;
z-index:1000; z-index:1000;
background-color: #575757;
} }
#webrx-top-photo #webrx-top-photo
@ -13,7 +14,8 @@
#webrx-top-photo-clip #webrx-top-photo-clip
{ {
min-height: 67px; min-height: 67px;
max-height: 350px; max-height: 67px;
height: 350px;
overflow: hidden; overflow: hidden;
position: relative; position: relative;
} }
@ -101,18 +103,15 @@
cursor:pointer; cursor:pointer;
position: absolute; position: absolute;
left: 470px; left: 470px;
top: 51px; top: 55px;
} }
#openwebrx-rx-details-arrow a #openwebrx-rx-details-arrow a
{ {
margin: 0; margin: 0;
padding: 0; padding: 0;
} line-height: 0;
display: block;
#openwebrx-rx-details-arrow-down
{
display:none;
} }
#openwebrx-main-buttons .button { #openwebrx-main-buttons .button {

2
htdocs/include/header.include.html
View File

@ -9,7 +9,7 @@
<div id="webrx-rx-desc" class="openwebrx-photo-trigger"></div> <div id="webrx-rx-desc" class="openwebrx-photo-trigger"></div>
</div> </div>
<div id="openwebrx-rx-details-arrow"> <div id="openwebrx-rx-details-arrow">
<a id="openwebrx-rx-details-arrow-up" class="openwebrx-photo-trigger"><img src="static/gfx/openwebrx-rx-details-arrow-up.png" /></a> <a id="openwebrx-rx-details-arrow-up" class="openwebrx-photo-trigger" style="display: none;"><img src="static/gfx/openwebrx-rx-details-arrow-up.png" /></a>
<a id="openwebrx-rx-details-arrow-down" class="openwebrx-photo-trigger"><img src="static/gfx/openwebrx-rx-details-arrow.png" /></a> <a id="openwebrx-rx-details-arrow-down" class="openwebrx-photo-trigger"><img src="static/gfx/openwebrx-rx-details-arrow.png" /></a>
</div> </div>
<section id="openwebrx-main-buttons"> <section id="openwebrx-main-buttons">

14
htdocs/lib/Header.js
View File

@ -17,10 +17,7 @@ Header.prototype.setDetails = function(details) {
}; };
Header.prototype.init_rx_photo = function() { Header.prototype.init_rx_photo = function() {
var clip = this.el.find("#webrx-top-photo-clip")[0]; this.rx_photo_state = 0;
this.rx_photo_height = clip.clientHeight;
clip.style.maxHeight = this.rx_photo_height + "px";
this.rx_photo_state = 1;
$.extend($.easing, { $.extend($.easing, {
easeOutCubic:function(x) { easeOutCubic:function(x) {
@ -28,13 +25,6 @@ Header.prototype.init_rx_photo = function() {
} }
}); });
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)); $('#webrx-top-container').find('.openwebrx-photo-trigger').click(this.toggle_rx_photo.bind(this));
}; };
@ -51,7 +41,7 @@ Header.prototype.open_rx_photo = function() {
this.rx_photo_state = 1; this.rx_photo_state = 1;
this.el.find("#webrx-rx-photo-desc").animate({opacity: 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-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('#webrx-top-photo-clip').animate({maxHeight: 350}, {duration: 1000, easing: 'easeOutCubic'});
this.el.find("#openwebrx-rx-details-arrow-down").hide(); this.el.find("#openwebrx-rx-details-arrow-down").hide();
this.el.find("#openwebrx-rx-details-arrow-up").show(); this.el.find("#openwebrx-rx-details-arrow-up").show();
} }