mirror of
https://github.com/captbaritone/webamp.git
synced 2026-07-28 12:36:35 +00:00
Add mouse scroll to playlist
This commit is contained in:
parent
c3b8b92df6
commit
fb58e54a3d
2 changed files with 28 additions and 3 deletions
|
|
@ -6,7 +6,7 @@ import {
|
|||
promptForFileReferences
|
||||
} from "./fileUtils";
|
||||
import skinParser from "./skinParser";
|
||||
import { BANDS } from "./constants";
|
||||
import { BANDS, TRACK_HEIGHT } from "./constants";
|
||||
import {
|
||||
getEqfData,
|
||||
nextTrack,
|
||||
|
|
@ -454,6 +454,22 @@ export function scrollNTracks(n) {
|
|||
};
|
||||
}
|
||||
|
||||
export function scrollPlaylistByDelta(delta) {
|
||||
return (dispatch, getState) => {
|
||||
const state = getState();
|
||||
const totalPixelHeight = state.playlist.trackOrder.length * TRACK_HEIGHT;
|
||||
const percentDelta = delta / totalPixelHeight * 100;
|
||||
dispatch({
|
||||
type: SET_PLAYLIST_SCROLL_POSITION,
|
||||
position: clamp(
|
||||
state.display.playlistScrollPosition + percentDelta,
|
||||
0,
|
||||
100
|
||||
)
|
||||
});
|
||||
};
|
||||
}
|
||||
|
||||
export function scrollUpFourTracks() {
|
||||
return scrollNTracks(-4);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@ import { getTimeStr } from "../../utils";
|
|||
import { getVisibleTrackIds, getScrollOffset } from "../../selectors";
|
||||
import { TRACK_HEIGHT } from "../../constants";
|
||||
import { SELECT_ZERO } from "../../actionTypes";
|
||||
import { dragSelected } from "../../actionCreators";
|
||||
import { dragSelected, scrollPlaylistByDelta } from "../../actionCreators";
|
||||
import TrackCell from "./TrackCell";
|
||||
import TrackTitle from "./TrackTitle";
|
||||
|
||||
|
|
@ -13,6 +13,7 @@ class TrackList extends React.Component {
|
|||
constructor(props) {
|
||||
super(props);
|
||||
this._handleMoveClick = this._handleMoveClick.bind(this);
|
||||
this._handleWeel = this._handleWeel.bind(this);
|
||||
}
|
||||
|
||||
_renderTracks(format) {
|
||||
|
|
@ -28,6 +29,12 @@ class TrackList extends React.Component {
|
|||
));
|
||||
}
|
||||
|
||||
_handleWeel(e) {
|
||||
this.props.scrollPlaylistByDelta(e.deltaY);
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
}
|
||||
|
||||
_handleMoveClick(e) {
|
||||
if (!this._node) {
|
||||
return;
|
||||
|
|
@ -65,6 +72,7 @@ class TrackList extends React.Component {
|
|||
className="playlist-tracks"
|
||||
style={{ height: "100%" }}
|
||||
onClick={this.props.selectZero}
|
||||
onWheel={this._handleWeel}
|
||||
>
|
||||
<div className="playlist-track-numbers">
|
||||
{this._renderTracks((id, i) => `${i + 1 + offset}.`)}
|
||||
|
|
@ -82,7 +90,8 @@ class TrackList extends React.Component {
|
|||
|
||||
const mapDispatchToProps = {
|
||||
selectZero: () => ({ type: SELECT_ZERO }),
|
||||
dragSelected
|
||||
dragSelected,
|
||||
scrollPlaylistByDelta
|
||||
};
|
||||
|
||||
const mapStateToProps = state => ({
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue