mirror of
https://github.com/captbaritone/webamp.git
synced 2026-07-24 02:27:37 +00:00
Make playlist scroll discrete. Fixes #429
This commit is contained in:
parent
f595ba735e
commit
efa3ea7fe3
2 changed files with 27 additions and 18 deletions
|
|
@ -3,11 +3,11 @@ import { connect } from "react-redux";
|
|||
import Slider from "rc-slider/lib/Slider";
|
||||
|
||||
import { setPlaylistScrollPosition } from "../../actionCreators";
|
||||
import { getVisibleTrackIds } from "../../selectors";
|
||||
import { getVisibleTrackIds, getPlaylistScrollPosition } from "../../selectors";
|
||||
|
||||
const Handle = () => <div className="playlist-scrollbar-handle" />;
|
||||
|
||||
const PlaylistWindow = props => (
|
||||
const ScrollBar = props => (
|
||||
<Slider
|
||||
className="playlist-scrollbar"
|
||||
type="range"
|
||||
|
|
@ -27,16 +27,10 @@ const mapDispatchToProps = {
|
|||
setPlaylistScrollPosition(100 - position)
|
||||
};
|
||||
|
||||
const mapStateToProps = state => {
|
||||
const {
|
||||
display: { playlistScrollPosition },
|
||||
playlist: { trackOrder }
|
||||
} = state;
|
||||
const mapStateToProps = state => ({
|
||||
playlistScrollPosition: getPlaylistScrollPosition(state),
|
||||
allTracksAreVisible:
|
||||
getVisibleTrackIds(state).length === state.playlist.length
|
||||
});
|
||||
|
||||
return {
|
||||
playlistScrollPosition,
|
||||
allTracksAreVisible: getVisibleTrackIds(state).length === trackOrder.length
|
||||
};
|
||||
};
|
||||
|
||||
export default connect(mapStateToProps, mapDispatchToProps)(PlaylistWindow);
|
||||
export default connect(mapStateToProps, mapDispatchToProps)(ScrollBar);
|
||||
|
|
|
|||
|
|
@ -103,9 +103,6 @@ export const nextTrack = (state, n = 1) => {
|
|||
return trackOrder[nextIndex];
|
||||
};
|
||||
|
||||
export const getPlaylistScrollPosition = state =>
|
||||
state.display.playlistScrollPosition;
|
||||
|
||||
const BASE_WINDOW_HEIGHT = 58;
|
||||
export const getNumberOfVisibleTracks = state => {
|
||||
const { playlistSize } = state.display;
|
||||
|
|
@ -122,8 +119,26 @@ export const getOverflowTrackCount = createSelector(
|
|||
Math.max(0, trackOrder.length - numberOfVisibleTracks)
|
||||
);
|
||||
|
||||
const _getPlaylistScrollPosition = state =>
|
||||
state.display.playlistScrollPosition;
|
||||
|
||||
export const getPlaylistScrollPosition = createSelector(
|
||||
getOverflowTrackCount,
|
||||
_getPlaylistScrollPosition,
|
||||
(overflowTrackCount, playlistScrollPosition) => {
|
||||
if (overflowTrackCount === 0) {
|
||||
return 0;
|
||||
}
|
||||
return Math.round(
|
||||
Math.round(overflowTrackCount * playlistScrollPosition / 100) /
|
||||
overflowTrackCount *
|
||||
100
|
||||
);
|
||||
}
|
||||
);
|
||||
|
||||
export const getScrollOffset = createSelector(
|
||||
getPlaylistScrollPosition,
|
||||
_getPlaylistScrollPosition,
|
||||
getTrackOrder,
|
||||
getNumberOfVisibleTracks,
|
||||
(playlistScrollPosition, trackOrder, numberOfVisibleTracks) => {
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue