WebUI changes

This commit is contained in:
Paulchen Panther 2021-05-08 19:29:28 +02:00
parent 2cf72d37b6
commit a55a2620d7
6 changed files with 44 additions and 45 deletions

View File

@ -2,7 +2,20 @@
<div class="container-fluid">
<div class="row">
<div class="col-lg-12">
<h3 class="page-header"><i class="fa fa-camera fa-fw"></i><span data-i18n="main_menu_grabber_conf_token">Capturing Hardware</span></h3>
<h3 class="page-header"><i class="fa fa-camera fa-fw"></i><span data-i18n="main_menu_grabber_conf_token">Capturing Hardware</span></h3>
<div class="panel panel-default" style="border:0px;">
<div class="panel-heading panel-instance" style="border-radius:3px; border-bottom:0px;">
<div class="dropdown">
<a id="active_instance_dropdown" class="dropdown-toggle" data-toggle="dropdown" href="#" style="text-decoration:none;display:flex;align-items:center;">
<div id="active_instance_friendly_name"></div>
<div id="btn_hypinstanceswitch" style="white-space:nowrap;"><span class="mdi mdi-lightbulb-group mdi-24px" style="margin-right:0; margin-left:5px;"></span><span class="mdi mdi-menu-down mdi-24px"></span></div>
</a>
<ul id="hyp_inst_listing" class="dropdown-menu dropdown-alerts" style="cursor:pointer;"></ul>
</div>
</div>
</div>
<div id="conf_cont"></div>
</div>
</div>

View File

@ -16,34 +16,6 @@
<span id="dash_config_status">Status</span>
</div>
<div class="panel-body">
<table class="table borderless">
<thead>
<tr>
<th colspan="3">
<i class="mdi mdi-camera"></i>
<span data-i18n="main_menu_grabber_conf_token">Capturing Hardware</span>
</th>
</tr>
</thead>
<tbody>
<tr>
<td></td>
<td data-i18n="edt_conf_fg_heading_title">Screen-Grabber</td>
<td style="text-align: right; padding-right: 0">
<span id="dash_screen_grabber">disabled</span>
<a class="fa fa-cog fa-fw" onclick="SwitchToMenuItem('MenuItemGrabber', 'editor_container_screengrabber')" style="text-decoration: none; cursor: pointer"></a>
</td>
</tr>
<tr>
<td></td>
<td data-i18n="edt_conf_v4l2_heading_title">Video-Grabber</td>
<td style="text-align: right; padding-right: 0">
<span id="dash_video_grabber">disabled</span>
<a class="fa fa-cog fa-fw" onclick="SwitchToMenuItem('MenuItemGrabber', 'editor_container_videograbber')" style="text-decoration: none; cursor: pointer"></a>
</td>
</tr>
</tbody>
</table>
<table class="table borderless">
<thead>
<tr>

View File

@ -213,11 +213,11 @@
<a class="inactive"><i class="fa fa-cog fa-fw"></i><span data-i18n="main_menu_configuration_token">LED-Instances</span><span class="fa arrow"></span></a>
<ul class="nav nav-second-level">
<li> <a class="inactive mnava" id="MenuItemLeds" href="#conf_leds"><i class="mdi mdi-lightbulb-on fa-fw"></i><span data-i18n="main_menu_leds_conf_token">LED Hardware</span></a> </li>
<li> <a class="inactive mnava" id="MenuItemGrabber" href="#conf_grabber"><i class="fa fa-camera fa-fw"></i><span data-i18n="main_menu_grabber_conf_token">Capturing Hardware</span></a> </li>
<li> <a class="inactive mnava" href="#conf_effect"><i class="fa fa-spinner fa-fw"></i><span data-i18n="main_menu_effect_conf_token">Effects</span></a> </li>
<li> <a class="inactive mnava" href="#conf_colors"><i class="fa fa-photo fa-fw"></i><span data-i18n="main_menu_colors_conf_token">Image Processing</span></a> </li>
</ul>
</li>
<li> <a class="inactive mnava" id="MenuItemGrabber" href="#conf_grabber"><i class="fa fa-camera fa-fw"></i><span data-i18n="main_menu_grabber_conf_token">Capturing Hardware</span></a> </li>
<li> <a class="inactive mnava" id="MenuItemNetwork" href="#conf_network"><i class="fa fa-sitemap fa-fw"></i><span data-i18n="main_menu_network_conf_token">Network</span></a> </li>
<li> <a class="inactive mnava" href="#remote"><i class="fa fa-wifi fa-fw"></i><span data-i18n="main_menu_remotecontrol_token">Remote Control</span></a> </li>
<li> <a class="inactive mnava" href="#effects_configurator"><i class="fa fa-cogs fa-fw"></i><span data-i18n="main_menu_effectsconfigurator_token">Effects Configurator</span></a> </li>

