summaryrefslogtreecommitdiff
path: root/src/leap/bitmask_js/app/components/wizard
diff options
context:
space:
mode:
Diffstat (limited to 'src/leap/bitmask_js/app/components/wizard')
-rw-r--r--src/leap/bitmask_js/app/components/wizard/add_provider_modal.js94
-rw-r--r--src/leap/bitmask_js/app/components/wizard/index.js38
-rw-r--r--src/leap/bitmask_js/app/components/wizard/provider_select_stage.js86
-rw-r--r--src/leap/bitmask_js/app/components/wizard/stage_layout.js37
-rw-r--r--src/leap/bitmask_js/app/components/wizard/wizard.less36
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>&nbsp;</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