re-organize the code

1 files changed, 79 insertions, 0 deletions

diff --git a/src/RegexField.js b/src/RegexField.js
new file mode 100644
index 0000000..104512e
--- /dev/null
+++ b/src/RegexField.js
@@ -0,0 +1,79 @@
+import React from 'react';
+import Select from '@material-ui/core/Select';
+import MenuItem from '@material-ui/core/MenuItem';
+import TextField from '@material-ui/core/TextField';
+import FormControl from '@material-ui/core/FormControl';
+import { Pattern } from './pattern';
+
+class RegexField extends React.Component {
+    render() {
+        var pitems = this.props.options;
+        var p0 = new Pattern.emptyPattern();
+        let items = [];
+        pitems[p0.id] = p0;
+        for (let id in pitems)
+            items.push(
+                <MenuItem key={id} value={id}>
+                    {!pitems[id].isEmpty ?
+                        pitems[id].label :
+                        <span style={{color: this.props.theme.palette.primary.dark}}>Custom</span>}
+                </MenuItem>);
+        return (
+            <FormControl>
+            <span>
+            <Select
+                value={this.props.value.id}
+                onChange={event => {
+                    let value;
+                    if (pitems[event.target.value].label == null) {
+                        value = new Pattern(0, true,
+                            this.props.value.isRegex ?
+                            this.props.value.value :
+                            `^${this.props.value.value}$`, null);
+                    } else {
+                        value = pitems[event.target.value];
+                    }
+                    this.props.onChange({target: {value}});
+                }}
+                className={this.props.value.isRegex ?
+                        this.props.fieldStyles.regex :
+                        this.props.fieldStyles.noRegex}>{items}</Select>
+            {this.props.value.label == null && (
+                <TextField
+                 value={this.props.value.value}
+                 onChange={event =>
+                    this.props.onChange({target: { value: new Pattern(0, true, event.target.value, null)}})} />
+            )}
+            </span>
+            </FormControl>);
+    }
+}
+
+export function CalendarField(props) {
+    let options = {};
+    for (let id in props.cached.calendars) {
+        options[id] = new Pattern(id, false,
+            props.cached.calendars[id].name,
+            props.cached.calendars[id].name);
+    }
+    return (
+        <RegexField
+            value={props.value}
+            options={options}
+            fieldStyles={props.fieldStyles}
+            onChange={props.onChange}
+            theme={props.theme} />);
+}
+
+export function EventField(props) {
+    let any = Pattern.anyPattern();
+    let options = {};
+    options[any.id] = any;
+    return (
+        <RegexField
+            value={props.value}
+            options={options}
+            fieldStyles={props.fieldStyles}
+            onChange={props.onChange}
+            theme={props.theme}/>);
+}