diff options
author | Kali Kaneko (leap communications) <kali@leap.se> | 2016-09-01 01:44:34 -0400 |
---|---|---|
committer | Kali Kaneko (leap communications) <kali@leap.se> | 2016-09-01 01:44:34 -0400 |
commit | 4728855b40d2d37da8e035c5081fab5819b07fd0 (patch) | |
tree | c8a7c727521fe06a2c4fe9221cb77d30e8f0c3b9 /src/leap/bitmask_js/app/components/wizard | |
parent | 4613e74ce4e2c8b125a6a61585a4aec5f5151969 (diff) |
[refactor] move js to top-level folder
Diffstat (limited to 'src/leap/bitmask_js/app/components/wizard')
5 files changed, 0 insertions, 291 deletions
diff --git a/src/leap/bitmask_js/app/components/wizard/add_provider_modal.js b/src/leap/bitmask_js/app/components/wizard/add_provider_modal.js deleted file mode 100644 index bc5e023..0000000 --- a/src/leap/bitmask_js/app/components/wizard/add_provider_modal.js +++ /dev/null @@ -1,94 +0,0 @@ -// -// A modal popup to add a new provider. -// - -import React from 'react' -import { FormGroup, ControlLabel, FormControl, HelpBlock, Button, Modal } from 'react-bootstrap' -import Spinner from '../spinner' -import Validate from '../../lib/validate' -import App from '../../app' - -class AddProviderModal extends React.Component { - - static get defaultProps() {return{ - title: 'Add a provider', - onClose: null - }} - - constructor(props) { - super(props) - this.state = { - validationState: null, - errorMsg: null, - domain: "" - } - this.accept = this.accept.bind(this) - this.cancel = this.cancel.bind(this) - this.changed = this.changed.bind(this) - } - - accept() { - if (this.state.domain) { - App.providers.add(this.state.domain) - } - this.props.onClose() - } - - cancel() { - this.props.onClose() - } - - changed(e) { - let domain = e.target.value - let newState = null - let newMsg = null - - if (domain.length > 0) { - let error = Validate.domain(domain) - newState = error ? 'error' : 'success' - newMsg = error - } - this.setState({ - domain: domain, - validationState: newState, - errorMsg: newMsg - }) - } - - render() { - let help = null - if (this.state.errorMsg) { - help = <HelpBlock>{this.state.errorMsg}</HelpBlock> - } else { - help = <HelpBlock> </HelpBlock> - } - let form = <form onSubmit={this.accept} autoComplete="off"> - <FormGroup controlId="addprovider" validationState={this.state.validationState}> - <ControlLabel>Domain</ControlLabel> - <FormControl - type="text" - ref="domain" - autoFocus - value={this.state.domain} - onChange={this.changed} - onBlur={this.changed} /> - <FormControl.Feedback/> - {help} - </FormGroup> - <Button onClick={this.accept}>Add</Button> - </form> - - return( - <Modal show={true} onHide={this.cancel}> - <Modal.Header closeButton> - <Modal.Title>{this.props.title}</Modal.Title> - </Modal.Header> - <Modal.Body> - {form} - </Modal.Body> - </Modal> - ) - } -} - -export default AddProviderModal
\ No newline at end of file diff --git a/src/leap/bitmask_js/app/components/wizard/index.js b/src/leap/bitmask_js/app/components/wizard/index.js deleted file mode 100644 index 613b88f..0000000 --- a/src/leap/bitmask_js/app/components/wizard/index.js +++ /dev/null @@ -1,38 +0,0 @@ -// -// The provider setup wizard -// - -import React from 'react' -import App from 'app' - -import ProviderSelectStage from './provider_select_stage' -import './wizard.less' - -export default class Wizard extends React.Component { - - constructor(props) { - super(props) - this.state = { - stage: 'provider' - } - } - - setStage(stage) { - this.setState({stage: stage}) - } - - render() { - let stage = null - switch(this.state.stage) { - case 'provider': - stage = <ProviderSelectStage /> - break - } - return( - <div className="wizard"> - {stage} - </div> - ) - } - -} diff --git a/src/leap/bitmask_js/app/components/wizard/provider_select_stage.js b/src/leap/bitmask_js/app/components/wizard/provider_select_stage.js deleted file mode 100644 index 20674be..0000000 --- a/src/leap/bitmask_js/app/components/wizard/provider_select_stage.js +++ /dev/null @@ -1,86 +0,0 @@ -import React from 'react' -import {Button, ButtonGroup, ButtonToolbar, Glyphicon} from 'react-bootstrap' - -import App from 'app' -import ListEdit from 'components/list_edit' -import StageLayout from './stage_layout' -import AddProviderModal from './add_provider_modal' - -export default class ProviderSelectStage extends React.Component { - - static get defaultProps() {return{ - title: "Choose a provider", - subtitle: "This doesn't work yet" - }} - - constructor(props) { - super(props) - let domains = this.currentDomains() - this.state = { - domains: domains, - showModal: false - } - this.add = this.add.bind(this) - this.remove = this.remove.bind(this) - this.close = this.close.bind(this) - this.previous = this.previous.bind(this) - } - - currentDomains() { - // return(App.providers.domains().slice() || []) - return ['domain1', 'domain2', 'domain3'] - } - - add() { - this.setState({showModal: true}) - } - - remove(provider) { - // App.providers.remove(provider) - this.setState({domains: this.currentDomains()}) - } - - close() { - let domains = this.currentDomains() - if (domains.length != this.state.domains.length) { - // this is ugly, but i could not get selection working - // by passing it as a property - this.refs.list.setSelected(0) - } - this.setState({ - domains: domains, - showModal: false - }) - } - - previous() { - App.start() - } - - render() { - let modal = null - if (this.state.showModal) { - modal = <AddProviderModal onClose={this.close} /> - } - let buttons = ( - <ButtonToolbar className="pull-right"> - <Button onClick={this.previous}> - <Glyphicon glyph="chevron-left" /> - Previous - </Button> - <Button> - Next - <Glyphicon glyph="chevron-right" /> - </Button> - </ButtonToolbar> - ) - let select = <ListEdit ref="list" items={this.state.domains} - onRemove={this.remove} onAdd={this.add} /> - return( - <StageLayout title={this.props.title} subtitle={this.props.subtitle} buttons={buttons}> - {select} - {modal} - </StageLayout> - ) - } -} diff --git a/src/leap/bitmask_js/app/components/wizard/stage_layout.js b/src/leap/bitmask_js/app/components/wizard/stage_layout.js deleted file mode 100644 index 3154022..0000000 --- a/src/leap/bitmask_js/app/components/wizard/stage_layout.js +++ /dev/null @@ -1,37 +0,0 @@ -import React from 'react' - -class StageLayout extends React.Component { - - static get defaultProps() {return{ - title: 'untitled', - subtitle: null, - buttons: null - }} - - constructor(props) { - super(props) - } - - render() { - let subtitle = null - if (this.props.subtitle) { - subtitle = <span>{this.props.subtitle}</span> - } - return( - <div className="stage"> - <div className="header"> - {this.props.title} - {subtitle} - </div> - <div className="body"> - {this.props.children} - </div> - <div className="footer"> - {this.props.buttons} - </div> - </div> - ) - } -} - -export default StageLayout
\ No newline at end of file diff --git a/src/leap/bitmask_js/app/components/wizard/wizard.less b/src/leap/bitmask_js/app/components/wizard/wizard.less deleted file mode 100644 index 3336ffb..0000000 --- a/src/leap/bitmask_js/app/components/wizard/wizard.less +++ /dev/null @@ -1,36 +0,0 @@ -.wizard .stage { - position: absolute; - height: 100%; - width: 100%; - - display: flex; - flex-direction: column; - flex: 1; -} - -.wizard .stage .footer { - flex: 0 0 auto; - background-color: #ddd; - padding: 20px; - text-align: right; -} - -.wizard .stage .header { - flex: 0 0 auto; - padding: 20px; - background-color: #333; - color: white; - font-size: 2em; - span { - margin-left: 10px; - font-size: 0.5em; - } -} - -.wizard .stage .body { - flex: 1 1 auto; - padding: 20px; - overflow: auto; - display: flex; - flex-direction: column; -}
\ No newline at end of file |