feat: support local and remote videos

closes #52
graasp · May 2, 2019 · 0b586f6 · 0b586f6
1 parent 1deb087
commit 0b586f6
Show file tree

Hide file tree

Showing 4 changed files with 43 additions and 13 deletions.
diff --git a/src/actions/space/index.js b/src/actions/space/index.js
@@ -202,26 +202,28 @@ const saveSpace = async ({ space }) => async dispatch => {
 
       switch (response) {
         case ERROR_SPACE_ALREADY_AVAILABLE:
-          return toastr.error(
+          toastr.error(
             ERROR_MESSAGE_HEADER,
             ERROR_SPACE_ALREADY_AVAILABLE_MESSAGE
           );
+          break;
 
         case ERROR_DOWNLOADING_FILE:
-          return toastr.error(ERROR_MESSAGE_HEADER, ERROR_DOWNLOADING_MESSAGE);
+          toastr.error(ERROR_MESSAGE_HEADER, ERROR_DOWNLOADING_MESSAGE);
+          break;
 
         // todo: check that it is actually a space before dispatching success
         default:
           toastr.success(SUCCESS_MESSAGE_HEADER, SUCCESS_SAVING_MESSAGE);
-          return dispatch({
+          dispatch({
             type: SAVE_SPACE_SUCCEEDED,
             payload: response,
           });
       }
+      return dispatch(flagSavingSpace(false));
     });
   } catch (err) {
     toastr.error(ERROR_MESSAGE_HEADER, ERROR_SAVING_SPACE_MESSAGE);
-  } finally {
     dispatch(flagSavingSpace(false));
   }
 };

diff --git a/src/components/phase/PhaseItems.js b/src/components/phase/PhaseItems.js
@@ -23,7 +23,16 @@ const renderResource = item => {
   }
 
   if (VIDEO.test(mimeType)) {
-    return <PhaseVideo key={id} id={id} uri={`file://${asset}`} />;
+    return (
+      <PhaseVideo
+        key={id}
+        id={id}
+        url={url}
+        asset={asset}
+        name={name}
+        mimeType={mimeType}
+      />
+    );
   }
 
   if (mimeType === IFRAME) {

diff --git a/src/components/phase/PhaseVideo.js b/src/components/phase/PhaseVideo.js
@@ -3,16 +3,32 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import './PhaseVideo.css';
 
-const PhaseVideo = ({ uri }) => (
-  <div className="VideoDiv">
-    <video className="Video" controls>
-      <source src={uri} type="video/mp4" />
-    </video>
-  </div>
-);
+const PhaseVideo = ({ url, asset, name, mimeType }) => {
+  let uri = url;
+  if (asset) {
+    uri = `file://${asset}`;
+  }
+  return (
+    <div className="VideoDiv">
+      <video title={name} className="Video" controls>
+        <source src={uri} type={mimeType} />
+      </video>
+    </div>
+  );
+};
 
 PhaseVideo.propTypes = {
-  uri: PropTypes.string.isRequired,
+  url: PropTypes.string,
+  asset: PropTypes.string,
+  name: PropTypes.string,
+  mimeType: PropTypes.string,
+};
+
+PhaseVideo.defaultProps = {
+  url: null,
+  asset: null,
+  name: 'Video',
+  mimeType: 'video/mp4',
 };
 
 export default PhaseVideo;
diff --git a/src/reducers/SpaceReducer.js b/src/reducers/SpaceReducer.js
@@ -12,6 +12,7 @@ import {
   FLAG_EXPORTING_SPACE,
   DELETE_SPACE_SUCCESS,
   SAVE_SPACE_SUCCEEDED,
+  FLAG_SAVING_SPACE,
 } from '../types';
 
 const INITIAL_STATE = Immutable.Map({
@@ -34,6 +35,8 @@ export default (state = INITIAL_STATE, { type, payload }) => {
       return state
         .setIn(['current', 'content'], Immutable.Map())
         .setIn(['current', 'deleted'], false);
+    case FLAG_SAVING_SPACE:
+      return state.setIn(['current', 'activity'], payload);
     case FLAG_GETTING_SPACE:
       return state.setIn(['current', 'activity'], payload);
     case FLAG_GETTING_SPACES: