From 8f01a624612344a36aeb58a4a7fe917c12a57691 Mon Sep 17 00:00:00 2001 From: Daniel Bisgrove Date: Fri, 15 Dec 2023 11:19:52 -0500 Subject: [PATCH 1/4] Adding support for asdf --- .tool-versions | 1 + 1 file changed, 1 insertion(+) create mode 100644 .tool-versions diff --git a/.tool-versions b/.tool-versions new file mode 100644 index 00000000..a1b3d2f3 --- /dev/null +++ b/.tool-versions @@ -0,0 +1 @@ +nodejs 18.13.0 \ No newline at end of file From 7e17dad64ec3986382f07b425aff646979571958 Mon Sep 17 00:00:00 2001 From: Daniel Bisgrove Date: Fri, 15 Dec 2023 11:21:48 -0500 Subject: [PATCH 2/4] Adding github merge workflows to make development easier. merge into staging or development --- .github/workflows/update-development.yml | 20 +++++++++++++++ .github/workflows/update-staging.yml | 32 ++++++++++++++++++++++++ 2 files changed, 52 insertions(+) create mode 100644 .github/workflows/update-development.yml create mode 100644 .github/workflows/update-staging.yml diff --git a/.github/workflows/update-development.yml b/.github/workflows/update-development.yml new file mode 100644 index 00000000..732b2cfa --- /dev/null +++ b/.github/workflows/update-development.yml @@ -0,0 +1,20 @@ +name: Update development +on: + push: + branches: + - master + pull_request: + types: [labeled, synchronize] + +jobs: + update-development: + runs-on: ubuntu-latest + if: github.ref == 'refs/heads/main' || contains(github.event.pull_request.labels.*.name, 'On Development') + steps: + - uses: actions/checkout@v3 + - name: 🖇️ Merge current branch into development + uses: devmasx/merge-branch@1.4.0 + with: + type: now + target_branch: 'development' + github_token: ${{ github.token }} diff --git a/.github/workflows/update-staging.yml b/.github/workflows/update-staging.yml new file mode 100644 index 00000000..fb180730 --- /dev/null +++ b/.github/workflows/update-staging.yml @@ -0,0 +1,32 @@ +name: Update staging and development +on: + push: + branches: + - master + pull_request: + types: [labeled, synchronize] + +jobs: + update-staging: + runs-on: ubuntu-latest + if: github.ref == 'refs/heads/main' || contains(github.event.pull_request.labels.*.name, 'On Staging') + steps: + - uses: actions/checkout@v3 + - name: 🖇️ Merge current branch into staging + uses: devmasx/merge-branch@1.4.0 + with: + type: now + target_branch: 'staging' + github_token: ${{ github.token }} + + update-development: + runs-on: ubuntu-latest + if: github.ref == 'refs/heads/main' || contains(github.event.pull_request.labels.*.name, 'On Development') + steps: + - uses: actions/checkout@v3 + - name: 🖇️ Merge current branch into development + uses: devmasx/merge-branch@1.4.0 + with: + type: now + target_branch: 'development' + github_token: ${{ github.token }} From 4efe1fab90ef7776db0a5446fab35ff20969be47 Mon Sep 17 00:00:00 2001 From: Daniel Bisgrove Date: Fri, 15 Dec 2023 11:23:22 -0500 Subject: [PATCH 3/4] Removed the old "page" folder and components. Removed route to view old pages. Renamed the new page and componements to remove "New" from their name. --- src/app/app.module.ts | 75 +- .../calltoaction/calltoaction.component.css | 8 - .../calltoaction/calltoaction.component.html | 5 - .../calltoaction/calltoaction.component.ts | 62 -- .../component/card/card.component.css | 12 - .../component/card/card.component.html | 18 - .../new-page/component/card/card.component.ts | 78 -- .../content-accordion.component.css | 65 -- .../content-accordion.component.html | 16 - .../content-accordion.component.ts | 77 -- .../content-animation.component.css | 28 - .../content-animation.component.html | 9 - .../content-animation.component.ts | 127 ---- .../content-button.component.css | 12 - .../content-button.component.html | 19 - .../content-button.component.ts | 93 --- .../content-form/content-form.component.css | 4 - .../content-form/content-form.component.html | 5 - .../content-form/content-form.component.ts | 108 --- .../content-image/content-image.component.css | 12 - .../content-image.component.html | 8 - .../content-image/content-image.component.ts | 70 -- .../content-input/content-input.component.css | 9 - .../content-input.component.html | 13 - .../content-input/content-input.component.ts | 79 -- .../content-link/content-link.component.css | 4 - .../content-link/content-link.component.html | 5 - .../content-link/content-link.component.ts | 70 -- .../content-paragraph.component.css | 6 - .../content-paragraph.component.html | 3 - .../content-paragraph.component.ts | 44 -- .../content-spacer.component.css | 0 .../content-spacer.component.html | 1 - .../content-spacer.component.ts | 57 -- .../content-tabs/content-tabs.component.css | 0 .../content-tabs/content-tabs.component.html | 12 - .../content-tabs/content-tabs.component.ts | 78 -- .../content-text/content-text.component.css | 13 - .../content-text/content-text.component.html | 10 - .../content-text/content-text.component.ts | 69 -- .../content-video/content-video.component.css | 40 - .../content-video.component.html | 7 - .../content-video/content-video.component.ts | 66 -- .../component/modal/modal.component.css | 14 - .../component/modal/modal.component.html | 13 - .../component/modal/modal.component.ts | 66 -- .../page-header/page-header.component.css | 4 - .../page-header/page-header.component.html | 23 - .../page-header/page-header.component.ts | 75 -- .../page-hero/page-hero.component.css | 9 - .../page-hero/page-hero.component.html | 15 - .../page-hero/page-hero.component.ts | 84 --- .../tract-page/tract-page.component.css | 272 ------- .../tract-page/tract-page.component.html | 91 --- .../tract-page/tract-page.component.ts | 282 ------- src/app/new-page/model/page-parameters.ts | 5 - src/app/new-page/page.component.css | 141 ---- src/app/new-page/page.component.html | 52 -- src/app/new-page/page.component.spec.ts | 248 ------- src/app/new-page/page.component.ts | 702 ------------------ .../new-page/service/page-service.service.ts | 174 ----- .../calltoaction.component.spec.ts | 10 +- .../calltoaction/calltoaction.component.ts | 22 +- .../page/component/card/card.component.html | 67 +- .../component/card/card.component.spec.ts | 10 +- src/app/page/component/card/card.component.ts | 57 +- .../content-accordion.component.css | 65 ++ .../content-accordion.component.html | 17 +- .../content-accordion.component.ts | 46 +- .../content-animation.component.html | 10 +- .../content-animation.component.spec.ts | 10 +- .../content-animation.component.ts | 106 ++- .../content-button.component.html | 21 +- .../content-button.component.ts | 58 +- .../content-button.compontent.spec.ts | 10 +- .../content-card/content-card.component.css | 0 .../content-card/content-card.component.html | 0 .../content-card.component.spec.ts | 12 +- .../content-card/content-card.component.ts | 2 +- .../content-fallback.component.css | 4 - .../content-fallback.component.html | 58 -- .../content-fallback.component.ts | 60 -- .../content-flow-item.component.css | 0 .../content-flow-item.component.html | 0 .../content-flow-item.component.spec.ts | 10 +- .../content-flow-item.component.ts | 2 +- .../content-flow/content-flow.component.css | 0 .../content-flow/content-flow.component.html | 0 .../content-flow.component.spec.ts | 10 +- .../content-flow/content-flow.component.ts | 2 +- .../content-form/content-form.component.html | 59 +- .../content-form.component.spec.ts | 10 +- .../content-form/content-form.component.ts | 37 +- .../content-image/content-image.component.css | 2 +- .../content-image.component.html | 1 + .../content-image.component.spec.ts | 10 +- .../content-image/content-image.component.ts | 32 +- .../content-input.component.spec.ts | 10 +- .../content-input/content-input.component.ts | 54 +- .../content-link.component.spec.ts | 10 +- .../content-link/content-link.component.ts | 37 +- .../content-multiselect-option.component.css | 0 .../content-multiselect-option.component.html | 0 ...ntent-multiselect-option.component.spec.ts | 10 +- .../content-multiselect-option.component.ts | 2 +- .../content-multiselect.component.css | 0 .../content-multiselect.component.html | 0 .../content-multiselect.component.spec.ts | 10 +- .../content-multiselect.component.ts | 2 +- .../content-paragraph.component.html | 59 +- .../content-paragraph.component.spec.ts | 10 +- .../content-paragraph.component.ts | 42 +- .../content-repeater.component.css | 0 .../content-repeater.component.html | 0 .../content-repeater.component.spec.ts | 10 +- .../content-repeater.component.ts | 8 +- .../content-spacer.component.ts | 15 +- .../content-tabs/content-tabs.component.html | 66 +- .../content-tabs/content-tabs.component.ts | 40 +- .../content-text/content-text.component.html | 2 + .../content-text.component.spec.ts | 10 +- .../content-text/content-text.component.ts | 27 +- .../content-video.component.html | 2 +- .../content-video.component.spec.ts | 10 +- .../content-video/content-video.component.ts | 31 +- .../page/component/modal/modal.component.html | 8 +- .../component/modal/modal.component.spec.ts | 10 +- .../page/component/modal/modal.component.ts | 47 +- .../page-header/page-header.component.html | 10 +- .../page-header/page-header.component.spec.ts | 10 +- .../page-header/page-header.component.ts | 22 +- .../page-hero/page-hero.component.css | 6 +- .../page-hero/page-hero.component.html | 63 +- .../page-hero/page-hero.component.spec.ts | 10 +- .../page-hero/page-hero.component.ts | 55 +- .../tract-page/tract-page.component.css | 24 +- .../tract-page/tract-page.component.html | 59 +- .../tract-page/tract-page.component.spec.ts | 10 +- .../tract-page/tract-page.component.ts | 210 +++--- .../training-tip/training-tip.component.css | 0 .../training-tip/training-tip.component.html | 2 - .../training-tip/training-tip.component.ts | 55 -- .../xmlns/analytics/analytics-ct-attribute.ts | 4 - .../xmlns/analytics/analytics-ct-event.ts | 9 - .../xmlns/analytics/analytics-ct-events.ts | 5 - .../analytics/analytics-event-attribute.ts | 22 - .../model/xmlns/analytics/analytics-event.ts | 39 - .../model/xmlns/analytics/analytics-events.ts | 26 - .../content/content-accordion-section.ts | 33 - .../model/xmlns/content/content-accordion.ts | 29 - .../model/xmlns/content/content-animation.ts | 39 - .../model/xmlns/content/content-button.ts | 65 -- .../content/content-ct-accordion-section.ts | 7 - .../xmlns/content/content-ct-accordion.ts | 5 - .../xmlns/content/content-ct-animation.ts | 10 - .../model/xmlns/content/content-ct-button.ts | 18 - .../xmlns/content/content-ct-fallback.ts | 5 - .../model/xmlns/content/content-ct-form.ts | 6 - .../model/xmlns/content/content-ct-image.ts | 8 - .../model/xmlns/content/content-ct-input.ts | 12 - .../model/xmlns/content/content-ct-link.ts | 10 - .../xmlns/content/content-ct-paragraph.ts | 11 - .../model/xmlns/content/content-ct-spacer.ts | 7 - .../model/xmlns/content/content-ct-tab.ts | 12 - .../model/xmlns/content/content-ct-tabs.ts | 5 - .../xmlns/content/content-ct-text-child.ts | 5 - .../xmlns/content/content-ct-text-type.ts | 10 - .../model/xmlns/content/content-ct-text.ts | 16 - .../model/xmlns/content/content-ct-video.ts | 8 - .../model/xmlns/content/content-element.ts | 137 ---- .../model/xmlns/content/content-fallback.ts | 27 - .../page/model/xmlns/content/content-form.ts | 30 - .../page/model/xmlns/content/content-image.ts | 34 - .../page/model/xmlns/content/content-input.ts | 43 -- .../page/model/xmlns/content/content-link.ts | 34 - .../model/xmlns/content/content-paragraph.ts | 50 -- .../model/xmlns/content/content-spacer.ts | 29 - .../page/model/xmlns/content/content-tab.ts | 41 - .../page/model/xmlns/content/content-tabs.ts | 29 - .../page/model/xmlns/content/content-text.ts | 67 -- .../model/xmlns/content/content-textchild.ts | 46 -- .../page/model/xmlns/content/content-video.ts | 34 - .../xmlns/manifest/manifest-ct-category.ts | 46 -- .../xmlns/manifest/manifest-ct-manifest.ts | 32 - .../model/xmlns/manifest/manifest-ct-page.ts | 26 - .../xmlns/manifest/manifest-ct-resource.ts | 26 - .../model/xmlns/manifest/manifest-ct-tip.ts | 26 - .../model/xmlns/manifest/manifest-manifest.ts | 137 ---- .../model/xmlns/tract/tract-call-to-action.ts | 37 - src/app/page/model/xmlns/tract/tract-card.ts | 92 --- .../xmlns/tract/tract-ct-call-to-action.ts | 10 - .../page/model/xmlns/tract/tract-ct-card.ts | 20 - .../page/model/xmlns/tract/tract-ct-modal.ts | 11 - .../model/xmlns/tract/tract-ct-page-header.ts | 10 - .../model/xmlns/tract/tract-ct-page-hero.ts | 10 - .../page/model/xmlns/tract/tract-ct-page.ts | 26 - src/app/page/model/xmlns/tract/tract-modal.ts | 45 -- .../model/xmlns/tract/tract-page-header.ts | 43 -- .../page/model/xmlns/tract/tract-page-hero.ts | 49 -- src/app/page/model/xmlns/tract/tract-tract.ts | 313 -------- .../model/xmlns/training/training-ct-page.ts | 5 - .../model/xmlns/training/training-ct-tip.ts | 3 - .../model/xmlns/training/training-page.ts | 27 - .../model/xmlns/training/training-training.ts | 61 -- src/app/page/page.component.html | 4 +- src/app/page/page.component.spec.ts | 224 +++++- src/app/page/page.component.ts | 305 +++----- src/app/page/service/page-service.service.ts | 155 +--- 208 files changed, 1095 insertions(+), 7330 deletions(-) delete mode 100644 src/app/new-page/component/calltoaction/calltoaction.component.css delete mode 100644 src/app/new-page/component/calltoaction/calltoaction.component.html delete mode 100644 src/app/new-page/component/calltoaction/calltoaction.component.ts delete mode 100644 src/app/new-page/component/card/card.component.css delete mode 100644 src/app/new-page/component/card/card.component.html delete mode 100644 src/app/new-page/component/card/card.component.ts delete mode 100644 src/app/new-page/component/content-accordion/content-accordion.component.css delete mode 100644 src/app/new-page/component/content-accordion/content-accordion.component.html delete mode 100644 src/app/new-page/component/content-accordion/content-accordion.component.ts delete mode 100644 src/app/new-page/component/content-animation/content-animation.component.css delete mode 100644 src/app/new-page/component/content-animation/content-animation.component.html delete mode 100644 src/app/new-page/component/content-animation/content-animation.component.ts delete mode 100644 src/app/new-page/component/content-button/content-button.component.css delete mode 100644 src/app/new-page/component/content-button/content-button.component.html delete mode 100644 src/app/new-page/component/content-button/content-button.component.ts delete mode 100644 src/app/new-page/component/content-form/content-form.component.css delete mode 100644 src/app/new-page/component/content-form/content-form.component.html delete mode 100644 src/app/new-page/component/content-form/content-form.component.ts delete mode 100644 src/app/new-page/component/content-image/content-image.component.css delete mode 100644 src/app/new-page/component/content-image/content-image.component.html delete mode 100644 src/app/new-page/component/content-image/content-image.component.ts delete mode 100644 src/app/new-page/component/content-input/content-input.component.css delete mode 100644 src/app/new-page/component/content-input/content-input.component.html delete mode 100644 src/app/new-page/component/content-input/content-input.component.ts delete mode 100644 src/app/new-page/component/content-link/content-link.component.css delete mode 100644 src/app/new-page/component/content-link/content-link.component.html delete mode 100644 src/app/new-page/component/content-link/content-link.component.ts delete mode 100644 src/app/new-page/component/content-paragraph/content-paragraph.component.css delete mode 100644 src/app/new-page/component/content-paragraph/content-paragraph.component.html delete mode 100644 src/app/new-page/component/content-paragraph/content-paragraph.component.ts delete mode 100644 src/app/new-page/component/content-spacer/content-spacer.component.css delete mode 100644 src/app/new-page/component/content-spacer/content-spacer.component.html delete mode 100644 src/app/new-page/component/content-spacer/content-spacer.component.ts delete mode 100644 src/app/new-page/component/content-tabs/content-tabs.component.css delete mode 100644 src/app/new-page/component/content-tabs/content-tabs.component.html delete mode 100644 src/app/new-page/component/content-tabs/content-tabs.component.ts delete mode 100644 src/app/new-page/component/content-text/content-text.component.css delete mode 100644 src/app/new-page/component/content-text/content-text.component.html delete mode 100644 src/app/new-page/component/content-text/content-text.component.ts delete mode 100644 src/app/new-page/component/content-video/content-video.component.css delete mode 100644 src/app/new-page/component/content-video/content-video.component.html delete mode 100644 src/app/new-page/component/content-video/content-video.component.ts delete mode 100644 src/app/new-page/component/modal/modal.component.css delete mode 100644 src/app/new-page/component/modal/modal.component.html delete mode 100644 src/app/new-page/component/modal/modal.component.ts delete mode 100644 src/app/new-page/component/page-header/page-header.component.css delete mode 100644 src/app/new-page/component/page-header/page-header.component.html delete mode 100644 src/app/new-page/component/page-header/page-header.component.ts delete mode 100644 src/app/new-page/component/page-hero/page-hero.component.css delete mode 100644 src/app/new-page/component/page-hero/page-hero.component.html delete mode 100644 src/app/new-page/component/page-hero/page-hero.component.ts delete mode 100644 src/app/new-page/component/tract-page/tract-page.component.css delete mode 100644 src/app/new-page/component/tract-page/tract-page.component.html delete mode 100644 src/app/new-page/component/tract-page/tract-page.component.ts delete mode 100644 src/app/new-page/model/page-parameters.ts delete mode 100644 src/app/new-page/page.component.css delete mode 100644 src/app/new-page/page.component.html delete mode 100644 src/app/new-page/page.component.spec.ts delete mode 100644 src/app/new-page/page.component.ts delete mode 100644 src/app/new-page/service/page-service.service.ts rename src/app/{new-page => page}/component/calltoaction/calltoaction.component.spec.ts (82%) rename src/app/{new-page => page}/component/card/card.component.spec.ts (81%) rename src/app/{new-page => page}/component/content-animation/content-animation.component.spec.ts (85%) rename src/app/{new-page => page}/component/content-button/content-button.compontent.spec.ts (85%) rename src/app/{new-page => page}/component/content-card/content-card.component.css (100%) rename src/app/{new-page => page}/component/content-card/content-card.component.html (100%) rename src/app/{new-page => page}/component/content-card/content-card.component.spec.ts (82%) rename src/app/{new-page => page}/component/content-card/content-card.component.ts (96%) delete mode 100644 src/app/page/component/content-fallback/content-fallback.component.css delete mode 100644 src/app/page/component/content-fallback/content-fallback.component.html delete mode 100644 src/app/page/component/content-fallback/content-fallback.component.ts rename src/app/{new-page => page}/component/content-flow-item/content-flow-item.component.css (100%) rename src/app/{new-page => page}/component/content-flow-item/content-flow-item.component.html (100%) rename src/app/{new-page => page}/component/content-flow-item/content-flow-item.component.spec.ts (70%) rename src/app/{new-page => page}/component/content-flow-item/content-flow-item.component.ts (96%) rename src/app/{new-page => page}/component/content-flow/content-flow.component.css (100%) rename src/app/{new-page => page}/component/content-flow/content-flow.component.html (100%) rename src/app/{new-page => page}/component/content-flow/content-flow.component.spec.ts (71%) rename src/app/{new-page => page}/component/content-flow/content-flow.component.ts (95%) rename src/app/{new-page => page}/component/content-form/content-form.component.spec.ts (75%) rename src/app/{new-page => page}/component/content-image/content-image.component.spec.ts (84%) rename src/app/{new-page => page}/component/content-input/content-input.component.spec.ts (81%) rename src/app/{new-page => page}/component/content-link/content-link.component.spec.ts (82%) rename src/app/{new-page => page}/component/content-multiselect-option/content-multiselect-option.component.css (100%) rename src/app/{new-page => page}/component/content-multiselect-option/content-multiselect-option.component.html (100%) rename src/app/{new-page => page}/component/content-multiselect-option/content-multiselect-option.component.spec.ts (76%) rename src/app/{new-page => page}/component/content-multiselect-option/content-multiselect-option.component.ts (96%) rename src/app/{new-page => page}/component/content-multiselect/content-multiselect.component.css (100%) rename src/app/{new-page => page}/component/content-multiselect/content-multiselect.component.html (100%) rename src/app/{new-page => page}/component/content-multiselect/content-multiselect.component.spec.ts (71%) rename src/app/{new-page => page}/component/content-multiselect/content-multiselect.component.ts (95%) rename src/app/{new-page => page}/component/content-paragraph/content-paragraph.component.spec.ts (70%) rename src/app/{new-page => page}/component/content-repeater/content-repeater.component.css (100%) rename src/app/{new-page => page}/component/content-repeater/content-repeater.component.html (100%) rename src/app/{new-page => page}/component/content-repeater/content-repeater.component.spec.ts (75%) rename src/app/{new-page => page}/component/content-repeater/content-repeater.component.ts (87%) rename src/app/{new-page => page}/component/content-text/content-text.component.spec.ts (77%) rename src/app/{new-page => page}/component/content-video/content-video.component.spec.ts (81%) rename src/app/{new-page => page}/component/modal/modal.component.spec.ts (82%) rename src/app/{new-page => page}/component/page-header/page-header.component.spec.ts (83%) rename src/app/{new-page => page}/component/page-hero/page-hero.component.spec.ts (84%) rename src/app/{new-page => page}/component/tract-page/tract-page.component.spec.ts (96%) delete mode 100644 src/app/page/component/training-tip/training-tip.component.css delete mode 100644 src/app/page/component/training-tip/training-tip.component.html delete mode 100644 src/app/page/component/training-tip/training-tip.component.ts delete mode 100644 src/app/page/model/xmlns/analytics/analytics-ct-attribute.ts delete mode 100644 src/app/page/model/xmlns/analytics/analytics-ct-event.ts delete mode 100644 src/app/page/model/xmlns/analytics/analytics-ct-events.ts delete mode 100644 src/app/page/model/xmlns/analytics/analytics-event-attribute.ts delete mode 100644 src/app/page/model/xmlns/analytics/analytics-event.ts delete mode 100644 src/app/page/model/xmlns/analytics/analytics-events.ts delete mode 100644 src/app/page/model/xmlns/content/content-accordion-section.ts delete mode 100644 src/app/page/model/xmlns/content/content-accordion.ts delete mode 100644 src/app/page/model/xmlns/content/content-animation.ts delete mode 100644 src/app/page/model/xmlns/content/content-button.ts delete mode 100644 src/app/page/model/xmlns/content/content-ct-accordion-section.ts delete mode 100644 src/app/page/model/xmlns/content/content-ct-accordion.ts delete mode 100644 src/app/page/model/xmlns/content/content-ct-animation.ts delete mode 100644 src/app/page/model/xmlns/content/content-ct-button.ts delete mode 100644 src/app/page/model/xmlns/content/content-ct-fallback.ts delete mode 100644 src/app/page/model/xmlns/content/content-ct-form.ts delete mode 100644 src/app/page/model/xmlns/content/content-ct-image.ts delete mode 100644 src/app/page/model/xmlns/content/content-ct-input.ts delete mode 100644 src/app/page/model/xmlns/content/content-ct-link.ts delete mode 100644 src/app/page/model/xmlns/content/content-ct-paragraph.ts delete mode 100644 src/app/page/model/xmlns/content/content-ct-spacer.ts delete mode 100644 src/app/page/model/xmlns/content/content-ct-tab.ts delete mode 100644 src/app/page/model/xmlns/content/content-ct-tabs.ts delete mode 100644 src/app/page/model/xmlns/content/content-ct-text-child.ts delete mode 100644 src/app/page/model/xmlns/content/content-ct-text-type.ts delete mode 100644 src/app/page/model/xmlns/content/content-ct-text.ts delete mode 100644 src/app/page/model/xmlns/content/content-ct-video.ts delete mode 100644 src/app/page/model/xmlns/content/content-element.ts delete mode 100644 src/app/page/model/xmlns/content/content-fallback.ts delete mode 100644 src/app/page/model/xmlns/content/content-form.ts delete mode 100644 src/app/page/model/xmlns/content/content-image.ts delete mode 100644 src/app/page/model/xmlns/content/content-input.ts delete mode 100644 src/app/page/model/xmlns/content/content-link.ts delete mode 100644 src/app/page/model/xmlns/content/content-paragraph.ts delete mode 100644 src/app/page/model/xmlns/content/content-spacer.ts delete mode 100644 src/app/page/model/xmlns/content/content-tab.ts delete mode 100644 src/app/page/model/xmlns/content/content-tabs.ts delete mode 100644 src/app/page/model/xmlns/content/content-text.ts delete mode 100644 src/app/page/model/xmlns/content/content-textchild.ts delete mode 100644 src/app/page/model/xmlns/content/content-video.ts delete mode 100644 src/app/page/model/xmlns/manifest/manifest-ct-category.ts delete mode 100644 src/app/page/model/xmlns/manifest/manifest-ct-manifest.ts delete mode 100644 src/app/page/model/xmlns/manifest/manifest-ct-page.ts delete mode 100644 src/app/page/model/xmlns/manifest/manifest-ct-resource.ts delete mode 100644 src/app/page/model/xmlns/manifest/manifest-ct-tip.ts delete mode 100644 src/app/page/model/xmlns/manifest/manifest-manifest.ts delete mode 100644 src/app/page/model/xmlns/tract/tract-call-to-action.ts delete mode 100644 src/app/page/model/xmlns/tract/tract-card.ts delete mode 100644 src/app/page/model/xmlns/tract/tract-ct-call-to-action.ts delete mode 100644 src/app/page/model/xmlns/tract/tract-ct-card.ts delete mode 100644 src/app/page/model/xmlns/tract/tract-ct-modal.ts delete mode 100644 src/app/page/model/xmlns/tract/tract-ct-page-header.ts delete mode 100644 src/app/page/model/xmlns/tract/tract-ct-page-hero.ts delete mode 100644 src/app/page/model/xmlns/tract/tract-ct-page.ts delete mode 100644 src/app/page/model/xmlns/tract/tract-modal.ts delete mode 100644 src/app/page/model/xmlns/tract/tract-page-header.ts delete mode 100644 src/app/page/model/xmlns/tract/tract-page-hero.ts delete mode 100644 src/app/page/model/xmlns/tract/tract-tract.ts delete mode 100644 src/app/page/model/xmlns/training/training-ct-page.ts delete mode 100644 src/app/page/model/xmlns/training/training-ct-tip.ts delete mode 100644 src/app/page/model/xmlns/training/training-page.ts delete mode 100644 src/app/page/model/xmlns/training/training-training.ts diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 6b232c2a..026d89cf 100755 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -31,40 +31,14 @@ import { ContentAnimationComponent } from './page/component/content-animation/co import { CalltoactionComponent } from './page/component/calltoaction/calltoaction.component'; import { ModalComponent } from './page/component/modal/modal.component'; import { ContentSpacerComponent } from './page/component/content-spacer/content-spacer.component'; -import { TrainingTipComponent } from './page/component/training-tip/training-tip.component'; -import { ContentFallbackComponent } from './page/component/content-fallback/content-fallback.component'; -import { PageNewComponent } from './new-page/page.component'; -import { PageHeaderNewComponent } from './new-page/component/page-header/page-header.component'; -import { TractPageNewComponent } from './new-page/component/tract-page/tract-page.component'; -import { PageHeroNewComponent } from './new-page/component/page-hero/page-hero.component'; -import { ContentImageNewComponent } from './new-page/component/content-image/content-image.component'; -import { ContentParagraphNewComponent } from './new-page/component/content-paragraph/content-paragraph.component'; -import { ContentFormNewComponent } from './new-page/component/content-form/content-form.component'; -import { CardNewComponent } from './new-page/component/card/card.component'; -import { ContentTextNewComponent } from './new-page/component/content-text/content-text.component'; -import { ContentButtonNewComponent } from './new-page/component/content-button/content-button.component'; -import { ContentLinkNewComponent } from './new-page/component/content-link/content-link.component'; -import { ContentInputNewComponent } from './new-page/component/content-input/content-input.component'; -import { ContentVideoNewComponent } from './new-page/component/content-video/content-video.component'; -import { ContentTabsNewComponent } from './new-page/component/content-tabs/content-tabs.component'; -import { ContentAccordionNewComponent } from './new-page/component/content-accordion/content-accordion.component'; -import { ContentAnimationNewComponent } from './new-page/component/content-animation/content-animation.component'; -import { CalltoactionNewComponent } from './new-page/component/calltoaction/calltoaction.component'; -import { ModalNewComponent } from './new-page/component/modal/modal.component'; -import { ContentSpacerNewComponent } from './new-page/component/content-spacer/content-spacer.component'; -import { ContentRepeaterNewComponent } from './new-page/component/content-repeater/content-repeater.component'; -import { ContentMultiselectNewComponent } from './new-page/component/content-multiselect/content-multiselect.component'; -import { ContentMultiselectOptionNewComponent } from './new-page/component/content-multiselect-option/content-multiselect-option.component'; -import { ContentFlowNewComponent } from './new-page/component/content-flow/content-flow.component'; -import { ContentFlowItemNewComponent } from './new-page/component/content-flow-item/content-flow-item.component'; -import { ContentCardNewComponent } from './new-page/component/content-card/content-card.component'; +import { ContentRepeaterComponent } from './page/component/content-repeater/content-repeater.component'; +import { ContentMultiselectComponent } from './page/component/content-multiselect/content-multiselect.component'; +import { ContentMultiselectOptionComponent } from './page/component/content-multiselect-option/content-multiselect-option.component'; +import { ContentFlowComponent } from './page/component/content-flow/content-flow.component'; +import { ContentFlowItemComponent } from './page/component/content-flow-item/content-flow-item.component'; +import { ContentCardComponent } from './page/component/content-card/content-card.component'; const appRoutes: Routes = [ - { path: 'old/:langid/embed/:bookid', component: PageComponent }, - { - path: 'old/:langid/:bookid/:page', - component: PageComponent - }, { path: ':langid/:bookid', redirectTo: ':langid/:bookid/0', @@ -72,10 +46,10 @@ const appRoutes: Routes = [ }, { path: ':langid', component: HeaderComponent }, { path: '', component: HeaderComponent }, - { path: ':langid/embed/:bookid', component: PageNewComponent }, + { path: ':langid/embed/:bookid', component: PageComponent }, { path: ':langid/:bookid/:page', - component: PageNewComponent + component: PageComponent } ]; @@ -92,7 +66,6 @@ export function playerFactory() { SharingModalComponent, LoaderComponent, PageComponent, - PageNewComponent, PageHeaderComponent, TractPageComponent, PageHeroComponent, @@ -111,32 +84,12 @@ export function playerFactory() { CalltoactionComponent, ModalComponent, ContentSpacerComponent, - TrainingTipComponent, - ContentFallbackComponent, - PageHeaderNewComponent, - TractPageNewComponent, - PageHeroNewComponent, - ContentImageNewComponent, - ContentParagraphNewComponent, - ContentFormNewComponent, - CardNewComponent, - ContentTextNewComponent, - ContentButtonNewComponent, - ContentLinkNewComponent, - ContentInputNewComponent, - ContentVideoNewComponent, - ContentTabsNewComponent, - ContentAccordionNewComponent, - ContentAnimationNewComponent, - CalltoactionNewComponent, - ModalNewComponent, - ContentSpacerNewComponent, - ContentRepeaterNewComponent, - ContentMultiselectNewComponent, - ContentMultiselectOptionNewComponent, - ContentFlowNewComponent, - ContentFlowItemNewComponent, - ContentCardNewComponent + ContentRepeaterComponent, + ContentMultiselectComponent, + ContentMultiselectOptionComponent, + ContentFlowComponent, + ContentFlowItemComponent, + ContentCardComponent ], imports: [ BrowserModule, diff --git a/src/app/new-page/component/calltoaction/calltoaction.component.css b/src/app/new-page/component/calltoaction/calltoaction.component.css deleted file mode 100644 index 317183dc..00000000 --- a/src/app/new-page/component/calltoaction/calltoaction.component.css +++ /dev/null @@ -1,8 +0,0 @@ -:host { - width: 100%; - display: block; -} - -h4.calltoaction { - margin-top: 48px !important; -} \ No newline at end of file diff --git a/src/app/new-page/component/calltoaction/calltoaction.component.html b/src/app/new-page/component/calltoaction/calltoaction.component.html deleted file mode 100644 index 34bd9389..00000000 --- a/src/app/new-page/component/calltoaction/calltoaction.component.html +++ /dev/null @@ -1,5 +0,0 @@ - -

