diff --git a/app/javascript/controllers/divider_controller.js b/app/javascript/controllers/divider_controller.js index 1d4436643..e93b98a58 100644 --- a/app/javascript/controllers/divider_controller.js +++ b/app/javascript/controllers/divider_controller.js @@ -13,7 +13,7 @@ export default class extends Controller { } install() { - this.#positionDividerBefore(this.startCountValue) + this.#moveDividerTo(this.startCountValue) this.dividerTarget.classList.add(this.positionedClass) } @@ -25,17 +25,9 @@ export default class extends Controller { } } - moveDivider(event) { - if (event.target.nodeName != DIVIDER_ITEM_NODE_NAME) return - - const targetIndex = this.#items.indexOf(event.target) - - if (targetIndex != this.#dividerIndex && targetIndex <= this.maxCountValue) { - if (this.#dividerIndex < targetIndex) { - this.#positionDividerAfter(targetIndex) - } else { - this.#positionDividerBefore(targetIndex) - } + moveDivider({ target }) { + if (target.nodeName == DIVIDER_ITEM_NODE_NAME) { + this.#moveDividerTo(this.#items.indexOf(target)) } } @@ -48,6 +40,16 @@ export default class extends Controller { if (isDroppable) event.preventDefault() } + #moveDividerTo(index) { + if (index <= this.maxCountValue) { + if (this.#dividerIndex < index) { + this.#positionDividerAfter(index) + } else if (this.#dividerIndex > index) { + this.#positionDividerBefore(index) + } + } + } + #positionDividerBefore(index) { const position = Math.max(index, 1) this.#items[position].before(this.dividerTarget) diff --git a/app/views/bubbles/list/_divider.html.erb b/app/views/bubbles/list/_divider.html.erb index f11a6b033..633408719 100644 --- a/app/views/bubbles/list/_divider.html.erb +++ b/app/views/bubbles/list/_divider.html.erb @@ -6,7 +6,7 @@