mirror of
				https://github.com/hyperion-project/hyperion.ng.git
				synced 2025-03-01 10:33:28 +00:00 
			
		
		
		
	WebUI changes
This commit is contained in:
		| @@ -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> | ||||
|   | ||||
| @@ -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> | ||||
|   | ||||
| @@ -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> | ||||
|   | ||||
| @@ -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'); | ||||
|   | ||||
| @@ -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')); | ||||
|     } | ||||
|   } | ||||
|  | ||||
|   | ||||
| @@ -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); | ||||
|   | ||||
		Reference in New Issue
	
	Block a user