1
0
Fork 0
fgdata/Phi/topics/Simulator/Properties.html
Torsten Dreyer 190e8449ce Phi: move URL to the browsers root directory
- rename the directory from webgui to Phi
- let the webserver's root point to Phi instead of Docs
- redirect old /gui/ url to the new location (/)
2015-04-18 13:03:46 +02:00

96 lines
3 KiB
HTML

<style>
.pointer-icon {
cursor: pointer;
}
.property-list {
list-style-type: none;
list-style-image: none;
padding-left: 26px;
}
.property-name {
width: 12em;
display: inline-block;
}
.property-value {
padding: 0 0.2em;
min-width: 8em;
display: inline-block;
text-align: right;
}
</style>
<div class="ui-widget ui-widget-content ui-corner-all" data-bind="visible: hasGraphItems" style="padding-bottom: 1ex; margin-bottom: 1ex;">
<div class="ui-widget-header">Property Graph</div>
<div style="height: 300px; width: 100%"
data-bind="flotchart: { data: flotData, options: flotOptions, hover: graphHover }"></div>
<div class="ui-dialog-buttonpane ui-widget-content ui-helper-clearfix">
<div style="display: inline; float: left">
<div data-bind="button: { icons: { primary : 'ui-icon-gear' }, text: true, label: 'Settings' }, click: settings"></div>
<div data-bind="button: { icons: startIcons, text: true, label: startLabel }, click: startPause "></div>
</div>
</div>
</div>
<div class=" ui-widget
ui-widget-contentui-corner-all">
<div class="ui-widget-header">Property Tree</div>
<div data-bind="template: { name: 'propertytree-template', data: properties }"></div>
</div>
<script type="text/html" id="propertytree-template">
<ul class="property-list" data-bind="foreach: $data">
<li>
<span class="ui-icon pointer-icon" style="display: inline-block;"
data-bind="
css: {
'ui-icon-triangle-1-e': hasChildren,
'ui-icon-triangle-1-se': isExpanded,
'ui-icon-refresh': hasValue,
'ui-icon-blank': !(hasValue||hasChildren),
},
attr: {
title: hasValue ? 'refresh' : 'expand/collapse',
},
click: toggle,
"></span>
<span class="property-name"
data-bind="
text: indexedName,
css: {
'pointer-icon': hasChildren,
},
click: toggle,
"></span>
<span class="ui-icon ui-icon-blank" style="display: inline-block;"
data-bind="
css: {
'ui-icon-image': isPlottable,
'pointer-icon': hasValue,
},
attr: {
title: hasValue ? 'toggle plot' : '',
},
click: togglePlot,
"></span>
<span class="property-value ui-state-hover pointer-icon ui-corner-all"
data-bind="
text: value,
visible: hasValue,
click: valueEdit,
"></span>
<div data-bind="
template: {
name: 'propertytree-template',
data: children
},
visible: isExpanded
"></div>
</li>
</ul>
</script>
<script type="text/html" id="inplace-editor-template">
<input style="width: 8em" >
</script>