Skip to content

Commit cc07dde

Browse files
authored
Merge pull request #8 from d0peCode/improve-swiper
Improve swiper
2 parents a676708 + 8f85896 commit cc07dde

File tree

5 files changed

+48
-14
lines changed

5 files changed

+48
-14
lines changed

public/src/app/components/landing/contact/contact.component.scss

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,11 @@
1919

2020
&__image {
2121
max-width: 100%;
22+
23+
@media only screen and (max-width: 768px) {
24+
max-width: 65%;
25+
margin-left: 17.5%;
26+
}
2227
}
2328

2429
&__header {

public/src/app/components/landing/skills/skills.component.ts

Lines changed: 25 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import { Component, OnInit, AfterViewInit } from '@angular/core';
22
import Swiper from 'swiper';
3+
import {StoreService} from '../../../services/store.service';
34

45
@Component({
56
selector: 'app-skills',
@@ -54,17 +55,13 @@ export class SkillsComponent implements OnInit {
5455

5556
slidesPerView = 3;
5657

57-
constructor() {}
58+
constructor(private storeService: StoreService) {}
5859

5960
ngAfterViewInit() {
60-
this.mySwiper = new Swiper('.skills__body', {
61-
paginationClickable: false,
62-
grabCursor: true,
63-
loop: false,
64-
slidesPerView: this.slidesPerView
65-
});
61+
this.initSwiper();
62+
this.mySwiper.destroy();
63+
setTimeout(() => { this.initSwiper(); }, 20);
6664
}
67-
6865
previousSlide() {
6966
this.mySwiper.slidePrev();
7067
}
@@ -78,12 +75,30 @@ export class SkillsComponent implements OnInit {
7875
if(window.innerWidth < 600) {
7976
this.slidesPerView = 1;
8077
}
81-
if(this.mySwiper) this.mySwiper.reInit();
78+
if(this.mySwiper) this.mySwiper.update();
79+
}
80+
initSwiper() {
81+
this.mySwiper = new Swiper('.skills__body', {
82+
autoplay: 3000,
83+
paginationClickable: false,
84+
grabCursor: true,
85+
loop: true,
86+
slidesPerView: this.slidesPerView
87+
});
8288
}
83-
8489
ngOnInit() {
8590
this.handleSlidesAmount();
8691
window.addEventListener('resize', this.handleSlidesAmount);
92+
this.storeService.bhsLang.subscribe(
93+
(res) => {
94+
if (res) {
95+
console.log('destroy swiper');
96+
this.mySwiper.destroy();
97+
setTimeout(() => { this.initSwiper(); }, 20);
98+
this.storeService.setLangChanged(false);
99+
}
100+
}
101+
);
87102
}
88103

89104
}
Lines changed: 10 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,21 +1,28 @@
1-
import { Component, OnInit } from '@angular/core';
1+
import {Component, OnInit} from '@angular/core';
22
import {TranslateService} from '@ngx-translate/core';
3+
import {StoreService} from '../../../../../services/store.service';
34

45
@Component({
56
selector: 'app-flags',
67
templateUrl: './flags.component.html',
78
styleUrls: ['./flags.component.scss']
89
})
910
export class FlagsComponent implements OnInit {
11+
constructor(private translate: TranslateService, private storeService: StoreService) { }
1012

11-
constructor(private translate: TranslateService) { }
12-
13+
langChanged = false;
1314
currentLang = this.translate.currentLang;
1415
setLang = lang => {
1516
this.translate.use(lang);
1617
this.currentLang = lang;
18+
this.storeService.setLangChanged(true);
1719
}
1820

1921
ngOnInit() {
22+
this.storeService.bhsLang.subscribe(
23+
(res) => {
24+
this.langChanged = false;
25+
}
26+
);
2027
}
2128
}

public/src/app/services/store.service.ts

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,13 +2,20 @@ import {BehaviorSubject} from 'rxjs';
22

33
export class StoreService {
44
public mode = 'light';
5+
public languageChanged = false;
56
public bhs: BehaviorSubject<string>;
7+
public bhsLang: BehaviorSubject<boolean>;
68

79
constructor() {
810
this.bhs = new BehaviorSubject('light');
11+
this.bhsLang = new BehaviorSubject(false);
912
}
1013

1114
setMode(newMode: string) {
1215
this.bhs.next(newMode);
1316
}
17+
setLangChanged(val: boolean) {
18+
this.bhsLang.next(val);
19+
}
20+
1421
}

public/src/assets/i18n/en.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
{
2-
"skillsInNav": "Skills",
2+
"skillsInNav": "My skillset",
33
"valuationInNav": "Valuation",
44
"clientsInNav": "For clients",
55
"greeting": "I'm glad to see you at my site! You're welcome to take a look at my projects and contact.",

0 commit comments

Comments
 (0)