diff --git a/src/actions/tutorialActions.js b/src/actions/tutorialActions.js index 3443f07..58e67d4 100644 --- a/src/actions/tutorialActions.js +++ b/src/actions/tutorialActions.js @@ -3,14 +3,21 @@ import { TUTORIAL_PROGRESS, GET_TUTORIAL, GET_TUTORIALS, TUTORIAL_SUCCESS, TUTOR import axios from 'axios'; import { returnErrors, returnSuccess } from './messageActions'; -export const getTutorial = (id) => (dispatch) => { +export const getTutorial = (id) => (dispatch, getState) => { dispatch({type: TUTORIAL_PROGRESS}); axios.get(`https://api.blockly.sensebox.de/tutorial/${id}`) .then(res => { - dispatch({type: TUTORIAL_PROGRESS}); - dispatch({ - type: GET_TUTORIAL, - payload: res.data + var tutorial = res.data; + existingTutorial(tutorial, getState().tutorial.status).then(status => { + dispatch({ + type: TUTORIAL_SUCCESS, + payload: status + }); + dispatch({type: TUTORIAL_PROGRESS}); + dispatch({ + type: GET_TUTORIAL, + payload: tutorial + }); }); }) .catch(err => { @@ -21,14 +28,21 @@ export const getTutorial = (id) => (dispatch) => { }); }; -export const getTutorials = () => (dispatch) => { +export const getTutorials = () => (dispatch, getState) => { dispatch({type: TUTORIAL_PROGRESS}); axios.get(`https://api.blockly.sensebox.de/tutorial`) .then(res => { - dispatch({type: TUTORIAL_PROGRESS}); - dispatch({ - type: GET_TUTORIALS, - payload: res.data + var tutorials = res.data; + existingTutorials(tutorials, getState().tutorial.status).then(status => { + dispatch({ + type: TUTORIAL_SUCCESS, + payload: status + }); + dispatch({ + type: GET_TUTORIALS, + payload: tutorials + }); + dispatch({type: TUTORIAL_PROGRESS}); }); }) .catch(err => { @@ -44,6 +58,10 @@ export const resetTutorial = () => (dispatch) => { type: GET_TUTORIALS, payload: [] }); + dispatch({ + type: TUTORIAL_STEP, + payload: 0 + }); }; export const tutorialChange = () => (dispatch) => { @@ -96,3 +114,47 @@ export const tutorialStep = (step) => (dispatch) => { payload: step }); }; + + +const existingTutorials = (tutorials, status) => new Promise(function(resolve, reject){ + var newstatus; + new Promise(function(resolve, reject){ + var existingTutorialIds = tutorials.map((tutorial, i) => { + existingTutorial(tutorial, status).then(status => { + newstatus = status; + }); + return tutorial.id; + }); + resolve(existingTutorialIds) + }).then(existingTutorialIds => { + // deleting old tutorials which do not longer exist + if (existingTutorialIds.length > 0) { + status = newstatus.filter(status => existingTutorialIds.indexOf(status.id) > -1); + } + resolve(status); + }); +}); + +const existingTutorial = (tutorial, status) => new Promise(function(resolve, reject){ + var tutorialsId = tutorial.id; + var statusIndex = status.findIndex(status => status.id === tutorialsId); + if (statusIndex > -1) { + var tasks = tutorial.steps.filter(step => step.type === 'task'); + var existingTaskIds = tasks.map((task, j) => { + var tasksId = task.id; + if (status[statusIndex].tasks.findIndex(task => task.id === tasksId) === -1) { + // task does not exist + status[statusIndex].tasks.push({ id: tasksId }); + } + return tasksId; + }); + // deleting old tasks which do not longer exist + if (existingTaskIds.length > 0) { + status[statusIndex].tasks = status[statusIndex].tasks.filter(task => existingTaskIds.indexOf(task.id) > -1); + } + } + else { + status.push({ id: tutorialsId, tasks: tutorial.steps.filter(step => step.type === 'task').map(task => { return { id: task.id }; }) }); + } + resolve(status); +}); diff --git a/src/components/Tutorial/Requirement.js b/src/components/Tutorial/Requirement.js index 97e620c..53d2211 100644 --- a/src/components/Tutorial/Requirement.js +++ b/src/components/Tutorial/Requirement.js @@ -5,8 +5,6 @@ import { connect } from 'react-redux'; import clsx from 'clsx'; import { withRouter, Link } from 'react-router-dom'; -import tutorials from '../../data/tutorials'; - import { fade } from '@material-ui/core/styles/colorManipulator'; import { withStyles } from '@material-ui/core/styles'; import Typography from '@material-ui/core/Typography'; @@ -67,7 +65,8 @@ class Requirement extends Component { Bevor du mit diesem Tutorial fortfährst solltest du folgende Tutorials erfolgreich abgeschlossen haben: {tutorialIds.map((tutorialId, i) => { - var title = tutorials.filter(tutorial => tutorial.id === tutorialId)[0].title; + // title must be provided together with ids + // var title = tutorials.filter(tutorial => tutorial.id === tutorialId)[0].title; var status = this.props.status.filter(status => status.id === tutorialId)[0]; var tasks = status.tasks; var error = status.tasks.filter(task => task.type === 'error').length > 0; @@ -99,7 +98,7 @@ class Requirement extends Component {
- {title} + {/*title*/}Name hinzufügen über Datenbankeintrag
) diff --git a/src/components/Tutorial/StepperHorizontal.js b/src/components/Tutorial/StepperHorizontal.js index 89b7ccd..acfccca 100644 --- a/src/components/Tutorial/StepperHorizontal.js +++ b/src/components/Tutorial/StepperHorizontal.js @@ -6,7 +6,7 @@ import { withRouter } from 'react-router-dom'; import clsx from 'clsx'; -import tutorials from '../../data/tutorials'; +// import tutorials from '../../data/tutorials'; import { fade } from '@material-ui/core/styles/colorManipulator'; import { withStyles } from '@material-ui/core/styles'; @@ -70,8 +70,8 @@ class StepperHorizontal extends Component { : null}
@@ -82,8 +82,8 @@ class StepperHorizontal extends Component {
diff --git a/src/reducers/tutorialReducer.js b/src/reducers/tutorialReducer.js index eb7350e..8b91f0f 100644 --- a/src/reducers/tutorialReducer.js +++ b/src/reducers/tutorialReducer.js @@ -1,46 +1,18 @@ import { TUTORIAL_PROGRESS, GET_TUTORIAL, GET_TUTORIALS, TUTORIAL_SUCCESS, TUTORIAL_ERROR, TUTORIAL_CHANGE, TUTORIAL_XML, TUTORIAL_ID, TUTORIAL_STEP } from '../actions/types'; -import tutorials from '../data/tutorials'; const initialStatus = () => { if (window.localStorage.getItem('status')) { var status = JSON.parse(window.localStorage.getItem('status')); - var existingTutorialIds = tutorials.map((tutorial, i) => { - var tutorialsId = tutorial.id; - var statusIndex = status.findIndex(status => status.id === tutorialsId); - if (statusIndex > -1) { - var tasks = tutorial.steps.filter(step => step.type === 'task'); - var existingTaskIds = tasks.map((task, j) => { - var tasksId = task.id; - if (status[statusIndex].tasks.findIndex(task => task.id === tasksId) === -1) { - // task does not exist - status[statusIndex].tasks.push({ id: tasksId }); - } - return tasksId; - }); - // deleting old tasks which do not longer exist - if (existingTaskIds.length > 0) { - status[statusIndex].tasks = status[statusIndex].tasks.filter(task => existingTaskIds.indexOf(task.id) > -1); - } - } - else { - status.push({ id: tutorialsId, tasks: tutorial.steps.filter(step => step.type === 'task').map(task => { return { id: task.id }; }) }); - } - return tutorialsId; - }); - // deleting old tutorials which do not longer exist - if (existingTutorialIds.length > 0) { - status = status.filter(status => existingTutorialIds.indexOf(status.id) > -1); - } return status; } - // window.localStorage.getItem('status') does not exist - return tutorials.map(tutorial => { return { id: tutorial.id, tasks: tutorial.steps.filter(step => step.type === 'task').map(task => { return { id: task.id }; }) }; }); + return []; + // // window.localStorage.getItem('status') does not exist + // return tutorials.map(tutorial => { return { id: tutorial.id, tasks: tutorial.steps.filter(step => step.type === 'task').map(task => { return { id: task.id }; }) }; }); }; const initialState = { status: initialStatus(), - currentIndex: null, activeStep: 0, change: 0, tutorials: [], @@ -78,11 +50,6 @@ export default function (state = initialState, action) { ...state, change: state.change += 1 } - case TUTORIAL_ID: - return { - ...state, - currentIndex: tutorials.findIndex(tutorial => tutorial.id === action.payload) - } case TUTORIAL_STEP: return { ...state,