@bpost/bp-address-auto-complete-by-component 1.1.6 → 1.1.8

package/tutorial/tutorial/aacwidget-tutorial/package.json

@@ -0,0 +1,49 @@
+{
+  "name": "aacwidget-demo",
+  "version": "0.0.0",
+  "scripts": {
+    "ng": "ng",
+    "start": "ng serve",
+    "build": "ng build",
+    "test": "ng test",
+    "lint": "ng lint",
+    "e2e": "ng e2e"
+  },
+  "private": true,
+  "dependencies": {
+    "@angular/animations": "~9.1.9",
+    "@angular/common": "~9.1.9",
+    "@angular/compiler": "~9.1.9",
+    "@angular/core": "~9.1.9",
+    "@angular/forms": "~9.1.9",
+    "@angular/platform-browser": "~9.1.9",
+    "@angular/platform-browser-dynamic": "~9.1.9",
+    "@angular/router": "~9.1.9",
+    "@bpost/bp-address-auto-complete-by-component": "^1.0.3",
+    "@ngx-translate/core": "^12.1.2",
+    "ngx-translate-multi-http-loader": "^3.0.0",
+    "rxjs": "~6.5.4",
+    "tslib": "^1.10.0",
+    "zone.js": "~0.10.2"
+  },
+  "devDependencies": {
+    "@angular-devkit/build-angular": "~0.901.7",
+    "@angular/cli": "~9.1.7",
+    "@angular/compiler-cli": "~9.1.9",
+    "@types/node": "^12.11.1",
+    "@types/jasmine": "~3.5.0",
+    "@types/jasminewd2": "~2.0.3",
+    "codelyzer": "^5.1.2",
+    "jasmine-core": "~3.5.0",
+    "jasmine-spec-reporter": "~4.2.1",
+    "karma": "~5.0.0",
+    "karma-chrome-launcher": "~3.1.0",
+    "karma-coverage-istanbul-reporter": "~2.1.0",
+    "karma-jasmine": "~3.0.1",
+    "karma-jasmine-html-reporter": "^1.4.2",
+    "protractor": "~7.0.0",
+    "ts-node": "~8.3.0",
+    "tslint": "~6.1.0",
+    "typescript": "~3.8.3"
+  }
+}

package/tutorial/tutorial/aacwidget-tutorial/src/app/app-routing.module.ts

@@ -0,0 +1,18 @@
+import { NgModule } from '@angular/core';
+import { Routes, RouterModule } from '@angular/router';
+import { AppComponent } from './app.component';
+import { WidgetSimpleComponent } from './widget-simple/widget-simple.component';
+import { WidgetFullComponent } from './widget-full/widget-full.component';
+
+
+const routes: Routes = [
+  { path: 'widgetFull', component: WidgetFullComponent},
+  { path: 'widgetSimple', component: WidgetSimpleComponent},
+  { path: '*.*', component: AppComponent},
+];
+
+@NgModule({
+  imports: [RouterModule.forRoot(routes)],
+  exports: [RouterModule]
+})
+export class AppRoutingModule { }

package/tutorial/tutorial/aacwidget-tutorial/src/app/app.component.html

@@ -0,0 +1,6 @@
+<h1>AACWidget bpost address auto complete by component</h1>
+
+<button type="button" (click)="onShowWidgetSimple()">Widget simple</button>
+&nbsp;
+<button type="button" (click)="onShowWidgetFull()">Widget full</button>
+<router-outlet></router-outlet>

package/tutorial/tutorial/aacwidget-tutorial/src/app/app.component.spec.ts

@@ -0,0 +1,35 @@
+import { TestBed, async } from '@angular/core/testing';
+import { RouterTestingModule } from '@angular/router/testing';
+import { AppComponent } from './app.component';
+
+describe('AppComponent', () => {
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      imports: [
+        RouterTestingModule
+      ],
+      declarations: [
+        AppComponent
+      ],
+    }).compileComponents();
+  }));
+
+  it('should create the app', () => {
+    const fixture = TestBed.createComponent(AppComponent);
+    const app = fixture.componentInstance;
+    expect(app).toBeTruthy();
+  });
+
+  it(`should have as title 'aacwidget-demo'`, () => {
+    const fixture = TestBed.createComponent(AppComponent);
+    const app = fixture.componentInstance;
+    expect(app.title).toEqual('aacwidget-demo');
+  });
+
+  it('should render title', () => {
+    const fixture = TestBed.createComponent(AppComponent);
+    fixture.detectChanges();
+    const compiled = fixture.nativeElement;
+    expect(compiled.querySelector('.content span').textContent).toContain('aacwidget-demo app is running!');
+  });
+});

