Feature/ev 1227 improve initial start for web/mobile shop (#507)

* feat(ever-shop-mobile): improved mobile app EV-1227 * feat(ever-shop-web): improved initial start on Web Shop app EV-1227 * fix: fixed wrong code and some syntactic errors
ever-co · May 16, 2019 · c2405f7 · c2405f7
1 parent 6268852
commit c2405f7
Show file tree

Hide file tree

Showing 9 changed files with 111 additions and 26 deletions.
diff --git a/shop/mobile-ionic/src/app/pages/+invite/+by-location/by-location.page.html b/shop/mobile-ionic/src/app/pages/+invite/+by-location/by-location.page.html
@@ -1,18 +1,23 @@
 <div class="by-location" dir="{{ 'CURRENT_DIRECTION' | translate }}">
+	<h1>{{ 'INVITE_VIEW.YOUR_ADDRESS' | translate }}</h1>
 
-	<h1> {{ 'INVITE_VIEW.YOUR_ADDRESS' | translate }} </h1>
-
-	<h2> {{ 'INVITE_VIEW.LAUNCH_NOTIFICATION' | translate }} </h2>
+	<h2>{{ 'INVITE_VIEW.LAUNCH_NOTIFICATION' | translate }}</h2>
 
 	<div style="padding-top: 50px" *ngIf="detectingLocation">
-		<h3 style="color: white"> {{ 'INVITE_VIEW.DETECTING_LOCATION' | translate }} </h3>
-		<br/>
+		<h3 style="color: white">
+			{{ 'INVITE_VIEW.DETECTING_LOCATION' | translate }}
+		</h3>
+		<br />
 	</div>
 
 	<ion-spinner color="light" [hidden]="!detectingLocation"></ion-spinner>
 
 	<div *ngIf="!detectingLocation">
-		<input class="ion-autocomplete" [(ngModel)]="city" placeholder="{{ 'CITY' | translate }}" />
+		<input
+			class="ion-autocomplete"
+			[(ngModel)]="city"
+			placeholder="{{ 'CITY' | translate }}"
+		/>
 		<!--<input ion-autocomplete type="text" readonly="readonly" class="ion-autocomplete" autocomplete="off"
 			   [(ngModel)]="city" max-selected-items="1"
 			   items-method="inviteByLocationCtrl?.queryCities(query)" selected-items-label="Selected City"
@@ -21,35 +26,61 @@ <h3 style="color: white"> {{ 'INVITE_VIEW.DETECTING_LOCATION' | translate }} </h
 		<!-- Angular have no such label:
           cancel-label="{{ 'BACK' | translate }}"       -->
 
-		<div *ngIf='city'>
-			<input class="ion-autocomplete" [(ngModel)]="streetAddress" placeholder="{{ 'STREET' | translate }}" />
+		<div *ngIf="city">
+			<input
+				class="ion-autocomplete"
+				[(ngModel)]="streetAddress"
+				placeholder="{{ 'STREET' | translate }}"
+			/>
 			<!--<input ion-autocomplete readonly class="ion-autocomplete" autocomplete="off" [(ngModel)]="streetAddress"
 				   max-selected-items="1"
 				   items-method="inviteByLocationCtrl?.queryStreets(query)" selected-items-label="Selected Street"
 				   template-url="templates/autocomplete.html" placeholder="{{ 'STREET' | translate }}"/>-->
 			<!-- Angular have no such label:
               cancel-label="{{ 'BACK' | translate }}"       -->
 
-			<div *ngIf='streetAddress'>
+			<div *ngIf="streetAddress">
 				<ion-grid no-padding>
 					<ion-row class="house-and-apartment">
 						<ion-col no-padding>
-							<div class="house house-{{ 'CURRENT_DIRECTION' | translate }}">
-								<input type="number" [(ngModel)]="house" placeholder="{{ 'HOUSE' | translate }}" />
+							<div
+								class="house house-{{
+									'CURRENT_DIRECTION' | translate
+								}}"
+							>
+								<input
+									type="number"
+									[(ngModel)]="house"
+									placeholder="{{ 'HOUSE' | translate }}"
+								/>
 							</div>
 						</ion-col>
 
 						<ion-col no-padding>
 							<div class="apartment">
-								<input type="number" *ngIf="isApartment" [(ngModel)]="apartment" placeholder="{{ 'APARTMENT' | translate }}" class="apartment apartment-{{ 'CURRENT_DIRECTION' | translate }}"
+								<input
+									type="number"
+									*ngIf="isApartment"
+									[(ngModel)]="apartment"
+									placeholder="{{ 'APARTMENT' | translate }}"
+									class="apartment apartment-{{
+										'CURRENT_DIRECTION' | translate
+									}}"
 								/>
 
