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

nicer user display panel for YSF, too

This commit is contained in:
Jakob Ketterl 2019-06-09 17:39:15 +02:00
parent 2010a38411
commit 761ca1132d
3 changed files with 65 additions and 46 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

39
htdocs/index.html
View File

@ -168,23 +168,32 @@
</div> </div>
</div> </div>
</div> </div>
<div class="openwebrx-panel" id="openwebrx-panel-metadata" data-panel-name="metadata" data-panel-pos="left" data-panel-order="1" data-panel-size="615,36"> <div class="openwebrx-panel openwebrx-meta-panel" id="openwebrx-panel-metadata-ysf" data-panel-name="metadata-ysf" data-panel-pos="left" data-panel-order="2" data-panel-size="155,220">
</div> <div class="openwebrx-meta-frame">
<div class="openwebrx-panel" id="openwebrx-panel-metadata-dmr" data-panel-name="metadata-dmr" data-panel-pos="left" data-panel-order="2" data-panel-size="300,220"> <div class="openwebrx-meta-slot">
<div class="openwebrx-dmr-panel"> <div class="openwebrx-ysf-mode openwebrx-meta-autoclear"></div>
<div class="openwebrx-dmr-timeslot-panel"> <div class="openwebrx-meta-user-image"></div>
<div>Timeslot 1</div> <div class="openwebrx-ysf-source openwebrx-meta-autoclear"></div>
<div class="openwebrx-dmr-user-image"></div> <div class="openwebrx-ysf-up openwebrx-meta-autoclear"></div>
<div class="openwebrx-dmr-id"></div> <div class="openwebrx-ysf-down openwebrx-meta-autoclear"></div>
<div class="openwebrx-dmr-name"></div>
<div class="openwebrx-dmr-talkgroup"></div>
</div> </div>
<div class="openwebrx-dmr-timeslot-panel"> </div>
</div>
<div class="openwebrx-panel openwebrx-meta-panel" id="openwebrx-panel-metadata-dmr" data-panel-name="metadata-dmr" data-panel-pos="left" data-panel-order="2" data-panel-size="300,220">
<div class="openwebrx-meta-frame">
<div class="openwebrx-meta-slot openwebrx-dmr-timeslot-panel">
<div>Timeslot 1</div>
<div class="openwebrx-meta-user-image"></div>
<div class="openwebrx-dmr-id openwebrx-meta-autoclear"></div>
<div class="openwebrx-dmr-name openwebrx-meta-autoclear"></div>
<div class="openwebrx-dmr-target openwebrx-meta-autoclear"></div>
</div>
<div class="openwebrx-meta-slot openwebrx-dmr-timeslot-panel">
<div>Timeslot 2</div> <div>Timeslot 2</div>
<div class="openwebrx-dmr-user-image"></div> <div class="openwebrx-meta-user-image"></div>
<div class="openwebrx-dmr-id"></div> <div class="openwebrx-dmr-id openwebrx-meta-autoclear"></div>
<div class="openwebrx-dmr-name"></div> <div class="openwebrx-dmr-name openwebrx-meta-autoclear"></div>
<div class="openwebrx-dmr-talkgroup"></div> <div class="openwebrx-dmr-target openwebrx-meta-autoclear"></div>
</div> </div>
</div> </div>
</div> </div>

14
htdocs/openwebrx.css
View File

@ -928,12 +928,12 @@ img.openwebrx-mirror-img
border-color: Red; border-color: Red;
} }
#openwebrx-panel-metadata-dmr { .openwebrx-meta-panel {
background: none; background: none;
padding: 0; padding: 0;
} }
.openwebrx-dmr-panel { .openwebrx-meta-frame {
height: 200px; height: 200px;
outline: 1px solid #111; outline: 1px solid #111;
@ -942,7 +942,7 @@ img.openwebrx-mirror-img
background: #333; background: #333;
} }
.openwebrx-dmr-timeslot-panel { .openwebrx-meta-slot {
width: 133px; width: 133px;
height: 194px; height: 194px;
float: left; float: left;
@ -959,20 +959,20 @@ img.openwebrx-mirror-img
border-radius: 2px; border-radius: 2px;
} }
.openwebrx-dmr-timeslot-panel.active { .openwebrx-meta-slot.active {
background-color: #95bbdf; background-color: #95bbdf;
} }
.openwebrx-dmr-timeslot-panel:last-child { .openwebrx-meta-slot:last-child {
margin-right: 0; margin-right: 0;
} }
.openwebrx-dmr-timeslot-panel.active .openwebrx-dmr-user-image { .openwebrx-meta-slot.active .openwebrx-meta-user-image {
background-image: url("gfx/openwebrx-user.png"); background-image: url("gfx/openwebrx-user.png");
width:133px; width:133px;
height:133px; height:133px;
} }
.openwebrx-dmr-timeslot-panel { .openwebrx-meta-slot {
text-align: center; text-align: center;
} }

58
htdocs/openwebrx.js
View File

