diff options
author | =Corey Hulen <corey@hulen.com> | 2015-09-23 12:55:58 -0700 |
---|---|---|
committer | =Corey Hulen <corey@hulen.com> | 2015-09-23 12:55:58 -0700 |
commit | 2b5b8f95ed9de37a15dc68c38c46a1da2bb1e160 (patch) | |
tree | d5bf8318dc82d96cd34b83481e1cc5c8289d170a /web/react/components/user_settings/premade_theme_chooser.jsx | |
parent | 9e04909c0a3672d27c148c931d82b225cc86dfe5 (diff) | |
parent | 0170cfe604e6cfb430be0b6181243ca85a9ab27b (diff) | |
download | chat-2b5b8f95ed9de37a15dc68c38c46a1da2bb1e160.tar.gz chat-2b5b8f95ed9de37a15dc68c38c46a1da2bb1e160.tar.bz2 chat-2b5b8f95ed9de37a15dc68c38c46a1da2bb1e160.zip |
Merge branch 'master' into PLT-11-email
Diffstat (limited to 'web/react/components/user_settings/premade_theme_chooser.jsx')
-rw-r--r-- | web/react/components/user_settings/premade_theme_chooser.jsx | 55 |
1 files changed, 55 insertions, 0 deletions
diff --git a/web/react/components/user_settings/premade_theme_chooser.jsx b/web/react/components/user_settings/premade_theme_chooser.jsx new file mode 100644 index 000000000..e6aa2f5b9 --- /dev/null +++ b/web/react/components/user_settings/premade_theme_chooser.jsx @@ -0,0 +1,55 @@ +// Copyright (c) 2015 Spinpunch, Inc. All Rights Reserved. +// See License.txt for license information. + +var Utils = require('../../utils/utils.jsx'); +var Constants = require('../../utils/constants.jsx'); + +export default class PremadeThemeChooser extends React.Component { + constructor(props) { + super(props); + this.state = {}; + } + render() { + const theme = this.props.theme; + + const premadeThemes = []; + for (const k in Constants.THEMES) { + if (Constants.THEMES.hasOwnProperty(k)) { + const premadeTheme = $.extend(true, {}, Constants.THEMES[k]); + + let activeClass = ''; + if (premadeTheme.type === theme.type) { + activeClass = 'active'; + } + + premadeThemes.push( + <div className='col-sm-3 premade-themes'> + <div + className={activeClass} + onClick={() => this.props.updateTheme(premadeTheme)} + > + <label> + <img + className='img-responsive' + src={'/static/images/themes/' + premadeTheme.type.toLowerCase() + '.png'} + /> + <div className='theme-label'>{Utils.toTitleCase(premadeTheme.type)}</div> + </label> + </div> + </div> + ); + } + } + + return ( + <div className='row'> + {premadeThemes} + </div> + ); + } +} + +PremadeThemeChooser.propTypes = { + theme: React.PropTypes.object.isRequired, + updateTheme: React.PropTypes.func.isRequired +}; |