diff --git a/web/src/js/components/ContentView/ViewSelector.jsx b/web/src/js/components/ContentView/ViewSelector.jsx
index f879dbc50..ab433ea3b 100644
--- a/web/src/js/components/ContentView/ViewSelector.jsx
+++ b/web/src/js/components/ContentView/ViewSelector.jsx
@@ -1,72 +1,36 @@
import React, { PropTypes, Component } from 'react'
-import classnames from 'classnames'
import { connect } from 'react-redux'
import * as ContentViews from './ContentViews'
-import { setContentView } from "../../ducks/ui/flow";
-
-function ViewItem({ name, setContentView, children }) {
- return (
-
- {e.preventDefault(); setContentView(name)}}>
- {children}
-
-
- )
-}
+import { setContentView } from '../../ducks/ui/flow';
+import Dropdown from '../common/Dropdown'
-/*ViewSelector.propTypes = {
+ViewSelector.propTypes = {
contentViews: PropTypes.array.isRequired,
activeView: PropTypes.string.isRequired,
isEdit: PropTypes.bool.isRequired,
- isContentViewSelectorOpen: PropTypes.bool.isRequired,
- setContentViewSelectorOpen: PropTypes.func.isRequired
-}*/
+ setContentView: PropTypes.func.isRequired
+}
+function ViewSelector ({contentViews, activeView, isEdit, setContentView}){
+ let edit = ContentViews.Edit.displayName
+ let inner = View: {activeView}
-class ViewSelector extends Component {
- constructor(props, context) {
- super(props, context)
- this.close = this.close.bind(this)
- this.state = {open: false}
- }
- close() {
- this.setState({open: false})
- document.removeEventListener('click', this.close)
- }
-
- onDropdown(e){
- e.preventDefault()
- this.setState({open: !this.state.open})
- document.addEventListener('click', this.close)
- }
-
- render() {
- const {contentViews, activeView, isEdit, setContentView} = this.props
- let edit = ContentViews.Edit.displayName
-
- return (
-
- )
- }
+ )
+ }
+ {isEdit &&
+ {e.preventDefault(); setContentView(edit)}}>
+ {edit.toLowerCase()}
+
+ }
+
+ )
}
export default connect (
diff --git a/web/src/js/components/Header/FileMenu.jsx b/web/src/js/components/Header/FileMenu.jsx
index 392cc163d..6053b2d38 100644
--- a/web/src/js/components/Header/FileMenu.jsx
+++ b/web/src/js/components/Header/FileMenu.jsx
@@ -2,6 +2,7 @@ import React, { Component, PropTypes } from 'react'
import { connect } from 'react-redux'
import classnames from 'classnames'
import FileChooser from '../common/FileChooser'
+import Dropdown from '../common/Dropdown'
import * as flowsActions from '../../ducks/flows'
@@ -16,44 +17,20 @@ class FileMenu extends Component {
constructor(props, context) {
super(props, context)
- this.state = { show: false }
- this.close = this.close.bind(this)
- this.onFileClick = this.onFileClick.bind(this)
this.onNewClick = this.onNewClick.bind(this)
this.onOpenClick = this.onOpenClick.bind(this)
this.onOpenFile = this.onOpenFile.bind(this)
this.onSaveClick = this.onSaveClick.bind(this)
}
- close() {
- this.setState({ show: false })
- document.removeEventListener('click', this.close)
- }
-
- onFileClick(e) {
- e.preventDefault()
-
- if (this.state.show) {
- return
- }
-
- document.addEventListener('click', this.close)
- this.setState({ show: true })
- }
-
onNewClick(e) {
e.preventDefault()
if (confirm('Delete all flows?')) {
this.props.clearFlows()
}
}
-
- onOpenClick(e) {
- e.preventDefault()
- this.fileInput.click()
- }
-
+
onOpenFile(file) {
this.props.loadFlows(file)
}
@@ -65,37 +42,28 @@ class FileMenu extends Component {
render() {
return (
-
+
+
+
+ New
+
+
+
+
+ Save...
+
+
+
+
+
+
+ Install Certificates...
+
+
)
}
}
diff --git a/web/src/js/components/common/Dropdown.jsx b/web/src/js/components/common/Dropdown.jsx
new file mode 100644
index 000000000..9180767f3
--- /dev/null
+++ b/web/src/js/components/common/Dropdown.jsx
@@ -0,0 +1,56 @@
+import React, { Component, PropTypes } from 'react'
+import classnames from 'classnames'
+
+export default class Dropdown extends Component {
+
+ static propTypes = {
+ dropup: PropTypes.bool,
+ className: PropTypes.string,
+ btnClass: PropTypes.string.isRequired
+ }
+
+ static defaultProps = {
+ dropup: false
+ }
+
+ constructor(props, context) {
+ super(props, context)
+ this.state = { open: false }
+ this.close = this.close.bind(this)
+ this.open = this.open.bind(this)
+ }
+
+ close() {
+ this.setState({ open: false })
+ document.removeEventListener('click', this.close)
+ }
+
+ open(e){
+ e.preventDefault()
+ if (this.state.open) {
+ return
+ }
+ this.setState({open: !this.state.open})
+ document.addEventListener('click', this.close)
+ }
+
+ render() {
+ const {dropup, className, btnClass, text, children} = this.props
+ return (
+
+
+ {text}
+
+
+ {children.map(item =>
+ item.name == "divider" ?
+
+ :
+ - {item}
+ )}
+
+
+ )
+ }
+}
diff --git a/web/src/js/components/common/FileChooser.jsx b/web/src/js/components/common/FileChooser.jsx
index d8a80ad7c..d59d2d6d8 100644
--- a/web/src/js/components/common/FileChooser.jsx
+++ b/web/src/js/components/common/FileChooser.jsx
@@ -11,7 +11,7 @@ FileChooser.propTypes = {
export default function FileChooser({ icon, text, className, title, onOpenFile }) {
let fileInput;
return (
- fileInput.click()}
+ fileInput.click()}
className={className}
title={title}>