diff --git a/angular.json b/angular.json index 14ea9a0..11e772b 100644 --- a/angular.json +++ b/angular.json @@ -24,7 +24,7 @@ "tsConfig": "tsconfig.app.json", "aot": false, "assets": [ - "src/favicon.ico", + "src/favicon.png", "src/assets", "src/manifest.webmanifest" ], @@ -92,7 +92,7 @@ "tsConfig": "tsconfig.spec.json", "karmaConfig": "karma.conf.js", "assets": [ - "src/favicon.ico", + "src/favicon.png", "src/assets", "src/manifest.webmanifest" ], @@ -130,4 +130,4 @@ } }}, "defaultProject": "zataakse" -} \ No newline at end of file +} diff --git a/ngsw-config.json b/ngsw-config.json index 4ddf1a7..a7ecb5e 100644 --- a/ngsw-config.json +++ b/ngsw-config.json @@ -7,7 +7,7 @@ "installMode": "prefetch", "resources": { "files": [ - "/favicon.ico", + "/favicon.png", "/index.html", "/manifest.webmanifest", "/*.css", diff --git a/package-lock.json b/package-lock.json index 0d8bfb5..fbc5605 100644 --- a/package-lock.json +++ b/package-lock.json @@ -8037,6 +8037,14 @@ "integrity": "sha512-iyam8fBuCUpWeKPGpaNMetEocMt364qkCsfL9JuhjXX6dRnguRVOfk2GZaDpPjcOKiiXCPINZC1GczQ7iTq3Zw==", "dev": true }, + "ngx-device-detector": { + "version": "1.3.20", + "resolved": "https://registry.npmjs.org/ngx-device-detector/-/ngx-device-detector-1.3.20.tgz", + "integrity": "sha512-juYwd4Z5ikCDf6TnnkU44BmEsJVF50V9+85dQ9PW0VhFjxfKEHQ1nLME0ticYA7yKYj4FNQuHh4qazBSu4nkMQ==", + "requires": { + "tslib": "^1.9.0" + } + }, "nice-try": { "version": "1.0.5", "resolved": "https://registry.npmjs.org/nice-try/-/nice-try-1.0.5.tgz", diff --git a/package.json b/package.json index 0028b10..6803e12 100644 --- a/package.json +++ b/package.json @@ -26,6 +26,7 @@ "@ngx-translate/core": "^11.0.1", "@ngx-translate/http-loader": "^4.0.0", "hammerjs": "^2.0.8", + "ngx-device-detector": "^1.3.20", "rxjs": "~6.4.0", "tslib": "^1.10.0", "zone.js": "~0.9.1" diff --git a/src/app/app.component.html b/src/app/app.component.html index f0de6ea..41003ed 100644 --- a/src/app/app.component.html +++ b/src/app/app.component.html @@ -1,6 +1,5 @@
- - - + +
diff --git a/src/app/shared/shared-components/landing-page/landing-page.component.ts b/src/app/shared/shared-components/landing-page/landing-page.component.ts index cfdf295..e07c558 100644 --- a/src/app/shared/shared-components/landing-page/landing-page.component.ts +++ b/src/app/shared/shared-components/landing-page/landing-page.component.ts @@ -4,6 +4,7 @@ import { Router } from '@angular/router'; // import { PrelaunchService } from '../prelaunch.service'; // import { CookieService } from 'src/app/shared/services/cookie.service'; import { MatSnackBar, MatBottomSheet, MatDialog } from '@angular/material'; +import { LocationPopupComponent } from '../location-popup/location-popup.component'; // import { LocationPopupComponent } from '../location-popup/location-popup.component'; @Component({ @@ -96,14 +97,14 @@ export class LandingPageComponent implements OnInit, OnDestroy { } onSubmitButtonClick() { - // const disRef = this.bottomsheet.open(LocationPopupComponent, { - // data: { - // isLocationNotAllowed: false, - // } - // }); - // disRef.afterDismissed().subscribe(() => { - // this.setCurrentLocation(); - // }); + const disRef = this.bottomsheet.open(LocationPopupComponent, { + data: { + isLocationNotAllowed: false, + } + }); + disRef.afterDismissed().subscribe(() => { + this.setCurrentLocation(); + }); } setCurrentLocation() { @@ -113,7 +114,6 @@ export class LandingPageComponent implements OnInit, OnDestroy { position => { const latitude = position.coords.latitude; const longitude = position.coords.longitude; - // this.cookieService.setLocationPermissionStatus(true); // this.prelaunchService.setLocationData(latitude, longitude); this.router.navigate(['login-signup']); }, @@ -121,12 +121,11 @@ export class LandingPageComponent implements OnInit, OnDestroy { // User blocked location // LocationPopupComponent if (error.code === 1) { - // this.bottomsheet.open(LocationPopupComponent, { - // data: { - // isLocationNotAllowed: true, - // } - // }); - // this.cookieService.setLocationPermissionStatus(false); + this.bottomsheet.open(LocationPopupComponent, { + data: { + isLocationNotAllowed: true, + } + }); } console.log(error); } diff --git a/src/app/shared/shared-components/location-dialog/location-dialog.component.html b/src/app/shared/shared-components/location-dialog/location-dialog.component.html new file mode 100644 index 0000000..0080e1b --- /dev/null +++ b/src/app/shared/shared-components/location-dialog/location-dialog.component.html @@ -0,0 +1,13 @@ +
+
+ +
+
+ +

Step: {{ browser.step }}

+ +

{{ browser.text }}

+
+
diff --git a/src/app/shared/shared-components/location-dialog/location-dialog.component.scss b/src/app/shared/shared-components/location-dialog/location-dialog.component.scss new file mode 100644 index 0000000..1eb9441 --- /dev/null +++ b/src/app/shared/shared-components/location-dialog/location-dialog.component.scss @@ -0,0 +1,28 @@ +.locationdialog-conatiner { + position: relative; + padding: 15px 10px; + .cross { + position: absolute; + right: 5px; + top: -5px; + margin: 20px; + width: 20px; + height: 20px; + } + background-color: #f6f6f6; + overflow-y: auto; + overflow-x: hidden; + max-height: 75vh; + .browser-content { + margin: 15px 0px; + img { + width: 100%; + height: auto; + } + h3 { + font-weight: bolder; + text-decoration: underline; + text-align: center; + } + } +} diff --git a/src/app/shared/shared-components/location-dialog/location-dialog.component.ts b/src/app/shared/shared-components/location-dialog/location-dialog.component.ts new file mode 100644 index 0000000..ad49ffb --- /dev/null +++ b/src/app/shared/shared-components/location-dialog/location-dialog.component.ts @@ -0,0 +1,143 @@ +import { Component, OnInit } from '@angular/core'; +import { DeviceDetectorService } from 'ngx-device-detector'; +import { MatBottomSheetRef } from '@angular/material'; + +export const BROWSERS = { + CHROME: 'Chrome', + FIREFOX: 'Firefox', + SAFARI: 'Safari', + OPERA: 'Opera', + IE: 'IE', + MS_EDGE: 'MS-Edge', + MS_EDGE_CHROMIUM: 'MS-Edge-Chromium', + FB_MESSANGER: 'FB-Messanger', + SAMSUNG: 'Samsung', + UCBROWSER: 'UC-Browser', + UNKNOWN: 'Unknown' +}; +@Component({ + selector: 'app-location-dialog', + templateUrl: './location-dialog.component.html', + styleUrls: ['./location-dialog.component.scss'], +}) +export class LocationDialogComponent implements OnInit { + selectedBrowser = []; + stepsMap = { + [BROWSERS.CHROME]: [ + { + step: '1', + image: 'https://password-managers.bestreviews.net/files/six-web-browsers.png', + text: "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's.", + }, + { + step: '2', + image: 'https://password-managers.bestreviews.net/files/six-web-browsers.png', + text: "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's.", + }, + { + step: '3', + image: 'https://password-managers.bestreviews.net/files/six-web-browsers.png', + text: "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's.", + }, + ], + [BROWSERS.MS_EDGE]: [ + { + step: '1', + image: 'https://password-managers.bestreviews.net/files/six-web-browsers.png', + text: "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's.", + }, + { + step: '2', + image: 'https://password-managers.bestreviews.net/files/six-web-browsers.png', + text: "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's.", + }, + { + step: '3', + image: 'https://password-managers.bestreviews.net/files/six-web-browsers.png', + text: "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's.", + }, + ], + [BROWSERS.FIREFOX]: [ + { + step: '1', + image: 'https://password-managers.bestreviews.net/files/six-web-browsers.png', + text: "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's.", + }, + { + step: '2', + image: 'https://password-managers.bestreviews.net/files/six-web-browsers.png', + text: "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's.", + }, + { + step: '3', + image: 'https://password-managers.bestreviews.net/files/six-web-browsers.png', + text: "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's.", + }, + ], + [BROWSERS.SAFARI]: [ + { + step: '1', + image: 'https://password-managers.bestreviews.net/files/six-web-browsers.png', + text: "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's.", + }, + { + step: '2', + image: 'https://password-managers.bestreviews.net/files/six-web-browsers.png', + text: "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's.", + }, + { + step: '3', + image: 'https://password-managers.bestreviews.net/files/six-web-browsers.png', + text: "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's.", + }, + ], + [BROWSERS.UNKNOWN]: [ + { + step: '1', + image: 'https://password-managers.bestreviews.net/files/six-web-browsers.png', + text: "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's.", + }, + { + step: '2', + image: 'https://password-managers.bestreviews.net/files/six-web-browsers.png', + text: "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's.", + }, + { + step: '3', + image: 'https://password-managers.bestreviews.net/files/six-web-browsers.png', + text: "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's.", + }, + ], + }; + + chrome = [ + { + step: '1', + image: 'https://password-managers.bestreviews.net/files/six-web-browsers.png', + text: "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's.", + }, + { + step: '2', + image: 'https://password-managers.bestreviews.net/files/six-web-browsers.png', + text: "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's.", + }, + { + step: '3', + image: 'https://password-managers.bestreviews.net/files/six-web-browsers.png', + text: "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's.", + }, + ]; + deviceInfo: any; + + constructor(private deviceService: DeviceDetectorService, private bottomRef: MatBottomSheetRef) {} + + ngOnInit() { + console.log('hello `Home` component'); + this.deviceInfo = this.deviceService.getDeviceInfo(); + this.selectedBrowser = this.stepsMap[this.deviceInfo.browser]; + } + + closePage() { + this.bottomRef.dismiss(); + } +} diff --git a/src/app/shared/shared-components/location-popup/location-popup.component.html b/src/app/shared/shared-components/location-popup/location-popup.component.html new file mode 100644 index 0000000..45d4540 --- /dev/null +++ b/src/app/shared/shared-components/location-popup/location-popup.component.html @@ -0,0 +1,10 @@ +
+ gift +
{{ 'MAIN_PAGE.OFFER_NEAR_ME' | translate }}
+ +
+
+ gift +
{{ 'MAIN_PAGE.NEED_LOCATION_FOR_OFFER' | translate }}
+ +
diff --git a/src/app/shared/shared-components/location-popup/location-popup.component.scss b/src/app/shared/shared-components/location-popup/location-popup.component.scss new file mode 100644 index 0000000..4f74504 --- /dev/null +++ b/src/app/shared/shared-components/location-popup/location-popup.component.scss @@ -0,0 +1,9 @@ +.location-popup-content-area{ + display: flex; + flex-flow: column; + padding: 10px; + .content{ + padding: 13px; + text-align: center; + } +} diff --git a/src/app/shared/shared-components/location-popup/location-popup.component.ts b/src/app/shared/shared-components/location-popup/location-popup.component.ts new file mode 100644 index 0000000..8490fd1 --- /dev/null +++ b/src/app/shared/shared-components/location-popup/location-popup.component.ts @@ -0,0 +1,44 @@ +import { Component, OnInit, Inject } from '@angular/core'; +import { MatDialog, MatBottomSheetRef, MAT_DIALOG_DATA, MAT_BOTTOM_SHEET_DATA, MatBottomSheet } from '@angular/material'; +import { LocationDialogComponent } from '../location-dialog/location-dialog.component'; + +@Component({ + selector: 'app-location-popup', + templateUrl: './location-popup.component.html', + styleUrls: ['./location-popup.component.scss'] +}) +export class LocationPopupComponent implements OnInit { + isLocationNotAllowed = false; + constructor(private bottomSheet: MatBottomSheet, + private bottomSheetRef: MatBottomSheetRef, + @Inject(MAT_BOTTOM_SHEET_DATA) public data: any) { + this.isLocationNotAllowed = data.isLocationNotAllowed; + } + + ngOnInit() { + } + + gotoHelpForLocation() { + console.log('goto help'); + this.bottomSheetRef.dismiss(); + this.openDialog(); + } + + openDialog(): void { + const dialogRef = this.bottomSheet.open(LocationDialogComponent, { + data: null, + }); + + dialogRef.afterDismissed().subscribe((result) => { + // Navigate to page + console.log('The dialog was closed', result); + }); + } + + onAllow() { + this.bottomSheetRef.dismiss(); + } + + + +} diff --git a/src/app/shared/shared-components/shared-components.module.ts b/src/app/shared/shared-components/shared-components.module.ts index 5806bde..604e734 100644 --- a/src/app/shared/shared-components/shared-components.module.ts +++ b/src/app/shared/shared-components/shared-components.module.ts @@ -4,16 +4,19 @@ import { SplashScreenComponent } from './splash-screen/splash-screen.component'; import { LandingPageComponent } from './landing-page/landing-page.component'; import { MaterialModule } from '../material-module/material.module'; import { TranslateModule } from '@ngx-translate/core'; +import { LocationDialogComponent } from './location-dialog/location-dialog.component'; +import { LocationPopupComponent } from './location-popup/location-popup.component'; @NgModule({ - declarations: [SplashScreenComponent, LandingPageComponent], + declarations: [SplashScreenComponent, LandingPageComponent, LocationPopupComponent, LocationDialogComponent], imports: [ CommonModule, MaterialModule, TranslateModule.forChild() ], + entryComponents: [LocationPopupComponent, LocationDialogComponent], exports: [SplashScreenComponent, LandingPageComponent] }) export class SharedComponentsModule { } diff --git a/src/assets/img/sad.svg b/src/assets/img/sad.svg new file mode 100644 index 0000000..2d21c05 --- /dev/null +++ b/src/assets/img/sad.svg @@ -0,0 +1,2 @@ + + diff --git a/src/favicon.ico b/src/favicon.ico deleted file mode 100644 index 997406a..0000000 Binary files a/src/favicon.ico and /dev/null differ diff --git a/src/favicon.png b/src/favicon.png new file mode 100644 index 0000000..b30a19f Binary files /dev/null and b/src/favicon.png differ diff --git a/src/index.html b/src/index.html index 260d341..7e25592 100644 --- a/src/index.html +++ b/src/index.html @@ -5,7 +5,7 @@ Zataakse - +