use meta HTML API for config pages

This commit is contained in:
Roland Gruber 2010-11-14 20:35:34 +00:00
parent fe8d8789b1
commit d32f1fb55e
5 changed files with 190 additions and 117 deletions

View File

@ -538,6 +538,8 @@ class htmlButton extends htmlElement {
private $title = null;
/** enabled or disabled */
private $isEnabled = true;
/** icon class (CSS) for buttons with icon + text */
private $iconClass = null;
/**
* Constructor.
@ -579,7 +581,7 @@ class htmlButton extends htmlElement {
$style = ' style="background-image: url(../../graphics/' . $this->value . ');"';
}
// text button
else {
elseif ($this->iconClass == null) {
$class = ' class="smallPadding"';
}
if ($this->title != null) {
@ -595,9 +597,13 @@ class htmlButton extends htmlElement {
else {
echo '<button id="btn_' . $this->name . '"' . $name . $style . $class . $title . $disabled . '>' . $this->value . '</button>';
// text buttons get JQuery style
$icon = '';
if ($this->iconClass != null) {
$icon = '{ icons: { primary: \'' . $this->iconClass . '\' } }';
}
echo '<script type="text/javascript">';
echo ' jQuery(document).ready(function() {';
echo "jQuery('#btn_" . $this->name . "').button();";
echo "jQuery('#btn_" . $this->name . "').button(" . $icon . ");";
echo '});';
echo '</script>';
}
@ -622,6 +628,16 @@ class htmlButton extends htmlElement {
$this->isEnabled = $isEnabled;
}
/**
* Sets an additional icon for a text button.
* The icon class is a CSS class that specifies the icon image (e.g. "deleteButton" in layout.css).
*
* @param String $iconClass icon class
*/
public function setIconClass($iconClass) {
$this->iconClass = htmlspecialchars($iconClass);
}
}
/**
@ -677,6 +693,8 @@ class htmlSelect extends htmlElement {
private $isEnabled = true;
/** width of input element */
private $width = '';
/** transform select boxes with one element to text */
private $transformSingleSelect = true;
/**
* Constructor.
@ -741,7 +759,7 @@ class htmlSelect extends htmlElement {
$style = ' style="width: ' . $this->width . '"';
}
// hide select boxes that contain less than 2 elements
if (sizeof($this->elements) < 2) {
if ((sizeof($this->elements) < 2) && $this->transformSingleSelect) {
echo '<div class="hidden">';
}
// print select box
@ -761,7 +779,7 @@ class htmlSelect extends htmlElement {
}
echo "</select>\n";
// if select box has only one element then show it as text
if (sizeof($this->elements) == 1) {
if ((sizeof($this->elements) == 1) && $this->transformSingleSelect) {
echo '</div>';
if ($this->hasDescriptiveElements) {
$keys = array_keys($this->elements);
@ -771,7 +789,7 @@ class htmlSelect extends htmlElement {
echo $this->elements[0];
}
}
else if (sizeof($this->elements) == 0) {
elseif (sizeof($this->elements) == 0) {
echo '</div>';
}
if ($this->multiSelect) {
@ -883,6 +901,15 @@ class htmlSelect extends htmlElement {
$this->width = htmlspecialchars($width);
}
/**
* Specifies if select boxes that contain only a single element should be transformed to a simple text field.
*
* @param boolean $transformSingleSelect transform single options to text
*/
public function setTransformSingleSelect($transformSingleSelect) {
$this->transformSingleSelect = $transformSingleSelect;
}
}
/**
@ -1028,6 +1055,8 @@ class htmlOutputText extends htmlElement {
private $string;
/** specifies if HTML code should be escaped */
private $escapeHTML;
/** bold text */
private $isBold = false;
/**
* Constructor.
@ -1052,15 +1081,30 @@ class htmlOutputText extends htmlElement {
* @return array List of input field names and their type (name => type)
*/
function generateHTML($module, $input, $values, $restricted, &$tabindex, $scope) {
if ($this->isBold) {
echo "<b>";
}
if ($this->escapeHTML) {
echo htmlspecialchars($this->string);
}
else {
echo $this->string;
}
if ($this->isBold) {
echo "</b>";
}
return array();
}
/**
* Specifies if the whole text should be printed in bold.
*
* @param boolean $isBold bold text
*/
public function setIsBold($isBold) {
$this->isBold = $isBold;
}
}
/**
@ -1700,14 +1744,17 @@ class htmlSubTitle extends htmlElement {
/** descriptive label */
private $label = null;
/** optional image */
private $image = null;
/**
* Constructor.
*
* @param String $label label
*/
function __construct($label) {
function __construct($label, $image = null) {
$this->label = htmlspecialchars($label);
$this->image = htmlspecialchars($image);
// the title should not end at a table cell
$this->colspan = 100;
}
@ -1726,6 +1773,9 @@ class htmlSubTitle extends htmlElement {
function generateHTML($module, $input, $values, $restricted, &$tabindex, $scope) {
echo "<div class=\"subTitle\">\n";
echo "<h4 class=\"subTitleText\">\n";
if ($this->image != null) {
echo '<img src="' . $this->image . '" alt="' . $this->label . '">&nbsp;';
}
echo $this->label;
echo "</h4>\n";
echo "</div>\n";

View File

@ -214,6 +214,7 @@ echo '</ul>';
jQuery(document).ready(function() {
jQuery('#generalSettingsButton').addClass('ui-tabs-selected');
jQuery('#generalSettingsButton').addClass('ui-state-active');
jQuery('#generalSettingsButton').addClass('userlist-bright');
jQuery('#saveButton').button({
icons: {
primary: 'saveButton'
@ -227,7 +228,7 @@ jQuery(document).ready(function() {
});
</script>
<div class="ui-tabs-panel ui-widget-content ui-corner-bottom">
<div class="ui-tabs-panel ui-widget-content ui-corner-bottom userlist-bright">
<?php
echo ("<fieldset><legend><img align=\"middle\" src=\"../../graphics/profiles.png\" alt=\"profiles.png\"> " . _("Server settings") . "</legend><br>\n");

View File

@ -181,6 +181,7 @@ echo '</ul>';
jQuery(document).ready(function() {
jQuery('#editmodules').addClass('ui-tabs-selected');
jQuery('#editmodules').addClass('ui-state-active');
jQuery('#editmodules').addClass('userlist-bright');
jQuery('#saveButton').button({
icons: {
primary: 'saveButton'
@ -191,10 +192,17 @@ jQuery(document).ready(function() {
primary: 'cancelButton'
}
});
// set common width for select boxes
var maxWidth = 0;
jQuery("select").each(function(){
if (jQuery(this).width() > maxWidth)
maxWidth = jQuery(this).width();
});
jQuery("select").width(maxWidth);
});
</script>
<div class="ui-tabs-panel ui-widget-content ui-corner-bottom">
<div class="ui-tabs-panel ui-widget-content ui-corner-bottom userlist-bright">
<?php
@ -203,9 +211,12 @@ for ($i = 0; $i < sizeof($types); $i++) {
$account_list[] = array($types[$i], getTypeAlias($types[$i]));
}
$container = new htmlTable();
for ($i = 0; $i < sizeof($account_list); $i++) {
config_showAccountModules($account_list[$i][0], $account_list[$i][1]);
config_showAccountModules($account_list[$i][0], $account_list[$i][1], $container);
}
$tabindex = 1;
parseHtml(null, $container, array(), false, $tabindex, 'user');
echo "<p>\n";
@ -227,8 +238,9 @@ echo "</html>\n";
*
* @param string $scope account type
* @param string $title title for module selection (e.g. "User modules")
* @param htmlTable $container meta HTML container
*/
function config_showAccountModules($scope, $title) {
function config_showAccountModules($scope, $title, &$container) {
$conf = &$_SESSION['conf_config'];
$typeSettings = $conf->get_typeSettings();
// account modules
@ -246,71 +258,70 @@ function config_showAccountModules($scope, $title) {
}
natcasesort($sortedAvailable);
// show account modules
$icon = '<img alt="' . $scope . '" src="../../graphics/' . $scope . '.png">&nbsp;';
echo "<fieldset class=\"" . $scope . "edit\"><legend>$icon<b>" . $title . "</b></legend><br>\n";
echo "<table border=0 width=\"100%\">\n";
// select boxes
echo "<tr>\n";
echo "<td width=\"5%\"></td>\n";
echo "<td width=\"40%\">\n";
echo "<fieldset class=\"" . $scope . "edit\">\n";
echo "<legend>" . _("Selected modules") . "</legend><br>\n";
echo "<select class=\"" . $scope . "edit\" name=\"" . $scope . "_selected[]\" size=5 multiple>\n";
for ($i = 0; $i < sizeof($selected); $i++) {
if (in_array($selected[$i], $available)) { // selected modules must be available
if (is_base_module($selected[$i], $scope)) { // mark base modules
echo "<option value=\"" . $selected[$i] . "\">";
echo getModuleAlias($selected[$i], $scope) . " (" . $selected[$i] . ")(*)";
echo "</option>\n";
}
else {
echo "<option value=\"" . $selected[$i] . "\">";
echo getModuleAlias($selected[$i], $scope) . " (" . $selected[$i] . ")";
echo "</option>\n";
}
}
}
echo "</select>\n";
echo "</fieldset>\n";
echo "</td>\n";
echo "<td width=\"10%\" align=\"center\">\n";
echo "<p>";
echo "<input type=submit title=\"" . _('Add') . "\" value=\" \" name=\"" . $scope . "_add\"" .
"style=\"background-image: url(../../graphics/back.gif);background-position: 2px center;background-repeat: no-repeat;width:24px;height:24px;background-color:transparent\">";
echo "<br>";
echo "<input type=submit title=\"" . _('Remove') . "\" value=\" \" name=\"" . $scope . "_remove\"" .
"style=\"background-image: url(../../graphics/forward.gif);background-position: 2px center;background-repeat: no-repeat;width:24px;height:24px;background-color:transparent\">";
echo "</p>\n";
echo "</td>\n";
echo "<td width=\"40%\">\n";
echo "<fieldset class=\"" . $scope . "edit\">\n";
echo "<legend>" . _("Available modules") . "</legend><br>\n";
echo "<select class=\"" . $scope . "edit\" name=\"" . $scope . "_available[]\" size=5 multiple>\n";
foreach ($sortedAvailable as $key => $value) {
if (! in_array($key, $selected)) { // display non-selected modules
if (is_base_module($key, $scope)) { // mark base modules
echo "<option value=\"" . $key . "\">";
echo $value . " (" . $key . ")(*)";
echo "</option>\n";
}
else {
echo "<option value=\"" . $key . "\">";
echo $value . " (" . $key . ")";
echo "</option>\n";
}
}
}
echo "</select>\n";
echo "</fieldset>\n";
echo "</td>\n";
echo "<td width=\"5%\"></td>\n";
echo "</tr>\n";
echo "</table>\n";
// build options for selected and available modules
$selOptions = array();
for ($i = 0; $i < sizeof($selected); $i++) {
if (in_array($selected[$i], $available)) { // selected modules must be available
if (is_base_module($selected[$i], $scope)) { // mark base modules
$selOptions[getModuleAlias($selected[$i], $scope) . " (" . $selected[$i] . ")(*)"] = $selected[$i];
}
else {
$selOptions[getModuleAlias($selected[$i], $scope) . " (" . $selected[$i] . ")"] = $selected[$i];
}
}
}
$availOptions = array();
foreach ($sortedAvailable as $key => $value) {
if (! in_array($key, $selected)) { // display non-selected modules
if (is_base_module($key, $scope)) { // mark base modules
$availOptions[$value . " (" . $key . ")(*)"] = $key;
}
else {
$availOptions[$value . " (" . $key . ")"] = $key;
}
}
}
echo "</fieldset>\n";
echo "<br>\n";
// add account module selection
$container->addElement(new htmlSubTitle($title, '../../graphics/' . $scope . '.png'), true);
$container->addElement(new htmlOutputText(_("Selected modules")));
// add/remove buttons
$buttonContainer = new htmlTable();
$buttonContainer->rowspan = 2;
if (sizeof($availOptions) > 0) {
$addButton = new htmlButton($scope . "_add", 'back.gif', true);
$addButton->setTitle(_('Add'));
$buttonContainer->addElement($addButton, true);
}
if (sizeof($selOptions) > 0) {
$remButton = new htmlButton($scope . "_remove", 'forward.gif', true);
$remButton->setTitle(_('Remove'));
$buttonContainer->addElement($remButton, true);
}
$container->addElement($buttonContainer);
$container->addElement(new htmlOutputText(_("Available modules")), true);
// selected modules
if (sizeof($selOptions) > 0) {
$selSelect = new htmlSelect($scope . '_selected', $selOptions, array(), 5);
$selSelect->setTransformSingleSelect(false);
$selSelect->setMultiSelect(true);
$selSelect->setHasDescriptiveElements(true);
$selSelect->setSortElements(false);
$container->addElement($selSelect);
}
else {
$container->addElement(new htmlOutputText(''));
}
// available modules
if (sizeof($availOptions) > 0) {
$availSelect = new htmlSelect($scope . "_available", $availOptions, array(), 5);
$availSelect->setTransformSingleSelect(false);
$availSelect->setHasDescriptiveElements(true);
$availSelect->setMultiSelect(true);
$container->addElement($availSelect, true);
}
// spacer to next account type
$container->addElement(new htmlSpacer(null, '30px'), true);
}
/**

View File

@ -157,9 +157,9 @@ for ($i = 0; $i < sizeof($errorsToDisplay); $i++) call_user_func_array('StatusMe
echo ("<form action=\"conftypes.php\" method=\"post\">\n");
echo '<div style="text-align: right;">';
echo "<button id=\"saveButton\" name=\"saveSettings\" type=\"submit\">" . _('Save') . "</button>";
echo "<button id=\"saveButton\" name=\"saveSettings\">" . _('Save') . "</button>";
echo "&nbsp;";
echo "<button id=\"cancelButton\" name=\"cancelSettings\" type=\"submit\">" . _('Cancel') . "</button>";
echo "<button id=\"cancelButton\" name=\"cancelSettings\">" . _('Cancel') . "</button>";
echo "<br><br>\n";
echo '</div>';
@ -199,6 +199,7 @@ echo '</ul>';
jQuery(document).ready(function() {
jQuery('#edittypes').addClass('ui-tabs-selected');
jQuery('#edittypes').addClass('ui-state-active');
jQuery('#edittypes').addClass('userlist-bright');
jQuery('#saveButton').button({
icons: {
primary: 'saveButton'
@ -212,49 +213,49 @@ jQuery(document).ready(function() {
});
</script>
<div class="ui-tabs-panel ui-widget-content ui-corner-bottom">
<div class="ui-tabs-panel ui-widget-content ui-corner-bottom userlist-bright">
<?php
$container = new htmlTable();
// show available types
if (sizeof($availableTypes) > 0) {
echo "<fieldset><legend><b>" . _("Available account types") . "</b></legend>\n";
echo "<table>\n";
$container->addElement(new htmlSubTitle(_("Available account types")), true);
$availableContainer = new htmlTable();
foreach ($availableTypes as $key => $value) {
$icon = '<img alt="' . $value . '" src="../../graphics/' . $key . '.png">&nbsp;';
echo "<tr>\n";
echo "<td>$icon<b>" . $value . ": </b></td>\n";
echo "<td>" . getTypeDescription($key) . "</td>\n";
echo "<td><input type=\"submit\" name=\"add_" . $key ."\" title=\"" . _("Add") . "\" value=\" \"" .
" style=\"background-image: url(../../graphics/add.png);background-position: 2px center;background-repeat: no-repeat;width:24px;height:24px;background-color:transparent\"></td>\n";
echo "</tr>\n";
$availableContainer->addElement(new htmlImage('../../graphics/' . $key . '.png'));
$availableContainer->addElement(new htmlOutputText($value));
$availableContainer->addElement(new htmlSpacer('10px', null));
$availableContainer->addElement(new htmlOutputText(getTypeDescription($key)));
$button = new htmlButton('add_' . $key, 'add.png', true);
$button->setTitle(_("Add"));
$availableContainer->addElement($button, true);
}
echo "</table>\n";
echo "</fieldset>\n";
echo "<p><br><br></p>";
$availableContainer->addElement(new htmlSpacer(null, '20px'), true);
$container->addElement($availableContainer, true);
}
// show active types
if (sizeof($activeTypes) > 0) {
echo "<fieldset><legend><b>" . _("Active account types") . "</b></legend><br>\n";
$container->addElement(new htmlSubTitle(_("Active account types")), true);
$activeContainer = new htmlTable();
for ($i = 0; $i < sizeof($activeTypes); $i++) {
echo "<fieldset class=\"" . $activeTypes[$i] . "edit\">\n";
$icon = '<img alt="' . $activeTypes[$i] . '" src="../../graphics/' . $activeTypes[$i] . '.png">&nbsp;';
echo "<legend>" . $icon . "<b>" . getTypeAlias($activeTypes[$i]) . ": </b>" . getTypeDescription($activeTypes[$i]) . " " .
"<input type=\"submit\" name=\"rem_" . $activeTypes[$i] . "\" value=\" \" title=\"" . _("Remove this account type") . "\" " .
"style=\"background-image: url(../../graphics/del.png);background-position: 2px center;background-repeat: no-repeat;width:24px;height:24px;background-color:transparent\">" .
"</legend>";
echo "<br>\n";
echo "<table>\n";
// title
$activeContainer->addElement(new htmlImage('../../graphics/' . $activeTypes[$i] . '.png'));
$titleText = new htmlOutputText(getTypeAlias($activeTypes[$i]));
$titleText->setIsBold(true);
$activeContainer->addElement($titleText);
$activeContainer->addElement(new htmlSpacer('10px', null));
$activeContainer->addElement(new htmlOutputText(getTypeDescription($activeTypes[$i])), true);
// LDAP suffix
echo "<tr>\n";
echo "<td>" . _("LDAP suffix") . "</td>\n";
echo "<td><input type=\"text\" size=\"40\" name=\"suffix_" . $activeTypes[$i] . "\" value=\"" . $typeSettings['suffix_' . $activeTypes[$i]] . "\"></td>\n";
echo "<td>";
printHelpLink(getHelp('', '202'), '202');
echo "</td>\n";
echo "</tr>\n";
$suffixText = new htmlOutputText(_("LDAP suffix"));
$suffixText->colspan = 2;
$activeContainer->addElement($suffixText);
$activeContainer->addElement(new htmlSpacer('10px', null));
$suffixInput = new htmlInputField('suffix_' . $activeTypes[$i], $typeSettings['suffix_' . $activeTypes[$i]]);
$suffixInput->setFieldSize(40);
$activeContainer->addElement($suffixInput);
$activeContainer->addElement(new htmlHelpLink('202'), true);
// list attributes
if (isset($typeSettings['attr_' . $activeTypes[$i]])) {
$attributes = $typeSettings['attr_' . $activeTypes[$i]];
@ -262,19 +263,28 @@ if (sizeof($activeTypes) > 0) {
else {
$attributes = getDefaultListAttributes($activeTypes[$i]);
}
echo "<tr>\n";
echo "<td>" . _("List attributes") . "</td>\n";
echo "<td><input type=\"text\" size=\"40\" name=\"attr_" . $activeTypes[$i] . "\" value=\"" . $attributes . "\"></td>\n";
echo "<td>";
printHelpLink(getHelp('', '206'), '206');
echo "</td>\n";
echo "</tr>\n";
echo "</table>\n";
echo "</fieldset><br>\n";
$attrsText = new htmlOutputText(_("List attributes"));
$attrsText->colspan = 2;
$activeContainer->addElement($attrsText);
$activeContainer->addElement(new htmlSpacer('10px', null));
$attrsInput = new htmlInputField('attr_' . $activeTypes[$i], $attributes);
$attrsInput->setFieldSize(40);
$activeContainer->addElement($attrsInput);
$activeContainer->addElement(new htmlHelpLink('206'), true);
// delete button
$delButton = new htmlButton('rem_'. $activeTypes[$i], _("Remove this account type"));
$delButton->colspan = 5;
$delButton->setIconClass('deleteButton');
$activeContainer->addElement($delButton, true); //del.png
$activeContainer->addElement(new htmlSpacer(null, '40px'), true);
}
echo "</fieldset>\n";
$container->addElement($activeContainer, true);
}
$tabindex = 1;
parseHtml(null, $container, array(), false, $tabindex, 'user');
echo "<input type=\"hidden\" name=\"postAvailable\" value=\"yes\">\n";
echo ("</div></div></form>\n");

View File

@ -180,6 +180,7 @@ echo '</ul>';
jQuery(document).ready(function() {
jQuery('#moduleSettings').addClass('ui-tabs-selected');
jQuery('#moduleSettings').addClass('ui-state-active');
jQuery('#moduleSettings').addClass('userlist-bright');
jQuery('#saveButton').button({
icons: {
primary: 'saveButton'
@ -193,7 +194,7 @@ jQuery(document).ready(function() {
});
</script>
<div class="ui-tabs-panel ui-widget-content ui-corner-bottom">
<div class="ui-tabs-panel ui-widget-content ui-corner-bottom userlist-bright">
<?php