Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/mark-when/markwhen
Make a cascading timeline from markdown-like text. Supports simple American/European date styles, ISO8601, images, links, locations, and more.
https://github.com/mark-when/markwhen
calendar editor events gantt gantt-chart gantt-diagram maps markdown markwhen project project-management timeline visualization vscode vscode-extension
Last synced: 1 day ago
JSON representation
Make a cascading timeline from markdown-like text. Supports simple American/European date styles, ISO8601, images, links, locations, and more.
- Host: GitHub
- URL: https://github.com/mark-when/markwhen
- Owner: mark-when
- License: mit
- Created: 2021-05-20T22:19:15.000Z (over 3 years ago)
- Default Branch: main
- Last Pushed: 2023-12-11T19:14:41.000Z (about 1 year ago)
- Last Synced: 2024-10-29T15:21:03.630Z (3 months ago)
- Topics: calendar, editor, events, gantt, gantt-chart, gantt-diagram, maps, markdown, markwhen, project, project-management, timeline, visualization, vscode, vscode-extension
- Language: HTML
- Homepage: https://markwhen.com
- Size: 2.25 MB
- Stars: 3,569
- Watchers: 33
- Forks: 126
- Open Issues: 75
-
Metadata Files:
- Readme: README.md
- Funding: .github/FUNDING.yml
- License: LICENSE
Awesome Lists containing this project
- awesome-github-repos - mark-when/markwhen - Make a cascading timeline from markdown-like text. Supports simple American/European date styles, ISO8601, images, links, locations, and more. (HTML)
- project-awesome - mark-when/markwhen - Make a cascading timeline from markdown-like text. Supports simple American/European date styles, ISO8601, images, links, locations, and more. (HTML)
- jimsghstars - mark-when/markwhen - Make a cascading timeline from markdown-like text. Supports simple American/European date styles, ISO8601, images, links, locations, and more. (HTML)
README
# Markwhen is alive and well, just not in this repository
Markwhen's components have been separated and live in other repositories under the [mark-when](https://github.com/mark-when) organization.
The web app (the editor) is the only thing that isn't open source. Everything else (including the timeline itself and the vs code extension) is - check out the links below and the diagram of repositories image.
# [Markwhen](https://markwhen.com)
![](/public/images/screenshot.png)
Markwhen is an interactive text-to-timeline tool. Write markdown-ish text and it gets converted into a nice looking cascading timeline.
Use the editor [here](https://markwhen.com).
This repo is for the view container, not the editor. The editor (markwhen.com) and [VSCode extension](https://marketplace.visualstudio.com/items?itemName=Markwhen.markwhen) are built on top of the view container.
![](/public/images/markwhen.png)
The view container renders different views, like the timeline and the calendar. It is possible to create your own views using the [view client library](https://github.com/mark-when/view-client-library).
| Links | |
| ----------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------- |
| Editor | [https://markwhen.com](https://markwhen.com) |
| VSCode extension | [https://marketplace.visualstudio.com/items?itemName=Markwhen.markwhen](https://marketplace.visualstudio.com/items?itemName=Markwhen.markwhen) |
| Documentation | [https://docs.markwhen.com](https://docs.markwhen.com) |
| Blog | [https://blog.markwhen.com](https://blog.markwhen.com) |
| Parser | [https://github.com/mark-when/parser](https://github.com/mark-when/parser) |
| Timeline View | [https://github.com/mark-when/timeline](https://github.com/mark-when/timeline) |
| Calendar View | [https://github.com/mark-when/calendar](https://github.com/mark-when/calendar) |
| Resume View | [https://github.com/mark-when/resume](https://github.com/mark-when/resume) |
| View Client Library (for making your own views) | [https://github.com/mark-when/view-client](https://github.com/mark-when/view-client) |
| Vue view template | [https://github.com/mark-when/vue-view-template](https://github.com/mark-when/vue-view-template) |
## Get updated
If you'd like to be kept up-to-date about markwhen's feature development, add your email [here](https://docs.google.com/forms/d/e/1FAIpQLSceSLgm90NljlcMvdU2Ly45JYB7ZWGN1BNzQg-T-NSWO1Hm-w/viewform?usp=sf_link).
## VSCode Extension
Get the VSCode extension [here](https://marketplace.visualstudio.com/items?itemName=Markwhen.markwhen).
To switch between the text editor and the timeline view, select `View: Reopen editor with...` from the command palette and choose `Text Editor`.
## Self-hosted views
**⚠️ Note that if you intend to run markwhen locally you may also want to host views locally ⚠️**
The default view is hosted from https://timeline.markwhen.com. You may want to run your own local instance of the [timeline](https://github.com/mark-when/timeline) (or other view) and update [`useViewProviders`](src/Views/useViewProviders.ts) accordingly:
```diff
/* src/Views/useViewProviders.ts */
...export const useTimelineExternalProvider = () => ({
id: "markwhen.timeline",
name: "Timeline",
- url: "https://timeline.markwhen.com",
+ url: "http://localhost:5173"
...
})
```## Quick start
View container:
```sh
> git clone [email protected]:mark-when/markwhen.git
> cd markwhen
> npm i
> npm run dev
```(Optional) Run the timeline view locally:
```sh
> git clone [email protected]:mark-when/timeline.git
> cd timeline
> npm i
> npm run dev
```(Optional) Update [`useViewProviders`](src/Views/useViewProviders.ts):
```diff
/* src/Views/useViewProviders.ts */
...export const useTimelineExternalProvider = () => ({
id: "markwhen.timeline",
name: "Timeline",
- url: "https://timeline.markwhen.com",
+ url: "http://localhost:5173"
...
})
```The renderer renders whatever is given to the [`markwhenStore`](src/Markwhen/markwhenStore.ts).
To enable editing from the timeline view, set [`editorOrchestrator.editable`](src/EditorOrchestrator/editorOrchestratorStore.ts) to `true`:
```
const editable = ref(true);
```## Dockerized
```
> git clone [email protected]:mark-when/markwhen.git
> cd markwhen
> docker build -t markwhen .
> docker run -p8080:8080 markwhen
```This should build a _development_ `markwhen` image from the [Dockerfile](./Dockerfile) and run it on port `8080`. Once running, it should be available at http://localhost:8080
## Documentation
Documentation is located [here](https://docs.markwhen.com).