Skip to content

Commit

Permalink
feat: extend ishServerHtml directive to handle links with callbacks, …
Browse files Browse the repository at this point in the history 
…e.g. to open dialogs (#8)
  • Loading branch information
@shauke
shauke committed Dec 13, 2019
1 parent 5d06a42 commit 08416f7
Show file tree
Hide file tree
Showing 7 changed files with 45 additions and 37 deletions.
18 changes: 14 additions & 4 deletions src/app/core/directives/server-html.directive.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,10 @@ import { LinkParser } from 'ish-core/utils/link-parser';
selector: '[ishServerHtml]',
})
export class ServerHtmlDirective implements AfterContentInit, AfterViewInit, OnDestroy, OnChanges {
@Input() callbacks: {
[key: string]: () => {};
};

private destroy$ = new Subject();
private icmBaseUrl: string;

Expand All @@ -46,7 +50,7 @@ export class ServerHtmlDirective implements AfterContentInit, AfterViewInit, OnD
}

ngOnChanges(changes: SimpleChanges): void {
if (!changes.ishServerHtml.firstChange) {
if (changes.ishServerHtml && !changes.ishServerHtml.firstChange) {
this.patchElements();
}
}
Expand Down Expand Up @@ -87,14 +91,20 @@ export class ServerHtmlDirective implements AfterContentInit, AfterViewInit, OnD
// anchors only
if (el.tagName === 'A') {
const href = el.getAttribute('href');
const cb = el.getAttribute('callback');

// apply default link handling for empty href, external links & target _blank
if (!href || href.startsWith('http') || el.getAttribute('target') === '_blank') {
if (!cb && (!href || href.startsWith('http') || el.getAttribute('target') === '_blank')) {
return;
}

// otherwise handle as routerLink
this.router.navigateByUrl(href);
if (cb && this.callbacks && typeof this.callbacks[cb] === 'function') {
this.callbacks[cb]();
} else {
// otherwise handle as routerLink
this.router.navigateByUrl(href);
}

event.preventDefault();
return false;
}
Expand Down
28 changes: 15 additions & 13 deletions src/app/pages/registration/components/registration-form/registration-form.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -59,25 +59,27 @@ <h2>
controlName="termsAndConditions"
[errorMessages]="{ pattern: 'registration.tac.error.tip' }"
>
<span>{{ 'registration.tac_privacy_policy.begin.text' | translate }} </span>
<ish-modal-dialog-link
linkText="registration.tac.link"
[options]="{ titleText: 'checkout.termsandconditions.details.title' | translate, size: 'lg' }"
>
<span
[ishServerHtml]="'registration.tac_privacy_policy.label' | translate"
[callbacks]="{
callbackTAC: showModalDialog(modalDialogTAC),
callbackPP: showModalDialog(modalDialogPP)
}"
></span>

<!-- modal terms and conditions -->
<ish-modal-dialog #modalDialogTAC [options]="{ size: 'lg' }">
<ish-content-include
includeId="systeminclude.dialog.termsAndConditions.pagelet2-Include"
></ish-content-include>
</ish-modal-dialog-link>
<span>{{ 'registration.tac_privacy_policy.between.text' | translate }} </span>
<ish-modal-dialog-link
linkText="registration.privacy_policy.link"
[options]="{ titleText: 'registration.privacy_policy.details.title' | translate, size: 'lg' }"
>
</ish-modal-dialog>

<!-- modal privacyPolicy -->
<ish-modal-dialog #modalDialogPP [options]="{ size: 'lg' }">
<ish-content-include
includeId="systeminclude.dialog.privacyPolicy.pagelet2-Include"
></ish-content-include>
</ish-modal-dialog-link>
<span>{{ 'registration.tac_privacy_policy.end.text' | translate }}</span>
</ish-modal-dialog>
</ish-checkbox>
</div>
</div>
Expand Down
6 changes: 4 additions & 2 deletions src/app/pages/registration/components/registration-form/registration-form.component.spec.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ import { TranslateModule } from '@ngx-translate/core';
import { MockComponent } from 'ng-mocks';
import { anything, instance, mock, spy, verify, when } from 'ts-mockito';

import { ServerHtmlDirective } from 'ish-core/directives/server-html.directive';
import { FeatureToggleModule } from 'ish-core/feature-toggle.module';
import { HttpError, HttpHeader } from 'ish-core/models/http-error/http-error.model';
import { configurationReducer } from 'ish-core/store/configuration/configuration.reducer';
Expand All @@ -13,7 +14,7 @@ import { AddressFormFactory } from 'ish-shared/address-forms/components/address-
import { AddressFormFactoryProvider } from 'ish-shared/address-forms/configurations/address-form-factory.provider';
import { AddressFormContainerComponent } from 'ish-shared/address-forms/containers/address-form/address-form.container';
import { ContentIncludeContainerComponent } from 'ish-shared/cms/containers/content-include/content-include.container';
import { ModalDialogLinkComponent } from 'ish-shared/common/components/modal-dialog-link/modal-dialog-link.component';
import { ModalDialogComponent } from 'ish-shared/common/components/modal-dialog/modal-dialog.component';
import { CaptchaComponent } from 'ish-shared/forms/components/captcha/captcha.component';
import { CheckboxComponent } from 'ish-shared/forms/components/checkbox/checkbox.component';

Expand Down Expand Up @@ -41,9 +42,10 @@ describe('Registration Form Component', () => {
MockComponent(CaptchaComponent),
MockComponent(CheckboxComponent),
MockComponent(ContentIncludeContainerComponent),
MockComponent(ModalDialogLinkComponent),
MockComponent(ModalDialogComponent),
MockComponent(RegistrationCompanyFormComponent),
MockComponent(RegistrationCredentialsFormComponent),
MockComponent(ServerHtmlDirective),
RegistrationFormComponent,
],
providers: [{ provide: AddressFormFactoryProvider, useFactory: () => instance(addressFormFactoryProviderMock) }],
Expand Down
6 changes: 6 additions & 0 deletions src/app/pages/registration/components/registration-form/registration-form.component.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -158,4 +158,10 @@ export class RegistrationFormComponent implements OnInit, OnChanges {
get formDisabled() {
return this.form.invalid && this.submitted;
}

showModalDialog(dialog) {
return () => {
dialog.show();
};
}
}
8 changes: 2 additions & 6 deletions src/assets/i18n/de_DE.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2647,11 +2647,6 @@
"forgot_password.form.send.button.label": "Senden",
"basket.validation.general.error": "Ihr Warenkorb ist nicht mehr gültig. Bitte korrigieren Sie die unten angegebenen Fehler.",
"servererror.mailServer.error": "Ihre E-Mail konnte leider nicht versandt werden. Wir bitten um Entschuldigung. Bitte versuchen Sie es später erneut.",
"registration.tac_privacy_policy.begin.text": "Ich akzeptiere die",
"registration.tac.link": "AGB",
"registration.tac_privacy_policy.between.text": " und",
"registration.privacy_policy.link": "Datenschutzhinweise",
"registration.tac_privacy_policy.end.text": ".",
"registration.tac.error.tip": "Bitte stimmen Sie den Bedingungen zu, um fortzufahren.",
"registration.privacy_policy.details.title": "Datenschutzhinweise",
"customer.credentials.passwordreset.invalid_password.error.PasswordExpressionViolation": "Das Kennwort muss mindestens 7 Zeichen enthalten, bestehend aus Zahlen und Buchstaben, keine Leerzeichen.",
Expand All @@ -2664,5 +2659,6 @@
"seo.defaults.title": "Intershop Progressive Web App",
"seo.defaults.description": "Intershop - Progressive Web App - Demo PWA",
"account.login.session_timeout.message": "Sie wurden aufgrund einer langen Inaktivitätsdauer automatisch abgemeldet. Bitte melden Sie sich erneut an, um den Einkauf fortzusetzen.",
"account.login.register_now": "Sie haben noch kein Benutzerkonto?<br/><a href=\"{{0}}\">Jetzt anmelden</a>"
"account.login.register_now": "Sie haben noch kein Benutzerkonto?<br/><a href=\"{{0}}\">Jetzt anmelden</a>",
"registration.tac_privacy_policy.label": "Ich akzeptiere die <a callback=\"callbackTAC\">AGB</a> und <a callback=\"callbackPP\">Datenschutzhinweise</a>."
}
8 changes: 2 additions & 6 deletions src/assets/i18n/en_US.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2648,11 +2648,6 @@
"forgot_password.form.send.button.label": "Send",
"basket.validation.general.error": "Your shopping cart is not valid anymore. Please correct the errors indicated below.",
"servererror.mailServer.error": "Your mail couldn't be sent. We apologize for the inconvenience. Please try again later.",
"registration.tac_privacy_policy.begin.text": "I agree to the",
"registration.tac.link": "Terms & Conditions",
"registration.tac_privacy_policy.between.text": " and",
"registration.privacy_policy.link": "Privacy Policy",
"registration.tac_privacy_policy.end.text": ".",
"registration.tac.error.tip": "Please agree to the terms to continue.",
"registration.privacy_policy.details.title": "Privacy Policy",
"customer.credentials.passwordreset.invalid_password.error.PasswordExpressionViolation": "The password must include 7 characters minimum, containing numbers and letters, no spaces.",
Expand All @@ -2665,5 +2660,6 @@
"seo.defaults.title": "Intershop Progressive Web App",
"seo.defaults.description": "Intershop - Progressive Web App - Demo PWA",
"account.login.session_timeout.message": "You have been logged out automatically due to a long period of inactivity. Please log in again to continue shopping.",
"account.login.register_now": "You don't have an account yet?<br/><a href=\"{{0}}\">Register now</a>"
"account.login.register_now": "You don't have an account yet?<br/><a href=\"{{0}}\">Register now</a>",
"registration.tac_privacy_policy.label": "I agree to the <a callback=\"callbackTAC\">Terms & Conditions</a> and <a callback=\"callbackPP\">Privacy Policy</a>."
}
8 changes: 2 additions & 6 deletions src/assets/i18n/fr_FR.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2538,11 +2538,6 @@
"forgot_password.form.send.button.label": "Envoyer",
"basket.validation.general.error": "Votre panier n'est plus valide. Corrigez les erreurs signalées ci-dessous.",
"servererror.mailServer.error": "Votre courriel n’a pas pu être envoyé. Nous nous excusons pour les inconvénients. Veuillez réessayer plus tard.",
"registration.tac_privacy_policy.begin.text": "J’accepte les",
"registration.tac.link": "Conditions générales",
"registration.tac_privacy_policy.between.text": " et",
"registration.privacy_policy.link": "la Politique de confidentialité",
"registration.tac_privacy_policy.end.text": ".",
"registration.tac.error.tip": "Veuillez accepter les conditions pour continuer.",
"registration.privacy_policy.details.title": "Politique de confidentialité",
"customer.credentials.passwordreset.invalid_password.error.PasswordExpressionViolation": "Le mot de passe doit comporter un minimum de 7\u00A0caract\u00E8res, comprenant des chiffres et des lettres, sans espaces.",
Expand All @@ -2555,5 +2550,6 @@
"seo.defaults.title": "Intershop Progressive Web App",
"seo.defaults.description": "Intershop - Progressive Web App - Démo PWA",
"account.login.session_timeout.message": "Vous avez été déconnecté automatiquement en raison d’une longue période d’inactivité. Veuillez vous connecter à nouveau pour continuer vos achats.",
"account.login.register_now": "Vous n’avez pas encore de compte ?<br/><a href=\"{{0}}\">Enregistrez-vous maintenant</a>"
"account.login.register_now": "Vous n’avez pas encore de compte ?<br/><a href=\"{{0}}\">Enregistrez-vous maintenant</a>",
"registration.tac_privacy_policy.label": "J’accepte les <a callback=\"callbackTAC\">Conditions générales</a> et <a callback=\"callbackPP\">la Politique de confidentialité</a>."
}

0 comments on commit 08416f7

Please sign in to comment.