Skip to content

Commit efa1da1

Browse files
committed
CAMEL-11492: update to the latest Antora Default UI
1 parent 9736c9e commit efa1da1

32 files changed

+2797
-2540
lines changed

antora-ui-camel/.gitlab-ci.yml

+55
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,55 @@
1+
image: node:10.14.2-alpine
2+
stages: [setup, verify, deploy]
3+
yarn:
4+
stage: setup
5+
cache:
6+
paths:
7+
- .yarn-cache/
8+
script:
9+
- &run_yarn
10+
yarn --cache-folder=.yarn-cache --pure-lockfile > /dev/null
11+
lint:
12+
stage: verify
13+
cache: &pull_cache
14+
policy: pull
15+
paths:
16+
- .yarn-cache/
17+
script:
18+
- *run_yarn
19+
- node_modules/.bin/gulp lint
20+
bundle-stable:
21+
stage: deploy
22+
only:
23+
- master@antora/antora-ui-default
24+
cache: *pull_cache
25+
script:
26+
- *run_yarn
27+
- node_modules/.bin/gulp bundle
28+
artifacts:
29+
paths:
30+
- build/ui-bundle.zip
31+
bundle-dev:
32+
stage: deploy
33+
except:
34+
- master
35+
cache: *pull_cache
36+
script:
37+
- *run_yarn
38+
- node_modules/.bin/gulp bundle
39+
artifacts:
40+
expire_in: 1 day # unless marked as keep from job page
41+
paths:
42+
- build/ui-bundle.zip
43+
pages:
44+
stage: deploy
45+
only:
46+
- master@antora/antora-ui-default
47+
cache: *pull_cache
48+
script:
49+
- *run_yarn
50+
- node_modules/.bin/gulp preview:build
51+
# FIXME figure out a way to avoid copying these files to preview site
52+
- rm -rf public/_/{helpers,layouts,partials}
53+
artifacts:
54+
paths:
55+
- public

antora-ui-camel/.gulp.json

+4
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
{
2+
"description": "Build tasks for the Antora default UI project",
3+
"flags.tasksDepth": 1
4+
}

antora-ui-camel/.nvmrc

+1-1
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
8
1+
10

antora-ui-camel/.stylelintrc

+2-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
{
22
"extends": "stylelint-config-standard",
33
"rules": {
4-
"comment-empty-line-before": null
4+
"comment-empty-line-before": null,
5+
"no-descending-specificity": null,
56
}
67
}

antora-ui-camel/README.adoc

+52-51
Original file line numberDiff line numberDiff line change
@@ -2,26 +2,26 @@
22
// Settings:
33
:experimental:
44
:hide-uri-scheme:
5-
// Project URIs:
6-
:uri-project: https://gitlab.com/antora/antora-ui-default
7-
:uri-preview: https://antora.gitlab.io/antora-ui-default
8-
:uri-ci-pipelines: {uri-project}/pipelines
9-
:img-ci-status: {uri-project}/badges/master/pipeline.svg
10-
// External URIs:
11-
:uri-antora: https://antora.org
12-
:uri-git: https://git-scm.com
13-
:uri-git-dl: {uri-git}/downloads
14-
:uri-gulp: http://gulpjs.com
15-
:uri-opendevise: https://opendevise.com
16-
:uri-node: https://nodejs.org
17-
:uri-nvm: https://github.com/creationix/nvm
18-
:uri-nvm-install: {uri-nvm}#installation
19-
:uri-yarn: https://yarnpkg.com
20-
21-
image:{img-ci-status}[CI Status (GitLab CI), link={uri-ci-pipelines}]
22-
23-
This project is an archetype that demonstrates how to produce a UI bundle for use in a documentation site generated with {uri-antora}[Antora].
24-
You can see a preview of the default UI at {uri-preview}.
5+
// Project URLs:
6+
:url-project: https://gitlab.com/antora/antora-ui-default
7+
:url-preview: https://antora.gitlab.io/antora-ui-default
8+
:url-ci-pipelines: {url-project}/pipelines
9+
:img-ci-status: {url-project}/badges/master/pipeline.svg
10+
// External URLs:
11+
:url-antora: https://antora.org
12+
:url-git: https://git-scm.com
13+
:url-git-dl: {url-git}/downloads
14+
:url-gulp: http://gulpjs.com
15+
:url-opendevise: https://opendevise.com
16+
:url-node: https://nodejs.org
17+
:url-nvm: https://github.com/creationix/nvm
18+
:url-nvm-install: {url-nvm}#installation
19+
:url-yarn: https://yarnpkg.com
20+
21+
image:{img-ci-status}[CI Status (GitLab CI), link={url-ci-pipelines}]
22+
23+
This project is an archetype that demonstrates how to produce a UI bundle for use in a documentation site generated with {url-antora}[Antora].
24+
You can see a preview of the default UI at {url-preview}.
2525

2626
== Use the Default UI
2727

