Apply auto zoom only when opening the gantt chart for the first time

pull/7167/head
Henriette Dinger 6 years ago
parent 5511bbfa83
commit 9fe7af3977
  1. 2
      frontend/src/app/components/wp-buttons/wp-timeline-toggle-button/wp-timeline-toggle-button.component.ts
  2. 23
      frontend/src/app/components/wp-fast-table/state/wp-table-timeline.service.ts
  3. 1
      frontend/src/app/components/wp-fast-table/wp-table-timeline.ts
  4. 12
      frontend/src/app/components/wp-table/timeline/container/wp-timeline-container.directive.ts
  5. 4
      spec/features/work_packages/timeline/timeline_navigation_spec.rb

@ -83,7 +83,7 @@ export class WorkPackageTimelineButtonComponent extends AbstractWorkPackageButto
return this.wpTableTimeline.isVisible;
}
public isAutoZoomEnabled():boolean {
public isAutoZoomEnabled() {
return this.wpTableTimeline.isAutoZoomEnabled();
}

@ -74,6 +74,18 @@ export class WorkPackageTableTimelineService extends WorkPackageQueryStateServic
public toggle() {
let currentState = this.current;
this.setVisible(!currentState.visible);
if (this.isAutoZoomEnabled() === undefined) {
this.toggleAutoZoomEnabled(true);
}
/**
* On first opening, activate auto zoom.
* Afterwards keep the zoom level.
*/
if (!currentState.visible && this.isAutoZoomEnabled()) {
this.toggleAutoZoom(true);
}
}
public setVisible(value:boolean) {
@ -140,8 +152,12 @@ export class WorkPackageTableTimelineService extends WorkPackageQueryStateServic
this.modify({ autoZoom: value });
}
public isAutoZoomEnabled():boolean {
return this.current.autoZoom;
public isAutoZoomEnabled():boolean|undefined {
return this.current.autoZoomEnabled;
}
public toggleAutoZoomEnabled(val = !this.current.autoZoomEnabled) {
this.modify({ autoZoomEnabled: val });
}
public get current():WorkPackageTableTimelineState {
@ -166,7 +182,8 @@ export class WorkPackageTableTimelineService extends WorkPackageQueryStateServic
private get defaultState():WorkPackageTableTimelineState {
return {
autoZoom: true,
autoZoom: false,
autoZoomEnabled: undefined,
zoomLevel: 'days',
visible: false,
labels: this.defaultLabels

@ -33,6 +33,7 @@ import {
export interface WorkPackageTableTimelineState {
autoZoom:boolean;
autoZoomEnabled:boolean|undefined;
visible:boolean;
zoomLevel:TimelineZoomLevel;
labels:TimelineLabels;

@ -124,9 +124,6 @@ export class WorkPackageTimelineTableController implements AfterViewInit, OnDest
// Refresh on changes to work packages
this.updateOnWorkPackageChanges();
// Set initial auto zoom level, if applicable
this.applyAutoZoomLevel();
// Refresh timeline rendering callback
this.setupRefreshListener();
@ -217,8 +214,11 @@ export class WorkPackageTimelineTableController implements AfterViewInit, OnDest
return;
}
// Update autozoom level
this.applyAutoZoomLevel();
if (this.wpTableTimeline.isAutoZoomEnabled()) {
// Update autozoom level
this.applyAutoZoomLevel();
}
// Require dynamic CSS to be visible
this.dynamicCssService.requireHighlighting();
@ -431,6 +431,7 @@ export class WorkPackageTimelineTableController implements AfterViewInit, OnDest
return;
}
this.wpTableTimeline.toggleAutoZoomEnabled(false);
const daysSpan = calculateDaySpan(this.workPackageIdOrder, this.states.workPackages, this._viewParameters);
const timelineWidthInPx = this.$element.parent().width()! - (2 * requiredPixelMarginLeft);
@ -451,5 +452,4 @@ export class WorkPackageTimelineTableController implements AfterViewInit, OnDest
}
}
}
}

@ -145,8 +145,8 @@ RSpec.feature 'Work package timeline navigation', js: true, selenium: true do
wp_timeline.expect_timeline!(open: true)
wp_timeline.expect_timeline_element(work_package)
# Expect zoom at days
expect(page).to have_selector('#work-packages-timeline-zoom-auto-button.-disabled')
# Expect zoom at weeks
wp_timeline.expect_zoom_at :weeks
end
describe 'with a hierarchy being shown' do

Loading…
Cancel
Save