From 57fafd3281af7a35f8e650fa9fb2cf5af70995f0 Mon Sep 17 00:00:00 2001 From: Clemens Date: Tue, 16 Aug 2016 11:57:12 +0200 Subject: refactor header_options --- web/src/js/components/Header/OptionMenu.jsx | 6 ++--- web/src/js/components/common/ToggleInputButton.jsx | 28 +++++++++++----------- 2 files changed, 17 insertions(+), 17 deletions(-) (limited to 'web/src') diff --git a/web/src/js/components/Header/OptionMenu.jsx b/web/src/js/components/Header/OptionMenu.jsx index a338fed0..a11062f2 100644 --- a/web/src/js/components/Header/OptionMenu.jsx +++ b/web/src/js/components/Header/OptionMenu.jsx @@ -41,17 +41,17 @@ function OptionMenu({ settings, updateSettings }) { /> updateSettings({ stickyauth: !settings.stickyauth ? txt : null })} /> updateSettings({ stickycookie: !settings.stickycookie ? txt : null })} /> updateSettings({ stream: !settings.stream ? txt : null })} /> diff --git a/web/src/js/components/common/ToggleInputButton.jsx b/web/src/js/components/common/ToggleInputButton.jsx index 25d620ae..b019dfa3 100644 --- a/web/src/js/components/common/ToggleInputButton.jsx +++ b/web/src/js/components/common/ToggleInputButton.jsx @@ -7,7 +7,10 @@ export default class ToggleInputButton extends Component { static propTypes = { name: PropTypes.string.isRequired, txt: PropTypes.string.isRequired, - onToggleChanged: PropTypes.func.isRequired + onToggleChanged: PropTypes.func.isRequired, + checked: PropTypes.bool.isRequired, + placeholder: PropTypes.string.isRequired, + inputType: PropTypes.string } constructor(props) { @@ -15,10 +18,6 @@ export default class ToggleInputButton extends Component { this.state = { txt: props.txt } } - onChange(e) { - this.setState({ txt: e.target.value }) - } - onKeyDown(e) { e.stopPropagation() if (e.keyCode === Key.ENTER) { @@ -27,23 +26,24 @@ export default class ToggleInputButton extends Component { } render() { + const {checked, onToggleChanged, name, inputType, placeholder} = this.props return (
this.props.onToggleChanged(this.state.txt)}> -
- + onClick={() => onToggleChanged(this.state.txt)}> +
+   - {this.props.name} + {name}
this.onChange(e)} + placeholder={placeholder} + disabled={checked} + value={this.state.txt || ''} + type={inputType || 'text'} + onChange={e => this.setState({ txt: e.target.value })} onKeyDown={e => this.onKeyDown(e)} />
-- cgit v1.2.3 From 779e5e84e37278b8f3255a1061f2137f5b6a3a7d Mon Sep 17 00:00:00 2001 From: Clemens Date: Tue, 16 Aug 2016 12:37:35 +0200 Subject: refactor file up and download --- .../components/ContentView/UploadContentButton.jsx | 20 ++++---------- web/src/js/components/Header/FileMenu.jsx | 32 +++++++++++----------- web/src/js/components/common/FileChooser.jsx | 27 ++++++++++++++++++ 3 files changed, 49 insertions(+), 30 deletions(-) create mode 100644 web/src/js/components/common/FileChooser.jsx (limited to 'web/src') diff --git a/web/src/js/components/ContentView/UploadContentButton.jsx b/web/src/js/components/ContentView/UploadContentButton.jsx index 0652b584..6764e234 100644 --- a/web/src/js/components/ContentView/UploadContentButton.jsx +++ b/web/src/js/components/ContentView/UploadContentButton.jsx @@ -1,4 +1,5 @@ import { PropTypes } from 'react' +import FileChooser from '../common/FileChooser' UploadContentButton.propTypes = { uploadContent: PropTypes.func.isRequired, @@ -9,20 +10,11 @@ export default function UploadContentButton({ uploadContent }) { let fileInput; return ( - fileInput.click()} - title="Upload a file to replace the content."> - - fileInput = ref} - className="hidden" - type="file" - onChange={e => { - if (e.target.files.length > 0) uploadContent(e.target.files[0]) - }} - /> - - + ) } diff --git a/web/src/js/components/Header/FileMenu.jsx b/web/src/js/components/Header/FileMenu.jsx index d3786475..392cc163 100644 --- a/web/src/js/components/Header/FileMenu.jsx +++ b/web/src/js/components/Header/FileMenu.jsx @@ -1,10 +1,19 @@ -import React, { Component } from 'react' +import React, { Component, PropTypes } from 'react' import { connect } from 'react-redux' import classnames from 'classnames' +import FileChooser from '../common/FileChooser' import * as flowsActions from '../../ducks/flows' + + class FileMenu extends Component { + static propTypes = { + clearFlows: PropTypes.func.isRequired, + loadFlows: PropTypes.func.isRequired, + saveFlows: PropTypes.func.isRequired + } + constructor(props, context) { super(props, context) this.state = { show: false } @@ -45,12 +54,8 @@ class FileMenu extends Component { this.fileInput.click() } - onOpenFile(e) { - e.preventDefault() - if (e.target.files.length > 0) { - this.props.loadFlows(e.target.files[0]) - this.fileInput.value = '' - } + onOpenFile(file) { + this.props.loadFlows(file) } onSaveClick(e) { @@ -70,15 +75,10 @@ class FileMenu extends Component {
  • - - - Open... - - this.fileInput = ref} - className="hidden" - type="file" - onChange={this.onOpenFile} +
  • diff --git a/web/src/js/components/common/FileChooser.jsx b/web/src/js/components/common/FileChooser.jsx new file mode 100644 index 00000000..d8a80ad7 --- /dev/null +++ b/web/src/js/components/common/FileChooser.jsx @@ -0,0 +1,27 @@ +import React, { PropTypes } from 'react' + +FileChooser.propTypes = { + icon: PropTypes.string, + text: PropTypes.string, + className: PropTypes.string, + title: PropTypes.string, + onOpenFile: PropTypes.func.isRequired +} + +export default function FileChooser({ icon, text, className, title, onOpenFile }) { + let fileInput; + return ( + fileInput.click()} + className={className} + title={title}> + + {text} + fileInput = ref} + className="hidden" + type="file" + onChange={e => { e.preventDefault(); if(e.target.files.length > 0) onOpenFile(e.target.files[0]); fileInput = "";}} + /> + + ) +} -- cgit v1.2.3 From dbec2e094009501ccb75c96ad9f8e936c3b406e3 Mon Sep 17 00:00:00 2001 From: Clemens Date: Tue, 16 Aug 2016 13:17:37 +0200 Subject: refactor flow menu --- web/src/js/components/Header/FlowMenu.jsx | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) (limited to 'web/src') diff --git a/web/src/js/components/Header/FlowMenu.jsx b/web/src/js/components/Header/FlowMenu.jsx index bdd30d5e..e78a49aa 100644 --- a/web/src/js/components/Header/FlowMenu.jsx +++ b/web/src/js/components/Header/FlowMenu.jsx @@ -8,10 +8,14 @@ FlowMenu.title = 'Flow' FlowMenu.propTypes = { flow: PropTypes.object.isRequired, + acceptFlow: PropTypes.func.isRequired, + replayFlow: PropTypes.func.isRequired, + duplicateFlow: PropTypes.func.isRequired, + removeFlow: PropTypes.func.isRequired, + revertFlow: PropTypes.func.isRequired } function FlowMenu({ flow, acceptFlow, replayFlow, duplicateFlow, removeFlow, revertFlow }) { - return (
    -- cgit v1.2.3 From 2236ed4ba5a01f899fb964e51b82e41028665a47 Mon Sep 17 00:00:00 2001 From: Clemens Date: Wed, 17 Aug 2016 11:07:56 +0200 Subject: fix deselection on delete, fix toggleInputButton props --- web/src/js/components/common/ToggleInputButton.jsx | 6 +++--- web/src/js/ducks/flows.js | 5 ++++- 2 files changed, 7 insertions(+), 4 deletions(-) (limited to 'web/src') diff --git a/web/src/js/components/common/ToggleInputButton.jsx b/web/src/js/components/common/ToggleInputButton.jsx index b019dfa3..5fa24c10 100644 --- a/web/src/js/components/common/ToggleInputButton.jsx +++ b/web/src/js/components/common/ToggleInputButton.jsx @@ -6,7 +6,7 @@ export default class ToggleInputButton extends Component { static propTypes = { name: PropTypes.string.isRequired, - txt: PropTypes.string.isRequired, + txt: PropTypes.string, onToggleChanged: PropTypes.func.isRequired, checked: PropTypes.bool.isRequired, placeholder: PropTypes.string.isRequired, @@ -15,7 +15,7 @@ export default class ToggleInputButton extends Component { constructor(props) { super(props) - this.state = { txt: props.txt } + this.state = { txt: props.txt || '' } } onKeyDown(e) { @@ -41,7 +41,7 @@ export default class ToggleInputButton extends Component { className="form-control" placeholder={placeholder} disabled={checked} - value={this.state.txt || ''} + value={this.state.txt} type={inputType || 'text'} onChange={e => this.setState({ txt: e.target.value })} onKeyDown={e => this.onKeyDown(e)} diff --git a/web/src/js/ducks/flows.js b/web/src/js/ducks/flows.js index f96653a9..913d0881 100644 --- a/web/src/js/ducks/flows.js +++ b/web/src/js/ducks/flows.js @@ -210,5 +210,8 @@ export function updateFlow(item) { * @private */ export function removeFlow(id) { - return { type: REMOVE, id } + return (dispatch) => { + dispatch(select()) + dispatch({ type: REMOVE, id }) + } } -- cgit v1.2.3 From cc838f6c28854e98e170a4cd8b676f51b410ccd6 Mon Sep 17 00:00:00 2001 From: Clemens Date: Wed, 17 Aug 2016 12:12:32 +0200 Subject: refactor codeeditor --- web/src/js/components/ContentView/CodeEditor.jsx | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) (limited to 'web/src') diff --git a/web/src/js/components/ContentView/CodeEditor.jsx b/web/src/js/components/ContentView/CodeEditor.jsx index d0430e6f..8afc128f 100644 --- a/web/src/js/components/ContentView/CodeEditor.jsx +++ b/web/src/js/components/ContentView/CodeEditor.jsx @@ -1,5 +1,4 @@ -import React, { Component, PropTypes } from 'react' -import { render } from 'react-dom'; +import React, {PropTypes} from 'react' import Codemirror from 'react-codemirror'; -- cgit v1.2.3 From 0f4eb24a8dbe552d1b3b61481fea37c52c27da9f Mon Sep 17 00:00:00 2001 From: Clemens Date: Wed, 17 Aug 2016 12:19:04 +0200 Subject: fix viewselector bug --- web/src/js/components/ContentView/ViewSelector.jsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'web/src') diff --git a/web/src/js/components/ContentView/ViewSelector.jsx b/web/src/js/components/ContentView/ViewSelector.jsx index 59ec4276..f879dbc5 100644 --- a/web/src/js/components/ContentView/ViewSelector.jsx +++ b/web/src/js/components/ContentView/ViewSelector.jsx @@ -7,7 +7,7 @@ import { setContentView } from "../../ducks/ui/flow"; function ViewItem({ name, setContentView, children }) { return (
  • - setContentView(name)}> + {e.preventDefault(); setContentView(name)}}> {children}
    • -- cgit v1.2.3 From a416732665aa7a0fb56e20f9888fd9488750a4df Mon Sep 17 00:00:00 2001 From: Clemens Date: Thu, 18 Aug 2016 16:44:49 +0200 Subject: refactor dropdown menu, view selector --- web/src/js/components/ContentView/ViewSelector.jsx | 80 ++++++---------------- web/src/js/components/Header/FileMenu.jsx | 80 +++++++--------------- web/src/js/components/common/Dropdown.jsx | 56 +++++++++++++++ web/src/js/components/common/FileChooser.jsx | 2 +- 4 files changed, 103 insertions(+), 115 deletions(-) create mode 100644 web/src/js/components/common/Dropdown.jsx (limited to 'web/src') diff --git a/web/src/js/components/ContentView/ViewSelector.jsx b/web/src/js/components/ContentView/ViewSelector.jsx index f879dbc5..ab433ea3 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 -}*/ - - -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) - } + setContentView: PropTypes.func.isRequired +} - render() { - const {contentViews, activeView, isEdit, setContentView} = this.props - let edit = ContentViews.Edit.displayName +function ViewSelector ({contentViews, activeView, isEdit, setContentView}){ + let edit = ContentViews.Edit.displayName + let inner = View: {activeView} - return ( -
    - this.onDropdown(e) } - href="#"> - View: {activeView} + return ( + + {contentViews.map(name => + {e.preventDefault(); setContentView(name)}}> + {name.toLowerCase().replace('_', ' ')} -
      - {contentViews.map(name => - - {name.toLowerCase().replace('_', ' ')} - - )} - {isEdit && - - {edit.toLowerCase()} - - } -
    -
    - ) - } + ) + } + {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 392cc163..6053b2d3 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 00000000..9180767f --- /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 d8a80ad7..d59d2d6d 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}> -- cgit v1.2.3 From 66e9db3713d54c67be1cf2bef1b0633db084649c Mon Sep 17 00:00:00 2001 From: Clemens Date: Thu, 18 Aug 2016 18:05:38 +0200 Subject: refactor contentviews, dropdown, filemenu and footer --- web/src/css/dropdown.less | 4 + web/src/js/components/ContentView/ContentViews.jsx | 33 +++++--- web/src/js/components/Footer.jsx | 33 ++++---- web/src/js/components/Header/FileMenu.jsx | 97 ++++++++-------------- web/src/js/components/common/Dropdown.jsx | 9 +- 5 files changed, 83 insertions(+), 93 deletions(-) create mode 100644 web/src/css/dropdown.less (limited to 'web/src') diff --git a/web/src/css/dropdown.less b/web/src/css/dropdown.less new file mode 100644 index 00000000..663373b3 --- /dev/null +++ b/web/src/css/dropdown.less @@ -0,0 +1,4 @@ +hr .divider { + margin-top: 5px; + margin-bottom: 5px; +} diff --git a/web/src/js/components/ContentView/ContentViews.jsx b/web/src/js/components/ContentView/ContentViews.jsx index cd593023..5b07969c 100644 --- a/web/src/js/components/ContentView/ContentViews.jsx +++ b/web/src/js/components/ContentView/ContentViews.jsx @@ -30,6 +30,12 @@ function Edit({ content, onChange }) { Edit = ContentLoader(Edit) class ViewServer extends Component { + static propTypes = { + showFullContent: PropTypes.bool.isRequired, + maxLines: PropTypes.number.isRequired, + setContentViewDescription : PropTypes.func.isRequired, + setContent: PropTypes.func.isRequired + } componentWillMount(){ this.setContentView(this.props) @@ -40,6 +46,7 @@ class ViewServer extends Component { this.setContentView(nextProps) } } + setContentView(props){ try { this.data = JSON.parse(props.content) @@ -50,25 +57,31 @@ class ViewServer extends Component { props.setContentViewDescription(props.contentView != this.data.description ? this.data.description : '') props.setContent(this.data.lines) } + render() { const {content, contentView, message, maxLines} = this.props let lines = this.props.showFullContent ? this.data.lines : this.data.lines.slice(0, maxLines) - return
    + return ( + 
                         {lines.map((line, i) =>
                         
    
-                            {line.map((tuple, j) =>
-                                
-                                    {tuple[1]}
-                                
-                            )}
+                            {line.map((element, j) => {
+                                let style, text = element
+                                return (
+                                    
+                                        {element}
+                                    
+                                )
+                            })}
                         
    
                     )}
    - {ViewImage.matches(message) && - - } -
    + {ViewImage.matches(message) && + + } +
    + ) } } diff --git a/web/src/js/components/Footer.jsx b/web/src/js/components/Footer.jsx index 2bda70e1..96e7b7db 100644 --- a/web/src/js/components/Footer.jsx +++ b/web/src/js/components/Footer.jsx @@ -7,40 +7,41 @@ Footer.propTypes = { } function Footer({ settings }) { + let {mode, intercept, showhost, no_upstream_cert, rawtcp, http2, anticache, anticomp, stickyauth, stickycookie, stream} = settings; return (
    - {settings.mode && settings.mode != "regular" && ( - {settings.mode} mode + {mode && mode != "regular" && ( + {mode} mode )} - {settings.intercept && ( - Intercept: {settings.intercept} + {intercept && ( + Intercept: {intercept} )} - {settings.showhost && ( + {showhost && ( showhost )} - {settings.no_upstream_cert && ( + {no_upstream_cert && ( no-upstream-cert )} - {settings.rawtcp && ( + {rawtcp && ( raw-tcp )} - {!settings.http2 && ( + {!http2 && ( no-http2 )} - {settings.anticache && ( + {anticache && ( anticache )} - {settings.anticomp && ( + {anticomp && ( anticomp )} - {settings.stickyauth && ( - stickyauth: {settings.stickyauth} + {stickyauth && ( + stickyauth: {stickyauth} )} - {settings.stickycookie && ( - stickycookie: {settings.stickycookie} + {stickycookie && ( + stickycookie: {stickycookie} )} - {settings.stream && ( - stream: {formatSize(settings.stream)} + {stream && ( + stream: {formatSize(stream)} )}
    ) diff --git a/web/src/js/components/Header/FileMenu.jsx b/web/src/js/components/Header/FileMenu.jsx index 6053b2d3..53c63ea1 100644 --- a/web/src/js/components/Header/FileMenu.jsx +++ b/web/src/js/components/Header/FileMenu.jsx @@ -1,71 +1,46 @@ 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 Dropdown, {Divider} from '../common/Dropdown' import * as flowsActions from '../../ducks/flows' +FileMenu.propTypes = { + clearFlows: PropTypes.func.isRequired, + loadFlows: PropTypes.func.isRequired, + saveFlows: PropTypes.func.isRequired +} +FileMenu.onNewClick = (e, clearFlows) => { + e.preventDefault(); + if (confirm('Delete all flows?')) + clearFlows() +} -class FileMenu extends Component { - - static propTypes = { - clearFlows: PropTypes.func.isRequired, - loadFlows: PropTypes.func.isRequired, - saveFlows: PropTypes.func.isRequired - } - - constructor(props, context) { - super(props, context) - - this.onNewClick = this.onNewClick.bind(this) - this.onOpenClick = this.onOpenClick.bind(this) - this.onOpenFile = this.onOpenFile.bind(this) - this.onSaveClick = this.onSaveClick.bind(this) - } - - onNewClick(e) { - e.preventDefault() - if (confirm('Delete all flows?')) { - this.props.clearFlows() - } - } - - onOpenFile(file) { - this.props.loadFlows(file) - } - - onSaveClick(e) { - e.preventDefault() - this.props.saveFlows() - } - - render() { - return ( - -     - - New - - - - - Save... - - - - - - - Install Certificates... - - - ) - } +function FileMenu ({clearFlows, loadFlows, saveFlows}) { + return ( + + FileMenu.onNewClick(e, clearFlows)}> + + New + + loadFlows(file)} + /> + { e.preventDefault(); saveFlows();}}> + + Save... + + + + + + + Install Certificates... + + + ) } export default connect( diff --git a/web/src/js/components/common/Dropdown.jsx b/web/src/js/components/common/Dropdown.jsx index 9180767f..9db131d4 100644 --- a/web/src/js/components/common/Dropdown.jsx +++ b/web/src/js/components/common/Dropdown.jsx @@ -1,6 +1,8 @@ import React, { Component, PropTypes } from 'react' import classnames from 'classnames' +export function Divider () { return
    } + export default class Dropdown extends Component { static propTypes = { @@ -43,12 +45,7 @@ export default class Dropdown extends Component { {text}
      - {children.map(item => - item.name == "divider" ? -
    • - : -
    • {item}
      • - )} + {children.map ( (item, i) =>
    • {item}
      • )}
    ) -- cgit v1.2.3 From d4b18eae8181051f5230b796046cc7ff56e94862 Mon Sep 17 00:00:00 2001 From: Clemens Date: Fri, 19 Aug 2016 09:23:41 +0200 Subject: refactoring --- web/src/js/components/ContentView/UploadContentButton.jsx | 4 +--- web/src/js/components/common/Dropdown.jsx | 2 +- web/src/js/ducks/ui/flow.js | 3 +-- web/src/js/utils.js | 7 ++++--- 4 files changed, 7 insertions(+), 9 deletions(-) (limited to 'web/src') diff --git a/web/src/js/components/ContentView/UploadContentButton.jsx b/web/src/js/components/ContentView/UploadContentButton.jsx index 6764e234..de349af4 100644 --- a/web/src/js/components/ContentView/UploadContentButton.jsx +++ b/web/src/js/components/ContentView/UploadContentButton.jsx @@ -6,9 +6,7 @@ UploadContentButton.propTypes = { } export default function UploadContentButton({ uploadContent }) { - - let fileInput; - + return ( } +export const Divider = () =>
    export default class Dropdown extends Component { diff --git a/web/src/js/ducks/ui/flow.js b/web/src/js/ducks/ui/flow.js index 22a8c22d..e65c39a3 100644 --- a/web/src/js/ducks/ui/flow.js +++ b/web/src/js/ducks/ui/flow.js @@ -152,6 +152,5 @@ export function setContent(content){ } export function stopEdit(flow, modifiedFlow) { - let diff = getDiff(flow, modifiedFlow) - return flowsActions.update(flow, diff) + return flowsActions.update(flow, getDiff(flow, modifiedFlow)) } diff --git a/web/src/js/utils.js b/web/src/js/utils.js index e44182d0..e8470cec 100644 --- a/web/src/js/utils.js +++ b/web/src/js/utils.js @@ -107,14 +107,15 @@ fetchApi.put = (url, json, options) => fetchApi( ...options } ) - +// deep comparison of two json objects (dicts). arrays are handeled as a single value. +// return: json object including only the changed keys value pairs. export function getDiff(obj1, obj2) { let result = {...obj2}; for(let key in obj1) { if(_.isEqual(obj2[key], obj1[key])) result[key] = undefined - else if(!(Array.isArray(obj2[key]) && Array.isArray(obj1[key])) && - typeof obj2[key] == 'object' && typeof obj1[key] == 'object') + else if(Object.prototype.toString.call(obj2[key]) === '[object Object]' && + Object.prototype.toString.call(obj1[key]) === '[object Object]' ) result[key] = getDiff(obj1[key], obj2[key]) } return result -- cgit v1.2.3 From d0b420f383d1d670c25ee90216ac0045fba3ebc0 Mon Sep 17 00:00:00 2001 From: Clemens Date: Fri, 19 Aug 2016 09:58:29 +0200 Subject: fix refactoring bug --- web/src/js/components/ContentView/ContentViews.jsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'web/src') diff --git a/web/src/js/components/ContentView/ContentViews.jsx b/web/src/js/components/ContentView/ContentViews.jsx index 5b07969c..32a07564 100644 --- a/web/src/js/components/ContentView/ContentViews.jsx +++ b/web/src/js/components/ContentView/ContentViews.jsx @@ -67,10 +67,10 @@ class ViewServer extends Component { {lines.map((line, i) =>
    {line.map((element, j) => { - let style, text = element + let [style, text] = element return ( - {element} + {text} ) })} -- cgit v1.2.3 From eddc4243791c2c2b1a91c1d8ae49b830206bc6df Mon Sep 17 00:00:00 2001 From: Clemens Date: Mon, 22 Aug 2016 08:57:55 +0200 Subject: fix dropdown css, add new selection after delete --- web/src/css/dropdown.less | 2 +- web/src/js/ducks/flows.js | 11 +++++++++-- 2 files changed, 10 insertions(+), 3 deletions(-) (limited to 'web/src') diff --git a/web/src/css/dropdown.less b/web/src/css/dropdown.less index 663373b3..ba8442df 100644 --- a/web/src/css/dropdown.less +++ b/web/src/css/dropdown.less @@ -1,4 +1,4 @@ -hr .divider { +hr.divider { margin-top: 5px; margin-bottom: 5px; } diff --git a/web/src/js/ducks/flows.js b/web/src/js/ducks/flows.js index 913d0881..404db0d1 100644 --- a/web/src/js/ducks/flows.js +++ b/web/src/js/ducks/flows.js @@ -1,5 +1,6 @@ import { fetchApi } from '../utils' import reduceList, * as listActions from './utils/list' +import { selectRelative } from './flowView' import * as msgQueueActions from './msgQueue' import * as websocketActions from './websocket' @@ -210,8 +211,14 @@ export function updateFlow(item) { * @private */ export function removeFlow(id) { - return (dispatch) => { - dispatch(select()) + return (dispatch, getState) => { + let currentIndex = getState().flowView.indexOf[getState().flows.selected[0]] + let maxIndex = getState().flowView.data.length - 1 + let deleteLastEntry = maxIndex == 0 + if (deleteLastEntry) + dispatch(select()) + else + dispatch(selectRelative(currentIndex == maxIndex ? -1 : 1) ) dispatch({ type: REMOVE, id }) } } -- cgit v1.2.3