{"id":14156542,"url":"https://github.com/mkloubert/vscode-kanban","last_synced_at":"2025-08-06T02:33:55.794Z","repository":{"id":34033015,"uuid":"134847224","full_name":"mkloubert/vscode-kanban","owner":"mkloubert","description":"Kanban board for Visual Studio Code.","archived":true,"fork":false,"pushed_at":"2022-11-07T14:07:14.000Z","size":8139,"stargazers_count":282,"open_issues_count":43,"forks_count":52,"subscribers_count":18,"default_branch":"master","last_synced_at":"2024-05-11T18:20:26.543Z","etag":null,"topics":["kanban-board","project-management","time-tracker","toggl","vscode-extension","webview"],"latest_commit_sha":null,"homepage":"https://marketplace.visualstudio.com/items?itemName=mkloubert.vscode-kanban","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"lgpl-3.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/mkloubert.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null},"funding":{"open_collective":"vscode-kanban","custom":["https://marcel.coffee/"]}},"created_at":"2018-05-25T11:26:06.000Z","updated_at":"2024-05-09T15:38:02.000Z","dependencies_parsed_at":"2023-01-15T04:15:22.304Z","dependency_job_id":null,"html_url":"https://github.com/mkloubert/vscode-kanban","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mkloubert%2Fvscode-kanban","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mkloubert%2Fvscode-kanban/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mkloubert%2Fvscode-kanban/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mkloubert%2Fvscode-kanban/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/mkloubert","download_url":"https://codeload.github.com/mkloubert/vscode-kanban/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":215735861,"owners_count":15923388,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["kanban-board","project-management","time-tracker","toggl","vscode-extension","webview"],"created_at":"2024-08-17T08:06:11.586Z","updated_at":"2024-08-17T08:07:27.533Z","avatar_url":"https://github.com/mkloubert.png","language":"JavaScript","funding_links":["https://opencollective.com/vscode-kanban","https://marcel.coffee/"],"categories":["JavaScript","vscode-extension"],"sub_categories":[],"readme":"# vscode-kanban\r\n\r\n\u003e :warning: **This version of the extension is deprecated and will be refactored**: [Read this](https://github.com/vscode-kanban/vscode-kanban/issues/16) for more information.\r\n\r\n\u003cbr /\u003e\u003cbr /\u003e\r\n\r\n[![Share via Facebook](https://raw.githubusercontent.com/mkloubert/vscode-kanban/master/img/share/Facebook.png)](https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3Dmkloubert.vscode-kanban\u0026quote=VSCode%20Kanban) [![Share via Twitter](https://raw.githubusercontent.com/mkloubert/vscode-kanban/master/img/share/Twitter.png)](https://twitter.com/intent/tweet?source=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3Dmkloubert.vscode-kanban\u0026text=VSCode%20Kanban:%20https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3Dmkloubert.vscode-kanban\u0026via=mjkloubert) [![Share via Pinterest](https://raw.githubusercontent.com/mkloubert/vscode-kanban/master/img/share/Pinterest.png)](http://pinterest.com/pin/create/button/?url=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3Dmkloubert.vscode-kanban\u0026description=Visual%20Studio%20Code%20extension%2C%20which%20receives%20and%20shows%20git%20events%20from%20webhooks.) [![Share via Reddit](https://raw.githubusercontent.com/mkloubert/vscode-kanban/master/img/share/Reddit.png)](http://www.reddit.com/submit?url=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3Dmkloubert.vscode-kanban\u0026title=VSCode%20Kanban) [![Share via LinkedIn](https://raw.githubusercontent.com/mkloubert/vscode-kanban/master/img/share/LinkedIn.png)](http://www.linkedin.com/shareArticle?mini=true\u0026url=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3Dmkloubert.vscode-kanban\u0026title=VSCode%20Kanban\u0026summary=Visual%20Studio%20Code%20extension%2C%20which%20receives%20and%20shows%20git%20events%20from%20webhooks.\u0026source=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3Dmkloubert.vscode-kanban) [![Share via Wordpress](https://raw.githubusercontent.com/mkloubert/vscode-kanban/master/img/share/Wordpress.png)](http://wordpress.com/press-this.php?u=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3Dmkloubert.vscode-kanban\u0026quote=VSCode%20Kanban\u0026s=Visual%20Studio%20Code%20extension%2C%20which%20receives%20and%20shows%20git%20events%20from%20webhooks.) [![Share via Email](https://raw.githubusercontent.com/mkloubert/vscode-kanban/master/img/share/Email.png)](mailto:?subject=VSCode%20Kanban\u0026body=Visual%20Studio%20Code%20extension%2C%20which%20receives%20and%20shows%20git%20events%20from%20webhooks.:%20https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3Dmkloubert.vscode-kanban)\r\n\r\n[![Latest Release](https://vsmarketplacebadge.apphb.com/version-short/mkloubert.vscode-kanban.svg)](https://marketplace.visualstudio.com/items?itemName=mkloubert.vscode-kanban)\r\n[![Installs](https://vsmarketplacebadge.apphb.com/installs/mkloubert.vscode-kanban.svg)](https://marketplace.visualstudio.com/items?itemName=mkloubert.vscode-kanban)\r\n[![Rating](https://vsmarketplacebadge.apphb.com/rating-short/mkloubert.vscode-kanban.svg)](https://marketplace.visualstudio.com/items?itemName=mkloubert.vscode-kanban#review-details)\r\n\r\n[Kanban board](https://en.wikipedia.org/wiki/Kanban_board) for [Visual Studio Code](https://code.visualstudio.com/).\r\n\r\n![Demo 1](https://raw.githubusercontent.com/mkloubert/vscode-kanban/master/img/demo1.gif)\r\n\r\n## Table of contents\r\n\r\n1. [Install](#install-)\r\n2. [How to use](#how-to-use-)\r\n   * [How to execute](#how-to-execute-)\r\n   * [Settings](#settings-)\r\n   * [Markdown support](#markdown-support-)\r\n   * [Diagrams and charts](#diagrams-and-charts-)\r\n   * [Filter](#filter-)\r\n     * [Constants](#constants-)\r\n     * [Functions](#functions-)\r\n   * [Handle events](#handle-events-)\r\n   * [Time tracking](#time-tracking-)\r\n     * [Simple time tracking](#simple-time-tracking-)\r\n     * [Toggl](#toggl-)\r\n     * [Custom time tracking](#custom-time-tracking-)\r\n3. [Customization](#customization-)\r\n   * [Columns](#columns-)\r\n   * [CSS](#css-)\r\n4. [Logs](#logs-)\r\n5. [Support and contribute](#support-and-contribute-)\r\n   * [Contributors](#contributors-)\r\n6. [Related projects](#related-projects-)\r\n   * [vscode-helpers](#vscode-helpers-)\r\n\r\n## Install [[\u0026uarr;](#table-of-contents)]\r\n\r\nLaunch VS Code Quick Open (`Ctrl + P`), paste the following command, and press enter:\r\n\r\n```bash\r\next install vscode-kanban\r\n```\r\n\r\nOr search for things like `vscode-kanban` in your editor.\r\n\r\n## How to use [[\u0026uarr;](#table-of-contents)]\r\n\r\n### How to execute [[\u0026uarr;](#how-to-use-)]\r\n\r\nPress `F1` and enter one of the following commands:\r\n\r\n| Name | Description | command |\r\n| ---- | --------- | --------- |\r\n| `Kanban: Open Board ...` | Opens a kanban board of a workspace (folder). | `extension.kanban.openBoard` |\r\n\r\n### Settings [[\u0026uarr;](#how-to-use-)]\r\n\r\nOpen (or create) your `settings.json` in your `.vscode` subfolder of your workspace or edit the global settings (`File \u003e\u003e Preferences \u003e\u003e Settings`).\r\n\r\nAdd a `kanban` section:\r\n\r\n```json\r\n{\r\n    \"kanban\": {\r\n        \"openOnStartup\": true\r\n    }\r\n}\r\n```\r\n\r\n| Name | Description |\r\n| ---- | --------- |\r\n| `canExecute` | Indicates if an execute button should be shown on every card, which invokes an `onExecute()` function inside the underlying `.vscode/vscode-kanban.js` script file (s. [Handle events](#handle-events-)). Default: `(false)` |\r\n| `cleanupExports` | Remove existing export files, before regenerate them. Default: `(true)` |\r\n| `columns` | Custom [column](#columns-) settings. |\r\n| `exportOnSave` | Export cards to external Markdown files on save or not. Default: `(false)` |\r\n| `exportPath` | The custom path where export files, like cards, should be stored. Relative paths will be mapped to the `.vscode` subfolder of the underlying workspace. Default: `.vscode` subfolder of the underlying workspace. |\r\n| `globals` | Custom data, which can be used inside the extension, like [event scripts](#handle-events-). |\r\n| `maxExportNameLength` | The maximum size of the name of an export file. Default: `48` |\r\n| `noScmUser` | Do not detect username via source control manager like Git. Default: `(false)` |\r\n| `noSystemUser` | Do not detect username of operating system. Default: `(false)` |\r\n| `noTimeTrackingIfIdle` | Do not show 'track time' button, if a card is stored in 'Todo' or 'Done'. Default: `(false)` |\r\n| `openOnStartup` | Opens a board, after a workspace (folder) has been loaded. Default: `(false)` |\r\n| `simpleIDs` | Use integer values as IDs for cards instead. Default: `(true)` |\r\n| `trackTime` | Settings for [time tracking](#time-tracking-) feature. Default: `(false)` |\r\n\r\n### Markdown support [[\u0026uarr;](#how-to-use-)]\r\n\r\nCard descriptions can be formatted with [Markdown](https://en.wikipedia.org/wiki/Markdown), which is parsed by [Showndown](https://github.com/showdownjs/showdown) library.\r\n\r\nThe extension uses the following [settings](https://github.com/showdownjs/showdown#valid-options):\r\n\r\n```json\r\n{\r\n    \"completeHTMLDocument\": false,\r\n    \"encodeEmails\": true,\r\n    \"ghCodeBlocks\": true,\r\n    \"ghCompatibleHeaderId\": true,\r\n    \"headerLevelStart\": 3,\r\n    \"openLinksInNewWindow\": true,\r\n    \"simpleLineBreaks\": true,\r\n    \"simplifiedAutoLink\": true,\r\n    \"strikethrough\": true,\r\n    \"tables\": true,\r\n    \"tasklists\": true\r\n}\r\n```\r\n\r\nCode blocks are parsed by [highlight.js](https://highlightjs.org/) and all [provided languages](https://highlightjs.org/static/demo/) are included and supported.\r\n\r\n### Diagrams and charts [[\u0026uarr;](#how-to-use-)]\r\n\r\n![Demo 7](https://raw.githubusercontent.com/mkloubert/vscode-kanban/master/img/demo7.gif)\r\n\r\nCard descriptions can also include diagrams and charts, using a language parsed and rendered by [mermaid](https://github.com/knsv/mermaid).\r\n\r\nThose diagram / chart descriptions has to be put into a Markdown code block, which uses `mermaid` as language:\r\n\r\n    Example graph:\r\n    \r\n    ```mermaid\r\n    graph TD;\r\n        A--\u003eB;\r\n        A--\u003eC;\r\n        B--\u003eD;\r\n        C--\u003eD;\r\n    ```\r\n\r\n### Filter [[\u0026uarr;](#how-to-use-)]\r\n\r\n![Demo 8](https://raw.githubusercontent.com/mkloubert/vscode-kanban/master/img/demo8.gif)\r\n\r\nCards can be filtered by using a powerful language, provided by [filtrex](https://github.com/joewalnes/filtrex#expressions) library.\r\n\r\n#### Constants [[\u0026uarr;](#filter-)]\r\n\r\n| Name | Description | Example |\r\n| ---- | --------- | --------- |\r\n| `assigned_to` | The value that indicates where the current card is assigned to. | `assigned_to == \"Marcel\" or assigned_to == \"Tanja\"` |\r\n| `cat` | Short version of `category`. | `cat == \"My Category\"` |\r\n| `category` | Stores the unparsed category value of the current card. | `category == \"My Category\"` |\r\n| `description` | The description of the current card. | `description == \"My description\"` |\r\n| `details` | The details of the current card. | `details == \"My details\"` |\r\n| `id` | The ID of the card. | `id == \"20180628102654_516121916_3f99e5abbe05420e1e5114d235ded3a2\"` |\r\n| `is_bug` | Is `(true)` if card type is `Bug / issue`. | `not is_bug` |\r\n| `is_emerg` | Short version of `is_emergency`. | `is_emerg or is_bug` |\r\n| `is_emergency` | Is `(true)` if card type is `Emergency`. | `is_emergency or is_bug` |\r\n| `is_issue` | Alias of `is_bug`. | `is_bug or is_issue` |\r\n| `is_note` | Is `(true)` if card type is `Note / task`. | `not is_note`|\r\n| `is_task` | Alias of `is_note`. | `not is_task` |\r\n| `prio` | Short version of `priority`. | `prio \u003e 10` |\r\n| `priority` | Stores the priority value. | `priority \u003e 10` |\r\n| `no` | `(false)` | `no == false` |\r\n| `now` | The current local time as UNIX timestamp. | `now \u003e 305413740` |\r\n| `tag` | The tag value. | `tag == \"by MK\"` |\r\n| `time` | The (creation) time of the card as UNIX timestamp (UTC). | `time \u003e 305413740` |\r\n| `title` | The title of the card. | `title == \"My card title\"` |\r\n| `type` | The type of the card (lower case). | `type == \"bug\" or type == \"emergency\"` |\r\n| `utc` | The current UTC time as UNIX timestamp. | `utc \u003e 305413740` |\r\n| `yes` | `(true)` | `yes == true` |\r\n\r\n#### Functions [[\u0026uarr;](#filter-)]\r\n\r\n| Name | Description | Example |\r\n| ---- | --------- | --------- |\r\n| `all(val, ...args)` | Handles a value as string and checks if all string arguments can be found inside it (case insensitive). | `all(assigned_to, \"kloubert\", \"Marcel\")` |\r\n| `any(val, ...args)` | Handles a value as string and checks if any string argument can be found inside it (case insensitive). | `any(assigned_to, \"Tanja\", \"Marcel\")` |\r\n| `concat(...args)` | Handles arguments as strings and concats them to one string. | `concat(5, \"9.1\", 979) == \"59.1979\"` |\r\n| `contains(val, searchFor: string)` | Handles a value as a string and searches for a sub string (case insensitive). | `contains(assigned_to, \"Marcel\")` |\r\n| `debug(val, result? = true)` | [Logs](#logs-) a value. | `debug( concat(title, \": \", id) )` |\r\n| `float(val)` | Converts a value to a float number. | `float(\"5.979\") == 5.979` |\r\n| `int(val)` | Short version of `integer()`. | `int(\"5.979\") == 5` |\r\n| `integer(val)` | Converts a value to an integer number. | `integer(\"5.979\") == 5` |\r\n| `is_after(date, alsoSame?: bool = false)` | `(true)`, if a card has been created after a specific time. | `is_after(\"1979-09-05\")` |\r\n| `is_assigned_to(val)` | `(true)`, if a card is assigned to someone (case insensitive). | `is_assigned_to(\"Marcel Kloubert\")` |\r\n| `is_before(date, alsoSame?: bool = false)` | `(true)`, if a card has been created before a specific time. | `is_before(\"2019-09-05\")` |\r\n| `is_cat(name: string)` | Short version of `is_category()`. | `is_cat(\"My category\")` |\r\n| `is_category(name: string)` | `(true)`, if a card belongs to a specific category (case insensitive). | `is_category(\"My category\")` |\r\n| `is_empty(val)` | Converts a value to a string and checks if value is empty or contains whitespace only. | `is_empty(assigned_to)` |\r\n| `is_nan(val, asInt?: bool = false)` | Checks if a value is NOT a number. | `is_nan(prio)` |\r\n| `is_nil(val)` | Checks if a value is `(null)` or `(undefined)`. | `is_nil(category)` |\r\n| `is_older(days: number, alsoSameDay?: bool = false)` | `(true)`, if a card is older than a specific number of days. | `is_older(30)` |\r\n| `is_younger(days: number, alsoSameDay?: bool = false)` | `(true)`, if a card is younger than a specific number of days. | `is_younger(30)` |\r\n| `norm(val)` | Short version of `normalize()`. | `norm(\" Marcel Kloubert \") == \"marcel kloubert\"` |\r\n| `normalize(val)` | Converts a value to a string and converts the characters to lower case by removing leading and ending whitespaces. | `normalize(\" Marcel Kloubert \") == \"marcel kloubert\"` |\r\n| `number(val)` | Alias of `float()`. | `number(\"5.979\") == 5.979` |\r\n| `regex(val, pattern: string, flags?: string)` | `(true)` if a value matches a regular expression. s. [RegExp](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp) | `regex(assigned_to, \"^(marcel\\|tanja)\", \"i\")` |\r\n| `str(val)` | Converts a value to a string. | `str(59.79) == \"59.79\"` |\r\n| `str_invoke(val, methods: string, ...args)` | Handles a value as string and invokes methods for it. s. [String](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String) | `str_invoke(assigned_to, \"trim,toLowerCase\") == \"marcel\" or str_invoke(assigned_to, \"indexOf\", \"Marcel\") \u003e -1` |\r\n| `unix(val, isUTC?: bool = true)` | Returns the UNIX timestamp of a date/time value. | `time \u003e unix(\"1979-09-05 23:09:00\")` |\r\n\r\nFor more functions, s. [Expressions](https://github.com/joewalnes/filtrex#expressions).\r\n\r\nIf a filter expression is invalid or its execution fails, a [log entry](#logs-) will be written.\r\n\r\n### Handle events [[\u0026uarr;](#how-to-use-)]\r\n\r\nFor handling events, you can create a [Node.js](https://nodejs.org/) JavaScript file, called `vscode-kanban.js`, inside your `.vscode` subfolder of your workspace and start with the following skeleton (s. [EventScriptModule](https://mkloubert.github.io/vscode-kanban/interfaces/_workspaces_.eventscriptmodule.html) interface):\r\n\r\n```javascript\r\n// all 'args' parameters are based on\r\n// 'EventScriptFunctionArguments' interface\r\n// \r\n// s. https://mkloubert.github.io/vscode-kanban/interfaces/_workspaces_.eventscriptfunctionarguments.html\r\n\r\n// use any Node.js 7 API, s. https://nodejs.org/\r\nconst fs = require('fs');\r\n// use VSCode API, s. https://code.visualstudio.com/docs/extensionAPI/vscode-api\r\nconst vscode = require('vscode');\r\n\r\n// [OPTIONAL]\r\n// \r\n// Is raised after a CARD has been CREATED.\r\nexports.onCardCreated = async (args) =\u003e {\r\n    // args.data =\u003e s. https://mkloubert.github.io/vscode-kanban/interfaces/_boards_.cardcreatedeventdata.html\r\n\r\n    // access a module of that extension\r\n    // s. https://github.com/mkloubert/vscode-kanban/blob/master/package.json\r\n    const FSExtra = args.require('fs-extra');\r\n\r\n    // write own data to\r\n    // 'tag' property of a card (args.tag)\r\n    // \r\n    // also works in:\r\n    // - onCardMoved()\r\n    // - onCardUpdated()\r\n    await args.setTag( 'Any JSON serializable data.' );    \r\n};\r\n\r\n// [OPTIONAL]\r\n// \r\n// Is raised after a CARD has been DELETED.\r\nexports.onCardDeleted = async (args) =\u003e {\r\n    // args.data =\u003e s. https://mkloubert.github.io/vscode-kanban/interfaces/_boards_.carddeletedeventdata.html\r\n};\r\n\r\n// [OPTIONAL]\r\n// \r\n// Is raised after a CARD has been MOVED.\r\nexports.onCardMoved = async (args) =\u003e {\r\n    // args.data =\u003e s. https://mkloubert.github.io/vscode-kanban/interfaces/_boards_.cardmovedeventdata.html\r\n};\r\n\r\n// [OPTIONAL]\r\n// \r\n// Is raised after a CARD has been UPDATED.\r\nexports.onCardUpdated = async (args) =\u003e {\r\n    // args.data =\u003e s. https://mkloubert.github.io/vscode-kanban/interfaces/_boards_.cardupdatedeventdata.html\r\n};\r\n\r\n// [OPTIONAL]\r\n// \r\n// Is raised after a column has been cleared.\r\nexports.onColumnCleared = async (args) =\u003e {\r\n    // args.data =\u003e s. https://mkloubert.github.io/vscode-kanban/interfaces/_boards_.columnclearedeventdata.html\r\n};\r\n\r\n// [OPTIONAL]\r\n// \r\n// Is raised when an user clicks on a card's 'Execute' button.\r\n// This requires global extension / workspace setting 'canExecute' to be set to (true).\r\nexports.onExecute = async (args) =\u003e {\r\n    // args =\u003e https://mkloubert.github.io/vscode-kanban/interfaces/_workspaces_.eventscriptfunctionarguments.html\r\n    // args.data =\u003e s. https://mkloubert.github.io/vscode-kanban/interfaces/_boards_.executecardeventarguments.html\r\n};\r\n\r\n// [OPTIONAL]\r\n// \r\n// Is raised when an user clicks on a card's 'Track Time' button.\r\n// This requires global extension / workspace setting 'canTrackTime' to be set to (true).\r\nexports.onTrackTime = async (args) =\u003e {\r\n    // args =\u003e https://mkloubert.github.io/vscode-kanban/interfaces/_workspaces_.eventscriptfunctionarguments.html\r\n    // args.data =\u003e s. https://mkloubert.github.io/vscode-kanban/interfaces/_boards_.tracktimeeventarguments.html\r\n};\r\n\r\n\r\n// [OPTIONAL]\r\n// \r\n// Generic fallback function, if a function is not defined for an event.\r\nexports.onEvent = async (args) =\u003e {\r\n    // args.name =\u003e name of the event\r\n    // args.data =\u003e object with event data  \r\n};\r\n```\r\n\r\n### Time tracking [[\u0026uarr;](#how-to-use-)]\r\n\r\n### Simple time tracking [[\u0026uarr;](#time-tracking-)]\r\n\r\n![Demo 3](https://raw.githubusercontent.com/mkloubert/vscode-kanban/master/img/demo3.gif)\r\n\r\nSet the value of `trackTime` inside your `.vscode/settings.json` to `(true)`:\r\n\r\n```json\r\n{\r\n    \"kanban\": {\r\n        \"trackTime\": true\r\n    }\r\n}\r\n```\r\n\r\nThis will run a simple workflow, which writes all required data to the `tag` property of the underlying card (s. `.vscode/vscode-kanban.json`).\r\n\r\n### Toggl [[\u0026uarr;](#time-tracking-)]\r\n\r\n![Demo 4](https://raw.githubusercontent.com/mkloubert/vscode-kanban/master/img/demo4.gif)\r\n\r\nTo use the build-in [Toggl](https://www.toggl.com/) integration, you have to setup your personal API token, which can you find in your profile settings:\r\n\r\n```json\r\n{\r\n    \"kanban\": {\r\n        \"trackTime\": {\r\n            \"type\": \"toggl\",\r\n            \"token\": \"\u003cYOUR-API-TOKEN\u003e\"\r\n        }\r\n    }\r\n}\r\n```\r\n\r\nIf you do not want (or if you not able) to save the token in the settings, you can define the path to a text file, which contains it.\r\n\r\nFor example, create a text file inside your home directory, like `toggl.txt`, and write the token there. After that, you must define the path of the text file in the settings (`.vscode/settings.json`):\r\n\r\n```json\r\n{\r\n    \"kanban\": {\r\n        \"trackTime\": {\r\n            \"type\": \"toggl\",\r\n            \"token\": \"toggl.txt\"\r\n        }\r\n    }\r\n}\r\n```\r\n\r\nYou also can define an absolute path, like `D:/toggl/api-token.txt` or `/home/mkloubert/toggl-api-token.txt`.\r\n\r\nFor the case, your board belongs to a specific Toggl project and you know its ID, you can define it explicitly:\r\n\r\n```json\r\n{\r\n    \"kanban\": {\r\n        \"trackTime\": {\r\n            \"type\": \"toggl\",\r\n            \"token\": \"\u003cAPI-TOKEN\u003e\",\r\n\r\n            \"project\": 123\r\n        }\r\n    }\r\n}\r\n```\r\n\r\n### Custom time tracking [[\u0026uarr;](#time-tracking-)]\r\n\r\nFor handling 'track time' events, you can create or edit a [Node.js](https://nodejs.org/) JavaScript file, called `vscode-kanban.js`, inside your `.vscode` subfolder of your workspace and add the following function:\r\n\r\n```javascript\r\nexports.onTrackTime = async (args) =\u003e {\r\n    // args =\u003e https://mkloubert.github.io/vscode-kanban/interfaces/_workspaces_.eventscriptfunctionarguments.html\r\n    // args.data =\u003e s. https://mkloubert.github.io/vscode-kanban/interfaces/_boards_.tracktimeeventarguments.html\r\n\r\n    // use any Node.js 7 API, s. https://nodejs.org/\r\n    const fs = require('fs');\r\n\r\n    // use VSCode API, s. https://code.visualstudio.com/docs/extensionAPI/vscode-api\r\n    const vscode = require('vscode');\r\n\r\n    // access a module of that extension\r\n    // s. https://github.com/mkloubert/vscode-kanban/blob/master/package.json\r\n    const moment = args.require('moment');\r\n\r\n    // options from the settings, s. below\r\n    const OPTS = args.options;\r\n\r\n\r\n    // start implement your workflow here\r\n};\r\n```\r\n\r\nYou also have to update the extension settings:\r\n\r\n```json\r\n{\r\n    \"kanban\": {\r\n        \"trackTime\": {\r\n            \"type\": \"script\",\r\n            \"options\": {\r\n                \"MK\": 239.79,\r\n                \"TM\": \"5979\"\r\n            }\r\n        }\r\n    }\r\n}\r\n```\r\n\r\n## Customization [[\u0026uarr;](#table-of-contents)]\r\n\r\n### Columns [[\u0026uarr;](#customization-)]\r\n\r\nAn example of setting up custom column names:\r\n\r\n```json\r\n{\r\n    \"kanban\": {\r\n        \"columns\": {\r\n            \"done\": \"Finished\",\r\n            \"inProgress\": \"Work\",\r\n            \"testing\": \"Currently Testing\",\r\n            \"todo\": \"Ideas and TODOs\"\r\n        }\r\n    }\r\n}\r\n```\r\n\r\n### CSS [[\u0026uarr;](#customization-)]\r\n\r\nIf you want to style your board, you can create a file, called `vscode-kanban.css`, inside your `.vscode` sub folder of the underlying workspace or your home directory.\r\n\r\nHave a look at the files [board.css](https://github.com/mkloubert/vscode-kanban/blob/master/src/res/css/board.css) and [style.css](https://github.com/mkloubert/vscode-kanban/blob/master/src/res/css/style.css) to get an idea of the CSS classes, that are used.\r\n\r\n## Logs [[\u0026uarr;](#table-of-contents)]\r\n\r\nLog files are stored inside the `.vscode-kanban/.logs` subfolder of the user's home directory, separated by day.\r\n\r\n## Support and contribute [[\u0026uarr;](#table-of-contents)]\r\n\r\nIf you like the extension, you can support me at https://marcel.coffee\r\n\r\nTo contribute, you can [open an issue](https://github.com/mkloubert/vscode-kanban/issues) and/or fork this repository.\r\n\r\nTo work with the code:\r\n\r\n* clone [this repository](https://github.com/mkloubert/vscode-kanban)\r\n* create and change to a new branch, like `git checkout -b my_new_feature`\r\n* run `npm install` from your project folder\r\n* open that project folder in Visual Studio Code\r\n* now you can edit and debug there\r\n* commit your changes to your new branch and sync it with your forked GitHub repo\r\n* make a [pull request](https://github.com/mkloubert/vscode-kanban/pulls)\r\n\r\nThe complete API documentation can be found [here](https://mkloubert.github.io/vscode-kanban/).\r\n\r\n### Contributors [[\u0026uarr;](#support-and-contribute-)]\r\n\r\n* [Hans De Mulder](https://github.com/Styxxy)\r\n* [Philippe Miossec](https://github.com/pmiossec)\r\n* [Alvaro F. García](https://github.com/rainbyte)\r\n\r\n## Related projects [[\u0026uarr;](#table-of-contents)]\r\n\r\n### vscode-helpers [[\u0026uarr;](#related-projects-)]\r\n\r\n[vscode-helpers](https://github.com/mkloubert/vscode-helpers) is a NPM module, which you can use in your own [VSCode extension](https://code.visualstudio.com/docs/extensions/overview) and contains a lot of helpful classes and functions.\r\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmkloubert%2Fvscode-kanban","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmkloubert%2Fvscode-kanban","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmkloubert%2Fvscode-kanban/lists"}