secstate/Iris
Public Access
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

Mobile player max-height; Animation for context menu; Removing more <button>s for .button; Force reset playback position on end

Browse Source
This commit is contained in:
James Barnsley
2018-11-18 12:54:13 +13:00
parent 6341bbb1ac
commit 57c2782917
20 changed files with 10568 additions and 13711 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/js/components/ContextMenu.js
View File

@ -769,6 +769,10 @@ class ContextMenu extends React.Component{
if (this.state.submenu){
className += ' context-menu--submenu-expanded';
}
if (this.props.menu.closing){
className += ' context-menu--closing';
}
if (this.props.menu.position_x > (window.innerWidth - 174)){
style.left = 'auto';

3
src/js/components/Fields/OutputControl.js
View File

@ -63,7 +63,7 @@ class OutputControl extends React.Component{
for (var key in this.props.snapcast_clients){
if (this.props.snapcast_clients.hasOwnProperty(key)){
var client = this.props.snapcast_clients[key];
if (client.connected){
if (client.connected || this.props.show_disconnected_clients){
clients.push(client);
}
}
@ -213,6 +213,7 @@ const mapStateToProps = (state, ownProps) => {
http_streaming_mute: state.core.http_streaming_mute,
pusher_connected: state.pusher.connected,
snapcast_enabled: (state.pusher.config ? state.pusher.config.snapcast_enabled : null),
show_disconnected_clients: (state.ui.snapcast_show_disconnected_clients !== undefined ? state.ui.snapcast_show_disconnected_clients : false),
snapcast_clients: state.snapcast.clients,
pusher_commands: (state.pusher.commands ? state.pusher.commands : {})
}

8
src/js/components/PlaybackControls.js
View File

@ -101,7 +101,7 @@ class PlaybackControls extends React.Component{
renderConsumeButton(){
var button = <a className="control tooltip" onClick={() => this.props.mopidyActions.setConsume(true)}><Icon name="restaurant" type="material" /><span className="tooltip__content">Consume</span></a>
if (this.props.consume){
button = <a className="control active tooltip" onClick={() => this.props.mopidyActions.setConsume(false)}><Icon name="restaurant" type="material" /><span className="tooltip__content">Consume</span></a>
button = <a className="control control--active tooltip" onClick={() => this.props.mopidyActions.setConsume(false)}><Icon name="restaurant" type="material" /><span className="tooltip__content">Consume</span></a>
}
return button;
}
@ -109,7 +109,7 @@ class PlaybackControls extends React.Component{
renderRandomButton(){
var button = <a className="control tooltip" onClick={() => this.props.mopidyActions.setRandom(true)}><Icon name="shuffle" type="material" /><span className="tooltip__content">Shuffle</span></a>
if (this.props.random){
button = <a className="control active tooltip" onClick={() => this.props.mopidyActions.setRandom(false)}><Icon name="shuffle" type="material" /><span className="tooltip__content">Shuffle</span></a>
button = <a className="control control--active tooltip" onClick={() => this.props.mopidyActions.setRandom(false)}><Icon name="shuffle" type="material" /><span className="tooltip__content">Shuffle</span></a>
}
return button;
}
@ -117,7 +117,7 @@ class PlaybackControls extends React.Component{
renderRepeatButton(){
var button = <a className="control tooltip" onClick={() => this.props.mopidyActions.setRepeat(true)}><Icon name="repeat" /><span className="tooltip__content">Repeat</span></a>
if (this.props.repeat){
button = <a className="control active tooltip" onClick={() => this.props.mopidyActions.setRepeat(false)}><Icon name="repeat" /><span className="tooltip__content">Repeat</span></a>
button = <a className="control control--active tooltip" onClick={() => this.props.mopidyActions.setRepeat(false)}><Icon name="repeat" /><span className="tooltip__content">Repeat</span></a>
}
return button;
}
@ -129,7 +129,7 @@ class PlaybackControls extends React.Component{
}
return (
<div className={(this.state.expanded ? "expanded playback-controls" : "playback-controls")}>
<div className={(this.state.expanded ? "playback-controls--expanded playback-controls" : "playback-controls")}>
{this.props.next_track && this.props.next_track.images ? <Thumbnail className="hide" size="large" images={this.props.next_track.images} /> : null}

5
src/js/services/mopidy/middleware.js
View File

@ -96,7 +96,10 @@ const MopidyMiddleware = (function(){
case 'event:trackPlaybackEnded':
store.dispatch(mopidyActions.clearCurrentTrack());
store.dispatch(mopidyActions.getTimePosition());
store.dispatch({
type: 'MOPIDY_TIME_POSITION',
time_position: 0
});
break;
case 'event:trackPlaybackStarted':

12
src/js/services/ui/actions.js
View File

@ -56,6 +56,12 @@ export function hideContextMenu(){
}
}
export function removeContextMenu(){
return {
type: 'REMOVE_CONTEXT_MENU'
}
}
export function showTouchContextMenu(data){
return {
type: 'SHOW_TOUCH_CONTEXT_MENU',
@ -69,6 +75,12 @@ export function hideTouchContextMenu(){
}
}
export function removeTouchContextMenu(){
return {
type: 'REMOVE_TOUCH_CONTEXT_MENU'
}
}
export function lazyLoading(start){
return {
type: 'LAZY_LOADING',

28
src/js/services/ui/middleware.js
View File

@ -64,12 +64,36 @@ const UIMiddleware = (function(){
case 'CLOSE_MODAL':
if (store.getState().ui.allow_reporting){
ReactGA.event({ category: 'Modal', action: 'Closed', label: null });
}
ReactGA.event({ category: 'Modal', action: 'Closed', label: null });
}
$('body').removeClass('modal-open')
next(action)
break
case 'HIDE_CONTEXT_MENU':
if (store.getState().ui.context_menu){
setTimeout(
() => {
store.dispatch(uiActions.removeContextMenu())
},
200
);
next(action);
}
break;
case 'HIDE_TOUCH_CONTEXT_MENU':
if (store.getState().ui.context_menu){
setTimeout(
() => {
store.dispatch(uiActions.removeTouchContextMenu())
},
200
);
next(action);
}
break;
case 'BROWSER_NOTIFICATION':
var notification = window.Notification || window.mozNotification || window.webkitNotification;

18
src/js/services/ui/reducer.js
View File

@ -50,6 +50,15 @@ export default function reducer(ui = {}, action){
});
case 'HIDE_CONTEXT_MENU':
return Object.assign(
{},
ui,
{
context_menu: Object.assign({}, ui.context_menu, {closing: true})
}
);
case 'REMOVE_CONTEXT_MENU':
return Object.assign({}, ui, {context_menu: null});
case 'SHOW_TOUCH_CONTEXT_MENU':
@ -58,6 +67,15 @@ export default function reducer(ui = {}, action){
});
case 'HIDE_TOUCH_CONTEXT_MENU':
return Object.assign(
{},
ui,
{
touch_context_menu: Object.assign({}, ui.touch_context_menu, {closing: true})
}
);
case 'REMOVE_TOUCH_CONTEXT_MENU':
return Object.assign({}, ui, {touch_context_menu: null});

8
src/js/views/Debug.js
View File

@ -52,11 +52,9 @@ class Debug extends React.Component{
render(){
var options = (
<span>
<button className="no-hover" onClick={e => hashHistory.push(global.baseURL+'settings')}>
<Icon name="keyboard_backspace" />Back
</button>
</span>
<a className="button no-hover" onClick={e => hashHistory.push(global.baseURL+'settings')}>
<Icon name="keyboard_backspace" />Back
</a>
)
return (

4
src/js/views/Queue.js
View File

@ -151,9 +151,9 @@ class Queue extends React.Component{
<Link className="button no-hover" to={global.baseURL+'queue/history'}>
<Icon name="history" />History
</Link>
<button className="no-hover" onClick={e => {this.props.mopidyActions.clearTracklist(); this.props.uiActions.hideContextMenu();}}>
<a className="button no-hover" onClick={e => {this.props.mopidyActions.clearTracklist(); this.props.uiActions.hideContextMenu();}}>
<Icon name="delete_sweep" />Clear
</button>
</a>
<Link className="button no-hover" to={global.baseURL+'queue/add-uri'}>
<Icon name="playlist_add" />Add URI
</Link>

10
src/js/views/QueueHistory.js
View File

@ -38,12 +38,10 @@ class QueueHistory extends React.Component{
render(){
var options = (
<span>
<button className="no-hover" onClick={e => hashHistory.push(global.baseURL+'queue')}>
<Icon name="keyboard_backspace" />&nbsp;
Back
</button>
</span>
<a className="button no-hover" onClick={e => hashHistory.push(global.baseURL+'queue')}>
<Icon name="keyboard_backspace" />&nbsp;
Back
</a>
)
var tracks = [];

4
src/js/views/Settings.js
View File

@ -194,9 +194,9 @@ class Settings extends React.Component {
var options = (
<span>
<button className="no-hover" onClick={e => hashHistory.push(global.baseURL+'settings/debug')}>
<a className="button no-hover" onClick={e => hashHistory.push(global.baseURL+'settings/debug')}>
<Icon name="code" />Debug
</button>
</a>
<a className="no-hover button" href="https://github.com/jaedb/Iris/wiki" target="_blank">
<Icon name="help" />Help
</a>