Commit e1e21169 authored by Svein Olav Styve's avatar Svein Olav Styve

#15 Update Title Component

parent 87346282
......@@ -20,7 +20,6 @@ class App extends React.Component {
super(props);
this.handleArtworkChange = this.handleArtworkChange.bind(this);
this.getImageTitle = this.getImageTitle.bind(this);
this.handleCategoryChange = this.handleCategoryChange.bind(this);
this.checkForEmptyLocalStorage = this.checkForEmptyLocalStorage.bind(this);
this.saveAsFavorite = this.saveAsFavorite.bind(this);
......@@ -121,11 +120,6 @@ class App extends React.Component {
this.setState({artwork: artworkId}, event => this.updateSession());
}
getImageTitle() {
let titles = ["Artwork 1", "Artwork 2", "Artwork 3", "Artwork 4"];
return titles[this.state.artwork] + JSON.stringify(this.state.categorySelections); // CategorySelection added for testing
}
handleCategoryChange(name, valueAsString) {
let value = parseInt(valueAsString);
const oldCatSel = this.state.categorySelections;
......@@ -180,7 +174,7 @@ class App extends React.Component {
<div className="App">
<header className="App-header">
<div className="title">
<Title title={this.getImageTitle()}/>
<Title artwork={this.state.artwork} categorySelections={this.state.categorySelections}/>
</div>
<div className="cluster">
<div className="chooser">
......
......@@ -13,7 +13,12 @@ describe('My Test Suite', () => {
// Snapshot Test Title-component
describe('Title', () => {
test('snapshot renders', () => {
const component = renderer.create(<Title title={"my title"} />);
const component = renderer.create(<Title artworkId={1}
categorySelections={{
textCat: 1,
imageCat: 1,
audioCat: 1,
}} />);
let tree = component.toJSON();
expect(tree).toMatchSnapshot();
});
......
......@@ -4,6 +4,6 @@ exports[`Title snapshot renders 1`] = `
<h1
className="Title"
>
my title
undefined, txt 2, img 2, audio 2
</h1>
`;
import React from 'react';
function getImageTitle(artworkId, categorySelections) {
let titles = ["Artwork 1", "Artwork 2", "Artwork 3", "Artwork 4"];
let txtCatTitles = ["txt 1", "txt 2", "txt 3", "txt 4"];
let imgCatTitles = ["img 1", "img 2", "img 3", "img 4"];
let audioCatTitles = ["audio 1", "audio 2", "audio 3", "audio 4"];
return titles[artworkId] + ", " + txtCatTitles[categorySelections.textCat]
+ ", " + imgCatTitles[categorySelections.imageCat]
+ ", " + audioCatTitles[categorySelections.audioCat]
}
function Title(props) {
return (
<h1 className="Title">{props.title}</h1>
<h1 className="Title">{getImageTitle(props.artwork, props.categorySelections)}</h1>
)
}
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment