diff --git a/js/Marquee.jsx b/js/Marquee.jsx
index 8e136505..58fcd82b 100644
--- a/js/Marquee.jsx
+++ b/js/Marquee.jsx
@@ -4,6 +4,11 @@ import {connect} from 'react-redux';
class Marquee extends React.Component {
+ constructor(props) {
+ super(props);
+ this.handleMouseDown = this.handleMouseDown.bind(this);
+ }
+
componentDidMount() {
const step = () => {
setTimeout(() => {
@@ -19,6 +24,15 @@ class Marquee extends React.Component {
});
return selected ? selected[0] : selected;
}
+ handleMouseDown() {
+ this.props.dispatch({type: 'PAUSE_MARQUEE'});
+ document.addEventListener('mouseup', () => {
+ // TODO: Remove this listener
+ setTimeout(() => {
+ this.props.dispatch({type: 'START_MARQUEE'});
+ }, 1000);
+ });
+ }
render() {
const register = this.selectedRegister();
@@ -29,7 +43,7 @@ class Marquee extends React.Component {
// TODO: Use the spread operator
chars = start.concat(end).slice(0, 30);
}
- return
+ return
{chars.map(character => {
// TODO: Standarize how we get a characer class name
const className = 'character character-' + character.toLowerCase().charCodeAt(0);
diff --git a/js/main-window.js b/js/main-window.js
index 5b16a2d0..728954c1 100644
--- a/js/main-window.js
+++ b/js/main-window.js
@@ -71,16 +71,6 @@ module.exports = {
self.winamp.toggleDoubledMode();
};
- this.nodes.songTitle.onmousedown = function() {
- //self.textDisplay.pauseRegisterMarquee('songTitle');
- };
-
- this.nodes.songTitle.onmouseup = function() {
- setTimeout(function() {
- //self.textDisplay.startRegisterMarquee('songTitle');
- }, 1000);
- };
-
this.nodes.position.onmousedown = function() {
if (!self.nodes.window.classList.contains('stop')){
self.winamp.dispatch({type: 'SHOW_MARQUEE_REGISTER', register: 'position'});
diff --git a/js/reducers.js b/js/reducers.js
index bd43da52..31decf8b 100644
--- a/js/reducers.js
+++ b/js/reducers.js
@@ -49,6 +49,10 @@ const marquee = (state, action) => {
return Object.assign({}, state, {selectedRegister: action.register});
}
return state;
+ case 'PAUSE_MARQUEE':
+ return Object.assign({}, state, {stepping: false});
+ case 'START_MARQUEE':
+ return Object.assign({}, state, {stepping: true});
default:
return state;
}