CHE-5853: add auto scroll feature on workspace creation page. (#6625)

Signed-off-by: Oleksii Kurinnyi <okurinnyi@codenvy.com>
6.19.x
Oleksii Kurinnyi 2017-10-11 10:17:20 +03:00 committed by GitHub
parent 3b7e8ec17e
commit a6faa9a0bd
2 changed files with 21 additions and 5 deletions

View File

@ -52,6 +52,11 @@ export class ProjectSourceSelectorController {
* ID of active button.
*/
private activeButtonId: string;
/**
* <code>true</code> if content has to be scrolled to bottom.
* @type {boolean}
*/
private scrollToBottom: boolean = true;
/**
* Default constructor that is using resource injection
@ -142,7 +147,8 @@ export class ProjectSourceSelectorController {
this.activeActionType = actionType;
this.selectedProjectTemplate = angular.copy(template);
this.$scope.updateWidget(this.activeButtonId);
this.$scope.updateWidget(this.activeButtonId, this.scrollToBottom);
this.scrollToBottom = false;
}
/**

View File

@ -11,7 +11,7 @@
'use strict';
export interface IProjectSourceSelectorScope extends ng.IScope {
updateWidget(activeButtonId: string): void;
updateWidget: (activeButtonId: string, scrollWidgetInView: boolean) => void;
}
/**
@ -42,8 +42,8 @@ export class ProjectSourceSelector implements ng.IDirective {
this.$timeout = $timeout;
}
link($scope: IProjectSourceSelectorScope, $element: ng.IAugmentedJQuery): void {
$scope.updateWidget = (activeButtonId: string) => {
link($scope: IProjectSourceSelectorScope, $element: ng.IAugmentedJQuery): void {
$scope.updateWidget = (activeButtonId: string, scrollToBottom: boolean) => {
this.$timeout(() => {
const popover = $element.find('.project-source-selector-popover'),
arrow = popover.find('.arrow'),
@ -54,7 +54,7 @@ link($scope: IProjectSourceSelectorScope, $element: ng.IAugmentedJQuery): void {
return;
}
const widgetHeight = $element.height();
let top = selectButton.position().top + (selectButton.height() / 2);
const top = selectButton.position().top + (selectButton.height() / 2);
const popoverHeight = popover.height();
if (popoverHeight < top) {
@ -69,6 +69,16 @@ link($scope: IProjectSourceSelectorScope, $element: ng.IAugmentedJQuery): void {
popover.attr('style', 'top: 0px;');
arrow.attr('style', `top: ${top}px;`);
}
if (scrollToBottom === false) {
return;
}
// scroll to bottom of the page
// to make 'Create' button visible
const mdContent = $element.closest('md-content'),
mdContentHeight = mdContent.height();
mdContent.scrollTop(mdContentHeight);
});
};
}