From 795e76eee298e23079f7e979119defc4c187b833 Mon Sep 17 00:00:00 2001
From: Maximilian Hils <git@maximilianhils.com>
Date: Sun, 11 Dec 2016 17:37:11 +0100
Subject: [web] style options menu

The other menus are WIP.
---
 web/src/js/components/Header/MenuToggle.jsx | 69 +++++++++++++++++++++++++++++
 1 file changed, 69 insertions(+)
 create mode 100644 web/src/js/components/Header/MenuToggle.jsx

(limited to 'web/src/js/components/Header/MenuToggle.jsx')

diff --git a/web/src/js/components/Header/MenuToggle.jsx b/web/src/js/components/Header/MenuToggle.jsx
new file mode 100644
index 00000000..726db7bd
--- /dev/null
+++ b/web/src/js/components/Header/MenuToggle.jsx
@@ -0,0 +1,69 @@
+import { PropTypes } from "react"
+import { connect } from "react-redux"
+import { update as updateSettings } from "../../ducks/settings"
+import { toggleVisibility } from "../../ducks/eventLog"
+
+MenuToggle.propTypes = {
+    value: PropTypes.bool.isRequired,
+    onChange: PropTypes.func.isRequired,
+    children: PropTypes.node.isRequired,
+}
+
+export function MenuToggle({ value, onChange, children }) {
+    return (
+        <div className="entry">
+            <label>
+                <input type="checkbox"
+                       value={value}
+                       onChange={onChange}/>
+                {children}
+            </label>
+        </div>
+    )
+}
+
+
+SettingsToggle.propTypes = {
+    setting: PropTypes.string.isRequired,
+    children: PropTypes.node.isRequired,
+}
+
+export function SettingsToggle({ setting, children, settings, updateSettings }) {
+    return (
+        <MenuToggle
+            value={settings[setting] || false} // we don't have settings initially, so just pass false.
+            onChange={() => updateSettings({ [setting]: !settings[setting] })}
+        >
+            {children}
+        </MenuToggle>
+    )
+}
+SettingsToggle = connect(
+    state => ({
+        settings: state.settings,
+    }),
+    {
+        updateSettings,
+    }
+)(SettingsToggle)
+
+
+export function EventlogToggle({ toggleVisibility, eventLogVisible }) {
+    return (
+        <MenuToggle
+            value={eventLogVisible}
+            onChange={toggleVisibility}
+        >
+            Display Event Log
+        </MenuToggle>
+    )
+}
+EventlogToggle = connect(
+    state => ({
+        eventLogVisible: state.eventLog.visible,
+    }),
+    {
+        toggleVisibility,
+    }
+)(EventlogToggle)
+
-- 
cgit v1.2.3


From d1c7b203f08d4b1e1ee3c7a50762a4f08843feef Mon Sep 17 00:00:00 2001
From: Maximilian Hils <git@maximilianhils.com>
Date: Sun, 11 Dec 2016 19:59:54 +0100
Subject: [web] style flow menu

---
 web/src/js/components/Header/MenuToggle.jsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'web/src/js/components/Header/MenuToggle.jsx')

diff --git a/web/src/js/components/Header/MenuToggle.jsx b/web/src/js/components/Header/MenuToggle.jsx
index 726db7bd..8977f3b9 100644
--- a/web/src/js/components/Header/MenuToggle.jsx
+++ b/web/src/js/components/Header/MenuToggle.jsx
@@ -11,7 +11,7 @@ MenuToggle.propTypes = {
 
 export function MenuToggle({ value, onChange, children }) {
     return (
-        <div className="entry">
+        <div className="menu-entry">
             <label>
                 <input type="checkbox"
                        value={value}
-- 
cgit v1.2.3


From d854e08653ccee12119266e2cc3f5d6c279341e5 Mon Sep 17 00:00:00 2001
From: Maximilian Hils <git@maximilianhils.com>
Date: Sun, 11 Dec 2016 22:52:17 +0100
Subject: [web] various fixes

---
 web/src/js/components/Header/MenuToggle.jsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'web/src/js/components/Header/MenuToggle.jsx')

diff --git a/web/src/js/components/Header/MenuToggle.jsx b/web/src/js/components/Header/MenuToggle.jsx
index 8977f3b9..91f093c6 100644
--- a/web/src/js/components/Header/MenuToggle.jsx
+++ b/web/src/js/components/Header/MenuToggle.jsx
@@ -14,7 +14,7 @@ export function MenuToggle({ value, onChange, children }) {
         <div className="menu-entry">
             <label>
                 <input type="checkbox"
-                       value={value}
+                       checked={value}
                        onChange={onChange}/>
                 {children}
             </label>
-- 
cgit v1.2.3