responsive self service

This commit is contained in:
Roland Gruber 2015-08-02 17:33:53 +00:00
parent d7f82c768a
commit 981626370b
1 changed files with 87 additions and 8 deletions

View File

@ -2343,6 +2343,8 @@ class htmlImage extends htmlElement {
private $height; private $height;
/** alt text */ /** alt text */
private $alt; private $alt;
/** title */
private $title;
/** /**
* Constructor. * Constructor.
@ -2352,11 +2354,12 @@ class htmlImage extends htmlElement {
* @param int $height image height (optional, default original size) * @param int $height image height (optional, default original size)
* @param String $alt alt text (optional) * @param String $alt alt text (optional)
*/ */
function __construct($path, $width = null, $height = null, $alt = ' ') { function __construct($path, $width = null, $height = null, $alt = ' ', $title = null) {
$this->path = htmlspecialchars($path); $this->path = htmlspecialchars($path);
$this->width = $width; $this->width = $width;
$this->height = $height; $this->height = $height;
$this->alt = htmlspecialchars($alt); $this->alt = htmlspecialchars($alt);
$this->title = $title;
} }
/** /**
@ -2381,11 +2384,15 @@ class htmlImage extends htmlElement {
$height = ' height="' . $this->height . '"'; $height = ' height="' . $this->height . '"';
} }
$alt = ' alt="' . $this->alt . '"'; $alt = ' alt="' . $this->alt . '"';
$title = '';
if (!empty($this->title)) {
$title = ' title="' . $this->title . '"';
}
$classes = ''; $classes = '';
if (!empty($this->cssClasses)) { if (!empty($this->cssClasses)) {
$classes = 'class="' . implode(' ', $this->cssClasses) . '"'; $classes = 'class="' . implode(' ', $this->cssClasses) . '"';
} }
echo '<img' . $path . $width . $height . $alt . $classes . ">\n"; echo '<img' . $path . $width . $height . $alt . $title . $classes . ">\n";
return array(); return array();
} }
@ -3258,12 +3265,14 @@ class htmlResponsiveRow extends htmlElement {
* *
* @param htmlElement $content content inside cell * @param htmlElement $content content inside cell
* @param int $numMobile number of columns for mobile view * @param int $numMobile number of columns for mobile view
* @param int $numTablet number of columns for tablet view * @param int $numTablet number of columns for tablet view (set to mobile if null)
* @param int $numDesktop number of columns for desktop view * @param int $numDesktop number of columns for desktop view (set to tablet if null)
* @param String $classes CSS classes separated by space * @param String $classes CSS classes separated by space
*/ */
public function add($content, $numMobile, $numTablet, $numDesktop, $classes = '') { public function add($content, $numMobile, $numTablet = null, $numDesktop = null, $classes = '') {
$this->addCell(new htmlResponsiveCell($content, $numMobile, $numTablet, $numDesktop, $classes)); $tabletCols = ($numTablet == null) ? $numMobile : $numTablet;
$desktopCols = ($numDesktop == null) ? $tabletCols : $numDesktop;
$this->addCell(new htmlResponsiveCell($content, $numMobile, $tabletCols, $tabletCols, $classes));
} }
/** /**
@ -3278,11 +3287,13 @@ class htmlResponsiveRow extends htmlElement {
* @return array List of input field names and their type (name => type) * @return array List of input field names and their type (name => type)
*/ */
public function generateHTML($module, $input, $values, $restricted, &$tabindex, $scope) { public function generateHTML($module, $input, $values, $restricted, &$tabindex, $scope) {
$return = array();
echo '<div class="row">'; echo '<div class="row">';
foreach ($this->cells as $cell) { foreach ($this->cells as $cell) {
$cell->generateHTML($module, $input, $values, $restricted, $tabindex, $scope); $return = array_merge($return, $cell->generateHTML($module, $input, $values, $restricted, $tabindex, $scope));
} }
echo '</div>'; echo '</div>';
return $return;
} }
} }
@ -3332,8 +3343,76 @@ class htmlResponsiveCell extends htmlElement {
$clDesktop = ($this->desktop > 0) ? 'large-' . $this->desktop : 'hide-for-large-only'; $clDesktop = ($this->desktop > 0) ? 'large-' . $this->desktop : 'hide-for-large-only';
echo '<div class="' . $clMobile . ' ' . $clTablet . ' ' . $clDesktop . ' columns ' . $this->classes . '">'; echo '<div class="' . $clMobile . ' ' . $clTablet . ' ' . $clDesktop . ' columns ' . $this->classes . '">';
$this->content->generateHTML($module, $input, $values, $restricted, $tabindex, $scope); $return = $this->content->generateHTML($module, $input, $values, $restricted, $tabindex, $scope);
echo '</div>'; echo '</div>';
return $return;
}
}
/**
* A responsive input field that combines label, input field and help.
*
* @package metaHTML
*/
class htmlResponsiveInputField extends htmlInputField {
/** Descriptive label */
private $label;
/** help ID */
private $helpID;
/** generate HTML of parent class */
private $generateParent = false;
/**
* Constructor
*
* @param String $label descriptive label
* @param String $fieldName unique field name
* @param String $fieldValue value of input field (optional)
* @param String $helpID help ID (optional)
*/
function __construct($label, $fieldName, $fieldValue = null, $helpID = null) {
parent::__construct($fieldName, $fieldValue);
$this->label = $label;
$this->helpID = $helpID;
$this->fieldSize = null;
}
/**
* Prints the HTML code for this element.
*
* @param string $module Name of account module
* @param array $input List of meta-HTML elements
* @param array $values List of values which override the defaults in $input (name => value)
* @param boolean $restricted If true then no buttons will be displayed
* @param integer $tabindex Start value of tabulator index for input fields
* @param string $scope Account type
* @return array List of input field names and their type (name => type)
*/
function generateHTML($module, $input, $values, $restricted, &$tabindex, $scope) {
if ($this->generateParent) {
return parent::generateHTML($module, $input, $values, $restricted, $tabindex, $scope);
}
$this->generateParent = true;
$row = new htmlResponsiveRow();
// label text
$labelGroup = new htmlGroup();
$labelGroup->addElement(new htmlOutputText($this->label));
if ($this->required) {
$graphicsPath = "../../graphics";
if (is_dir("../graphics")) $graphicsPath = "../graphics";
$labelGroup->addElement(new htmlImage($graphicsPath . '/required.png', 16, 16, _('required'), _('required')));
}
$row->add($labelGroup, 12, 6, 6, 'tabletPlus-align-right mobile-align-left');
// input field
$fieldGroup = new htmlGroup();
$fieldGroup->addElement($this);
if (!empty($this->helpID)) {
$fieldGroup->addElement(new htmlHelpLink($this->helpID));
}
$row->add($fieldGroup, 12, 6, 6, 'tabletPlus-align-left');
return $row->generateHTML($module, $input, $values, $restricted, $tabindex, $scope);
} }
} }