Trello 卡片在网页上显示金额

Trello cards show amount on a webpage

如何在 Trello 中获取有多少卡片的列表并将其显示在站点的页面上? 有可能吗?

我想要例如:

--------我的网页--------

待办事项:2 做:5 完成:10

从您的看板 url 获取短链接。对于我的看板 https://trello.com/b/5WWgH1bB/tasks,短链接是 5WWgH1bB

您可以使用以下 API 请求查询板:

$ curl https://trello.com/1/boards/5WWgH1bB/lists

这个returns:

[{"id":"563e21ae7f01e6bb5334306d",
  "name":"To Do",
   "closed":false,
   "idBoard":"563e20b4b8580872c2b1b469",
   "pos":65535,
   "subscribed":null},
  {"id":"563e21b0e4572f932855c1d8",
   "name":"Done",
   "closed":false,
   "idBoard":"563e20b4b8580872c2b1b469",
   "pos":131071,
   "subscribed":null},
  {"id":"563e21b171ba02aa1f3c67be",
   "name":"Doing",
   "closed":false,
   "idBoard":"563e20b4b8580872c2b1b469",
   "pos":196607,
   "subscribed":null}]

假设我将这个 JSON 交给某种编程语言,比如 Ruby,这样

require 'json'
trello_response = '[{"id":"563e21ae7f01e6bb5334306d","name":"To Do","closed":false,"idBoard":"563e20b4b8580872c2b1b469","pos":65535,"subscribed":null},{"id":"563e21b0e4572f932855c1d8","name":"Done","closed":false,"idBoard":"563e20b4b8580872c2b1b469","pos":131071,"subscribed":null},{"id":"563e21b171ba02aa1f3c67be","name":"Doing","closed":false,"idBoard":"563e20b4b8580872c2b1b469","pos":196607,"subscribed":null}]'
trello_hash = JSON.parse(trello_response)
trello_hash.each {|i| puts "#{i['name']}, #{i['id']}" }

这会给我

To Do, 563e21ae7f01e6bb5334306d
Done, 563e21b0e4572f932855c1d8
Doing, 563e21b171ba02aa1f3c67be

这些是与我的板上每个列表关联的唯一 ID。我可以反过来查询这些。

$ curl https://trello.com/1/lists/563e21ae7f01e6bb5334306d/cards
$ curl https://trello.com/1/lists/563e21b0e4572f932855c1d8/cards
$ curl https://trello.com/1/lists/563e20b4b8580872c2b1b469/cards  

每个请求 returns 一个大的 JSON blob,其中包含每个列表上 卡片 的详细信息。

假设我把这些一一交给Ruby。

