| 1 | {"version":3,"file":"reorder.js","sources":["../../../../src/tile-layout/strategies/reorder.ts"],"sourcesContent":["import { StrategyInterface, TilePositionInfo, DragState } from '../model';\nimport * as TilesTableUtils from '../table-utils/tiles-table';\nimport * as TableUtils from '../table-utils/table';\nimport * as TilesUtils from '../table-utils/tiles';\n\n/**\n * Calculates the new table configuration while the tiles are moving\n * @param offsetX\n * @param offsetY\n * @returns\n */\nconst reorder: StrategyInterface = {\n onDragMove: ({ offsetX, offsetY, config, state, table, canAcceptDrop }) => {\n const { elementHeight, elementWidth } = config;\n const {\n draggingTile,\n dragPosition,\n dropTargetTile,\n droppable,\n start,\n tiles,\n } = state;\n\n console.log('DRAG MOVE');\n\n if (!draggingTile || !dragPosition || !start || !tiles) return;\n\n const getInsertionPoint = <T>(\n tiles: TilePositionInfo<T>[],\n touchPoint: 'left' | 'right',\n touchedTile: TilePositionInfo<T>\n ) => {\n const tilePosition = tiles.findIndex(\n tile => tile.data === touchedTile?.data\n );\n if (touchPoint === 'left') {\n const leftTile =\n tilePosition - 1 >= 0 ? tiles[tilePosition - 1] : undefined;\n if (leftTile === draggingTile) return undefined;\n return {\n insertionPoint: {\n right: touchedTile,\n left: leftTile?.row === touchedTile.row ? leftTile : undefined,\n },\n };\n } else {\n const rightTile =\n tilePosition + 1 < tiles.length ? tiles[tilePosition + 1] : undefined;\n if (rightTile === draggingTile) return undefined;\n return {\n insertionPoint: {\n left: touchedTile,\n right: rightTile?.row === touchedTile.row ? rightTile : undefined,\n },\n };\n }\n };\n\n const x = start.col * elementWidth + offsetX + dragPosition.x;\n const y = start.row * elementHeight + offsetY + dragPosition.y;\n\n //find the position of the tile in the grid\n const cell = TableUtils.pointToLocation(table, x, y, config);\n const tsize = TableUtils.tableSize(table);\n\n //console.log('data:', { x, y, cell, start, draggingTile });\n\n //try to see if we're touching a hot point\n //find the touched tile within the move\n\n const touchedTile = table[cell.row][cell.col];\n if (!touchedTile || touchedTile.data === draggingTile.data) return;\n\n //get the touchpoint of the touched tile\n const touchPoint = TilesUtils.getTileTouchPoint(\n touchedTile,\n touchedTile,\n {\n x,\n y,\n },\n config\n );\n if (!touchPoint) return;\n\n //console.log('HIT TOUCHPOINT', { table, tiles });\n console.log('touch point:', touchPoint);\n\n if (touchPoint === 'center') {\n if (touchedTile === dropTargetTile)\n return {\n dropTargetTile,\n droppable,\n };\n if (canAcceptDrop(draggingTile, touchedTile))\n return {\n dropTargetTile: touchedTile,\n droppable: true,\n };\n return;\n }\n\n //apply calculation only if touching left or right areas\n if (touchPoint !== 'right' && touchPoint !== 'left') return;\n\n //if the touch point is in the bottom of the cell, pick the adjacent cell\n if (touchedTile.row !== cell.row) {\n const adjacentCol =\n touchPoint === 'left' ? cell.col - 1 : cell.col + touchedTile.colSpan;\n if (adjacentCol < 0 || adjacentCol > tsize.cols) return;\n const adjacentTile = table[cell.row][adjacentCol];\n if (!adjacentTile) return;\n\n const shiftedInsertionPoint = getInsertionPoint(\n tiles,\n touchPoint === 'left' ? 'right' : 'left',\n adjacentTile\n )?.insertionPoint;\n console.log('SHIFTING: ', { shiftedInsertionPoint, touchPoint });\n\n return {\n insertionPoint: {\n left:\n touchPoint === 'left' ? shiftedInsertionPoint?.right : undefined,\n right:\n touchPoint === 'right' ? shiftedInsertionPoint?.left : undefined,\n },\n };\n }\n\n return getInsertionPoint(tiles, touchPoint, touchedTile);\n },\n\n onDragEnd: ({ state }) => {\n const { insertionPoint, draggingTile, tiles } = state;\n console.log('Drag end start:', {\n insertionPoint,\n draggingTile,\n tiles,\n });\n\n if (!tiles || !draggingTile || !insertionPoint) return;\n const newTiles = tiles.filter(tile => tile.data !== draggingTile.data);\n const { left, right } = insertionPoint;\n\n const insertionLeftIdx = left\n ? newTiles.findIndex(tile => tile.data === left.data) + 1\n : -1;\n const insertionRightIdx = right\n ? newTiles.findIndex(tile => tile.data === right.data)\n : -1;\n\n const insertionIndex =\n insertionLeftIdx > 0 ? insertionLeftIdx : insertionRightIdx;\n if (insertionIndex < 0) newTiles.push(draggingTile);\n else {\n newTiles.splice(insertionIndex, 0, draggingTile);\n }\n console.log('Drag end:', {\n insertionPoint,\n insertionLeftIdx,\n insertionRightIdx,\n draggingTile,\n tiles,\n newTiles,\n });\n\n return { tiles: newTiles };\n },\n};\n\nexport default reorder;\n"],"names":["TableUtils.pointToLocation","TableUtils.tableSize","TilesUtils.getTileTouchPoint"],"mappings":"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"} |
|---|
