From ac5d74d42c0824b5789cc030bf39a447951e4804 Mon Sep 17 00:00:00 2001
From: Maximilian Hils <git@maximilianhils.com>
Date: Sat, 21 Mar 2015 21:55:02 +0100
Subject: web: fix bugs
---
web/src/js/components/mainview.js | 2 ++
1 file changed, 2 insertions(+)
(limited to 'web/src/js/components/mainview.js')
diff --git a/web/src/js/components/mainview.js b/web/src/js/components/mainview.js
index 184ef49f..8eda2e9c 100644
--- a/web/src/js/components/mainview.js
+++ b/web/src/js/components/mainview.js
@@ -203,6 +203,8 @@ var MainView = React.createClass({
actions.FlowActions.revert(flow);
}
break;
+ case toputils.Key.SHIFT:
+ break;
default:
console.debug("keydown", e.keyCode);
return;
--
cgit v1.2.3
From 02a61ea45dc1ca6d0c88b44adf83f68b791130e7 Mon Sep 17 00:00:00 2001
From: Maximilian Hils <git@maximilianhils.com>
Date: Sat, 21 Mar 2015 22:49:51 +0100
Subject: structure components
---
web/src/js/components/mainview.js | 4 ++--
1 file changed, 2 insertions(+), 2 deletions(-)
(limited to 'web/src/js/components/mainview.js')
diff --git a/web/src/js/components/mainview.js b/web/src/js/components/mainview.js
index 8eda2e9c..81bf3b03 100644
--- a/web/src/js/components/mainview.js
+++ b/web/src/js/components/mainview.js
@@ -7,7 +7,7 @@ var toputils = require("../utils.js");
var views = require("../store/view.js");
var Filt = require("../filt/filt.js");
FlowTable = require("./flowtable.js");
-var flowdetail = require("./flowdetail.js");
+var FlowView = require("./flowview/index.js");
var MainView = React.createClass({
mixins: [common.Navigation, common.State],
@@ -221,7 +221,7 @@ var MainView = React.createClass({
if (selected) {
details = [
<common.Splitter key="splitter"/>,
- <flowdetail.FlowDetail key="flowDetails" ref="flowDetails" flow={selected}/>
+ <FlowView key="flowDetails" ref="flowDetails" flow={selected}/>
];
} else {
details = null;
--
cgit v1.2.3
From 968c7021dfef00c459899520921faf7367e923d9 Mon Sep 17 00:00:00 2001
From: Maximilian Hils <git@maximilianhils.com>
Date: Mon, 23 Mar 2015 00:24:56 +0100
Subject: web: add basic edit capability for first line
---
web/src/js/components/mainview.js | 9 +++++++++
1 file changed, 9 insertions(+)
(limited to 'web/src/js/components/mainview.js')
diff --git a/web/src/js/components/mainview.js b/web/src/js/components/mainview.js
index 81bf3b03..9790a69e 100644
--- a/web/src/js/components/mainview.js
+++ b/web/src/js/components/mainview.js
@@ -11,6 +11,15 @@ var FlowView = require("./flowview/index.js");
var MainView = React.createClass({
mixins: [common.Navigation, common.State],
+ childContextTypes: {
+ returnFocus: React.PropTypes.func.isRequired
+ },
+ getChildContext: function() {
+ return { returnFocus: this.returnFocus };
+ },
+ returnFocus: function(){
+ this.getDOMNode().focus();
+ },
getInitialState: function () {
return {
flows: [],
--
cgit v1.2.3
From 1913975fa60c76bfb7e79a908b18e7e93793f71f Mon Sep 17 00:00:00 2001
From: Maximilian Hils <git@maximilianhils.com>
Date: Fri, 27 Mar 2015 21:58:04 +0100
Subject: web: use contexts to pass down stores.
Using contexts frees us from the contracts we have
using props - namely, we can assume them to be constant
for the lifetime of the object.
---
web/src/js/components/mainview.js | 63 +++++++++++++++++----------------------
1 file changed, 27 insertions(+), 36 deletions(-)
(limited to 'web/src/js/components/mainview.js')
diff --git a/web/src/js/components/mainview.js b/web/src/js/components/mainview.js
index 9790a69e..54687373 100644
--- a/web/src/js/components/mainview.js
+++ b/web/src/js/components/mainview.js
@@ -10,22 +10,40 @@ FlowTable = require("./flowtable.js");
var FlowView = require("./flowview/index.js");
var MainView = React.createClass({
- mixins: [common.Navigation, common.State],
+ mixins: [common.Navigation, common.RouterState],
+ contextTypes: {
+ flowStore: React.PropTypes.object.isRequired,
+ },
childContextTypes: {
- returnFocus: React.PropTypes.func.isRequired
+ returnFocus: React.PropTypes.func.isRequired,
+ view: React.PropTypes.object.isRequired,
},
- getChildContext: function() {
- return { returnFocus: this.returnFocus };
+ getChildContext: function () {
+ return {
+ returnFocus: this.returnFocus,
+ view: this.state.view
+ };
},
- returnFocus: function(){
+ returnFocus: function () {
this.getDOMNode().focus();
},
getInitialState: function () {
+ var sortKeyFun = false;
+ var view = new views.StoreView(this.context.flowStore, this.getViewFilt(), sortKeyFun);
+ view.addListener("recalculate", this.onRecalculate);
+ view.addListener("add", this.onUpdate);
+ view.addListener("update", this.onUpdate);
+ view.addListener("remove", this.onUpdate);
+ view.addListener("remove", this.onRemove);
+
return {
- flows: [],
- sortKeyFun: false
+ view: view,
+ sortKeyFun: sortKeyFun
};
},
+ componentWillUnmount: function () {
+ this.state.view.close();
+ },
getViewFilt: function () {
try {
var filt = Filt.parse(this.getQuery()[Query.FILTER] || "");
@@ -44,29 +62,12 @@ var MainView = React.createClass({
};
},
componentWillReceiveProps: function (nextProps) {
- if (nextProps.flowStore !== this.props.flowStore) {
- this.closeView();
- this.openView(nextProps.flowStore);
- }
-
var filterChanged = (this.props.query[Query.FILTER] !== nextProps.query[Query.FILTER]);
var highlightChanged = (this.props.query[Query.HIGHLIGHT] !== nextProps.query[Query.HIGHLIGHT]);
if (filterChanged || highlightChanged) {
this.state.view.recalculate(this.getViewFilt(), this.state.sortKeyFun);
}
},
- openView: function (store) {
- var view = new views.StoreView(store, this.getViewFilt(), this.state.sortKeyFun);
- this.setState({
- view: view
- });
-
- view.addListener("recalculate", this.onRecalculate);
- view.addListener("add", this.onUpdate);
- view.addListener("update", this.onUpdate);
- view.addListener("remove", this.onUpdate);
- view.addListener("remove", this.onRemove);
- },
onRecalculate: function () {
this.forceUpdate();
var selected = this.getSelected();
@@ -85,16 +86,7 @@ var MainView = React.createClass({
this.selectFlow(flow_to_select);
}
},
- closeView: function () {
- this.state.view.close();
- },
- componentWillMount: function () {
- this.openView(this.props.flowStore);
- },
- componentWillUnmount: function () {
- this.closeView();
- },
- setSortKeyFun: function(sortKeyFun){
+ setSortKeyFun: function (sortKeyFun) {
this.setState({
sortKeyFun: sortKeyFun
});
@@ -221,7 +213,7 @@ var MainView = React.createClass({
e.preventDefault();
},
getSelected: function () {
- return this.props.flowStore.get(this.getParams().flowId);
+ return this.context.flowStore.get(this.getParams().flowId);
},
render: function () {
var selected = this.getSelected();
@@ -239,7 +231,6 @@ var MainView = React.createClass({
return (
<div className="main-view" onKeyDown={this.onKeyDown} tabIndex="0">
<FlowTable ref="flowTable"
- view={this.state.view}
selectFlow={this.selectFlow}
setSortKeyFun={this.setSortKeyFun}
selected={selected} />
--
cgit v1.2.3
From fd911b75e6a59c1050815a6c183c4eb32aaabb98 Mon Sep 17 00:00:00 2001
From: Maximilian Hils <git@maximilianhils.com>
Date: Sun, 29 Mar 2015 01:45:37 +0100
Subject: web: global key handling
---
web/src/js/components/mainview.js | 4 ++--
1 file changed, 2 insertions(+), 2 deletions(-)
(limited to 'web/src/js/components/mainview.js')
diff --git a/web/src/js/components/mainview.js b/web/src/js/components/mainview.js
index 54687373..f102ed5e 100644
--- a/web/src/js/components/mainview.js
+++ b/web/src/js/components/mainview.js
@@ -130,7 +130,7 @@ var MainView = React.createClass({
}
this.selectFlow(flows[index]);
},
- onKeyDown: function (e) {
+ onMainKeyDown: function (e) {
var flow = this.getSelected();
if (e.ctrlKey) {
return;
@@ -229,7 +229,7 @@ var MainView = React.createClass({
}
return (
- <div className="main-view" onKeyDown={this.onKeyDown} tabIndex="0">
+ <div className="main-view">
<FlowTable ref="flowTable"
selectFlow={this.selectFlow}
setSortKeyFun={this.setSortKeyFun}
--
cgit v1.2.3
From 93d1d0416d6b48506e4579456ad3d7cd9dbd3e91 Mon Sep 17 00:00:00 2001
From: Maximilian Hils <git@maximilianhils.com>
Date: Sun, 29 Mar 2015 03:24:03 +0200
Subject: web: add more keyboard shortcuts
---
web/src/js/components/mainview.js | 5 -----
1 file changed, 5 deletions(-)
(limited to 'web/src/js/components/mainview.js')
diff --git a/web/src/js/components/mainview.js b/web/src/js/components/mainview.js
index f102ed5e..8f6989ae 100644
--- a/web/src/js/components/mainview.js
+++ b/web/src/js/components/mainview.js
@@ -15,18 +15,13 @@ var MainView = React.createClass({
flowStore: React.PropTypes.object.isRequired,
},
childContextTypes: {
- returnFocus: React.PropTypes.func.isRequired,
view: React.PropTypes.object.isRequired,
},
getChildContext: function () {
return {
- returnFocus: this.returnFocus,
view: this.state.view
};
},
- returnFocus: function () {
- this.getDOMNode().focus();
- },
getInitialState: function () {
var sortKeyFun = false;
var view = new views.StoreView(this.context.flowStore, this.getViewFilt(), sortKeyFun);
--
cgit v1.2.3
From 737002921e9aed701afb49fda8777e8c9286bf09 Mon Sep 17 00:00:00 2001
From: Maximilian Hils <git@maximilianhils.com>
Date: Mon, 30 Mar 2015 00:46:33 +0200
Subject: s/filter/search/
no matter what we agree on in #542,
this needs to be done anyway.
---
web/src/js/components/mainview.js | 4 ++--
1 file changed, 2 insertions(+), 2 deletions(-)
(limited to 'web/src/js/components/mainview.js')
diff --git a/web/src/js/components/mainview.js b/web/src/js/components/mainview.js
index 8f6989ae..2b7819c5 100644
--- a/web/src/js/components/mainview.js
+++ b/web/src/js/components/mainview.js
@@ -41,7 +41,7 @@ var MainView = React.createClass({
},
getViewFilt: function () {
try {
- var filt = Filt.parse(this.getQuery()[Query.FILTER] || "");
+ var filt = Filt.parse(this.getQuery()[Query.SEARCH] || "");
var highlightStr = this.getQuery()[Query.HIGHLIGHT];
var highlight = highlightStr ? Filt.parse(highlightStr) : false;
} catch (e) {
@@ -57,7 +57,7 @@ var MainView = React.createClass({
};
},
componentWillReceiveProps: function (nextProps) {
- var filterChanged = (this.props.query[Query.FILTER] !== nextProps.query[Query.FILTER]);
+ var filterChanged = (this.props.query[Query.SEARCH] !== nextProps.query[Query.SEARCH]);
var highlightChanged = (this.props.query[Query.HIGHLIGHT] !== nextProps.query[Query.HIGHLIGHT]);
if (filterChanged || highlightChanged) {
this.state.view.recalculate(this.getViewFilt(), this.state.sortKeyFun);
--
cgit v1.2.3
From 6d29f93e9eaaabe20c0d46887048f2367bfbb3cf Mon Sep 17 00:00:00 2001
From: Maximilian Hils <git@maximilianhils.com>
Date: Mon, 30 Mar 2015 03:49:50 +0200
Subject: web: add prompt for keyboard navigation
---
web/src/js/components/mainview.js | 56 ++++++++++++++++++++++-----------------
1 file changed, 31 insertions(+), 25 deletions(-)
(limited to 'web/src/js/components/mainview.js')
diff --git a/web/src/js/components/mainview.js b/web/src/js/components/mainview.js
index 2b7819c5..9ff51dfa 100644
--- a/web/src/js/components/mainview.js
+++ b/web/src/js/components/mainview.js
@@ -1,12 +1,13 @@
var React = require("react");
-var common = require("./common.js");
var actions = require("../actions.js");
var Query = require("../actions.js").Query;
-var toputils = require("../utils.js");
+var utils = require("../utils.js");
var views = require("../store/view.js");
var Filt = require("../filt/filt.js");
-FlowTable = require("./flowtable.js");
+
+var common = require("./common.js");
+var FlowTable = require("./flowtable.js");
var FlowView = require("./flowview/index.js");
var MainView = React.createClass({
@@ -105,7 +106,7 @@ var MainView = React.createClass({
var flows = this.state.view.list;
var index;
if (!this.getParams().flowId) {
- if (shift > 0) {
+ if (shift < 0) {
index = flows.length - 1;
} else {
index = 0;
@@ -131,49 +132,49 @@ var MainView = React.createClass({
return;
}
switch (e.keyCode) {
- case toputils.Key.K:
- case toputils.Key.UP:
+ case utils.Key.K:
+ case utils.Key.UP:
this.selectFlowRelative(-1);
break;
- case toputils.Key.J:
- case toputils.Key.DOWN:
+ case utils.Key.J:
+ case utils.Key.DOWN:
this.selectFlowRelative(+1);
break;
- case toputils.Key.SPACE:
- case toputils.Key.PAGE_DOWN:
+ case utils.Key.SPACE:
+ case utils.Key.PAGE_DOWN:
this.selectFlowRelative(+10);
break;
- case toputils.Key.PAGE_UP:
+ case utils.Key.PAGE_UP:
this.selectFlowRelative(-10);
break;
- case toputils.Key.END:
+ case utils.Key.END:
this.selectFlowRelative(+1e10);
break;
- case toputils.Key.HOME:
+ case utils.Key.HOME:
this.selectFlowRelative(-1e10);
break;
- case toputils.Key.ESC:
+ case utils.Key.ESC:
this.selectFlow(null);
break;
- case toputils.Key.H:
- case toputils.Key.LEFT:
+ case utils.Key.H:
+ case utils.Key.LEFT:
if (this.refs.flowDetails) {
this.refs.flowDetails.nextTab(-1);
}
break;
- case toputils.Key.L:
- case toputils.Key.TAB:
- case toputils.Key.RIGHT:
+ case utils.Key.L:
+ case utils.Key.TAB:
+ case utils.Key.RIGHT:
if (this.refs.flowDetails) {
this.refs.flowDetails.nextTab(+1);
}
break;
- case toputils.Key.C:
+ case utils.Key.C:
if (e.shiftKey) {
actions.FlowActions.clear();
}
break;
- case toputils.Key.D:
+ case utils.Key.D:
if (flow) {
if (e.shiftKey) {
actions.FlowActions.duplicate(flow);
@@ -182,24 +183,29 @@ var MainView = React.createClass({
}
}
break;
- case toputils.Key.A:
+ case utils.Key.A:
if (e.shiftKey) {
actions.FlowActions.accept_all();
} else if (flow && flow.intercepted) {
actions.FlowActions.accept(flow);
}
break;
- case toputils.Key.R:
+ case utils.Key.R:
if (!e.shiftKey && flow) {
actions.FlowActions.replay(flow);
}
break;
- case toputils.Key.V:
+ case utils.Key.V:
if (e.shiftKey && flow && flow.modified) {
actions.FlowActions.revert(flow);
}
break;
- case toputils.Key.SHIFT:
+ case utils.Key.E:
+ if (this.refs.flowDetails) {
+ this.refs.flowDetails.promptEdit();
+ }
+ break;
+ case utils.Key.SHIFT:
break;
default:
console.debug("keydown", e.keyCode);
--
cgit v1.2.3