@ -620,9 +620,7 @@ function demodulator_analog_replace(subtype, for_digital)
demodulator_add(new demodulator_default_analog(temp_offset,subtype)); demodulator_add(new demodulator_default_analog(temp_offset,subtype));
demodulator_buttons_update(); demodulator_buttons_update();
clear_metadata(); clear_metadata();
if (subtype == "dmr") { toggle_panel("openwebrx-panel-metadata-" + subtype, true);
toggle_panel("openwebrx-panel-metadata-dmr", true);
}
} }
function demodulator_set_offset_frequency(which,to_what) function demodulator_set_offset_frequency(which,to_what)
@ -1313,51 +1311,62 @@ function on_ws_recv(evt)
} }
function update_metadata(meta) { function update_metadata(meta) {
var update = function(_, el) {
el.innerHTML = "";
};
if (meta.protocol) switch (meta.protocol) { if (meta.protocol) switch (meta.protocol) {
case 'DMR': case 'DMR':
if (meta.slot) { if (meta.slot) {
el = $(".openwebrx-dmr-panel .openwebrx-dmr-timeslot-panel").get(meta.slot); var el = $("#openwebrx-panel-metadata-dmr .openwebrx-dmr-timeslot-panel").get(meta.slot);
var id = ""; var id = "";
var name = ""; var name = "";
var talkgroup = ""; var target = "";
if (meta.type && meta.type != "data") { if (meta.type && meta.type != "data") {
id = (meta.additional && meta.additional.callsign) || meta.source || ""; id = (meta.additional && meta.additional.callsign) || meta.source || "";
name = (meta.additional && meta.additional.fname) || ""; name = (meta.additional && meta.additional.fname) || "";
talkgroup = meta.target || ""; if (meta.type == "group") target = "Talkgroup: ";
if (meta.type == "direct") tareget = "Direct: ";
target += meta.target || "";
$(el).addClass("active"); $(el).addClass("active");
} else { } else {
$(el).removeClass("active"); $(el).removeClass("active");
} }
$(el).find(".openwebrx-dmr-id").text(id); $(el).find(".openwebrx-dmr-id").text(id);
$(el).find(".openwebrx-dmr-name").text(name); $(el).find(".openwebrx-dmr-name").text(name);
$(el).find(".openwebrx-dmr-talkgroup").text(talkgroup); $(el).find(".openwebrx-dmr-target").text(target);
} }
break; break;
case 'YSF': case 'YSF':
var strings = []; var el = $("#openwebrx-panel-metadata-ysf");
if (meta.mode) strings.push("Mode: " + meta.mode);
if (meta.source) strings.push("Source: " + meta.source); var mode = " "
if (meta.target) strings.push("Destination: " + meta.target); var source = "";
if (meta.up) strings.push("Up: " + meta.up); var up = "";
if (meta.down) strings.push("Down: " + meta.down); var down = "";
var html = strings.join(' '); if (meta.mode && meta.mode != "") {
update = function(_, el) { mode = "Mode: " + meta.mode;
el.innerHTML = html; source = meta.source || "";
up = meta.up ? "Up: " + meta.up : "";
down = meta.down ? "Down: " + meta.down : "";
$(el).find(".openwebrx-meta-slot").addClass("active");
} else {
$(el).find(".openwebrx-meta-slot").removeClass("active");
} }
$('.openwebrx-panel[data-panel-name="metadata"]').each(update); $(el).find(".openwebrx-ysf-mode").text(mode);
toggle_panel("openwebrx-panel-metadata", true); $(el).find(".openwebrx-ysf-source").text(source);
$(el).find(".openwebrx-ysf-up").text(up);
$(el).find(".openwebrx-ysf-down").text(down);
break; break;
} }
} }
function clear_metadata() { function clear_metadata() {
toggle_panel("openwebrx-panel-metadata", false); $(".openwebrx-meta-panel").each(function(_, p){
toggle_panel("openwebrx-panel-metadata-dmr", false); toggle_panel(p.id, false);
});
$(".openwebrx-meta-panel .openwebrx-meta-autoclear").text("");
$(".openwebrx-meta-panel .active").removeClass("active");
} }
function add_problem(what) function add_problem(what)
@ -2407,6 +2416,7 @@ function pop_bottommost_panel(from)
function toggle_panel(what, on) function toggle_panel(what, on)
{ {
var item=e(what); var item=e(what);
if (!item) return;
if(typeof on !== "undefined") if(typeof on !== "undefined")
{ {
if(item.openwebrxHidden && !on) return; if(item.openwebrxHidden && !on) return;
@ -2470,7 +2480,7 @@ function place_panels(function_apply)
for(i=0;i<plist.length;i++) for(i=0;i<plist.length;i++)
{ {
c=plist[i]; c=plist[i];
if(c.className=="openwebrx-panel") if(c.className.indexOf("openwebrx-panel") >= 0)
{ {
if(c.openwebrxHidden) if(c.openwebrxHidden)
{ {