package/tutorial/tutorial/aacwidget-tutorial/src/app/app.component.ts

@@ -0,0 +1,28 @@
+import { Component } from '@angular/core';
+import { Router } from '@angular/router';
+
+
+@Component({
+  selector: 'app-root',
+  templateUrl: './app.component.html',
+  styleUrls: ['./app.component.scss']
+})
+export class AppComponent
+{
+  title = 'aacwidget-demo';
+
+  constructor(
+    private router: Router,
+  ) {}
+
+  onShowWidgetSimple()
+  {
+    this.router.navigate(['widgetSimple']);
+  }
+
+  onShowWidgetFull()
+  {
+    this.router.navigate(['widgetFull']);
+  }
+
+}

package/tutorial/tutorial/aacwidget-tutorial/src/app/app.module.ts

@@ -0,0 +1,47 @@
+import { BrowserModule } from '@angular/platform-browser';
+import { NgModule } from '@angular/core';
+import { HttpClient } from '@angular/common/http';
+
+import { AppRoutingModule } from './app-routing.module';
+import { AppComponent } from './app.component';
+import { WidgetSimpleComponent } from './widget-simple/widget-simple.component';
+
+import { LibAddressAutocompleteByComponentModule } from '@bpost/bp-address-auto-complete-by-component';
+import { TranslateModule, TranslateLoader } from '@ngx-translate/core';
+import { MultiTranslateHttpLoader } from 'ngx-translate-multi-http-loader';
+import { WidgetFullComponent } from './widget-full/widget-full.component';
+
+export function HttpLoaderFactory(http: HttpClient) {
+  // const i18nResourcePath = environment.i18nResourcePath;
+  return new MultiTranslateHttpLoader(http, [
+    {prefix: './assets/i18n/', suffix: '.json'},
+    {prefix: './assets/aacwidget/i18n/', suffix: '.json'}
+      // {prefix: /*'./shared/assets/i18n/'*/ i18nResourcePath, suffix: '.json'},
+  ]);
+}
+
+@NgModule({
+  declarations: [
+    AppComponent,
+    WidgetSimpleComponent,
+    WidgetFullComponent,
+  ],
+  imports: [
+    BrowserModule,
+
+    TranslateModule.forRoot({
+      defaultLanguage: 'en',
+      loader: {
+          provide: TranslateLoader,
+          useFactory: HttpLoaderFactory,
+          deps: [HttpClient]
+      }
+    }),
+
+    LibAddressAutocompleteByComponentModule,
+    AppRoutingModule
+  ],
+  providers: [],
+  bootstrap: [AppComponent]
+})
+export class AppModule { }

package/tutorial/tutorial/aacwidget-tutorial/src/app/widget-full/widget-full.component.html

@@ -0,0 +1,57 @@
+<p>widget-full works!</p>
+
+<br>
+<button type="button" (click)="onSelectLanguage('fr')">FR</button>
+&nbsp;
+<button type="button" (click)="onSelectLanguage('nl')">NL</button>
+&nbsp;
+<button type="button" (click)="onSelectLanguage('en')">EN</button>
+&nbsp;
+<button type="button" (click)="onSelectLanguage('de')">DE</button>
+&nbsp;
+<button type="button" (click)="onSelectLanguage('browser')">Browser</button>
+
+<br>
+
+<button type="button" (click)="onNotInListToggle()">Toggle 'NotInList'</button> &nbsp; <span>{{ notInListAllowed }}</span>
+<br>
+<button type="button" (click)="onPrefillWithUnstructuredData()">Prefill With Unstructured Data</button>
+&nbsp;
+<button type="button" (click)="onPrefillWithStructuredData()">Prefill With structured Data</button>
+
+<br>
+
+<bp-lib-address-autocomplete-by-component
+    [defaultLang]="defaultLanguage"
+    [inputLang]="selectedLanguage"
+    [validationMessageOption]="validationMessageOption"
+    [notInListAllowed]="notInListAllowed"
+    [minLevel]="minLevel"
+    [addressParams]="prefilledParameters"
+    
+    (addressCompleteEventEmitter)="onAddressComplete($event)"
+    (clearInputEventEmitter)="onClearInputEventMessage($event)"
+    (validationMessageEventEmitter)="onAddressValidationMessage($event)"
+
+    [localityUrl] = "localityUrl"
+    [maxSuggestionLocality]="maxSuggestionLocality"
+    [visibleSuggestionLocalityCount]="visibleSuggestionLocalityCount"
+    [sortCriteriaLocality]="sortCriteriaLocality"
+    [messageOption]="messageOption"
+
+    [streetUrl] = "streetUrl"
+    [maxSuggestionStreet]="maxSuggestionStreet"
+    [visibleSuggestionStreetCount]="visibleSuggestionStreetCount"
+    [sortCriteriaStreet]="sortCriteriaStreet"
+
+    [streetNumberUrl] = "streetNumberUrl"
+    [maxSuggestionStreetNb]="maxSuggestionStreetNb"
+    [visibleSuggestionStreetNbCount]="visibleSuggestionStreetNbCount"
+    [sortCriteriaStreetNb]="sortCriteriaStreetNb"
+
+    [boxNumberUrl] = "boxNumberUrl"
+    [maxSuggestionBoxNb]="maxSuggestionBoxNb"
+    [visibleSuggestionBoxNbCount]="visibleSuggestionBoxNbCount"
+    [sortCriteriaBoxNb]="sortCriteriaBoxNb"
+
+></bp-lib-address-autocomplete-by-component>

