Skip to content

forward and backward buttons represent correct actions #54

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 5 commits into from
Mar 12, 2019
Merged

forward and backward buttons represent correct actions #54

Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
c8d1ebd
applying merge
murphybrandon Mar 11, 2019
3ddd160
applying merge
murphybrandon Mar 11, 2019
308a7a3
have JSON viewing for action & state working
murphybrandon Mar 11, 2019
acab7b4
forward and back buttons displaying correct info
murphybrandon Mar 12, 2019
3d1c0e2
forward and back buttons displaying correct info
murphybrandon Mar 12, 2019
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
37 changes: 32 additions & 5 deletions src/app/components/App.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -60,11 +60,6 @@ class App extends Component {
}

componentDidMount() {
// *******************************************************
// need to impletement setState for filteredData to same value as data
// this.setState({ data, filteredData: data });
// *******************************************************

// adds listener to the effects that are gonna be sent from
// our edited useReducer from the 'react' library.
chrome.runtime.onConnect.addListener((portFromExtension) => {
Expand All @@ -79,11 +74,14 @@ class App extends Component {
this.setState((state) => ({
data: [...state.data, newData],
filteredData: [...state.data, newData],
isPlayingIndex: state.data.length - 1,
}));
});
});
}



// functionality to change 'play' button to 'stop'
setIsPlaying() {
if (this.state.isPlayingIndex > this.state.data.length - 1) {
Expand Down Expand Up @@ -192,6 +190,20 @@ class App extends Component {
type: 'TIMETRAVEL',
direction: 'forward',
});

// if (isPlayingIndex >= this.state.data.length - 1) isPlayingIndex = 0;

const { data, isPlayingIndex } = this.state;
const { id, action, state } = data[isPlayingIndex + 1];
this.setState(prev => ({
...prev,
id,
action,
state,
isPlayingIndex: isPlayingIndex + 1,
}));

console.log('isPlayingIndex', this.state.isPlayingIndex);
}

// function to travel to the PAST
Expand All @@ -201,6 +213,21 @@ class App extends Component {
type: 'TIMETRAVEL',
direction: 'backwards',
});

const { data, isPlayingIndex } = this.state;

if (isPlayingIndex === 0) {
console.log('is playingIdx in toThePast is 0');
} else {
const { id, action, state } = data[isPlayingIndex - 1];
this.setState(prev => ({
...prev,
id,
action,
state,
isPlayingIndex: isPlayingIndex - 1,
}));
}
}

render() {
Expand Down