Commit 9738b34e authored by Carsten  Rose's avatar Carsten Rose
Browse files

DRAGNDROP.md, Manual.rst: more doc

DragAndDrop.php, QuickFormQuery.php: bug fixes
FillStoreForm.php: no FE on a Form now ok - necessary for dnd sort forms.
parent dcaa60c7
......@@ -1203,7 +1203,7 @@ Bug Fixes
* Dynamic Update has been broken since implementing of 'element-update' (#3180). Now both methods, 'element-update' and 'form-update' should be fine.
* qfq-bs.css.less: Fixed problem with 'typeahead input elements' not expanded to Bootstrap column width. Changed
Layout/Design Typeahead drop-down box. Add hoover for the drop-down box with a blue background
Layout/Design Typeahead drop-down box. Add hover for the drop-down box with a blue background
* AbstractBuildForm.php: #3374 - textarea elements now contains 'maxlength' attribute.
* BuildFormBootstrap.php: wrapping of optional 'submitButtonText' now done with the 'per form' values.
* typeahead.php: if there is an exception, the message body is sent as regular 'content' for the drop-down box. At the
......
......@@ -4,7 +4,9 @@
Initialize a dnd container by adding the class "qfq-dnd"
Set container object class to `class="qfq-dnd qfq-dnd-sort"`.
Add the data elements: `data-dnd-api="url"` and `data-dnd-key="key"`
Add the data elements: `data-dnd-api="url"` and `data-dnd-key="key"`.
For the children inside of the container (just the first children):
add `data-dnd-id` to a reference you can handle (probably record id).
......@@ -15,3 +17,6 @@ Request will be sent containing following GET variables:
* setTo = "after" or "before",
* hoverId = `data-dnd-id` id of the element the dragged element is now hovering, meaning before or after.
* hoverPosition = client internal position of currently hovered element.
Example: http://something/bla?dragId=uno&dragPosition=1&setTo=before&hoverId=tre&hoverPosition=3
\ No newline at end of file
......@@ -6218,6 +6218,54 @@ E.g.::
10.sql = SELECT "p:home&r=0|t:Home|c:qfq-100 qfq-left" AS _pagev
Drag and drop
-------------
Sort/order elements
^^^^^^^^^^^^^^^^
QFQ supports sort/order elements via HTML5 drag and drop together with QFQ API/DB calls.
Display the list of elements via a regular QFQ content record. Output: ::
<div class="qfq-dnd-sort" data-dnd-api="typo3conf/ext/qfq/qfq/api/dragAndDrop.php?s=badcaffee1234">
<div class="anyClass" id="<uniq1>" data-dnd-id="55">
Numbero Uno
</div>
<div class="anyClass" id="<uniq2>" data-dnd-id="18">
Numbero Deux
</div>
<div class="anyClass" id="<uniq3>" data-dnd-id="27">
Numbero Tre
</div>
<div class="anyClass" id="<uniq4>" data-dnd-id="534">
Numbero Quattro
</div>
<div class="anyClass" id="<uniq5>" data-dnd-id="67">
Numbero Cinge
</div>
<div class="anyClass" id="<uniq6>" data-dnd-id="101">
Numbero Siesta
</div>
</div>
An example QFQ report which generates those HTML: ::
10 {
sql = SELECT '<div class="anyClass" id="sort-', n.id,'" data-dnd-api="', n.id,'">' , n.id, ' / ', n.note, ' / ', n.ord, '</div>'
FROM Note AS n
WHERE n.grId=4
ORDER BY n.ord
head = <div class-"qfq-dnd" data-dnd-api="typo3conf/ext/qfq/qfq/api/dragAndDrop.php" data-dnd-key="{{'U:form=draganddrop|s|r:8' AS _link}}">
tail = </div>
}
Examples
--------
......
......@@ -595,6 +595,7 @@ class BuildFormBootstrap extends AbstractBuildForm {
fileDeleteUrl: '$apiDir/file.php?$actionDelete'
});
var qfqRecordList = new QfqNS.QfqRecordList('$apiDeletePhp');
})
</script>
......
......@@ -44,6 +44,7 @@ require_once(__DIR__ . '/BodytextParser.php');
require_once(__DIR__ . '/Delete.php');
require_once(__DIR__ . '/form/FormAction.php');
require_once(__DIR__ . '/form/Dirty.php');
require_once(__DIR__ . '/form/DragAndDrop.php');
/*
* Form will be called
......@@ -222,6 +223,7 @@ class QuickFormQuery
* @return string
* @throws CodeException
* @throws DbException
* @throws DownloadException
* @throws UserFormException
* @throws UserReportException
*/
......@@ -284,6 +286,7 @@ class QuickFormQuery
* @return array|string
* @throws CodeException
* @throws DbException
* @throws DownloadException
* @throws UserFormException
* @throws UserReportException
*/
......@@ -493,7 +496,7 @@ class QuickFormQuery
case FORM_DRAG_AND_DROP:
$formAction->elements($recordId, $this->feSpecAction, FE_TYPE_BEFORE_LOAD);
$dragAndDrop = new DragAndDrop();
$dragAndDrop = new DragAndDrop($this->formSpec);
$dragAndDrop->process($this->formSpec);
$formAction->elements($recordId, $this->feSpecAction, FE_TYPE_AFTER_LOAD);
......@@ -932,6 +935,7 @@ class QuickFormQuery
case FORM_SAVE:
case FORM_UPDATE:
case FORM_DELETE:
case FORM_DRAG_AND_DROP:
$store = STORE_SIP;
break;
default:
......@@ -1264,6 +1268,7 @@ class QuickFormQuery
* @return string
* @throws CodeException
* @throws DbException
* @throws DownloadException
* @throws UserFormException
* @throws UserReportException
*/
......@@ -1281,6 +1286,7 @@ class QuickFormQuery
* @return array
* @throws CodeException
* @throws DbException
* @throws DownloadException
* @throws UserFormException
* @throws UserReportException
*/
......@@ -1298,6 +1304,7 @@ class QuickFormQuery
* @return array
* @throws CodeException
* @throws DbException
* @throws DownloadException
* @throws UserFormException
* @throws UserReportException
*/
......@@ -1315,6 +1322,7 @@ class QuickFormQuery
* @return array
* @throws CodeException
* @throws DbException
* @throws DownloadException
* @throws UserFormException
* @throws UserReportException
*/
......
......@@ -40,6 +40,11 @@ class DragAndDrop {
*/
protected $evaluate = null; // copy of the loaded form
/**
* @var array
*/
private $formSpec = null;
/**
* @param array $formSpec F_TABLE_NAME, F_DRAG_AND_DROP_ORDER_SQL, F_DRAG_AND_DROP_INTERVAL
* @param bool|false $phpUnit
......@@ -50,11 +55,13 @@ class DragAndDrop {
*/
public function __construct(array $formSpec = array(), $phpUnit = false) {
$this->formSpec = $formSpec;
$dbIndex = DB_INDEX_DEFAULT; //TODO hier muss noch die aktuelle DB ermittelt werden (kann im Form angegeben sein) - Gerade im Formular FORM Editor genau testen!
$this->db = new Database($dbIndex);
$this->store = Store::getInstance('', $phpUnit);
$this->evaluate = new Evaluate($this->store, $this->db);
// $this->evaluate = new Evaluate($this->store, $this->db);
}
/**
......@@ -67,10 +74,6 @@ class DragAndDrop {
*/
public function process() {
if (empty($formSpec[F_DRAG_AND_DROP_ORDER_SQL])) {
throw new UserFormException('Missing definition of: ' . F_DRAG_AND_DROP_ORDER_SQL, ERROR_MISSING_DEFINITON);
}
$dragId = $this->store->getVar(DND_DRAG_ID, STORE_CLIENT, SANITIZE_ALLOW_ALNUMX);
// $dragPosition = $this->store->getVar(DND_DRAG_POSITION, STORE_CLIENT, SANITIZE_ALLOW_ALNUMX);
$setTo = $this->store->getVar(DND_SET_TO, STORE_CLIENT, SANITIZE_ALLOW_ALNUMX);
......@@ -78,17 +81,17 @@ class DragAndDrop {
// $hoverPosition = $this->store->getVar(DND_HOVER_POSITION, STORE_CLIENT, SANITIZE_ALLOW_ALNUMX);
$orderInterval = empty($formSpec[F_ORDER_INTERVAL]) ? 1 : $formSpec[F_ORDER_INTERVAL];
$orderColumn = empty($formSpec[F_ORDER_COLUMN]) ? F_ORDER_COLUMN_NAME : $formSpec[F_ORDER_COLUMN];
$orderInterval = empty($this->formSpec[F_ORDER_INTERVAL]) ? 1 : $this->formSpec[F_ORDER_INTERVAL];
$orderColumn = empty($this->formSpec[F_ORDER_COLUMN]) ? F_ORDER_COLUMN_NAME : $this->formSpec[F_ORDER_COLUMN];
$rows = $this->evaluate->parse($formSpec[F_DRAG_AND_DROP_ORDER_SQL]);
if (!is_array($rows)) {
return array();
// $rows = $this->evaluate->parse($formSpec[F_DRAG_AND_DROP_ORDER_SQL]);
if (!is_array($this->formSpec[F_DRAG_AND_DROP_ORDER_SQL])) {
return [];
}
$this->reorder($rows, $dragId, $setTo, $hoverId, $orderColumn, $orderInterval, $formSpec[F_TABLE_NAME]);
$this->reorder($this->formSpec[F_DRAG_AND_DROP_ORDER_SQL], $dragId, $setTo, $hoverId, $orderColumn, $orderInterval, $this->formSpec[F_TABLE_NAME]);
return $arr;
return [];
}
/**
......@@ -107,27 +110,27 @@ class DragAndDrop {
$ord = $orderInterval;
$ordDragOld = -1;
// Reorder. Get index for 'drag' and 'hoover'
// Reorder. Get index for 'drag' and 'hover'
foreach ($rows as $key => $row) {
// the dragged element: skip old position.
if ($rows[DND_COLUMN_ID] == $dragId) {
$ordDragOld = $rows[DND_COLUMN_ORD];
if ($row[DND_COLUMN_ID] == $dragId) {
$ordDragOld = $row[DND_COLUMN_ORD];
continue;
}
// the dragged element: new position.
if ($rows[DND_COLUMN_ID] == $hoverId) {
if ($row[DND_COLUMN_ID] == $hoverId) {
switch ($setTo) {
case DND_SET_TO_BEFORE:
$this->setNewOrder($tableName, $orderColumn, $dragId, $ordDragOld, $ord);
$ord += $orderInterval;
$this->setNewOrder($tableName, $orderColumn, $key, $rows[DND_COLUMN_ORD], $ord);
$this->setNewOrder($tableName, $orderColumn, $row[DND_COLUMN_ID], $row[DND_COLUMN_ORD], $ord);
break;
case DND_SET_TO_AFTER:
$this->setNewOrder($tableName, $orderColumn, $key, $rows[DND_COLUMN_ORD], $ord);
$this->setNewOrder($tableName, $orderColumn, $row[DND_COLUMN_ID], $row[DND_COLUMN_ORD], $ord);
$ord += $orderInterval;
$this->setNewOrder($tableName, $orderColumn, $dragId, $ordDragOld, $ord);
break;
......@@ -136,7 +139,7 @@ class DragAndDrop {
throw new CodeException('Unkown setTo string', $setTo, ERROR_UNKNOWN_TOKEN);
}
} else {
$this->setNewOrder($tableName, $orderColumn, $key, $rows[DND_COLUMN_ORD], $ord);
$this->setNewOrder($tableName, $orderColumn, $row[DND_COLUMN_ID], $row[DND_COLUMN_ORD], $ord);
}
$ord += $orderInterval;
}
......@@ -158,6 +161,6 @@ class DragAndDrop {
return;
}
$this->db->sql("UPDATE ? SET ?=? WHERE id=?", [$tableName, $orderColumn, $ordNew, $id]);
$this->db->sql("UPDATE $tableName SET $orderColumn=? WHERE id=?", ROW_REGULAR, [$ordNew, $id]);
}
}
\ No newline at end of file
......@@ -81,7 +81,7 @@ class FillStoreForm {
// Preparation for Log, Debug
$this->store->setVar(SYSTEM_FORM, $formName, STORE_SYSTEM);
$feSpecNative = $this->dbArray[$this->dbIndexQfq]->sql(SQL_FORM_ELEMENT_SIMPLE_ALL_CONTAINER, ROW_EXPECT_GE_1, [$formName],
$feSpecNative = $this->dbArray[$this->dbIndexQfq]->sql(SQL_FORM_ELEMENT_SIMPLE_ALL_CONTAINER, ROW_REGULAR, [$formName],
'Form or FormElements not found: ' . ERROR_FORM_NOT_FOUND);
HelperFormElement::explodeParameterInArrayElements($feSpecNative, FE_PARAMETER);
......
Supports Markdown
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