smartblock ui: add collapsed "advanced options" section
This commit is contained in:
parent
4752c728b9
commit
13d6df24fb
|
@ -1,87 +1,8 @@
|
|||
<form class="smart-block-form" method="post" action="">
|
||||
<dl class='zend_form search-criteria'>
|
||||
<div id='sp-success' class='success' style='display:none'></div>
|
||||
<dt>
|
||||
<label class='sp-label'>
|
||||
<?php echo $this->element->getElement('sp_type')->getLabel() ?>
|
||||
</label>
|
||||
</dt>
|
||||
<dd id='sp_type-element'>
|
||||
<?php $i=0;
|
||||
$value = $this->element->getElement('sp_type')->getValue();
|
||||
foreach ($this->element->getElement('sp_type')->getMultiOptions() as $radio) : ?>
|
||||
|
||||
<label class='sp-label' for='sp_type-<?php echo $i?>'>
|
||||
<input type="radio" value="<?php echo $i ?>" id="sp_type-<?php echo $i ?>" name="sp_type" <?php if($i == $value){echo 'checked="checked"';}?> ><?php echo $radio ?>
|
||||
</label>
|
||||
<?php $i = $i + 1; ?>
|
||||
<?php endforeach; ?>
|
||||
<span class='playlist_type_help_icon'></span>
|
||||
</dd>
|
||||
|
||||
<dt>
|
||||
<label class='sp_text_font'><?php echo $this->element->getElement('sp_repeat_tracks')->getLabel() ?></label>
|
||||
</dt>
|
||||
<dd id='sp_repeat_tracks-element'>
|
||||
<?php echo $this->element->getElement('sp_repeat_tracks')?>
|
||||
<?php if($this->element->getElement("sp_repeat_tracks")->hasErrors()) : ?>
|
||||
<?php foreach($this->element->getElement("sp_repeat_tracks")->getMessages() as $error): ?>
|
||||
<span class='errors sp-errors'>
|
||||
<?php echo $error; ?>
|
||||
</span>
|
||||
<?php endforeach; ?>
|
||||
<?php endif; ?>
|
||||
<span class='repeat_tracks_help_icon'></span>
|
||||
</dd>
|
||||
<dt>
|
||||
<label class='sp_text_font'><?php echo $this->element->getElement('sp_overflow_tracks')->getLabel() ?></label>
|
||||
</dt>
|
||||
<dd id='sp_overflow_tracks-element'>
|
||||
<?php echo $this->element->getElement('sp_overflow_tracks')?>
|
||||
<?php if($this->element->getElement("sp_overflow_tracks")->hasErrors()) : ?>
|
||||
<?php foreach($this->element->getElement("sp_overflow_tracks")->getMessages() as $error): ?>
|
||||
<span class='errors sp-errors'>
|
||||
<?php echo $error; ?>
|
||||
</span>
|
||||
<?php endforeach; ?>
|
||||
<?php endif; ?>
|
||||
<span class='overflow_tracks_help_icon'></span>
|
||||
</dd>
|
||||
|
||||
|
||||
<dt>
|
||||
<label class='sp_text_font'><?php echo $this->element->getElement('sp_sort_options')->getLabel();?></label>
|
||||
</dt>
|
||||
<dd id='sp_sort-element'>
|
||||
<?php echo $this->element->getElement('sp_sort_options') ?>
|
||||
<?php if($this->element->getElement("sp_sort_options")->hasErrors()) : ?>
|
||||
<?php foreach($this->element->getElement("sp_sort_options")->getMessages() as $error): ?>
|
||||
<span class='errors sp-errors'>
|
||||
<?php echo $error; ?>
|
||||
</span>
|
||||
<?php endforeach; ?>
|
||||
<?php endif; ?>
|
||||
</dd>
|
||||
|
||||
<dt>
|
||||
<label class='sp_text_font'><?php echo $this->element->getElement('sp_limit_value')->getLabel() ?></label>
|
||||
</dt>
|
||||
<dd id='sp_limit-element'>
|
||||
<?php echo $this->element->getElement('sp_limit_value')?>
|
||||
<?php echo $this->element->getElement('sp_limit_options') ?>
|
||||
<?php if($this->element->getElement("sp_limit_value")->hasErrors()) : ?>
|
||||
<?php foreach($this->element->getElement("sp_limit_value")->getMessages() as $error): ?>
|
||||
<span class='errors sp-errors'>
|
||||
<?php echo $error; ?>
|
||||
</span>
|
||||
<?php endforeach; ?>
|
||||
<?php endif; ?>
|
||||
</dd>
|
||||
|
||||
<dt><label><?php echo(_("Search Criteria:"));?></label></dt>
|
||||
<dd id='sp_criteria-element' class='criteria-element'>
|
||||
<a class='btn btn-small btn-new' id='criteria_add'><i class='icon-white icon-plus'></i><?php echo(_("New Criteria")); ?></a>
|
||||
|
||||
<?php for ($i = 0; $i < $this->criteriasLength; $i++) {
|
||||
// modRowMap holds the number of modifier rows for each criteria element
|
||||
// i.e. if we have 'Album contains 1' and 'Album contains 2' the modRowMap
|
||||
|
@ -138,7 +59,93 @@
|
|||
<?php } ?>
|
||||
|
||||
<?php } ?>
|
||||
<a class='btn btn-small btn-new' id='criteria_add'><i class='icon-white icon-plus'></i><?php echo(_("New Criteria")); ?></a>
|
||||
</dd>
|
||||
</dl>
|
||||
<dl>
|
||||
<dt>
|
||||
<label class='sp_text_font'><?php echo $this->element->getElement('sp_limit_value')->getLabel() ?></label>
|
||||
</dt>
|
||||
<dd id='sp_limit-element'>
|
||||
<?php echo $this->element->getElement('sp_limit_value')?>
|
||||
<?php echo $this->element->getElement('sp_limit_options') ?>
|
||||
<?php if($this->element->getElement("sp_limit_value")->hasErrors()) : ?>
|
||||
<?php foreach($this->element->getElement("sp_limit_value")->getMessages() as $error): ?>
|
||||
<span class='errors sp-errors'>
|
||||
<?php echo $error; ?>
|
||||
</span>
|
||||
<?php endforeach; ?>
|
||||
<?php endif; ?>
|
||||
</dd>
|
||||
</dl>
|
||||
|
||||
<div class="collapsible-header"><span class="arrow-icon"></span>Advanced options</div>
|
||||
<div class="smart-block-advanced">
|
||||
<dl>
|
||||
<dt>
|
||||
<label class='sp-label'>
|
||||
<?php echo $this->element->getElement('sp_type')->getLabel() ?>
|
||||
</label>
|
||||
</dt>
|
||||
<dd id='sp_type-element'>
|
||||
<?php $i=0;
|
||||
$value = $this->element->getElement('sp_type')->getValue();
|
||||
foreach ($this->element->getElement('sp_type')->getMultiOptions() as $radio) : ?>
|
||||
|
||||
<label class='sp-label' for='sp_type-<?php echo $i?>'>
|
||||
<input type="radio" value="<?php echo $i ?>" id="sp_type-<?php echo $i ?>" name="sp_type" <?php if($i == $value){echo 'checked="checked"';}?> ><?php echo $radio ?>
|
||||
</label>
|
||||
<?php $i = $i + 1; ?>
|
||||
<?php endforeach; ?>
|
||||
<span class='playlist_type_help_icon'></span>
|
||||
</dd>
|
||||
</dl>
|
||||
<dl>
|
||||
<dt>
|
||||
<label class='sp_text_font'><?php echo $this->element->getElement('sp_repeat_tracks')->getLabel() ?></label>
|
||||
</dt>
|
||||
<dd id='sp_repeat_tracks-element'>
|
||||
<?php echo $this->element->getElement('sp_repeat_tracks')?>
|
||||
<?php if($this->element->getElement("sp_repeat_tracks")->hasErrors()) : ?>
|
||||
<?php foreach($this->element->getElement("sp_repeat_tracks")->getMessages() as $error): ?>
|
||||
<span class='errors sp-errors'>
|
||||
<?php echo $error; ?>
|
||||
</span>
|
||||
<?php endforeach; ?>
|
||||
<?php endif; ?>
|
||||
<span class='repeat_tracks_help_icon'></span>
|
||||
</dd>
|
||||
</dl>
|
||||
<dl>
|
||||
<dt>
|
||||
<label class='sp_text_font'><?php echo $this->element->getElement('sp_overflow_tracks')->getLabel() ?></label>
|
||||
</dt>
|
||||
<dd id='sp_overflow_tracks-element'>
|
||||
<?php echo $this->element->getElement('sp_overflow_tracks')?>
|
||||
<?php if($this->element->getElement("sp_overflow_tracks")->hasErrors()) : ?>
|
||||
<?php foreach($this->element->getElement("sp_overflow_tracks")->getMessages() as $error): ?>
|
||||
<span class='errors sp-errors'>
|
||||
<?php echo $error; ?>
|
||||
</span>
|
||||
<?php endforeach; ?>
|
||||
<?php endif; ?>
|
||||
<span class='overflow_tracks_help_icon'></span>
|
||||
</dd>
|
||||
</dl>
|
||||
<dl>
|
||||
<dt>
|
||||
<label class='sp_text_font'><?php echo $this->element->getElement('sp_sort_options')->getLabel();?></label>
|
||||
</dt>
|
||||
<dd id='sp_sort-element'>
|
||||
<?php echo $this->element->getElement('sp_sort_options') ?>
|
||||
<?php if($this->element->getElement("sp_sort_options")->hasErrors()) : ?>
|
||||
<?php foreach($this->element->getElement("sp_sort_options")->getMessages() as $error): ?>
|
||||
<span class='errors sp-errors'>
|
||||
<?php echo $error; ?>
|
||||
</span>
|
||||
<?php endforeach; ?>
|
||||
<?php endif; ?>
|
||||
</dd>
|
||||
</dl>
|
||||
</div>
|
||||
</form>
|
||||
|
|
|
@ -10,7 +10,7 @@ if (isset($this->obj)) {
|
|||
<H2><?php echo(_("Editing "));?>"<span class="title_obj_name"><?php if (isset($this->unsavedName)) echo $this->unsavedName;
|
||||
else echo $this->escape($this->obj->getName());?></span>"</H2>
|
||||
</div>
|
||||
<div class="inner_editor_wrapper">
|
||||
<div class="inner_editor_wrapper smart-block-form">
|
||||
<input class="obj_id" type="hidden" value="<?php echo $this->obj->getId(); ?>"/>
|
||||
<input class="obj_lastMod" type="hidden" value="<?php echo $this->obj->getLastModified('U'); ?>"/>
|
||||
<input class='obj_type' type='hidden' value='block'/>
|
||||
|
@ -25,6 +25,12 @@ if (isset($this->obj)) {
|
|||
else echo $this->escape($this->obj->getName());
|
||||
?>">
|
||||
</dd>
|
||||
</dl>
|
||||
|
||||
<?php echo $this->form; ?>
|
||||
|
||||
<div class="smart-block-advanced">
|
||||
<dl>
|
||||
<dt id="description-label"><label for="description"><?php echo _("Description:") ?></label></dt>
|
||||
<dd id="description-element">
|
||||
<textarea cols="24" rows="3" id="description" name="description"><?php
|
||||
|
@ -33,8 +39,7 @@ if (isset($this->obj)) {
|
|||
?></textarea>
|
||||
</dd>
|
||||
</dl>
|
||||
|
||||
<?php echo $this->form; ?>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
|
|
@ -684,20 +684,6 @@ li.ui-state-default {
|
|||
height: 26px;
|
||||
}
|
||||
|
||||
.smart-block-form input[type='radio'] {
|
||||
vertical-align: bottom;
|
||||
margin: 0 5px -2px;
|
||||
}
|
||||
|
||||
.smart-block-form input[type='checkbox'] {
|
||||
vertical-align: bottom;
|
||||
margin: 0 4px;
|
||||
}
|
||||
|
||||
.smart-block-form ~ .btn-toolbar {
|
||||
padding-top: 4px;
|
||||
}
|
||||
|
||||
/* Schedule tab DataTable */
|
||||
|
||||
#show_builder_table_wrapper .fg-toolbar.ui-corner-tl.ui-corner-tr {
|
||||
|
|
|
@ -635,3 +635,40 @@ li.spl_empty {
|
|||
#criteria_add {
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.smart-block-form dt, .smart-block-form dd {
|
||||
float: none;
|
||||
}
|
||||
.smart-block-form dl:not(.search-criteria) {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
}
|
||||
.smart-block-form dt {
|
||||
flex: 1 0 20%;
|
||||
margin: 0;
|
||||
}
|
||||
.smart-block-form dd {
|
||||
flex: 0 0 80%;
|
||||
margin: 0;
|
||||
}
|
||||
.collapsible-header .arrow-icon {
|
||||
transition: 0.3s;
|
||||
}
|
||||
.collapsible-header.visible .arrow-icon {
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
.smart-block-advanced {
|
||||
display: none;
|
||||
}
|
||||
.smart-block-form .smart-block-advanced dt {
|
||||
flex: 0 0 40%;
|
||||
margin: 0;
|
||||
}
|
||||
.smart-block-form .smart-block-advanced dd {
|
||||
flex: 0 0 60%;
|
||||
margin: 0;
|
||||
}
|
||||
.smart-block-form input[type='radio'], .smart-block-form input[type='checkbox'] {
|
||||
vertical-align: middle;
|
||||
margin: 0 5px;
|
||||
}
|
|
@ -566,6 +566,11 @@ function setupUI() {
|
|||
at: "right center"
|
||||
}
|
||||
});
|
||||
|
||||
activeTab.find('.smart-block-form .collapsible-header').click(function(){
|
||||
$(this).toggleClass('visible');
|
||||
$('.smart-block-advanced').toggle();
|
||||
})
|
||||
}
|
||||
|
||||
/* Utilizing jQuery this function finds the #datetime_select element on the given row
|
||||
|
|
Loading…
Reference in New Issue