Complex status (Swimlanes) in Kanban, JavaScript Programming Example of Complex status (Swimlanes) in Kanban

var imagePath = "https://docs.webix.com/samples/63_kanban/common/imgs/";
var users_set = [
	{id:1, value:"Rick Lopes", image:imagePath + "1.jpg"},
	{id:2, value:"Martin Farrell", image:imagePath + "2.jpg"},
	{id:3, value:"Douglass Moore", image:imagePath + "3.jpg"},
	{id:4, value:"Eric Doe", image:imagePath + "4.jpg"},
	{id:5, value:"Sophi Elliman", image:imagePath + "5.jpg"},
	{id:6, value:"Anna O'Neal"},
	{id:7, value:"Marcus Storm", image:imagePath + "7.jpg"},
	{id:8, value:"Nick Branson", image:imagePath + "8.jpg"},
	{id:9, value:"CC", image:imagePath + "9.jpg"}
];

webix.ready(function(){
  if (!webix.env.touch && webix.env.scrollSize)
    webix.CustomScroll.init();

  webix.ui({
    view:"kanban",
    css:"sections_with_bg",
    id: "board",
    cols:[
      { header:"Backlog",
       body:{ view:"kanbanlist", status:"new", name:"Backlog"}},
      { header:"In progress",
       body:{ margin:0, rows:[
         { template: "<span class='webix_icon mdi mdi-code-tags'></span> Development", height: 26, css: "progress_header"},
         { view:"kanbanlist", status:{ status: "work", team: 1 }, name:"Development"},
         { template: "<span class='webix_icon mdi mdi-pencil'></span> Design", height: 26, css: "progress_header"},
         { view:"kanbanlist", status:{ status: "work", team: 2 }, name:"Design"}
       ]}
      },

      { header:"Test",
       body:{ view:"kanbanlist", status:"test" }},

      { header:"Done",
       body:{ view:"kanbanlist", status:"done" }}
    ],
    data: team_task_set,
    tags: tags_set,
    users: users_set,
    colors: colors_set,
    editor:true
  });



});