r
/
p5.js-web-editor
1
0
Fork 0
Code Issues 1 Pull Requests Releases 1 Wiki Activity

add prop types to preference, fix proptype head in preview frame

This commit is contained in:
catarak 2016-06-27 15:57:36 -04:00
parent 786753f1d3
commit f60a7e845d
2 changed files with 34 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

60
client/modules/IDE/components/Preferences.js
View File

@ -1,4 +1,4 @@
import React from 'react'; import React, { PropTypes } from 'react';
const Isvg = require('react-inlinesvg'); const Isvg = require('react-inlinesvg');
const exitUrl = require('../../../images/exit.svg'); const exitUrl = require('../../../images/exit.svg');
@ -6,33 +6,39 @@ const plusUrl = require('../../../images/plus.svg');
const minusUrl = require('../../../images/minus.svg'); const minusUrl = require('../../../images/minus.svg');
const classNames = require('classnames'); const classNames = require('classnames');
class Preferences extends React.Component { function Preferences(props) {
render() { const preferencesContainerClass = classNames({
const preferencesContainerClass = classNames({ preferences: true,
preferences: true, 'preferences--selected': props.isVisible
'preferences--selected': this.props.isVisible });
}); return (
return ( <div className={preferencesContainerClass} tabIndex="0">
<div className={preferencesContainerClass} tabIndex="0"> <div className="preferences__heading">
<div className="preferences__heading"> <h2 className="preferences__title">Preferences</h2>
<h2 className="preferences__title">Preferences</h2> <button className="preferences__exit-button" onClick={props.closePreferences}>
<button className="preferences__exit-button" onClick={this.props.closePreferences}> <Isvg src={exitUrl} alt="Exit Preferences" />
<Isvg src={exitUrl} alt="Exit Preferences" /> </button>
</button>
</div>
<div className="preference">
<h3 className="preference__title">Text Size</h3>
<button className="preference__plus-button" onClick={this.props.decreaseFont}>
<Isvg src={minusUrl} alt="Decrease Font Size" />
</button>
<p className="preference__value">{this.props.fontSize}</p>
<button className="preference__minus-button" onClick={this.props.increaseFont}>
<Isvg src={plusUrl} alt="Increase Font Size" />
</button>
</div>
</div> </div>
); <div className="preference">
} <h3 className="preference__title">Text Size</h3>
<button className="preference__plus-button" onClick={props.decreaseFont}>
<Isvg src={minusUrl} alt="Decrease Font Size" />
</button>
<p className="preference__value">{props.fontSize}</p>
<button className="preference__minus-button" onClick={props.increaseFont}>
<Isvg src={plusUrl} alt="Increase Font Size" />
</button>
</div>
</div>
);
} }
Preferences.propTypes = {
isVisible: PropTypes.bool.isRequired,
closePreferences: PropTypes.func.isRequired,
decreaseFont: PropTypes.func.isRequired,
fontSize: PropTypes.number.isRequired,
increaseFont: PropTypes.func.isRequired
};
export default Preferences; export default Preferences;

2
client/modules/IDE/components/PreviewFrame.js
View File

@ -69,7 +69,7 @@ class PreviewFrame extends React.Component {
PreviewFrame.propTypes = { PreviewFrame.propTypes = {
isPlaying: PropTypes.bool.isRequired, isPlaying: PropTypes.bool.isRequired,
head: PropTypes.string.isRequired, head: PropTypes.object.isRequired,
content: PropTypes.string.isRequired content: PropTypes.string.isRequired
}; };