jeans/frontend
jeans/frontend
1
0
Fork 0
mirror of https://github.com/home-assistant/frontend.git synced 2025-07-19 15:26:36 +00:00
Code Issues Packages Projects Releases Wiki Activity

Restore scrollposition on subpages after reconnecting (#6288)

Browse Source
This commit is contained in:
Bram Kragten 2020-06-30 18:34:17 +02:00 committed by GitHub
parent ec48323a7d
commit 4ce9c71521
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 36 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
src/layouts/hass-subpage.ts
View File

@ -6,6 +6,7 @@ import {
LitElement,
property,
TemplateResult,
eventOptions,
} from "lit-element";
import { classMap } from "lit-html/directives/class-map";
import "../components/ha-menu-button";
@ -22,6 +23,17 @@ class HassSubpage extends LitElement {
@property({ type: Boolean })
public hassio = false;
@property() private _savedScrollPos?: number;
public connectedCallback() {
super.connectedCallback();
if (this._savedScrollPos) {
(this.shadowRoot!.querySelector(
".content"
) as HTMLDivElement).scrollTop = this._savedScrollPos;
}
}
protected render(): TemplateResult {
return html`
<div class="toolbar">
@ -34,10 +46,15 @@ class HassSubpage extends LitElement {
<div main-title>${this.header}</div>
<slot name="toolbar-icon"></slot>
</div>
<div class="content"><slot></slot></div>
<div class="content" @scroll=${this._saveScrollPos}><slot></slot></div>
`;
}
@eventOptions({ passive: true })
private _saveScrollPos(e: Event) {
this._savedScrollPos = (e.target as HTMLDivElement).scrollTop;
}
private _backTapped(): void {
history.back();
}

19
src/layouts/hass-tabs-subpage.ts
View File

@ -8,6 +8,7 @@ import {
property,
PropertyValues,
TemplateResult,
eventOptions,
} from "lit-element";
import { classMap } from "lit-html/directives/class-map";
import memoizeOne from "memoize-one";
@ -52,6 +53,17 @@ class HassTabsSubpage extends LitElement {
@property() private _activeTab?: PageNavigation;
@property() private _savedScrollPos?: number;
public connectedCallback() {
super.connectedCallback();
if (this._savedScrollPos) {
(this.shadowRoot!.querySelector(
".content"
) as HTMLDivElement).scrollTop = this._savedScrollPos;
}
}
private _getTabs = memoizeOne(
(
tabs: PageNavigation[],
@ -143,12 +155,17 @@ class HassTabsSubpage extends LitElement {
<slot name="toolbar-icon"></slot>
</div>
</div>
<div class="content">
<div class="content" @scroll=${this._saveScrollPos}>
<slot></slot>
</div>
`;
}
@eventOptions({ passive: true })
private _saveScrollPos(e: Event) {
this._savedScrollPos = (e.target as HTMLDivElement).scrollTop;
}
private _tabTapped(ev: Event): void {
navigate(this, (ev.currentTarget as any).path, true);
}