-								<div *ngIf="!apartment" class="is-apartment is-apartment-{{ 'CURRENT_DIRECTION' | translate }}">
+								<div
+									*ngIf="!apartment"
+									class="is-apartment is-apartment-{{
+										'CURRENT_DIRECTION' | translate
+									}}"
+								>
 									<span class="description">
 										{{ 'APARTMENT' | translate }}
 									</span>
 									<label class="toggle toggle-assertive">
-										<ion-checkbox [(ngModel)]="isApartment"></ion-checkbox>
+										<ion-checkbox
+											[(ngModel)]="isApartment"
+										></ion-checkbox>
 										<div class="track">
 											<div class="handle"></div>
 										</div>
@@ -59,10 +90,16 @@ <h3 style="color: white"> {{ 'INVITE_VIEW.DETECTING_LOCATION' | translate }} </h
 						</ion-col>
 					</ion-row>
 				</ion-grid>
-				<ion-button color="secondary" *ngIf="house && (apartment || !isApartment)" expand="block" class="submit-button" (click)="login()">
+				<ion-button
+					color="secondary"
+					*ngIf="house && (apartment || !isApartment)"
+					expand="block"
+					class="submit-button"
+					(click)="login()"
+				>
 					{{ 'INVITE_VIEW.GET_IN' | translate }}
 				</ion-button>
 			</div>
 		</div>
 	</div>
-</div>
+</div>
diff --git a/shop/mobile-ionic/src/app/pages/+invite/+by-location/by-location.page.ts b/shop/mobile-ionic/src/app/pages/+invite/+by-location/by-location.page.ts
@@ -16,6 +16,7 @@ import { Store } from '../../../services/store.service';
 import { UserAuthRouter } from '@modules/client.common.angular2/routers/user-auth-router.service';
 import { GeoLocationRouter } from '@modules/client.common.angular2/routers/geo-location-router.service';
 import { Subject } from 'rxjs';
