ManifestWebDesign / angular-gridster

An implementation of gridster-like widgets for Angular JS
http://manifestwebdesign.github.io/angular-gridster/
MIT License
964 stars 394 forks source link

wrong rowHeight ratio #504

Open tasiot opened 6 years ago

tasiot commented 6 years ago

When using margin and rowHeight as "*1.4" or "/1.4", block don't respect this ratio. Indeed, rowHeight is calculated by curColWidth but it includes a margin, so ratio is no correctly calculated.

Solution consists to substract margin in curColWidth, calculate curRowHeight and add margin in curRowHeight.

if (gridster.colWidth === 'auto') {
    gridster.curColWidth = (gridster.curWidth + (gridster.outerMargin ? -gridster.margins[0] : gridster.margins[0])) / gridster.columns;
} else {
    gridster.curColWidth = gridster.colWidth;
}
var colWidthNoMargin = gridster.curColWidth - gridster.margins[0];

gridster.curRowHeight = gridster.rowHeight;
if (typeof gridster.rowHeight === 'string') {
    if (gridster.rowHeight === 'match') {
        gridster.curRowHeight = (gridster.curColWidth);
    } else if (gridster.rowHeight.indexOf('*') !== -1) {
        gridster.curRowHeight = (colWidthNoMargin * gridster.rowHeight.replace('*', '').replace(' ', '') + gridster.margins[1]);
    } else if (gridster.rowHeight.indexOf('/') !== -1) {
        gridster.curRowHeight = (colWidthNoMargin / gridster.rowHeight.replace('/', '').replace(' ', '') + gridster.margins[1]);
    }
}