Commit 0f23fc3a authored by Carsten  Rose's avatar Carsten Rose
Browse files

#3232 Button individuelle 'on-change' Farbe definieren

BuildFormBootstrap.php, Store.php: conig.qfq.ini extended to hold new parameter, save button will be build with new attribute.
parent 64f0c031
......@@ -116,50 +116,52 @@ Setup a *report* to manage all *forms*: Create a Typo3 page and insert a content
config.qfq.ini
--------------
+-------------------------+-----------------------------------------+----------------------------------------------------------------------------+
| Keyword | Example | Description |
+=========================+=========================================+============================================================================+
| DB_USER | DB_USER=qfqUser | Credentials configured in MySQL |
+-------------------------+-----------------------------------------+----------------------------------------------------------------------------+
| DB_PASSWORD | DB_PASSWORD=12345678 | Credentials configured in MySQL |
+-------------------------+-----------------------------------------+----------------------------------------------------------------------------+
| DB_SERVER | DB_SERVER=localhost | Hostname of MySQL Server |
+-------------------------+-----------------------------------------+----------------------------------------------------------------------------+
| DB_NAME | DB_NAME=qfq_db | Database name |
+-------------------------+-----------------------------------------+----------------------------------------------------------------------------+
| DB_NAME_TEST | DB_NAME_TEST=qfq_db_test | Used during development of QFQ |
+-------------------------+-----------------------------------------+----------------------------------------------------------------------------+
| DB_INIT | DB_INIT=set names utf8 | Global init for using the database. |
+-------------------------+-----------------------------------------+----------------------------------------------------------------------------+
| SQL_LOG | SQL_LOG=sql.log | Filename to log SQL commands: relative to <ext_dir> or absolute. |
+-------------------------+-----------------------------------------+----------------------------------------------------------------------------+
| SQL_LOG_MODE | SQL_LOG_MODE=modify | *all*: every statement will be logged - this is a lot |
| | | *modify*: log only statements who change data |
+-------------------------+-----------------------------------------+----------------------------------------------------------------------------+
| SHOW_DEBUG_INFO | SHOW_DEBUG_INFO=auto | Possible values: auto|yes|no. For 'auto': If a BE User is logged in, |
| | | debug information will be shown on the fronend. |
+-------------------------+-----------------------------------------+----------------------------------------------------------------------------+
| CSS_LINK_CLASS_INTERNAL | CSS_LINK_CLASS_INTERNAL=internal | CSS class name of links which points to internal tagets |
+-------------------------+-----------------------------------------+----------------------------------------------------------------------------+
| CSS_LINK_CLASS_EXTERNAL | CSS_LINK_CLASS_EXTERNAL=external | CSS class name of links which points to internal tagets |
+-------------------------+-----------------------------------------+----------------------------------------------------------------------------+
| CSS_CLASS_QFQ_CONTAINER |CSS_CLASS_QFQ_CONTAINER=container | QFQ with own Bootstrap: 'container'. |
| | | QFQ already nested in Bootstrap of mainpage: <empty> |
+-------------------------+-----------------------------------------+----------------------------------------------------------------------------+
| CSS_CLASS_QFQ_FORM_PILL |CSS_CLASS_QFQ_FORM_PILL=qfq-color-grey-1 | Wrap around title bar for pills: CSS Class, typically a background color |
+-------------------------+-----------------------------------------+----------------------------------------------------------------------------+
| CSS_CLASS_QFQ_FORM_BODY |CSS_CLASS_QFQ_FORM_BODY=qfq-color-grey-2 | Wrap around formelements: CSS Class, typically a background color |
+-------------------------+-----------------------------------------+----------------------------------------------------------------------------+
| DATE_FORMAT | DATE_FORMAT= yyyy-mm-dd | Possible options: yyyy-mm-dd, dd.mm.yyyy |
+-------------------------+-----------------------------------------+----------------------------------------------------------------------------+
| FORM_DATA_PATTERN_ERROR |FORM_DATA_PATTERN_ERROR=please check pa. | Customizable error message used in validator.js. 'pattern' violation |
+-------------------------+-----------------------------------------+----------------------------------------------------------------------------+
| FORM_DATA_REQUIRED_ERROR|FORM_DATA_REQUIRED_ERROR=missing value | Customizable error message used in validator.js. 'required' fields |
+-------------------------+-----------------------------------------+----------------------------------------------------------------------------+
| FORM_DATA_MATCH_ERROR |FORM_DATA_MATCH_ERROR=type error | Customizable error message used in validator.js. 'match' retype mismatch |
+-------------------------+-----------------------------------------+----------------------------------------------------------------------------+
| FORM_DATA_ERROR |FORM_DATA_ERROR=generic error | Customizable error message used in validator.js. 'no specific' given |
+-------------------------+-----------------------------------------+----------------------------------------------------------------------------+
+-----------------------------+-----------------------------------------+----------------------------------------------------------------------------+
| Keyword | Example | Description |
+=============================+=========================================+============================================================================+
| DB_USER | DB_USER=qfqUser | Credentials configured in MySQL |
+-----------------------------+-----------------------------------------+----------------------------------------------------------------------------+
| DB_PASSWORD | DB_PASSWORD=12345678 | Credentials configured in MySQL |
+-----------------------------+-----------------------------------------+----------------------------------------------------------------------------+
| DB_SERVER | DB_SERVER=localhost | Hostname of MySQL Server |
+-----------------------------+-----------------------------------------+----------------------------------------------------------------------------+
| DB_NAME | DB_NAME=qfq_db | Database name |
+-----------------------------+-----------------------------------------+----------------------------------------------------------------------------+
| DB_NAME_TEST | DB_NAME_TEST=qfq_db_test | Used during development of QFQ |
+-----------------------------+-----------------------------------------+----------------------------------------------------------------------------+
| DB_INIT | DB_INIT=set names utf8 | Global init for using the database. |
+-----------------------------+-----------------------------------------+----------------------------------------------------------------------------+
| SQL_LOG | SQL_LOG=sql.log | Filename to log SQL commands: relative to <ext_dir> or absolute. |
+-----------------------------+-----------------------------------------+----------------------------------------------------------------------------+
| SQL_LOG_MODE | SQL_LOG_MODE=modify | *all*: every statement will be logged - this is a lot |
| | | *modify*: log only statements who change data |
+-----------------------------+-----------------------------------------+----------------------------------------------------------------------------+
| SHOW_DEBUG_INFO | SHOW_DEBUG_INFO=auto | Possible values: auto|yes|no. For 'auto': If a BE User is logged in, |
| | | debug information will be shown on the fronend. |
+-----------------------------+-----------------------------------------+----------------------------------------------------------------------------+
| CSS_LINK_CLASS_INTERNA L | CSS_LINK_CLASS_INTERNAL=internal | CSS class name of links which points to internal tagets |
+-----------------------------+-----------------------------------------+----------------------------------------------------------------------------+
| CSS_LINK_CLASS_EXTERNAL | CSS_LINK_CLASS_EXTERNAL=external | CSS class name of links which points to internal tagets |
+-----------------------------+-----------------------------------------+----------------------------------------------------------------------------+
| CSS_CLASS_QFQ_CONTAINER |CSS_CLASS_QFQ_CONTAINER=container | QFQ with own Bootstrap: 'container'. |
| | | QFQ already nested in Bootstrap of mainpage: <empty> |
+-----------------------------+-----------------------------------------+----------------------------------------------------------------------------+
| CSS_CLASS_QFQ_FORM_PILL |CSS_CLASS_QFQ_FORM_PILL=qfq-color-grey-1 | Wrap around title bar for pills: CSS Class, typically a background color |
+-----------------------------+-----------------------------------------+----------------------------------------------------------------------------+
| CSS_CLASS_QFQ_FORM_BODY |CSS_CLASS_QFQ_FORM_BODY=qfq-color-grey-2 | Wrap around formelements: CSS Class, typically a background color |
+-----------------------------+-----------------------------------------+----------------------------------------------------------------------------+
| DATE_FORMAT | DATE_FORMAT= yyyy-mm-dd | Possible options: yyyy-mm-dd, dd.mm.yyyy |
+-----------------------------+-----------------------------------------+----------------------------------------------------------------------------+
| FORM_DATA_PATTERN_ERROR |FORM_DATA_PATTERN_ERROR=please check pa. | Customizable error message used in validator.js. 'pattern' violation |
+-----------------------------+-----------------------------------------+----------------------------------------------------------------------------+
| FORM_DATA_REQUIRED_ERROR |FORM_DATA_REQUIRED_ERROR=missing value | Customizable error message used in validator.js. 'required' fields |
+-----------------------------+-----------------------------------------+----------------------------------------------------------------------------+
| FORM_DATA_MATCH_ERROR |FORM_DATA_MATCH_ERROR=type error | Customizable error message used in validator.js. 'match' retype mismatch |
+-----------------------------+-----------------------------------------+----------------------------------------------------------------------------+
| FORM_DATA_ERROR |FORM_DATA_ERROR=generic error | Customizable error message used in validator.js. 'no specific' given |
+-----------------------------+-----------------------------------------+----------------------------------------------------------------------------+
| FORM_BUTTON_ON_CHANGE_CLASS | FORM_BUTTON_ON_CHANGE_CLASS=alert-info btn-info | Color for save button after modification |
+-----------------------------+-----------------------------------------+----------------------------------------------------------------------------+
......
......@@ -621,6 +621,8 @@ parameter
+------------------------+--------+----------------------------------------------------------------------------------------------------------+
| data-error | string | If none specific is defined: Text for error message used for all FormElements of current form |
+------------------------+--------+----------------------------------------------------------------------------------------------------------+
| buttonOnChangeClass | string | Color for save button after user modified some content or current form. E.g.: 'btn-info alert-info' +
+------------------------+--------+----------------------------------------------------------------------------------------------------------+
* Example:
......
......@@ -13,7 +13,7 @@ Changes
'templateGroup', 'beforeLoad', 'beforeSave', 'beforeInsert', 'beforeUpdate', 'beforeDelete', 'afterLoad', 'afterSave',
'afterInsert', 'afterUpdate', 'afterDelete', 'sendMail' ) CHARACTER SET utf8 COLLATE utf8_general_ci NOT NULL DEFAULT 'text';
* Play 'sql/formEditor.sql' - this replaces the existing formEditor (any changes will be lost).
* Play 'typo3conf/ext/qfq/sql/formEditor.sql' - this replaces the existing formEditor (any changes will be lost).
Features
......
......@@ -154,7 +154,7 @@ class BuildFormBootstrap extends AbstractBuildForm {
$toolTip .= PHP_EOL . "table = '" . $this->formSpec[F_TABLE_NAME] . "'" . PHP_EOL . "r = '" . $recordId . "'";
}
$buttonSave = $this->buildButtonCode('save-button', $toolTip, GLYPH_ICON_CHECK);
$buttonSave = $this->buildButtonCode('save-button', $toolTip, GLYPH_ICON_CHECK, '', $this->formSpec[F_BUTTON_ON_CHANGE_CLASS]);
}
// Button: Close
......@@ -212,13 +212,13 @@ class BuildFormBootstrap extends AbstractBuildForm {
/**
* Creates a button with the given attributes. If there is no $icon given, render the button without glyph.
*
* @param $id
* @param $title
* @param $icon
* @param string $id
* @param string $title
* @param string $icon
* @param string $disabled
* @return string
*/
private function buildButtonCode($id, $title, $icon, $disabled = '') {
private function buildButtonCode($id, $title, $icon, $disabled = '', $buttonOnChangeClass = '') {
$element = "<span class='glyphicon $icon'></span>";
$classAdd = "navbar-btn";
......@@ -228,7 +228,10 @@ class BuildFormBootstrap extends AbstractBuildForm {
$classAdd = '';
}
return "<button id='$id' type='button' class='btn btn-default $classAdd $disabled' " . Support::doAttribute('title', $title) . ">$element</button>";
$class = Support::doAttribute('class', ["btn btn-default", $classAdd]);
$onChange = Support::doAttribute('data-class-on-change', $buttonOnChangeClass);
$title = Support::doAttribute('title', $title);
return "<button id='$id' type='button' $class $onChange $title $disabled>$element</button>";
}
/**
......@@ -328,7 +331,7 @@ class BuildFormBootstrap extends AbstractBuildForm {
if ($this->formSpec[F_SUBMIT_BUTTON_TEXT] !== '') {
$buttonText = $this->formSpec[F_SUBMIT_BUTTON_TEXT];
$htmlElement = $this->buildButtonCode('save-button', $buttonText, '');
$htmlElement = $this->buildButtonCode('save-button', $buttonText, '', '', $this->formSpec[F_BUTTON_ON_CHANGE_CLASS]);
$html .= $this->wrapItem(WRAP_SETUP_LABEL, '');
$html .= $this->wrapItem(WRAP_SETUP_INPUT, $htmlElement);
......
......@@ -311,6 +311,8 @@ const SYSTEM_FORM_BS_LABEL_COLUMNS = 'FORM_BS_LABEL_COLUMNS';
const SYSTEM_FORM_BS_INPUT_COLUMNS = 'FORM_BS_INPUT_COLUMNS';
const SYSTEM_FORM_BS_NOTE_COLUMNS = 'FORM_BS_NOTE_COLUMNS';
const SYSTEM_FORM_BUTTON_ON_CHANGE_CLASS = 'FORM_BUTTON_ON_CHANGE_CLASS';
// computed automatically during runtime
const SYSTEM_PATH_EXT = 'EXT_PATH';
const SYSTEM_SITE_PATH = 'SITE_PATH';
......@@ -469,6 +471,7 @@ const F_EXTRA_DELETE_FORM = 'extraDeleteForm';
const F_FINAL_DELETE_FORM = 'finalDeleteForm';
const F_SUBMIT_BUTTON_TEXT = 'submitButtonText';
const F_BUTTON_ON_CHANGE_CLASS = 'buttonOnChangeClass';
const F_CLASS = 'class';
const F_CLASS_PILL = 'classPill';
......
......@@ -528,6 +528,7 @@ class QuickFormQuery {
F_CLASS,
F_CLASS_PILL,
F_CLASS_BODY,
F_BUTTON_ON_CHANGE_CLASS,
];
// By definition: existing vars which are empty, means: EMPTY - do not use any default!
......@@ -560,6 +561,7 @@ class QuickFormQuery {
private function initForm(array $config) {
Support::setIfNotSet($config, F_EXTRA_DELETE_FORM, '');
Support::setIfNotSet($config, F_SUBMIT_BUTTON_TEXT, '');
Support::setIfNotSet($config, F_BUTTON_ON_CHANGE_CLASS, '');
return $config;
}
......
......@@ -199,6 +199,7 @@ class Store {
Support::setIfNotSet($config, F_BS_NOTE_COLUMNS, '3');
Support::setIfNotSet($config, F_CLASS_PILL, 'qfq-color-grey-1');
Support::setIfNotSet($config, F_CLASS_BODY, 'qfq-color-grey-2');
Support::setIfNotSet($config, F_BUTTON_ON_CHANGE_CLASS, 'btn-info alert-info');
$config = self::doSystemPath($config);
......@@ -230,6 +231,7 @@ class Store {
[SYSTEM_CSS_CLASS_QFQ_FORM, F_CLASS],
[SYSTEM_CSS_CLASS_QFQ_FORM_PILL, F_CLASS_PILL],
[SYSTEM_CSS_CLASS_QFQ_FORM_BODY, F_CLASS_BODY],
[SYSTEM_FORM_BUTTON_ON_CHANGE_CLASS, F_BUTTON_ON_CHANGE_CLASS],
];
foreach ($setting as $row) {
......
......@@ -238,7 +238,7 @@ VALUES
(2, 'bsLabelColumns', 'BS Label Columns', 'show', 'text', 'all', 'native', 410, 0, 255, '', '', '', '', '', 102, '', 'no', '', '', '', '', '{{bsLabelColumns:Y}}'),
(2, 'bsInputColumns', 'BS Input Columns', 'show', 'text', 'all', 'native', 420, 0, 255, '', '', '', '', '', 102, '', 'no', '', '', '', '', '{{bsInputColumns:Y}}'),
(2, 'bsNoteColumns', 'BS Note Columns', 'show', 'text', 'all', 'native', 430, 0, 255, '', '', '', '', '', 102, '', 'no', '', '', '', '', '{{bsNoteColumns:Y}}'),
(2, 'labelInputNote', 'Label / Input / Note', 'show', 'checkbox', 'alnumx', 'native', 440, 0, 10, '', '', '', '', '', 102, '', 'no', '', '', '', '', ''),
(2, 'rowLabelInputNote', 'Label / Input / Note', 'show', 'checkbox', 'alnumx', 'native', 440, 0, 10, '', '', '', '', '', 102, '', 'no', '', '', '', '', ''),
(2, 'maxLength', 'Maxlength', 'show', 'text', 'all', 'native', 450, 0, 255, '', '', '', '', '', 102, '', 'no', '', '', '', '', ''),
(2, 'note', 'Note', 'show', 'editor', 'all', 'native', 460, '', 255, '', '', '', '', 'editor-plugins=code link table textcolor textpattern\neditor-toolbar=code | styleselect link table | bullist numlist | forecolor backcolor bold italic\neditor-menubar=false\neditor-statusbar=false', 102, '', 'no', '', '', '', '', ''),
(2, 'tooltip', 'Tooltip', 'show', 'text', 'all', 'native', 470, 0, 255, '', '', '', '', '', 102, '', 'no', '', '', '', '', ''),
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment