119 lines
6.8 KiB
Django/Jinja
119 lines
6.8 KiB
Django/Jinja
<h4>{{ _('Control') }}</h4>
|
|
|
|
<div style="min-height:15px; margin: 16px 16px; border:1px solid #00e500" id="base" data-bind="contextMenu: { menuSelector: '#controlContextMenu', menuSelected: $root.controlContextMenu }, visible: loginState.isUser">
|
|
</div>
|
|
|
|
<div style="clear: both; display: none;" id="customControls" data-bind="visible: loginState.isUser, template: { name: $root.displayMode, foreach: controls }"></div>
|
|
|
|
<ul id="controlContextMenu" class="dropdown-menu" role="menu" style="display:block;position:fixed !important;margin-bottom:5px;">
|
|
<li>
|
|
<a href="#" cmd="createContainer">{{ _('Create Container') }}</a>
|
|
</li>
|
|
</ul>
|
|
<ul id="commandContextMenu" class="dropdown-menu" role="menu" style="display:block;position:fixed !important;margin-bottom:5px;">
|
|
<li><a href="#" cmd="editElement">{{ _('Edit') }}</a></li>
|
|
<li><a href="#" cmd="deleteElement">{{ _('Delete') }}</a></li>
|
|
<li class="divider"></li>
|
|
<li class="dropdown-submenu">
|
|
<a href="#">Style</a>
|
|
<ul class="dropdown-menu">
|
|
<li>
|
|
<a href="#" cmd="editStyle">Normal</a>
|
|
</li>
|
|
<li class="btn-primary">
|
|
<a href="#" cmd="editStyle">Primary</a>
|
|
</li>
|
|
<li class="btn-danger">
|
|
<a href="#" cmd="editStyle">Danger</a>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
</ul>
|
|
<ul id="containerContextMenu" class="dropdown-menu" role="menu" style="display:block;position:fixed !important;margin-bottom:5px;">
|
|
<li class="dropdown-submenu">
|
|
<a href="#">Create Command</a>
|
|
<ul class="dropdown-menu">
|
|
<li><a href="#" cmd="createContainer">{{ _('Container') }}</a></li>
|
|
<li><a href="#" cmd="createCommand">{{ _('Command') }}</a></li>
|
|
<li><a href="#" cmd="createOutput">{{ _('Output') }}</a></li>
|
|
</ul>
|
|
</li>
|
|
<li class="divider"></li>
|
|
<li><a href="#" cmd="editElement">{{ _('Edit') }}</a></li>
|
|
<li><a href="#" cmd="deleteElement">{{ _('Delete') }}</a></li>
|
|
</ul>
|
|
|
|
<!-- Templates for custom controls -->
|
|
<script type="text/html" id="settingsCustomControls_containerTemplate">
|
|
<div class="custom_container custom_section_vertical_section" data-bind="contextMenu: { menuSelector: '#containerContextMenu', menuSelected: $root.controlContextMenu }, attr: { 'id': id }, css: { 'custom_section_horizontal_section': $parent && $parent.layout == 'horizontal' }">
|
|
<!-- ko if: layout() == 'vertical' -->
|
|
<div class="custom_section custom_section_vertical" data-bind="template: { name: $root.displayMode, foreach: children }"></div>
|
|
<!-- /ko -->
|
|
|
|
<!-- ko if: layout() == 'horizontal' -->
|
|
<div class="custom_section custom_section_horizontal" data-bind="template: { name: $root.displayMode, foreach: children }"></div>
|
|
<!-- /ko -->
|
|
|
|
<!-- ko if: layout() == 'horizontal_grid' -->
|
|
<div class="row-fluid custom_section custom_section_horizontal_grid">
|
|
<!-- ko foreach: children -->
|
|
<div data-bind="template: { name: $root.displayMode }, css: $root.rowCss($data)"></div>
|
|
<!-- /ko -->
|
|
</div>
|
|
<!-- /ko -->
|
|
</div>
|
|
</script>
|
|
<script type="text/html" id="settingsCustomControls_containerTemplate_accordion">
|
|
<div class="custom_container accordion-group" data-bind="contextMenu: { menuSelector: '#containerContextMenu', menuSelected: $root.controlContextMenu }, attr: { 'id': id }, css: { 'custom_section_horizontal_section': ($parent && $parent.layout && $parent.layout() == 'horizontal') }">
|
|
<!-- ko if: name -->
|
|
<div class="accordion-heading">
|
|
<a class="accordion-toggle" style="display: block; text-decoration: none" data-bind="style: { 'cursor': collapsable() ? '' : 'default' }, attr: { 'data-target': collapsable() ? '#toggle_' + id() : '', 'data-toggle': collapsable() ? 'collapse' : '', 'onclick': collapsable() ? '$(this).children().toggleClass(\'icon-caret-down icon-caret-right\')' : '' }">
|
|
<h1 data-bind="text: name, css: { 'icon-caret-down': collapsable }"></h1>
|
|
</a>
|
|
</div>
|
|
<!-- /ko -->
|
|
|
|
<!-- ko if: layout -->
|
|
<div class="accordion-body" data-bind="attr: { 'id': 'toggle_' + id() }, css: { 'collapse in': collapsable }">
|
|
<!-- ko if: layout() == 'vertical' -->
|
|
<div class="custom_section custom_section_vertical accordion-inner" data-bind="template: { name: $root.displayMode, foreach: children }"></div>
|
|
<!-- /ko -->
|
|
<!-- ko if: layout() == 'horizontal' -->
|
|
<div class="custom_section custom_section_horizontal accordion-inner" data-bind="template: { name: $root.displayMode, foreach: children }"></div>
|
|
<!-- /ko -->
|
|
<!-- ko if: layout() == 'horizontal_grid' -->
|
|
<div class="row-fluid custom_section custom_section_horizontal_grid accordion-inner">
|
|
<!-- ko foreach: children -->
|
|
<div data-bind="template: { name: $root.displayMode }, css: $root.rowCss($data)"></div>
|
|
<!-- /ko -->
|
|
</div>
|
|
<!-- /ko -->
|
|
</div>
|
|
<!-- /ko -->
|
|
</div>
|
|
</script>
|
|
<script type="text/html" id="settingsCustomControls_controlTemplate">
|
|
<form class="form-inline control-tab custom_control" style="min-height:15px; border:1px dotted #000000" data-bind="contextMenu: { menuSelector: '#commandContextMenu', menuSelected: $root.controlContextMenu }, attr: { 'id': id }">
|
|
<!-- ko template: { name: 'settingsCustomControls_controlTemplate_input', data: $data, if: $data.hasOwnProperty('input') } --><!-- /ko -->
|
|
<!-- ko template: { name: 'settingsCustomControls_controlTemplate_command', data: $data, if: $data.hasOwnProperty('command') || $data.hasOwnProperty('commands') || $data.hasOwnProperty('script') || $data.hasOwnProperty('javascript') } --><!-- /ko -->
|
|
<!-- ko template: { name: 'settingsCustomControls_controlTemplate_output', data: $data, if: $data.hasOwnProperty('deflt') } --><!-- /ko -->
|
|
</form>
|
|
</script>
|
|
<script type="text/html" id="settingsCustomControls_controlTemplate_input">
|
|
<!-- ko foreach: input -->
|
|
<label style="cursor: default" data-bind="text: name"></label>
|
|
<!-- ko if: slider -->
|
|
<input type="number" style="width: 100px" data-bind="slider: {value: value, min: slider.min, max: slider.max, step: slider.step}">
|
|
<!-- /ko -->
|
|
<!-- ko ifnot: slider -->
|
|
<input type="text" class="input-small" data-bind="attr: {placeholder: name}, value: value">
|
|
<!-- /ko -->
|
|
<!-- /ko -->
|
|
</script>
|
|
<script type="text/html" id="settingsCustomControls_controlTemplate_output">
|
|
<label style="cursor: default" data-bind="text: deflt"></label>
|
|
</script>
|
|
<script type="text/html" id="settingsCustomControls_controlTemplate_command">
|
|
<button class="btn" data-bind="text: name"></button>
|
|
</script>
|
|
<!-- End of templates for custom controls --> |