package/tutorial/tutorial/aacwidget-tutorial/src/app/widget-full/widget-full.component.ts

@@ -0,0 +1,160 @@
+import { Component, OnInit } from '@angular/core';
+import { TranslateService } from '@ngx-translate/core';
+
+
+import { PrefilledParameters, ValidationMessageOptionType } from '@bpost/bp-address-auto-complete-by-component';
+
+@Component({
+  selector: 'app-widget-full',
+  templateUrl: './widget-full.component.html',
+  styleUrls: ['./widget-full.component.scss']
+})
+export class WidgetFullComponent implements OnInit {
+
+  defaultLanguage = 'en';
+
+  selectedLanguage: string;
+
+  defaultValidationMessageOptionType = ValidationMessageOptionType.EMIT;
+  validationMessageOption = {validationType: this.defaultValidationMessageOptionType, timestamp: new Date() };
+
+  // The 'not in list' feature, if allowed, is only available for the street number and box number address element
+  // By default, that feature is allowed.
+  notInListAllowed = true;
+  //
+  minLevel: number;
+  prefilledParameters: PrefilledParameters;
+
+  // Imposed and mandatory values
+  // Don't change these values untill bpost ask for!
+  localityUrl = 'https://webservices-pub.bpost.be/ws/ExternalMailingAddressProofingCSREST_v1/address/autocomplete/locality';
+  streetUrl = 'https://webservices-pub.bpost.be/ws/ExternalMailingAddressProofingCSREST_v1/address/autocomplete/street';
+  streetNumberUrl = 'https://webservices-pub.bpost.be/ws/ExternalMailingAddressProofingCSREST_v1/address/autocomplete/streetNumber';
+  boxNumberUrl = 'https://webservices-pub.bpost.be/ws/ExternalMailingAddressProofingCSREST_v1/address/autocomplete/boxNumber';
+
+
+  // LOCALITY
+  maxSuggestionLocality = 5;
+  visibleSuggestionLocalityCount = 5;
+  sortCriteriaLocality = '';
+  messageOption = 'Y';
+  // Fixed enumeration
+  localitySortCriterias: Array<object> = [
+    { id: '', name: 'Server Decides' },
+    { id: 'P', name: 'Postal Codes' },
+    { id: 'L', name: 'Locality' },
+  ];
+  // Fixed enumerations
+  messageOptions: Array<object> = [
+    { id: 'Y', name: 'ON' },
+    { id: 'P', name: 'ON(P)' },
+    { id: 'N', name: 'OFF' }
+  ];
+
+
+  // STREET
+  maxSuggestionStreet = 5;
+  visibleSuggestionStreetCount = 5;
+  sortCriteriaStreet = '';
+  streetSortCriterias: Array<object> = [
+    { id: '', name: 'Server Decides' },
+    { id: 'S', name: 'Street Names' }
+  ];
+
+
+  // STREET NUMBER
+  maxSuggestionStreetNb = 5;
+  visibleSuggestionStreetNbCount = 5;
+  sortCriteriaStreetNb = '';
+  // Fixed enumeration
+  streetNbSortCriterias: Array<object> = [
+    { id: '', name: 'Server Decides' },
+    { id: 'S', name: 'Street Numbers' }
+  ];
+
+
+  // BOX NUMBER
+  maxSuggestionBoxNb = 5;
+  visibleSuggestionBoxNbCount = 5;
+  sortCriteriaBoxNb = '';
+  // Fixed enumeration
+  boxNbSortCriterias: Array<object> = [
+    { id: '', name: 'Server Decides' },
+    { id: 'B', name: 'Box Numbers' }
+  ];
+
+  constructor(
+    private translate: TranslateService,
+  ) { }
+
+  ngOnInit(): void {
+  }
+
+  onAddressComplete(event)
+  {
+    console.log('address complete event message', event);
+  }
+
+  onClearInputEventMessage(event)
+  {
+    console.log('address clear input message', event);
+  }
+
+  onAddressValidationMessage(event)
+  {
+    console.log('address system message', event);
+  }
+
+  onSelectLanguage(lang: string)
+  {
+    if (lang === 'browser') {
+      const browserLang = this.translate.getBrowserLang();
+      this.translate.use(browserLang);
+      this.selectedLanguage = browserLang;
+    } else {
+      this.translate.use(lang);
+      this.selectedLanguage = lang;
+    }
+
+  }
+
+  onNotInListToggle()
+  {
+    this.notInListAllowed = !this.notInListAllowed;
+  }
+
+  // Element      minLevel
+  // --------------------------
+  // Locality         4
+  // Street           3
+  // Street number    2
+  // Box number       1
+  // --------------------------
+  onPrefillWithUnstructuredData()
+  {
+    // limited to the postal code and locality as a single string
+    this.prefilledParameters = new PrefilledParameters(
+      {
+        unstructuredAddress: 'Jemelle 5580' // '5580 Jemelle'
+      }
+    );
+    this.minLevel = 4;
+  }
+
+  // volklorenlaan 21, 5 - 2610 Wilrijk
+  onPrefillWithStructuredData()
+  {
+    this.prefilledParameters = new PrefilledParameters(
+      {
+        municipalityName: 'Wilrijk',
+        postalCode: '2610',
+        streetName: 'volklorenlaan',
+        streetNumber: '',
+        boxNumber: '',
+
+        state: true
+      }
+    );
+    this.minLevel = this.prefilledParameters.minLevel;
+  }
+}

