このテーマの前回: タスクリストを #HandyFlowy から #Trello に転送する試み その3
前回までは、モバイル接続でタスクリストをスマホの狭い縦長画面で素早く操作することが目的だった。そのためメインのリストは一つだけに絞った。
今回は、タブレットやPCの広い横長画面で複数のリストを操作できるものを作ってみた。
下図のアウトラインで、一番上層のプロジェクト(この例では「Inbox」・「健康」・「仕事」・「家庭」)でリストを分けて表示させる。
iPad miniで表示させると、
/* WFy2Trello_Project2List.js */ var readTasks = function (ele, nestL, parentN, parentD) { var tasks = []; $(ele).each(function(){ var className = $(this).attr('class'); var classNameS = className.split(' '); var projectId = ($(this).attr("projectid").split("-"))[4]; var name = $(this).find("> .name > .content").text(); var note = $(this).find("> .notes > .content").text(); var tags = $.makeArray( $(this).find("> .name > .content > .contentTag > .contentTagText").map(function(){ return $(this).text(); }) ); var due = ""; if (tags.length > 0) { var dueTags = $.grep(tags, function(obj) { return (obj.match(/d20[0-9][0-9]-[0-1][0-9]-[0-3][0-9](T[0-2][0-9]:[0-5][0-9](:[0-5][0-9])*)*/)); }); if (dueTags.length > 0) due = dueTags.pop().slice(1); } if (classNameS.indexOf("open")>=0) { var k = (nestL == 0) ? name : name + " / " + parentN; tasks = tasks.concat( readTasks($(this).find("> .children > .project"), nestL + 1, k, due) ) } else { var v = {}; v.name = name; v.parentN = parentN v.note = note; v.projectId = projectId; v.due = (due == "") ? parentD : due; tasks.push(v); } }); return tasks; } var readProjects = function (ele) { var projects = []; $(ele).each(function(){ var className = $(this).attr('class'); var classNameS = className.split(' '); var listName = $(this).find("> .name > .content").text(); var o = {}; o.listName = listName; o.tasks = []; if (classNameS.indexOf("open")>=0) o.tasks = readTasks($(this).find("> .children > .project"), 0, "", ""); projects.push(o); }); return projects; } var projectList = {}; projectList.projects = readProjects($('.project.selected > .children > .project')); // console.log(projectList); var projectListJ = JSON.stringify(projectList); window.open('workflow://run-workflow?name=clip_to_Trello_pList&input=text&text=' + encodeURIComponent(projectListJ));