diff --git a/src/views/color/ColorPicker.vue b/src/views/color/ColorPicker.vue index c596e06..43c7da6 100644 --- a/src/views/color/ColorPicker.vue +++ b/src/views/color/ColorPicker.vue @@ -10,7 +10,7 @@
@@ -59,28 +59,48 @@ export default class MyColorPicker extends Vue this.palette[i][j] = '' } + dragging = {i: 0, j: 0} + + paletteDragStart(i: number, j: number): void + { + this.dragging = {i, j} + } + dropPalette(e: DragEvent, i: number, j: number): void { - console.log('Drop') - console.log(e) - console.log('' + i + ' ' + j) - return + const fromI = this.dragging.i * 10 + this.dragging.j + const toI = i * 10 + j + if (toI == fromI) + { + console.error('Drop on self') + return + } + const incr = toI > fromI ? 1 : -1 + + const currentColor = this.palette[this.dragging.i][this.dragging.j] + for (let index of range(fromI, toI)) + { + const col = index % 10, row = Math.floor(index / 10) + const lastI = index + incr + const lastC = lastI % 10, lastR = Math.floor(lastI / 10) + console.log(lastR, lastC, 'TO', row, col) + this.palette[row][col] = this.palette[lastR][lastC] + } + this.palette[i][j] = currentColor } paletteDragEnter(e: DragEvent, i: number, j: number): void { + // TODO: Drag preview console.log('Drag enter') console.log(e) console.log('' + i + ' ' + j) - return + e.preventDefault() } paletteDragOver(e: DragEvent, i: number, j: number): void { - console.log('Drag over') - console.log(e) - console.log('' + i + ' ' + j) - return + e.preventDefault() } }