Mirrors/webamp
1
0
Fork 0
mirror of https://github.com/captbaritone/webamp.git synced 2026-07-21 00:59:29 +00:00
Code Issues Projects Releases Wiki Activity

Get playlist scroll bar working. Kinda.

Browse source
This commit is contained in:
Jordan Eldredge 2017-09-27 20:17:01 -07:00
parent fc1e7214f0
commit 390fd99e05
4 changed files with 31 additions and 7 deletions
Download patch file Download diff file Expand all files Collapse all files

3
css/playlist-window.css
View file

@ -56,6 +56,8 @@
background-position: top right;
width: 20px;
position: relative;
padding-bottom: 9px;
padding-top: 9px;
}
#winamp2-js .playlist-scrollbar {
@ -67,6 +69,7 @@
#winamp2-js .playlist-scrollbar-handle {
width: 8x;
height: 18px;
margin-top: -9px;
}
#winamp2-js .playlist-bottom {

1
js/actionTypes.js
View file

@ -39,3 +39,4 @@ export const UNSET_FOCUS = "UNSET_FOCUS";
export const UPDATE_TIME_ELAPSED = "UPDATE_TIME_ELAPSED";
export const SET_USER_MESSAGE = "SET_USER_MESSAGE";
export const UNSET_USER_MESSAGE = "UNSET_USER_MESSAGE";
export const SET_PLAYLIST_SCROLL_POSITION = "SET_PLAYLIST_SCROLL_POSITION";

26
js/components/PlaylistWindow/index.js
View file

@ -5,7 +5,10 @@ import Slider from "rc-slider/lib/Slider";
import MiniTime from "../MiniTime";
import { WINDOWS } from "../../constants";
import { SET_FOCUSED_WINDOW } from "../../actionTypes";
import {
SET_FOCUSED_WINDOW,
SET_PLAYLIST_SCROLL_POSITION
} from "../../actionTypes";
import { play, pause, stop, openFileDialog } from "../../actionCreators";
import "../../../css/playlist-window.css";
@ -13,7 +16,13 @@ import "../../../css/playlist-window.css";
const Handle = () => <div className="playlist-scrollbar-handle" />;
const PlaylistWindow = props => {
const { skinPlaylistStyle, focusPlaylist, focused } = props;
const {
skinPlaylistStyle,
focusPlaylist,
focused,
playlistScrollPosition,
setPlaylistScrollPosition
} = props;
const style = {};
if (props) {
style.color = skinPlaylistStyle.Normal;
@ -45,6 +54,8 @@ const PlaylistWindow = props => {
min={0}
max={100}
step={1}
value={100 - playlistScrollPosition}
onChange={setPlaylistScrollPosition}
vertical
handle={Handle}
/>
@ -81,12 +92,17 @@ const mapDispatchToProps = (dispatch, ownProps) => ({
play: () => dispatch(play()),
pause: () => dispatch(pause()),
stop: () => dispatch(stop()),
openFileDialog: () => dispatch(openFileDialog(ownProps.fileInput))
openFileDialog: () => dispatch(openFileDialog(ownProps.fileInput)),
setPlaylistScrollPosition: position =>
dispatch({ type: SET_PLAYLIST_SCROLL_POSITION, position })
});
const mapStateToProps = state => {
const { windows: { focused }, display: { skinPlaylistStyle } } = state;
return { focused, skinPlaylistStyle };
const {
windows: { focused },
display: { skinPlaylistStyle, playlistScrollPosition }
} = state;
return { focused, skinPlaylistStyle, playlistScrollPosition };
};
export default connect(mapStateToProps, mapDispatchToProps)(PlaylistWindow);

8
js/reducers.js
View file

@ -32,7 +32,8 @@ import {
UNSET_FOCUS,
UPDATE_TIME_ELAPSED,
SET_USER_MESSAGE,
UNSET_USER_MESSAGE
UNSET_USER_MESSAGE,
SET_PLAYLIST_SCROLL_POSITION
} from "./actionTypes";
import { playlistEnabled } from "./config";
@ -98,7 +99,8 @@ const defaultDisplayState = {
skinImages: {},
skinColors: null,
skinPlaylistStyle: {},
visualizerStyle: 2
visualizerStyle: 2,
playlistScrollPosition: 0
};
const display = (state = defaultDisplayState, action) => {
@ -132,6 +134,8 @@ const display = (state = defaultDisplayState, action) => {
};
case TOGGLE_VISUALIZER_STYLE:
return { ...state, visualizerStyle: (state.visualizerStyle + 1) % 3 };
case SET_PLAYLIST_SCROLL_POSITION:
return { ...state, playlistScrollPosition: action.position };
default:
return state;
}