Skip to content

Commit 4e49cda

Browse files
fe-lix-bohnertchrismhaack
authored
Main crosswalk (#39)
* Starting the 24PetWatch converter * What is in the repo * Block to handle first set of columns * Making the converter work against the Author * Only adding columns with content * Making it work * wip * wip * Restructure the importer code * Cleanup * Footer is working * Adding header * WIP * WIP better * Remove console.out logging * Unnecessary fetch error message * Can get button format info from section metadata * Add section metadata * Remove redundant hr from teaser section * Adding fstab * Fixed problems with tables (mostly) * More precise query for headers * First carousel attempt * Making the homepage style work * Making the homepage style work * Carousel cleanup * Showing correct header and footer * Enabling footer * Correct handling of the header * Making the footer list better * Start of imageList for blog * Fixing some small issues * Adding buttons * Making two types of buttons * Linting the document * Using the correct fstab * Eslint exception --------- Co-authored-by: Chris Bohnert <[email protected]> Co-authored-by: Markus Haack <[email protected]>
1 parent 2f446e7 commit 4e49cda

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

45 files changed

+23250
-6
lines changed

.eslintignore

+1
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
11
helix-importer-ui
22

33
/scripts/alloy*.js
4+
/tools/actions/

blocks/footer/footer.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -59,7 +59,7 @@ export default async function decorate(block) {
5959
block.textContent = '';
6060

6161
// fetch footer content
62-
const footerPath = cfg.footer || '/footer';
62+
const footerPath = cfg.footer || '/fragments/footer/master';
6363
const resp = await fetch(`${footerPath}.plain.html`, window.location.pathname.endsWith('/footer') ? { cache: 'reload' } : {});
6464

6565
if (resp.ok) {

blocks/header/header.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -177,7 +177,7 @@ export default async function decorate(block) {
177177
const navMeta = getMetadata('nav');
178178
block.textContent = '';
179179

180-
const navPath = navMeta ? new URL(navMeta).pathname : '/nav';
180+
const navPath = navMeta ? new URL(navMeta).pathname : '/fragments/header/master';
181181
const resp = await fetch(`${navPath}.plain.html`);
182182

183183
if (resp.ok) {

paths.yaml

+8
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
mappings:
2+
- /content/24petwatch/us/en:/
3+
- /content/experience-fragments/24petwatch/us/en/site/:/fragments/
4+
5+
includes:
6+
- /content/24petwatch/us/en
7+
- /content/experience-fragments/24petwatch/us/en/site/header
8+
- /content/experience-fragments/24petwatch/us/en/site/footer

styles/styles.css

+4-4
Original file line numberDiff line numberDiff line change
@@ -349,20 +349,20 @@ main .section {
349349
}
350350

351351
/* section metadata */
352-
main .section.teal-bg {
352+
main .section.teal-bg, main .section.teal {
353353
background-color: #007680;
354354
color: white;
355355
}
356356

357-
main .section.gray-bg {
357+
main .section.gray-bg, main .section.lightcool {
358358
background-color: #e7e9ea;
359359
}
360360

361-
main .section.light-gray-bg {
361+
main .section.light-gray-bg, main .section.lightergray {
362362
background-color: #FBFBFB;
363363
}
364364

365-
main .section.warm-white-bg {
365+
main .section.warm-white-bg, main .section.cream {
366366
background-color: #fff1d6;
367367
}
368368

tools/actions/.gitignore

+4
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
.env
2+
.aio
3+
dist/
4+
*/node_modules/

tools/actions/README.md

+55
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,55 @@
1+
## Build
2+
3+
Each action supports the default `npm run` commands to `build`, `test` and `serve`.
4+
5+
To build the action run
6+
7+
```
8+
npm run build
9+
```
10+
11+
This will build in development mode. To build for production use
12+
13+
```
14+
npm run build -- --mode production
15+
```
16+
17+
## Development
18+
19+
To run the tests run
20+
21+
```
22+
npm run test
23+
```
24+
25+
To run the action locally run
26+
27+
```
28+
npm run serve
29+
```
30+
31+
That will build the action code inside an express app, with [src/express.js](src/express.js) as entry point watching any changes. In parallel it will run the webpack output in a self-restarting node process.
32+
33+
The express app listens on port 3030 and handles incoming requests for *.html and *.md files, applying the import.js transformations.
34+
35+
The app uses [dotenv](https://www.npmjs.com/package/dotenv) to read environment configurations for `AEM_HOST`, `AEM_USER`, `AEM_PASSWORD` and `AEM_WCMMODE`.
36+
37+
The node process can be debugged using for example the Chrome developer tools. Source maps are available.
38+
39+
To test the converter run:
40+
41+
```
42+
curl http://localhost:3030/index.md?wcmmode=disabled
43+
```
44+
45+
## Deployment
46+
47+
The actions built and deployed by a [github workflow](../../.github/workflows/deploy-action-convert.yaml). Each branch with changes to any of the files used by the action will automatically trigger a deployment to a package named after the branch.
48+
49+
To deploy the action manually use the App Builder CLI. The [Getting Started guide for AIO Runtime](https://developer.adobe.com/runtime/docs/guides/getting-started/setup/#creating-a-namespace-and-retrieving-the-credentials) provides detailed steps to setup a local environment.
50+
51+
It is recommended to deploy the current work-in-progress into a separate package, e.g. using your username. Remember, the branch name will be used by the automated deployment. To change the package name, modify the [app.config.yaml](./app.config.yaml).
52+
53+
```
54+
aio app deploy
55+
```

tools/actions/app.config.yaml

+17
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
application:
2+
hooks:
3+
pre-app-build: ./bundle-actions.js
4+
runtimeManifest:
5+
packages:
6+
main:
7+
license: Apache-2.0
8+
actions:
9+
convert:
10+
function: convert/dist/main.js
11+
web: 'yes'
12+
runtime: 'nodejs:16'
13+
inputs:
14+
LOG_LEVEL: debug
15+
annotations:
16+
require-adobe-auth: false
17+
final: true

tools/actions/bundle-actions.js

+58
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,58 @@
1+
#!/usr/bin/env node
2+
/*
3+
* Copyright 2023 Adobe. All rights reserved.
4+
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
5+
* you may not use this file except in compliance with the License. You may obtain a copy
6+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
7+
*
8+
* Unless required by applicable law or agreed to in writing, software distributed under
9+
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
10+
* OF ANY KIND, either express or implied. See the License for the specific language
11+
* governing permissions and limitations under the License.
12+
*/
13+
14+
// this script is used instead of individual webpack-config.js configurations per action,
15+
// as these would require additional dependencies (e.g. loaders) to be installed as dev
16+
// dependency on the application level.
17+
18+
import * as url from 'node:url';
19+
import * as path from 'node:path';
20+
import { fork } from 'node:child_process';
21+
import { existsSync } from 'node:fs';
22+
import { readdir } from 'node:fs/promises';
23+
24+
// read all directories, for those that have a webpack executable, run it with --mode production
25+
26+
const webpackArgs = ['--mode', 'production'];
27+
const dirname = url.fileURLToPath(new URL('.', import.meta.url));
28+
const children = await readdir(dirname, { withFileTypes: true });
29+
30+
await Promise.all(children.map(async (child) => {
31+
if (child.isDirectory) {
32+
const childDir = path.resolve(dirname, child.name);
33+
const webpackScript = path.resolve(childDir, 'node_modules/.bin/webpack');
34+
if (existsSync(webpackScript)) {
35+
return new Promise((resolve, reject) => {
36+
// run the webpack script in the childDir
37+
// eslint-disable-next-line no-console
38+
console.log(`Bundling ${child.name} ... `);
39+
const webpackProcess = fork(webpackScript, webpackArgs, { cwd: childDir, silent: true });
40+
webpackProcess.on('error', (err) => reject(err));
41+
webpackProcess.on('exit', (code) => {
42+
if (code > 0) {
43+
reject(code);
44+
} else {
45+
resolve();
46+
}
47+
});
48+
})
49+
.catch((err) => {
50+
// eslint-disable-next-line no-console
51+
console.log(`Failed bundling ${child.name}.`);
52+
throw err;
53+
});
54+
}
55+
}
56+
57+
return Promise.resolve();
58+
}));

tools/actions/convert/converter.yaml

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
env:
2+
publicURL: https://www.24petwatch.com/
3+
aemURL: https://author-p33903-e122205.adobeaemcloud.com/

0 commit comments

Comments
 (0)