From 284c8e5b6c133a8e9a797d66cbf95d1c6b7a1859 Mon Sep 17 00:00:00 2001 From: David Guardado Date: Tue, 5 May 2020 19:13:29 -0400 Subject: [PATCH 1/3] Update project to Angular 8 and Ionic 5. --- package.json | 48 +++++++++---------- .../ionic-timepicker-modal.component.ts | 8 ++-- src/app/app.component.html | 6 +-- src/app/home/home.module.ts | 4 +- src/app/reactive-form/reactive-form.module.ts | 4 +- .../template-driven-form.module.ts | 4 +- .../timepicker-button.module.ts | 3 +- .../timepicker-button.page.ts | 6 ++- .../timepicker-component.module.ts | 4 +- .../timepicker-directive.module.ts | 4 +- 10 files changed, 47 insertions(+), 44 deletions(-) diff --git a/package.json b/package.json index acfb29f..1ae1459 100755 --- a/package.json +++ b/package.json @@ -19,46 +19,46 @@ }, "private": true, "dependencies": { - "@angular/common": "^7.2.2", - "@angular/core": "^7.2.2", - "@angular/forms": "^7.2.2", + "@angular/common": "~8.1.2", + "@angular/core": "~8.1.2", + "@angular/forms": "~8.1.2", "@angular/http": "^7.2.2", - "@angular/platform-browser": "^7.2.2", - "@angular/platform-browser-dynamic": "^7.2.2", - "@angular/router": "^7.2.2", + "@angular/platform-browser": "~8.1.2", + "@angular/platform-browser-dynamic": "~8.1.2", + "@angular/router": "~8.1.2", "@ionic-native/core": "^5.0.0", - "@ionic-native/device": "^5.5.1", + "@ionic-native/device": "^5.21.5", "@ionic-native/splash-screen": "^5.0.0", "@ionic-native/status-bar": "^5.0.0", - "@ionic/angular": "^4.1.0", + "@ionic/angular": "^5.0.1", "core-js": "^2.5.4", "moment": "^2.24.0", "rxjs": "~6.5.1", - "zone.js": "~0.8.29", + "zone.js": "~0.9.1", "tslib": "^1.9.0" }, "devDependencies": { - "@angular-devkit/architect": "~0.13.8", - "@angular-devkit/build-angular": "~0.13.8", + "@angular-devkit/architect": "~0.801.2", + "@angular-devkit/build-angular": "~0.801.2", "@angular-devkit/build-ng-packagr": "~0.11.0", - "@angular-devkit/core": "~7.3.8", - "@angular-devkit/schematics": "~7.3.8", - "@angular/cli": "~7.3.8", - "@angular/compiler": "~7.2.2", - "@angular/compiler-cli": "~7.2.2", - "@angular/language-service": "~7.2.2", - "@ionic/angular-toolkit": "~1.5.1", - "@types/jasmine": "~2.8.8", + "@angular-devkit/core": "~8.1.2", + "@angular-devkit/schematics": "~8.1.2", + "@angular/cli": "~8.1.2", + "@angular/compiler": "~8.1.2", + "@angular/compiler-cli": "~8.1.2", + "@angular/language-service": "~8.1.2", + "@ionic/angular-toolkit": "~2.2.0", + "@types/jasmine": "~3.3.8", "@types/jasminewd2": "~2.0.3", "@types/node": "~12.0.0", - "codelyzer": "~4.5.0", - "jasmine-core": "~2.99.1", + "codelyzer": "~5.0.0", + "jasmine-core": "~3.4.0", "jasmine-spec-reporter": "~4.2.1", "karma": "~4.1.0", "karma-chrome-launcher": "~2.2.0", "karma-coverage-istanbul-reporter": "~2.0.1", - "karma-jasmine": "~1.1.2", - "karma-jasmine-html-reporter": "^0.2.2", + "karma-jasmine": "~2.0.1", + "karma-jasmine-html-reporter": "^1.4.0", "ng-packagr": "^4.2.0", "node-sass": "^4.12.0", "protractor": "~5.4.0", @@ -66,7 +66,7 @@ "tsickle": ">=0.29.0", "tslib": "^1.9.0", "tslint": "~5.16.0", - "typescript": "~3.1.6" + "typescript": "~3.4.3" }, "description": "An Ionic project" } diff --git a/projects/ionic-timepicker/src/lib/ionic-timepicker-modal/ionic-timepicker-modal.component.ts b/projects/ionic-timepicker/src/lib/ionic-timepicker-modal/ionic-timepicker-modal.component.ts index 6c2315d..6bdd2dd 100644 --- a/projects/ionic-timepicker/src/lib/ionic-timepicker-modal/ionic-timepicker-modal.component.ts +++ b/projects/ionic-timepicker/src/lib/ionic-timepicker-modal/ionic-timepicker-modal.component.ts @@ -16,10 +16,10 @@ const moment = moment_; export class IonicTimepickerModalComponent implements OnInit, OnDestroy { - @ViewChild('sliderHours') sliderHours: IonSlides; - @ViewChild('sliderMinutes') sliderMinutes: IonSlides; - @ViewChild('sliderSeconds') sliderSeconds: IonSlides; - @ViewChild('sliderMeridian') sliderMeridian: IonSlides; + @ViewChild('sliderHours', { static: false }) sliderHours: IonSlides; + @ViewChild('sliderMinutes', { static: false }) sliderMinutes: IonSlides; + @ViewChild('sliderSeconds', { static: false }) sliderSeconds: IonSlides; + @ViewChild('sliderMeridian', { static: false }) sliderMeridian: IonSlides; hoursArray: any = []; minutesArray: any = []; diff --git a/src/app/app.component.html b/src/app/app.component.html index ed45b25..36efbfc 100755 --- a/src/app/app.component.html +++ b/src/app/app.component.html @@ -1,6 +1,6 @@ - - + + Menu @@ -18,6 +18,6 @@ - + \ No newline at end of file diff --git a/src/app/home/home.module.ts b/src/app/home/home.module.ts index 588bb1e..67eb2ab 100644 --- a/src/app/home/home.module.ts +++ b/src/app/home/home.module.ts @@ -5,8 +5,8 @@ import { IonicModule } from '@ionic/angular'; import { RouterModule } from '@angular/router'; import { HomePage } from './home.page'; -// import { IonicTimepickerModule } from '../../../projects/ionic-timepicker/src/lib/ionic-timepicker.module'; -import { IonicTimepickerModule } from 'ionic-timepicker'; +import { IonicTimepickerModule } from '../../../projects/ionic-timepicker/src/lib/ionic-timepicker.module'; +// import { IonicTimepickerModule } from 'ionic-timepicker'; @NgModule({ imports: [ diff --git a/src/app/reactive-form/reactive-form.module.ts b/src/app/reactive-form/reactive-form.module.ts index 4fee487..74a037e 100644 --- a/src/app/reactive-form/reactive-form.module.ts +++ b/src/app/reactive-form/reactive-form.module.ts @@ -6,8 +6,8 @@ import { Routes, RouterModule } from '@angular/router'; import { IonicModule } from '@ionic/angular'; import { ReactiveFormPage } from './reactive-form.page'; -// import { IonicTimepickerModule } from '../../../projects/ionic-timepicker/src/lib/ionic-timepicker.module'; -import { IonicTimepickerModule } from 'ionic-timepicker'; +import { IonicTimepickerModule } from '../../../projects/ionic-timepicker/src/lib/ionic-timepicker.module'; +// import { IonicTimepickerModule } from 'ionic-timepicker'; const routes: Routes = [ { diff --git a/src/app/template-driven-form/template-driven-form.module.ts b/src/app/template-driven-form/template-driven-form.module.ts index d4c4a1d..22b025e 100644 --- a/src/app/template-driven-form/template-driven-form.module.ts +++ b/src/app/template-driven-form/template-driven-form.module.ts @@ -4,8 +4,8 @@ import { FormsModule } from '@angular/forms'; import { Routes, RouterModule } from '@angular/router'; import { IonicModule } from '@ionic/angular'; import { TemplateDrivenFormPage } from './template-driven-form.page'; -// import { IonicTimepickerModule } from '../../../projects/ionic-timepicker/src/lib/ionic-timepicker.module'; -import { IonicTimepickerModule } from 'ionic-timepicker'; +import { IonicTimepickerModule } from '../../../projects/ionic-timepicker/src/lib/ionic-timepicker.module'; +// import { IonicTimepickerModule } from 'ionic-timepicker'; const routes: Routes = [ { diff --git a/src/app/timepicker-button/timepicker-button.module.ts b/src/app/timepicker-button/timepicker-button.module.ts index 36a50d6..3772359 100644 --- a/src/app/timepicker-button/timepicker-button.module.ts +++ b/src/app/timepicker-button/timepicker-button.module.ts @@ -6,7 +6,8 @@ import { Routes, RouterModule } from '@angular/router'; import { IonicModule } from '@ionic/angular'; import { TimepickerButtonPage } from './timepicker-button.page'; -import { IonicTimepickerModule } from 'ionic-timepicker'; +import { IonicTimepickerModule } from '../../../projects/ionic-timepicker/src/lib/ionic-timepicker.module'; +// import { IonicTimepickerModule } from 'ionic-timepicker'; const routes: Routes = [ { diff --git a/src/app/timepicker-button/timepicker-button.page.ts b/src/app/timepicker-button/timepicker-button.page.ts index aca28ec..bbbe9f2 100644 --- a/src/app/timepicker-button/timepicker-button.page.ts +++ b/src/app/timepicker-button/timepicker-button.page.ts @@ -1,7 +1,9 @@ import { Component, OnInit } from '@angular/core'; import { ModalController } from '@ionic/angular'; -import { IonicTimepickerModule } from 'ionic-timepicker'; -import { IonicTimepickerModalComponent } from 'ionic-timepicker'; +// import { IonicTimepickerModule } from 'ionic-timepicker'; +import { IonicTimepickerModule } from '../../../projects/ionic-timepicker/src/lib/ionic-timepicker.module'; +// import { IonicTimepickerModalComponent } from 'ionic-timepicker'; +import { IonicTimepickerModalComponent } from '../../../projects/ionic-timepicker/src/lib/ionic-timepicker-modal/ionic-timepicker-modal.component'; @Component({ selector: 'app-timepicker-button', diff --git a/src/app/timepicker-component/timepicker-component.module.ts b/src/app/timepicker-component/timepicker-component.module.ts index 15b32a1..9d03c2d 100644 --- a/src/app/timepicker-component/timepicker-component.module.ts +++ b/src/app/timepicker-component/timepicker-component.module.ts @@ -6,8 +6,8 @@ import { Routes, RouterModule } from '@angular/router'; import { IonicModule } from '@ionic/angular'; import { TimepickerComponentPage } from './timepicker-component.page'; -// import { IonicTimepickerModule } from '../../../projects/ionic-timepicker/src/lib/ionic-timepicker.module'; -import { IonicTimepickerModule } from 'ionic-timepicker'; +import { IonicTimepickerModule } from '../../../projects/ionic-timepicker/src/lib/ionic-timepicker.module'; +// import { IonicTimepickerModule } from 'ionic-timepicker'; const routes: Routes = [ { diff --git a/src/app/timepicker-directive/timepicker-directive.module.ts b/src/app/timepicker-directive/timepicker-directive.module.ts index 50996a2..31e5d4a 100644 --- a/src/app/timepicker-directive/timepicker-directive.module.ts +++ b/src/app/timepicker-directive/timepicker-directive.module.ts @@ -4,8 +4,8 @@ import { FormsModule } from '@angular/forms'; import { Routes, RouterModule } from '@angular/router'; import { IonicModule } from '@ionic/angular'; import { TimepickerDirectivePage } from './timepicker-directive.page'; -// import { IonicTimepickerModule } from '../../../projects/ionic-timepicker/src/lib/ionic-timepicker.module'; -import { IonicTimepickerModule } from 'ionic-timepicker'; +import { IonicTimepickerModule } from '../../../projects/ionic-timepicker/src/lib/ionic-timepicker.module'; +// import { IonicTimepickerModule } from 'ionic-timepicker'; const routes: Routes = [ { From 884a9103bc1da219dbef552a7c074245e02ff3d3 Mon Sep 17 00:00:00 2001 From: David Guardado Date: Tue, 5 May 2020 19:16:34 -0400 Subject: [PATCH 2/3] Fix error that occurred when hour, minute or seconds was selected. --- .../ionic-timepicker-modal.component.scss | 2 +- .../ionic-timepicker-modal.component.ts | 24 ++++++++++++++++--- 2 files changed, 22 insertions(+), 4 deletions(-) diff --git a/projects/ionic-timepicker/src/lib/ionic-timepicker-modal/ionic-timepicker-modal.component.scss b/projects/ionic-timepicker/src/lib/ionic-timepicker-modal/ionic-timepicker-modal.component.scss index 986ac86..f0f68b7 100644 --- a/projects/ionic-timepicker/src/lib/ionic-timepicker-modal/ionic-timepicker-modal.component.scss +++ b/projects/ionic-timepicker/src/lib/ionic-timepicker-modal/ionic-timepicker-modal.component.scss @@ -22,7 +22,7 @@ } ion-footer { - height: 44px; + height: 57px; ion-toolbar { --min-height: 100%; diff --git a/projects/ionic-timepicker/src/lib/ionic-timepicker-modal/ionic-timepicker-modal.component.ts b/projects/ionic-timepicker/src/lib/ionic-timepicker-modal/ionic-timepicker-modal.component.ts index 6bdd2dd..09264c7 100644 --- a/projects/ionic-timepicker/src/lib/ionic-timepicker-modal/ionic-timepicker-modal.component.ts +++ b/projects/ionic-timepicker/src/lib/ionic-timepicker-modal/ionic-timepicker-modal.component.ts @@ -115,17 +115,35 @@ export class IonicTimepickerModalComponent implements OnInit, OnDestroy { // get slider hours active index onChangeHoursSlide(event) { - this.sliderHoursActiveIndex = event.target.swiper.realIndex; + if (event.target.swiper.previousIndex === 0 && this.selectedTime === undefined) { + this.sliderHoursActiveIndex = event.target.swiper.realIndex; + } else if( event.target.swiper.previousIndex === 0){ + this.sliderHoursActiveIndex = event.target.swiper.realIndex - event.target.swiper.loopedSlides; + } else { + this.sliderHoursActiveIndex = event.target.swiper.realIndex; + } } // get slider minutes active index onChangeMinutesSlide(event) { - this.sliderMinutesActiveIndex = event.target.swiper.realIndex; + if (event.target.swiper.previousIndex === 0 && this.selectedTime === undefined) { + this.sliderMinutesActiveIndex = event.target.swiper.realIndex; + } else if( event.target.swiper.previousIndex === 0){ + this.sliderMinutesActiveIndex = event.target.swiper.realIndex - event.target.swiper.loopedSlides; + } else { + this.sliderMinutesActiveIndex = event.target.swiper.realIndex; + } } // get slider seconds active index onChangeSecondsSlide(event) { - this.sliderSecondsActiveIndex = event.target.swiper.realIndex; + if (event.target.swiper.previousIndex === 0 && this.selectedTime === undefined) { + this.sliderSecondsActiveIndex = event.target.swiper.realIndex; + } else if( event.target.swiper.previousIndex === 0){ + this.sliderSecondsActiveIndex = event.target.swiper.realIndex - event.target.swiper.loopedSlides; + } else { + this.sliderSecondsActiveIndex = event.target.swiper.realIndex; + } } // get slider seconds active index From 0cda1e4f05a77c562174e249bc5ccf1c2c81b36c Mon Sep 17 00:00:00 2001 From: David Guardado Date: Wed, 6 May 2020 09:50:50 -0400 Subject: [PATCH 3/3] Fix bug that happened when time was 00:00 --- .../ionic-timepicker-modal.component.ts | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/projects/ionic-timepicker/src/lib/ionic-timepicker-modal/ionic-timepicker-modal.component.ts b/projects/ionic-timepicker/src/lib/ionic-timepicker-modal/ionic-timepicker-modal.component.ts index 09264c7..eaabbcd 100644 --- a/projects/ionic-timepicker/src/lib/ionic-timepicker-modal/ionic-timepicker-modal.component.ts +++ b/projects/ionic-timepicker/src/lib/ionic-timepicker-modal/ionic-timepicker-modal.component.ts @@ -93,7 +93,7 @@ export class IonicTimepickerModalComponent implements OnInit, OnDestroy { inItTimePicker(): Observable { const myObservable = new Observable(observer => { if (this.navParams.get('selectedTime')) { - console.log('Selected time =>', this.navParams.get('selectedTime')); + // console.log('Selected time =>', this.navParams.get('selectedTime')); this.selectedTime = this.navParams.get('selectedTime'); } this.mainObj = this.initTimePickerObject(this.navParams.get('objConfig')); @@ -117,7 +117,7 @@ export class IonicTimepickerModalComponent implements OnInit, OnDestroy { onChangeHoursSlide(event) { if (event.target.swiper.previousIndex === 0 && this.selectedTime === undefined) { this.sliderHoursActiveIndex = event.target.swiper.realIndex; - } else if( event.target.swiper.previousIndex === 0){ + } else if ( event.target.swiper.previousIndex === 0 && event.target.swiper.realIndex !== 0) { this.sliderHoursActiveIndex = event.target.swiper.realIndex - event.target.swiper.loopedSlides; } else { this.sliderHoursActiveIndex = event.target.swiper.realIndex; @@ -128,7 +128,7 @@ export class IonicTimepickerModalComponent implements OnInit, OnDestroy { onChangeMinutesSlide(event) { if (event.target.swiper.previousIndex === 0 && this.selectedTime === undefined) { this.sliderMinutesActiveIndex = event.target.swiper.realIndex; - } else if( event.target.swiper.previousIndex === 0){ + } else if ( event.target.swiper.previousIndex === 0 && event.target.swiper.realIndex !== 0) { this.sliderMinutesActiveIndex = event.target.swiper.realIndex - event.target.swiper.loopedSlides; } else { this.sliderMinutesActiveIndex = event.target.swiper.realIndex; @@ -139,7 +139,7 @@ export class IonicTimepickerModalComponent implements OnInit, OnDestroy { onChangeSecondsSlide(event) { if (event.target.swiper.previousIndex === 0 && this.selectedTime === undefined) { this.sliderSecondsActiveIndex = event.target.swiper.realIndex; - } else if( event.target.swiper.previousIndex === 0){ + } else if ( event.target.swiper.previousIndex === 0 && event.target.swiper.realIndex !== 0) { this.sliderSecondsActiveIndex = event.target.swiper.realIndex - event.target.swiper.loopedSlides; } else { this.sliderSecondsActiveIndex = event.target.swiper.realIndex;