add bookmarks display

This commit is contained in:
Jakob Ketterl 2019-09-28 01:57:34 +02:00
parent cc98c94b2b
commit 020445743c
3 changed files with 230 additions and 159 deletions

View File

@ -160,6 +160,51 @@ input[type=range]:focus::-ms-fill-upper
position: relative;
}
#openwebrx-bookmarks-container
{
height: 25px;
background-color: #444;
overflow: hidden;
position: relative;
}
#openwebrx-bookmarks-container .bookmark-locator {
display: inline-block;
position: absolute;
bottom: 0;
}
#openwebrx-bookmarks-container .bookmark {
font-size: 10pt;
background-color: #FFFF00;
border: 1px solid #000;
border-radius: 5px;
padding: 2px 5px;
cursor: pointer;
position: absolute;
bottom: 5px;
transform: translate(-50%, 0);
}
#openwebrx-bookmarks-container .bookmark:hover {
z-index: 11;
}
#openwebrx-bookmarks-container .bookmark:after {
content: '';
position: absolute;
bottom: 0;
left: 50%;
width: 0;
height: 0;
border: 5px solid transparent;
border-top-color: #FFFF00;
border-bottom: 0;
margin-left: -5px;
margin-bottom: -5px;
}
#webrx-canvas-container
{
/*background-image:url('../gfx/openwebrx-blank-background-1.jpg');*/

View File

@ -35,6 +35,7 @@
<div id="webrx-page-container">
${header}
<div id="webrx-main-container">
<div id="openwebrx-bookmarks-container"></div>
<div id="openwebrx-scale-container">
<canvas id="openwebrx-scale-canvas" width="0" height="0"></canvas>
</div>

View File

@ -904,6 +904,7 @@ function resize_scale()
scale_ctx.canvas.width = window.innerWidth;
scale_ctx.canvas.height = 47;
mkscale();
position_bookmarks();
}
function canvas_mouseover(evt)
@ -992,6 +993,7 @@ function canvas_mousemove(evt)
canvas_drag_last_x=evt.pageX;
canvas_drag_last_y=evt.pageY;
mkscale();
position_bookmarks();
}
}
else e("webrx-mouse-freq").innerHTML=format_frequency("{x} MHz",canvas_get_frequency(relativeX),1e6,4);
@ -1092,6 +1094,7 @@ function zoom_step(out, where, onscreen)
//console.log(zoom_center_where, zoom_center_rel, where);
resize_canvases(true);
mkscale();
position_bookmarks();
}
function zoom_set(level)
@ -1105,6 +1108,7 @@ function zoom_set(level)
console.log(zoom_center_where, zoom_center_rel, -canvases[0].offsetLeft+canvas_container.clientWidth/2);
resize_canvases(true);
mkscale();
position_bookmarks();
}
function zoom_calc()
@ -1256,6 +1260,9 @@ function on_ws_recv(evt)
case "aprs_data":
update_packet_panel(json.value);
break;
case "bookmarks":
update_bookmarks(json.value);
break;
default:
console.warn('received message of unknown type: ' + json.type);
}
@ -1321,6 +1328,24 @@ function on_ws_recv(evt)
}
}
function update_bookmarks(bookmarks) {
$container = $('#openwebrx-bookmarks-container');
$container.empty();
bookmarks.forEach(function(b){
$bookmark = $('<div class="bookmark-locator"><div class="bookmark">' + b.name + '</div></div>');
$bookmark.data(b);
$container.append($bookmark);
});
position_bookmarks();
}
function position_bookmarks() {
range = get_visible_freq_range();
$('#openwebrx-bookmarks-container .bookmark-locator').each(function(){
$(this).css('left', scale_px_from_freq($(this).data('frequency'), range));
});
}
var dial_frequencies = [];
function find_dial_frequencies() {