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

src/js/services/mopidy/middleware.js

@@ -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':

src/js/services/ui/actions.js

@@ -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',

src/js/services/ui/middleware.js

@@ -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;

src/js/services/ui/reducer.js

@@ -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});