+import { environment } from 'environment';
 
 @Component({
 	selector: 'e-cu-by-location',
@@ -71,7 +72,18 @@ export class ByLocationPage implements OnInit, OnDestroy {
 				enableHighAccuracy: true // will try to use GPS (if enabled) on mobile
 			};
 
-			const response = await Geolocation.getCurrentPosition(options);
+			const defaultLat = environment.DEFAULT_LATITUDE;
+			const defaultLng = environment.DEFAULT_LONGITUDE;
+
+			let response: { coords: { longitude: number; latitude: number } };
+
+			if (!environment.production && defaultLat && defaultLng) {
+				response = {
+					coords: { latitude: defaultLat, longitude: defaultLng }
+				};
+			} else {
+				response = await Geolocation.getCurrentPosition(options);
+			}
 
 			const { coords } = response;
 

diff --git a/shop/mobile-ionic/src/app/pages/+merchants/merchants.page.ts b/shop/mobile-ionic/src/app/pages/+merchants/merchants.page.ts
@@ -11,6 +11,7 @@ import { MerchantsService } from 'app/services/merchants/merchants.service';
 import { ILocation } from '@modules/server.common/interfaces/IGeoLocation';
 import { BarcodeScanner } from '@ionic-native/barcode-scanner';
 import { WarehouseRouter } from '@modules/client.common.angular2/routers/warehouse-router.service';
+import { environment } from 'environment';
 
 @Component({
 	templateUrl: './merchants.page.html',
@@ -92,7 +93,9 @@ export class MerchantsPage implements OnDestroy {
 	private async getLocation() {
 		let location: ILocation;
 
-		if (this.store.userId) {
+		const isProductionEnv = environment.production;
+
+		if (this.store.userId && isProductionEnv) {
 			const user = await this.userRouter
 				.get(this.store.userId)
 				.pipe(first())

diff --git a/shop/mobile-ionic/src/app/pages/+products/products.page.ts b/shop/mobile-ionic/src/app/pages/+products/products.page.ts
@@ -101,7 +101,7 @@ export class ProductsPage implements OnInit, OnDestroy {
 			this.store.registrationSystem = RegistrationSystem.Once;
 			this.store.buyProduct = currentProduct.warehouseProduct.id;
 			this.store.warehouseId = currentProduct.warehouseId;
-			this.navCtrl.navigateRoot('/invite');
+			this.router.navigateByUrl('/invite');
 		} else {
 			const orderCreateInput: IOrderCreateInput = {
 				warehouseId:
@@ -207,7 +207,9 @@ export class ProductsPage implements OnInit, OnDestroy {
 	private async loadGeoLocationProducts() {
 		let geoLocationForProducts: GeoLocation;
 
-		if (this.store.userId) {
+		const isProductionEnv = environment.production;
+
+		if (this.store.userId && isProductionEnv) {
 			const user = await this.userRouter
 				.get(this.store.userId)
 				.pipe(first())

diff --git a/shop/mobile-ionic/src/app/services/geo-location.ts b/shop/mobile-ionic/src/app/services/geo-location.ts
@@ -2,6 +2,7 @@ import { Injectable } from '@angular/core';
 import { ILocation } from '@modules/server.common/interfaces/IGeoLocation';
 import { Geolocation } from '@ionic-native/geolocation';
 import GeoLocation from '@modules/server.common/entities/GeoLocation';
+import { environment } from 'environment';
 
 @Injectable()
 export class GeoLocationService {
@@ -10,7 +11,17 @@ export class GeoLocationService {
 	getCurrentGeoLocation(): Promise<GeoLocation> {
 		return new Promise(async (resolve, reject) => {
 			try {
-				const { coords } = await Geolocation.getCurrentPosition();
+				const defaultLat = environment.DEFAULT_LATITUDE;
+				const defaultLng = environment.DEFAULT_LONGITUDE;
+
+				let coords: { longitude: number; latitude: number };
+
+				if (!environment.production && defaultLat && defaultLng) {
+					coords = { latitude: defaultLat, longitude: defaultLng };
+				} else {
+					const data = await Geolocation.getCurrentPosition();
+					coords = data.coords;
+				}
 
 				const location: ILocation = {
 					type: 'Point',

diff --git a/shop/website-angular/src/app/+products/products.component.ts b/shop/website-angular/src/app/+products/products.component.ts
@@ -24,6 +24,7 @@ import { Subject } from 'rxjs';
 import 'rxjs/add/operator/debounceTime';
 import 'rxjs/add/operator/distinctUntilChanged';
 import { CarouselViewComponent } from './views/carousel/carousel-view.component';
+import { environment } from 'environments/environment';
 
 const initializeProductsNumber: number = 10;
 
@@ -139,7 +140,9 @@ export class ProductsComponent implements OnInit, OnDestroy {
 	private async loadGeoLocationProducts() {
 		let geoLocationForProducts: GeoLocation;
 
-		if (this.store.userId) {
+		const isProductionEnv = environment.production;
+
+		if (this.store.userId && isProductionEnv) {
 			const user = await this.userRouter
 				.get(this.store.userId)
 				.pipe(first())

diff --git a/shop/website-angular/src/app/services/geo-location.ts b/shop/website-angular/src/app/services/geo-location.ts
@@ -46,6 +46,20 @@ export class GeoLocationService {
 
 	getCurrentCoords(): Promise<Coords> {
 		return new Promise((resolve, reject) => {
+			const defaultLat = environment.DEFAULT_LATITUDE;
+			const defaultLng = environment.DEFAULT_LONGITUDE;
+
+			if (!environment.production && defaultLat && defaultLng) {
+				resolve(
+					this.getCoordsObj({
+						latitude: defaultLat,
+						longitude: defaultLng
+					})
+				);
+
+				return;
+			}
+
 			navigator.geolocation.getCurrentPosition(
 				(res) => {
 					// If user is enable GPS on browser

diff --git a/shop/website-angular/src/app/toolbar/toolbar.component.html b/shop/website-angular/src/app/toolbar/toolbar.component.html
@@ -52,7 +52,7 @@
 			[color]="styleVariables.brandLighted"
 			focusedColor="#f1f1f1"
 			(searchLocation)="tryFindNewAddress($event)"
-			(detectLocation)="laodAddress(true)"
+			(detectLocation)="loadAddress(true)"
 		></mat-search>
 	</section>
 

diff --git a/shop/website-angular/src/app/toolbar/toolbar.component.ts b/shop/website-angular/src/app/toolbar/toolbar.component.ts
@@ -13,6 +13,7 @@ import { GeoLocationService } from 'app/services/geo-location';
 import { MatSearchComponent } from '@modules/material-extensions/search/mat-search.component';
 import { MatDialog } from '@angular/material';
 import { LocationPopupComponent } from 'app/shared/location-popup/location-popup.component';
+import { environment } from 'environments/environment';
 
 @Component({
 	selector: 'toolbar',
@@ -39,7 +40,7 @@ export class ToolbarComponent implements AfterViewInit {
 	) {
 		this.isDeliveryRequired =
 			this.store.deliveryType === DeliveryType.Delivery;
-		this.laodAddress();
+		this.loadAddress();
 		/*let autocomplete = new google.maps.places.Autocomplete(this.searchElementRef.nativeElement, {
 			types: ["address"]
 		});
@@ -92,10 +93,12 @@ export class ToolbarComponent implements AfterViewInit {
 		);
 	}
 
-	private async laodAddress(findNew: boolean = false) {
+	private async loadAddress(findNew: boolean = false) {
 		let geoLocationForProducts: GeoLocation;
 
-		if (this.store.userId && !findNew) {
+		const isProductionEnv = environment.production;
+
+		if (this.store.userId && !findNew && isProductionEnv) {
 			const user = await this.userRouter
 				.get(this.store.userId)
 				.pipe(first())