list_to_do = '[{"id":"563e21b5f666242dd2934377","checkItemStates":[],"closed":false,"dateLastActivity":"2015-11-07T16:07:17.423Z","desc":"","descData":null,"idBoard":"563e20b4b8580872c2b1b469","idList":"563e21ae7f01e6bb5334306d","idMembersVoted":[],"idShort":1,"idAttachmentCover":null,"manualCoverAttachment":false,"idLabels":[],"name":"task 1","pos":65535,"shortLink":"9xU5xLYI","badges":{"votes":0,"viewingMemberVoted":false,"subscribed":false,"fogbugz":"","checkItems":0,"checkItemsChecked":0,"comments":0,"attachments":0,"description":false,"due":null},"due":null,"idChecklists":[],"idMembers":[],"labels":[],"shortUrl":"https://trello.com/c/9xU5xLYI","subscribed":false,"url":"https://trello.com/c/9xU5xLYI/1-task-1"},{"id":"563e21b744fb22f201b747ab","checkItemStates":[],"closed":false,"dateLastActivity":"2015-11-07T16:07:19.095Z","desc":"","descData":null,"idBoard":"563e20b4b8580872c2b1b469","idList":"563e21ae7f01e6bb5334306d","idMembersVoted":[],"idShort":2,"idAttachmentCover":null,"manualCoverAttachment":false,"idLabels":[],"name":"task 2","pos":131071,"shortLink":"admRw9X0","badges":{"votes":0,"viewingMemberVoted":false,"subscribed":false,"fogbugz":"","checkItems":0,"checkItemsChecked":0,"comments":0,"attachments":0,"description":false,"due":null},"due":null,"idChecklists":[],"idMembers":[],"labels":[],"shortUrl":"https://trello.com/c/admRw9X0","subscribed":false,"url":"https://trello.com/c/admRw9X0/2-task-2"},{"id":"563e21b84d1f7ed445c6469e","checkItemStates":[],"closed":false,"dateLastActivity":"2015-11-07T16:07:20.961Z","desc":"","descData":null,"idBoard":"563e20b4b8580872c2b1b469","idList":"563e21ae7f01e6bb5334306d","idMembersVoted":[],"idShort":3,"idAttachmentCover":null,"manualCoverAttachment":false,"idLabels":[],"name":"task 3","pos":196607,"shortLink":"ZNfOzI2j","badges":{"votes":0,"viewingMemberVoted":false,"subscribed":false,"fogbugz":"","checkItems":0,"checkItemsChecked":0,"comments":0,"attachments":0,"description":false,"due":null},"due":null,"idChecklists":[],"idMembers":[],"labels":[],"shortUrl":"https://trello.com/c/ZNfOzI2j","subscribed":false,"url":"https://trello.com/c/ZNfOzI2j/3-task-3"}]'
list_done = '[{"id":"563e21bc36407537591b88f1","checkItemStates":[],"closed":false,"dateLastActivity":"2015-11-07T16:07:24.364Z","desc":"","descData":null,"idBoard":"563e20b4b8580872c2b1b469","idList":"563e21b0e4572f932855c1d8","idMembersVoted":[],"idShort":4,"idAttachmentCover":null,"manualCoverAttachment":false,"idLabels":[],"name":"task 4","pos":65535,"shortLink":"y2Px7aED","badges":{"votes":0,"viewingMemberVoted":false,"subscribed":false,"fogbugz":"","checkItems":0,"checkItemsChecked":0,"comments":0,"attachments":0,"description":false,"due":null},"due":null,"idChecklists":[],"idMembers":[],"labels":[],"shortUrl":"https://trello.com/c/y2Px7aED","subscribed":false,"url":"https://trello.com/c/y2Px7aED/4-task-4"},{"id":"563e21bea7e6e1c41f2048ac","checkItemStates":[],"closed":false,"dateLastActivity":"2015-11-07T16:07:26.376Z","desc":"","descData":null,"idBoard":"563e20b4b8580872c2b1b469","idList":"563e21b0e4572f932855c1d8","idMembersVoted":[],"idShort":5,"idAttachmentCover":null,"manualCoverAttachment":false,"idLabels":[],"name":"task 5","pos":131071,"shortLink":"6cGvweyp","badges":{"votes":0,"viewingMemberVoted":false,"subscribed":false,"fogbugz":"","checkItems":0,"checkItemsChecked":0,"comments":0,"attachments":0,"description":false,"due":null},"due":null,"idChecklists":[],"idMembers":[],"labels":[],"shortUrl":"https://trello.com/c/6cGvweyp","subscribed":false,"url":"https://trello.com/c/6cGvweyp/5-task-5"}]' 
list_doing = '[{"id":"563e21c0e4572f932855c201","checkItemStates":[],"closed":false,"dateLastActivity":"2015-11-07T16:07:28.775Z","desc":"","descData":null,"idBoard":"563e20b4b8580872c2b1b469","idList":"563e21b171ba02aa1f3c67be","idMembersVoted":[],"idShort":6,"idAttachmentCover":null,"manualCoverAttachment":false,"idLabels":[],"name":"task 6","pos":65535,"shortLink":"dy3bByst","badges":{"votes":0,"viewingMemberVoted":false,"subscribed":false,"fogbugz":"","checkItems":0,"checkItemsChecked":0,"comments":0,"attachments":0,"description":false,"due":null},"due":null,"idChecklists":[],"idMembers":[],"labels":[],"shortUrl":"https://trello.com/c/dy3bByst","subscribed":false,"url":"https://trello.com/c/dy3bByst/6-task-6"},{"id":"563e21c2e200c94a546dd4bf","checkItemStates":[],"closed":false,"dateLastActivity":"2015-11-07T16:07:30.399Z","desc":"","descData":null,"idBoard":"563e20b4b8580872c2b1b469","idList":"563e21b171ba02aa1f3c67be","idMembersVoted":[],"idShort":7,"idAttachmentCover":null,"manualCoverAttachment":false,"idLabels":[],"name":"task 7","pos":131071,"shortLink":"qVF7Z2sx","badges":{"votes":0,"viewingMemberVoted":false,"subscribed":false,"fogbugz":"","checkItems":0,"checkItemsChecked":0,"comments":0,"attachments":0,"description":false,"due":null},"due":null,"idChecklists":[],"idMembers":[],"labels":[],"shortUrl":"https://trello.com/c/qVF7Z2sx","subscribed":false,"url":"https://trello.com/c/qVF7Z2sx/7-task-7"}]'
hash_to_do = JSON.parse(list_to_do)
hash_done = JSON.parse(list_done)
hash_doing = JSON.parse(list_doing)

然后你可以通过你创建的散列的大小得到每个列表中的卡片数量:

hash.size

您可以这样显示这些值:

puts "TO-DO: #{hash_to_do.size} DOING: #{hash_doing.size} DONE: #{hash_done.size}"

这给出了

TO-DO: 3 DOING: 2 DONE: 2

这是一个 JavaScript 您可以在浏览器控制台中尝试的方法:

$ trello_JSON = jQuery.get("https://trello.com/1/boards/5WWgH1bB/lists").responseJSON
Object {readyState: 1}
$ trello_JSON = trello_response.responseJSON
[Object, Object, Object]
$ trello_list_to_do = jQuery.get('https://trello.com/1/lists/'+trello_JSON[0]['id']+'/cards')
Object {readyState: 1}
$ trello_list_doing = jQuery.get('https://trello.com/1/lists/'+trello_JSON[1]['id']+'/cards')
Object {readyState: 1}
$ trello_list_done = jQuery.get('https://trello.com/1/lists/'+trello_JSON[2]['id']+'/cards')
Object {readyState: 1}
$ to_do_size = trello_list_to_do.responseJSON.length
3
$ doing_size = trello_list_doing.responseJSON.length
2
$ done_size = trello_list_done.responseJSON.length
4

现在假设您的页面上有一个 div class "content",并且您想将计数添加到该 div 的第一段。

$ paragraphs = document.querySelectorAll(".content p")

将为您提供 div 中所有段落的数组。现在我们将结果添加到该段的末尾。

$ paragraphs[0].innerHTML = paragraphs[0].innerHTML + "<b /r><br />TO DO: " + to_do_size + " DOING: " + doing_size + " DONE: " + done_size