self-hosted/Sonarr
1
0
Fork 0
mirror of https://github.com/Sonarr/Sonarr.git synced 2024-12-14 11:23:42 +02:00
Code Issues Releases Activity

Fixed scrolling via jump list on series index

Browse Source
This commit is contained in:
Mark McDowall 2021-04-24 21:57:54 -07:00
parent 56a33e3b4c
commit 5d316ad7dc
4 changed files with 45 additions and 42 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
frontend/src/Components/Table/VirtualTable.js
View File

@ -7,8 +7,6 @@ import { WindowScroller, Grid } from 'react-virtualized';
import hasDifferentItemsOrOrder from 'Utilities/Object/hasDifferentItemsOrOrder';
import styles from './VirtualTable.css';
const ROW_HEIGHT = 38;
function overscanIndicesGetter(options) {
const {
cellCount,
@ -47,8 +45,7 @@ class VirtualTable extends Component {
componentDidUpdate(prevProps, prevState) {
const {
items,
scrollIndex
items
} = this.props;
const {
@ -59,13 +56,6 @@ class VirtualTable extends Component {
// recomputeGridSize also forces Grid to discard its cache of rendered cells
this._grid.recomputeGridSize();
}
if (scrollIndex != null && scrollIndex !== prevProps.scrollIndex) {
this._grid.scrollToCell({
rowIndex: scrollIndex,
columnIndex: 0
});
}
}
//
@ -96,6 +86,8 @@ class VirtualTable extends Component {
header,
headerHeight,
rowRenderer,
rowHeight,
scrollIndex,
...otherProps
} = this.props;
@ -125,6 +117,11 @@ class VirtualTable extends Component {
if (!height) {
return null;
}
const finalScrollTop = scrollIndex == null ?
scrollTop :
scrollIndex * rowHeight;
return (
<Measure
whitelist={['width']}
@ -144,11 +141,11 @@ class VirtualTable extends Component {
width={width}
height={height}
headerHeight={height - headerHeight}
rowHeight={ROW_HEIGHT}
rowHeight={rowHeight}
rowCount={items.length}
columnCount={1}
columnWidth={width}
scrollTop={scrollTop}
scrollTop={finalScrollTop}
onScroll={onChildScroll}
overscanRowCount={2}
cellRenderer={rowRenderer}

1
frontend/src/Series/Index/Overview/SeriesIndexOverview.js
View File

@ -270,6 +270,7 @@ SeriesIndexOverview.propTypes = {
};
SeriesIndexOverview.defaultProps = {
overview: '',
statistics: {
seasonCount: 0,
episodeCount: 0,

34
frontend/src/Series/Index/Overview/SeriesIndexOverviews.js
View File

@ -71,7 +71,6 @@ class SeriesIndexOverviews extends Component {
items,
sortKey,
overviewOptions,
jumpToCharacter,
isSmallScreen
} = this.props;
@ -96,18 +95,6 @@ class SeriesIndexOverviews extends Component {
// recomputeGridSize also forces Grid to discard its cache of rendered cells
this._grid.recomputeGridSize();
}
if (jumpToCharacter != null && jumpToCharacter !== prevProps.jumpToCharacter) {
const index = getIndexOfFirstCharacter(items, jumpToCharacter);
if (this._grid && index != null) {
this._grid.scrollToCell({
rowIndex: index,
columnIndex: 0
});
}
}
}
//
@ -201,6 +188,7 @@ class SeriesIndexOverviews extends Component {
const {
scroller,
items,
jumpToCharacter,
isSmallScreen
} = this.props;
@ -222,6 +210,24 @@ class SeriesIndexOverviews extends Component {
return <div />;
}
let finalScrollTop = scrollTop;
if (jumpToCharacter != null) {
const index = getIndexOfFirstCharacter(items, jumpToCharacter);
if (index != null) {
if (index > 0) {
// Adjust 5px upwards so there is a gap between the bottom
// of the toolbar and top of the poster.
finalScrollTop = rowHeight * index - 5;
} else {
finalScrollTop = 0;
}
}
}
return (
<div ref={registerChild}>
<Grid
@ -235,7 +241,7 @@ class SeriesIndexOverviews extends Component {
rowHeight={rowHeight}
width={width}
onScroll={onChildScroll}
scrollTop={scrollTop}
scrollTop={finalScrollTop}
overscanRowCount={2}
cellRenderer={this.cellRenderer}
scrollToAlignment={'start'}

29
frontend/src/Series/Index/Posters/SeriesIndexPosters.js
View File

@ -114,7 +114,6 @@ class SeriesIndexPosters extends Component {
items,
sortKey,
posterOptions,
jumpToCharacter,
isSmallScreen
} = this.props;
@ -139,19 +138,6 @@ class SeriesIndexPosters extends Component {
// recomputeGridSize also forces Grid to discard its cache of rendered cells
this._grid.recomputeGridSize();
}
if (jumpToCharacter != null && jumpToCharacter !== prevProps.jumpToCharacter) {
const index = getIndexOfFirstCharacter(items, jumpToCharacter);
if (this._grid && index != null) {
const row = Math.floor(index / columnCount);
this._grid.scrollToCell({
rowIndex: row,
columnIndex: 0
});
}
}
}
//
@ -256,6 +242,7 @@ class SeriesIndexPosters extends Component {
const {
scroller,
items,
jumpToCharacter,
isSmallScreen
} = this.props;
@ -281,6 +268,18 @@ class SeriesIndexPosters extends Component {
return <div />;
}
let finalScrollTop = scrollTop;
if (jumpToCharacter != null) {
const index = getIndexOfFirstCharacter(items, jumpToCharacter);
if (index != null) {
const row = Math.floor(index / columnCount);
finalScrollTop = rowHeight * row;
}
}
return (
<div ref={registerChild}>
<Grid
@ -294,7 +293,7 @@ class SeriesIndexPosters extends Component {
rowHeight={rowHeight}
width={width}
onScroll={onChildScroll}
scrollTop={scrollTop}
scrollTop={finalScrollTop}
overscanRowCount={2}
cellRenderer={this.cellRenderer}
scrollToAlignment={'start'}