View File

@ -26,6 +26,8 @@ $(document).ready(function () {
}
});
requestServerConfig();
var instBtn = '<span style="display:block; margin:3px"><input id="instanceButton"'
+ (hyperion_enabled ? "checked" : "") + ' type="checkbox" data-toggle="toggle" data-size="small" data-onstyle="success" data-on="'
+ $.i18n('general_btn_on') + '" data-off="'
@ -38,12 +40,23 @@ $(document).ready(function () {
instances_html += '<i class="fa fa-info-circle fa-fw"></i>';
instances_html += '<span>' + $.i18n('dashboard_infobox_label_title') + '</span>';
instances_html += '</th></tr></thead>';
instances_html += '<tbody><tr><td></td>';
instances_html += '<td>' + $.i18n('conf_leds_contr_label_contrtype') + '</td>';
instances_html += '<tbody>';
instances_html += '<tr><td></td><td>' + $.i18n('conf_leds_contr_label_contrtype') + '</td>';
instances_html += '<td style="text-align:right; padding-right:0">';
instances_html += '<span>' + window.serverConfig.device.type + ' </span>';
instances_html += '<span>' + window.serverConfig.device.type + '</span>';
instances_html += '<a class="fa fa-cog fa-fw" onclick="SwitchToMenuItem(\'MenuItemLeds\')" style="text-decoration:none;cursor:pointer"></a>';
instances_html += '</td></tr><tr></tbody></table>';
instances_html += '</td></tr>';
instances_html += '<tr><td></td><td>' + $.i18n('edt_conf_fg_heading_title') + '</td>';
instances_html += '<td style="text-align:right; padding-right:0">';
instances_html += '<span id="dash_screen_grabber">disabled</span>';
instances_html += '<a class="fa fa-cog fa-fw" onclick="SwitchToMenuItem(\'MenuItemGrabber\')" style="text-decoration:none;cursor:pointer"></a>';
instances_html += '</td></tr>';
instances_html += '<tr><td></td><td>' + $.i18n('edt_conf_v4l2_heading_title') + '</td>';
instances_html += '<td style="text-align:right; padding-right:0">';
instances_html += '<span id="dash_video_grabber">disabled</span>';
instances_html += '<a class="fa fa-cog fa-fw" onclick="SwitchToMenuItem(\'MenuItemGrabber\')" style="text-decoration:none;cursor:pointer"></a>';
instances_html += '</td></tr>';
instances_html += '</tbody></table>';
instances_html += '<table class="table first_cell_borderless">';
instances_html += '<thead><tr><th colspan="3">';
@ -100,11 +113,6 @@ $(document).ready(function () {
}
// add more info
var screenGrabber = window.serverConfig.instCapture.systemEnable ? $.i18n('general_enabled') : $.i18n('general_disabled');
$('#dash_screen_grabber').html(screenGrabber);
var videoGrabber = window.serverConfig.instCapture.v4lEnable ? $.i18n('general_enabled') : $.i18n('general_disabled');
$('#dash_video_grabber').html(videoGrabber);
var fbPort = window.serverConfig.flatbufServer.enable ? window.serverConfig.flatbufServer.port : $.i18n('general_disabled');
$('#dash_fbPort').html(fbPort);
var pbPort = window.serverConfig.protoServer.enable ? window.serverConfig.protoServer.port : $.i18n('general_disabled');

View File

@ -1,5 +1,9 @@
$(document).ready(function () {
performTranslation();
// update instance listing
updateHyperionInstanceListing();
var conf_editor_video = null;
var conf_editor_screen = null;
var conf_editor_instCapt = null;
@ -8,26 +12,26 @@ $(document).ready(function () {
if (window.showOptHelp) {
// Instance Capture
$('#conf_cont').append(createRow('conf_cont_instCapt'));
$('#conf_cont_instCapt').append(createOptPanel('fa-camera', $.i18n("edt_conf_instCapture_heading_title"), 'editor_container_instCapt', 'btn_submit_instCapt', 'panel-system'));
$('#conf_cont_instCapt').append(createOptPanel('fa-camera', $.i18n("edt_conf_instCapture_heading_title"), 'editor_container_instCapt', 'btn_submit_instCapt', ''));
$('#conf_cont_instCapt').append(createHelpTable(window.schema.instCapture.properties, $.i18n("edt_conf_instCapture_heading_title")));
// Screen-Grabber
$('#conf_cont').append(createRow('conf_cont_screen'));
$('#conf_cont_screen').append(createOptPanel('fa-camera', $.i18n("edt_conf_fg_heading_title"), 'editor_container_screengrabber', 'btn_submit_screengrabber', 'panel-system', 'screengrabberPanelId'));
$('#conf_cont_screen').append(createOptPanel('fa-camera', $.i18n("edt_conf_fg_heading_title"), 'editor_container_screengrabber', 'btn_submit_screengrabber', '', 'screengrabberPanelId'));
$('#conf_cont_screen').append(createHelpTable(window.schema.framegrabber.properties, $.i18n("edt_conf_fg_heading_title"), "screengrabberHelpPanelId"));
// Video-Grabber - hide if not available
if (VIDEOGRABBER_AVAIL) {
$('#conf_cont').append(createRow('conf_cont_video'));
$('#conf_cont_video').append(createOptPanel('fa-camera', $.i18n("edt_conf_v4l2_heading_title"), 'editor_container_videograbber', 'btn_submit_videograbber', 'panel-system', 'videograbberPanelId'));
$('#conf_cont_video').append(createOptPanel('fa-camera', $.i18n("edt_conf_v4l2_heading_title"), 'editor_container_videograbber', 'btn_submit_videograbber', '', 'videograbberPanelId'));
$('#conf_cont_video').append(createHelpTable(window.schema.grabberV4L2.properties, $.i18n("edt_conf_v4l2_heading_title"), "videograbberHelpPanelId"));
}
} else {
$('#conf_cont').addClass('row');
$('#conf_cont').append(createOptPanel('fa-camera', $.i18n("edt_conf_instCapture_heading_title"), 'editor_container_instCapt', 'btn_submit_instCapt', 'panel-system'));
$('#conf_cont').append(createOptPanel('fa-camera', $.i18n("edt_conf_fg_heading_title"), 'editor_container_screengrabber', 'btn_submit_screengrabber', 'panel-system', 'screengrabberPanelId'));
$('#conf_cont').append(createOptPanel('fa-camera', $.i18n("edt_conf_instCapture_heading_title"), 'editor_container_instCapt', 'btn_submit_instCapt'));
$('#conf_cont').append(createOptPanel('fa-camera', $.i18n("edt_conf_fg_heading_title"), 'editor_container_screengrabber', 'btn_submit_screengrabber', '', 'screengrabberPanelId'));
if (VIDEOGRABBER_AVAIL) {
$('#conf_cont').append(createOptPanel('fa-camera', $.i18n("edt_conf_v4l2_heading_title"), 'editor_container_videograbber', 'btn_submit_videograbber', 'panel-system', 'videograbberPanelId'));
$('#conf_cont').append(createOptPanel('fa-camera', $.i18n("edt_conf_v4l2_heading_title"), 'editor_container_videograbber', 'btn_submit_videograbber', '', 'videograbberPanelId'));
}
}

View File

@ -191,6 +191,8 @@ function initLanguageSelection() {
function updateUiOnInstance(inst) {
$("#active_instance_friendly_name").text(window.serverInfo.instance[inst].friendly_name);
$('#dash_screen_grabber').text(window.serverConfig.instCapture.systemEnable ? $.i18n('general_enabled') : $.i18n('general_disabled'));
$('#dash_video_grabber').text(window.serverConfig.instCapture.v4lEnable ? $.i18n('general_enabled') : $.i18n('general_disabled'));
if (window.serverInfo.instance.filter(entry => entry.running).length > 1) {
$('#btn_hypinstanceswitch').toggle(true);
$('#active_instance_dropdown').prop('disabled', false);