@@ -46,44 +46,44 @@ A more comprehensive tutorial will be made available in the documentation.
4646

4747
To preview and bundle the default UI, you need the following software on your computer:
4848

49-
* {uri-git}[git] (command: `git`)
50-
* {uri-node}[Node 8] (command: `node`)
51-
* {uri-gulp}[Gulp CLI] (command: `gulp`)
52-
* {uri-yarn}[Yarn] (command: `yarn`)
49+
* {url-git}[git] (command: `git`)
50+
* {url-node}[Node] (command: `node`)
51+
* {url-gulp}[Gulp CLI] (command: `gulp`)
52+
* {url-yarn}[Yarn] (command: `yarn`)
5353

5454
==== git
5555

5656
First, make sure you have git installed.
5757

5858
$ git --version
5959

60-
If not, {uri-git-dl}[download and install] the git package for your system.
60+
If not, {url-git-dl}[download and install] the git package for your system.
6161

62-
==== Node 8
62+
==== Node
6363

64-
Next, make sure that you have Node 8 installed.
64+
Next, make sure that you have Node.js (herein "`Node`") installed.
6565

6666
$ node --version
6767

6868
If this command fails with an error, you don't have Node installed.
69-
If the command doesn't report a Node 8 version (e.g., v8.9.4), you don't have a suitable version of Node installed.
69+
If the command doesn't report a Node LTS version (e.g., v10.14.2), you don't have a suitable version of Node installed.
7070

71-
While you can install Node from the official packages, we strongly recommend that you use {uri-nvm}[nvm] (Node Version Manager) to install and manage Node.
72-
Follow the {uri-nvm-install}[nvm installation instructions] to set up nvm on your machine.
71+
While you can install Node from the official packages, we strongly recommend that you use {url-nvm}[nvm] (Node Version Manager) to install and manage Node.
72+
Follow the {url-nvm-install}[nvm installation instructions] to set up nvm on your machine.
7373

74-
Once you've installed nvm, open a new terminal and install Node 8 using the following command:
74+
Once you've installed nvm, open a new terminal and install Node 10 using the following command:
7575

76-
$ nvm install 8
76+
$ nvm install 10
7777

7878
You can switch to this version of Node at any time using the following command:
7979

80-
$ nvm use 8
80+
$ nvm use 10
8181

82-
To make Node 8 the default in new terminals, type:
82+
To make Node 10 the default in new terminals, type:
8383

84-
$ nvm alias default 8
84+
$ nvm alias default 10
8585

86-
Now that you have Node 8 installed, you can proceed with installing the Gulp CLI and Yarn.
86+
Now that you have Node 10 installed, you can proceed with installing the Gulp CLI and Yarn.
8787

8888
==== Gulp CLI
8989

@@ -109,7 +109,7 @@ Now that you have the prerequisites installed, you can fetch and build the defau
109109
Clone the default UI project using git:
110110

111111
[subs=attributes+]
112-
$ git clone {uri-project} &&
112+
$ git clone {url-project} &&
113113
cd "`basename $_`"
114114

115115
The example above clones Antora's default UI project and then switches to the project folder on your filesystem.
@@ -133,33 +133,34 @@ To build the UI and preview it in a local web server, run the `preview` command:
133133

134134
$ gulp preview
135135

136-
You'll see two URLs listed in the output of this command:
136+
You'll see a URL listed in the output of this command:
137137

138138
....
139-
[BS] Access URLs:
140-
----------------------------------
141-
Local: http://localhost:5252
142-
External: http://192.168.1.7:5252
143-
----------------------------------
144-
[BS] Serving files from: build
145-
[BS] Watching files...
139+
[12:59:28] Starting 'preview:serve'...
140+
[12:59:28] Starting server...
141+
[12:59:28] Server started http://localhost:5252
142+
[12:59:28] Running server
146143
....
147144

148-
Navigate to the first URL to see the preview site.
145+
Navigate to that URL to view the preview site.
149146

150147
While this command is running, any changes you make to the source files will be instantly reflected in the browser.
151-
This works by monitoring the project for changes, running the `build` task if a change is detected, and sending the updates to the browser.
148+
This works by monitoring the project for changes, running the `preview:build` task if a change is detected, and sending the updates to the browser.
152149

153150
Press kbd:[Ctrl+C] to stop the preview server and end the continuous build.
154151

155152
=== Package for Use with Antora
156153

157-
If you need to package the UI in order to preview the UI on the real site in local development, run the following command:
154+
If you need to bundle the UI in order to preview the UI on the real site in local development, run the following command:
158155

159-
$ gulp pack
156+
$ gulp bundle
160157

161158
The UI bundle will be available at [.path]_build/ui-bundle.zip_.
162-
You can then point Antora at this bundle using the `--ui-bundle` command-line option.
159+
You can then point Antora at this bundle using the `--ui-bundle-url` command-line option.
160+
161+
If you have the preview running, and you want to bundle without causing the preview to be clobbered, use:
162+
163+
$ gulp bundle:pack
163164

