Trello 如何处理卡片、列表、清单等的重新排列

Question

我正在制作一个必须列出可以重新排列的事物的应用程序。

Trello 做得很完美，它允许我们重新安排一切，从列表到卡片和清单。它是如何做到的？

我检查了他们在重新排列时发出的 API 调用，结果发现他们从前端发送了一个密钥 "pos"。每次我重新排列卡片时，该卡片的 ID 都会用于 PUT 请求并更新 "pos" 值。

这是重新排列前的列表：

{
    "id": "553750612a364775ded5f841",
    "name": "test again",
    "closed": false,
    "idBoard": "55374f01f73ace7afec03698",
    "pos": 131071
}

我将它拖放到其他列表之前，对 https://trello.com/1/lists/553750612a364775ded5f841 进行了 API 调用，并发送了一个新的 pos:32767。响应如下：

{
    "id": "553750612a364775ded5f841",
    "name": "test again",
    "closed": false,
    "idBoard": "55374f01f73ace7afec03698",
    "pos": 32767.5
}

Trello 是怎么做到的？

Answer 1

每个项目都有一个 pos（一个 JavaScript 数字，所以是双精度浮点数）。然后，它们通过按 pos.

排序呈现

添加新项目时，pos 取决于它在列表中的位置：

列表底部 - 当前列表中的最大值 pos + 缓冲区（我认为使用了 1024）
列表顶部 - 当前列表中的最小值 pos 除以二
列表中间 - 两个相邻项目的 pos 的平均值

中间选项由客户指定； top/bottom 可以由客户端分配或作为字符串 "top" 或 "bottom" 传递给服务器，在这种情况下，服务器将执行逻辑。

在服务器上，如上所示将 pos 分配给新项目后，将根据最近的邻居检查该项目是否相邻 - 如果它们之间的距离小于最小距离（.01 被使用，我相信），它们被分散（可能级联增加整个列表的 pos）。

我认为这不是理想的方式，但 Trello 就是这样做的。

Trello 如何处理卡片、列表、清单等的重新排列

How does Trello handle rearrangement of cards, lists, checklists etc

javascript

mongodb

trello