- {{ actionText }} -

- diff --git a/src/app/new-page/component/calltoaction/calltoaction.component.ts b/src/app/new-page/component/calltoaction/calltoaction.component.ts deleted file mode 100644 index 8fc41a85..00000000 --- a/src/app/new-page/component/calltoaction/calltoaction.component.ts +++ /dev/null @@ -1,62 +0,0 @@ -import { - Component, - Input, - OnChanges, - OnInit, - SimpleChanges -} from '@angular/core'; -import { Observable } from 'rxjs'; -import { PageService } from '../../service/page-service.service'; -import { - CallToAction, - Text -} from 'src/app/services/xml-parser-service/xmp-parser.service'; - -@Component({ - selector: 'app-page-new-calltoaction', - templateUrl: './calltoaction.component.html', - styleUrls: ['./calltoaction.component.css'] -}) -export class CalltoactionNewComponent implements OnChanges { - @Input() item: CallToAction; - - text: Text; - ready: boolean; - actionText: string; - dir$: Observable; - - constructor(private pageService: PageService) { - this.dir$ = this.pageService.pageDir$; - } - - ngOnChanges(changes: SimpleChanges) { - for (const propName in changes) { - if (changes.hasOwnProperty(propName)) { - switch (propName) { - case 'item': { - if ( - !changes['item'].previousValue || - changes['item'].currentValue !== changes['item'].previousValue - ) { - this.ready = false; - this.actionText = ''; - this.init(); - } - } - } - } - } - } - - private init(): void { - if (this.item.label) { - this.text = this.item.label; - if (this.text && this.item.label.text) { - this.actionText = this.item.label.text - .trim() - .replace(//gi, ' '); - } - } - this.ready = true; - } -} diff --git a/src/app/new-page/component/card/card.component.css b/src/app/new-page/component/card/card.component.css deleted file mode 100644 index f015249b..00000000 --- a/src/app/new-page/component/card/card.component.css +++ /dev/null @@ -1,12 +0,0 @@ -:host { - width: 100%; - display: block; -} - -div.cardContent { - margin-top: 24px; -} - -:host:first-of-type > div.cardContent{ - margin-top: 24px !important; -} diff --git a/src/app/new-page/component/card/card.component.html b/src/app/new-page/component/card/card.component.html deleted file mode 100644 index 594678cb..00000000 --- a/src/app/new-page/component/card/card.component.html +++ /dev/null @@ -1,18 +0,0 @@ -
-

- - - -
diff --git a/src/app/new-page/component/card/card.component.ts b/src/app/new-page/component/card/card.component.ts deleted file mode 100644 index 19d917f2..00000000 --- a/src/app/new-page/component/card/card.component.ts +++ /dev/null @@ -1,78 +0,0 @@ -import { - Component, - Input, - OnChanges, - OnInit, - SimpleChanges -} from '@angular/core'; -import { Observable } from 'rxjs'; -import { PageService } from '../../service/page-service.service'; -import { org } from '@cruglobal/godtools-shared'; -import { - TractPageCard, - Text, - Content -} from 'src/app/services/xml-parser-service/xmp-parser.service'; -@Component({ - selector: 'app-page-new-card', - templateUrl: './card.component.html', - styleUrls: ['./card.component.css'] -}) -export class CardNewComponent implements OnChanges { - @Input() card: TractPageCard; - - ready: boolean; - label: Text; - labelText: string; - cardPosition: number; - content: Array; - dir$: Observable; - isForm$: Observable; - isModal$: Observable; - isFirstPage$: Observable; - - constructor(private pageService: PageService) { - this.dir$ = this.pageService.pageDir$; - this.isForm$ = this.pageService.isForm$; - this.isModal$ = this.pageService.isModal$; - this.isFirstPage$ = this.pageService.isFirstPage$; - } - - ngOnChanges(changes: SimpleChanges) { - for (const propName in changes) { - if (changes.hasOwnProperty(propName)) { - switch (propName) { - case 'card': { - if ( - !changes['card'].previousValue || - changes['card'].currentValue !== changes['card'].previousValue - ) { - this.ready = false; - this.label = null; - this.labelText = ''; - this.cardPosition = 0; - this.content = []; - this.init(); - } - } - } - } - } - } - - trackByFn(index, item) { - return index; - } - - private init(): void { - this.cardPosition = this.card.position || 0; - if (this.card.label) { - this.label = this.card.label; - this.labelText = this.card.label.text?.trim() || ''; - } - - this.content = this.card.content; - - this.ready = true; - } -} diff --git a/src/app/new-page/component/content-accordion/content-accordion.component.css b/src/app/new-page/component/content-accordion/content-accordion.component.css deleted file mode 100644 index 6073eef1..00000000 --- a/src/app/new-page/component/content-accordion/content-accordion.component.css +++ /dev/null @@ -1,65 +0,0 @@ -/* Style the buttons that are used to open and close the accordion panel */ -.accordion-header { - background-color: #eee; - color: #444; - cursor: pointer; - padding: 15px; - width: 100%; - text-align: left; - font-size: 16px; - border: none; - outline: none; - transition: 0.4s; - color: var(--kg-white); - background-color: var(--kg-blue); - transition: all 0.3s ease 0s; - position: relative; -} - -.accordion-header:hover { - background-color: var(--kg-blue-light); -} - -.accordion-header i { - position: absolute; - right: 20px; - transform: translateY(-50%); - transition: all 0.3s ease 0s; - top: 50%; -} - -.accordion-header i.fa-plus { - opacity: 1; -} -.accordion-header i.fa-minus { - opacity: 0; -} - -.accordian.mw568.active .accordion-header i.fa-plus { - opacity: 0; -} -.accordian.mw568.active .accordion-header i.fa-minus { - opacity: 1; -} - -/* Style the accordion panel. Note: hidden by default */ -.accordion-content { - padding: 0 18px; - background-color: white; - max-height: 0px; - overflow: hidden; - transition: all 0.5s ease 0s; - border: 1px solid var(--kg-white); - background-color: var(--kg-white); - padding: 0px 24px; -} - -.accordian.active .accordion-content { - border: 1px solid var(--kg-blue); - padding: 0px 24px 24px; - max-height: 400px; -} - -.accordion-content app-content-new-repeater { - margin-top: 0; -} \ No newline at end of file diff --git a/src/app/new-page/component/content-accordion/content-accordion.component.html b/src/app/new-page/component/content-accordion/content-accordion.component.html deleted file mode 100644 index 861378ff..00000000 --- a/src/app/new-page/component/content-accordion/content-accordion.component.html +++ /dev/null @@ -1,16 +0,0 @@ - - -
- -
- -
-
- - diff --git a/src/app/new-page/component/content-accordion/content-accordion.component.ts b/src/app/new-page/component/content-accordion/content-accordion.component.ts deleted file mode 100644 index e8b181a6..00000000 --- a/src/app/new-page/component/content-accordion/content-accordion.component.ts +++ /dev/null @@ -1,77 +0,0 @@ -import { - Component, - Input, - OnChanges, - OnInit, - SimpleChanges -} from '@angular/core'; -import { Observable } from 'rxjs'; -import { PageService } from '../../service/page-service.service'; -import { - Accordion, - Content -} from 'src/app/services/xml-parser-service/xmp-parser.service'; - -@Component({ - selector: 'app-content-new-accordion', - templateUrl: './content-accordion.component.html', - styleUrls: ['./content-accordion.component.css'] -}) -export class ContentAccordionNewComponent implements OnChanges { - @Input() item: Accordion; - - accordion: Accordion; - sections: any[]; - ready: boolean; - dir$: Observable; - - constructor(private pageService: PageService) { - this.dir$ = this.pageService.pageDir$; - } - - ngOnChanges(changes: SimpleChanges) { - for (const propName in changes) { - if (changes.hasOwnProperty(propName)) { - switch (propName) { - case 'item': { - if ( - !changes['item'].previousValue || - changes['item'].currentValue !== changes['item'].previousValue - ) { - this.ready = false; - this.accordion = this.item; - this.sections = []; - this.init(); - } - } - } - } - } - } - - onClick(event: any) { - const parent = event.target.classList.contains('far') - ? event.target.parentElement.parentElement - : event.target.parentElement; - const hasActiveClass = parent.classList.contains('active'); - if (hasActiveClass) { - parent.classList.remove('active'); - } else { - parent.classList.add('active'); - } - } - - private init(): void { - this.item.sections.forEach((section) => { - const contents: Content[] = []; - if (section.content) { - section.content.forEach((content) => - content ? contents.push(content) : null - ); - } - this.sections.push({ section, contents }); - }); - - this.ready = true; - } -} diff --git a/src/app/new-page/component/content-animation/content-animation.component.css b/src/app/new-page/component/content-animation/content-animation.component.css deleted file mode 100644 index 19eac2af..00000000 --- a/src/app/new-page/component/content-animation/content-animation.component.css +++ /dev/null @@ -1,28 +0,0 @@ -:host { - width: 100%; - display: block; -} - -div.animation-container { - display: block; -} - -div.animation-container > .hasEvents { - cursor: pointer; -} - - -@media screen and (max-width: 615px) { - div.animation-container { - width: calc(100% - 48px); - margin-left: 24px; - margin-right: 24px; - } -} - -@media screen and (min-width: 616px) { - div.animation-container { - width: 560px; - margin: 0 auto; - } -} \ No newline at end of file diff --git a/src/app/new-page/component/content-animation/content-animation.component.html b/src/app/new-page/component/content-animation/content-animation.component.html deleted file mode 100644 index ee5694ed..00000000 --- a/src/app/new-page/component/content-animation/content-animation.component.html +++ /dev/null @@ -1,9 +0,0 @@ - -
- -
- diff --git a/src/app/new-page/component/content-animation/content-animation.component.ts b/src/app/new-page/component/content-animation/content-animation.component.ts deleted file mode 100644 index f00d06b5..00000000 --- a/src/app/new-page/component/content-animation/content-animation.component.ts +++ /dev/null @@ -1,127 +0,0 @@ -import { - Component, - Input, - OnChanges, - OnDestroy, - SimpleChanges -} from '@angular/core'; -import { Observable, Subject } from 'rxjs'; -import { takeUntil } from 'rxjs/operators'; -import { PageService } from '../../service/page-service.service'; -import { Animation } from 'src/app/services/xml-parser-service/xmp-parser.service'; -import { AnimationOptions } from 'ngx-lottie'; -import { AnimationItem } from 'lottie-web'; - -@Component({ - selector: 'app-content-new-animation', - templateUrl: './content-animation.component.html', - styleUrls: ['./content-animation.component.css'] -}) -export class ContentAnimationNewComponent implements OnChanges, OnDestroy { - // eslint-disable-next-line @angular-eslint/no-input-rename - @Input() item: Animation; - - private _unsubscribeAll = new Subject(); - animation: Animation; - ready: boolean; - anmResource: string; - anmViewItem: AnimationItem; - hasEvents: boolean; - dir$: Observable; - lottieOptions: AnimationOptions; - - constructor(private pageService: PageService) { - this.dir$ = this.pageService.pageDir$; - } - - ngOnDestroy() { - this._unsubscribeAll.next(); - this._unsubscribeAll.complete(); - } - - ngOnChanges(changes: SimpleChanges) { - for (const propName in changes) { - if (changes.hasOwnProperty(propName)) { - switch (propName) { - case 'item': { - if ( - !changes['item'].previousValue || - changes['item'].currentValue !== changes['item'].previousValue - ) { - this.ready = false; - this.animation = this.item; - this.init(); - } - } - } - } - } - } - - onAnimationClick(): void { - if (this.animation.events) { - let action = ''; - this.animation.events.forEach((event, idx) => { - const value = event?.namespace - ? `${event.namespace}:${event.name}` - : event.name; - action += idx ? ` ${value}` : value; - }); - this.pageService.formAction(action); - } - } - - onAnimationCreated(anim: any) { - this.anmViewItem = anim as AnimationItem; - } - - private init(): void { - // TODO - // Need to update to e31_1 when we release a new Shared Parser. - const resource = { - name: (this.animation as any).e31_1 || '' - }; - this.anmResource = this.pageService.getAnimationUrl(resource.name || ''); - if ( - this.anmResource === resource.name && - !this.anmResource.includes('http') - ) { - this.anmResource = this.pageService.findAttachment(resource.name) || ''; - } - - if (this.anmResource) { - this.lottieOptions = { - path: this.anmResource, - loop: !!this.animation.loop, - autoplay: !!this.animation.autoPlay - }; - } - - this.hasEvents = !!this.animation.events; - - if (!!this.animation.playListeners || !!this.animation.stopListeners) { - this.awaitAnimEvent(); - } - this.ready = true; - } - - private awaitAnimEvent(): void { - this.pageService.contentEvent$ - .pipe(takeUntil(this._unsubscribeAll)) - .subscribe((event) => { - if (!this.anmViewItem) return; - const playListeners = this.animation.playListeners.filter( - (listener) => listener.name === event - ).length; - const stopListeners = this.animation.stopListeners.filter( - (listener) => listener.name === event - ).length; - - if (playListeners) { - this.anmViewItem.play(); - } else if (stopListeners) { - this.anmViewItem.pause(); - } - }); - } -} diff --git a/src/app/new-page/component/content-button/content-button.component.css b/src/app/new-page/component/content-button/content-button.component.css deleted file mode 100644 index 3f0d7257..00000000 --- a/src/app/new-page/component/content-button/content-button.component.css +++ /dev/null @@ -1,12 +0,0 @@ -:host { - width: 100%; - display: block; -} - -div.buttonContent { - margin-top: 24px; -} - -:host:not(:first-child) > div.buttonContent { - margin-top: 12px; -} \ No newline at end of file diff --git a/src/app/new-page/component/content-button/content-button.component.html b/src/app/new-page/component/content-button/content-button.component.html deleted file mode 100644 index 742987ad..00000000 --- a/src/app/new-page/component/content-button/content-button.component.html +++ /dev/null @@ -1,19 +0,0 @@ - -
- {{ buttonText }} - {{ buttonText }} -
- diff --git a/src/app/new-page/component/content-button/content-button.component.ts b/src/app/new-page/component/content-button/content-button.component.ts deleted file mode 100644 index 553e7eb9..00000000 --- a/src/app/new-page/component/content-button/content-button.component.ts +++ /dev/null @@ -1,93 +0,0 @@ -import { - Component, - Input, - OnChanges, - OnInit, - SimpleChanges -} from '@angular/core'; -import { Observable } from 'rxjs'; -import { PageService } from '../../service/page-service.service'; -import { - Button, - EventId -} from 'src/app/services/xml-parser-service/xmp-parser.service'; -import { formatEvents } from 'src/app/shared/formatEvents'; - -@Component({ - selector: 'app-content-new-button', - templateUrl: './content-button.component.html', - styleUrls: ['./content-button.component.css'] -}) -export class ContentButtonNewComponent implements OnChanges { - // eslint-disable-next-line @angular-eslint/no-input-rename - @Input() item: Button; - - button: Button; - text: any; - ready: boolean; - buttonText: string; - type: string; - events: EventId[]; - url: string; - buttonTextColor: string; - buttonBgColor: string; - dir$: Observable; - - constructor(private pageService: PageService) { - this.dir$ = this.pageService.pageDir$; - } - - ngOnChanges(changes: SimpleChanges) { - for (const propName in changes) { - if (changes.hasOwnProperty(propName)) { - switch (propName) { - case 'item': { - if ( - !changes['item'].previousValue || - changes['item'].currentValue !== changes['item'].previousValue - ) { - this.ready = false; - this.buttonText = ''; - this.type = ''; - this.events = [] as EventId[]; - this.url = ''; - this.text = null; - this.button = this.item; - this.buttonTextColor = ''; - this.buttonBgColor = ''; - this.init(); - } - } - } - } - } - } - - formAction(): void { - if (this.events && this.type === 'event') { - this.pageService.formAction(formatEvents(this.events)); - } - } - - private init(): void { - // TODO Allow Button styles when Books are ready - // this.buttonTextColor = this.button.buttonColor || '' - // this.buttonBgColor = this.button.backgroundColor || '' - if (this.button.text) { - this.text = this.button.text; - this.buttonText = this.text?.text || ''; - } - const isUrlType = !!this.button.url; - const isEventType = !!this.button.events?.length; - - if (isUrlType) { - this.type = 'url'; - this.url = this.button.url; - } - if (isEventType) { - this.type = 'event'; - this.events = this.button.events; - } - this.ready = true; - } -} diff --git a/src/app/new-page/component/content-form/content-form.component.css b/src/app/new-page/component/content-form/content-form.component.css deleted file mode 100644 index e077c05a..00000000 --- a/src/app/new-page/component/content-form/content-form.component.css +++ /dev/null @@ -1,4 +0,0 @@ -:host { - display: block; - width: 100%; -} diff --git a/src/app/new-page/component/content-form/content-form.component.html b/src/app/new-page/component/content-form/content-form.component.html deleted file mode 100644 index a00799ec..00000000 --- a/src/app/new-page/component/content-form/content-form.component.html +++ /dev/null @@ -1,5 +0,0 @@ - -
- -
- diff --git a/src/app/new-page/component/content-form/content-form.component.ts b/src/app/new-page/component/content-form/content-form.component.ts deleted file mode 100644 index cfb90e2e..00000000 --- a/src/app/new-page/component/content-form/content-form.component.ts +++ /dev/null @@ -1,108 +0,0 @@ -import { - OnChanges, - QueryList, - Component, - Input, - OnDestroy, - OnInit, - SimpleChanges, - ViewChildren -} from '@angular/core'; -import { Observable, Subject } from 'rxjs'; -import { takeUntil } from 'rxjs/operators'; -import { PageService } from '../../service/page-service.service'; -import { ContentRepeaterNewComponent } from '../content-repeater/content-repeater.component'; -import { Content } from 'src/app/services/xml-parser-service/xmp-parser.service'; - -@Component({ - selector: 'app-content-new-form', - templateUrl: './content-form.component.html', - styleUrls: ['./content-form.component.css'] -}) -export class ContentFormNewComponent implements OnInit, OnDestroy, OnChanges { - @Input() item: Content[]; - @ViewChildren(ContentRepeaterNewComponent) - private _inputChildren: QueryList; - - private _unsubscribeAll = new Subject(); - - form: Content[]; - ready: boolean; - items: Content[]; - dir$: Observable; - - constructor(private pageService: PageService) { - this.dir$ = this.pageService.pageDir$; - } - - ngOnInit() { - this.awaitEmailSignupFormDataNeeded(); - } - - ngOnChanges(changes: SimpleChanges) { - for (const propName in changes) { - if (changes.hasOwnProperty(propName)) { - switch (propName) { - case 'item': { - if ( - !changes['item'].previousValue || - changes['item'].currentValue !== changes['item'].previousValue - ) { - this.ready = false; - this.items = []; - this.form = this.item; - this.init(); - } - } - } - } - } - } - - ngOnDestroy() { - this._unsubscribeAll.next(); - this._unsubscribeAll.complete(); - } - - trackByFn(index, item) { - return index; - } - - private init(): void { - this.items = this.item; - this.ready = true; - } - - private awaitEmailSignupFormDataNeeded(): void { - this.pageService.getEmailSignupFormData$ - .pipe(takeUntil(this._unsubscribeAll)) - .subscribe(() => { - const emailFormInputs = []; - const emailFormData = { name: '', email: '', destination_id: '' }; - this._inputChildren.first.components.forEach((component) => { - switch (component.name) { - case 'name': - emailFormData.name = component.value; - emailFormInputs.push(component); - break; - case 'email': - emailFormData.email = component.value; - emailFormInputs.push(component); - break; - case 'destination_id': - emailFormData.destination_id = component.value; - emailFormInputs.push(component); - break; - default: - break; - } - }); - - if (emailFormInputs.length === 3) { - setTimeout(() => { - this.pageService.setEmailSignupFormData(emailFormData); - }, 0); - } - }); - } -} diff --git a/src/app/new-page/component/content-image/content-image.component.css b/src/app/new-page/component/content-image/content-image.component.css deleted file mode 100644 index a8e129df..00000000 --- a/src/app/new-page/component/content-image/content-image.component.css +++ /dev/null @@ -1,12 +0,0 @@ -:host { - width: 100%; - display: block; -} - -.imageContent { - margin-top: 0; -} - -:host:not(:first-child) .imageContent { - margin-top: 24px; -} \ No newline at end of file diff --git a/src/app/new-page/component/content-image/content-image.component.html b/src/app/new-page/component/content-image/content-image.component.html deleted file mode 100644 index 8d3b7619..00000000 --- a/src/app/new-page/component/content-image/content-image.component.html +++ /dev/null @@ -1,8 +0,0 @@ - - - diff --git a/src/app/new-page/component/content-image/content-image.component.ts b/src/app/new-page/component/content-image/content-image.component.ts deleted file mode 100644 index 90b40806..00000000 --- a/src/app/new-page/component/content-image/content-image.component.ts +++ /dev/null @@ -1,70 +0,0 @@ -import { - Component, - Input, - OnChanges, - OnInit, - SimpleChanges -} from '@angular/core'; -import { Observable } from 'rxjs'; -import { PageService } from '../../service/page-service.service'; -import { - DimensionParser, - Image -} from 'src/app/services/xml-parser-service/xmp-parser.service'; -@Component({ - selector: 'app-content-new-image', - templateUrl: './content-image.component.html', - styleUrls: ['./content-image.component.css'] -}) -export class ContentImageNewComponent implements OnChanges { - @Input() item: Image; - - image: Image; - ready: boolean; - imgResource: string; - isFirstPage$: Observable; - width: string; - - constructor(private pageService: PageService) { - this.isFirstPage$ = this.pageService.isFirstPage$; - } - - ngOnChanges(changes: SimpleChanges) { - for (const propName in changes) { - if (changes.hasOwnProperty(propName)) { - switch (propName) { - case 'item': { - if ( - !changes['item'].previousValue || - changes['item'].currentValue !== changes['item'].previousValue - ) { - this.ready = false; - this.imgResource = ''; - this.image = this.item; - this.init(); - } - } - } - } - } - } - - private init(): void { - this.imgResource = this.pageService.getImageUrl( - this.image.resource.name || '' - ); - // Try to find image in all attachments - if ( - this.imgResource === this.image.resource.name && - !this.imgResource.includes('http') - ) { - this.imgResource = - this.pageService.findAttachment(this.image.resource.name) || ''; - } - const dimensions = DimensionParser(this.image.width); - this.width = dimensions?.value - ? dimensions.value + dimensions.symbol - : null; - this.ready = true; - } -} diff --git a/src/app/new-page/component/content-input/content-input.component.css b/src/app/new-page/component/content-input/content-input.component.css deleted file mode 100644 index d827a6a7..00000000 --- a/src/app/new-page/component/content-input/content-input.component.css +++ /dev/null @@ -1,9 +0,0 @@ -:host { - width: 100%; - display: block; - margin-top: 24px; -} - -div.formGroup { - margin-top: 24px; -} \ No newline at end of file diff --git a/src/app/new-page/component/content-input/content-input.component.html b/src/app/new-page/component/content-input/content-input.component.html deleted file mode 100644 index 52cc314b..00000000 --- a/src/app/new-page/component/content-input/content-input.component.html +++ /dev/null @@ -1,13 +0,0 @@ - - - - diff --git a/src/app/new-page/component/content-input/content-input.component.ts b/src/app/new-page/component/content-input/content-input.component.ts deleted file mode 100644 index d724686f..00000000 --- a/src/app/new-page/component/content-input/content-input.component.ts +++ /dev/null @@ -1,79 +0,0 @@ -import { - Component, - Input, - OnChanges, - OnInit, - SimpleChanges -} from '@angular/core'; -import { Observable } from 'rxjs'; -import { PageService } from '../../service/page-service.service'; -import { - Input as xmlInput, - Text, - parseTextRemoveBrTags -} from 'src/app/services/xml-parser-service/xmp-parser.service'; - -@Component({ - selector: 'app-content-new-input', - templateUrl: './content-input.component.html', - styleUrls: ['./content-input.component.css'] -}) -export class ContentInputNewComponent implements OnChanges { - @Input() item: xmlInput; - - input: xmlInput; - label: Text; - placeholder: Text; - ready: boolean; - labelText: string; - placeholderText: string; - required: boolean; - value: string; - name: string; - type: string; - dir$: Observable; - - constructor(private pageService: PageService) { - this.dir$ = this.pageService.pageDir$; - } - - ngOnChanges(changes: SimpleChanges) { - for (const propName in changes) { - if (changes.hasOwnProperty(propName)) { - switch (propName) { - case 'item': { - if ( - !changes['item'].previousValue || - changes['item'].currentValue !== changes['item'].previousValue - ) { - this.ready = false; - this.labelText = ''; - this.placeholderText = ''; - this.input = this.item; - this.label = null; - this.placeholder = null; - this.required = false; - this.value = ''; - this.name = ''; - this.type = ''; - this.init(); - } - } - } - } - } - } - - private init(): void { - this.label = this.input?.label || null; - this.labelText = this.input.label?.text || ''; - this.placeholder = this.input?.placeholder || null; - this.placeholderText = - parseTextRemoveBrTags(this.input?.placeholder?.text) || ''; - this.required = this.input.isRequired; - this.value = this.input.value; - this.name = this.input.name; - this.type = this.input.type.name; - this.ready = true; - } -} diff --git a/src/app/new-page/component/content-link/content-link.component.css b/src/app/new-page/component/content-link/content-link.component.css deleted file mode 100644 index 0c9f0aa9..00000000 --- a/src/app/new-page/component/content-link/content-link.component.css +++ /dev/null @@ -1,4 +0,0 @@ -:host { - width: 100%; - display: block; -} \ No newline at end of file diff --git a/src/app/new-page/component/content-link/content-link.component.html b/src/app/new-page/component/content-link/content-link.component.html deleted file mode 100644 index afb68966..00000000 --- a/src/app/new-page/component/content-link/content-link.component.html +++ /dev/null @@ -1,5 +0,0 @@ - -
- {{ linkText }} -
- diff --git a/src/app/new-page/component/content-link/content-link.component.ts b/src/app/new-page/component/content-link/content-link.component.ts deleted file mode 100644 index d4f0e078..00000000 --- a/src/app/new-page/component/content-link/content-link.component.ts +++ /dev/null @@ -1,70 +0,0 @@ -import { - Component, - Input, - OnChanges, - OnInit, - SimpleChanges -} from '@angular/core'; -import { Observable } from 'rxjs'; -import { PageService } from '../../service/page-service.service'; -import { - Link, - Text, - EventId -} from 'src/app/services/xml-parser-service/xmp-parser.service'; -import { formatEvents } from 'src/app/shared/formatEvents'; - -@Component({ - selector: 'app-content-new-link', - templateUrl: './content-link.component.html', - styleUrls: ['./content-link.component.css'] -}) -export class ContentLinkNewComponent implements OnChanges { - @Input() item: Link; - - link: Link; - text: Text; - ready: boolean; - linkText: string; - events: EventId[]; - dir$: Observable; - - constructor(private pageService: PageService) { - this.dir$ = this.pageService.pageDir$; - } - - ngOnChanges(changes: SimpleChanges) { - for (const propName in changes) { - if (changes.hasOwnProperty(propName)) { - switch (propName) { - case 'item': { - if ( - !changes['item'].previousValue || - changes['item'].currentValue !== changes['item'].previousValue - ) { - this.ready = false; - this.linkText = ''; - this.events = null; - this.text = null; - this.link = this.item; - this.init(); - } - } - } - } - } - } - - formAction(): void { - if (this.events) { - this.pageService.formAction(formatEvents(this.events)); - } - } - - private init(): void { - this.text = this.link.text || null; - this.linkText = this.link.text?.text || ''; - this.events = this.link.events; - this.ready = true; - } -} diff --git a/src/app/new-page/component/content-paragraph/content-paragraph.component.css b/src/app/new-page/component/content-paragraph/content-paragraph.component.css deleted file mode 100644 index ab77b42b..00000000 --- a/src/app/new-page/component/content-paragraph/content-paragraph.component.css +++ /dev/null @@ -1,6 +0,0 @@ -:host { - width: 100%; - display: block; - margin-top: 24px; -} - diff --git a/src/app/new-page/component/content-paragraph/content-paragraph.component.html b/src/app/new-page/component/content-paragraph/content-paragraph.component.html deleted file mode 100644 index f074453e..00000000 --- a/src/app/new-page/component/content-paragraph/content-paragraph.component.html +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/src/app/new-page/component/content-paragraph/content-paragraph.component.ts b/src/app/new-page/component/content-paragraph/content-paragraph.component.ts deleted file mode 100644 index 469b4079..00000000 --- a/src/app/new-page/component/content-paragraph/content-paragraph.component.ts +++ /dev/null @@ -1,44 +0,0 @@ -import { Component, Input, OnChanges, SimpleChanges } from '@angular/core'; -import { - Paragraph, - Content -} from 'src/app/services/xml-parser-service/xmp-parser.service'; -@Component({ - selector: 'app-content-new-paragraph', - templateUrl: './content-paragraph.component.html', - styleUrls: ['./content-paragraph.component.css'] -}) -export class ContentParagraphNewComponent implements OnChanges { - @Input() item: Paragraph; - - paragraph: Paragraph; - ready: boolean; - items: Array; - - constructor() {} - - ngOnChanges(changes: SimpleChanges) { - for (const propName in changes) { - if (changes.hasOwnProperty(propName)) { - switch (propName) { - case 'item': { - if ( - !changes['item'].previousValue || - changes['item'].currentValue !== changes['item'].previousValue - ) { - this.ready = false; - this.items = []; - this.paragraph = this.item; - this.init(); - } - } - } - } - } - } - - private init(): void { - this.items = this.paragraph.content; - this.ready = true; - } -} diff --git a/src/app/new-page/component/content-spacer/content-spacer.component.css b/src/app/new-page/component/content-spacer/content-spacer.component.css deleted file mode 100644 index e69de29b..00000000 diff --git a/src/app/new-page/component/content-spacer/content-spacer.component.html b/src/app/new-page/component/content-spacer/content-spacer.component.html deleted file mode 100644 index 8605915c..00000000 --- a/src/app/new-page/component/content-spacer/content-spacer.component.html +++ /dev/null @@ -1 +0,0 @@ - diff --git a/src/app/new-page/component/content-spacer/content-spacer.component.ts b/src/app/new-page/component/content-spacer/content-spacer.component.ts deleted file mode 100644 index 1c898e08..00000000 --- a/src/app/new-page/component/content-spacer/content-spacer.component.ts +++ /dev/null @@ -1,57 +0,0 @@ -import { - Component, - Input, - OnChanges, - OnInit, - SimpleChanges -} from '@angular/core'; -import { Observable } from 'rxjs'; -import { PageService } from '../../service/page-service.service'; -import { Spacer } from 'src/app/services/xml-parser-service/xmp-parser.service'; - -@Component({ - selector: 'app-content-new-spacer', - templateUrl: './content-spacer.component.html', - styleUrls: ['./content-spacer.component.css'] -}) -export class ContentSpacerNewComponent implements OnChanges { - // eslint-disable-next-line @angular-eslint/no-input-rename - @Input() item: Spacer; - - spacer: Spacer; - ready: boolean; - mode: string; - height: number; - dir$: Observable; - - constructor(private pageService: PageService) { - this.dir$ = this.pageService.pageDir$; - } - - ngOnChanges(changes: SimpleChanges) { - for (const propName in changes) { - if (changes.hasOwnProperty(propName)) { - switch (propName) { - case 'item': { - if ( - !changes['item'].previousValue || - changes['item'].currentValue !== changes['item'].previousValue - ) { - this.mode = ''; - this.height = 0; - this.spacer = this.item; - this.ready = false; - this.init(); - } - } - } - } - } - } - - private init(): void { - this.mode = this.spacer.mode.name; - this.height = this.spacer.height; - this.ready = true; - } -} diff --git a/src/app/new-page/component/content-tabs/content-tabs.component.css b/src/app/new-page/component/content-tabs/content-tabs.component.css deleted file mode 100644 index e69de29b..00000000 diff --git a/src/app/new-page/component/content-tabs/content-tabs.component.html b/src/app/new-page/component/content-tabs/content-tabs.component.html deleted file mode 100644 index 41b6fe8f..00000000 --- a/src/app/new-page/component/content-tabs/content-tabs.component.html +++ /dev/null @@ -1,12 +0,0 @@ - - - -
-

{{ tab.tab.label.text }}

- -
- - - diff --git a/src/app/new-page/component/content-tabs/content-tabs.component.ts b/src/app/new-page/component/content-tabs/content-tabs.component.ts deleted file mode 100644 index 70cbd12f..00000000 --- a/src/app/new-page/component/content-tabs/content-tabs.component.ts +++ /dev/null @@ -1,78 +0,0 @@ -import { - Component, - Input, - OnChanges, - OnInit, - SimpleChanges -} from '@angular/core'; -import { Observable } from 'rxjs'; -import { PageService } from '../../service/page-service.service'; -import { - Tabs, - Tab, - Content -} from 'src/app/services/xml-parser-service/xmp-parser.service'; - -interface TabWithContent { - tab: Tab; - contents: Content[]; -} - -@Component({ - selector: 'app-content-new-tabs', - templateUrl: './content-tabs.component.html', - styleUrls: ['./content-tabs.component.css'] -}) -export class ContentTabsNewComponent implements OnChanges { - // eslint-disable-next-line @angular-eslint/no-input-rename - @Input() item: Tabs; - - tabs: Tabs; - content: TabWithContent[]; - contents: Content[]; - ready: boolean; - dir$: Observable; - isModal$: Observable; - - constructor(private pageService: PageService) { - this.dir$ = this.pageService.pageDir$; - this.isModal$ = this.pageService.isModal$; - } - - ngOnChanges(changes: SimpleChanges) { - for (const propName in changes) { - if (changes.hasOwnProperty(propName)) { - switch (propName) { - case 'item': { - if ( - !changes['item'].previousValue || - changes['item'].currentValue !== changes['item'].previousValue - ) { - this.ready = false; - this.tabs = this.item; - this.content = []; - this.contents = []; - this.init(); - } - } - } - } - } - } - - trackByFn(index, item) { - return index; - } - - private init(): void { - this.tabs.tabs.forEach((tab) => { - const contents: Content[] = []; - if (tab.content) - tab.content.forEach((content) => - content ? contents.push(content) : null - ); - this.content.push({ tab, contents }); - }); - this.ready = true; - } -} diff --git a/src/app/new-page/component/content-text/content-text.component.css b/src/app/new-page/component/content-text/content-text.component.css deleted file mode 100644 index d72d6031..00000000 --- a/src/app/new-page/component/content-text/content-text.component.css +++ /dev/null @@ -1,13 +0,0 @@ -:host { - width: 100%; - display: block; -} - -p.textContent { - margin-top: 24px; -} - -:host:not(:first-child) > p.textContent { - margin-top: 12px; -} - diff --git a/src/app/new-page/component/content-text/content-text.component.html b/src/app/new-page/component/content-text/content-text.component.html deleted file mode 100644 index 5b7e7083..00000000 --- a/src/app/new-page/component/content-text/content-text.component.html +++ /dev/null @@ -1,10 +0,0 @@ - - -

- diff --git a/src/app/new-page/component/content-text/content-text.component.ts b/src/app/new-page/component/content-text/content-text.component.ts deleted file mode 100644 index dd02d36b..00000000 --- a/src/app/new-page/component/content-text/content-text.component.ts +++ /dev/null @@ -1,69 +0,0 @@ -import { - Component, - Input, - OnChanges, - OnInit, - SimpleChanges -} from '@angular/core'; -import { Observable } from 'rxjs'; -import { PageService } from '../../service/page-service.service'; -import { - Text, - parseTextAddBrTags -} from 'src/app/services/xml-parser-service/xmp-parser.service'; - -@Component({ - selector: 'app-content-new-text', - templateUrl: './content-text.component.html', - styleUrls: ['./content-text.component.css'] -}) -export class ContentTextNewComponent implements OnChanges { - @Input() item: Text; - - text: Text; - ready: boolean; - textValue: string; - isFirstPage$: Observable; - dir$: Observable; - textColor: string; - styles: any; - - constructor(private pageService: PageService) { - this.isFirstPage$ = pageService.isFirstPage$; - this.dir$ = this.pageService.pageDir$; - } - - ngOnChanges(changes: SimpleChanges) { - for (const propName in changes) { - if (changes.hasOwnProperty(propName)) { - switch (propName) { - case 'item': { - if ( - !changes['item'].previousValue || - changes['item'].currentValue !== changes['item'].previousValue - ) { - this.ready = false; - this.textValue = ''; - this.text = this.item as Text; - this.init(); - } - } - } - } - } - } - - private init(): void { - const styles = {}; - this.text?.textStyles?.forEach((style) => { - if (style.name === 'BOLD') styles['font-weight'] = 'bold'; - if (style.name === 'ITALIC') styles['font-style'] = 'italic'; - if (style.name === 'UNDERLINE') styles['text-decoration'] = 'underline'; - }); - this.styles = styles; - this.textColor = this.text.textColor || null; - const text = parseTextAddBrTags(this.text.text); - this.textValue = text || ''; - this.ready = true; - } -} diff --git a/src/app/new-page/component/content-video/content-video.component.css b/src/app/new-page/component/content-video/content-video.component.css deleted file mode 100644 index 1f3120a7..00000000 --- a/src/app/new-page/component/content-video/content-video.component.css +++ /dev/null @@ -1,40 +0,0 @@ -:host { - width: 100%; - display: block; -} - -div.video-embed { - display: block; -} - -@media screen and (max-width: 615px) { - div.video-embed { - width: calc(100% - 48px); - margin-left: 24px; - margin-right: 24px; - padding-bottom: 56.25%; - position: relative; - } - - div.video-embed > iframe { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - border: 0; - } -} - -@media screen and (min-width: 616px) { - div.video-embed { - width: 560px; - height: 315px; - margin: 0 auto; - } - - div.video-embed > iframe { - width: 100%; - height: 100%; - } -} diff --git a/src/app/new-page/component/content-video/content-video.component.html b/src/app/new-page/component/content-video/content-video.component.html deleted file mode 100644 index 37e47747..00000000 --- a/src/app/new-page/component/content-video/content-video.component.html +++ /dev/null @@ -1,7 +0,0 @@ - - -
- -
- - diff --git a/src/app/new-page/component/content-video/content-video.component.ts b/src/app/new-page/component/content-video/content-video.component.ts deleted file mode 100644 index a3b8a9c1..00000000 --- a/src/app/new-page/component/content-video/content-video.component.ts +++ /dev/null @@ -1,66 +0,0 @@ -import { - Component, - Input, - OnChanges, - OnInit, - SimpleChanges -} from '@angular/core'; -import { DomSanitizer, SafeResourceUrl } from '@angular/platform-browser'; -import { Observable } from 'rxjs'; -import { PageService } from '../../service/page-service.service'; -import { Video } from 'src/app/services/xml-parser-service/xmp-parser.service'; - -@Component({ - selector: 'app-content-new-video', - templateUrl: './content-video.component.html', - styleUrls: ['./content-video.component.css'] -}) -export class ContentVideoNewComponent implements OnChanges { - @Input() item: Video; - - video: Video; - ready: boolean; - provider: string; - videoId: string; - videoUrl: SafeResourceUrl; - dir$: Observable; - - constructor( - private pageService: PageService, - public sanitizer: DomSanitizer - ) { - this.dir$ = this.pageService.pageDir$; - } - - ngOnChanges(changes: SimpleChanges) { - for (const propName in changes) { - if (changes.hasOwnProperty(propName)) { - switch (propName) { - case 'item': { - if ( - !changes['item'].previousValue || - changes['item'].currentValue !== changes['item'].previousValue - ) { - this.provider = ''; - this.videoId = ''; - this.video = this.item; - this.ready = false; - this.init(); - } - } - } - } - } - } - - private init(): void { - this.provider = this.video.provider.name || ''; - this.videoId = this.video.videoId || ''; - setTimeout(() => { - this.videoUrl = this.sanitizer.bypassSecurityTrustResourceUrl( - `https://www.youtube.com/embed/${this.videoId}` - ); - }, 0); - this.ready = true; - } -} diff --git a/src/app/new-page/component/modal/modal.component.css b/src/app/new-page/component/modal/modal.component.css deleted file mode 100644 index d69944c3..00000000 --- a/src/app/new-page/component/modal/modal.component.css +++ /dev/null @@ -1,14 +0,0 @@ -:host { - width: 100%; - display: block; -} - -.stepHeading { - margin-bottom: 24px; -} - -.stepHeading + * { - margin-top: 48px; -} - - diff --git a/src/app/new-page/component/modal/modal.component.html b/src/app/new-page/component/modal/modal.component.html deleted file mode 100644 index 571336cf..00000000 --- a/src/app/new-page/component/modal/modal.component.html +++ /dev/null @@ -1,13 +0,0 @@ - -
-

-
- - - - - diff --git a/src/app/new-page/component/modal/modal.component.ts b/src/app/new-page/component/modal/modal.component.ts deleted file mode 100644 index b25f42b9..00000000 --- a/src/app/new-page/component/modal/modal.component.ts +++ /dev/null @@ -1,66 +0,0 @@ -import { - Component, - Input, - OnChanges, - OnInit, - SimpleChanges -} from '@angular/core'; -import { Observable } from 'rxjs'; -import { PageService } from '../../service/page-service.service'; -import { - Modal, - Text, - parseTextAddBrTags, - Content -} from 'src/app/services/xml-parser-service/xmp-parser.service'; - -@Component({ - selector: 'app-page-new-modal', - templateUrl: './modal.component.html', - styleUrls: ['./modal.component.css'] -}) -export class ModalNewComponent implements OnChanges { - @Input() modal: Modal; - - ready: boolean; - title: Text; - content: Content[]; - titleText: string; - dir$: Observable; - - constructor(private pageService: PageService) { - this.dir$ = this.pageService.pageDir$; - } - - ngOnChanges(changes: SimpleChanges) { - for (const propName in changes) { - if (changes.hasOwnProperty(propName)) { - switch (propName) { - case 'modal': { - if ( - !changes['modal'].previousValue || - changes['modal'].currentValue !== changes['modal'].previousValue - ) { - this.ready = false; - this.title = null; - this.titleText = ''; - this.content = []; - this.init(); - } - } - } - } - } - } - - trackByFn(index, item) { - return index; - } - - private init(): void { - this.title = this.modal?.title || null; - this.titleText = parseTextAddBrTags(this.title?.text) || ''; - this.content = this.modal.content; - this.ready = true; - } -} diff --git a/src/app/new-page/component/page-header/page-header.component.css b/src/app/new-page/component/page-header/page-header.component.css deleted file mode 100644 index 669be340..00000000 --- a/src/app/new-page/component/page-header/page-header.component.css +++ /dev/null @@ -1,4 +0,0 @@ -:host { - width: 100%; - display: block; -} diff --git a/src/app/new-page/component/page-header/page-header.component.html b/src/app/new-page/component/page-header/page-header.component.html deleted file mode 100644 index a68846ab..00000000 --- a/src/app/new-page/component/page-header/page-header.component.html +++ /dev/null @@ -1,23 +0,0 @@ - -

- {{ headerText }} -

- - -
-

- {{ headerNumber }} - {{ headerText }} -

-
- diff --git a/src/app/new-page/component/page-header/page-header.component.ts b/src/app/new-page/component/page-header/page-header.component.ts deleted file mode 100644 index f552a96e..00000000 --- a/src/app/new-page/component/page-header/page-header.component.ts +++ /dev/null @@ -1,75 +0,0 @@ -import { - Component, - Input, - OnChanges, - OnInit, - SimpleChanges -} from '@angular/core'; -import { Observable, Subject } from 'rxjs'; -import { takeUntil } from 'rxjs/operators'; -import { PageService } from '../../service/page-service.service'; -import { - Header, - parseTextAddBrTags -} from 'src/app/services/xml-parser-service/xmp-parser.service'; - -@Component({ - selector: 'app-page-new-header', - templateUrl: './page-header.component.html', - styleUrls: ['./page-header.component.css'] -}) -export class PageHeaderNewComponent implements OnChanges { - @Input() header: Header; - - private _unsubscribeAll: Subject; - - ready: boolean; - headerText: string; - headerNumber: number | null; - dir$: Observable; - changeHeader$: Observable; - isForm$: Observable; - isFirstPage$: Observable; - - constructor(private pageService: PageService) { - this._unsubscribeAll = new Subject(); - this.dir$ = this.pageService.pageDir$; - this.isForm$ = this.pageService.isForm$; - this.isFirstPage$ = this.pageService.isFirstPage$; - this.changeHeader$ = this.pageService.changeHeader$; - } - - ngOnChanges(changes: SimpleChanges) { - for (const propName in changes) { - if (changes.hasOwnProperty(propName)) { - switch (propName) { - case 'header': { - if ( - !changes['header'].previousValue || - changes['header'].currentValue !== changes['header'].previousValue - ) { - this.ready = false; - this.headerText = ''; - this.headerNumber = null; - this.init(); - } - } - } - } - } - } - - private init(): void { - const { title, number } = this.header; - this.headerText = parseTextAddBrTags(title?.text) || ''; - this.headerNumber = number?.text ? Number(number.text) : null; - - this.changeHeader$ - .pipe(takeUntil(this._unsubscribeAll)) - .subscribe((newHeader) => { - this.headerText = newHeader; - }); - - this.ready = true; - } -} diff --git a/src/app/new-page/component/page-hero/page-hero.component.css b/src/app/new-page/component/page-hero/page-hero.component.css deleted file mode 100644 index 66c4b91b..00000000 --- a/src/app/new-page/component/page-hero/page-hero.component.css +++ /dev/null @@ -1,9 +0,0 @@ -:host { - width: 100%; - display: block; -} - - -app-content-new-repeater { - margin-top: 0; -} \ No newline at end of file diff --git a/src/app/new-page/component/page-hero/page-hero.component.html b/src/app/new-page/component/page-hero/page-hero.component.html deleted file mode 100644 index 8d0de762..00000000 --- a/src/app/new-page/component/page-hero/page-hero.component.html +++ /dev/null @@ -1,15 +0,0 @@ - -
-

-
- - -

- - - - diff --git a/src/app/new-page/component/page-hero/page-hero.component.ts b/src/app/new-page/component/page-hero/page-hero.component.ts deleted file mode 100644 index 4fbdd66c..00000000 --- a/src/app/new-page/component/page-hero/page-hero.component.ts +++ /dev/null @@ -1,84 +0,0 @@ -import { - Component, - Input, - OnChanges, - OnDestroy, - OnInit, - SimpleChanges -} from '@angular/core'; -import { Observable, Subject } from 'rxjs'; -import { takeUntil } from 'rxjs/operators'; -import { PageService } from '../../service/page-service.service'; -import { - Text, - Hero, - parseTextAddBrTags, - Content -} from 'src/app/services/xml-parser-service/xmp-parser.service'; -@Component({ - selector: 'app-page-new-hero', - templateUrl: './page-hero.component.html', - styleUrls: ['./page-hero.component.css'] -}) -export class PageHeroNewComponent implements OnDestroy, OnChanges { - @Input() hero: Hero; - - private _unsubscribeAll: Subject; - - ready: boolean; - heading: Text; - headingText: string; - content: Array; - dir$: Observable; - isForm$: Observable; - isFirstPage$: Observable; - changeHeader$: Observable; - - constructor(private pageService: PageService) { - this._unsubscribeAll = new Subject(); - this.dir$ = this.pageService.pageDir$; - this.isForm$ = this.pageService.isForm$; - this.isFirstPage$ = this.pageService.isFirstPage$; - this.changeHeader$ = this.pageService.changeHeader$; - } - - ngOnDestroy() { - this._unsubscribeAll.next(); - this._unsubscribeAll.complete(); - } - - ngOnChanges(changes: SimpleChanges) { - for (const propName in changes) { - if (changes.hasOwnProperty(propName)) { - switch (propName) { - case 'hero': { - if ( - !changes['hero'].previousValue || - changes['hero'].currentValue !== changes['hero'].previousValue - ) { - this.ready = false; - this.heading = null; - this.headingText = ''; - this.content = []; - this.init(); - } - } - } - } - } - } - - private init(): void { - this.heading = this.hero?.heading; - this.headingText = parseTextAddBrTags(this.heading?.text); - this.content = this.hero.content; - - this.changeHeader$ - .pipe(takeUntil(this._unsubscribeAll)) - .subscribe((newHeader) => { - this.headingText = newHeader; - }); - - this.ready = true; - } -} diff --git a/src/app/new-page/component/tract-page/tract-page.component.css b/src/app/new-page/component/tract-page/tract-page.component.css deleted file mode 100644 index ee64582b..00000000 --- a/src/app/new-page/component/tract-page/tract-page.component.css +++ /dev/null @@ -1,272 +0,0 @@ -app-tract-new-page { - width: 100%; - display: block; -} - -/***** Buttons *****/ -.button { - cursor: pointer; - font-size: 20px; - line-height: 46px; - border: var(--kg-blue) 1px solid; - color: var(--kg-white); - background-color: var(--kg-blue); - border-radius: 50px; - display: inline-block; - padding-left: 15px; - padding-right: 15px; -} -.button.button-white { - color: var(--kg-blue); - background-color: var(--kg-white); -} -.button:hover { - color: var(--kg-white) !important; - background-color: var(--kg-blue-light) !important; - border-color: var(--kg-blue-light) !important; -} - -/***** Tool Navigation *****/ -#tool-navigation .button { - width: 120px; - font-size: 14.4px; - margin-top: 48px !important; -} - -#tool-navigation .button:first-child:not(:last-child) { - border-right-width: 0; - border-top-right-radius: 0; - border-bottom-right-radius: 0; -} - -#tool-navigation .button:last-child:not(:first-child) { - border-left-width: 0; - border-top-left-radius: 0; - border-bottom-left-radius: 0; -} - -#tool-navigation .button:first-child:last-child { - border-width: 1px; -} - -.firstPage #tool-navigation .button, -.lastPage #tool-navigation .button { - width: 240px; -} - -@media screen and (max-width: 319px) { - #tool-navigation .button { - width: 100px; - } -} - -/***** Content Heading *****/ - -.firstHeading { - margin-top: 48px; - margin-bottom: 31px !important; -} - -.stepHeading { - padding-top: 25px; - padding-bottom: 25px; - color: white; - background-color: var(--kg-blue); -} - -.stepHeading h1 { - position: relative; - font-size: 24px; - line-height: 30px; - color: white; - font-weight: 300; -} - -.stepHeading span { - margin-right: 12px; -} - -.stepHeading h1[dir='rtl'] span { - margin-left: 12px; -} - -#toolContent.hasPageHeader > app-page-new-hero > .stepHeading { - padding: 0; -} - -#toolContent.hasPageHeader > app-page-new-hero > .stepHeading > h1 { - display: none; -} - -@media screen and (min-width: 440px) { - .stepHeading h1, - h4 { - font-size: 32px; - line-height: 1.1667; - font-weight: 200; - } -} - -@media screen and (min-width: 616px) { - /* 568 + 48 */ - .mw568 { - max-width: 568px; - width: 100%; - margin-left: auto; - margin-right: auto; - } - - .indent { - padding-left: 44px; - padding-right: 44px; - } -} - -@media screen and (min-width: 768px) { - .stepHeading { - min-height: 124px; - } - .stepHeading.noCounter { - min-height: unset; - text-align: center; - } - - .stepHeading.tenSteps h1 { - padding-left: 40px; - } - - .stepHeading span { - position: absolute; - top: -10px; - left: -64px; - margin-left: 0; - margin-right: 0; - font-weight: 200; - font-size: 90px; - line-height: 1; - } - - .stepHeading h1[dir='rtl'] span { - left: auto; - right: -64px; - } -} - -/***** Forms *****/ - -.formContent label { - display: block; - font-size: 16px; - color: var(--kg-blue); - line-height: 20px; -} - -.formContent label + .form-control { - margin-top: 10px; -} - -.formContent .form-control { - display: block; - width: 100%; - padding: 12px; - font-size: 16px; - font-family: 'Source Sans Pro', sans-serif; - border: 1px solid #3ba4db; - border-radius: 8px; -} - -.formContent .cardLink a { - color: var(--kg-blue); - cursor: pointer; -} - -/***** Content Elements *****/ - -p.firstContent { - font-size: 20px; -} - -.imageContent { - display: block; - margin-left: auto; - margin-right: auto; -} - -.arrayContent span { - display: block; -} - -.calltoaction { - text-align: center; - font-weight: 300; - font-size: 24px; - line-height: 30px; -} - -.cardHeading + .cardButton { - margin-top: 48px; -} - -.cardButton { - text-align: center; -} - -.cardButton + .cardButton { - margin-top: 12px; -} - -.buttonContent .button { - min-width: 200px; - max-width: 100%; -} - -.linkContent { - text-align: center; - margin-top: 24px; - width: 100%; - display: inherit; -} - -.linkContent a { - color: #3ba4db; - cursor: pointer; -} - -@media screen and (min-width: 440px) { - .calltoaction { - font-weight: 200; - } - footer { - padding: 12px 0; - } - footer span { - display: inline-block; - text-align: left; - } - footer span:last-child { - float: right; - } -} - -div.cardContent:not(.hasHading) { - margin-top: 48px !important; -} - - -app-content-new-repeater > app-content-new-text { - margin-top: 24px -} -@media screen and (min-width: 616px) { - - div.cardContent.hasHeading app-content-new-text > p.textContent, - div.tabContent app-content-new-text > p.textContent { - padding-left: 44px; - padding-right: 44px; - } - - .modal-paragraph > app-content-new-text > p.textContent { - padding-left: 44px; - padding-right: 44px; - } -} - diff --git a/src/app/new-page/component/tract-page/tract-page.component.html b/src/app/new-page/component/tract-page/tract-page.component.html deleted file mode 100644 index 7701d447..00000000 --- a/src/app/new-page/component/tract-page/tract-page.component.html +++ /dev/null @@ -1,91 +0,0 @@ - -
- - - - - - - - - - - -
- - - - - - - - - - - - - - - - - - - - - - - -
- - - - -
- diff --git a/src/app/new-page/component/tract-page/tract-page.component.ts b/src/app/new-page/component/tract-page/tract-page.component.ts deleted file mode 100644 index 5d13dc72..00000000 --- a/src/app/new-page/component/tract-page/tract-page.component.ts +++ /dev/null @@ -1,282 +0,0 @@ -import { - Component, - Input, - OnChanges, - OnDestroy, - OnInit, - SimpleChanges, - ViewEncapsulation -} from '@angular/core'; -import { Observable, Subject } from 'rxjs'; -import { takeUntil } from 'rxjs/operators'; -import { PageService } from '../../service/page-service.service'; -import { - TractPage, - Modal, - TractPageCard, - Hero, - Header, - CallToAction, - EventId -} from 'src/app/services/xml-parser-service/xmp-parser.service'; - -@Component({ - selector: 'app-tract-new-page', - templateUrl: './tract-page.component.html', - styleUrls: ['./tract-page.component.css'], - encapsulation: ViewEncapsulation.None -}) -export class TractPageNewComponent implements OnChanges, OnDestroy { - @Input() page: TractPage; - @Input() order: number; - @Input() totalPages: number; - - private _unsubscribeAll: Subject; - private _page: TractPage; - private _cardShownOnFormAction = -1; - private _cardsHiddenOnFormAction: number[] = []; - - header: Header; - hero: Hero; - cards: TractPageCard[]; - modal: Modal; - callToAction: CallToAction; - ready: boolean; - hasPageHeader: boolean; - dir$: Observable; - formAction$: Observable; - isForm$: Observable; - isModal$: Observable; - isFirstPage$: Observable; - isLastPage$: Observable; - currentYear = new Date().getFullYear(); - - constructor(private pageService: PageService) { - this._unsubscribeAll = new Subject(); - this.dir$ = this.pageService.pageDir$; - this.isForm$ = this.pageService.isForm$; - this.isModal$ = this.pageService.isModal$; - this.isFirstPage$ = this.pageService.isFirstPage$; - this.isLastPage$ = this.pageService.isLastPage$; - this.formAction$ = this.pageService.formAction$; - } - - ngOnDestroy() { - this._unsubscribeAll.next(); - this._unsubscribeAll.complete(); - } - - next(): void { - if (!this.ready) { - return; - } - this.pageService.nextPage(); - } - - previous(): void { - if (!this.ready) { - return; - } - - this.pageService.previousPage(); - } - - ngOnChanges(changes: SimpleChanges) { - for (const propName in changes) { - if (changes.hasOwnProperty(propName)) { - switch (propName) { - case 'page': - if ( - !changes['page'].previousValue || - changes['page'].currentValue !== changes['page'].previousValue - ) { - this.ready = false; - this._page = this.page; - this.header = null; - this.hero = null; - this.cards = []; - this.modal = null; - this.callToAction = null; - this.hasPageHeader = false; - this.init(); - } - break; - default: - break; - } - } - } - } - - private onFormAction(inputFunctionName: string): void { - let functionName = inputFunctionName; - - if (functionName.indexOf(' ') > -1) { - const splitname = functionName.split(' '); - functionName = - splitname[0].indexOf(':') > -1 ? splitname[1].trim() : splitname[0]; - } - - let isShowCard: boolean; - let isHideCard: boolean; - let isShowModal: boolean; - let isHideModal: boolean; - - if (inputFunctionName.toLowerCase().indexOf('followup:send') !== -1) { - this.pageService.emailSignumFormDataNeeded(); - setTimeout(() => { - this.onFormAction(functionName); - }, 0); - return; - } else { - if (functionName.includes('-no-thanks')) { - let isFirstPage = false; - let isLastPage = true; - this.isFirstPage$.subscribe((value) => { - isFirstPage = value; - }); - this.isLastPage$.subscribe((value) => { - isLastPage = value; - }); - - if (!isLastPage) { - this.pageService.nextPage(); - } else if (!isFirstPage) { - this.pageService.previousPage(); - } - return; - } - - if (this.cards.length) { - const cardListener = this.cards.find((card) => - card.listeners - ? card.listeners.find((listener) => listener.name === functionName) - : null - ); - if (cardListener) { - this._cardShownOnFormAction = cardListener.position; - isShowCard = true; - } - - const cardDismissListener = this.cards.find((card) => - card.dismissListeners - ? card.dismissListeners.find( - (dismissListener) => dismissListener.name === functionName - ) - : null - ); - if (cardDismissListener) isHideCard = true; - } - if (!isShowCard && !isHideCard && this.modal) { - const listeners = this.modal.listeners as EventId[]; - const dismissListeners = this.modal.dismissListeners as EventId[]; - isShowModal = !!listeners.filter( - (listener) => listener.name === functionName - )?.length; - isHideModal = !!dismissListeners.filter( - (dismissListener) => dismissListener.name === functionName - )?.length; - listeners.forEach((l) => {}); - dismissListeners.forEach((l) => {}); - } - } - - if (isShowCard) { - // Set type as Any so we can edit isHidden property. - const card_to_show = this.cards[this._cardShownOnFormAction]; - (card_to_show as any).isHidden = false; - this.pageService.formVisible(); - this.pageService.modalHidden(); - - if (card_to_show.label?.text) { - this.pageService.changeHeader(card_to_show.label.text); - } - - this.cards.forEach((card) => { - if (card.listeners?.length) { - card.listeners.forEach((listener) => { - if (!card.isHidden && listener.name !== functionName) { - this._cardsHiddenOnFormAction.push(card.position); - } - }); - } else { - this._cardsHiddenOnFormAction.push(card.position); - } - }); - - if (this._cardsHiddenOnFormAction.length) { - this.cards - .filter((card) => - this._cardsHiddenOnFormAction.includes(card.position) - ) - .map((card) => { - (card as any).isHidden = true; - }); - } - } else if (isHideCard) { - this.next(); - setTimeout(() => { - this.pageService.formHidden(); - this.pageService.modalHidden(); - if (this._cardsHiddenOnFormAction.length) this.setHiddenCardToShow(); - if (this._cardShownOnFormAction >= 0) this.setShownCardToHidden(); - - this._cardShownOnFormAction = -1; - this._cardsHiddenOnFormAction = []; - }, 0); - } else if (isShowModal) { - this.pageService.modalVisible(); - this.pageService.formHidden(); - } else if (isHideModal) { - this.pageService.modalHidden(); - this.pageService.formHidden(); - this.next(); - setTimeout(() => { - if (this._cardsHiddenOnFormAction.length) this.setHiddenCardToShow(); - if (this._cardShownOnFormAction >= 0) this.setShownCardToHidden(); - - this._cardShownOnFormAction = -1; - this._cardsHiddenOnFormAction = []; - }, 0); - } else { - this.pageService.contentEvent(functionName); - } - } - - private setHiddenCardToShow(): void { - this.cards - .filter((card) => this._cardsHiddenOnFormAction.includes(card.position)) - .forEach((card) => { - (card as any).isHidden = false; - }); - } - - private setShownCardToHidden(): void { - const card = this.cards.find( - (card) => card.position === this._cardShownOnFormAction - ); - if (card) (card as any).isHidden = true; - } - - private init(): void { - this.pageService.setPageOrder(this.order, this.totalPages); - this.pageService.modalHidden(); - this.pageService.formHidden(); - this.header = this._page.header || null; - this.hasPageHeader = !!this._page.header?.title?.text; - this.hero = this._page.hero || null; - this.cards = this._page.cards || []; - this.modal = this._page.modals ? this._page.modals[0] : null; - this.callToAction = this._page.callToAction?.label?.text - ? this._page.callToAction - : null; - - this.formAction$ - .pipe(takeUntil(this._unsubscribeAll)) - .subscribe((action) => { - this.onFormAction(action); - }); - - this.ready = true; - } -} diff --git a/src/app/new-page/model/page-parameters.ts b/src/app/new-page/model/page-parameters.ts deleted file mode 100644 index 13b95f8f..00000000 --- a/src/app/new-page/model/page-parameters.ts +++ /dev/null @@ -1,5 +0,0 @@ -export interface IPageParameters { - langid: string; - bookid: string; - pageid?: number; -} diff --git a/src/app/new-page/page.component.css b/src/app/new-page/page.component.css deleted file mode 100644 index f200cf74..00000000 --- a/src/app/new-page/page.component.css +++ /dev/null @@ -1,141 +0,0 @@ -/***** Elements *****/ -html { - background-color: white !important; -} - -h1, -h2, -h3, -h4, -h5, -h6, -p { - margin-bottom: 0; -} - -h4 { - font-size: 24px; - line-height: 30px; - font-weight: 300; -} - -p { - line-height: 24px; -} - -/***** High level *****/ -.outerbox { - width: 100%; - max-width: 768px; - margin: 0 auto; -} - -.mw568 { - width: calc(100% - 48px); - margin-left: 24px; - margin-right: 24px; -} -.mw568.kg-bg-gray-light { - margin-left: 0; - margin-right: 0; - padding-left: 24px; - padding-right: 24px; -} - -@media screen and (min-width: 616px) { - /* 568 + 48 */ - .mw568 { - max-width: 568px; - width: 100%; - margin-left: auto; - margin-right: auto; - } -} - -/***** Language Selector *****/ -.language-selector-toggle { - line-height: 36px; - padding: 12px 24px; - cursor: pointer; -} - -.language-selector-toggle .fas { - margin-left: 5px; -} - -.language-selector-toggle > .langicon { - width: auto; - float: left; - margin-top: 10px; - margin-right: 8px; -} - -/***** Tool Header *****/ -#toolHeader { - position: relative; - z-index: 1; -} - -#languageList { - background-color: #f0f0f0; -} - -#languageList ul { - columns: 2; - margin: 0; - padding: 0; -} - -#languageList li { - margin: 0; - padding: 4px 16px; - list-style-type: none; - border-radius: 16px; - line-height: 1.25; -} - -#languageList li:hover { - background-color: white; - cursor: pointer; -} - -@media screen and (min-width: 550px) { - #languageList ul { - columns: 3; - } -} - -/***** Tool Footer *****/ -#toolFooter { - margin-top: 48px !important; -} - -footer { - position: relative; - padding: 12px 24px; - border-top: var(--kg-gray-light) 2px solid; - font-size: 11px; - text-align: left; -} - -footer span { - display: block; - line-height: 20px; - white-space: nowrap; - text-align: center; - padding-left: 24px; - padding-right: 24px; -} - -@media screen and (min-width: 440px) { - footer { - padding: 12px 0; - } - footer span { - display: inline-block; - text-align: left; - } - footer span:last-child { - float: right; - } -} \ No newline at end of file diff --git a/src/app/new-page/page.component.html b/src/app/new-page/page.component.html deleted file mode 100644 index 1926c56c..00000000 --- a/src/app/new-page/page.component.html +++ /dev/null @@ -1,52 +0,0 @@ - -
-
-
- - {{ selectedLang }} - - - -
-
-
-
    -
  • - {{ lang.attributes.name }} -
    • -
-
-
-
- - - - - -
-

This book isn't available in the currently selected language.

-
- - - -
-

Failed to load the book.

-
- -
- diff --git a/src/app/new-page/page.component.spec.ts b/src/app/new-page/page.component.spec.ts deleted file mode 100644 index ff567b22..00000000 --- a/src/app/new-page/page.component.spec.ts +++ /dev/null @@ -1,248 +0,0 @@ -import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; -import { HttpClientModule } from '@angular/common/http'; -import { RouterTestingModule } from '@angular/router/testing'; -import { Router } from '@angular/router'; -import { LoaderService } from '../services/loader-service/loader.service'; -import { PageNewComponent } from './page.component'; -import { CommonService } from '../services/common.service'; -import { PageService } from './service/page-service.service'; -import { mockTractPage, mockPageComponent } from '../_tests/mocks'; - -describe('PageComponent', () => { - let component: any; - let fixture: ComponentFixture; - let pageService: PageService; - let router: Router; - const bookid = 'fourlaws', - langid = 'en', - pageid = 0; - const tractPage = mockTractPage( - false, - '2', - 'headerText', - 'heroText', - 'callToActionText', - 'cardLabel', - 'modalTitle', - 1 - ); - const tractPageOne = mockTractPage( - false, - '2', - 'headerText', - 'heroText', - 'callToActionText', - 'cardLabel', - 'modalTitle', - 0 - ); - - beforeEach(waitForAsync(() => { - pageService = new PageService(); - TestBed.configureTestingModule({ - declarations: [PageNewComponent], - imports: [HttpClientModule, RouterTestingModule], - providers: [ - CommonService, - LoaderService, - { provide: PageService, useValue: pageService } - ] - }).compileComponents(); - })); - - beforeEach(() => { - fixture = TestBed.createComponent(PageNewComponent); - router = TestBed.get(Router); - component = fixture.componentInstance; - fixture.detectChanges(); - spyOn(router, 'navigate'); - - component._pageParams = { - langid, - bookid, - pageid - }; - component._pageBookSubPagesManifest = [0, 1, 2, 3, 4, 5, 6]; - component._pageBookIndex = mockPageComponent.pageBookIndex; - component._pageBookTranslations = mockPageComponent.pageBookTranslations; - component._allLanguages = [ - mockPageComponent.languageEnglish, - mockPageComponent.languageGerman - ]; - component._books = mockPageComponent.books; - }); - - it('Create component', () => { - expect(component).toBeTruthy(); - }); - - it('selectLanguage()', () => { - component.selectLanguage({ attributes: { code: 'de' } }); - expect(router.navigate).toHaveBeenCalledWith(['de', bookid, pageid]); - }); - - it('onToggleLanaguageSelect()', () => { - component.languagesVisible = false; - component.onToggleLanaguageSelect(); - expect(component.languagesVisible).toBeTrue(); - }); - - it('onToggleLanaguageSelect()', () => { - component.languagesVisible = false; - component.onToggleLanaguageSelect(); - expect(component.languagesVisible).toBeTrue(); - }); - - it('onPreviousPage() on page 0', () => { - component.onPreviousPage(); - expect(router.navigate).toHaveBeenCalledTimes(0); - }); - it('onPreviousPage() on page > 0', () => { - component._pageParams = { - langid, - bookid, - pageid: 5 - }; - component.onPreviousPage(); - expect(router.navigate).toHaveBeenCalledWith([langid, bookid, 4]); - }); - - it('onNextPage() on page 0', () => { - component.onNextPage(); - expect(router.navigate).toHaveBeenCalledWith([langid, bookid, 1]); - }); - it('onNextPage() on final page', () => { - component._pageParams = { - langid, - bookid, - pageid: 6 - }; - component.onNextPage(); - expect(router.navigate).toHaveBeenCalledTimes(0); - }); - - it('getImage()', async () => { - await component.getImage('file-name-2.png'); - expect(pageService.getAllImages()['file-name-2.png']).toEqual( - 'https://cru.org/assets/file-name-2.png' - ); - }); - - it('getImage() resource not downloaded', async () => { - spyOn(pageService, 'getAllImages'); - await component.getImage('file-name-3.png'); - expect(pageService.getAllImages).toHaveBeenCalledTimes(0); - }); - - it('loadBookPage() - wrong page', async () => { - component.loadBookPage(tractPage); - const showPageSpy = spyOn(component, 'showPage'); - expect(showPageSpy).toHaveBeenCalledTimes(0); - }); - - it('loadBookPage() - correct page', async () => { - const showPageSpy = spyOn(component, 'showPage'); - component.loadBookPage(tractPageOne); - expect(showPageSpy).toHaveBeenCalledTimes(1); - }); - - it('getAvailableLanguagesForSelectedBook() no languages downloaded', () => { - component._allLanguages = []; - expect(component.availableLanguages).toEqual([]); - component.getAvailableLanguagesForSelectedBook(); - expect(component.availableLanguages).toEqual([]); - }); - - it('getAvailableLanguagesForSelectedBook()', () => { - expect(component.availableLanguages).toEqual([]); - component.getAvailableLanguagesForSelectedBook(); - expect(component.availableLanguages.length).toEqual(1); - }); - - it('loadPageBook()', () => { - const loadPageBookIndexSpy = spyOn(component, 'loadPageBookIndex'); - component.loadPageBook(); - expect(component._pageBookLoaded).toBeTrue(); - expect(loadPageBookIndexSpy).toHaveBeenCalledTimes(1); - }); - - it('loadPageBook() - page does not exist', () => { - const loadPageBookIndexSpy = spyOn(component, 'loadPageBookIndex'); - component._pageParams.bookid = 'connectingwithgod'; - component.loadPageBook(); - expect(component._pageBookLoaded).toBeFalse(); - expect(loadPageBookIndexSpy).toHaveBeenCalledTimes(0); - }); - - it('setSelectedLanguage()', () => { - spyOn(pageService, 'setDir'); - component.setSelectedLanguage(); - expect(component._selectedLanguage).toEqual( - mockPageComponent.languageEnglish - ); - expect(component.selectedLang).toEqual( - mockPageComponent.languageEnglish.attributes.name - ); - expect(pageService.setDir).toHaveBeenCalledWith( - mockPageComponent.languageEnglish.attributes.direction - ); - }); - - it('checkIfPreSelectedLanguageExists() - True', () => { - component._selectedLanguage = mockPageComponent.languageEnglish; - const preSelected = component.checkIfPreSelectedLanguageExists(); - expect(preSelected).toEqual('4'); - }); - - it('checkIfPreSelectedLanguageExists() - False', () => { - const preSelected = component.checkIfPreSelectedLanguageExists(); - expect(preSelected).toBeFalse(); - }); - - it('clearData()', () => { - component._booksLoaded = true; - component._pageBookLoaded = true; - component._pageBookMainfestLoaded = true; - component._pageBookMainfest = { test: true }; - component._pageBookTranslationId = 10; - component.availableLanguages = [{ lang: 'en' }]; - component.selectedBookName = 'Four Laws'; - component.languagesVisible = true; - component.activePage = 3; - component.activePageOrder = 3; - component.totalPages = 5; - component.bookNotAvailableInLanguage = true; - component.bookNotAvailable = true; - component.clearData(); - expect(component._booksLoaded).toEqual(false); - expect(component._books).toEqual([]); - expect(component._pageBookLoaded).toEqual(false); - expect(component._pageBook).toEqual({}); - expect(component._pageBookIndex).toEqual({}); - expect(component._pageBookMainfestLoaded).toEqual(false); - expect(component._pageBookMainfest).toEqual({}); - expect(component._pageBookTranslations).toEqual([]); - expect(component._pageBookTranslationId).toEqual(0); - expect(component._pageBookSubPagesManifest).toEqual([]); - expect(component._pageBookSubPages).toEqual([]); - expect(component.availableLanguages).toEqual([]); - expect(component.selectedBookName).toEqual(''); - expect(component.languagesVisible).toEqual(false); - expect(component.activePage).toEqual(null); - expect(component.activePageOrder).toEqual(0); - expect(component.totalPages).toEqual(0); - expect(component.bookNotAvailableInLanguage).toEqual(false); - expect(component.bookNotAvailable).toEqual(false); - }); - - it('showPage()', () => { - const awaitPageNavigationSpy = spyOn(component, 'awaitPageNavigation'); - component.showPage(tractPage); - expect(component.activePageOrder).toBe(tractPage.position); - expect(component.activePage).toBe(tractPage); - expect(awaitPageNavigationSpy).toHaveBeenCalled(); - setTimeout(() => { - expect(component.pagesLoaded).toBe(true); - }, 0); - }); -}); diff --git a/src/app/new-page/page.component.ts b/src/app/new-page/page.component.ts deleted file mode 100644 index aa3b5e42..00000000 --- a/src/app/new-page/page.component.ts +++ /dev/null @@ -1,702 +0,0 @@ -import { - Component, - HostListener, - OnDestroy, - OnInit, - ViewEncapsulation -} from '@angular/core'; -import { ActivatedRoute, Router } from '@angular/router'; -import { Subject } from 'rxjs'; -import { delay, filter, takeUntil } from 'rxjs/operators'; -import { ViewportScroller } from '@angular/common'; -import * as ActionCable from '@rails/actioncable'; -import { CommonService } from '../services/common.service'; -import { LoaderService } from '../services/loader-service/loader.service'; -import { IPageParameters } from './model/page-parameters'; -import { APIURL } from '../api/url'; -import { environment } from './../../environments/environment'; -import { PageService } from './service/page-service.service'; -import { - PullParserFactory, - Page, - Manifest, - TractPage, - XmlParser, - XmlParserData, - Animation -} from '../services/xml-parser-service/xmp-parser.service'; - -interface LiveShareSubscriptionPayload { - data?: { - type: 'navigation-event'; - id: string; - attributes: { - card?: number; - locale: string; - page: number; - tool: string; - }; - }; -} - -@Component({ - selector: 'app-page-new', - templateUrl: './page.component.html', - styleUrls: ['./page.component.css'], - encapsulation: ViewEncapsulation.None -}) -export class PageNewComponent implements OnInit, OnDestroy { - private _unsubscribeAll = new Subject(); - private _pageChanged = new Subject(); - private _pageParams: IPageParameters; - private _allLanguagesLoaded: boolean; - private _allLanguages: any[]; - private _booksLoaded: boolean; - private _books: any[]; - private _pageBookLoaded: boolean; - private _pageBook: any; - private _pageBookIndex: any; - private _pageBookMainfest: Manifest; - private _pageBookMainfestLoaded: boolean; - private _pageBookTranslations: any[]; - private _pageBookTranslationId: number; - private _pageBookSubPagesManifest: Page[]; - private _pageBookSubPages: Page[]; - private _selectedLanguage: any; - private liveShareSubscription: ActionCable.Channel; - - pagesLoaded: boolean; - selectedLang: string; - availableLanguages: Array; - languagesVisible: boolean; - selectedBookName: string; - activePage: any; - activePageOrder: number; - totalPages: number; - bookNotAvailableInLanguage: boolean; - bookNotAvailable: boolean; - - constructor( - private loaderService: LoaderService, - public commonService: CommonService, - private pageService: PageService, - private route: ActivatedRoute, - public router: Router, - private viewportScroller: ViewportScroller, - private pullParserFactory: PullParserFactory - ) { - this._pageParams = { - langid: '', - bookid: '' - }; - this._books = []; - this.activePageOrder = 0; - } - - @HostListener('window:keyup', ['$event']) - keyEvent(event: KeyboardEvent) { - if (event.key === 'ArrowLeft') { - this.onPreviousPage(); - } else if (event.key === 'ArrowRight') { - this.onNextPage(); - } - } - - ngOnInit() { - this.awaitPageChanged(); - this.awaitPageParameters(); - this.awaitEmailFormSignupDataSubmitted(); - this.awaitLiveShareStream(); - } - - ngOnDestroy() { - this._unsubscribeAll.next(); - this._unsubscribeAll.complete(); - this._pageChanged.complete(); - if (this.liveShareSubscription) { - this.liveShareSubscription.unsubscribe(); - } - } - - selectLanguage(lang): void { - const tPageOrder = this._pageParams.pageid || 0; - this.router.navigate([ - lang.attributes.code, - this._pageParams.bookid, - tPageOrder - ]); - return; - } - - onToggleLanaguageSelect(): void { - this.languagesVisible = !this.languagesVisible; - } - - private onPreviousPage(): void { - if (this._pageParams.pageid > 0) { - this.router.navigate([ - this._pageParams.langid, - this._pageParams.bookid, - this._pageParams.pageid - 1 - ]); - } - } - - private onNextPage(): void { - if (this._pageParams.pageid + 1 < this._pageBookSubPagesManifest.length) { - this.router.navigate([ - this._pageParams.langid, - this._pageParams.bookid, - this._pageParams.pageid + 1 - ]); - } - } - - private getAnimation(resource): void { - if (resource === undefined || resource === '' || resource === null) { - return; - } - - if (this._pageBookIndex !== undefined && this._pageBookIndex !== null) { - const attachments = this._pageBookIndex.included.filter((row) => { - if ( - row.type.toLowerCase() === 'attachment' && - row.attributes['file-file-name'].toLowerCase() === - resource.toLowerCase() - ) { - return true; - } else { - return false; - } - }); - - if (attachments.length === 0) { - return; - } - - const filename = attachments[0].attributes.file; - this.pageService.addToAnimationsDict(resource, filename); - return filename; - } - } - - private getImage(resource): string { - if (resource === undefined || resource === '' || resource === null) { - return ''; - } - - if (this._pageBookIndex !== undefined && this._pageBookIndex !== null) { - const attachments = this._pageBookIndex.included.filter((row) => { - if ( - row.type.toLowerCase() === 'attachment' && - row.attributes['file-file-name'].toLowerCase() === - resource.toLowerCase() - ) { - return true; - } else { - return false; - } - }); - - if (attachments.length === 0) { - return ''; - } - - const filename = attachments[0].attributes.file; - - const link = document.createElement('link'); - link.href = filename; - link.rel = 'prefetch'; - document.getElementsByTagName('head')[0].appendChild(link); - - this.pageService.addToImagesDict(resource, filename); - return filename; - } - } - - private loadBookPage(page: TractPage): void { - const pageId = this._pageParams.pageid; - const showpage: boolean = pageId - ? page.position === pageId - : page.position === 0; - if (showpage) this.showPage(page); - } - - private loadBookManifestXML(): void { - this.pageService.clear(); - let item: any = {}; - this.pullParserFactory.clearOrigin(); - this._pageBookTranslations.forEach((translation) => { - if ( - translation && - translation.relationships && - translation.relationships.language && - translation.relationships.language.data && - translation.relationships.language.data.id && - translation.relationships.language.data.id === this._selectedLanguage.id - ) { - item = translation; - return; - } - }); - - if ( - item && - item.id && - item.attributes && - item.attributes && - item.attributes['manifest-name'] - ) { - const manifestName = item.attributes['manifest-name']; - const translationid = item.id; - const fileName = environment.production - ? APIURL.GET_XML_FILES_FOR_MANIFEST + translationid + '/' + manifestName - : APIURL.GET_XML_FILES_FOR_MANIFEST + manifestName; - this.pullParserFactory.setOrigin(fileName); - const config = XmlParser.ParserConfig.createParserConfig() - .withLegacyWebImageResources(true) - .withSupportedFeatures([ - XmlParser.ParserConfig.Companion.FEATURE_ANIMATION, - XmlParser.ParserConfig.Companion.FEATURE_MULTISELECT, - XmlParser.ParserConfig.Companion.FEATURE_FLOW, - XmlParser.ParserConfig.Companion.FEATURE_CONTENT_CARD - ]) - .withParseTips(false); - const newParser = new XmlParser.ManifestParser( - this.pullParserFactory, - config - ); - const controller = new AbortController(); - const signal = controller.signal; - try { - newParser.parseManifest(fileName, signal).then((data) => { - const { manifest } = data as XmlParserData; - this._pageBookMainfest = manifest; - - // Loop through and get all resources. - this._pageBookIndex.included.forEach((resource) => { - const { attributes, type } = resource; - if (type === 'attachment') { - this.pageService.addAttachment( - attributes['file-file-name'], - attributes.file - ); - if ( - /\.(gif|jpe?g|tiff?|png|webp|svg|bmp)$/i.test( - attributes['file-file-name'] - ) - ) { - this.getImage(attributes['file-file-name']); - } else { - this.getAnimation(attributes['file-file-name']); - } - } - }); - - if (manifest?.pages?.length) { - this._pageBookSubPagesManifest = manifest.pages; - this._pageBookSubPages = manifest.pages; - this.totalPages = manifest.pages.length; - this._pageBookMainfestLoaded = true; - manifest.pages.forEach((page) => { - this.loadBookPage(page as TractPage); - }); - } else { - this.pageService.setDir('ltr'); - this.bookNotAvailableInLanguage = true; - } - }); - } catch (e) { - console.error('Manifest Parse error', e); - } - } - } - - private getAvailableLanguagesForSelectedBook(): void { - this.availableLanguages = []; - if (this._allLanguages && this._allLanguages.length > 0) { - this._allLanguages.forEach((lang) => { - const translations = lang.relationships?.translations?.data || null; - - if (translations) { - let isLanguageForSelectedBook = false; - translations.forEach((translation) => { - this._pageBookTranslations.forEach((pageBookTranslation) => { - if (translation.id === pageBookTranslation.id) { - isLanguageForSelectedBook = true; - return; - } - }); - if (isLanguageForSelectedBook) { - return; - } - }); - - if (isLanguageForSelectedBook) { - this.availableLanguages.push(lang); - } - } - }); - } - - if (this.checkIfPreSelectedLanguageExists()) { - this.loadBookManifestXML(); - } else { - this.pageService.setDir('ltr'); - this.bookNotAvailableInLanguage = true; - this.loaderService.display(false); - } - } - - private loadPageBookIndex(): void { - this._pageBookTranslations = []; - this.commonService - .downloadFile(APIURL.GET_INDEX_FILE.replace('{0}', this._pageBook.id)) - .pipe(takeUntil(this._unsubscribeAll), takeUntil(this._pageChanged)) - .subscribe((data: any) => { - const enc = new TextDecoder('utf-8'); - const arr = new Uint8Array(data); - const result = enc.decode(arr); - const jsonResource = JSON.parse(result); - this._pageBookIndex = jsonResource; - - if ( - jsonResource && - jsonResource.data && - jsonResource.data.attributes && - jsonResource.data.attributes['resource-type'] && - jsonResource.data.attributes['resource-type'] === 'tract' - ) { - if (!jsonResource.data.attributes['manifest']) { - this.pageService.setDir('ltr'); - this.bookNotAvailable = true; - this.loaderService.display(false); - return; - } - - if ( - jsonResource.data.relationships && - jsonResource.data.relationships['latest-translations'] && - jsonResource.data.relationships['latest-translations'].data - ) { - const tPageBookRequiredTranslations = - jsonResource.data.relationships['latest-translations'].data; - if ( - tPageBookRequiredTranslations && - tPageBookRequiredTranslations.length > 0 && - jsonResource.included && - jsonResource.included.length > 0 - ) { - const tIncluded = jsonResource.included; - tPageBookRequiredTranslations.forEach( - (pageBookTranslationItem) => { - const translations = tIncluded.filter((row) => { - if ( - row.type === 'translation' && - row.id === pageBookTranslationItem.id - ) { - return true; - } else { - return false; - } - }); - if (translations && translations.length > 0) { - translations.forEach((item) => { - this._pageBookTranslations.push(item); - }); - } - } - ); - } - } - - this.selectedBookName = jsonResource.data.attributes['name']; - - this.getAvailableLanguagesForSelectedBook(); - } else { - this.pageService.setDir('ltr'); - this.bookNotAvailable = true; - this.loaderService.display(false); - } - }); - } - - private loadPageBook(): void { - this._pageBook = - this._books.find((book) => - book.attributes.abbreviation === this._pageParams.bookid ? book : false - ) || {}; - - if (!this._pageBook.id) { - this.pageService.setDir('ltr'); - this.bookNotAvailable = true; - this.loaderService.display(false); - } else { - this._pageBookLoaded = true; - this.loadPageBookIndex(); - } - } - - private getAllBooks(): void { - this.commonService - .getBooks(APIURL.GET_ALL_BOOKS) - .pipe(takeUntil(this._unsubscribeAll)) - .subscribe((data: any) => { - if (data && data.data) { - this._books = data.data; - this._booksLoaded = true; - this.loadPageBook(); - } else { - this.pageService.setDir('ltr'); - this.bookNotAvailable = true; - this.loaderService.display(false); - } - }); - } - - private getAllLanguages(): void { - this._allLanguages = []; - this.commonService - .getLanguages(APIURL.GET_ALL_LANGUAGES) - .pipe(takeUntil(this._unsubscribeAll)) - .subscribe((data: any) => { - if (data && data.data) { - this._allLanguages = data.data; - this._allLanguagesLoaded = true; - if (this._pageParams && this._pageParams.langid) { - this.setSelectedLanguage(); - } - this.getAllBooks(); - } else { - this.pageService.setDir('ltr'); - this.bookNotAvailable = true; - this.loaderService.display(false); - } - }); - } - - private setSelectedLanguage(): void { - this._allLanguages.forEach((lang) => { - const attributes = lang.attributes; - if (attributes?.code && attributes?.code === this._pageParams.langid) { - this._selectedLanguage = lang; - this.selectedLang = attributes.name; - this.pageService.setDir(attributes.direction); - } - }); - } - - private checkIfPreSelectedLanguageExists(): boolean { - if (this._selectedLanguage && this._selectedLanguage.id) { - const y = this._pageBookTranslations.find((x) => { - return ( - x?.relationships?.language?.data?.id && - x?.relationships?.language?.data?.id === this._selectedLanguage.id - ); - }); - return y && y.id; - } else { - return false; - } - } - - private awaitPageChanged(): void { - this._pageChanged - .pipe(takeUntil(this._unsubscribeAll), delay(0)) - .subscribe(() => { - if (!this._allLanguagesLoaded) { - this.loaderService.display(true); - this.getAllLanguages(); - } else if (!this._booksLoaded) { - this.loaderService.display(true); - this.getAllBooks(); - } else if (!this._pageBookLoaded) { - this.loaderService.display(true); - this.loadPageBook(); - } else { - if (this._pageBookMainfestLoaded) { - if (this._pageBookSubPages && this._pageBookSubPages.length) { - const index = this._pageBookSubPages.findIndex( - (sPage) => sPage.position === this._pageParams.pageid - ); - if (index >= 0) { - const tTract = this._pageBookSubPages[index] as TractPage; - this.showPage(tTract); - return; - } - } - - if ( - this._pageBookSubPagesManifest && - this._pageBookSubPagesManifest.length > this._pageParams.pageid - ) { - const tSubPageManifest = this._pageBookMainfest.pages[ - this._pageParams.pageid - ] as TractPage; - if (tSubPageManifest) { - this.pagesLoaded = false; - this.loaderService.display(true); - this.loadBookPage(tSubPageManifest); - return; - } - } - } - - this.loaderService.display(true); - this.clearData(); - this.getAllBooks(); - } - }); - } - - private awaitPageParameters(): void { - this.route.params - .pipe(takeUntil(this._unsubscribeAll)) - .subscribe((params) => { - const { langid, bookid } = this._pageParams; - const bookChanged = - langid !== params['langid'] || bookid !== params['bookid']; - - if (!bookChanged) { - this._pageParams.pageid = Number(params['page']); - } else { - this._pageParams.langid = params['langid']; - this._pageParams.bookid = params['bookid']; - this._pageParams.pageid = Number(params['page']); - this.clearData(); - if (this._allLanguagesLoaded) { - this.setSelectedLanguage(); - } - } - this._pageChanged.next(); - }); - } - - private awaitPageNavigation(): void { - this.pageService.nextPage$ - .pipe( - takeUntil(this._unsubscribeAll), - takeUntil(this._pageChanged), - delay(0) - ) - .subscribe(() => { - this.onNextPage(); - }); - - this.pageService.previousPage$ - .pipe( - takeUntil(this._unsubscribeAll), - takeUntil(this._pageChanged), - delay(0) - ) - .subscribe(() => { - this.onPreviousPage(); - }); - } - - private awaitEmailFormSignupDataSubmitted(): void { - this.pageService.emailSignupFormData$ - .pipe( - takeUntil(this._unsubscribeAll), - filter((tData) => tData) - ) - .subscribe((data) => { - if (data.name && data.email && data.destination_id) { - const subscriberData = { - data: { - type: 'follow_up', - attributes: { - name: data.name, - email: data.email, - language_id: Number(this._selectedLanguage.id), - destination_id: Number(data.destination_id) - } - } - }; - this.commonService - .createSubscriber(subscriberData) - .pipe(takeUntil(this._unsubscribeAll)) - .subscribe(); - } - }); - } - - private clearData(): void { - this._booksLoaded = false; - this._books = []; - this._pageBookLoaded = false; - this._pageBook = {}; - this._pageBookIndex = {}; - this._pageBookMainfestLoaded = false; - this._pageBookMainfest = {} as Manifest; - this._pageBookTranslations = []; - this._pageBookTranslationId = 0; - this._pageBookSubPagesManifest = []; - this._pageBookSubPages = []; - this.availableLanguages = []; - this.selectedBookName = ''; - this.languagesVisible = false; - this.activePage = null; - this.activePageOrder = 0; - this.totalPages = 0; - this.bookNotAvailableInLanguage = false; - this.bookNotAvailable = false; - } - - private showPage(page: TractPage): void { - this.activePageOrder = page.position; - this.activePage = page; - this.awaitPageNavigation(); - this.viewportScroller.scrollToPosition([0, 0]); - setTimeout(() => { - this.pagesLoaded = true; - this.loaderService.display(false); - }, 0); - } - - private awaitLiveShareStream(): void { - const liveShareStreamId = this.route.snapshot.queryParams.liveShareStream; - if (liveShareStreamId) { - this.liveShareSubscription = ActionCable.createConsumer( - environment.mobileContentApiWsUrl - ).subscriptions.create( - { - channel: 'SubscribeChannel', - channelId: liveShareStreamId - }, - { - received: async ({ data }: LiveShareSubscriptionPayload) => { - if (!data || data.type !== 'navigation-event') { - return; - } - - const Url = this.router - .createUrlTree( - [ - data.attributes.locale, - data.attributes.tool, - data.attributes.page - ], - { - queryParams: this.route.snapshot.queryParams, - - ...(data.attributes.card !== undefined - ? { fragment: `card-${data.attributes.card}` } - : {}) - } - ) - .toString(); - if (data.attributes.card) { - setTimeout(() => { - this.viewportScroller.scrollToAnchor( - `card-${data.attributes.card}` - ); - }, 100); - } - this.router.navigateByUrl(Url.toString()); - } - } - ); - } - } -} diff --git a/src/app/new-page/service/page-service.service.ts b/src/app/new-page/service/page-service.service.ts deleted file mode 100644 index 52f50396..00000000 --- a/src/app/new-page/service/page-service.service.ts +++ /dev/null @@ -1,174 +0,0 @@ -import { Injectable } from '@angular/core'; -import { BehaviorSubject, Observable, Subject } from 'rxjs'; -import { XmlParser } from '../../services/xml-parser-service/xmp-parser.service'; - -@Injectable({ - providedIn: 'root' -}) -export class PageService { - private _nextPage = new Subject(); - private _previousPage = new Subject(); - private _formAction = new Subject(); - private _contentEvent = new Subject(); - private _changeHeader = new Subject(); - private _getEmailSignupFormData = new Subject(); - private _emailSignupFormData = new Subject(); - private _dir = new BehaviorSubject('ltr'); - private _visibleTip = new BehaviorSubject(''); - private _isFirstPage = new BehaviorSubject(false); - private _isLastPage = new BehaviorSubject(false); - private _isForm = new BehaviorSubject(false); - private _isModal = new BehaviorSubject(false); - private _imageUrlsDict = new BehaviorSubject([]); - private _animationUrlsDict = new BehaviorSubject([]); - private _allAttachmentResources = new Map(); - private XmlParserState = XmlParser.State.createState(); - - formAction$: Observable = this._formAction.asObservable(); - contentEvent$: Observable = this._formAction.asObservable(); - changeHeader$: Observable = this._changeHeader.asObservable(); - getEmailSignupFormData$: Observable = - this._getEmailSignupFormData.asObservable(); - emailSignupFormData$: Observable = - this._emailSignupFormData.asObservable(); - nextPage$: Observable = this._nextPage.asObservable(); - previousPage$: Observable = this._previousPage.asObservable(); - pageDir$: Observable = this._dir.asObservable(); - isFirstPage$: Observable = this._isFirstPage.asObservable(); - isLastPage$: Observable = this._isLastPage.asObservable(); - isForm$: Observable = this._isForm.asObservable(); - isModal$: Observable = this._isModal.asObservable(); - visibleTipId$: Observable = this._visibleTip.asObservable(); - - clear(): void { - this._isFirstPage.next(false); - this._isLastPage.next(false); - this._isForm.next(false); - this._isModal.next(false); - this.clearImagesDict(); - this.clearAnimationsDict(); - } - - addAttachment(pImageName: string, pImageUrl: string): void { - const tImages = this._allAttachmentResources.get(pImageName); - if (!tImages) this._allAttachmentResources.set(pImageName, pImageUrl); - } - - findAttachment(pImageName: string): string { - const tImages = this._allAttachmentResources.get(pImageName); - return tImages || ''; - } - - nextPage(): void { - this._nextPage.next(); - } - - previousPage(): void { - this._previousPage.next(); - } - - formAction(action: string): void { - this._formAction.next(action); - } - - contentEvent(event: string): void { - this._contentEvent.next(event); - } - - changeHeader(newHeader: string): void { - this._changeHeader.next(newHeader); - } - - setPageOrder(currentPageOrder: number, numberOfPages: number): void { - this._isFirstPage.next(currentPageOrder === 0); - this._isLastPage.next(numberOfPages - 1 === currentPageOrder); - } - - setDir(pDir: string): void { - this._dir.next(pDir); - } - - formVisible(): void { - this._isForm.next(true); - } - - formHidden(): void { - this._isForm.next(false); - } - - modalVisible(): void { - this._isModal.next(true); - } - - modalHidden(): void { - this._isModal.next(false); - } - - emailSignumFormDataNeeded(): void { - this._getEmailSignupFormData.next(); - } - - setEmailSignupFormData(data: any): void { - this._emailSignupFormData.next(data); - } - - showTip(id: string): void { - this._visibleTip.next(id); - } - - hideTip(): void { - this._visibleTip.next(''); - } - - clearImagesDict(): void { - this._imageUrlsDict.next([]); - } - - addToImagesDict(pImageName: string, pImageUrl: string): void { - const tImages = this._imageUrlsDict.getValue(); - tImages[pImageName.toLocaleLowerCase()] = pImageUrl; - this._imageUrlsDict.next(tImages); - } - - getImageUrl(pImageName: string): string { - const tImages = this._imageUrlsDict.getValue(); - if (tImages && tImages[pImageName.toLocaleLowerCase()]) { - return tImages[pImageName.toLocaleLowerCase()]; - } - return pImageName; - } - getAllImages() { - return this._imageUrlsDict.getValue(); - } - - clearAnimationsDict(): void { - this._animationUrlsDict.next([]); - } - - addToAnimationsDict(pFileName: string, pFileUrl: string): void { - const tFiles = this._animationUrlsDict.getValue(); - tFiles[pFileName.toLocaleLowerCase()] = pFileUrl; - this._animationUrlsDict.next(tFiles); - } - - getAnimationUrl(pFileName: string): string { - const tFiles = this._animationUrlsDict.getValue(); - if (tFiles && tFiles[pFileName.toLocaleLowerCase()]) { - return tFiles[pFileName.toLocaleLowerCase()]; - } - return pFileName; - } - - isRestricted(deviceTypes: string[]): boolean { - if (deviceTypes && deviceTypes.length) { - if (deviceTypes.findIndex((t) => t === 'web') < 0) { - return true; - } - } - return false; - } - - parserState(): any { - return this.XmlParserState; - } -} diff --git a/src/app/new-page/component/calltoaction/calltoaction.component.spec.ts b/src/app/page/component/calltoaction/calltoaction.component.spec.ts similarity index 82% rename from src/app/new-page/component/calltoaction/calltoaction.component.spec.ts rename to src/app/page/component/calltoaction/calltoaction.component.spec.ts index 5d78e27e..dfea5c5e 100644 --- a/src/app/new-page/component/calltoaction/calltoaction.component.spec.ts +++ b/src/app/page/component/calltoaction/calltoaction.component.spec.ts @@ -1,12 +1,12 @@ import { SimpleChange } from '@angular/core'; import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; import { PageService } from '../../service/page-service.service'; -import { CalltoactionNewComponent } from './calltoaction.component'; +import { CalltoactionComponent } from './calltoaction.component'; import { mockCallToAction } from '../../../_tests/mocks'; describe('CallToActionComponent', () => { - let component: CalltoactionNewComponent; - let fixture: ComponentFixture; + let component: CalltoactionComponent; + let fixture: ComponentFixture; const mockCallToActionWithText = mockCallToAction( 'The following explains how you can receive Christ ...' ); @@ -14,10 +14,10 @@ describe('CallToActionComponent', () => { beforeEach(waitForAsync(() => { TestBed.configureTestingModule({ - declarations: [CalltoactionNewComponent], + declarations: [CalltoactionComponent], providers: [PageService] }).compileComponents(); - fixture = TestBed.createComponent(CalltoactionNewComponent); + fixture = TestBed.createComponent(CalltoactionComponent); component = fixture.componentInstance; fixture.detectChanges(); })); diff --git a/src/app/page/component/calltoaction/calltoaction.component.ts b/src/app/page/component/calltoaction/calltoaction.component.ts index f27dd521..19c7840b 100644 --- a/src/app/page/component/calltoaction/calltoaction.component.ts +++ b/src/app/page/component/calltoaction/calltoaction.component.ts @@ -6,19 +6,21 @@ import { SimpleChanges } from '@angular/core'; import { Observable } from 'rxjs'; -import { KgwContentComplexTypeText } from '../../model/xmlns/content/content-ct-text'; -import { KgwTractComplexTypeCallToAction } from '../../model/xmlns/tract/tract-ct-call-to-action'; import { PageService } from '../../service/page-service.service'; +import { + CallToAction, + Text +} from 'src/app/services/xml-parser-service/xmp-parser.service'; @Component({ - selector: 'app-page-calltoaction', + selector: 'app-page-new-calltoaction', templateUrl: './calltoaction.component.html', styleUrls: ['./calltoaction.component.css'] }) export class CalltoactionComponent implements OnChanges { - @Input() item: KgwTractComplexTypeCallToAction; + @Input() item: CallToAction; - text: KgwContentComplexTypeText; + text: Text; ready: boolean; actionText: string; dir$: Observable; @@ -47,10 +49,12 @@ export class CalltoactionComponent implements OnChanges { } private init(): void { - if (this.item.text) { - this.text = this.item.text; - if (this.text && this.text.value) { - this.actionText = this.text.value.trim().replace(//gi, ' '); + if (this.item.label) { + this.text = this.item.label; + if (this.text && this.item.label.text) { + this.actionText = this.item.label.text + .trim() + .replace(//gi, ' '); } } this.ready = true; diff --git a/src/app/page/component/card/card.component.html b/src/app/page/component/card/card.component.html index fe736ed4..594678cb 100644 --- a/src/app/page/component/card/card.component.html +++ b/src/app/page/component/card/card.component.html @@ -1,77 +1,18 @@

- - - - - - - - - - - - - - - - - +
diff --git a/src/app/new-page/component/card/card.component.spec.ts b/src/app/page/component/card/card.component.spec.ts similarity index 81% rename from src/app/new-page/component/card/card.component.spec.ts rename to src/app/page/component/card/card.component.spec.ts index fbc08c89..27ad0e3c 100644 --- a/src/app/new-page/component/card/card.component.spec.ts +++ b/src/app/page/component/card/card.component.spec.ts @@ -2,21 +2,21 @@ import { SimpleChange } from '@angular/core'; import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; import { PageService } from '../../service/page-service.service'; import { mockTractCard } from '../../../_tests/mocks'; -import { CardNewComponent } from './card.component'; +import { CardComponent } from './card.component'; describe('ContentCardComponent', () => { - let component: CardNewComponent; - let fixture: ComponentFixture; + let component: CardComponent; + let fixture: ComponentFixture; let pageService: PageService; const card = mockTractCard('test label', 0, 'test-label-listener', false); beforeEach(waitForAsync(() => { pageService = new PageService(); TestBed.configureTestingModule({ - declarations: [CardNewComponent], + declarations: [CardComponent], providers: [{ provide: PageService, useValue: pageService }] }).compileComponents(); - fixture = TestBed.createComponent(CardNewComponent); + fixture = TestBed.createComponent(CardComponent); component = fixture.componentInstance; fixture.detectChanges(); spyOn(pageService, 'formAction'); diff --git a/src/app/page/component/card/card.component.ts b/src/app/page/component/card/card.component.ts index 6ddc8cd3..31c9e6ca 100644 --- a/src/app/page/component/card/card.component.ts +++ b/src/app/page/component/card/card.component.ts @@ -6,26 +6,26 @@ import { SimpleChanges } from '@angular/core'; import { Observable } from 'rxjs'; -import { KgwContentComplexTypeForm } from '../../model/xmlns/content/content-ct-form'; -import { KgwContentComplexTypeParagraph } from '../../model/xmlns/content/content-ct-paragraph'; -import { KgwContentComplexTypeTextchild } from '../../model/xmlns/content/content-ct-text-child'; -import { KgwContentElementItem } from '../../model/xmlns/content/content-element'; -import { KgwTractComplexTypeCard } from '../../model/xmlns/tract/tract-ct-card'; import { PageService } from '../../service/page-service.service'; - +import { org } from '@cruglobal/godtools-shared'; +import { + TractPageCard, + Text, + Content +} from 'src/app/services/xml-parser-service/xmp-parser.service'; @Component({ - selector: 'app-page-card', + selector: 'app-page-new-card', templateUrl: './card.component.html', styleUrls: ['./card.component.css'] }) export class CardComponent implements OnChanges { - @Input() card: KgwTractComplexTypeCard; - @Input() cardIndex: number; + @Input() card: TractPageCard; ready: boolean; - label: KgwContentComplexTypeTextchild; + label: Text; labelText: string; - content: Array; + cardPosition: number; + content: Array; dir$: Observable; isForm$: Observable; isModal$: Observable; @@ -50,6 +50,7 @@ export class CardComponent implements OnChanges { this.ready = false; this.label = null; this.labelText = ''; + this.cardPosition = 0; this.content = []; this.init(); } @@ -64,38 +65,14 @@ export class CardComponent implements OnChanges { } private init(): void { + this.cardPosition = this.card.position || 0; if (this.card.label) { this.label = this.card.label; - this.labelText = - this.label.text && this.label.text.value - ? this.label.text.value.trim() - : ''; - } - if (this.card.content && this.card.content.length) { - this.card.content.forEach((contentChild) => { - if (contentChild.contentType === 'paragraph') { - const tParagraph: KgwContentComplexTypeParagraph = - contentChild as KgwContentComplexTypeParagraph; - if ( - !this.pageService.isRestricted(tParagraph.attributes.restrictTo) - ) { - const tItemToAdd: KgwContentElementItem = { - type: 'paragraph', - element: tParagraph - }; - this.content.push(tItemToAdd); - } - } else if (contentChild.contentType === 'form') { - const tForm: KgwContentComplexTypeForm = - contentChild as KgwContentComplexTypeForm; - const tItemToAdd: KgwContentElementItem = { - type: 'form', - element: tForm - }; - this.content.push(tItemToAdd); - } - }); + this.labelText = this.card.label.text?.trim() || ''; } + + this.content = this.card.content; + this.ready = true; } } diff --git a/src/app/page/component/content-accordion/content-accordion.component.css b/src/app/page/component/content-accordion/content-accordion.component.css index e69de29b..6073eef1 100644 --- a/src/app/page/component/content-accordion/content-accordion.component.css +++ b/src/app/page/component/content-accordion/content-accordion.component.css @@ -0,0 +1,65 @@ +/* Style the buttons that are used to open and close the accordion panel */ +.accordion-header { + background-color: #eee; + color: #444; + cursor: pointer; + padding: 15px; + width: 100%; + text-align: left; + font-size: 16px; + border: none; + outline: none; + transition: 0.4s; + color: var(--kg-white); + background-color: var(--kg-blue); + transition: all 0.3s ease 0s; + position: relative; +} + +.accordion-header:hover { + background-color: var(--kg-blue-light); +} + +.accordion-header i { + position: absolute; + right: 20px; + transform: translateY(-50%); + transition: all 0.3s ease 0s; + top: 50%; +} + +.accordion-header i.fa-plus { + opacity: 1; +} +.accordion-header i.fa-minus { + opacity: 0; +} + +.accordian.mw568.active .accordion-header i.fa-plus { + opacity: 0; +} +.accordian.mw568.active .accordion-header i.fa-minus { + opacity: 1; +} + +/* Style the accordion panel. Note: hidden by default */ +.accordion-content { + padding: 0 18px; + background-color: white; + max-height: 0px; + overflow: hidden; + transition: all 0.5s ease 0s; + border: 1px solid var(--kg-white); + background-color: var(--kg-white); + padding: 0px 24px; +} + +.accordian.active .accordion-content { + border: 1px solid var(--kg-blue); + padding: 0px 24px 24px; + max-height: 400px; +} + +.accordion-content app-content-new-repeater { + margin-top: 0; +} \ No newline at end of file diff --git a/src/app/page/component/content-accordion/content-accordion.component.html b/src/app/page/component/content-accordion/content-accordion.component.html index 12405dfc..861378ff 100644 --- a/src/app/page/component/content-accordion/content-accordion.component.html +++ b/src/app/page/component/content-accordion/content-accordion.component.html @@ -1 +1,16 @@ - + + +
+ +
+ +
+
+ + diff --git a/src/app/page/component/content-accordion/content-accordion.component.ts b/src/app/page/component/content-accordion/content-accordion.component.ts index 4aaa0564..7a8eab97 100644 --- a/src/app/page/component/content-accordion/content-accordion.component.ts +++ b/src/app/page/component/content-accordion/content-accordion.component.ts @@ -6,21 +6,22 @@ import { SimpleChanges } from '@angular/core'; import { Observable } from 'rxjs'; -import { KgwContentComplexTypeAccordion } from '../../model/xmlns/content/content-ct-accordion'; -import { KgwContentComplexTypeAccordionSection } from '../../model/xmlns/content/content-ct-accordion-section'; -import { KgwContentElementItem } from '../../model/xmlns/content/content-element'; import { PageService } from '../../service/page-service.service'; +import { + Accordion, + Content +} from 'src/app/services/xml-parser-service/xmp-parser.service'; @Component({ - selector: 'app-content-accordion', + selector: 'app-content-new-accordion', templateUrl: './content-accordion.component.html', styleUrls: ['./content-accordion.component.css'] }) export class ContentAccordionComponent implements OnChanges { - @Input() item: KgwContentElementItem; + @Input() item: Accordion; - accordion: KgwContentComplexTypeAccordion; - sections: Array; + accordion: Accordion; + sections: any[]; ready: boolean; dir$: Observable; @@ -38,8 +39,7 @@ export class ContentAccordionComponent implements OnChanges { changes['item'].currentValue !== changes['item'].previousValue ) { this.ready = false; - this.accordion = this.item - .element as KgwContentComplexTypeAccordion; + this.accordion = this.item; this.sections = []; this.init(); } @@ -49,15 +49,29 @@ export class ContentAccordionComponent implements OnChanges { } } + onClick(event: any) { + const parent = event.target.classList.contains('far') + ? event.target.parentElement.parentElement + : event.target.parentElement; + const hasActiveClass = parent.classList.contains('active'); + if (hasActiveClass) { + parent.classList.remove('active'); + } else { + parent.classList.add('active'); + } + } + private init(): void { - if (this.accordion.sections && this.accordion.sections.length) { - this.accordion.sections.forEach((section) => { - section.children = this.pageService.checkContentElements( - section.children + this.item.sections.forEach((section) => { + const contents: Content[] = []; + if (section.content) { + section.content.forEach((content) => + content ? contents.push(content) : null ); - this.sections.push(section); - }); - } + } + this.sections.push({ section, contents }); + }); + this.ready = true; } } diff --git a/src/app/page/component/content-animation/content-animation.component.html b/src/app/page/component/content-animation/content-animation.component.html index 38df3410..ee5694ed 100644 --- a/src/app/page/component/content-animation/content-animation.component.html +++ b/src/app/page/component/content-animation/content-animation.component.html @@ -1,11 +1,9 @@
- - + [options]="lottieOptions" + (animationCreated)="onAnimationCreated($event)" + >
diff --git a/src/app/new-page/component/content-animation/content-animation.component.spec.ts b/src/app/page/component/content-animation/content-animation.component.spec.ts similarity index 85% rename from src/app/new-page/component/content-animation/content-animation.component.spec.ts rename to src/app/page/component/content-animation/content-animation.component.spec.ts index b8921217..082cdae4 100644 --- a/src/app/new-page/component/content-animation/content-animation.component.spec.ts +++ b/src/app/page/component/content-animation/content-animation.component.spec.ts @@ -2,11 +2,11 @@ import { SimpleChange } from '@angular/core'; import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; import { PageService } from '../../service/page-service.service'; import { mockAnimation } from '../../../_tests/mocks'; -import { ContentAnimationNewComponent } from './content-animation.component'; +import { ContentAnimationComponent } from './content-animation.component'; describe('ContentAnimationComponent', () => { - let component: ContentAnimationNewComponent; - let fixture: ComponentFixture; + let component: ContentAnimationComponent; + let fixture: ComponentFixture; const fileName = 'the_four_animation.json'; const filePath = `/some-folder/${fileName}`; const animation = mockAnimation(fileName, filePath, 'event'); @@ -22,10 +22,10 @@ describe('ContentAnimationComponent', () => { beforeEach(waitForAsync(() => { pageService = new PageService(); TestBed.configureTestingModule({ - declarations: [ContentAnimationNewComponent], + declarations: [ContentAnimationComponent], providers: [{ provide: PageService, useValue: pageService }] }).compileComponents(); - fixture = TestBed.createComponent(ContentAnimationNewComponent); + fixture = TestBed.createComponent(ContentAnimationComponent); component = fixture.componentInstance; fixture.detectChanges(); pageService.addToAnimationsDict(fileName, filePath); diff --git a/src/app/page/component/content-animation/content-animation.component.ts b/src/app/page/component/content-animation/content-animation.component.ts index d1bf75e8..9569ee5f 100644 --- a/src/app/page/component/content-animation/content-animation.component.ts +++ b/src/app/page/component/content-animation/content-animation.component.ts @@ -3,32 +3,32 @@ import { Input, OnChanges, OnDestroy, - OnInit, SimpleChanges } from '@angular/core'; import { Observable, Subject } from 'rxjs'; import { takeUntil } from 'rxjs/operators'; -import { KgwContentComplexTypeAnimation } from '../../model/xmlns/content/content-ct-animation'; -import { KgwContentElementItem } from '../../model/xmlns/content/content-element'; import { PageService } from '../../service/page-service.service'; +import { Animation } from 'src/app/services/xml-parser-service/xmp-parser.service'; +import { AnimationOptions } from 'ngx-lottie'; +import { AnimationItem } from 'lottie-web'; @Component({ - selector: 'app-content-animation', + selector: 'app-content-new-animation', templateUrl: './content-animation.component.html', styleUrls: ['./content-animation.component.css'] }) export class ContentAnimationComponent implements OnChanges, OnDestroy { // eslint-disable-next-line @angular-eslint/no-input-rename - @Input() item: KgwContentElementItem; + @Input() item: Animation; private _unsubscribeAll = new Subject(); - animation: KgwContentComplexTypeAnimation; + animation: Animation; ready: boolean; anmResource: string; - anmOptions: any; - anmViewItem: any; + anmViewItem: AnimationItem; hasEvents: boolean; dir$: Observable; + lottieOptions: AnimationOptions; constructor(private pageService: PageService) { this.dir$ = this.pageService.pageDir$; @@ -49,8 +49,7 @@ export class ContentAnimationComponent implements OnChanges, OnDestroy { changes['item'].currentValue !== changes['item'].previousValue ) { this.ready = false; - this.animation = this.item - .element as KgwContentComplexTypeAnimation; + this.animation = this.item; this.init(); } } @@ -60,38 +59,49 @@ export class ContentAnimationComponent implements OnChanges, OnDestroy { } onAnimationClick(): void { - if (this.animation.attributes.events) { - this.pageService.formAction(this.animation.attributes.events); + if (this.animation.events) { + let action = ''; + this.animation.events.forEach((event, idx) => { + const value = event?.namespace + ? `${event.namespace}:${event.name}` + : event.name; + action += idx ? ` ${value}` : value; + }); + this.pageService.formAction(action); } } onAnimationCreated(anim: any) { - this.anmViewItem = anim; + this.anmViewItem = anim as AnimationItem; } private init(): void { - this.anmResource = this.pageService.getAnimationUrl( - this.animation.attributes.resource - ? this.animation.attributes.resource.trim() - : '' - ); + // TODO + // Need to update to e31_1 when we release a new Shared Parser. + const resource = { + name: (this.animation as any).e31_1 || '' + }; + this.anmResource = this.pageService.getAnimationUrl(resource.name || ''); + if ( + this.anmResource === resource.name && + !this.anmResource.includes('http') + ) { + this.anmResource = this.pageService.findAttachment(resource.name) || ''; + } + if (this.anmResource) { - this.anmOptions = { + this.lottieOptions = { path: this.anmResource, - loop: !!this.animation.attributes.loop, - autoplay: !!this.animation.attributes.autoplay + loop: !!this.animation.loop, + autoplay: !!this.animation.autoPlay }; } - this.hasEvents = !!this.animation.attributes.events; + this.hasEvents = !!this.animation.events; - if ( - !!this.animation.attributes.playListeners || - !!this.animation.attributes.stopListeners - ) { + if (!!this.animation.playListeners || !!this.animation.stopListeners) { this.awaitAnimEvent(); } - this.ready = true; } @@ -99,36 +109,18 @@ export class ContentAnimationComponent implements OnChanges, OnDestroy { this.pageService.contentEvent$ .pipe(takeUntil(this._unsubscribeAll)) .subscribe((event) => { - if (this.animation.attributes.playListeners) { - const tEvents = this.animation.attributes.playListeners.split(' '); - if (tEvents.find((playEvent) => playEvent === event)) { - // Start animation - if (this.anmViewItem) { - if ( - this.animation.attributes.events && - this.animation.attributes.events === event - ) { - this.anmViewItem.togglePause(); - } else { - this.anmViewItem.play(); - } - } - } - } else if (this.animation.attributes.stopListeners) { - const tEvents = this.animation.attributes.stopListeners.split(' '); - if (tEvents.find((playEvent) => playEvent === event)) { - // Stop animation - if (this.anmViewItem) { - if ( - this.animation.attributes.events && - this.animation.attributes.events === event - ) { - this.anmViewItem.togglePause(); - } else { - this.anmViewItem.pause(); - } - } - } + if (!this.anmViewItem) return; + const playListeners = this.animation.playListeners.filter( + (listener) => listener.name === event + ).length; + const stopListeners = this.animation.stopListeners.filter( + (listener) => listener.name === event + ).length; + + if (playListeners) { + this.anmViewItem.play(); + } else if (stopListeners) { + this.anmViewItem.pause(); } }); } diff --git a/src/app/page/component/content-button/content-button.component.html b/src/app/page/component/content-button/content-button.component.html index e960f431..742987ad 100644 --- a/src/app/page/component/content-button/content-button.component.html +++ b/src/app/page/component/content-button/content-button.component.html @@ -1,10 +1,19 @@
- {{ - buttonText - }} - {{ - buttonText - }} + {{ buttonText }} + {{ buttonText }}
diff --git a/src/app/page/component/content-button/content-button.component.ts b/src/app/page/component/content-button/content-button.component.ts index 0fd4a672..d5a49fc3 100644 --- a/src/app/page/component/content-button/content-button.component.ts +++ b/src/app/page/component/content-button/content-button.component.ts @@ -6,27 +6,31 @@ import { SimpleChanges } from '@angular/core'; import { Observable } from 'rxjs'; -import { KgwContentComplexTypeButton } from '../../model/xmlns/content/content-ct-button'; -import { KgwContentComplexTypeText } from '../../model/xmlns/content/content-ct-text'; -import { KgwContentElementItem } from '../../model/xmlns/content/content-element'; import { PageService } from '../../service/page-service.service'; +import { + Button, + EventId +} from 'src/app/services/xml-parser-service/xmp-parser.service'; +import { formatEvents } from 'src/app/shared/formatEvents'; @Component({ - selector: 'app-content-button', + selector: 'app-content-new-button', templateUrl: './content-button.component.html', styleUrls: ['./content-button.component.css'] }) export class ContentButtonComponent implements OnChanges { // eslint-disable-next-line @angular-eslint/no-input-rename - @Input() item: KgwContentElementItem; + @Input() item: Button; - button: KgwContentComplexTypeButton; - text: KgwContentComplexTypeText; + button: Button; + text: any; ready: boolean; buttonText: string; type: string; - events: string; + events: EventId[]; url: string; + buttonTextColor: string; + buttonBgColor: string; dir$: Observable; constructor(private pageService: PageService) { @@ -45,10 +49,12 @@ export class ContentButtonComponent implements OnChanges { this.ready = false; this.buttonText = ''; this.type = ''; - this.events = ''; + this.events = [] as EventId[]; this.url = ''; this.text = null; - this.button = this.item.element as KgwContentComplexTypeButton; + this.button = this.item; + this.buttonTextColor = ''; + this.buttonBgColor = ''; this.init(); } } @@ -59,33 +65,29 @@ export class ContentButtonComponent implements OnChanges { formAction(): void { if (this.events && this.type === 'event') { - this.pageService.formAction(this.events); + this.pageService.formAction(formatEvents(this.events)); } } private init(): void { + // TODO Allow Button styles when Books are ready + // this.buttonTextColor = this.button.buttonColor || '' + // this.buttonBgColor = this.button.backgroundColor || '' if (this.button.text) { this.text = this.button.text; - if (this.text && this.text.value) { - this.buttonText = this.text.value.trim(); - } - } - this.type = this.button.attributes.type; - if (this.type === 'url') { - this.url = this.toAbsoluteUrl(this.button.attributes.url); - } else if (this.type === 'event') { - this.events = this.button.attributes.events; + this.buttonText = this.text?.text || ''; } - this.ready = true; - } + const isUrlType = !!this.button.url; + const isEventType = !!this.button.events?.length; - private toAbsoluteUrl(url: string): string { - if (!url || url.trim().length === 0) { - return ''; + if (isUrlType) { + this.type = 'url'; + this.url = this.button.url; } - if (!url.startsWith('http://') && !url.startsWith('https://')) { - url = `http://${url}`; + if (isEventType) { + this.type = 'event'; + this.events = this.button.events; } - return url; + this.ready = true; } } diff --git a/src/app/new-page/component/content-button/content-button.compontent.spec.ts b/src/app/page/component/content-button/content-button.compontent.spec.ts similarity index 85% rename from src/app/new-page/component/content-button/content-button.compontent.spec.ts rename to src/app/page/component/content-button/content-button.compontent.spec.ts index 5f4a49a0..1ab944a4 100644 --- a/src/app/new-page/component/content-button/content-button.compontent.spec.ts +++ b/src/app/page/component/content-button/content-button.compontent.spec.ts @@ -1,12 +1,12 @@ import { SimpleChange } from '@angular/core'; import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; import { PageService } from '../../service/page-service.service'; -import { ContentButtonNewComponent } from './content-button.component'; +import { ContentButtonComponent } from './content-button.component'; import { mockButton } from '../../../_tests/mocks'; describe('ContentButtonComponent', () => { - let component: ContentButtonNewComponent; - let fixture: ComponentFixture; + let component: ContentButtonComponent; + let fixture: ComponentFixture; const buttonText = 'Button Text'; const buttonUrl = 'www.some-url-path.com'; const buttonEvent = 'open-test-modal'; @@ -15,10 +15,10 @@ describe('ContentButtonComponent', () => { beforeEach(waitForAsync(() => { TestBed.configureTestingModule({ - declarations: [ContentButtonNewComponent], + declarations: [ContentButtonComponent], providers: [PageService] }).compileComponents(); - fixture = TestBed.createComponent(ContentButtonNewComponent); + fixture = TestBed.createComponent(ContentButtonComponent); component = fixture.componentInstance; fixture.detectChanges(); })); diff --git a/src/app/new-page/component/content-card/content-card.component.css b/src/app/page/component/content-card/content-card.component.css similarity index 100% rename from src/app/new-page/component/content-card/content-card.component.css rename to src/app/page/component/content-card/content-card.component.css diff --git a/src/app/new-page/component/content-card/content-card.component.html b/src/app/page/component/content-card/content-card.component.html similarity index 100% rename from src/app/new-page/component/content-card/content-card.component.html rename to src/app/page/component/content-card/content-card.component.html diff --git a/src/app/new-page/component/content-card/content-card.component.spec.ts b/src/app/page/component/content-card/content-card.component.spec.ts similarity index 82% rename from src/app/new-page/component/content-card/content-card.component.spec.ts rename to src/app/page/component/content-card/content-card.component.spec.ts index b8d3a003..a73c31e6 100644 --- a/src/app/new-page/component/content-card/content-card.component.spec.ts +++ b/src/app/page/component/content-card/content-card.component.spec.ts @@ -1,21 +1,21 @@ import { SimpleChange } from '@angular/core'; import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; import { mockCard } from '../../../_tests/mocks'; -import { ContentCardNewComponent } from './content-card.component'; +import { ContentCardComponent } from './content-card.component'; import { PageService } from '../../service/page-service.service'; -describe('ContentCardNewComponent', () => { - let component: ContentCardNewComponent; - let fixture: ComponentFixture; +describe('ContentCardComponent', () => { + let component: ContentCardComponent; + let fixture: ComponentFixture; const card = mockCard(false); const cardClickable = mockCard(true); beforeEach(waitForAsync(() => { TestBed.configureTestingModule({ - declarations: [ContentCardNewComponent], + declarations: [ContentCardComponent], providers: [PageService] }).compileComponents(); - fixture = TestBed.createComponent(ContentCardNewComponent); + fixture = TestBed.createComponent(ContentCardComponent); component = fixture.componentInstance; fixture.detectChanges(); })); diff --git a/src/app/new-page/component/content-card/content-card.component.ts b/src/app/page/component/content-card/content-card.component.ts similarity index 96% rename from src/app/new-page/component/content-card/content-card.component.ts rename to src/app/page/component/content-card/content-card.component.ts index ff3e2991..7847a63b 100644 --- a/src/app/new-page/component/content-card/content-card.component.ts +++ b/src/app/page/component/content-card/content-card.component.ts @@ -12,7 +12,7 @@ import { formatEvents } from 'src/app/shared/formatEvents'; templateUrl: './content-card.component.html', styleUrls: ['./content-card.component.css'] }) -export class ContentCardNewComponent implements OnChanges { +export class ContentCardComponent implements OnChanges { // eslint-disable-next-line @angular-eslint/no-input-rename @Input() item: Card; card: Card; diff --git a/src/app/page/component/content-fallback/content-fallback.component.css b/src/app/page/component/content-fallback/content-fallback.component.css deleted file mode 100644 index 42a3ab45..00000000 --- a/src/app/page/component/content-fallback/content-fallback.component.css +++ /dev/null @@ -1,4 +0,0 @@ -:host { - width: 100%; - display: block; -} \ No newline at end of file diff --git a/src/app/page/component/content-fallback/content-fallback.component.html b/src/app/page/component/content-fallback/content-fallback.component.html deleted file mode 100644 index ea1ba087..00000000 --- a/src/app/page/component/content-fallback/content-fallback.component.html +++ /dev/null @@ -1,58 +0,0 @@ - - - - - - - - - - - - - - - - diff --git a/src/app/page/component/content-fallback/content-fallback.component.ts b/src/app/page/component/content-fallback/content-fallback.component.ts deleted file mode 100644 index 68687d52..00000000 --- a/src/app/page/component/content-fallback/content-fallback.component.ts +++ /dev/null @@ -1,60 +0,0 @@ -import { - Component, - Input, - OnChanges, - OnInit, - SimpleChanges -} from '@angular/core'; -import { Observable } from 'rxjs'; -import { KgwContentComplexTypeFallback } from '../../model/xmlns/content/content-ct-fallback'; -import { KgwContentElementItem } from '../../model/xmlns/content/content-element'; -import { PageService } from '../../service/page-service.service'; - -@Component({ - selector: 'app-content-fallback', - templateUrl: './content-fallback.component.html', - styleUrls: ['./content-fallback.component.css'] -}) -export class ContentFallbackComponent implements OnChanges { - // eslint-disable-next-line @angular-eslint/no-input-rename - @Input() item: KgwContentElementItem; - - fallback: KgwContentComplexTypeFallback; - content: KgwContentElementItem; - ready: boolean; - dir$: Observable; - - constructor(private pageService: PageService) { - this.dir$ = this.pageService.pageDir$; - } - - ngOnChanges(changes: SimpleChanges) { - for (const propName in changes) { - if (changes.hasOwnProperty(propName)) { - switch (propName) { - case 'item': { - if ( - !changes['item'].previousValue || - changes['item'].currentValue !== changes['item'].previousValue - ) { - this.ready = false; - this.content = null; - this.fallback = this.item - .element as KgwContentComplexTypeFallback; - this.init(); - } - } - } - } - } - } - - private init(): void { - if (this.fallback.children && this.fallback.children.length > 0) { - this.content = this.pageService.getFirstSupportedContentElement( - this.fallback.children - ); - } - this.ready = true; - } -} diff --git a/src/app/new-page/component/content-flow-item/content-flow-item.component.css b/src/app/page/component/content-flow-item/content-flow-item.component.css similarity index 100% rename from src/app/new-page/component/content-flow-item/content-flow-item.component.css rename to src/app/page/component/content-flow-item/content-flow-item.component.css diff --git a/src/app/new-page/component/content-flow-item/content-flow-item.component.html b/src/app/page/component/content-flow-item/content-flow-item.component.html similarity index 100% rename from src/app/new-page/component/content-flow-item/content-flow-item.component.html rename to src/app/page/component/content-flow-item/content-flow-item.component.html diff --git a/src/app/new-page/component/content-flow-item/content-flow-item.component.spec.ts b/src/app/page/component/content-flow-item/content-flow-item.component.spec.ts similarity index 70% rename from src/app/new-page/component/content-flow-item/content-flow-item.component.spec.ts rename to src/app/page/component/content-flow-item/content-flow-item.component.spec.ts index 8aea37b7..21ccb8e0 100644 --- a/src/app/new-page/component/content-flow-item/content-flow-item.component.spec.ts +++ b/src/app/page/component/content-flow-item/content-flow-item.component.spec.ts @@ -1,18 +1,18 @@ import { SimpleChange } from '@angular/core'; import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; import { mockFlowItem } from '../../../_tests/mocks'; -import { ContentFlowItemNewComponent } from './content-flow-item.component'; +import { ContentFlowItemComponent } from './content-flow-item.component'; describe('ContentFlowItemsComponent', () => { - let component: ContentFlowItemNewComponent; - let fixture: ComponentFixture; + let component: ContentFlowItemComponent; + let fixture: ComponentFixture; const flowItem = mockFlowItem(true); beforeEach(waitForAsync(() => { TestBed.configureTestingModule({ - declarations: [ContentFlowItemNewComponent] + declarations: [ContentFlowItemComponent] }).compileComponents(); - fixture = TestBed.createComponent(ContentFlowItemNewComponent); + fixture = TestBed.createComponent(ContentFlowItemComponent); component = fixture.componentInstance; fixture.detectChanges(); })); diff --git a/src/app/new-page/component/content-flow-item/content-flow-item.component.ts b/src/app/page/component/content-flow-item/content-flow-item.component.ts similarity index 96% rename from src/app/new-page/component/content-flow-item/content-flow-item.component.ts rename to src/app/page/component/content-flow-item/content-flow-item.component.ts index 6f3ca024..cf65384b 100644 --- a/src/app/new-page/component/content-flow-item/content-flow-item.component.ts +++ b/src/app/page/component/content-flow-item/content-flow-item.component.ts @@ -11,7 +11,7 @@ import { PageService } from '../../service/page-service.service'; templateUrl: './content-flow-item.component.html', styleUrls: ['./content-flow-item.component.css'] }) -export class ContentFlowItemNewComponent implements OnChanges { +export class ContentFlowItemComponent implements OnChanges { // eslint-disable-next-line @angular-eslint/no-input-rename @Input() item: FlowItem; contents: Content[]; diff --git a/src/app/new-page/component/content-flow/content-flow.component.css b/src/app/page/component/content-flow/content-flow.component.css similarity index 100% rename from src/app/new-page/component/content-flow/content-flow.component.css rename to src/app/page/component/content-flow/content-flow.component.css diff --git a/src/app/new-page/component/content-flow/content-flow.component.html b/src/app/page/component/content-flow/content-flow.component.html similarity index 100% rename from src/app/new-page/component/content-flow/content-flow.component.html rename to src/app/page/component/content-flow/content-flow.component.html diff --git a/src/app/new-page/component/content-flow/content-flow.component.spec.ts b/src/app/page/component/content-flow/content-flow.component.spec.ts similarity index 71% rename from src/app/new-page/component/content-flow/content-flow.component.spec.ts rename to src/app/page/component/content-flow/content-flow.component.spec.ts index 6caba3f3..7eef7937 100644 --- a/src/app/new-page/component/content-flow/content-flow.component.spec.ts +++ b/src/app/page/component/content-flow/content-flow.component.spec.ts @@ -1,18 +1,18 @@ import { SimpleChange } from '@angular/core'; import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; import { mockFlow } from '../../../_tests/mocks'; -import { ContentFlowNewComponent } from './content-flow.component'; +import { ContentFlowComponent } from './content-flow.component'; describe('ContentFlowComponent', () => { - let component: ContentFlowNewComponent; - let fixture: ComponentFixture; + let component: ContentFlowComponent; + let fixture: ComponentFixture; const flow = mockFlow(); beforeEach(waitForAsync(() => { TestBed.configureTestingModule({ - declarations: [ContentFlowNewComponent] + declarations: [ContentFlowComponent] }).compileComponents(); - fixture = TestBed.createComponent(ContentFlowNewComponent); + fixture = TestBed.createComponent(ContentFlowComponent); component = fixture.componentInstance; fixture.detectChanges(); })); diff --git a/src/app/new-page/component/content-flow/content-flow.component.ts b/src/app/page/component/content-flow/content-flow.component.ts similarity index 95% rename from src/app/new-page/component/content-flow/content-flow.component.ts rename to src/app/page/component/content-flow/content-flow.component.ts index 72a5374d..bb1faf02 100644 --- a/src/app/new-page/component/content-flow/content-flow.component.ts +++ b/src/app/page/component/content-flow/content-flow.component.ts @@ -7,7 +7,7 @@ import { PageService } from '../../service/page-service.service'; templateUrl: './content-flow.component.html', styleUrls: ['./content-flow.component.css'] }) -export class ContentFlowNewComponent implements OnChanges { +export class ContentFlowComponent implements OnChanges { // eslint-disable-next-line @angular-eslint/no-input-rename @Input() item: Flow; diff --git a/src/app/page/component/content-form/content-form.component.html b/src/app/page/component/content-form/content-form.component.html index daaa5e5e..a00799ec 100644 --- a/src/app/page/component/content-form/content-form.component.html +++ b/src/app/page/component/content-form/content-form.component.html @@ -1,62 +1,5 @@
-
- - - - - - - - - - - - - - -
+
diff --git a/src/app/new-page/component/content-form/content-form.component.spec.ts b/src/app/page/component/content-form/content-form.component.spec.ts similarity index 75% rename from src/app/new-page/component/content-form/content-form.component.spec.ts rename to src/app/page/component/content-form/content-form.component.spec.ts index 100455d8..7e1b510d 100644 --- a/src/app/new-page/component/content-form/content-form.component.spec.ts +++ b/src/app/page/component/content-form/content-form.component.spec.ts @@ -2,20 +2,20 @@ import { SimpleChange } from '@angular/core'; import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; import { PageService } from '../../service/page-service.service'; import { content } from '../../../_tests/mocks'; -import { ContentFormNewComponent } from './content-form.component'; +import { ContentFormComponent } from './content-form.component'; describe('ContentFormComponent', () => { - let component: ContentFormNewComponent; - let fixture: ComponentFixture; + let component: ContentFormComponent; + let fixture: ComponentFixture; let pageService: PageService; beforeEach(waitForAsync(() => { pageService = new PageService(); TestBed.configureTestingModule({ - declarations: [ContentFormNewComponent], + declarations: [ContentFormComponent], providers: [{ provide: PageService, useValue: pageService }] }).compileComponents(); - fixture = TestBed.createComponent(ContentFormNewComponent); + fixture = TestBed.createComponent(ContentFormComponent); component = fixture.componentInstance; fixture.detectChanges(); spyOn(pageService, 'formAction'); diff --git a/src/app/page/component/content-form/content-form.component.ts b/src/app/page/component/content-form/content-form.component.ts index 31a04db6..640120c4 100644 --- a/src/app/page/component/content-form/content-form.component.ts +++ b/src/app/page/component/content-form/content-form.component.ts @@ -10,26 +10,25 @@ import { } from '@angular/core'; import { Observable, Subject } from 'rxjs'; import { takeUntil } from 'rxjs/operators'; -import { KgwContentComplexTypeForm } from '../../model/xmlns/content/content-ct-form'; -import { KgwContentElementItem } from '../../model/xmlns/content/content-element'; import { PageService } from '../../service/page-service.service'; -import { ContentInputComponent } from '../content-input/content-input.component'; +import { ContentRepeaterComponent } from '../content-repeater/content-repeater.component'; +import { Content } from 'src/app/services/xml-parser-service/xmp-parser.service'; @Component({ - selector: 'app-content-form', + selector: 'app-content-new-form', templateUrl: './content-form.component.html', styleUrls: ['./content-form.component.css'] }) export class ContentFormComponent implements OnInit, OnDestroy, OnChanges { - @Input() item: KgwContentElementItem; - @ViewChildren(ContentInputComponent) - private _inputChildren: QueryList; + @Input() item: Content[]; + @ViewChildren(ContentRepeaterComponent) + private _inputChildren: QueryList; private _unsubscribeAll = new Subject(); - form: KgwContentComplexTypeForm; + form: Content[]; ready: boolean; - items: Array; + items: Content[]; dir$: Observable; constructor(private pageService: PageService) { @@ -51,7 +50,7 @@ export class ContentFormComponent implements OnInit, OnDestroy, OnChanges { ) { this.ready = false; this.items = []; - this.form = this.item.element as KgwContentComplexTypeForm; + this.form = this.item; this.init(); } } @@ -70,7 +69,7 @@ export class ContentFormComponent implements OnInit, OnDestroy, OnChanges { } private init(): void { - this.items = this.pageService.checkContentElements(this.form.children); + this.items = this.item; this.ready = true; } @@ -80,19 +79,19 @@ export class ContentFormComponent implements OnInit, OnDestroy, OnChanges { .subscribe(() => { const emailFormInputs = []; const emailFormData = { name: '', email: '', destination_id: '' }; - this._inputChildren.forEach((item, index) => { - switch (item.name) { + this._inputChildren.first.components.forEach((component) => { + switch (component.name) { case 'name': - emailFormData.name = item.value; - emailFormInputs.push(item); + emailFormData.name = component.value; + emailFormInputs.push(component); break; case 'email': - emailFormData.email = item.value; - emailFormInputs.push(item); + emailFormData.email = component.value; + emailFormInputs.push(component); break; case 'destination_id': - emailFormData.destination_id = item.value; - emailFormInputs.push(item); + emailFormData.destination_id = component.value; + emailFormInputs.push(component); break; default: break; diff --git a/src/app/page/component/content-image/content-image.component.css b/src/app/page/component/content-image/content-image.component.css index e4ca9e08..a8e129df 100644 --- a/src/app/page/component/content-image/content-image.component.css +++ b/src/app/page/component/content-image/content-image.component.css @@ -9,4 +9,4 @@ :host:not(:first-child) .imageContent { margin-top: 24px; -} +} \ No newline at end of file diff --git a/src/app/page/component/content-image/content-image.component.html b/src/app/page/component/content-image/content-image.component.html index d1d55b90..8d3b7619 100644 --- a/src/app/page/component/content-image/content-image.component.html +++ b/src/app/page/component/content-image/content-image.component.html @@ -3,5 +3,6 @@ class="imageContent ng-binding" [ngClass]="{ firstImage: isFirstPage$ | async }" [src]="imgResource" + [ngStyle]="{ width: width }" /> diff --git a/src/app/new-page/component/content-image/content-image.component.spec.ts b/src/app/page/component/content-image/content-image.component.spec.ts similarity index 84% rename from src/app/new-page/component/content-image/content-image.component.spec.ts rename to src/app/page/component/content-image/content-image.component.spec.ts index 33e02460..2d0fcfa3 100644 --- a/src/app/new-page/component/content-image/content-image.component.spec.ts +++ b/src/app/page/component/content-image/content-image.component.spec.ts @@ -2,11 +2,11 @@ import { SimpleChange } from '@angular/core'; import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; import { PageService } from '../../service/page-service.service'; import { mockImage } from '../../../_tests/mocks'; -import { ContentImageNewComponent } from './content-image.component'; +import { ContentImageComponent } from './content-image.component'; describe('ContentImageComponent', () => { - let component: ContentImageNewComponent; - let fixture: ComponentFixture; + let component: ContentImageComponent; + let fixture: ComponentFixture; const fileName = 'name-of-file.png'; const filePath = `/some-folder/${fileName}`; const image = mockImage(fileName, filePath); @@ -18,10 +18,10 @@ describe('ContentImageComponent', () => { beforeEach(waitForAsync(() => { pageService = new PageService(); TestBed.configureTestingModule({ - declarations: [ContentImageNewComponent], + declarations: [ContentImageComponent], providers: [{ provide: PageService, useValue: pageService }] }).compileComponents(); - fixture = TestBed.createComponent(ContentImageNewComponent); + fixture = TestBed.createComponent(ContentImageComponent); component = fixture.componentInstance; fixture.detectChanges(); pageService.addToImagesDict(fileName, filePath); diff --git a/src/app/page/component/content-image/content-image.component.ts b/src/app/page/component/content-image/content-image.component.ts index dbdfd534..c6098d8a 100644 --- a/src/app/page/component/content-image/content-image.component.ts +++ b/src/app/page/component/content-image/content-image.component.ts @@ -6,22 +6,24 @@ import { SimpleChanges } from '@angular/core'; import { Observable } from 'rxjs'; -import { KgwContentComplexTypeImage } from '../../model/xmlns/content/content-ct-image'; -import { KgwContentElementItem } from '../../model/xmlns/content/content-element'; import { PageService } from '../../service/page-service.service'; - +import { + DimensionParser, + Image +} from 'src/app/services/xml-parser-service/xmp-parser.service'; @Component({ - selector: 'app-content-image', + selector: 'app-content-new-image', templateUrl: './content-image.component.html', styleUrls: ['./content-image.component.css'] }) export class ContentImageComponent implements OnChanges { - @Input() item: KgwContentElementItem; + @Input() item: Image; - image: KgwContentComplexTypeImage; + image: Image; ready: boolean; imgResource: string; isFirstPage$: Observable; + width: string; constructor(private pageService: PageService) { this.isFirstPage$ = this.pageService.isFirstPage$; @@ -38,7 +40,7 @@ export class ContentImageComponent implements OnChanges { ) { this.ready = false; this.imgResource = ''; - this.image = this.item.element as KgwContentComplexTypeImage; + this.image = this.item; this.init(); } } @@ -49,10 +51,20 @@ export class ContentImageComponent implements OnChanges { private init(): void { this.imgResource = this.pageService.getImageUrl( - this.image.attributes.resource - ? this.image.attributes.resource.trim() - : '' + this.image.resource.name || '' ); + // Try to find image in all attachments + if ( + this.imgResource === this.image.resource.name && + !this.imgResource.includes('http') + ) { + this.imgResource = + this.pageService.findAttachment(this.image.resource.name) || ''; + } + const dimensions = DimensionParser(this.image.width); + this.width = dimensions?.value + ? dimensions.value + dimensions.symbol + : null; this.ready = true; } } diff --git a/src/app/new-page/component/content-input/content-input.component.spec.ts b/src/app/page/component/content-input/content-input.component.spec.ts similarity index 81% rename from src/app/new-page/component/content-input/content-input.component.spec.ts rename to src/app/page/component/content-input/content-input.component.spec.ts index 2b807c31..e5c4d6c2 100644 --- a/src/app/new-page/component/content-input/content-input.component.spec.ts +++ b/src/app/page/component/content-input/content-input.component.spec.ts @@ -2,21 +2,21 @@ import { SimpleChange } from '@angular/core'; import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; import { PageService } from '../../service/page-service.service'; import { mockInput } from '../../../_tests/mocks'; -import { ContentInputNewComponent } from './content-input.component'; +import { ContentInputComponent } from './content-input.component'; describe('ContentInputComponent', () => { - let component: ContentInputNewComponent; - let fixture: ComponentFixture; + let component: ContentInputComponent; + let fixture: ComponentFixture; let pageService: PageService; const input = mockInput('name', 'value', 'label', 'placeholder'); beforeEach(waitForAsync(() => { pageService = new PageService(); TestBed.configureTestingModule({ - declarations: [ContentInputNewComponent], + declarations: [ContentInputComponent], providers: [{ provide: PageService, useValue: pageService }] }).compileComponents(); - fixture = TestBed.createComponent(ContentInputNewComponent); + fixture = TestBed.createComponent(ContentInputComponent); component = fixture.componentInstance; fixture.detectChanges(); })); diff --git a/src/app/page/component/content-input/content-input.component.ts b/src/app/page/component/content-input/content-input.component.ts index 523d4db5..2928e6b7 100644 --- a/src/app/page/component/content-input/content-input.component.ts +++ b/src/app/page/component/content-input/content-input.component.ts @@ -6,22 +6,24 @@ import { SimpleChanges } from '@angular/core'; import { Observable } from 'rxjs'; -import { KgwContentComplexTypeInput } from '../../model/xmlns/content/content-ct-input'; -import { KgwContentComplexTypeTextchild } from '../../model/xmlns/content/content-ct-text-child'; -import { KgwContentElementItem } from '../../model/xmlns/content/content-element'; import { PageService } from '../../service/page-service.service'; +import { + Input as xmlInput, + Text, + parseTextRemoveBrTags +} from 'src/app/services/xml-parser-service/xmp-parser.service'; @Component({ - selector: 'app-content-input', + selector: 'app-content-new-input', templateUrl: './content-input.component.html', styleUrls: ['./content-input.component.css'] }) export class ContentInputComponent implements OnChanges { - @Input() item: KgwContentElementItem; + @Input() item: xmlInput; - input: KgwContentComplexTypeInput; - label: KgwContentComplexTypeTextchild; - placeholder: KgwContentComplexTypeTextchild; + input: xmlInput; + label: Text; + placeholder: Text; ready: boolean; labelText: string; placeholderText: string; @@ -47,7 +49,7 @@ export class ContentInputComponent implements OnChanges { this.ready = false; this.labelText = ''; this.placeholderText = ''; - this.input = this.item.element as KgwContentComplexTypeInput; + this.input = this.item; this.label = null; this.placeholder = null; this.required = false; @@ -63,31 +65,15 @@ export class ContentInputComponent implements OnChanges { } private init(): void { - if (this.input.label) { - this.label = this.input.label; - if (this.label && this.label.text && this.label.text.value) { - this.labelText = this.label.text.value.trim(); - } - } - if (this.input.placeholder) { - this.placeholder = this.input.placeholder; - if ( - this.placeholder && - this.placeholder.text && - this.placeholder.text.value - ) { - if (this.placeholder.text && this.placeholder.text.value) { - this.placeholderText = this.placeholder.text.value - .trim() - .replace(//gi, ' '); - } - } - } - - this.required = this.input.attributes.required; - this.value = this.input.attributes.value; - this.name = this.input.attributes.name; - this.type = this.input.attributes.type; + this.label = this.input?.label || null; + this.labelText = this.input.label?.text || ''; + this.placeholder = this.input?.placeholder || null; + this.placeholderText = + parseTextRemoveBrTags(this.input?.placeholder?.text) || ''; + this.required = this.input.isRequired; + this.value = this.input.value; + this.name = this.input.name; + this.type = this.input.type.name; this.ready = true; } } diff --git a/src/app/new-page/component/content-link/content-link.component.spec.ts b/src/app/page/component/content-link/content-link.component.spec.ts similarity index 82% rename from src/app/new-page/component/content-link/content-link.component.spec.ts rename to src/app/page/component/content-link/content-link.component.spec.ts index 7976e75d..dc91af98 100644 --- a/src/app/new-page/component/content-link/content-link.component.spec.ts +++ b/src/app/page/component/content-link/content-link.component.spec.ts @@ -2,21 +2,21 @@ import { SimpleChange } from '@angular/core'; import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; import { PageService } from '../../service/page-service.service'; import { mockLink } from '../../../_tests/mocks'; -import { ContentLinkNewComponent } from './content-link.component'; +import { ContentLinkComponent } from './content-link.component'; describe('ContentInputComponent', () => { - let component: ContentLinkNewComponent; - let fixture: ComponentFixture; + let component: ContentLinkComponent; + let fixture: ComponentFixture; let pageService: PageService; const link = mockLink('https://cru.org', 'link text', true); beforeEach(waitForAsync(() => { pageService = new PageService(); TestBed.configureTestingModule({ - declarations: [ContentLinkNewComponent], + declarations: [ContentLinkComponent], providers: [{ provide: PageService, useValue: pageService }] }).compileComponents(); - fixture = TestBed.createComponent(ContentLinkNewComponent); + fixture = TestBed.createComponent(ContentLinkComponent); component = fixture.componentInstance; fixture.detectChanges(); spyOn(pageService, 'formAction'); diff --git a/src/app/page/component/content-link/content-link.component.ts b/src/app/page/component/content-link/content-link.component.ts index 6d73ba69..a33e27a8 100644 --- a/src/app/page/component/content-link/content-link.component.ts +++ b/src/app/page/component/content-link/content-link.component.ts @@ -6,24 +6,27 @@ import { SimpleChanges } from '@angular/core'; import { Observable } from 'rxjs'; -import { KgwContentComplexTypeLink } from '../../model/xmlns/content/content-ct-link'; -import { KgwContentComplexTypeText } from '../../model/xmlns/content/content-ct-text'; -import { KgwContentElementItem } from '../../model/xmlns/content/content-element'; import { PageService } from '../../service/page-service.service'; +import { + Link, + Text, + EventId +} from 'src/app/services/xml-parser-service/xmp-parser.service'; +import { formatEvents } from 'src/app/shared/formatEvents'; @Component({ - selector: 'app-content-link', + selector: 'app-content-new-link', templateUrl: './content-link.component.html', styleUrls: ['./content-link.component.css'] }) export class ContentLinkComponent implements OnChanges { - @Input() item: KgwContentElementItem; + @Input() item: Link; - link: KgwContentComplexTypeLink; - text: KgwContentComplexTypeText; + link: Link; + text: Text; ready: boolean; linkText: string; - events: string; + events: EventId[]; dir$: Observable; constructor(private pageService: PageService) { @@ -41,8 +44,9 @@ export class ContentLinkComponent implements OnChanges { ) { this.ready = false; this.linkText = ''; - this.events = ''; - this.link = this.item.element as KgwContentComplexTypeLink; + this.events = null; + this.text = null; + this.link = this.item; this.init(); } } @@ -53,19 +57,14 @@ export class ContentLinkComponent implements OnChanges { formAction(): void { if (this.events) { - this.pageService.formAction(this.events); + this.pageService.formAction(formatEvents(this.events)); } } private init(): void { - if (this.link.text) { - this.text = this.link.text; - if (this.text && this.text.value) { - this.linkText = this.text.value.trim(); - } - } - - this.events = this.link.attributes.events; + this.text = this.link.text || null; + this.linkText = this.link.text?.text || ''; + this.events = this.link.events; this.ready = true; } } diff --git a/src/app/new-page/component/content-multiselect-option/content-multiselect-option.component.css b/src/app/page/component/content-multiselect-option/content-multiselect-option.component.css similarity index 100% rename from src/app/new-page/component/content-multiselect-option/content-multiselect-option.component.css rename to src/app/page/component/content-multiselect-option/content-multiselect-option.component.css diff --git a/src/app/new-page/component/content-multiselect-option/content-multiselect-option.component.html b/src/app/page/component/content-multiselect-option/content-multiselect-option.component.html similarity index 100% rename from src/app/new-page/component/content-multiselect-option/content-multiselect-option.component.html rename to src/app/page/component/content-multiselect-option/content-multiselect-option.component.html diff --git a/src/app/new-page/component/content-multiselect-option/content-multiselect-option.component.spec.ts b/src/app/page/component/content-multiselect-option/content-multiselect-option.component.spec.ts similarity index 76% rename from src/app/new-page/component/content-multiselect-option/content-multiselect-option.component.spec.ts rename to src/app/page/component/content-multiselect-option/content-multiselect-option.component.spec.ts index 273ecf0a..4b34ea8e 100644 --- a/src/app/new-page/component/content-multiselect-option/content-multiselect-option.component.spec.ts +++ b/src/app/page/component/content-multiselect-option/content-multiselect-option.component.spec.ts @@ -1,18 +1,18 @@ import { SimpleChange } from '@angular/core'; import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; import { mockMultiselectOption } from '../../../_tests/mocks'; -import { ContentMultiselectOptionNewComponent } from './content-multiselect-option.component'; +import { ContentMultiselectOptionComponent } from './content-multiselect-option.component'; describe('ContentMultiselectOptionComponent', () => { - let component: ContentMultiselectOptionNewComponent; - let fixture: ComponentFixture; + let component: ContentMultiselectOptionComponent; + let fixture: ComponentFixture; const multiselectOption = mockMultiselectOption(false); beforeEach(waitForAsync(() => { TestBed.configureTestingModule({ - declarations: [ContentMultiselectOptionNewComponent] + declarations: [ContentMultiselectOptionComponent] }).compileComponents(); - fixture = TestBed.createComponent(ContentMultiselectOptionNewComponent); + fixture = TestBed.createComponent(ContentMultiselectOptionComponent); component = fixture.componentInstance; fixture.detectChanges(); })); diff --git a/src/app/new-page/component/content-multiselect-option/content-multiselect-option.component.ts b/src/app/page/component/content-multiselect-option/content-multiselect-option.component.ts similarity index 96% rename from src/app/new-page/component/content-multiselect-option/content-multiselect-option.component.ts rename to src/app/page/component/content-multiselect-option/content-multiselect-option.component.ts index 04e2b8b3..e018b86f 100644 --- a/src/app/new-page/component/content-multiselect-option/content-multiselect-option.component.ts +++ b/src/app/page/component/content-multiselect-option/content-multiselect-option.component.ts @@ -11,7 +11,7 @@ import { PageService } from '../../service/page-service.service'; templateUrl: './content-multiselect-option.component.html', styleUrls: ['./content-multiselect-option.component.css'] }) -export class ContentMultiselectOptionNewComponent implements OnChanges { +export class ContentMultiselectOptionComponent implements OnChanges { // eslint-disable-next-line @angular-eslint/no-input-rename @Input() item: MultiselectOption; option: MultiselectOption; diff --git a/src/app/new-page/component/content-multiselect/content-multiselect.component.css b/src/app/page/component/content-multiselect/content-multiselect.component.css similarity index 100% rename from src/app/new-page/component/content-multiselect/content-multiselect.component.css rename to src/app/page/component/content-multiselect/content-multiselect.component.css diff --git a/src/app/new-page/component/content-multiselect/content-multiselect.component.html b/src/app/page/component/content-multiselect/content-multiselect.component.html similarity index 100% rename from src/app/new-page/component/content-multiselect/content-multiselect.component.html rename to src/app/page/component/content-multiselect/content-multiselect.component.html diff --git a/src/app/new-page/component/content-multiselect/content-multiselect.component.spec.ts b/src/app/page/component/content-multiselect/content-multiselect.component.spec.ts similarity index 71% rename from src/app/new-page/component/content-multiselect/content-multiselect.component.spec.ts rename to src/app/page/component/content-multiselect/content-multiselect.component.spec.ts index da0c9f1e..889ecbbf 100644 --- a/src/app/new-page/component/content-multiselect/content-multiselect.component.spec.ts +++ b/src/app/page/component/content-multiselect/content-multiselect.component.spec.ts @@ -1,18 +1,18 @@ import { SimpleChange } from '@angular/core'; import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; import { mockMultiselect } from '../../../_tests/mocks'; -import { ContentMultiselectNewComponent } from './content-multiselect.component'; +import { ContentMultiselectComponent } from './content-multiselect.component'; describe('ContentMultiselectComponent', () => { - let component: ContentMultiselectNewComponent; - let fixture: ComponentFixture; + let component: ContentMultiselectComponent; + let fixture: ComponentFixture; const multiselect = mockMultiselect(); beforeEach(waitForAsync(() => { TestBed.configureTestingModule({ - declarations: [ContentMultiselectNewComponent] + declarations: [ContentMultiselectComponent] }).compileComponents(); - fixture = TestBed.createComponent(ContentMultiselectNewComponent); + fixture = TestBed.createComponent(ContentMultiselectComponent); component = fixture.componentInstance; fixture.detectChanges(); })); diff --git a/src/app/new-page/component/content-multiselect/content-multiselect.component.ts b/src/app/page/component/content-multiselect/content-multiselect.component.ts similarity index 95% rename from src/app/new-page/component/content-multiselect/content-multiselect.component.ts rename to src/app/page/component/content-multiselect/content-multiselect.component.ts index b42505fd..20f79ad9 100644 --- a/src/app/new-page/component/content-multiselect/content-multiselect.component.ts +++ b/src/app/page/component/content-multiselect/content-multiselect.component.ts @@ -16,7 +16,7 @@ interface MultiselectOptionWithContent { templateUrl: './content-multiselect.component.html', styleUrls: ['./content-multiselect.component.css'] }) -export class ContentMultiselectNewComponent implements OnChanges { +export class ContentMultiselectComponent implements OnChanges { // eslint-disable-next-line @angular-eslint/no-input-rename @Input() item: Multiselect; diff --git a/src/app/page/component/content-paragraph/content-paragraph.component.html b/src/app/page/component/content-paragraph/content-paragraph.component.html index fce99c1d..f074453e 100644 --- a/src/app/page/component/content-paragraph/content-paragraph.component.html +++ b/src/app/page/component/content-paragraph/content-paragraph.component.html @@ -1,60 +1,3 @@ - - - - - - - - - - - - - - - - + diff --git a/src/app/new-page/component/content-paragraph/content-paragraph.component.spec.ts b/src/app/page/component/content-paragraph/content-paragraph.component.spec.ts similarity index 70% rename from src/app/new-page/component/content-paragraph/content-paragraph.component.spec.ts rename to src/app/page/component/content-paragraph/content-paragraph.component.spec.ts index 072f608b..d41cd52a 100644 --- a/src/app/new-page/component/content-paragraph/content-paragraph.component.spec.ts +++ b/src/app/page/component/content-paragraph/content-paragraph.component.spec.ts @@ -1,18 +1,18 @@ import { SimpleChange } from '@angular/core'; import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; import { mockParagraph } from '../../../_tests/mocks'; -import { ContentParagraphNewComponent } from './content-paragraph.component'; +import { ContentParagraphComponent } from './content-paragraph.component'; describe('ContentInputComponent', () => { - let component: ContentParagraphNewComponent; - let fixture: ComponentFixture; + let component: ContentParagraphComponent; + let fixture: ComponentFixture; const paragraph = mockParagraph(); beforeEach(waitForAsync(() => { TestBed.configureTestingModule({ - declarations: [ContentParagraphNewComponent] + declarations: [ContentParagraphComponent] }).compileComponents(); - fixture = TestBed.createComponent(ContentParagraphNewComponent); + fixture = TestBed.createComponent(ContentParagraphComponent); component = fixture.componentInstance; fixture.detectChanges(); })); diff --git a/src/app/page/component/content-paragraph/content-paragraph.component.ts b/src/app/page/component/content-paragraph/content-paragraph.component.ts index ff46d132..68c0a571 100644 --- a/src/app/page/component/content-paragraph/content-paragraph.component.ts +++ b/src/app/page/component/content-paragraph/content-paragraph.component.ts @@ -1,27 +1,21 @@ +import { Component, Input, OnChanges, SimpleChanges } from '@angular/core'; import { - Component, - Input, - OnChanges, - OnInit, - SimpleChanges -} from '@angular/core'; -import { KgwContentComplexTypeParagraph } from '../../model/xmlns/content/content-ct-paragraph'; -import { KgwContentElementItem } from '../../model/xmlns/content/content-element'; -import { PageService } from '../../service/page-service.service'; - + Paragraph, + Content +} from 'src/app/services/xml-parser-service/xmp-parser.service'; @Component({ - selector: 'app-content-paragraph', + selector: 'app-content-new-paragraph', templateUrl: './content-paragraph.component.html', styleUrls: ['./content-paragraph.component.css'] }) export class ContentParagraphComponent implements OnChanges { - @Input() item: KgwContentElementItem; + @Input() item: Paragraph; - paragraph: KgwContentComplexTypeParagraph; + paragraph: Paragraph; ready: boolean; - items: Array; + items: Array; - constructor(private pageService: PageService) {} + constructor() {} ngOnChanges(changes: SimpleChanges) { for (const propName in changes) { @@ -34,8 +28,7 @@ export class ContentParagraphComponent implements OnChanges { ) { this.ready = false; this.items = []; - this.paragraph = this.item - .element as KgwContentComplexTypeParagraph; + this.paragraph = this.item; this.init(); } } @@ -45,20 +38,7 @@ export class ContentParagraphComponent implements OnChanges { } private init(): void { - const isFallback = this.paragraph.attributes.fallback; - if (isFallback) { - const tSupportedItem = this.pageService.getFirstSupportedContentElement( - this.paragraph.children - ); - if (tSupportedItem) { - this.items.push(tSupportedItem); - } - } else { - this.items = this.pageService.checkContentElements( - this.paragraph.children - ); - } - + this.items = this.paragraph.content; this.ready = true; } } diff --git a/src/app/new-page/component/content-repeater/content-repeater.component.css b/src/app/page/component/content-repeater/content-repeater.component.css similarity index 100% rename from src/app/new-page/component/content-repeater/content-repeater.component.css rename to src/app/page/component/content-repeater/content-repeater.component.css diff --git a/src/app/new-page/component/content-repeater/content-repeater.component.html b/src/app/page/component/content-repeater/content-repeater.component.html similarity index 100% rename from src/app/new-page/component/content-repeater/content-repeater.component.html rename to src/app/page/component/content-repeater/content-repeater.component.html diff --git a/src/app/new-page/component/content-repeater/content-repeater.component.spec.ts b/src/app/page/component/content-repeater/content-repeater.component.spec.ts similarity index 75% rename from src/app/new-page/component/content-repeater/content-repeater.component.spec.ts rename to src/app/page/component/content-repeater/content-repeater.component.spec.ts index a5f20fb0..f72e1794 100644 --- a/src/app/new-page/component/content-repeater/content-repeater.component.spec.ts +++ b/src/app/page/component/content-repeater/content-repeater.component.spec.ts @@ -1,18 +1,18 @@ import { SimpleChange } from '@angular/core'; import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; import { paragraph, text, content } from '../../../_tests/mocks'; -import { ContentRepeaterNewComponent } from './content-repeater.component'; +import { ContentRepeaterComponent } from './content-repeater.component'; import { ContentParser } from 'src/app/services/xml-parser-service/xmp-parser.service'; describe('ContentInputComponent', () => { - let component: ContentRepeaterNewComponent; - let fixture: ComponentFixture; + let component: ContentRepeaterComponent; + let fixture: ComponentFixture; beforeEach(waitForAsync(() => { TestBed.configureTestingModule({ - declarations: [ContentRepeaterNewComponent] + declarations: [ContentRepeaterComponent] }).compileComponents(); - fixture = TestBed.createComponent(ContentRepeaterNewComponent); + fixture = TestBed.createComponent(ContentRepeaterComponent); component = fixture.componentInstance; fixture.detectChanges(); })); diff --git a/src/app/new-page/component/content-repeater/content-repeater.component.ts b/src/app/page/component/content-repeater/content-repeater.component.ts similarity index 87% rename from src/app/new-page/component/content-repeater/content-repeater.component.ts rename to src/app/page/component/content-repeater/content-repeater.component.ts index 1fb1017a..8827bcab 100644 --- a/src/app/new-page/component/content-repeater/content-repeater.component.ts +++ b/src/app/page/component/content-repeater/content-repeater.component.ts @@ -6,7 +6,7 @@ import { SimpleChanges, ViewChildren } from '@angular/core'; -import { ContentInputNewComponent } from '../content-input/content-input.component'; +import { ContentInputComponent } from '../content-input/content-input.component'; import { ContentItems, Content, @@ -18,10 +18,10 @@ import { templateUrl: './content-repeater.component.html', styleUrls: ['./content-repeater.component.css'] }) -export class ContentRepeaterNewComponent implements OnChanges { +export class ContentRepeaterComponent implements OnChanges { @Input() items: Content[]; - @ViewChildren(ContentInputNewComponent) - components: QueryList; + @ViewChildren(ContentInputComponent) + components: QueryList; ready: boolean; content: ContentItemsType[]; diff --git a/src/app/page/component/content-spacer/content-spacer.component.ts b/src/app/page/component/content-spacer/content-spacer.component.ts index 35248e0d..fc46ecb9 100644 --- a/src/app/page/component/content-spacer/content-spacer.component.ts +++ b/src/app/page/component/content-spacer/content-spacer.component.ts @@ -6,20 +6,19 @@ import { SimpleChanges } from '@angular/core'; import { Observable } from 'rxjs'; -import { KgwContentComplexTypeSpacer } from '../../model/xmlns/content/content-ct-spacer'; -import { KgwContentElementItem } from '../../model/xmlns/content/content-element'; import { PageService } from '../../service/page-service.service'; +import { Spacer } from 'src/app/services/xml-parser-service/xmp-parser.service'; @Component({ - selector: 'app-content-spacer', + selector: 'app-content-new-spacer', templateUrl: './content-spacer.component.html', styleUrls: ['./content-spacer.component.css'] }) export class ContentSpacerComponent implements OnChanges { // eslint-disable-next-line @angular-eslint/no-input-rename - @Input() item: KgwContentElementItem; + @Input() item: Spacer; - spacer: KgwContentComplexTypeSpacer; + spacer: Spacer; ready: boolean; mode: string; height: number; @@ -40,7 +39,7 @@ export class ContentSpacerComponent implements OnChanges { ) { this.mode = ''; this.height = 0; - this.spacer = this.item.element as KgwContentComplexTypeSpacer; + this.spacer = this.item; this.ready = false; this.init(); } @@ -51,8 +50,8 @@ export class ContentSpacerComponent implements OnChanges { } private init(): void { - this.mode = this.spacer.attributes.mode; - this.height = this.spacer.attributes.height; + this.mode = this.spacer.mode.name; + this.height = this.spacer.height; this.ready = true; } } diff --git a/src/app/page/component/content-tabs/content-tabs.component.html b/src/app/page/component/content-tabs/content-tabs.component.html index 6fd01e86..41b6fe8f 100644 --- a/src/app/page/component/content-tabs/content-tabs.component.html +++ b/src/app/page/component/content-tabs/content-tabs.component.html @@ -1,65 +1,11 @@ - + - +
- - - - - - - - - - - - - - - - +

{{ tab.tab.label.text }}

+
diff --git a/src/app/page/component/content-tabs/content-tabs.component.ts b/src/app/page/component/content-tabs/content-tabs.component.ts index dcc5a6f4..01e6ec28 100644 --- a/src/app/page/component/content-tabs/content-tabs.component.ts +++ b/src/app/page/component/content-tabs/content-tabs.component.ts @@ -6,22 +6,30 @@ import { SimpleChanges } from '@angular/core'; import { Observable } from 'rxjs'; -import { KgwContentComplexTypeTab } from '../../model/xmlns/content/content-ct-tab'; -import { KgwContentComplexTypeTabs } from '../../model/xmlns/content/content-ct-tabs'; -import { KgwContentElementItem } from '../../model/xmlns/content/content-element'; import { PageService } from '../../service/page-service.service'; +import { + Tabs, + Tab, + Content +} from 'src/app/services/xml-parser-service/xmp-parser.service'; + +interface TabWithContent { + tab: Tab; + contents: Content[]; +} @Component({ - selector: 'app-content-tabs', + selector: 'app-content-new-tabs', templateUrl: './content-tabs.component.html', styleUrls: ['./content-tabs.component.css'] }) export class ContentTabsComponent implements OnChanges { // eslint-disable-next-line @angular-eslint/no-input-rename - @Input() item: KgwContentElementItem; + @Input() item: Tabs; - tabs: KgwContentComplexTypeTabs; - content: Array; + tabs: Tabs; + content: TabWithContent[]; + contents: Content[]; ready: boolean; dir$: Observable; isModal$: Observable; @@ -41,8 +49,9 @@ export class ContentTabsComponent implements OnChanges { changes['item'].currentValue !== changes['item'].previousValue ) { this.ready = false; - this.tabs = this.item.element as KgwContentComplexTypeTabs; + this.tabs = this.item; this.content = []; + this.contents = []; this.init(); } } @@ -56,13 +65,14 @@ export class ContentTabsComponent implements OnChanges { } private init(): void { - if (this.tabs.tabs && this.tabs.tabs.length) { - this.tabs.tabs.forEach((tab) => { - tab.children = this.pageService.checkContentElements(tab.children); - this.content.push(tab); - }); - } - + this.tabs.tabs.forEach((tab) => { + const contents: Content[] = []; + if (tab.content) + tab.content.forEach((content) => + content ? contents.push(content) : null + ); + this.content.push({ tab, contents }); + }); this.ready = true; } } diff --git a/src/app/page/component/content-text/content-text.component.html b/src/app/page/component/content-text/content-text.component.html index 33ede9ba..5b7e7083 100644 --- a/src/app/page/component/content-text/content-text.component.html +++ b/src/app/page/component/content-text/content-text.component.html @@ -1,7 +1,9 @@ +

diff --git a/src/app/new-page/component/content-text/content-text.component.spec.ts b/src/app/page/component/content-text/content-text.component.spec.ts similarity index 77% rename from src/app/new-page/component/content-text/content-text.component.spec.ts rename to src/app/page/component/content-text/content-text.component.spec.ts index ee4eb895..3f4ee9f2 100644 --- a/src/app/new-page/component/content-text/content-text.component.spec.ts +++ b/src/app/page/component/content-text/content-text.component.spec.ts @@ -2,21 +2,21 @@ import { SimpleChange } from '@angular/core'; import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; import { PageService } from '../../service/page-service.service'; import { mockText } from '../../../_tests/mocks'; -import { ContentTextNewComponent } from './content-text.component'; +import { ContentTextComponent } from './content-text.component'; describe('ContentInputComponent', () => { - let component: ContentTextNewComponent; - let fixture: ComponentFixture; + let component: ContentTextComponent; + let fixture: ComponentFixture; let pageService: PageService; const text = mockText('text cru text \ndps.'); beforeEach(waitForAsync(() => { pageService = new PageService(); TestBed.configureTestingModule({ - declarations: [ContentTextNewComponent], + declarations: [ContentTextComponent], providers: [{ provide: PageService, useValue: pageService }] }).compileComponents(); - fixture = TestBed.createComponent(ContentTextNewComponent); + fixture = TestBed.createComponent(ContentTextComponent); component = fixture.componentInstance; fixture.detectChanges(); spyOn(pageService, 'formAction'); diff --git a/src/app/page/component/content-text/content-text.component.ts b/src/app/page/component/content-text/content-text.component.ts index d3632634..74166707 100644 --- a/src/app/page/component/content-text/content-text.component.ts +++ b/src/app/page/component/content-text/content-text.component.ts @@ -6,23 +6,27 @@ import { SimpleChanges } from '@angular/core'; import { Observable } from 'rxjs'; -import { KgwContentComplexTypeText } from '../../model/xmlns/content/content-ct-text'; -import { KgwContentElementItem } from '../../model/xmlns/content/content-element'; import { PageService } from '../../service/page-service.service'; +import { + Text, + parseTextAddBrTags +} from 'src/app/services/xml-parser-service/xmp-parser.service'; @Component({ - selector: 'app-content-text', + selector: 'app-content-new-text', templateUrl: './content-text.component.html', styleUrls: ['./content-text.component.css'] }) export class ContentTextComponent implements OnChanges { - @Input() item: KgwContentElementItem; + @Input() item: Text; - text: KgwContentComplexTypeText; + text: Text; ready: boolean; textValue: string; isFirstPage$: Observable; dir$: Observable; + textColor: string; + styles: any; constructor(private pageService: PageService) { this.isFirstPage$ = pageService.isFirstPage$; @@ -40,7 +44,7 @@ export class ContentTextComponent implements OnChanges { ) { this.ready = false; this.textValue = ''; - this.text = this.item.element as KgwContentComplexTypeText; + this.text = this.item as Text; this.init(); } } @@ -50,7 +54,16 @@ export class ContentTextComponent implements OnChanges { } private init(): void { - this.textValue = this.text && this.text.value ? this.text.value.trim() : ''; + const styles = {}; + this.text?.textStyles?.forEach((style) => { + if (style.name === 'BOLD') styles['font-weight'] = 'bold'; + if (style.name === 'ITALIC') styles['font-style'] = 'italic'; + if (style.name === 'UNDERLINE') styles['text-decoration'] = 'underline'; + }); + this.styles = styles; + this.textColor = this.text.textColor || null; + const text = parseTextAddBrTags(this.text.text); + this.textValue = text || ''; this.ready = true; } } diff --git a/src/app/page/component/content-video/content-video.component.html b/src/app/page/component/content-video/content-video.component.html index f777d780..37e47747 100644 --- a/src/app/page/component/content-video/content-video.component.html +++ b/src/app/page/component/content-video/content-video.component.html @@ -1,4 +1,4 @@ - +
diff --git a/src/app/new-page/component/content-video/content-video.component.spec.ts b/src/app/page/component/content-video/content-video.component.spec.ts similarity index 81% rename from src/app/new-page/component/content-video/content-video.component.spec.ts rename to src/app/page/component/content-video/content-video.component.spec.ts index 56bd7b97..7da082a3 100644 --- a/src/app/new-page/component/content-video/content-video.component.spec.ts +++ b/src/app/page/component/content-video/content-video.component.spec.ts @@ -2,12 +2,12 @@ import { SimpleChange } from '@angular/core'; import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; import { PageService } from '../../service/page-service.service'; import { mockVideo } from '../../../_tests/mocks'; -import { ContentVideoNewComponent } from './content-video.component'; +import { ContentVideoComponent } from './content-video.component'; import { ɵunwrapSafeValue } from '@angular/core'; describe('ContentVideoComponent', () => { - let component: ContentVideoNewComponent; - let fixture: ComponentFixture; + let component: ContentVideoComponent; + let fixture: ComponentFixture; let pageService: PageService; const videoId = 'testVideoId'; const video = mockVideo(videoId); @@ -15,10 +15,10 @@ describe('ContentVideoComponent', () => { beforeEach(waitForAsync(() => { pageService = new PageService(); TestBed.configureTestingModule({ - declarations: [ContentVideoNewComponent], + declarations: [ContentVideoComponent], providers: [{ provide: PageService, useValue: pageService }] }).compileComponents(); - fixture = TestBed.createComponent(ContentVideoNewComponent); + fixture = TestBed.createComponent(ContentVideoComponent); component = fixture.componentInstance; fixture.detectChanges(); spyOn(pageService, 'formAction'); diff --git a/src/app/page/component/content-video/content-video.component.ts b/src/app/page/component/content-video/content-video.component.ts index 2da8dd25..ccb11fd4 100644 --- a/src/app/page/component/content-video/content-video.component.ts +++ b/src/app/page/component/content-video/content-video.component.ts @@ -7,19 +7,18 @@ import { } from '@angular/core'; import { DomSanitizer, SafeResourceUrl } from '@angular/platform-browser'; import { Observable } from 'rxjs'; -import { KgwContentComplexTypeVideo } from '../../model/xmlns/content/content-ct-video'; -import { KgwContentElementItem } from '../../model/xmlns/content/content-element'; import { PageService } from '../../service/page-service.service'; +import { Video } from 'src/app/services/xml-parser-service/xmp-parser.service'; @Component({ - selector: 'app-content-video', + selector: 'app-content-new-video', templateUrl: './content-video.component.html', styleUrls: ['./content-video.component.css'] }) export class ContentVideoComponent implements OnChanges { - @Input() item: KgwContentElementItem; + @Input() item: Video; - video: KgwContentComplexTypeVideo; + video: Video; ready: boolean; provider: string; videoId: string; @@ -44,7 +43,7 @@ export class ContentVideoComponent implements OnChanges { ) { this.provider = ''; this.videoId = ''; - this.video = this.item.element as KgwContentComplexTypeVideo; + this.video = this.item; this.ready = false; this.init(); } @@ -55,19 +54,13 @@ export class ContentVideoComponent implements OnChanges { } private init(): void { - if (this.video.attributes.provider) { - this.provider = this.video.attributes.provider; - } - - if (this.video.attributes.videoId) { - setTimeout(() => { - this.videoUrl = this.sanitizer.bypassSecurityTrustResourceUrl( - `https://www.youtube.com/embed/${this.video.attributes.videoId}` - ); - this.videoId = this.video.attributes.videoId; - }, 0); - } - + this.provider = this.video.provider.name || ''; + this.videoId = this.video.videoId || ''; + setTimeout(() => { + this.videoUrl = this.sanitizer.bypassSecurityTrustResourceUrl( + `https://www.youtube.com/embed/${this.videoId}` + ); + }, 0); this.ready = true; } } diff --git a/src/app/page/component/modal/modal.component.html b/src/app/page/component/modal/modal.component.html index 87f9f208..571336cf 100644 --- a/src/app/page/component/modal/modal.component.html +++ b/src/app/page/component/modal/modal.component.html @@ -8,12 +8,6 @@
- - - + diff --git a/src/app/new-page/component/modal/modal.component.spec.ts b/src/app/page/component/modal/modal.component.spec.ts similarity index 82% rename from src/app/new-page/component/modal/modal.component.spec.ts rename to src/app/page/component/modal/modal.component.spec.ts index 4f4289e0..63ae1917 100644 --- a/src/app/new-page/component/modal/modal.component.spec.ts +++ b/src/app/page/component/modal/modal.component.spec.ts @@ -2,11 +2,11 @@ import { SimpleChange } from '@angular/core'; import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; import { PageService } from '../../service/page-service.service'; import { mockModal } from '../../../_tests/mocks'; -import { ModalNewComponent } from './modal.component'; +import { ModalComponent } from './modal.component'; describe('ModalComponent', () => { - let component: ModalNewComponent; - let fixture: ComponentFixture; + let component: ModalComponent; + let fixture: ComponentFixture; let pageService: PageService; const modal = mockModal( 'Modal top title \n Model bottom title', @@ -16,10 +16,10 @@ describe('ModalComponent', () => { beforeEach(waitForAsync(() => { pageService = new PageService(); TestBed.configureTestingModule({ - declarations: [ModalNewComponent], + declarations: [ModalComponent], providers: [{ provide: PageService, useValue: pageService }] }).compileComponents(); - fixture = TestBed.createComponent(ModalNewComponent); + fixture = TestBed.createComponent(ModalComponent); component = fixture.componentInstance; fixture.detectChanges(); })); diff --git a/src/app/page/component/modal/modal.component.ts b/src/app/page/component/modal/modal.component.ts index fb9ffdc0..52b0ee4d 100644 --- a/src/app/page/component/modal/modal.component.ts +++ b/src/app/page/component/modal/modal.component.ts @@ -6,23 +6,25 @@ import { SimpleChanges } from '@angular/core'; import { Observable } from 'rxjs'; -import { KgwContentComplexTypeParagraph } from '../../model/xmlns/content/content-ct-paragraph'; -import { KgwContentComplexTypeTextchild } from '../../model/xmlns/content/content-ct-text-child'; -import { KgwContentElementItem } from '../../model/xmlns/content/content-element'; -import { KgwTractComplexTypeModal } from '../../model/xmlns/tract/tract-ct-modal'; import { PageService } from '../../service/page-service.service'; +import { + Modal, + Text, + parseTextAddBrTags, + Content +} from 'src/app/services/xml-parser-service/xmp-parser.service'; @Component({ - selector: 'app-page-modal', + selector: 'app-page-new-modal', templateUrl: './modal.component.html', styleUrls: ['./modal.component.css'] }) export class ModalComponent implements OnChanges { - @Input() modal: KgwTractComplexTypeModal; + @Input() modal: Modal; ready: boolean; - title: KgwContentComplexTypeTextchild; - content: Array; + title: Text; + content: Content[]; titleText: string; dir$: Observable; @@ -56,32 +58,9 @@ export class ModalComponent implements OnChanges { } private init(): void { - if (this.modal.title) { - this.title = this.modal.title; - this.titleText = - this.title.text && this.title.text.value - ? this.title.text.value.trim() - : ''; - } - - if (this.modal.content && this.modal.content.length) { - this.modal.content.forEach((contentChild) => { - if (contentChild.contentType === 'paragraph') { - const tParagraph: KgwContentComplexTypeParagraph = - contentChild as KgwContentComplexTypeParagraph; - if ( - !this.pageService.isRestricted(tParagraph.attributes.restrictTo) - ) { - const tItemToAdd: KgwContentElementItem = { - type: 'paragraph', - element: tParagraph - }; - this.content.push(tItemToAdd); - } - } - }); - } - + this.title = this.modal?.title || null; + this.titleText = parseTextAddBrTags(this.title?.text) || ''; + this.content = this.modal.content; this.ready = true; } } diff --git a/src/app/page/component/page-header/page-header.component.html b/src/app/page/component/page-header/page-header.component.html index ce43ad98..a68846ab 100644 --- a/src/app/page/component/page-header/page-header.component.html +++ b/src/app/page/component/page-header/page-header.component.html @@ -3,19 +3,19 @@

{{ headerText }}

- +

{{ header.number }}{{ headerNumber }} {{ headerText }}

diff --git a/src/app/new-page/component/page-header/page-header.component.spec.ts b/src/app/page/component/page-header/page-header.component.spec.ts similarity index 83% rename from src/app/new-page/component/page-header/page-header.component.spec.ts rename to src/app/page/component/page-header/page-header.component.spec.ts index 88732883..51b053ca 100644 --- a/src/app/new-page/component/page-header/page-header.component.spec.ts +++ b/src/app/page/component/page-header/page-header.component.spec.ts @@ -2,21 +2,21 @@ import { SimpleChange } from '@angular/core'; import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; import { PageService } from '../../service/page-service.service'; import { mockHeader } from '../../../_tests/mocks'; -import { PageHeaderNewComponent } from './page-header.component'; +import { PageHeaderComponent } from './page-header.component'; describe('pageHeaderComponent', () => { - let component: PageHeaderNewComponent; - let fixture: ComponentFixture; + let component: PageHeaderComponent; + let fixture: ComponentFixture; let pageService: PageService; const header = mockHeader('6', 'How jesus can \nchange your life.'); beforeEach(waitForAsync(() => { pageService = new PageService(); TestBed.configureTestingModule({ - declarations: [PageHeaderNewComponent], + declarations: [PageHeaderComponent], providers: [{ provide: PageService, useValue: pageService }] }).compileComponents(); - fixture = TestBed.createComponent(PageHeaderNewComponent); + fixture = TestBed.createComponent(PageHeaderComponent); component = fixture.componentInstance; fixture.detectChanges(); })); diff --git a/src/app/page/component/page-header/page-header.component.ts b/src/app/page/component/page-header/page-header.component.ts index 26c20c34..418aad9f 100644 --- a/src/app/page/component/page-header/page-header.component.ts +++ b/src/app/page/component/page-header/page-header.component.ts @@ -7,21 +7,25 @@ import { } from '@angular/core'; import { Observable, Subject } from 'rxjs'; import { takeUntil } from 'rxjs/operators'; -import { KgwTractComplexTypePageHeader } from '../../model/xmlns/tract/tract-ct-page-header'; import { PageService } from '../../service/page-service.service'; +import { + Header, + parseTextAddBrTags +} from 'src/app/services/xml-parser-service/xmp-parser.service'; @Component({ - selector: 'app-page-header', + selector: 'app-page-new-header', templateUrl: './page-header.component.html', styleUrls: ['./page-header.component.css'] }) export class PageHeaderComponent implements OnChanges { - @Input() header: KgwTractComplexTypePageHeader; + @Input() header: Header; private _unsubscribeAll: Subject; ready: boolean; headerText: string; + headerNumber: number | null; dir$: Observable; changeHeader$: Observable; isForm$: Observable; @@ -46,6 +50,7 @@ export class PageHeaderComponent implements OnChanges { ) { this.ready = false; this.headerText = ''; + this.headerNumber = null; this.init(); } } @@ -55,14 +60,9 @@ export class PageHeaderComponent implements OnChanges { } private init(): void { - if ( - this.header && - this.header.title && - this.header.title.text && - this.header.title.text.value - ) { - this.headerText = this.header.title.text.value; - } + const { title, number } = this.header; + this.headerText = parseTextAddBrTags(title?.text) || ''; + this.headerNumber = number?.text ? Number(number.text) : null; this.changeHeader$ .pipe(takeUntil(this._unsubscribeAll)) diff --git a/src/app/page/component/page-hero/page-hero.component.css b/src/app/page/component/page-hero/page-hero.component.css index 7118e661..66c4b91b 100644 --- a/src/app/page/component/page-hero/page-hero.component.css +++ b/src/app/page/component/page-hero/page-hero.component.css @@ -1,5 +1,9 @@ :host { width: 100%; display: block; - padding-top: 48px; } + + +app-content-new-repeater { + margin-top: 0; +} \ No newline at end of file diff --git a/src/app/page/component/page-hero/page-hero.component.html b/src/app/page/component/page-hero/page-hero.component.html index b832693d..8d0de762 100644 --- a/src/app/page/component/page-hero/page-hero.component.html +++ b/src/app/page/component/page-hero/page-hero.component.html @@ -1,4 +1,4 @@ - +

- - - - - - - - - - - - - - - - - + + diff --git a/src/app/new-page/component/page-hero/page-hero.component.spec.ts b/src/app/page/component/page-hero/page-hero.component.spec.ts similarity index 84% rename from src/app/new-page/component/page-hero/page-hero.component.spec.ts rename to src/app/page/component/page-hero/page-hero.component.spec.ts index ae77b984..4a8398f5 100644 --- a/src/app/new-page/component/page-hero/page-hero.component.spec.ts +++ b/src/app/page/component/page-hero/page-hero.component.spec.ts @@ -2,21 +2,21 @@ import { SimpleChange } from '@angular/core'; import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; import { PageService } from '../../service/page-service.service'; import { mockHero } from '../../../_tests/mocks'; -import { PageHeroNewComponent } from './page-hero.component'; +import { PageHeroComponent } from './page-hero.component'; describe('pageHeaderComponent', () => { - let component: PageHeroNewComponent; - let fixture: ComponentFixture; + let component: PageHeroComponent; + let fixture: ComponentFixture; let pageService: PageService; const hero = mockHero('How jesus can \nchange your life.'); beforeEach(waitForAsync(() => { pageService = new PageService(); TestBed.configureTestingModule({ - declarations: [PageHeroNewComponent], + declarations: [PageHeroComponent], providers: [{ provide: PageService, useValue: pageService }] }).compileComponents(); - fixture = TestBed.createComponent(PageHeroNewComponent); + fixture = TestBed.createComponent(PageHeroComponent); component = fixture.componentInstance; fixture.detectChanges(); })); diff --git a/src/app/page/component/page-hero/page-hero.component.ts b/src/app/page/component/page-hero/page-hero.component.ts index a08e25f8..56fe8232 100644 --- a/src/app/page/component/page-hero/page-hero.component.ts +++ b/src/app/page/component/page-hero/page-hero.component.ts @@ -8,27 +8,27 @@ import { } from '@angular/core'; import { Observable, Subject } from 'rxjs'; import { takeUntil } from 'rxjs/operators'; -import { KgwContentComplexTypeForm } from '../../model/xmlns/content/content-ct-form'; -import { KgwContentComplexTypeParagraph } from '../../model/xmlns/content/content-ct-paragraph'; -import { KgwContentComplexTypeTextchild } from '../../model/xmlns/content/content-ct-text-child'; -import { KgwContentElementItem } from '../../model/xmlns/content/content-element'; -import { KgwTractComplexTypePageHero } from '../../model/xmlns/tract/tract-ct-page-hero'; import { PageService } from '../../service/page-service.service'; - +import { + Text, + Hero, + parseTextAddBrTags, + Content +} from 'src/app/services/xml-parser-service/xmp-parser.service'; @Component({ - selector: 'app-page-hero', + selector: 'app-page-new-hero', templateUrl: './page-hero.component.html', styleUrls: ['./page-hero.component.css'] }) export class PageHeroComponent implements OnDestroy, OnChanges { - @Input() hero: KgwTractComplexTypePageHero; + @Input() hero: Hero; private _unsubscribeAll: Subject; ready: boolean; - heading: KgwContentComplexTypeTextchild; + heading: Text; headingText: string; - content: Array; + content: Array; dir$: Observable; isForm$: Observable; isFirstPage$: Observable; @@ -69,38 +69,9 @@ export class PageHeroComponent implements OnDestroy, OnChanges { } private init(): void { - if (this.hero.heading) { - this.heading = this.hero.heading; - this.headingText = - this.heading.text && this.heading.text.value - ? this.heading.text.value.trim() - : ''; - } - if (this.hero.content && this.hero.content.length) { - this.hero.content.forEach((contentChild) => { - if (contentChild.contentType === 'paragraph') { - const tParagraph: KgwContentComplexTypeParagraph = - contentChild as KgwContentComplexTypeParagraph; - if ( - !this.pageService.isRestricted(tParagraph.attributes.restrictTo) - ) { - const tItemToAdd: KgwContentElementItem = { - type: 'paragraph', - element: tParagraph - }; - this.content.push(tItemToAdd); - } - } else if (contentChild.contentType === 'form') { - const tForm: KgwContentComplexTypeForm = - contentChild as KgwContentComplexTypeForm; - const tItemToAdd: KgwContentElementItem = { - type: 'form', - element: tForm - }; - this.content.push(tItemToAdd); - } - }); - } + this.heading = this.hero?.heading; + this.headingText = parseTextAddBrTags(this.heading?.text); + this.content = this.hero.content; this.changeHeader$ .pipe(takeUntil(this._unsubscribeAll)) diff --git a/src/app/page/component/tract-page/tract-page.component.css b/src/app/page/component/tract-page/tract-page.component.css index d373b7ef..ee64582b 100644 --- a/src/app/page/component/tract-page/tract-page.component.css +++ b/src/app/page/component/tract-page/tract-page.component.css @@ -1,4 +1,4 @@ -app-tract-page { +app-tract-new-page { width: 100%; display: block; } @@ -72,7 +72,6 @@ app-tract-page { padding-bottom: 25px; color: white; background-color: var(--kg-blue); - margin-bottom: -24px; } .stepHeading h1 { @@ -91,11 +90,11 @@ app-tract-page { margin-left: 12px; } -#toolContent.hasPageHeader > app-page-hero > .stepHeading { +#toolContent.hasPageHeader > app-page-new-hero > .stepHeading { padding: 0; } -#toolContent.hasPageHeader > app-page-hero > .stepHeading > h1 { +#toolContent.hasPageHeader > app-page-new-hero > .stepHeading > h1 { display: none; } @@ -253,24 +252,21 @@ div.cardContent:not(.hasHading) { margin-top: 48px !important; } + +app-content-new-repeater > app-content-new-text { + margin-top: 24px +} @media screen and (min-width: 616px) { - div.cardContent.hasHeading app-content-text > p.textContent, - div.tabContent app-content-text > p.textContent { + div.cardContent.hasHeading app-content-new-text > p.textContent, + div.tabContent app-content-new-text > p.textContent { padding-left: 44px; padding-right: 44px; } - .modal-paragraph > app-content-text > p.textContent { + .modal-paragraph > app-content-new-text > p.textContent { padding-left: 44px; padding-right: 44px; } } -app-page-hero > app-content-paragraph:first-child > app-content-image:first-child { - margin-top: -48px; -} - -div#toolContent > app-page-hero:first-child { - padding-top: 0px !important; -} diff --git a/src/app/page/component/tract-page/tract-page.component.html b/src/app/page/component/tract-page/tract-page.component.html index 5f8dc627..7701d447 100644 --- a/src/app/page/component/tract-page/tract-page.component.html +++ b/src/app/page/component/tract-page/tract-page.component.html @@ -8,67 +8,72 @@ hasPageHeader: hasPageHeader }" > - - + - - + + + > - + > - +
- - + - - + + - - + + - - +
- +
- - +
diff --git a/src/app/page/page.component.spec.ts b/src/app/page/page.component.spec.ts index 57851b8b..a5622b4a 100644 --- a/src/app/page/page.component.spec.ts +++ b/src/app/page/page.component.spec.ts @@ -1,30 +1,248 @@ import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; import { HttpClientModule } from '@angular/common/http'; import { RouterTestingModule } from '@angular/router/testing'; +import { Router } from '@angular/router'; import { LoaderService } from '../services/loader-service/loader.service'; import { PageComponent } from './page.component'; import { CommonService } from '../services/common.service'; import { PageService } from './service/page-service.service'; +import { mockTractPage, mockPageComponent } from '../_tests/mocks'; describe('PageComponent', () => { - let component: PageComponent; + let component: any; let fixture: ComponentFixture; + let pageService: PageService; + let router: Router; + const bookid = 'fourlaws', + langid = 'en', + pageid = 0; + const tractPage = mockTractPage( + false, + '2', + 'headerText', + 'heroText', + 'callToActionText', + 'cardLabel', + 'modalTitle', + 1 + ); + const tractPageOne = mockTractPage( + false, + '2', + 'headerText', + 'heroText', + 'callToActionText', + 'cardLabel', + 'modalTitle', + 0 + ); beforeEach(waitForAsync(() => { + pageService = new PageService(); TestBed.configureTestingModule({ declarations: [PageComponent], imports: [HttpClientModule, RouterTestingModule], - providers: [LoaderService, CommonService, PageService] + providers: [ + CommonService, + LoaderService, + { provide: PageService, useValue: pageService } + ] }).compileComponents(); })); beforeEach(() => { fixture = TestBed.createComponent(PageComponent); + router = TestBed.get(Router); component = fixture.componentInstance; fixture.detectChanges(); + spyOn(router, 'navigate'); + + component._pageParams = { + langid, + bookid, + pageid + }; + component._pageBookSubPagesManifest = [0, 1, 2, 3, 4, 5, 6]; + component._pageBookIndex = mockPageComponent.pageBookIndex; + component._pageBookTranslations = mockPageComponent.pageBookTranslations; + component._allLanguages = [ + mockPageComponent.languageEnglish, + mockPageComponent.languageGerman + ]; + component._books = mockPageComponent.books; }); - it('should create', () => { + it('Create component', () => { expect(component).toBeTruthy(); }); + + it('selectLanguage()', () => { + component.selectLanguage({ attributes: { code: 'de' } }); + expect(router.navigate).toHaveBeenCalledWith(['de', bookid, pageid]); + }); + + it('onToggleLanaguageSelect()', () => { + component.languagesVisible = false; + component.onToggleLanaguageSelect(); + expect(component.languagesVisible).toBeTrue(); + }); + + it('onToggleLanaguageSelect()', () => { + component.languagesVisible = false; + component.onToggleLanaguageSelect(); + expect(component.languagesVisible).toBeTrue(); + }); + + it('onPreviousPage() on page 0', () => { + component.onPreviousPage(); + expect(router.navigate).toHaveBeenCalledTimes(0); + }); + it('onPreviousPage() on page > 0', () => { + component._pageParams = { + langid, + bookid, + pageid: 5 + }; + component.onPreviousPage(); + expect(router.navigate).toHaveBeenCalledWith([langid, bookid, 4]); + }); + + it('onNextPage() on page 0', () => { + component.onNextPage(); + expect(router.navigate).toHaveBeenCalledWith([langid, bookid, 1]); + }); + it('onNextPage() on final page', () => { + component._pageParams = { + langid, + bookid, + pageid: 6 + }; + component.onNextPage(); + expect(router.navigate).toHaveBeenCalledTimes(0); + }); + + it('getImage()', async () => { + await component.getImage('file-name-2.png'); + expect(pageService.getAllImages()['file-name-2.png']).toEqual( + 'https://cru.org/assets/file-name-2.png' + ); + }); + + it('getImage() resource not downloaded', async () => { + spyOn(pageService, 'getAllImages'); + await component.getImage('file-name-3.png'); + expect(pageService.getAllImages).toHaveBeenCalledTimes(0); + }); + + it('loadBookPage() - wrong page', async () => { + component.loadBookPage(tractPage); + const showPageSpy = spyOn(component, 'showPage'); + expect(showPageSpy).toHaveBeenCalledTimes(0); + }); + + it('loadBookPage() - correct page', async () => { + const showPageSpy = spyOn(component, 'showPage'); + component.loadBookPage(tractPageOne); + expect(showPageSpy).toHaveBeenCalledTimes(1); + }); + + it('getAvailableLanguagesForSelectedBook() no languages downloaded', () => { + component._allLanguages = []; + expect(component.availableLanguages).toEqual([]); + component.getAvailableLanguagesForSelectedBook(); + expect(component.availableLanguages).toEqual([]); + }); + + it('getAvailableLanguagesForSelectedBook()', () => { + expect(component.availableLanguages).toEqual([]); + component.getAvailableLanguagesForSelectedBook(); + expect(component.availableLanguages.length).toEqual(1); + }); + + it('loadPageBook()', () => { + const loadPageBookIndexSpy = spyOn(component, 'loadPageBookIndex'); + component.loadPageBook(); + expect(component._pageBookLoaded).toBeTrue(); + expect(loadPageBookIndexSpy).toHaveBeenCalledTimes(1); + }); + + it('loadPageBook() - page does not exist', () => { + const loadPageBookIndexSpy = spyOn(component, 'loadPageBookIndex'); + component._pageParams.bookid = 'connectingwithgod'; + component.loadPageBook(); + expect(component._pageBookLoaded).toBeFalse(); + expect(loadPageBookIndexSpy).toHaveBeenCalledTimes(0); + }); + + it('setSelectedLanguage()', () => { + spyOn(pageService, 'setDir'); + component.setSelectedLanguage(); + expect(component._selectedLanguage).toEqual( + mockPageComponent.languageEnglish + ); + expect(component.selectedLang).toEqual( + mockPageComponent.languageEnglish.attributes.name + ); + expect(pageService.setDir).toHaveBeenCalledWith( + mockPageComponent.languageEnglish.attributes.direction + ); + }); + + it('checkIfPreSelectedLanguageExists() - True', () => { + component._selectedLanguage = mockPageComponent.languageEnglish; + const preSelected = component.checkIfPreSelectedLanguageExists(); + expect(preSelected).toEqual('4'); + }); + + it('checkIfPreSelectedLanguageExists() - False', () => { + const preSelected = component.checkIfPreSelectedLanguageExists(); + expect(preSelected).toBeFalse(); + }); + + it('clearData()', () => { + component._booksLoaded = true; + component._pageBookLoaded = true; + component._pageBookMainfestLoaded = true; + component._pageBookMainfest = { test: true }; + component._pageBookTranslationId = 10; + component.availableLanguages = [{ lang: 'en' }]; + component.selectedBookName = 'Four Laws'; + component.languagesVisible = true; + component.activePage = 3; + component.activePageOrder = 3; + component.totalPages = 5; + component.bookNotAvailableInLanguage = true; + component.bookNotAvailable = true; + component.clearData(); + expect(component._booksLoaded).toEqual(false); + expect(component._books).toEqual([]); + expect(component._pageBookLoaded).toEqual(false); + expect(component._pageBook).toEqual({}); + expect(component._pageBookIndex).toEqual({}); + expect(component._pageBookMainfestLoaded).toEqual(false); + expect(component._pageBookMainfest).toEqual({}); + expect(component._pageBookTranslations).toEqual([]); + expect(component._pageBookTranslationId).toEqual(0); + expect(component._pageBookSubPagesManifest).toEqual([]); + expect(component._pageBookSubPages).toEqual([]); + expect(component.availableLanguages).toEqual([]); + expect(component.selectedBookName).toEqual(''); + expect(component.languagesVisible).toEqual(false); + expect(component.activePage).toEqual(null); + expect(component.activePageOrder).toEqual(0); + expect(component.totalPages).toEqual(0); + expect(component.bookNotAvailableInLanguage).toEqual(false); + expect(component.bookNotAvailable).toEqual(false); + }); + + it('showPage()', () => { + const awaitPageNavigationSpy = spyOn(component, 'awaitPageNavigation'); + component.showPage(tractPage); + expect(component.activePageOrder).toBe(tractPage.position); + expect(component.activePage).toBe(tractPage); + expect(awaitPageNavigationSpy).toHaveBeenCalled(); + setTimeout(() => { + expect(component.pagesLoaded).toBe(true); + }, 0); + }); }); diff --git a/src/app/page/page.component.ts b/src/app/page/page.component.ts index 25d474c9..acd5e00a 100644 --- a/src/app/page/page.component.ts +++ b/src/app/page/page.component.ts @@ -7,20 +7,24 @@ import { } from '@angular/core'; import { ActivatedRoute, Router } from '@angular/router'; import { Subject } from 'rxjs'; +import { delay, filter, takeUntil } from 'rxjs/operators'; import { ViewportScroller } from '@angular/common'; import * as ActionCable from '@rails/actioncable'; -import { delay, filter, takeUntil } from 'rxjs/operators'; import { CommonService } from '../services/common.service'; import { LoaderService } from '../services/loader-service/loader.service'; import { IPageParameters } from './model/page-parameters'; -import { APIURL, MOBILE_CONTENT_API_WS_URL } from '../api/url'; -import { KgwManifest } from './model/xmlns/manifest/manifest-manifest'; -import { KgwTract } from './model/xmlns/tract/tract-tract'; -import { KgwManifestComplexTypePage } from './model/xmlns/manifest/manifest-ct-page'; -import { KgwTractComplexTypePage } from './model/xmlns/tract/tract-ct-page'; +import { APIURL } from '../api/url'; +import { environment } from './../../environments/environment'; import { PageService } from './service/page-service.service'; -import { KgwManifestComplexTypeTip } from './model/xmlns/manifest/manifest-ct-tip'; -import { KgwTraining } from './model/xmlns/training/training-training'; +import { + PullParserFactory, + Page, + Manifest, + TractPage, + XmlParser, + XmlParserData, + Animation +} from '../services/xml-parser-service/xmp-parser.service'; interface LiveShareSubscriptionPayload { data?: { @@ -36,7 +40,7 @@ interface LiveShareSubscriptionPayload { } @Component({ - selector: 'app-page', + selector: 'app-page-new', templateUrl: './page.component.html', styleUrls: ['./page.component.css'], encapsulation: ViewEncapsulation.None @@ -46,20 +50,18 @@ export class PageComponent implements OnInit, OnDestroy { private _pageChanged = new Subject(); private _pageParams: IPageParameters; private _allLanguagesLoaded: boolean; - private _allLanguages: Array; + private _allLanguages: any[]; private _booksLoaded: boolean; - private _books: Array; + private _books: any[]; private _pageBookLoaded: boolean; private _pageBook: any; private _pageBookIndex: any; - private _pageBookMainfest: KgwManifest; + private _pageBookMainfest: Manifest; private _pageBookMainfestLoaded: boolean; - private _pageBookTranslations: Array; + private _pageBookTranslations: any[]; private _pageBookTranslationId: number; - private _pageBookSubPagesManifest: Array; - private _pageBookTipsManifest: Array; - private _pageBookSubPages: Array; - private _pageBookTips: Array; + private _pageBookSubPagesManifest: Page[]; + private _pageBookSubPages: Page[]; private _selectedLanguage: any; private liveShareSubscription: ActionCable.Channel; @@ -68,7 +70,7 @@ export class PageComponent implements OnInit, OnDestroy { availableLanguages: Array; languagesVisible: boolean; selectedBookName: string; - activePage: KgwTractComplexTypePage; + activePage: any; activePageOrder: number; totalPages: number; bookNotAvailableInLanguage: boolean; @@ -80,7 +82,8 @@ export class PageComponent implements OnInit, OnDestroy { private pageService: PageService, private route: ActivatedRoute, public router: Router, - private viewportScroller: ViewportScroller + private viewportScroller: ViewportScroller, + private pullParserFactory: PullParserFactory ) { this._pageParams = { langid: '', @@ -116,9 +119,8 @@ export class PageComponent implements OnInit, OnDestroy { } selectLanguage(lang): void { - const tPageOrder = this._pageParams.pageid ? this._pageParams.pageid : 0; + const tPageOrder = this._pageParams.pageid || 0; this.router.navigate([ - 'old', lang.attributes.code, this._pageParams.bookid, tPageOrder @@ -133,7 +135,6 @@ export class PageComponent implements OnInit, OnDestroy { private onPreviousPage(): void { if (this._pageParams.pageid > 0) { this.router.navigate([ - 'old', this._pageParams.langid, this._pageParams.bookid, this._pageParams.pageid - 1 @@ -144,7 +145,6 @@ export class PageComponent implements OnInit, OnDestroy { private onNextPage(): void { if (this._pageParams.pageid + 1 < this._pageBookSubPagesManifest.length) { this.router.navigate([ - 'old', this._pageParams.langid, this._pageParams.bookid, this._pageParams.pageid + 1 @@ -214,92 +214,18 @@ export class PageComponent implements OnInit, OnDestroy { } } - private loadBookPage( - page: KgwManifestComplexTypePage, - pageorder: number - ): void { - this.commonService - .downloadFile( - APIURL.GET_XML_FILES_FOR_MANIFEST + - this._pageBookTranslationId + - '/' + - page.src - ) - .subscribe((data: any) => { - const enc = new TextDecoder('utf-8'); - const arr = new Uint8Array(data); - const result = enc.decode(arr); - - const parser = new DOMParser(); - const xml = parser.parseFromString(result, 'application/xml'); - - const _tTract: KgwTract = new KgwTract(result); - _tTract.pagename = page.filename; - _tTract.pageorder = pageorder; - _tTract.parseXml(); - if (_tTract && _tTract.page) { - const _tTractResources = _tTract.getResources(); - const _tTractImages = _tTractResources['images']; - const _tTractAnimations = _tTractResources['animations']; - if (_tTractImages && _tTractImages.length) { - _tTractImages.forEach((image) => { - this.getImage(image); - }); - } - - if (_tTractAnimations && _tTractAnimations.length) { - _tTractAnimations.forEach((animation) => { - this.getAnimation(animation); - }); - } - - this._pageBookSubPages.push(_tTract); - - if ( - (this._pageParams.pageid && - pageorder === this._pageParams.pageid) || - (!this._pageParams.pageid && pageorder === 0) - ) { - this.showPage(_tTract); - } - } - }); - } - - private loadTip(tip: KgwManifestComplexTypeTip): void { - this.commonService - .downloadFile( - APIURL.GET_XML_FILES_FOR_MANIFEST + - this._pageBookTranslationId + - '/' + - tip.src - ) - .pipe(takeUntil(this._unsubscribeAll), takeUntil(this._pageChanged)) - .subscribe((data) => { - const enc = new TextDecoder('utf-8'); - const arr = new Uint8Array(data); - const result = enc.decode(arr); - - const parser = new DOMParser(); - const xml = parser.parseFromString(result, 'application/xml'); - const _tTraining: KgwTraining = new KgwTraining(result); - _tTraining.id = tip.id; - _tTraining.parseXml(); - if (_tTraining && _tTraining.pages && _tTraining.pages.length) { - const _tTrainingImages = _tTraining.getImageResources(); - if (_tTrainingImages && _tTrainingImages.length) { - _tTrainingImages.forEach((image) => { - this.getImage(image); - }); - } - } - this._pageBookTips.push(_tTraining); - }); + private loadBookPage(page: TractPage): void { + const pageId = this._pageParams.pageid; + const showpage: boolean = pageId + ? page.position === pageId + : page.position === 0; + if (showpage) this.showPage(page); } private loadBookManifestXML(): void { this.pageService.clear(); let item: any = {}; + this.pullParserFactory.clearOrigin(); this._pageBookTranslations.forEach((translation) => { if ( translation && @@ -323,73 +249,80 @@ export class PageComponent implements OnInit, OnDestroy { ) { const manifestName = item.attributes['manifest-name']; const translationid = item.id; - this.commonService - .downloadFile( - APIURL.GET_XML_FILES_FOR_MANIFEST + translationid + '/' + manifestName - ) - .pipe(takeUntil(this._unsubscribeAll), takeUntil(this._pageChanged)) - .subscribe((data) => { - const enc = new TextDecoder('utf-8'); - const arr = new Uint8Array(data); - const result = enc.decode(arr); - this._pageBookMainfest = new KgwManifest(result); - this._pageBookMainfest.parseXml(); - this._pageBookTranslationId = translationid; + const fileName = environment.production + ? APIURL.GET_XML_FILES_FOR_MANIFEST + translationid + '/' + manifestName + : APIURL.GET_XML_FILES_FOR_MANIFEST + manifestName; + this.pullParserFactory.setOrigin(fileName); + const config = XmlParser.ParserConfig.createParserConfig() + .withLegacyWebImageResources(true) + .withSupportedFeatures([ + XmlParser.ParserConfig.Companion.FEATURE_ANIMATION, + XmlParser.ParserConfig.Companion.FEATURE_MULTISELECT, + XmlParser.ParserConfig.Companion.FEATURE_FLOW, + XmlParser.ParserConfig.Companion.FEATURE_CONTENT_CARD + ]) + .withParseTips(false); + const newParser = new XmlParser.ManifestParser( + this.pullParserFactory, + config + ); + const controller = new AbortController(); + const signal = controller.signal; + try { + newParser.parseManifest(fileName, signal).then((data) => { + const { manifest } = data as XmlParserData; + this._pageBookMainfest = manifest; + + // Loop through and get all resources. + this._pageBookIndex.included.forEach((resource) => { + const { attributes, type } = resource; + if (type === 'attachment') { + this.pageService.addAttachment( + attributes['file-file-name'], + attributes.file + ); + if ( + /\.(gif|jpe?g|tiff?|png|webp|svg|bmp)$/i.test( + attributes['file-file-name'] + ) + ) { + this.getImage(attributes['file-file-name']); + } else { + this.getAnimation(attributes['file-file-name']); + } + } + }); - if ( - this._pageBookMainfest.manifest && - this._pageBookMainfest.manifest.pages && - this._pageBookMainfest.manifest.pages.length > 0 - ) { - this._pageBookSubPagesManifest = []; - this._pageBookSubPages = []; - let tPageOrder = 0; - this._pageBookMainfest.manifest.pages.forEach((tPage) => { - this._pageBookSubPagesManifest.push(tPage); - this.loadBookPage(tPage, tPageOrder); - tPageOrder++; - }); - this.totalPages = this._pageBookSubPagesManifest.length; + if (manifest?.pages?.length) { + this._pageBookSubPagesManifest = manifest.pages; + this._pageBookSubPages = manifest.pages; + this.totalPages = manifest.pages.length; this._pageBookMainfestLoaded = true; + manifest.pages.forEach((page) => { + this.loadBookPage(page as TractPage); + }); } else { this.pageService.setDir('ltr'); this.bookNotAvailableInLanguage = true; } - - if ( - this._pageBookMainfest.manifest && - this._pageBookMainfest.manifest.tips && - this._pageBookMainfest.manifest.tips.length > 0 - ) { - this._pageBookTipsManifest = []; - this._pageBookTips = []; - this._pageBookMainfest.manifest.tips.forEach((tTip) => { - this._pageBookTipsManifest.push(tTip); - // You can enable tips to be loaded by uncommenting the following line - // this.loadTip(tTip); - }); - } }); + } catch (e) { + console.error('Manifest Parse error', e); + } } } private getAvailableLanguagesForSelectedBook(): void { this.availableLanguages = []; if (this._allLanguages && this._allLanguages.length > 0) { - this._allLanguages.forEach((languageItem) => { - if ( - languageItem.relationships && - languageItem.relationships.translations && - languageItem.relationships.translations.data - ) { - const languageTranslations = - languageItem.relationships.translations.data; + this._allLanguages.forEach((lang) => { + const translations = lang.relationships?.translations?.data || null; + if (translations) { let isLanguageForSelectedBook = false; - - languageTranslations.forEach((languageTranslation) => { + translations.forEach((translation) => { this._pageBookTranslations.forEach((pageBookTranslation) => { - if (languageTranslation.id === pageBookTranslation.id) { + if (translation.id === pageBookTranslation.id) { isLanguageForSelectedBook = true; return; } @@ -400,7 +333,7 @@ export class PageComponent implements OnInit, OnDestroy { }); if (isLanguageForSelectedBook) { - this.availableLanguages.push(languageItem); + this.availableLanguages.push(lang); } } }); @@ -489,13 +422,10 @@ export class PageComponent implements OnInit, OnDestroy { } private loadPageBook(): void { - this._pageBook = {}; - - this._books.forEach((x) => { - if (x.attributes.abbreviation === this._pageParams.bookid) { - this._pageBook = x; - } - }); + this._pageBook = + this._books.find((book) => + book.attributes.abbreviation === this._pageParams.bookid ? book : false + ) || {}; if (!this._pageBook.id) { this.pageService.setDir('ltr'); @@ -547,15 +477,11 @@ export class PageComponent implements OnInit, OnDestroy { private setSelectedLanguage(): void { this._allLanguages.forEach((lang) => { - if ( - lang && - lang.attributes && - lang.attributes['code'] && - lang.attributes['code'] === this._pageParams.langid - ) { + const attributes = lang.attributes; + if (attributes?.code && attributes?.code === this._pageParams.langid) { this._selectedLanguage = lang; - this.selectedLang = lang.attributes.name; - this.pageService.setDir(lang.attributes.direction); + this.selectedLang = attributes.name; + this.pageService.setDir(attributes.direction); } }); } @@ -564,11 +490,8 @@ export class PageComponent implements OnInit, OnDestroy { if (this._selectedLanguage && this._selectedLanguage.id) { const y = this._pageBookTranslations.find((x) => { return ( - x.relationships && - x.relationships.language && - x.relationships.language.data && - x.relationships.language.data.id && - x.relationships.language.data.id === this._selectedLanguage.id + x?.relationships?.language?.data?.id && + x?.relationships?.language?.data?.id === this._selectedLanguage.id ); }); return y && y.id; @@ -594,10 +517,10 @@ export class PageComponent implements OnInit, OnDestroy { if (this._pageBookMainfestLoaded) { if (this._pageBookSubPages && this._pageBookSubPages.length) { const index = this._pageBookSubPages.findIndex( - (sPage) => sPage.pageorder === this._pageParams.pageid + (sPage) => sPage.position === this._pageParams.pageid ); if (index >= 0) { - const tTract = this._pageBookSubPages[index]; + const tTract = this._pageBookSubPages[index] as TractPage; this.showPage(tTract); return; } @@ -607,12 +530,13 @@ export class PageComponent implements OnInit, OnDestroy { this._pageBookSubPagesManifest && this._pageBookSubPagesManifest.length > this._pageParams.pageid ) { - const tSubPageManifest = - this._pageBookMainfest[this._pageParams.pageid]; + const tSubPageManifest = this._pageBookMainfest.pages[ + this._pageParams.pageid + ] as TractPage; if (tSubPageManifest) { this.pagesLoaded = false; this.loaderService.display(true); - this.loadBookPage(tSubPageManifest, this.activePageOrder); + this.loadBookPage(tSubPageManifest); return; } } @@ -629,12 +553,9 @@ export class PageComponent implements OnInit, OnDestroy { this.route.params .pipe(takeUntil(this._unsubscribeAll)) .subscribe((params) => { - let bookChanged = false; - if (this._pageParams.langid !== params['langid']) { - bookChanged = true; - } else if (this._pageParams.bookid !== params['bookid']) { - bookChanged = true; - } + const { langid, bookid } = this._pageParams; + const bookChanged = + langid !== params['langid'] || bookid !== params['bookid']; if (!bookChanged) { this._pageParams.pageid = Number(params['page']); @@ -707,7 +628,7 @@ export class PageComponent implements OnInit, OnDestroy { this._pageBook = {}; this._pageBookIndex = {}; this._pageBookMainfestLoaded = false; - this._pageBookMainfest = new KgwManifest(''); + this._pageBookMainfest = {} as Manifest; this._pageBookTranslations = []; this._pageBookTranslationId = 0; this._pageBookSubPagesManifest = []; @@ -722,9 +643,9 @@ export class PageComponent implements OnInit, OnDestroy { this.bookNotAvailable = false; } - private showPage(page: KgwTract): void { - this.activePageOrder = page.pageorder; - this.activePage = page.page; + private showPage(page: TractPage): void { + this.activePageOrder = page.position; + this.activePage = page; this.awaitPageNavigation(); this.viewportScroller.scrollToPosition([0, 0]); setTimeout(() => { @@ -737,7 +658,7 @@ export class PageComponent implements OnInit, OnDestroy { const liveShareStreamId = this.route.snapshot.queryParams.liveShareStream; if (liveShareStreamId) { this.liveShareSubscription = ActionCable.createConsumer( - MOBILE_CONTENT_API_WS_URL + environment.mobileContentApiWsUrl ).subscriptions.create( { channel: 'SubscribeChannel', diff --git a/src/app/page/service/page-service.service.ts b/src/app/page/service/page-service.service.ts index b55bd144..52f50396 100644 --- a/src/app/page/service/page-service.service.ts +++ b/src/app/page/service/page-service.service.ts @@ -1,11 +1,6 @@ import { Injectable } from '@angular/core'; import { BehaviorSubject, Observable, Subject } from 'rxjs'; -import { KgwContentComplexTypeParagraph } from '../model/xmlns/content/content-ct-paragraph'; -import { KgwContentComplexTypeText } from '../model/xmlns/content/content-ct-text'; -import { KgwContentComplexTypeImage } from '../model/xmlns/content/content-ct-image'; -import { KgwContentComplexTypeVideo } from '../model/xmlns/content/content-ct-video'; -import { KgwContentComplexTypeButton } from '../model/xmlns/content/content-ct-button'; -import { KgwContentElementItem } from '../model/xmlns/content/content-element'; +import { XmlParser } from '../../services/xml-parser-service/xmp-parser.service'; @Injectable({ providedIn: 'root' @@ -26,6 +21,8 @@ export class PageService { private _isModal = new BehaviorSubject(false); private _imageUrlsDict = new BehaviorSubject([]); private _animationUrlsDict = new BehaviorSubject([]); + private _allAttachmentResources = new Map(); + private XmlParserState = XmlParser.State.createState(); formAction$: Observable = this._formAction.asObservable(); contentEvent$: Observable = this._formAction.asObservable(); @@ -52,6 +49,16 @@ export class PageService { this.clearAnimationsDict(); } + addAttachment(pImageName: string, pImageUrl: string): void { + const tImages = this._allAttachmentResources.get(pImageName); + if (!tImages) this._allAttachmentResources.set(pImageName, pImageUrl); + } + + findAttachment(pImageName: string): string { + const tImages = this._allAttachmentResources.get(pImageName); + return tImages || ''; + } + nextPage(): void { this._nextPage.next(); } @@ -130,6 +137,9 @@ export class PageService { } return pImageName; } + getAllImages() { + return this._imageUrlsDict.getValue(); + } clearAnimationsDict(): void { this._animationUrlsDict.next([]); @@ -155,139 +165,10 @@ export class PageService { return true; } } - return false; } - checkContentElements( - pItems: KgwContentElementItem[] - ): KgwContentElementItem[] { - if (!pItems || !pItems.length) { - return []; - } - - const items: KgwContentElementItem[] = []; - pItems.forEach((item) => { - switch (item.type) { - case 'paragraph': - const tParagraph: KgwContentComplexTypeParagraph = - item.element as KgwContentComplexTypeParagraph; - if (tParagraph) { - if (!this.isRestricted(tParagraph.attributes.restrictTo)) { - items.push(item); - } - } - break; - case 'text': - const tText: KgwContentComplexTypeText = - item.element as KgwContentComplexTypeText; - if (tText) { - if (!this.isRestricted(tText.attributes.restrictTo)) { - items.push(item); - } - } - break; - case 'image': - const tImage: KgwContentComplexTypeImage = - item.element as KgwContentComplexTypeImage; - if (tImage) { - if (!this.isRestricted(tImage.attributes.restrictTo)) { - items.push(item); - } - } - break; - case 'video': - const tVideo: KgwContentComplexTypeVideo = - item.element as KgwContentComplexTypeVideo; - if (tVideo) { - if (!this.isRestricted(tVideo.attributes.restrictTo)) { - items.push(item); - } - } - break; - case 'button': - const tButton: KgwContentComplexTypeButton = - item.element as KgwContentComplexTypeButton; - if (tButton) { - if (!this.isRestricted(tButton.attributes.restrictTo)) { - items.push(item); - } - } - break; - default: - items.push(item); - break; - } - }); - - return items; - } - - getFirstSupportedContentElement( - pItems: KgwContentElementItem[] - ): KgwContentElementItem { - if (!pItems || !pItems.length) { - return null; - } - - let pReturnItem = null; - - pItems.forEach((item) => { - if (pReturnItem === null) { - switch (item.type) { - // Supported content element types - case 'paragraph': - case 'tabs': - case 'text': - case 'image': - case 'animation': - case 'link': - case 'form': - case 'input': - case 'fallback': - const tItems = this.checkContentElements([item]); - if (tItems.length === 1) { - pReturnItem = item; - return; - } - break; - // Button supported only when type is event or url - case 'button': - const tbItems = this.checkContentElements([item]); - if (tbItems.length === 1) { - const tButton: KgwContentComplexTypeButton = - item.element as KgwContentComplexTypeButton; - if ( - tButton.attributes.type && - (tButton.attributes.type === 'url' || - tButton.attributes.type === 'event') - ) { - pReturnItem = item; - return; - } - } - break; - // Video supported only when provider is YouTube - case 'video': - const tvItems = this.checkContentElements([item]); - if (tvItems.length === 1) { - const tVideo: KgwContentComplexTypeVideo = - item.element as KgwContentComplexTypeVideo; - if ( - tVideo.attributes.provider && - tVideo.attributes.provider === 'youtube' - ) { - pReturnItem = item; - return; - } - } - break; - default: - break; - } - } - }); - - return pReturnItem; + parserState(): any { + return this.XmlParserState; } } From 2e1b08829e48fe56e72eff4e41a8ebfd602d5202 Mon Sep 17 00:00:00 2001 From: Daniel Bisgrove Date: Fri, 15 Dec 2023 11:48:19 -0500 Subject: [PATCH 4/4] Removing update-development and only using one workflow file. Fixing some errors with branch names. --- .github/workflows/update-development.yml | 20 -------------------- .github/workflows/update-staging.yml | 4 ++-- 2 files changed, 2 insertions(+), 22 deletions(-) delete mode 100644 .github/workflows/update-development.yml diff --git a/.github/workflows/update-development.yml b/.github/workflows/update-development.yml deleted file mode 100644 index 732b2cfa..00000000 --- a/.github/workflows/update-development.yml +++ /dev/null @@ -1,20 +0,0 @@ -name: Update development -on: - push: - branches: - - master - pull_request: - types: [labeled, synchronize] - -jobs: - update-development: - runs-on: ubuntu-latest - if: github.ref == 'refs/heads/main' || contains(github.event.pull_request.labels.*.name, 'On Development') - steps: - - uses: actions/checkout@v3 - - name: 🖇️ Merge current branch into development - uses: devmasx/merge-branch@1.4.0 - with: - type: now - target_branch: 'development' - github_token: ${{ github.token }} diff --git a/.github/workflows/update-staging.yml b/.github/workflows/update-staging.yml index fb180730..f1dcded4 100644 --- a/.github/workflows/update-staging.yml +++ b/.github/workflows/update-staging.yml @@ -9,7 +9,7 @@ on: jobs: update-staging: runs-on: ubuntu-latest - if: github.ref == 'refs/heads/main' || contains(github.event.pull_request.labels.*.name, 'On Staging') + if: github.ref == 'refs/heads/master' || contains(github.event.pull_request.labels.*.name, 'On Staging') steps: - uses: actions/checkout@v3 - name: 🖇️ Merge current branch into staging @@ -21,7 +21,7 @@ jobs: update-development: runs-on: ubuntu-latest - if: github.ref == 'refs/heads/main' || contains(github.event.pull_request.labels.*.name, 'On Development') + if: github.ref == 'refs/heads/master' || contains(github.event.pull_request.labels.*.name, 'On Staging') || contains(github.event.pull_request.labels.*.name, 'On Development') steps: - uses: actions/checkout@v3 - name: 🖇️ Merge current branch into development