syndilights/open-lighting-architecture/ola-0.8.4/olad/www/ola.html

754 lines
20 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<link rel='stylesheet' href='/custombutton.css'>
<link rel='stylesheet' href='/toolbar.css'>
<script src='/ola.js'></script>
<title>OLA Admin</title>
<style type='text/css'>
body {
margin: 0px;
padding: 0px;
font-family: sans-serif;
font-size: 13px;
}
table {
font-family: sans-serif;
font-size: 13px;
padding: 0px;
margin: 0px;
border: 0px;
border-spacing: 0px;
}
legend { font-weight: bold; }
input { border: #e4e9fe 1px solid; }
fieldset {
border: #67a7e3 1px solid;
margin-bottom: 5px;
}
pre {
margin: 0px;
}
#header {
margin: 0px;
padding: 0px;
left: 0px;
text-align: left;
font-size: 11px;
}
#right_nav {
position: absolute;
right: 0px;
margin-right: 4px;
text-align: right;
}
#footer {
padding-top: 5px;
text-align: center;
clear: both;
font-size: 11px;
}
.goog-control {
cursor: pointer;
outline: none;
}
.goog-inline-block {
position: relative;
display: -moz-inline-box; /* Ignored by FF3 and later. */
display: inline-block;
}
.ola-scroller {
width: 100%;
height: 100%;
overflow: auto;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
-ms-box-sizing: border-box;
padding: 5px;
}
/* Log window css */
.log_popup {
position: absolute;
visibility: hidden;
font-size: 80%;
-moz-outline: 0;
outline: 0;
z-index: 100;
}
.logdiv {
position: relative;
width: 100%;
height: 100%;
overflow: scroll;
overflow-x: hidden;
overflow-y: scroll;
}
/* CSS for the dialog box */
.modal-dialog {
width: 430px;
z-index: 101;
background: #c1d9ff;
border: 1px solid #3a5774;
padding: 4px;
position: absolute;
}
.modal-dialog-bg {
background: #666;
left: 0;
position: absolute;
top: 0;
}
.modal-dialog-title {
background: #e0edfe;
font-size: 120%;
font-weight: bold;
padding: 8px 15px 8px 8px;
position: relative;
_zoom: 1; /* Ensures proper width in IE6 RTL. */
}
.modal-dialog-buttons,
.modal-dialog-content {
background-color: #fff;
padding: 8px;
}
/* Generic split pane styles */
/* NOTE: A bug in Safari 3 requires these css definitions to be in here.
Do not move these to a seperate file without testing safari 3! */
.goog-splitpane {
width: 100%;
}
.goog-splitpane-handle-horizontal {
cursor: col-resize;
}
/* CSS for the main split pane */
.ola-splitpane-handle {
border-left: 2px solid #67a7e3;
border-right: 2px solid #67a7e3;
position: absolute;
}
.ola-splitpane-navigation {
font-size: 13px;
overflow: auto;
position: absolute;
white-space: nowrap;
}
.ola-splitpane-content {
border-top: 4px solid #67a7e3;
border-bottom: 4px solid #67a7e3;
border-right: 4px solid #67a7e3;
position: absolute;
overflow: hidden;
}
/* CSS for the navigation pane */
.ola-splitpane-navigation .goog-control {
padding: 2px 0px 2px 5px;
color: #0066cc;
background-color: #fff;
}
.ola-splitpane-navigation .goog-control-hover {
background-color: #b3d3f7;
}
.ola-splitpane-navigation .goog-container {
padding: 2px;
}
.ola-splitpane-navigation .goog-container .goog-control {
overflow: hidden;
padding-left: 17px;
}
.goog-zippy-expanded img {
background-image: url('/expander.png');
background-position: 0px 0px;
}
.goog-zippy-collapsed img {
background-image: url('/expander.png');
background-position: -40px 0px;
}
.goog-zippy-expanded { cursor: pointer; }
.goog-zippy-collapsed { cursor: pointer; }
.ola-splitpane-navigation img {
width: 12px;
height: 12px;
padding-right: 5px;
}
/* CSS for the tabs */
.goog-tabpane {
position: relative;
margin-left: 2px;
}
.goog-tabpane-tabs {
outline: none;
list-style: none;
margin: 0px;
padding: 0px;
position: relative;
}
.goog-tabpane-tab, .goog-tabpane-tab-selected {
display: block;
background: #e3e9ff;
border-right: 1px solid #67a7e3;
margin: 0px;
padding: 5px 10px;
float: left;
cursor: pointer;
}
.goog-tabpane-tab-selected {
background: #bbccff;
}
.goog-tabpane-cont {
border-top: #67a7e3 1px solid;
}
/* CSS for the RDM split pane */
.ola-splitpane-rdm {
border-top: 1px solid #67a7e3;
}
.ola-splitpane-rdm-handle {
border-left: 2px solid #67a7e3;
border-right: 2px solid #67a7e3;
position: absolute;
}
.ola-splitpane-rdm-uids {
overflow: auto;
}
.ola-splitpane-rdm-uids .goog-container {
outline: none;
}
.ola-splitpane-rdm-uids .goog-container .goog-control {
padding-left: 4px;
white-space: nowrap;
}
/* Tables are used in various frames */
.ola-table {
width: 100%;
border-bottom: 1px solid #e4e9fe;
}
.ola-table thead {
text-align: left;
}
.ola-table td {
border-top: 1px solid #e4e9fe;
}
/* Checkboxes are used in various frames */
.goog-checkbox {
border: 1px solid #1C5180;
cursor: pointer;
display: -moz-inline-box;
display: inline-block;
font-size: 1px; /* Fixes the height in IE6 */
height: 11px;
margin: 0 4px 0 1px;
vertical-align: text-bottom;
width: 11px;
outline: none;
}
.goog-checkbox-checked {
background: #fff url('/tick.gif') no-repeat 2px center;
}
.goog-checkbox-undetermined {
background: #bbb url('/tick.gif') no-repeat 2px center;
}
.goog-checkbox-unchecked {
background: #fff;
}
.goog-checkbox-disabled {
border: 1px solid lightgray;
cursor: default !important;
background-position: -7px;
}
/* menus are used in the main frame */
.goog-menu-button {
background: #ddd url(/button-bg.png) repeat-x top left;
border: 0;
color: #000;
cursor: pointer;
list-style: none;
margin: 2px;
outline: none;
padding: 0;
text-decoration: none;
vertical-align: middle;
font-size: 11px;
}
/* Pseudo-rounded corners. */
.goog-menu-button-outer-box,
.goog-menu-button-inner-box {
border-style: solid;
border-color: #aaa;
vertical-align: top;
}
.goog-menu-button-outer-box {
margin: 0;
border-width: 1px 0;
padding: 0;
}
.goog-menu-button-inner-box {
margin: 0 -1px;
border-width: 0 1px;
padding: 3px 4px;
}
/* Pre-IE7 IE hack; ignored by IE7 and all non-IE browsers. */
* html .goog-menu-button-inner-box {
/* IE6 needs to have the box shifted to make the borders line up. */
left: -1px;
}
/* Pre-IE7 BiDi fixes. */
* html .goog-menu-button-rtl .goog-menu-button-outer-box {
/* @noflip */ left: -1px;
/* @noflip */ right: auto;
}
* html .goog-menu-button-rtl .goog-menu-button-inner-box {
/* @noflip */ right: auto;
}
/* IE7-only hack; ignored by all other browsers. */
*:first-child+html .goog-menu-button-inner-box {
/* IE7 needs to have the box shifted to make the borders line up. */
left: -1px;
}
/* IE7 BiDi fix. */
*:first-child+html .goog-menu-button-rtl .goog-menu-button-inner-box {
/* @noflip */ left: 1px;
/* @noflip */ right: auto;
}
/* Safari-only hacks. */
::root .goog-menu-button,
::root .goog-menu-button-outer-box,
::root .goog-menu-button-inner-box {
/* Required to make pseudo-rounded corners work on Safari. */
line-height: 0;
}
::root .goog-menu-button-caption,
::root .goog-menu-button-dropdown {
/* Required to make pseudo-rounded corners work on Safari. */
line-height: normal;
}
/* State: hover. */
.goog-menu-button-hover .goog-menu-button-outer-box,
.goog-menu-button-hover .goog-menu-button-inner-box {
border-color: #9cf #69e #69e #7af !important; /* Hover border wins. */
}
/* State: active, open. */
.goog-menu-button-active,
.goog-menu-button-open {
background-color: #bbb;
background-position: bottom left;
}
/* State: focused. */
.goog-menu-button-focused .goog-menu-button-outer-box,
.goog-menu-button-focused .goog-menu-button-inner-box {
border-color: orange;
}
.goog-menu-button-caption {
padding: 0 4px 0 0;
vertical-align: top;
}
.goog-menu-button-dropdown {
height: 13px;
width: 7px;
background: url(/expander.png) no-repeat -73px 0;
vertical-align: top;
}
.goog-menu {
background: #fff;
border-color: #ccc #666 #666 #ccc;
border-style: solid;
border-width: 1px;
cursor: default;
font: normal 11px Arial, sans-serif;
margin: 0;
outline: none;
padding: 4px 0;
position: absolute;
z-index: 20000;
}
.goog-menuitem {
color: #000;
list-style: none;
margin: 0;
padding: 4px 7em 4px 10px;
white-space: nowrap;
}
.goog-menuitem-content {
color: #000;
}
.goog-menuitem-highlight,
.goog-menuitem-hover {
background-color: #d6e9f8;
/* Use an explicit top and bottom border so that the selection is visible
* in high contrast mode. */
border-color: #d6e9f8;
border-style: dotted;
border-width: 1px 0;
padding-bottom: 3px;
padding-top: 3px;
}
/* slider styles */
.goog-slider-vertical {
background-image: url('/vertical.gif');
position: relative;
overflow: hidden;
outline: none;
width: 23px;
height: 200px;
}
.goog-slider-thumb {
position: absolute;
background-image: url('/handle.vertical.png');
overflow: hidden;
}
.goog-slider-vertical .goog-slider-thumb {
left: 4px;
height: 31px;
width: 15px;
}
/* styles for the dmx console */
#console_table {
border: 1px solid #67a7e3;
float:left;
}
#console_value_row td {
border-top: #67a7e3 solid 1px;
font-size: 11px;
text-align: center;
}
#console_channel_row td {
font-size: 11px;
text-align: center;
}
#channel_values {
overflow-y: auto;
}
#channel_values div {
display: inline-block;
font-size: 11px;
border-bottom: 1px solid #67a7e3;
border-right: 1px solid #67a7e3;
width: 20px;
text-align: center;
margin: 1px;
}
</style>
</head>
<body onload='ola.Setup()'>
<div id='header'>
<div id='right_nav'><span id='log_control'>View Log</span></div>
<div id='title'>
<img src='/logo.png' width='111' height='48' alt='Logo'>
</div>
</div>
<div id='log_popup' class='log_popup'>
<div id='log' style='border: 1px solid #000000'></div>
</div>
<div class='goog-splitpane' id='split_pane' style='visibility: hidden'>
<div class='goog-splitpane-handle ola-splitpane-handle'></div>
<div class='goog-splitpane-first-container ola-splitpane-navigation'>
<div id='home_control' class='goog-control'
title='Main page'>
<img src='/blank.gif'>Home
</div>
<div id='universe_list_control' class='goog-control'
title='Click to show/hide active universes'>
<img src='/blank.gif'>Universes
</div>
<div id='universe_container' class='goog-container'></div>
<div id='plugin_list_control' class='goog-control'
title='Click to show/hide plugins'>
<img src='/blank.gif'>Plugins
</div>
<div id='plugin_container' class='goog-container'></div>
</div>
<div class='goog-splitpane-second-container ola-splitpane-content'
id='ola-splitpane-content'>
<div class='ola-scroller' id='home_frame' style=''>
<fieldset>
<legend>Active Universes</legend>
<table class='ola-table'>
<thead>
<tr>
<th>Universe #</th>
<th>Universe Name</th>
<th>Input Ports</th>
<th>Output Ports</th>
<th>RDM Devices</th>
</tr>
</thead>
<tbody id='active_universe_list'>
</tbody>
</table>
</fieldset>
<div style='text-align: center'>
<div id='new_universe_button'
class='goog-custom-button goog-inline-block'
title='Setup a new universe'>Add Universe</div>
</div>
<fieldset>
<legend>Server Info</legend>
<table>
<tr>
<td>Hostname</td>
<td><div id='server_hostname'></div></td>
</tr>
<tr>
<td>Primary IP</td>
<td><div id='server_ip'></div></td>
</tr>
<tr>
<td style='padding-right: 10px'>Primary Broadcast Address</td>
<td><div id='server_broadcast'></div></td>
</tr>
<tr>
<td>Primary MAC Address</td>
<td><div id='server_mac'></div></td>
</tr>
<tr>
<td>Version</td><td><div id='server_version'></div></td>
</tr>
<tr>
<td>Started</td><td><div id='server_uptime'></div></td>
</tr>
</table>
</fieldset>
<div style='text-align: center'>
<div id='reload_button' class='goog-custom-button goog-inline-block'
title='Reload all plugins'>
Reload Plugins
</div>
<div id='stop_button' class='goog-custom-button goog-inline-block'
title='Stop OLA'>Stop OLA</div>
</div>
<br>
</div>
<div id='new_universe_frame' class='ola-scroller'>
<fieldset>
<legend>New Universe Settings</legend>
<table>
<tr>
<td>Universe Id</td>
<td><input id='new_universe_id' maxlength='200'></td>
</tr>
<tr>
<td>Universe Name</td><td><input id='new_universe_name'></td>
</tr>
</table>
</fieldset>
<fieldset>
<legend>Available Ports</legend>
<table class='ola-table'>
<thead>
<tr>
<th>&nbsp;</th>
<th>Device</th>
<th>Direction</th>
<th>Description</th>
</tr>
</thead>
<tbody id='available_ports'>
</tbody>
</table>
</fieldset>
<div style='text-align: center'>
<div id='cancel_new_universe_button'
class='goog-custom-button goog-inline-block'
title='Go back'>Cancel</div>
<div id='confirm_new_universe_button'
class='goog-custom-button goog-inline-block'
title='Setup a new universe'>Add Universe</div>
</div>
</div>
<div id='universe_frame'>
<div id='universe_frame_tab_pane'></div>
<div id='tab_page_1' class='ola-scroller'>
<fieldset>
<legend>Universe Settings</legend>
<table>
<tr>
<td>Universe Id</td><td><div id='universe_id'></div></td>
</tr>
<tr>
<td>Universe Name</td>
<td><input id='universe_name' maxlength='200'></td>
</tr>
<tr>
<td>Merge Mode</td>
<td>
<div id='universe_merge_mode' class='goog-select'>
<ul class='goog-menu'>
<li class='goog-menuitem'>HTP</li>
<li class='goog-menuitem'>LTP</li>
</ul>
</div>
</td>
</tr>
</table>
</fieldset>
<fieldset>
<legend>Input Ports</legend>
<table class='ola-table'>
<thead>
<tr>
<th width='30px'>&nbsp;</th>
<th width='40%'>Device</th>
<th width='30%'>Description</th>
<th width='30%'>Priority</th>
</tr>
</thead>
<tbody id='input_ports'>
</tbody>
</table>
</fieldset>
<fieldset>
<legend>Output Ports</legend>
<table class='ola-table'>
<thead>
<tr>
<th width='30px'>&nbsp;</th>
<th width='40%'>Device</th>
<th width='30%'>Description</th>
<th width='30%'>Priority</th>
</tr>
</thead>
<tbody id='output_ports'>
</tbody>
</table>
</fieldset>
<fieldset>
<legend id='additional_ports_expander'>
<img style='width: 12px; height: 12px' src='/blank.gif'>
Add Additional Ports</legend>
<table class='ola-table' id='additional_ports'>
<thead>
<tr>
<th>&nbsp;</th>
<th>Device</th>
<th>Direction</th>
<th>Description</th>
</tr>
</thead>
<tbody id='universe_available_ports'>
</tbody>
</table>
</fieldset>
<div style='text-align: center'>
<div id='universe_save_button'
class='goog-custom-button goog-inline-block'
title='Save Changes'>Save</div>
</div>
<br/>
</div>
<div id='tab_page_2'>
<div>
<div id='force_discovery_button'
class='goog-custom-button goog-inline-block'
title='Run RDM Discovery'>Run RDM Discovery</div>
</div>
<div class='goog-splitpane ola-splitpane-rdm' id='rdm_split_pane'>
<div class='goog-splitpane-first-container
ola-splitpane-rdm-uids'>
<div id='uid_container' class='goog-container'></div>
</div>
<div class='goog-splitpane-second-container
ola-splitpane-rdm-device'>
<div id='rdm_attributes' class='ola-scroller'>
</div>
</div>
<div class='goog-splitpane-handle ola-splitpane-rdm-handle'></div>
</div>
</div>
<div id='tab_page_3' class='ola-scroller'>
<div id='console_toolbar' class='goog-toolbar'></div>
<table cellspacing='0' cellpadding='0' id='console_table'>
<tbody>
<tr id='console_channel_row'></tr>
<tr id='console_value_row'></tr>
<tr id='console_slider_row'></tr>
</tbody>
</table>
<div id='channel_values'></div>
</div>
</div>
<div class='ola-scroller' id='plugin_frame'>
<pre id='plugin_description'></pre>
</div>
</div>
</div>
<div id='footer'>
OLA &copy; 2005-2010 Simon Newton
</div>
</body>
</html>