jekyll-roadmap 0.4.0 → 1.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/Docs/README.md +204 -0
- data/_includes/footer.html +1 -1
- data/_includes/head.html +4 -11
- data/_layouts/default.html +1 -1
- data/assets/css/bootstrap.css +823 -573
- data/assets/js/bootstrap.js +441 -178
- data/assets/js/bootstrap.min.js +4 -5
- data/assets/js/jquery.js +2 -4
- metadata +16 -17
- data/README.md +0 -52
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: ec01f742ec528d18b17bddd6d28adde3c1479ad1e0a0d26ca0435e8e75d4ad65
|
|
4
|
+
data.tar.gz: 1d5a30b7abfed71e02b699782ead3c1cb40e48124eb08536837253a7c50547e2
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 4484efb9b11e9185164166bab8dc3a75439b0e82ae5b2470236c4e1a4a780955314540296ce1e7d25d39000e535c33842e9be08d54f506d8a6769a51dbd07867
|
|
7
|
+
data.tar.gz: 8f059721f80700e7eb94ca26c0b5e8df0ef53babed9ee92396dcca02f0d05e76cc3bdc12af3d0e67f9f41170411882e61d4851c1d7bc8afe1d01afcad6cbb3f4
|
data/Docs/README.md
ADDED
|
@@ -0,0 +1,204 @@
|
|
|
1
|
+
# Jekyll Roadmap Theme
|
|
2
|
+
|
|
3
|
+
An interactive Gantt-chart roadmap, packaged as a Jekyll theme gem. Plan epics and tasks
|
|
4
|
+
on a timeline, group them into a collapsible tree, and publish the result as a static site.
|
|
5
|
+
|
|
6
|
+
🔗 **Demo & homepage:** <https://manuelgruber.com/jekyll-roadmap/>
|
|
7
|
+
|
|
8
|
+
## Features
|
|
9
|
+
|
|
10
|
+
- Interactive **Gantt timeline** powered by AngularJS + angular-gantt
|
|
11
|
+
- **Hierarchical epics and tasks** (parent/child rows) shown in a collapsible **tree of epics**
|
|
12
|
+
- Per-task **status** and **ticket** columns alongside the timeline
|
|
13
|
+
- **Movable / resizable** task bars, row switching, and tooltips
|
|
14
|
+
- Configurable date range, view scale (year / month / week), and a "current date" marker
|
|
15
|
+
- Multiple roadmaps via Jekyll collections — each roadmap is its own page
|
|
16
|
+
|
|
17
|
+
## Installation
|
|
18
|
+
|
|
19
|
+
This theme is distributed as a gem. In your Jekyll site:
|
|
20
|
+
|
|
21
|
+
1. Add it to your `Gemfile`:
|
|
22
|
+
|
|
23
|
+
```ruby
|
|
24
|
+
gem "jekyll-roadmap", "1.0.0"
|
|
25
|
+
```
|
|
26
|
+
|
|
27
|
+
2. Set it as your theme in `_config.yml` and declare the `roadmaps` collection:
|
|
28
|
+
|
|
29
|
+
```yaml
|
|
30
|
+
theme: jekyll-roadmap
|
|
31
|
+
|
|
32
|
+
collections:
|
|
33
|
+
roadmaps:
|
|
34
|
+
output: true
|
|
35
|
+
```
|
|
36
|
+
|
|
37
|
+
3. Install it:
|
|
38
|
+
|
|
39
|
+
```sh
|
|
40
|
+
$ bundle
|
|
41
|
+
```
|
|
42
|
+
|
|
43
|
+
Or install it directly:
|
|
44
|
+
|
|
45
|
+
```sh
|
|
46
|
+
$ gem install jekyll-roadmap
|
|
47
|
+
```
|
|
48
|
+
|
|
49
|
+
## Usage — add a roadmap
|
|
50
|
+
|
|
51
|
+
Each roadmap lives in its own folder under the `roadmaps` collection and is rendered by
|
|
52
|
+
the `gantt` layout. Use this repo's `src-demo/_roadmaps/roadmap1/` as a worked example.
|
|
53
|
+
|
|
54
|
+
1. Create `_roadmaps/<your-roadmap>/index.html`. The `gantt` layout only supplies the page
|
|
55
|
+
shell (head, nav, footer); the chart scaffolding lives in this file's body. The easiest
|
|
56
|
+
start is to copy this repo's `src-demo/_roadmaps/roadmap1/index.html` and edit it — keep the
|
|
57
|
+
`gantt` front matter (change the `title`):
|
|
58
|
+
|
|
59
|
+
```html
|
|
60
|
+
---
|
|
61
|
+
layout: gantt
|
|
62
|
+
title: 'My Roadmap'
|
|
63
|
+
---
|
|
64
|
+
```
|
|
65
|
+
|
|
66
|
+
Below the front matter, that file already wires up the chart: the
|
|
67
|
+
`<div ng-app="GanttRoadmap" ng-controller="Ctrl">` wrapper around the
|
|
68
|
+
`<div gantt data="data" options="options">` directive, the CDN `<script>` tags, the
|
|
69
|
+
relative `data.js` / `options.js` / `/assets/js/ag.js` includes, and a small inline
|
|
70
|
+
`Ctrl` controller that assigns `roadmapData`/`roadmapOptions` to `$scope`. The only
|
|
71
|
+
per-roadmap parts to change are the `title` above and the adjacent `data.js` /
|
|
72
|
+
`options.js` files below.
|
|
73
|
+
|
|
74
|
+
2. Add `data.js` next to it, defining a global `roadmapData` array. Rows are either
|
|
75
|
+
**epics** (have an `id`) or **tasks** (have a `parent` pointing at an epic/row `id`):
|
|
76
|
+
|
|
77
|
+
```js
|
|
78
|
+
var roadmapData = [
|
|
79
|
+
{id:'10', name:'Kick off & Setup', color:'#0f2e59', classes:'m1'},
|
|
80
|
+
{parent:'10', name:'Task A', status:'Done',
|
|
81
|
+
tasks:[{name:'', from:'2018-09-03', to:'2018-09-12', color:'#99CC99'}], classes:'m2'},
|
|
82
|
+
{parent:'10', name:'Task B', status:'Started',
|
|
83
|
+
tasks:[{name:'', from:'2018-09-14', to:'2018-09-19', color:'#9FC5F8'}], classes:'m2'},
|
|
84
|
+
];
|
|
85
|
+
```
|
|
86
|
+
|
|
87
|
+
Row fields:
|
|
88
|
+
|
|
89
|
+
| Field | Meaning |
|
|
90
|
+
| --------- | ----------------------------------------------------------------------- |
|
|
91
|
+
| `id` | Epic / row identifier (rows referenced as a `parent` need an `id`) |
|
|
92
|
+
| `parent` | `id` of the parent row — makes this row a child in the tree |
|
|
93
|
+
| `name` | Label shown in the epic/task tree |
|
|
94
|
+
| `status` | Free text in the status column (e.g. `Done`, `Started`, `In Progress`) |
|
|
95
|
+
| `color` | Color of the row label |
|
|
96
|
+
| `classes` | CSS class for the row (e.g. `m1` for epics, `m2` for sub-rows) |
|
|
97
|
+
| `tasks` | Array of timeline bars: `{from, to, color}` with dates as `YYYY-MM-DD` |
|
|
98
|
+
|
|
99
|
+
Nest deeper by giving a row **both** an `id` and a `parent`.
|
|
100
|
+
|
|
101
|
+
3. Add `options.js` next to it, defining a global `roadmapOptions`:
|
|
102
|
+
|
|
103
|
+
```js
|
|
104
|
+
var roadmapOptions = {
|
|
105
|
+
headers: ['year', 'month', 'week'],
|
|
106
|
+
headersFormats: {'year': 'YYYY', 'quarter': '[Q]Q YYYY', 'week': 'w'},
|
|
107
|
+
allowSideResizing: true,
|
|
108
|
+
fromDate: '2018-09-01',
|
|
109
|
+
toDate: '2018-12-31',
|
|
110
|
+
daily: true,
|
|
111
|
+
viewScale: 'month',
|
|
112
|
+
currentDate: 'line',
|
|
113
|
+
};
|
|
114
|
+
```
|
|
115
|
+
|
|
116
|
+
Your roadmap is published at `/roadmaps/<your-roadmap>/`. To make it the site's landing
|
|
117
|
+
page, point the root `index.html` redirect at it:
|
|
118
|
+
|
|
119
|
+
```html
|
|
120
|
+
---
|
|
121
|
+
layout: page
|
|
122
|
+
redirect_to: /roadmaps/<your-roadmap>/
|
|
123
|
+
---
|
|
124
|
+
```
|
|
125
|
+
|
|
126
|
+
The `redirect_to` key comes from the **`jekyll-redirect-from`** plugin — add
|
|
127
|
+
`gem "jekyll-redirect-from", "~> 0.16"` to your `Gemfile` and list it under `plugins:` in
|
|
128
|
+
`_config.yml`. Without both, the root page won't redirect (GitHub Pages bundles the plugin,
|
|
129
|
+
so a Pages-hosted site redirects regardless).
|
|
130
|
+
|
|
131
|
+
> **Note:** `data.js` and `options.js` are loaded by **relative** path from the rendered
|
|
132
|
+
> page, so they must sit in the same folder as that roadmap's `index.html`.
|
|
133
|
+
|
|
134
|
+
## Development
|
|
135
|
+
|
|
136
|
+
The repository is set up like a normal Jekyll site so you can preview the theme:
|
|
137
|
+
|
|
138
|
+
```sh
|
|
139
|
+
$ bundle install
|
|
140
|
+
$ bundle exec jekyll serve
|
|
141
|
+
```
|
|
142
|
+
|
|
143
|
+
Run these from the repo root. The previewable demo site lives in `src-demo/` — Jekyll reads it
|
|
144
|
+
via `source: src-demo` in `_config.yml`, while the theme's own `_layouts`/`_includes`/`_sass`/
|
|
145
|
+
`assets` stay at the repo root (a theme gem's folders are resolved from the gem root, so only
|
|
146
|
+
the demo *site* can live in a subfolder).
|
|
147
|
+
|
|
148
|
+
Then open <http://localhost:4000> (the root page redirects to the sample roadmap). Edit
|
|
149
|
+
layouts, includes, styles, or the sample roadmap and refresh to see changes. To build the
|
|
150
|
+
static site, run `bundle exec jekyll build` (output goes to `_site/`).
|
|
151
|
+
|
|
152
|
+
## Packaging
|
|
153
|
+
|
|
154
|
+
When the theme is released as a gem, only files matched by the `spec.files` regex in
|
|
155
|
+
`jekyll-roadmap.gemspec` are bundled:
|
|
156
|
+
|
|
157
|
+
```
|
|
158
|
+
assets | _layouts | _includes | _sass | LICENSE | README | Docs
|
|
159
|
+
```
|
|
160
|
+
|
|
161
|
+
The previewable demo site under `src-demo/` (e.g. `src-demo/_roadmaps/`) is intentionally **not**
|
|
162
|
+
bundled — it's example site content, not part of the theme. To ship an additional top-level
|
|
163
|
+
directory in the gem, add it to that regex.
|
|
164
|
+
|
|
165
|
+
## Dependencies
|
|
166
|
+
|
|
167
|
+
- **Jekyll** `~> 4.4` (runtime)
|
|
168
|
+
- Front-end libraries are loaded from pinned CDNs at render time: **AngularJS 1.5.11**,
|
|
169
|
+
**angular-gantt 1.2.11** (+ plugins), **Moment.js 2.30.1** / **angular-moment 1.3.0**,
|
|
170
|
+
**moment-range 2.x**, **angular-ui-tree 2.22.6**, and **Font Awesome 4.7.0**
|
|
171
|
+
- **Bootstrap 3.4.1** and **jQuery 3.7.1** are bundled under `assets/`
|
|
172
|
+
|
|
173
|
+
> **Note:** AngularJS 1.x and angular-gantt are end-of-life and no longer receive security
|
|
174
|
+
> updates. This is inherent to the angular-gantt charting engine the theme is built on —
|
|
175
|
+
> there is no supported-runtime swap without replacing the chart entirely. The versions
|
|
176
|
+
> above are pinned to known-good releases to limit exposure.
|
|
177
|
+
|
|
178
|
+
> Because the charting libraries are pulled from CDNs, an internet connection is required
|
|
179
|
+
> to render a roadmap locally.
|
|
180
|
+
|
|
181
|
+
## Releasing
|
|
182
|
+
|
|
183
|
+
Releases are published to [RubyGems](https://rubygems.org/) by the GitHub Actions workflows
|
|
184
|
+
in `.github/workflows/`:
|
|
185
|
+
|
|
186
|
+
- **S1-Test** — run manually (Actions → S1-Test → "Run workflow"). Builds the sample site
|
|
187
|
+
and the gem (`bundle exec rake`) across Ruby 3.2–4.0.
|
|
188
|
+
- **S2-Release** — run manually **from a tag**. It refuses to run from a branch, verifies
|
|
189
|
+
the tag equals the gem version, then builds and pushes the gem. Authentication uses the
|
|
190
|
+
organization secret `RUBYGEMS_API_KEY`.
|
|
191
|
+
|
|
192
|
+
To cut a release:
|
|
193
|
+
|
|
194
|
+
```sh
|
|
195
|
+
# 1. Bump spec.version in jekyll-roadmap.gemspec (e.g. 1.0.1), commit, push.
|
|
196
|
+
# 2. Tag with the BARE version (no "v" prefix) and push the tag:
|
|
197
|
+
git tag 1.0.1
|
|
198
|
+
git push origin 1.0.1
|
|
199
|
+
# 3. Actions → S2-Release → "Run workflow" → select the tag 1.0.1.
|
|
200
|
+
```
|
|
201
|
+
|
|
202
|
+
## License
|
|
203
|
+
|
|
204
|
+
Released under the terms of the [MIT License](../LICENSE.txt).
|
data/_includes/footer.html
CHANGED
data/_includes/head.html
CHANGED
|
@@ -9,18 +9,11 @@
|
|
|
9
9
|
<title>Jekyll Roadmap Theme</title>
|
|
10
10
|
|
|
11
11
|
<!-- CSS -->
|
|
12
|
-
<link rel="stylesheet" type="text/css" href="https://
|
|
13
|
-
<link rel="stylesheet" type="text/css" href="https://
|
|
14
|
-
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/angular
|
|
15
|
-
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/angular
|
|
12
|
+
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
|
|
13
|
+
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/angular-ui-tree@2.22.6/dist/angular-ui-tree.min.css">
|
|
14
|
+
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/angular-gantt@1.2.11/assets/angular-gantt.min.css">
|
|
15
|
+
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/angular-gantt@1.2.11/assets/angular-gantt-plugins.min.css">
|
|
16
16
|
<link href="/assets/css/bootstrap.css" rel="stylesheet">
|
|
17
17
|
<link rel="stylesheet" type="text/css" href="/assets/css/custom.css">
|
|
18
18
|
|
|
19
|
-
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
|
|
20
|
-
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
|
|
21
|
-
<!--[if lt IE 9]>
|
|
22
|
-
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
|
|
23
|
-
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
|
|
24
|
-
<![endif]-->
|
|
25
|
-
|
|
26
19
|
</head>
|