From 1f6434658469bd15aebcafc9b3326aa31d94fe50 Mon Sep 17 00:00:00 2001
From: Roman Hotsiy <gotsijroman@gmail.com>
Date: Wed, 2 Nov 2016 11:37:33 +0200
Subject: [PATCH] Fix content scrolling on language switch (#130)

---
 .../RequestSamples/request-samples.ts          | 18 +++++++++++++++---
 lib/services/scroll.service.ts                 | 13 +++++++++----
 2 files changed, 24 insertions(+), 7 deletions(-)

diff --git a/lib/components/RequestSamples/request-samples.ts b/lib/components/RequestSamples/request-samples.ts
index 049e536b..b0ebda94 100644
--- a/lib/components/RequestSamples/request-samples.ts
+++ b/lib/components/RequestSamples/request-samples.ts
@@ -1,14 +1,14 @@
 'use strict';
 
 import { Component, ViewChildren, QueryList, Input,
- ChangeDetectionStrategy, OnInit, HostBinding } from '@angular/core';
+ ChangeDetectionStrategy, OnInit, HostBinding, ElementRef, NgZone } from '@angular/core';
 
 import { Subject } from 'rxjs/Subject';
 
 import { BaseComponent, SpecManager } from '../base';
 import JsonPointer from '../../utils/JsonPointer';
 import { Tabs } from '../../shared/components/index';
-import { AppStateService } from '../../services/index';
+import { AppStateService, ScrollService } from '../../services/index';
 
 @Component({
   selector: 'request-samples',
@@ -26,14 +26,26 @@ export class RequestSamples extends BaseComponent implements OnInit {
   selectedLang: Subject<any>;
   samples: Array<any>;
 
-  constructor(specMgr:SpecManager, public appState:AppStateService) {
+  constructor(
+    specMgr:SpecManager,
+    public appState:AppStateService,
+    private scrollService: ScrollService,
+    private el: ElementRef,
+    private zone: NgZone
+  ) {
     super(specMgr);
 
     this.selectedLang = this.appState.samplesLanguage;
   }
 
   changeLangNotify(lang) {
+    let relativeScrollPos = this.scrollService.relativeScrollPos(this.el.nativeElement);
     this.selectedLang.next(lang);
+    // do scroll in the end of VM turn to have it seamless
+    let subscription = this.zone.onMicrotaskEmpty.subscribe(() => {
+      this.scrollService.scrollTo(this.el.nativeElement, relativeScrollPos);
+      subscription.unsubscribe();
+    });
   }
 
   init() {
diff --git a/lib/services/scroll.service.ts b/lib/services/scroll.service.ts
index 6b20feab..4134cce7 100644
--- a/lib/services/scroll.service.ts
+++ b/lib/services/scroll.service.ts
@@ -42,17 +42,22 @@ export class ScrollService {
     return INVIEW_POSITION.INVIEW;
   }
 
-  scrollTo($el) {
+  scrollTo($el, offset:number = 0) {
     // TODO: rewrite this to use offsetTop as more reliable solution
     let subjRect = $el.getBoundingClientRect();
-    let offset = this.scrollY() + subjRect.top - this.scrollYOffset() + 1;
+    let posY = this.scrollY() + subjRect.top - this.scrollYOffset() + offset + 1;
     if (this.$scrollParent.scrollTo) {
-      this.$scrollParent.scrollTo(0, offset);
+      this.$scrollParent.scrollTo(0, posY);
     } else {
-      this.$scrollParent.scrollTop = offset;
+      this.$scrollParent.scrollTop = posY;
     }
   }
 
+  relativeScrollPos($el) {
+    let subjRect = $el.getBoundingClientRect();
+    return - subjRect.top + this.scrollYOffset() - 1;
+  }
+
   scrollHandler(evt) {
     let isScrolledDown = (this.scrollY() - this.prevOffsetY > 0);
     this.prevOffsetY = this.scrollY();