1 files changed, 64 insertions, 15 deletions

diff --git a/src/settings/components/index.jsx b/src/settings/components/index.jsx
index 3961982..d7696a1 100644
--- a/src/settings/components/index.jsx
+++ b/src/settings/components/index.jsx
@@ -4,8 +4,10 @@ import Input from './ui/input';
 import SearchForm from './form/search-form';
 import KeymapsForm from './form/keymaps-form';
 import BlacklistForm from './form/blacklist-form';
+import PropertiesForm from './form/properties-form';
+import * as properties from 'shared/settings/properties';
 import * as settingActions from 'settings/actions/setting';
-import * as validator from 'shared/validators/setting';
+import * as validator from 'shared/settings/validator';
 import * as settingsValues from 'shared/settings/values';
 
 const DO_YOU_WANT_TO_CONTINUE =
@@ -65,6 +67,14 @@ class SettingsComponent extends Component {
           onChange={value => this.bindForm('blacklist', value)}
         />
       </fieldset>
+      <fieldset>
+        <legend>Properties</legend>
+        <PropertiesForm
+          types={properties.types}
+          value={this.state.settings.form.properties}
+          onChange={value => this.bindForm('properties', value)}
+        />
+      </fieldset>
     </div>;
   }
 
@@ -123,6 +133,18 @@ class SettingsComponent extends Component {
     }
   }
 
+  validateValue(e) {
+    let next = Object.assign({}, this.state);
+
+    next.errors.json = '';
+    try {
+      this.validate(e.target);
+    } catch (err) {
+      next.errors.json = err.message;
+    }
+    next.settings[e.target.name] = e.target.value;
+  }
+
   bindForm(name, value) {
     let next = Object.assign({}, this.state, {
       settings: Object.assign({}, this.state.settings, {
@@ -136,15 +158,54 @@ class SettingsComponent extends Component {
 
   bindValue(e) {
     let next = Object.assign({}, this.state);
+    let error = false;
 
     next.errors.json = '';
     try {
       this.validate(e.target);
     } catch (err) {
       next.errors.json = err.message;
+      error = true;
     }
     next.settings[e.target.name] = e.target.value;
 
+    this.setState(this.state);
+    if (!error) {
+      this.context.store.dispatch(settingActions.save(next.settings));
+    }
+  }
+
+  migrateToForm() {
+    let b = window.confirm(DO_YOU_WANT_TO_CONTINUE);
+    if (!b) {
+      this.setState(this.state);
+      return;
+    }
+    try {
+      validator.validate(JSON.parse(this.state.settings.json));
+    } catch (err) {
+      this.setState(this.state);
+      return;
+    }
+
+    let form = settingsValues.formFromJson(
+      this.state.settings.json, KeymapsForm.AllowdOps);
+    let next = Object.assign({}, this.state);
+    next.settings.form = form;
+    next.settings.source = 'form';
+    next.errors.json = '';
+
+    this.setState(next);
+    this.context.store.dispatch(settingActions.save(next.settings));
+  }
+
+  migrateToJson() {
+    let json = settingsValues.jsonFromForm(this.state.settings.form);
+    let next = Object.assign({}, this.state);
+    next.settings.json = json;
+    next.settings.source = 'json';
+    next.errors.json = '';
+
     this.setState(next);
     this.context.store.dispatch(settingActions.save(next.settings));
   }
@@ -153,23 +214,11 @@ class SettingsComponent extends Component {
     let from = this.state.settings.source;
     let to = e.target.value;
 
-    let next = Object.assign({}, this.state);
     if (from === 'form' && to === 'json') {
-      next.settings.json =
-        settingsValues.jsonFromForm(this.state.settings.form);
+      this.migrateToJson();
     } else if (from === 'json' && to === 'form') {
-      let b = window.confirm(DO_YOU_WANT_TO_CONTINUE);
-      if (!b) {
-        this.setState(this.state);
-        return;
-      }
-      next.settings.form =
-        settingsValues.formFromJson(this.state.settings.json);
+      this.migrateToForm();
     }
-    next.settings.source = to;
-
-    this.setState(next);
-    this.context.store.dispatch(settingActions.save(next.settings));
   }
 }