164165
== Copyright and License
165166

@@ -170,4 +171,4 @@ See link:LICENSE[] to find the full license text.
170171

171172
== Authors
172173

173-
Development of Antora is led and sponsored by {uri-opendevise}[OpenDevise Inc].
174+
Development of Antora is led and sponsored by {url-opendevise}[OpenDevise Inc].

antora-ui-camel/docs/modules/ROOT/pages/build-preview-ui.adoc

+13-16
Original file line numberDiff line numberDiff line change
@@ -26,45 +26,42 @@ The next two sections explain how to use these modes.
2626

2727
To build the UI once for preview, then stop, execute the `build-preview` task using the following command:
2828

29-
$ gulp build:preview
29+
$ gulp preview:build
3030

3131
This task pre-compiles the UI files into the [.path]_public_ directory.
3232
To view the preview pages, navigate to the HTML pages in the [.path]_public_ directory using your browser (e.g., [.path]_public/index.html_).
3333

3434
=== Build Continuously
3535

36-
To avoid the need to run the `build-preview` task over and over, you can use the `preview` command instead to have it run continuously.
36+
To avoid the need to run the `preview:build` task over and over, you can use the `preview` command instead to have it run continuously.
3737
This task also launches a local HTTP server so updates get synchronized with the browser (i.e., "`live reload`").
3838

3939
To launch the preview server, execute the following command:
4040

4141
$ gulp preview
4242

43-
You'll see two URLs listed in the output of this command:
43+
You'll see a URL listed in the output of this command:
4444

4545
....
46-
[BS] Access URLs:
47-
----------------------------------
48-
Local: http://localhost:5252
49-
External: http://192.168.1.7:5252
50-
----------------------------------
51-
[BS] Serving files from: build
52-
[BS] Watching files...
46+
[12:59:28] Starting 'preview:serve'...
47+
[12:59:28] Starting server...
48+
[12:59:28] Server started http://localhost:5252
49+
[12:59:28] Running server
5350
....
5451

55-
Navigate to the first one to see the preview site.
52+
Navigate to the URL to view the preview site.
5653
While this command is running, any changes you make to the source files will be instantly reflected in the browser.
57-
This works by monitoring the project for changes, running the `build` task if a change is detected, and sending the updates to the browser.
54+
This works by monitoring the project for changes, running the `preview:build` task if a change is detected, and sending the updates to the browser.
5855

5956
Press kbd:[Ctrl+C] to stop the preview server and end the continuous build.
6057

6158
== Package for Previewing
6259

63-
If you need to package the UI in order to preview the UI on the real site in local development, run the following command:
60+
If you need to bundle the UI in order to preview the UI on the real site in local development, run the following command:
6461

65-
$ gulp pack
62+
$ gulp bundle
6663

67-
The `pack` command also invokes the `lint` command to check that the CSS and JavaScript follow the coding standards.
64+
The `bundle` command also invokes the `lint` command to check that the CSS and JavaScript follow the coding standards.
6865

6966
The UI bundle will be available at [.path]_build/ui-bundle.zip_.
70-
You can then point Antora at this bundle using the `--ui-bundle` command-line option.
67+
You can then point Antora at this bundle using the `--ui-bundle-url` command-line option.

antora-ui-camel/docs/modules/ROOT/pages/index.adoc

+4-12
Original file line numberDiff line numberDiff line change
@@ -49,7 +49,7 @@ Handlebars (file extension: `.hbs`)::
4949
Templates contain placeholders (i.e., mustache expressions like `+{{{page.title}}}+`) into which content is injected from a model.
5050
They also accommodate simple logic expressions for repeating content or including it conditionally (e.g., `+{{#each navigation}}+`) as well as partials (e.g., `+{{> header}}+`).
5151

52-
Gulp (script file: [.path]_gulpfile.js_)::
52+
Gulp (script file: [.path]_gulpfile.js/index.js_)::
5353
{uri-gulp}[Gulp] is a build tool for JavaScript projects.
5454
It configures a collection of tasks that can be used to perform automated tasks such as compiling files, running a preview server, or publishing a release.
5555

@@ -91,7 +91,9 @@ Here's how the files are structured in the UI project:
9191
[.output]
9292
....
9393
README.adoc
94-
gulpfile.js
94+
gulpfile.js/
95+
index.js
96+
...
9597
package.json
9698
yarn.lock
9799
src/
@@ -123,16 +125,6 @@ src/
123125
preview-site-src/
124126
index.html
125127
ui-model.yml
126-
tasks/
127-
lib/
128-
gulp-prettier-eslint.js
129-
build.js
130-
build-preview.js
131-
format.js
132-
lint-css.js
133-
lint-js.js
134-
pack.js
135-
preview.js
136128
....
137129

138130
A Gulp build is used to compile and assemble the UI project files into a UI bundle.

0 commit comments

Comments
 (0)