Commit c788fbb8 authored by Naomi Guyer's avatar Naomi Guyer Committed by Aaron Wells

Forms tidy-up (bootstrap)

Bug 1465107: Use Bootstrap CSS Framework

Change-Id: Ib2031b2090244733104f0da2be0253f1dfe16c64
parent 7764a406
......@@ -93,8 +93,8 @@ foreach ($iframesources as $url => $name) {
'deleteform' => pieform(array(
'name' => 'deleteurl_' . $i,
'successcallback' => 'deleteurl_submit',
'renderer' => 'oneline',
'class' => 'oneline inline',
'renderer' => 'div',
'class' => 'form-inline',
'elements' => array(
'url' => array(
'type' => 'hidden',
......
......@@ -38,7 +38,6 @@ $searchform = pieform(array(
'elements' => array(
'query' => array(
'type' => 'text',
'class' => 'form-control',
'defaultvalue' => $query,
),
'submit' => array(
......
......@@ -41,9 +41,9 @@ if ($accesschanged = $SESSION->get('pageaccesschanged')) {
$alertstr = substr($alertstr, 0, -1) . '.';
$alertstr = get_string('viewsaddedtocollection1', 'collection', $SESSION->get('pagesadded')) . ' ' . $alertstr;
$inlinejs = <<<EOF
\$j(function() {
var message = \$j('<div id="changestatusline" class="warning"><div>$alertstr</div></div>');
\$j('#messages').append(message);
jQuery(function($) {
var message = $('<div id="changestatusline" class="alert alert-warning alert-dismissible" role="alert"><button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button><p>$alertstr</p></div>');
$('#messages').append(message);
});
EOF;
$SESSION->set('pageaccesschanged', false);
......@@ -120,14 +120,23 @@ if ($views) {
$elements = array();
$viewsform = null;
if ($available = Collection::available_views($owner, $groupid, $institutionname)) {
$checkboxes = array();
foreach ($available as $a) {
$elements['view_'.$a->id] = array(
$checkboxes['view_'.$a->id] = array(
'class' => 'btn btn-default',
'renderer' => 'div',
'isformgroup' => false,
'type' => 'checkbox',
'title' => $a->title,
);
}
};
$elements['draggable-group'] = array(
'class' => 'btn-group btn-group-vertical fullwidth ',
'type' => 'fieldset',
'renderelementsonly' => true,
'elements' => $checkboxes
);
$elements['submit'] = array(
'class' => 'btn btn-primary pull-right mtl',
'type' => 'button',
......@@ -138,6 +147,7 @@ if ($available = Collection::available_views($owner, $groupid, $institutionname)
$viewsform = pieform(array(
'name' => 'addviews',
'class' => 'ptm btn-draggable fullwidth',
'renderer' => 'div',
'plugintype' => 'core',
'pluginname' => 'collection',
......@@ -148,35 +158,38 @@ if ($available = Collection::available_views($owner, $groupid, $institutionname)
}
$noviewsavailable = get_string('noviewsavailable', 'collection');
$inlinejs .= <<<EOF
\$j(function() {
jQuery(function($) {
var fixhelper = function(e, div) {
var originals = div.children();
var helper = div.clone();
helper.children().each(function(index) {
\$j(this).width(originals.eq(index).width());
$(this).width(originals.eq(index).width());
});
return helper;
};
var updaterows = function(viewid) {
var sortorder = \$j('#collectionviews').sortable('serialize');
\$j.post(config['wwwroot'] + "collection/views.json.php", { sesskey: '$sesskey', id: $id, direction: sortorder })
var sortorder = $('#collectionviews').sortable('serialize');
$.post(config['wwwroot'] + "collection/views.json.php", { sesskey: '$sesskey', id: $id, direction: sortorder })
.done(function(data) {
// update the page with the new table
if (data.returnCode == '0') {
\$j('#collectionviews').replaceWith(data.message.html);
$('#collectionviews').replaceWith(data.message.html);
if (viewid) {
\$j('#addviews_view_' + viewid + '_container').remove();
$('#addviews_view_' + viewid + '_container').remove();
// check if we have just removed the last option leaving
// only the add pages button
if (\$j("#addviews .checkbox").children().length <= 1) {
\$j("#addviews").remove();
\$j("#pagestoadd .panel-body").append('$noviewsavailable');
if ($("#addviews .checkbox").children().length <= 1) {
$("#addviews").remove();
$("#pagestoadd .panel-body").append('$noviewsavailable');
}
}
if (data.message.message) {
var warnmessage = \$j('<div id="changestatusline" class="' + data.message.messagestatus + '"><div>' + data.message.message + '</div></div>');
\$j('#messages').empty().append(warnmessage);
var warningClass = data.message.messagestatus === 'ok' ? 'success' : 'warning';
var warnmessage = $('<div id="changestatusline" class="alert alert-dismissible alert-' + warningClass + '" role="alert"><button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button><p>' + data.message.message + '</p></div>');
$('#messages').empty().append(warnmessage);
}
wiresortables();
wireaddrow();
......@@ -185,18 +198,18 @@ $inlinejs .= <<<EOF
};
var wiresortables = function() {
\$j('#collectionviews').sortable({
$('#collectionviews').sortable({
items: '> div',
cursor: 'move',
opacity: 0.6,
helper: fixhelper,
placeholder: "highlight",
over: function(e, ui) {
if (ui.placeholder[0].tagName == 'DIV') {
var container = \$j('#collectionviews');
var div = \$j('#collectionviews div.highlight');
var container = $('#collectionviews');
var div = $('#collectionviews div.highlight');
div.css('width', container.width());
div.css('height', '30px');
$(ui.helper).addClass('btn-warning');
}
},
stop: function(e, ui) {
......@@ -215,46 +228,46 @@ $inlinejs .= <<<EOF
})
.disableSelection()
.hover(function() {
\$j(this).css('cursor', 'move');
$(this).css('cursor', 'move');
});
};
var wireaddrow = function() {
\$j('#addviews div').draggable({
$('#addviews div').draggable({
connectToSortable: '#collectionviews',
cursor: 'move',
revert: 'invalid',
helper: 'clone',
}).hover(function() {
\$j(this).css('cursor', 'move');
$(this).css('cursor', 'move');
});
};
var wireaddnewrow = function() {
\$j('#addviews > div').draggable({
$('#addviews > div').draggable({
cursor: 'move',
revert: 'invalid',
helper: 'clone',
start: function(e, ui) {
\$j('#collectionpages .message').addClass('highlight');
$('#collectionpages .message').addClass('highlight');
},
stop: function(e, ui) {
\$j('#collectionpages .message').removeClass('highlight');
$('#collectionpages .message').removeClass('highlight');
},
}).hover(function() {
\$j(this).css('cursor', 'move');
$(this).css('cursor', 'move');
});
};
var wiredrop = function() {
\$j('#collectionpages .dropzone-previews').droppable({
$('#collectionpages .dropzone-previews').droppable({
accept: "div",
drop: function (e, ui) {
var labelfor = ui.draggable.children().attr('for');
if (typeof labelfor !== 'undefined' && labelfor !== false) {
// remove all but the digits
var viewid = ui.draggable.children().attr('for').replace(/[^\d.]/g,'');
\$j('#collectionpages .dropzone-previews').replaceWith('<div id="collectionviews"><div id="row_' + viewid + '">' + ui.draggable.html() + '</div></div>');
$('#collectionpages .dropzone-previews').replaceWith('<div id="collectionviews"><div id="row_' + viewid + '">' + ui.draggable.html() + '</div></div>');
wiresortables();
updaterows(viewid);
}
......@@ -263,21 +276,21 @@ $inlinejs .= <<<EOF
};
var wireselectall = function() {
\$j("#selectall").click(function(e) {
$("#selectall").click(function(e) {
e.preventDefault();
\$j("#addviews :checkbox").prop("checked", true);
$("#addviews :checkbox").prop("checked", true);
});
};
var wireselectnone = function() {
\$j("#selectnone").click(function(e) {
$("#selectnone").click(function(e) {
e.preventDefault();
\$j("#addviews :checkbox").prop("checked", false);
$("#addviews :checkbox").prop("checked", false);
});
};
// init
if (\$j('#collectionviews > li').length > 0) {
if ($('#collectionviews > li').length > 0) {
wireaddrow();
wiresortables();
}
......
......@@ -34,17 +34,17 @@ else { // all or some other text
$type = 'all';
}
$elements = array();
$elements['query'] = array(
$queryfield = array(
'title' => get_string('search') . ': ',
'hiddenlabel' => false,
'type' => 'text',
'class' => 'input-small',
'class' => 'with-dropdown js-with-dropdown',
'defaultvalue' => $query);
$elements['filter'] = array(
$filterfield = array(
'title' => get_string('filter') . ': ',
'hiddenlabel' => false,
'type' => 'select',
'class' => 'input-small',
'class' => 'dropdown-connect js-dropdown-connect',
'options' => array(
'canjoin' => get_string('groupsicanjoin', 'group'),
'notmember' => get_string('groupsnotin', 'group'),
......@@ -52,6 +52,17 @@ $elements['filter'] = array(
'all' => get_string('allgroups', 'group')
),
'defaultvalue' => $filter);
$elements['searchwithin'] = array(
'type' => 'fieldset',
'class' => 'dropdown-group js-dropdown-group',
'elements' => array(
'query' => $queryfield,
'filter' => $filterfield
)
);
if (get_config('allowgroupcategories')
&& $groupcategories = get_records_menu('group_category','','','displayorder', 'id,title')
) {
......@@ -68,13 +79,13 @@ if (get_config('allowgroupcategories')
}
$elements['search'] = array(
'type' => 'submit',
'class' => 'btn btn-success mtm',
'class' => 'btn btn-primary mtm',
'value' => get_string('search'));
$searchform = pieform(array(
'name' => 'search',
'checkdirtychange' => false,
'method' => 'post',
'class' => 'form-inline ptl pbl',
'class' => 'form-inline with-heading',
'elements' => $elements
)
);
......
......@@ -96,7 +96,7 @@ if ('admin' == $role) {
$searchform = pieform(array(
'name' => 'search',
'checkdirtychange' => false,
'class' => 'search-views-form form-inline ptl pbl',
'class' => 'search-views-form form-inline with-heading',
'elements' => array(
'id' => array(
'type' => 'hidden',
......@@ -127,7 +127,7 @@ $searchform = pieform(array(
),
'submit' => array(
'type' => 'submit',
'class' => 'btn btn-success mtm',
'class' => 'btn btn-primary mtm',
'value' => get_string('search')
)
)
......
......@@ -30,7 +30,6 @@ $elements = array();
$elements['options'] = array(
'title' => get_string('filter'),
'hiddenlabel' => true,
'class' => 'form-control',
'type' => 'select',
'options' => array(
'all' => get_string('allmygroups', 'group'),
......@@ -47,8 +46,6 @@ if (get_config('allowgroupcategories')
$options += $groupcategories;
$elements['groupcategory'] = array(
'type' => 'select',
'class' => 'form-control',
//'title' => get_string('groupcategory', 'group'),
'defaultvalue' => $groupcategory,
'options' => $options,
);
......@@ -56,15 +53,15 @@ if (get_config('allowgroupcategories')
$elements['submit'] = array(
'type' => 'button',
'usebuttontag' => true,
'class' => 'btn btn-success input-group-btn',
'value' => get_string('filter'),
'class' => 'btn btn-primary input-group-btn',
'value' => '<span class="icon icon-filter prs"></span> ' . get_string('filter'),
);
$form = pieform(array(
'name' => 'filter',
'checkdirtychange' => false,
'method' => 'post',
'renderer' => 'div',
'class' => 'form-inline ptl pbl',
'class' => 'form-inline with-heading',
'elements' => array(
'inputgroup' => array(
'type' => 'fieldset',
......
......@@ -1381,12 +1381,12 @@ function group_view_submission_form($groupid) {
'successcallback' => 'group_view_submission_form_submit',
'elements' => array(
'text1' => array(
'class' => 'inline text-small',
'class' => 'text-inline text-small',
'type' => 'html', 'value' => get_string('submit', 'group') . ' ',
),
'text2' => array(
'type' => 'html',
'class' => 'forassessment inline text-small',
'class' => 'forassessment text-inline text-small',
'value' => get_string('forassessment', 'view'),
),
'inputgroup' => array(
......@@ -1395,7 +1395,6 @@ function group_view_submission_form($groupid) {
'elements' => array(
'options' => array(
'type' => 'select',
'class' => 'form-control',
'collapseifoneoption' => false,
'optgroups' => $optgroups,
'options' => $options,
......
......@@ -1093,6 +1093,13 @@ EOF;
*/
public function make_class($element) {/*{{{*/
$classes = array();
$formcontrols = array('text', 'textarea', 'select', 'password', 'calendar', 'date', 'expiry', 'file');
if(in_array($element['type'], $formcontrols)){
$classes[] = 'form-control';
}
if (isset($element['class'])) {
$classes[] = self::hsc($element['class']);
}
......
......@@ -35,63 +35,89 @@ function pieform_renderer_div(Pieform $form, $element) {/*{{{*/
$formname = $form->get_name();
// Set the class of the enclosing <div> to match that of the element
$result = '<div';
if (isset($element['name'])) {
$result .= ' id="' . $formname . '_' . Pieform::hsc($element['name']) . '_container"';
}
$prefix = '';
$suffix = '';
$inner = '';
// add form-group classes to all real form fields
// allow forms to be rendered without a wrapping div
if (!isset($element['renderelementsonly'])){
if(isset($element['class'])){
$element['class'] = $element['class'] . ' form-group';
} else {
$element['class'] = '';
}
$prefix = '<div';
if (isset($element['name'])) {
$prefix .= ' id="' . $formname . '_' . Pieform::hsc($element['name']) . '_container"';
}
// all elements should be form groups by default
if (!isset($element['isformgroup'])) {
$element['isformgroup'] = true;
}
// add form-group classes to all real form fields
$formgroupclass = $element['isformgroup'] ? 'form-group' : '';
if(isset($element['class'])){
// remove form-control class and btn class (these should be on the element only)
$element['class'] = str_replace(" btn ", " ", $element['class']);
$element['class'] = str_replace("form-control ", "", $element['class']);
if (isset($element['collapsible'])) {
$element['class'] = $element['class'] . ' collapsible-group';
}
// add bootstrap has-error class to any error fields
if (strpos($element['class'],'error') !== false) {
$element['class'] = $element['class'] . ' has-error';
$element['class'] = $element['class'] .' '. $formgroupclass;
} else {
$element['class'] = $formgroupclass;
}
if (isset($element['collapsible'])) {
$element['class'] = $element['class'] . ' collapsible-group';
}
// add bootstrap has-error class to any error fields
if (strpos($element['class'],'error') !== false) {
$element['class'] = $element['class'] . ' has-error';
}
$prefix .= ' class="' . Pieform::hsc($element['class']) . '"';
$prefix .= '>';
}
$result .= ' class="' . Pieform::hsc($element['class']) . '"';
$result .= '>';
if (isset($element['labelhtml'])) {
$result .= $element['labelhtml'];
$inner .= $element['labelhtml'];
}
if (isset($element['prehtml'])) {
$result .= '<span class="prehtml">' . $element['prehtml'] . '</span>';
$inner .= '<span class="prehtml">' . $element['prehtml'] . '</span>';
}
if (isset($element['html'])) {
$result .= $element['html'];
$inner .= $element['html'];
}
if (isset($element['posthtml'])) {
$result .= '<span class="posthtml">' . $element['posthtml'] . '</span>';
$inner .= '<span class="posthtml">' . $element['posthtml'] . '</span>';
}
if (isset($element['helphtml'])) {
$result .= ' ' . $element['helphtml'];
$inner .= ' ' . $element['helphtml'];
}
// Description - optional description of the element, or other note that should be visible
// on the form itself (without the user having to hover over contextual help
if ((!$form->has_errors() || $form->get_property('showdescriptiononerror')) && !empty($element['descriptionhtml'])) {
$result .= '<div class="description"> ' . $element['descriptionhtml'] . "</div>";
$inner .= '<div class="description"> ' . $element['descriptionhtml'] . "</div>";
}
if (!empty($element['error'])) {
$result .= '<div class="errmsg">' . $element['errorhtml'] . '</div>';
$inner .= '<div class="errmsg">' . $element['errorhtml'] . '</div>';
}
$result .= "</div>\n";
if (!isset($element['renderelementsonly'])){
$suffix .= "</div>\n";
}
$result = $prefix . $inner . $suffix;
return $result;
}/*}}}*/
......@@ -77,7 +77,7 @@ function PieformTextarea(element, fullwidth) {//{{{
this.dimensions = this.actual(element);
// Prepare wrapper
this.wrapper = DIV({'class':'resizable-textarea'});
this.wrapper = DIV({'class':'resizable-textarea align-with-input'});
insertSiblingNodesBefore(this.element, this.wrapper);
// Add grippie and measure it
......@@ -162,4 +162,3 @@ function PieformTextarea(element, fullwidth) {//{{{
connect(this.grippie, 'onmousedown', self, 'beginDrag');
}//}}}
......@@ -1423,10 +1423,10 @@ function set_antispam_defaults() {
function activate_plugin_form($plugintype, $plugin) {
return pieform(array(
'name' => 'activate_' . $plugintype . '_' . $plugin->name,
'renderer' => 'oneline',
'renderer' => 'div',
'elementclasses' => false,
'successcallback' => 'activate_plugin_submit',
'class' => 'oneline inline',
'class' => 'form-inline',
'jsform' => false,
'action' => get_config('wwwroot') . 'admin/extensions/pluginconfig.php',
'elements' => array(
......
......@@ -1787,7 +1787,7 @@ class View {
case 'removeblockinstance': // requires action_removeblockinstance_id_\d
if (!defined('JSON')) {
if (!$sure = param_boolean('sure')) {
$yesform = '<form action="' . get_config('wwwroot') . '/view/blocks.php" class="inline">'
$yesform = '<form action="' . get_config('wwwroot') . '/view/blocks.php" class="text-inline">'
. '<input type="hidden" name="id" value="' . $this->get('id') . '">'
. '<input type="hidden" name="c" value="file">'
. '<input type="hidden" name="action_' . $action . '_' . $actionstring . '" value="1">'
......@@ -3706,20 +3706,26 @@ class View {
$searchform = array(
'name' => 'searchviews',
'checkdirtychange' => false,
'class' => 'search-views-form form-inline ptl pbl',
'class' => 'search-views-form with-heading form-inline',
'elements' => array(
'query' => array(
'type' => 'text',
'title' => get_string('search') . ': ',
'class' => 'input-small',
'defaultvalue' => $searchdefault,
),
'type' => array(
'title' => get_string('searchwithin'). ': ',
'class' => 'input-small',
'type' => 'select',
'options' => $searchoptions,
'defaultvalue' => $searchtype,
'searchwithin' => array (
'type' => 'fieldset',
'class' => 'dropdown-group js-dropdown-group',
'elements' => array(
'query' => array(
'type' => 'text',
'title' => get_string('search') . ': ',
'class' => 'with-dropdown js-with-dropdown',
'defaultvalue' => $searchdefault,
),
'type' => array(
'title' => get_string('searchwithin'). ': ',
'class' => 'dropdown-connect js-dropdown-connect',
'type' => 'select',
'options' => $searchoptions,
'defaultvalue' => $searchtype,
)
)
),
'orderby' => array(
'type' => 'select',
......@@ -3740,7 +3746,7 @@ class View {
),
'submit' => array(
'type' => 'submit',
'class' => 'btn btn-success mtm',
'class' => 'btn btn-primary mtm',
'value' => get_string('search')
)
)
......@@ -6295,7 +6301,7 @@ function view_group_submission_form($view, $tutorgroupdata, $returnto=null) {
'elements' => array(
'text1' => array(
'type' => 'html',
'class' => 'inline',
'class' => 'text-inline',
'value' => '',
),
'text2' => array(
......@@ -6309,7 +6315,6 @@ function view_group_submission_form($view, $tutorgroupdata, $returnto=null) {
'elements' => array(
'options' => array(
'type' => 'select',
'class' => 'form-control',
'collapseifoneoption' => false,
'options' => $options,
),
......
......@@ -531,7 +531,7 @@ $elements['viewtable'] = array(
$elements['viewadvanced'] = array(
'type' => 'fieldset',
'legend' => get_string('viewadvancedoptions', 'skin'),
'class' => $fieldset != 'viewadvanced' ? 'collapsed' : '',
'class' => $fieldset != 'viewadvanced' ? 'collapsed' : '',
'elements' => array(
'view_custom_css' => array(
'type' => 'textarea',
......
......@@ -37,7 +37,7 @@ $form = pieform(array(
'name' => 'filter',
'method' => 'post',
'renderer' => 'div',
'class' => 'form-inline ptl pbl',
'class' => 'form-inline with-heading',
'elements' => array(
'inputgroup' => array(
'type' => 'fieldset',
......@@ -46,7 +46,6 @@ $form = pieform(array(
'elements' => array(
'options' => array(
'type' => 'select',
'class' => 'form-control',
'defaultvalue' => $filter,
'options' => array(
'all' => get_string('allskins', 'skin'),
......@@ -58,8 +57,8 @@ $form = pieform(array(
'submit' => array(