diff --git a/packages/strapi-admin/admin/src/components/OnboardingList/index.js b/packages/strapi-admin/admin/src/components/OnboardingVideo/index.js similarity index 61% rename from packages/strapi-admin/admin/src/components/OnboardingList/index.js rename to packages/strapi-admin/admin/src/components/OnboardingVideo/index.js index 0a2b5599b4..2000a1f554 100644 --- a/packages/strapi-admin/admin/src/components/OnboardingList/index.js +++ b/packages/strapi-admin/admin/src/components/OnboardingVideo/index.js @@ -10,25 +10,22 @@ import cn from 'classnames'; import { Modal, ModalHeader, ModalBody } from 'reactstrap'; import { FormattedMessage } from 'react-intl'; -import PopUpVideo from 'components/PopUpVideo'; import { Player } from 'video-react'; import '../../../../node_modules/video-react/dist/video-react.css'; import styles from './styles.scss'; -import auth from 'utils/auth'; -class OnboardingList extends React.Component { +class OnboardingVideo extends React.Component { + hiddenPlayer = React.createRef(); player = React.createRef(); componentDidMount() { - //console.log(this.player.current); - this.player.current.subscribeToStateChange( + this.hiddenPlayer.current.subscribeToStateChange( this.handleChangeState.bind(this), ); } handleChangeState = (state, prevState) => { - //console.log({ state, prevState }); const { duration } = state; const { id } = this.props; @@ -45,11 +42,18 @@ class OnboardingList extends React.Component { this.player.current.play(); }; - render() { - const content = this.props.video.isOpen ? 'yo' : 'ya'; - const { video } = this.props; + /*onModalClose = () => { + console.log('CLOSE'); - //getVideoDuration = e => {}; + const { player } = this.player.current.getState(); + const currTime = player.currentTime; + + console.log(currTime); + + };*/ + + render() { + const { video } = this.props; return (
  • {video.title}

    -

    {this.props.video.duration}

    +

    {isNaN(video.duration) ? ' ' : `${Math.floor(video.duration / 60)}:${Math.floor(video.duration)%60}`}

    - {/* */} -
    - {/* */} + preload="auto" + />
    - -
    - -
    + {!video.duration ? ( +
    + +
    + ) : ( +
    + )}
  • ); } } -OnboardingList.defaultProps = { +OnboardingVideo.defaultProps = { video: {}, setVideoDuration: () => {}, }; -OnboardingList.propTypes = { +OnboardingVideo.propTypes = { videos: PropTypes.object, + setVideoDuration: PropTypes.func, }; -export default OnboardingList; +export default OnboardingVideo; diff --git a/packages/strapi-admin/admin/src/components/OnboardingList/styles.scss b/packages/strapi-admin/admin/src/components/OnboardingVideo/styles.scss similarity index 80% rename from packages/strapi-admin/admin/src/components/OnboardingList/styles.scss rename to packages/strapi-admin/admin/src/components/OnboardingVideo/styles.scss index 4902ca1668..0dd4e39b37 100644 --- a/packages/strapi-admin/admin/src/components/OnboardingList/styles.scss +++ b/packages/strapi-admin/admin/src/components/OnboardingVideo/styles.scss @@ -73,21 +73,27 @@ li.listItem { } } } - -.playerWrapper { +.modal .modal-dialog { background: red; - width: 100%; - height: 100%; - position: fixed; - top: 0; - right: 0; - bottom: 0; - left: 0; - z-index: 1051; - display: none; - max-width: 74.5rem; - margin: 16rem auto 3rem calc(50% - 24rem); - &.visible { - display: block; - } } + +.hiddenPlayerWrapper { + display: none; +} + +.videoModal { + margin-right: auto !important; + margin-left: auto !important; + .videoModalHeader { + border-bottom: 0; + > h5 { + font-family: Lato; + font-weight: bold!important; + font-size: 1.8rem!important; + } + > button { + margin-top: 0; + margin-right: 0; + } + } +} \ No newline at end of file diff --git a/packages/strapi-admin/admin/src/components/OnboardingList/tests/index.test.js b/packages/strapi-admin/admin/src/components/OnboardingVideo/tests/index.test.js similarity index 100% rename from packages/strapi-admin/admin/src/components/OnboardingList/tests/index.test.js rename to packages/strapi-admin/admin/src/components/OnboardingVideo/tests/index.test.js diff --git a/packages/strapi-admin/admin/src/containers/AdminPage/index.js b/packages/strapi-admin/admin/src/containers/AdminPage/index.js index c00cb18bff..d97353e7b0 100644 --- a/packages/strapi-admin/admin/src/containers/AdminPage/index.js +++ b/packages/strapi-admin/admin/src/containers/AdminPage/index.js @@ -283,8 +283,7 @@ export class AdminPage extends React.Component { isOpen={this.props.blockApp && this.props.showGlobalAppBlocker} {...this.props.overlayBlockerData} /> - - + ); } diff --git a/packages/strapi-admin/admin/src/containers/Onboarding/actions.js b/packages/strapi-admin/admin/src/containers/Onboarding/actions.js index 119c106643..d635eedf65 100644 --- a/packages/strapi-admin/admin/src/containers/Onboarding/actions.js +++ b/packages/strapi-admin/admin/src/containers/Onboarding/actions.js @@ -4,7 +4,7 @@ * */ -import { GET_VIDEOS, GET_VIDEOS_SUCCEEDED, ON_CLICK } from './constants'; +import { GET_VIDEOS, GET_VIDEOS_SUCCEEDED, ON_CLICK, SET_VIDEOS_DURATION } from './constants'; export function getVideos() { return { @@ -18,9 +18,18 @@ export function getVideosSucceeded(videos) { videos, }; } + export function onClick(e) { return { type: ON_CLICK, index: parseInt(e.currentTarget.id, 10), }; } + +export function setVideoDuration(id, duration) { + return { + type: SET_VIDEOS_DURATION, + index: parseInt(id, 10), + duration: parseFloat(duration, 10), + }; +} diff --git a/packages/strapi-admin/admin/src/containers/Onboarding/constants.js b/packages/strapi-admin/admin/src/containers/Onboarding/constants.js index ee8cc7f0e2..cc762c36db 100644 --- a/packages/strapi-admin/admin/src/containers/Onboarding/constants.js +++ b/packages/strapi-admin/admin/src/containers/Onboarding/constants.js @@ -7,4 +7,5 @@ export const GET_VIDEOS = 'StrapiAdmin/Onboarding/GET_VIDEOS'; export const GET_VIDEOS_SUCCEEDED = 'StrapiAdmin/Onboarding/GET_VIDEOS_SUCCEEDED'; -export const ON_CLICK = 'StrapiAdmin/Onboarding/ON_CLICK'; + export const ON_CLICK = 'StrapiAdmin/Onboarding/ON_CLICK'; + export const SET_VIDEOS_DURATION = 'StrapiAdmin/Onboarding/SET_VIDEOS_DURATION'; diff --git a/packages/strapi-admin/admin/src/containers/Onboarding/index.js b/packages/strapi-admin/admin/src/containers/Onboarding/index.js index 5bb23e670a..627d783bc2 100644 --- a/packages/strapi-admin/admin/src/containers/Onboarding/index.js +++ b/packages/strapi-admin/admin/src/containers/Onboarding/index.js @@ -9,7 +9,7 @@ import PropTypes from 'prop-types'; import cn from 'classnames'; import { connect } from 'react-redux'; import { bindActionCreators, compose } from 'redux'; -import { getVideos, onClick } from './actions'; +import { getVideos, onClick, setVideoDuration } from './actions'; import injectSaga from 'utils/injectSaga'; import injectReducer from 'utils/injectReducer'; @@ -17,29 +17,21 @@ import makeSelectOnboarding from './selectors'; import reducer from './reducer'; import saga from './saga'; -import OnboardingVideo from 'components/OnboardingList'; +import OnboardingVideo from 'components/OnboardingVideo'; import styles from './styles.scss'; -import auth from 'utils/auth'; export class Onboarding extends React.Component { - state = { showVideos: false }; + state = { showVideos: false, videosTime: [] }; componentWillMount() { this.setState({ showVideos: true }); - this.props.getVideos(); - localStorage.setItem('videos', JSON.stringify(['video0', 'video1'])); - console.log(localStorage.getItem('videos')); - - if (auth.get('videos')) { - console.log('localStorageExist'); - console.log(auth.get('videos')); - } else { - console.log('localStorageNoooo'); - auth.set('videos', JSON.stringify(['video0', 'video1']), true); - //localStorage.setItem('videos', stringify(['video0', 'video1'])); + if (!localStorage.getItem('videos')) { + localStorage.setItem('videos', JSON.stringify([0,0,0,0])); } + + this.props.getVideos(); } toggleVideos = e => { @@ -48,7 +40,7 @@ export class Onboarding extends React.Component { // eslint-disable-line react/prefer-stateless-function render() { - const { videos, onClick } = this.props; + const { videos, onClick, setVideoDuration } = this.props; return (
    ); })} @@ -98,7 +91,7 @@ Onboarding.propTypes = { const mapStateToProps = makeSelectOnboarding(); function mapDispatchToProps(dispatch) { - return bindActionCreators({ getVideos, onClick }, dispatch); + return bindActionCreators({ getVideos, onClick, setVideoDuration }, dispatch); } const withConnect = connect( diff --git a/packages/strapi-admin/admin/src/containers/Onboarding/reducer.js b/packages/strapi-admin/admin/src/containers/Onboarding/reducer.js index c444b0e633..7cb902e53c 100644 --- a/packages/strapi-admin/admin/src/containers/Onboarding/reducer.js +++ b/packages/strapi-admin/admin/src/containers/Onboarding/reducer.js @@ -5,7 +5,7 @@ */ import { fromJS } from 'immutable'; -import { GET_VIDEOS_SUCCEEDED, ON_CLICK } from './constants'; +import { GET_VIDEOS_SUCCEEDED, ON_CLICK, SET_VIDEOS_DURATION } from './constants'; const initialState = fromJS({ videos: fromJS([]), @@ -25,6 +25,8 @@ function onboardingReducer(state = initialState, action) { return acc.updateIn([index, 'isOpen'], () => false); }, list); }); + case SET_VIDEOS_DURATION: + return state.updateIn(['videos', action.index, 'duration'], () => action.duration); default: return state; } diff --git a/packages/strapi-admin/admin/src/containers/Onboarding/saga.js b/packages/strapi-admin/admin/src/containers/Onboarding/saga.js index 8a25679067..99e7db9bbe 100644 --- a/packages/strapi-admin/admin/src/containers/Onboarding/saga.js +++ b/packages/strapi-admin/admin/src/containers/Onboarding/saga.js @@ -15,9 +15,14 @@ function* getVideos() { yield put( getVideosSucceeded( - videos.map(video => { + videos.map((video, index) => { + video.isOpen = false; + /*if (index === 0) { + video.isOpen = true; + }*/ video.duration = null; + video.startTime = localStorage.getItem("videos"); return video; }), diff --git a/packages/strapi-admin/package.json b/packages/strapi-admin/package.json index d84e878e86..8dfb834271 100644 --- a/packages/strapi-admin/package.json +++ b/packages/strapi-admin/package.json @@ -55,4 +55,4 @@ "npm": ">= 6.0.0" }, "license": "MIT" -} +} \ No newline at end of file diff --git a/packages/strapi-helper-plugin/lib/src/utils/auth.js b/packages/strapi-helper-plugin/lib/src/utils/auth.js index 809f1cdc80..9212f9d7bf 100644 --- a/packages/strapi-helper-plugin/lib/src/utils/auth.js +++ b/packages/strapi-helper-plugin/lib/src/utils/auth.js @@ -58,15 +58,11 @@ const auth = { }, set(value, key, isLocalStorage) { - console.log(value); - console.log(key); - console.log(isLocalStorage); if (isEmpty(value)) { return null; } if (isLocalStorage && localStorage) { - console.log('Hey'); return localStorage.setItem(key, stringify(value)); } diff --git a/packages/strapi-plugin-content-manager/package.json b/packages/strapi-plugin-content-manager/package.json index 9af6a28629..227edb829f 100644 --- a/packages/strapi-plugin-content-manager/package.json +++ b/packages/strapi-plugin-content-manager/package.json @@ -52,4 +52,4 @@ "npm": ">= 6.0.0" }, "license": "MIT" -} +} \ No newline at end of file diff --git a/packages/strapi-plugin-content-type-builder/package.json b/packages/strapi-plugin-content-type-builder/package.json index 5020bcb611..2ea35ec0b5 100644 --- a/packages/strapi-plugin-content-type-builder/package.json +++ b/packages/strapi-plugin-content-type-builder/package.json @@ -51,4 +51,4 @@ "npm": ">= 6.0.0" }, "license": "MIT" -} +} \ No newline at end of file diff --git a/packages/strapi-plugin-email/package.json b/packages/strapi-plugin-email/package.json index d711fe6e69..e78a046bff 100644 --- a/packages/strapi-plugin-email/package.json +++ b/packages/strapi-plugin-email/package.json @@ -49,4 +49,4 @@ "npm": ">= 6.0.0" }, "license": "MIT" -} +} \ No newline at end of file diff --git a/packages/strapi-plugin-settings-manager/package.json b/packages/strapi-plugin-settings-manager/package.json index f9b62b5598..bf994342d9 100644 --- a/packages/strapi-plugin-settings-manager/package.json +++ b/packages/strapi-plugin-settings-manager/package.json @@ -48,4 +48,4 @@ "npm": ">= 6.0.0" }, "license": "MIT" -} +} \ No newline at end of file diff --git a/packages/strapi-plugin-upload/package.json b/packages/strapi-plugin-upload/package.json index 1e14df5921..74bb062789 100644 --- a/packages/strapi-plugin-upload/package.json +++ b/packages/strapi-plugin-upload/package.json @@ -46,4 +46,4 @@ "npm": ">= 6.0.0" }, "license": "MIT" -} +} \ No newline at end of file diff --git a/packages/strapi-plugin-users-permissions/package.json b/packages/strapi-plugin-users-permissions/package.json index 2ee82acdd7..8977fcdd68 100644 --- a/packages/strapi-plugin-users-permissions/package.json +++ b/packages/strapi-plugin-users-permissions/package.json @@ -56,4 +56,4 @@ "npm": ">= 6.0.0" }, "license": "MIT" -} +} \ No newline at end of file