pengyuthon/odoo_source
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[IMP] web_editor: limit the number of rows added in a grid on drag

Browse Source 
When dragging a grid item downwards in a grid, an infinite number of
rows can be added. This is unconvenient because it is difficult to
escape a grid if the snippet is "container-fluid" for example.

This commit limits the number of rows that can be added at once when
dragging downwards. The limit is fixed to 10 rows. Of course, it is not
a total limit, this means that after dropping, if the grid item is
dragged again, 10 additional rows can be added.

task-2973198

X-original-commit: 888f522aa812136f10af1c5fad8f17eea0c3b5b6
Part-of: odoo/odoo#102525
This commit is contained in:
Soukéina Bojabza
2022-10-06 23:14:41 +02:00
committed by qsm-odoo
parent f926559823
commit f9e00bf2ba
2 changed files with 15 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
addons/web_editor/static/src/js/common/grid_layout_utils.js
+2
View File
@@ -3,6 +3,8 @@
import {qweb} from 'web.core';
const rowSize = 50; // 50px.
// Maximum number of rows that can be added when dragging a grid item.
export const additionalRowLimit = 10;
/**
* Returns the grid properties: rowGap, rowSize, columnGap and columnSize.
addons/web_editor/static/src/js/editor/snippets.editor.js
+13 -4
View File
@@ -1537,11 +1537,20 @@ var SnippetEditor = Widget.extend({
const dropzoneEl = this.dragState.dropzoneEl;
const rowOverflow = Math.round((bottom - currentHeight) / (gridProp.rowSize + gridProp.rowGap));
const updateRows = bottom > currentHeight || bottom <= currentHeight && bottom > startingHeight;
const rowCount = Math.max(rowEl.dataset.rowCount, this.dragState.columnRowCount);
const maxRowEnd = rowCount + gridUtils.additionalRowLimit + 1;
if (Math.abs(rowOverflow) >= 1 && updateRows) {
const dropzoneEnd = parseInt(dropzoneEl.style.gridRowEnd);
dropzoneEl.style.gridRowEnd = dropzoneEnd + rowOverflow;
backgroundGridEl.style.gridRowEnd = dropzoneEnd + rowOverflow;
this.dragState.currentHeight += rowOverflow * (gridProp.rowSize + gridProp.rowGap);
if (rowEnd <= maxRowEnd) {
const dropzoneEnd = parseInt(dropzoneEl.style.gridRowEnd);
dropzoneEl.style.gridRowEnd = dropzoneEnd + rowOverflow;
backgroundGridEl.style.gridRowEnd = dropzoneEnd + rowOverflow;
this.dragState.currentHeight += rowOverflow * (gridProp.rowSize + gridProp.rowGap);
} else {
// Don't add new rows if we have reached the limit.
dropzoneEl.style.gridRowEnd = maxRowEnd;
backgroundGridEl.style.gridRowEnd = maxRowEnd;
this.dragState.currentHeight = (maxRowEnd - 1) * (gridProp.rowSize + gridProp.rowGap) - gridProp.rowGap;
}
}
}
});