- SettingsActions.update({showhost: !showhost})}
+ onToggle={() => SettingsActions.update({showhost: !showhost})}
/>
- SettingsActions.update({no_upstream_cert: !no_upstream_cert})}
+ onToggle={() => SettingsActions.update({no_upstream_cert: !no_upstream_cert})}
/>
- SettingsActions.update({rawtcp: !rawtcp})}
+ onToggle={() => SettingsActions.update({rawtcp: !rawtcp})}
/>
- SettingsActions.update({http2: !http2})}
+ onToggle={() => SettingsActions.update({http2: !http2})}
/>
- SettingsActions.update({anticache: !anticache})}
+ onToggle={() => SettingsActions.update({anticache: !anticache})}
/>
- SettingsActions.update({anticomp: !anticomp})}
+ onToggle={() => SettingsActions.update({anticomp: !anticomp})}
/>
,
-
+
];
} else {
eventlog = null;
@@ -142,13 +143,17 @@ var ProxyAppMain = React.createClass({
}
});
+const AppContainer = connect(
+ state => ({
+ showEventLog: state.eventLog.visible
+ })
+)(ProxyAppMain);
-import { Route, Router as ReactRouter, hashHistory, Redirect} from "react-router";
-export var app = (
+export var App = (
-
+
diff --git a/web/src/js/connection.js b/web/src/js/connection.js
index 6177938e8..75c2cf258 100644
--- a/web/src/js/connection.js
+++ b/web/src/js/connection.js
@@ -1,19 +1,22 @@
-
import {ConnectionActions, EventLogActions} from "./actions.js";
import {AppDispatcher} from "./dispatcher.js";
+import * as websocketActions from "./ducks/websocket"
-function Connection(url) {
+export default function Connection(url, dispatch) {
if (url[0] === "/") {
url = location.origin.replace("http", "ws") + url;
}
var ws = new WebSocket(url);
ws.onopen = function () {
+ dispatch(websocketActions.connected());
ConnectionActions.open();
+ //TODO: fetch stuff!
};
- ws.onmessage = function (message) {
- var m = JSON.parse(message.data);
- AppDispatcher.dispatchServerAction(m);
+ ws.onmessage = function (m) {
+ var message = JSON.parse(m.data);
+ AppDispatcher.dispatchServerAction(message);
+ dispatch(message);
};
ws.onerror = function () {
ConnectionActions.error();
@@ -22,8 +25,7 @@ function Connection(url) {
ws.onclose = function () {
ConnectionActions.close();
EventLogActions.add_event("WebSocket connection closed.");
+ dispatch(websocketActions.disconnected());
};
return ws;
-}
-
-export default Connection;
\ No newline at end of file
+}
\ No newline at end of file
diff --git a/web/src/js/ducks/README.md b/web/src/js/ducks/README.md
new file mode 100644
index 000000000..9d005f35f
--- /dev/null
+++ b/web/src/js/ducks/README.md
@@ -0,0 +1 @@
+https://github.com/erikras/ducks-modular-redux
\ No newline at end of file
diff --git a/web/src/js/ducks/eventLog.js b/web/src/js/ducks/eventLog.js
new file mode 100644
index 000000000..2040711cd
--- /dev/null
+++ b/web/src/js/ducks/eventLog.js
@@ -0,0 +1,61 @@
+import getList, {ADD} from "./list"
+const TOGGLE_FILTER = 'TOGGLE_EVENTLOG_FILTER'
+const TOGGLE_VISIBILITY = 'TOGGLE_EVENTLOG_VISIBILITY'
+const UPDATE_LIST = "UPDATE_EVENTLOG"
+
+
+const defaultState = {
+ visible: false,
+ filter: {
+ "debug": false,
+ "info": true,
+ "web": true
+ },
+ events: getList(),
+ filteredEvents: [],
+}
+
+export default function reducer(state = defaultState, action) {
+ switch (action.type) {
+ case TOGGLE_FILTER:
+ const filter = {
+ ...state.filter,
+ [action.filter]: !state.filter[action.filter]
+ }
+ return {
+ ...state,
+ filter,
+ filteredEvents: state.events.list.filter(x => filter[x.level])
+ }
+ case TOGGLE_VISIBILITY:
+ return {
+ ...state,
+ visible: !state.visible
+ }
+ case UPDATE_LIST:
+ const events = getList(state.events, action)
+ return {
+ ...state,
+ events,
+ filteredEvents: events.list.filter(x => state.filter[x.level])
+ }
+ default:
+ return state
+ }
+}
+
+
+export function toggleEventLogFilter(filter) {
+ return {type: TOGGLE_FILTER, filter}
+}
+export function toggleEventLogVisibility() {
+ return {type: TOGGLE_VISIBILITY}
+}
+let id = 0;
+export function addLogEntry(message, level = "web") {
+ return {
+ type: UPDATE_LIST,
+ cmd: ADD,
+ data: {message, level, id: `log-${id++}`}
+ }
+}
\ No newline at end of file
diff --git a/web/src/js/ducks/index.js b/web/src/js/ducks/index.js
new file mode 100644
index 000000000..3043344c8
--- /dev/null
+++ b/web/src/js/ducks/index.js
@@ -0,0 +1,10 @@
+import {combineReducers} from 'redux'
+import eventLog from './eventLog.js'
+import websocket from './websocket.js'
+
+const rootReducer = combineReducers({
+ eventLog,
+ websocket,
+})
+
+export default rootReducer
\ No newline at end of file
diff --git a/web/src/js/ducks/list.js b/web/src/js/ducks/list.js
new file mode 100644
index 000000000..0b3771e2c
--- /dev/null
+++ b/web/src/js/ducks/list.js
@@ -0,0 +1,21 @@
+export const ADD = 'add'
+
+const defaultState = {
+ list: [],
+ //isFetching: false,
+ //updateBeforeFetch: [],
+ indexOf: {},
+ //views: {}
+};
+
+export default function getList(state = defaultState, action = {}) {
+ switch (action.cmd) {
+ case ADD:
+ return {
+ list: [...state.list, action.data],
+ indexOf: {...state.indexOf, [action.data.id]: state.list.length},
+ }
+ default:
+ return state
+ }
+}
\ No newline at end of file
diff --git a/web/src/js/ducks/websocket.js b/web/src/js/ducks/websocket.js
new file mode 100644
index 000000000..3999dbcf1
--- /dev/null
+++ b/web/src/js/ducks/websocket.js
@@ -0,0 +1,30 @@
+const CONNECTED = 'WEBSOCKET_CONNECTED'
+const DISCONNECTED = 'WEBSOCKET_DISCONNECTED'
+
+
+const defaultState = {
+ connected: true,
+ /* we may want to have an error message attribute here at some point */
+}
+export default function reducer(state = defaultState, action) {
+ switch (action.type) {
+ case CONNECTED:
+ return {
+ connected: true
+ }
+ case DISCONNECTED:
+ return {
+ connected: false
+ }
+ default:
+ return state
+ }
+}
+
+
+export function connected() {
+ return {type: CONNECTED}
+}
+export function disconnected() {
+ return {type: DISCONNECTED}
+}
\ No newline at end of file