package/tutorial/tutorial/aacwidget-tutorial/src/app/widget-simple/widget-simple.component.html

@@ -0,0 +1,20 @@
+<p>widget-simple works!</p>
+
+<br>
+<button type="button" (click)="onSelectLanguage('fr')">FR</button>
+&nbsp;
+<button type="button" (click)="onSelectLanguage('nl')">NL</button>
+&nbsp;
+<button type="button" (click)="onSelectLanguage('en')">EN</button>
+&nbsp;
+<button type="button" (click)="onSelectLanguage('de')">DE</button>
+&nbsp;
+<button type="button" (click)="onSelectLanguage('browser')">Browser</button>
+
+<bp-lib-address-autocomplete-by-component
+    [defaultLang]="defaultLanguage"
+    [inputLang]="selectedLanguage"
+    (addressCompleteEventEmitter)="onAddressComplete($event)"
+    (clearInputEventEmitter)="onClearInputEventMessage($event)"
+    (validationMessageEventEmitter)="onAddressValidationMessage($event)"
+></bp-lib-address-autocomplete-by-component>

package/tutorial/tutorial/aacwidget-tutorial/src/app/widget-simple/widget-simple.component.spec.ts

@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { WidgetSimpleComponent } from './widget-simple.component';
+
+describe('WidgetSimpleComponent', () => {
+  let component: WidgetSimpleComponent;
+  let fixture: ComponentFixture<WidgetSimpleComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ WidgetSimpleComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(WidgetSimpleComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

package/tutorial/tutorial/aacwidget-tutorial/src/app/widget-simple/widget-simple.component.ts

@@ -0,0 +1,49 @@
+import { Component, OnInit } from '@angular/core';
+import { TranslateService } from '@ngx-translate/core';
+
+@Component({
+  selector: 'app-widget-simple',
+  templateUrl: './widget-simple.component.html',
+  styleUrls: ['./widget-simple.component.scss']
+})
+export class WidgetSimpleComponent implements OnInit {
+
+  defaultLanguage = 'en';
+
+  selectedLanguage: string;
+
+  constructor(
+    private translate: TranslateService,
+  ) { }
+
+  ngOnInit(): void {
+  }
+
+  onAddressComplete(event)
+  {
+    console.log('address complete event message', event);
+  }
+
+  onClearInputEventMessage(event)
+  {
+    console.log('address clear input message', event);
+  }
+
+  onAddressValidationMessage(event)
+  {
+    console.log('address system message', event);
+  }
+
+  onSelectLanguage(lang: string)
+  {
+    if (lang === 'browser') {
+      const browserLang = this.translate.getBrowserLang();
+      this.translate.use(browserLang);
+      this.selectedLanguage = browserLang;
+    } else {
+      this.translate.use(lang);
+      this.selectedLanguage = lang;
+    }
+
+  }
+}

package/tutorial/tutorial/aacwidget-tutorial/src/assets/aacwidget/i18n/de.json

@@ -0,0 +1,62 @@
+{
+	"common": {
+		"message": {
+			"address-not-found": "Adresse nicht erkannt.",
+			"address-validated": "Die Adresse wurde validiert",
+			"service-unavailable": "Der Dienst ist nicht verfügbar. Bitte versuchen Sie es später erneut."
+		},
+		"label": {
+			"boxNumber": "Boxnummer",
+			"streetNumber": "Hausnummer",
+			"municipalityName": "Gemeinde",
+			"postalCode": "Postleitzahl",
+			"streetName": "Straßennamen"
+		}
+	},
+	"locality": {
+		"placeholder": {
+			"input-placeholder": "Geben Sie eine Postleitzahl / einen Ort an ..."
+		},
+		"suggestion": {
+			"message": {
+				"subl": "<em>{{sub}}</em> ist eine Untergemeinde von <em>{{principal}}</em>"
+			}
+		}
+	},
+	"street": {
+		"placeholder": {
+			"input-placeholder": "Geben Sie einen Straßennamen an ..."
+		},
+		"suggestion": {
+			"message": {
+				"subl": "<em>{{sub}}</em> ist eine Untergemeinde von <em>{{principal}}</em>"
+			}
+		}
+	},
+	"streetNumber": {
+		"placeholder": {
+			"input-placeholder": "Geben Sie eine Hausnummer an ..."
+		},
+		"suggestion": {
+			"message": {
+				"subl": "<em>{{sub}}</em> ist eine Untergemeinde von <em>{{principal}}</em>"
+			}
+		},
+		"message": {
+			"not-in-list": "Die Hausnummer ist nicht in der Liste"
+		}
+	},
+	"boxNumber": {
+		"placeholder": {
+			"input-placeholder": "Geben Sie eine Boxnummer an ..."
+		},
+		"suggestion": {
+			"message": {
+				"subl": "<em>{{sub}}</em> ist eine Untergemeinde von <em>{{principal}}</em>"
+			}
+		},
+		"message": {
+			"not-in-list": "Die Boxnummer ist nicht in der Liste"
+		}
+	}
+}

package/tutorial/tutorial/aacwidget-tutorial/src/assets/aacwidget/i18n/en.json

@@ -0,0 +1,62 @@
+{
+	"common": {
+		"message": {
+			"address-not-found": "Address not recognized.",
+			"address-validated": "The address has been validated",
+			"service-unavailable": "The service could not be reached. Please try again later."
+		},
+		"label": {
+			"boxNumber": "box number",
+			"streetNumber": "house number",
+			"municipalityName": "municipality",
+			"postalCode": "postal code",
+			"streetName": "street name"
+		}
+	},
+	"locality": {
+		"placeholder": {
+			"input-placeholder": "Provide a postal code / locality..."
+		},
+		"suggestion": {
+			"message": {
+				"subl": "<em>{{sub}}</em> is a sub-municipality of <em>{{principal}}</em>"
+			}
+		}
+	},
+	"street": {
+		"placeholder": {
+			"input-placeholder": "Provide a streetName..."
+		},
+		"suggestion": {
+			"message": {
+				"subl": "<em>{{sub}}</em> is a sub-municipality of <em>{{principal}}</em>"
+			}
+		}
+	},
+	"streetNumber": {
+		"placeholder": {
+			"input-placeholder": "Provide a streetNumber..."
+		},
+		"suggestion": {
+			"message": {
+				"subl": "<em>{{sub}}</em> is a sub-municipality of <em>{{principal}}</em>"
+			}
+		},
+		"message": {
+			"not-in-list": "The House Number is not in the list"
+		}
+	},
+	"boxNumber": {
+		"placeholder": {
+			"input-placeholder": "Provide a boxNumber..."
+		},
+		"suggestion": {
+			"message": {
+				"subl": "<em>{{sub}}</em> is a sub-municipality of <em>{{principal}}</em>"
+			}
+		},
+		"message": {
+			"not-in-list": "The Box Number is not in the list"
+		}
+	}
+}