+ { this.heading &&
{ this.heading }
}
+
+
+ )
- get field() {
+ }
- return this.props.field;
+ get field() {
- }
+ return this.props.field
- get content() {
+ }
- return this.field.content;
+ get content() {
- }
+ return this.field.content
- get heading() {
+ }
- return this.field.heading;
+ get heading() {
- }
+ return this.field.heading
- getContent() {
+ }
- return {
- '__html': this.content
- };
+ getContent() {
- }
+ return {
+ __html: this.content,
+ }
+
+ }
}
-export default MessageField;
+export default MessageField
diff --git a/src/app/components/main/components/group/components/fields/radio/index.jsx b/src/app/components/main/components/group/components/fields/radio/index.jsx
index 7533cc0..4f99400 100644
--- a/src/app/components/main/components/group/components/fields/radio/index.jsx
+++ b/src/app/components/main/components/group/components/fields/radio/index.jsx
@@ -1,76 +1,77 @@
-'use strict';
+'use strict'
-import React from 'react';
-import {newGuid} from "../../../../../../../utils/newGuid";
+import React from 'react'
+import { newGuid } from '../../../../../../../utils/newGuid'
class RadioField extends React.Component {
- state = {};
+ render() {
- render() {
-
- const fieldID = `radio_${newGuid()}`;
-
- const options = this.options.map((option, idx) => {
- const id = `${fieldID}_${idx}`;
- return (
-
- );
- });
+ const fieldID = `radio_${newGuid()}`
- return (
-
-
{ this.label }
- { options }
- { this.help &&
{ this.help } }
-
- );
+ const options = this.options.map((option, idx) => {
- }
+ const id = `${fieldID}_${idx}`
- get field() {
+ return (
+
+ )
- return this.props.field;
+ })
- }
+ return (
+
+
{ this.label }
+ { options }
+ { this.help &&
{ this.help } }
+
+ )
- get value() {
+ }
- return this.props.value || false;
+ get field() {
- }
+ return this.props.field
- get label() {
+ }
- return this.field.label;
+ get value() {
- }
-
- get options() {
+ return this.props.value || false
- return this.field.options || [];
+ }
- }
+ get label() {
- get help() {
+ return this.field.label
- return this.field.help;
+ }
- }
+ get options() {
- onChange(e) {
-
- const idx = e.target.id.split('_')[2];
- const option = this.options[idx];
+ return this.field.options || []
- return this.props.onChange(option.value);
+ }
- }
+ get help() {
+
+ return this.field.help
+
+ }
+
+ onChange(e) {
+
+ const idx = e.target.id.split('_')[2]
+ const option = this.options[idx]
+
+ return this.props.onChange(option.value)
+
+ }
}
-export default RadioField;
+export default RadioField
diff --git a/src/app/components/main/components/group/components/fields/slider/index.jsx b/src/app/components/main/components/group/components/fields/slider/index.jsx
index c40bd7f..7dce0aa 100644
--- a/src/app/components/main/components/group/components/fields/slider/index.jsx
+++ b/src/app/components/main/components/group/components/fields/slider/index.jsx
@@ -1,71 +1,70 @@
-'use strict';
+'use strict'
-import React from 'react';
+import React from 'react'
class SliderField extends React.Component {
- state = {};
+ render() {
- render() {
+ return (
+
+
{ this.label }
+
+
+ { this.help &&
{ this.help } }
+
+ )
- return (
-
-
{ this.label }
-
-
- { this.help &&
{ this.help } }
-
- );
+ }
- }
+ get field() {
- get field() {
+ return this.props.field
- return this.props.field;
+ }
- }
+ get value() {
- get value() {
+ return this.props.value || this.min
- return this.props.value || this.min;
+ }
- }
+ get label() {
- get label() {
+ return this.field.label
- return this.field.label;
+ }
- }
+ get min() {
- get min() {
+ return this.field.min || 0
- return this.field.min || 0;
+ }
- }
+ get max() {
- get max() {
+ return this.field.max || 100
- return this.field.max || 100;
+ }
- }
+ get step() {
- get step() {
+ return this.field.step || 1
- return this.field.step || 1;
+ }
- }
- get help() {
+ get help() {
- return this.field.help;
+ return this.field.help
- }
+ }
- onChange(e) {
+ onChange(e) {
- return this.props.onChange(parseInt(e.target.value));
+ return this.props.onChange(parseInt(e.target.value))
- }
+ }
}
-export default SliderField;
+export default SliderField
diff --git a/src/app/components/main/components/group/components/fields/text/index.jsx b/src/app/components/main/components/group/components/fields/text/index.jsx
index 4fd578c..f7ad657 100644
--- a/src/app/components/main/components/group/components/fields/text/index.jsx
+++ b/src/app/components/main/components/group/components/fields/text/index.jsx
@@ -1,59 +1,57 @@
-'use strict';
+'use strict'
-import React from 'react';
+import React from 'react'
class TextField extends React.Component {
- state = {};
+ render() {
- render() {
+ return (
+
+
{ this.label }
+
+ { this.help &&
{ this.help } }
+
+ )
- return (
-
-
{ this.label }
-
- { this.help &&
{ this.help } }
-
- );
+ }
- }
+ get field() {
- get field() {
+ return this.props.field
- return this.props.field;
+ }
- }
+ get value() {
- get value() {
+ return this.props.value || ''
- return this.props.value || '';
+ }
- }
+ get label() {
- get label() {
+ return this.field.label
- return this.field.label;
+ }
- }
+ get inputType() {
- get inputType() {
+ return this.field.inputType || 'text'
- return this.field.inputType || "text";
+ }
- }
+ get help() {
- get help() {
+ return this.field.help
- return this.field.help;
+ }
- }
+ onChange(e) {
- onChange(e) {
+ return this.props.onChange(e.target.value)
- return this.props.onChange(e.target.value);
-
- }
+ }
}
-export default TextField;
+export default TextField
diff --git a/src/app/components/main/components/group/index.jsx b/src/app/components/main/components/group/index.jsx
index 92048ea..19902d3 100644
--- a/src/app/components/main/components/group/index.jsx
+++ b/src/app/components/main/components/group/index.jsx
@@ -1,90 +1,91 @@
-'use strict';
-
-import React from 'react';
-import DirectoryField from './components/fields/directory';
-import TextField from './components/fields/text';
-import MessageField from './components/fields/message';
-import DropdownField from './components/fields/dropdown';
-import CheckboxField from "./components/fields/checkbox";
-import RadioField from "./components/fields/radio";
-import SliderField from "./components/fields/slider";
-import AcceleratorField from "./components/fields/accelerator";
-import ColorField from "./components/fields/color";
-import ListField from "./components/fields/list";
-import FileField from "./components/fields/file";
+'use strict'
+
+import React from 'react'
+import DirectoryField from './components/fields/directory'
+import TextField from './components/fields/text'
+import MessageField from './components/fields/message'
+import DropdownField from './components/fields/dropdown'
+import CheckboxField from './components/fields/checkbox'
+import RadioField from './components/fields/radio'
+import SliderField from './components/fields/slider'
+import AcceleratorField from './components/fields/accelerator'
+import ColorField from './components/fields/color'
+import ListField from './components/fields/list'
+import FileField from './components/fields/file'
const fieldMap = {
- 'directory': DirectoryField,
- 'text': TextField,
- 'message': MessageField,
- 'dropdown': DropdownField,
- 'checkbox': CheckboxField,
- 'radio': RadioField,
- 'slider': SliderField,
- 'accelerator': AcceleratorField,
- 'color': ColorField,
- 'list': ListField,
- 'file': FileField,
-};
+ directory: DirectoryField,
+ text: TextField,
+ message: MessageField,
+ dropdown: DropdownField,
+ checkbox: CheckboxField,
+ radio: RadioField,
+ slider: SliderField,
+ accelerator: AcceleratorField,
+ color: ColorField,
+ list: ListField,
+ file: FileField,
+}
class Group extends React.Component {
- state = {};
+ render() {
+
+ const label = this.label ?
{ this.label }
: null
+
+ const fields = this.fields.map((field, idx) => {
+
+ const Field = fieldMap[field.type]
+ if (!Field) {
+
+ return
- render() {
+ }
- const label = this.label ?
{ this.label }
: null;
+ return
- const fields = this.fields.map((field, idx) => {
- const Field = fieldMap[field.type];
- if (!Field) {
- return;
- }
- return
- })
- .filter((field) => {
- return field;
- });
+ })
+ .filter(field => field)
- return (
-
- { label }
- { fields }
-
- );
+ return (
+
+ { label }
+ { fields }
+
+ )
- }
+ }
- get label() {
+ get label() {
- return this.group.label;
+ return this.group.label
- }
+ }
- get fields() {
+ get fields() {
- return this.group.fields;
+ return this.group.fields
- }
+ }
- get group() {
+ get group() {
- return this.props.group;
+ return this.props.group
- }
+ }
- get preferences() {
+ get preferences() {
- return this.props.preferences;
+ return this.props.preferences
- }
+ }
- get onFieldChange() {
+ get onFieldChange() {
- return this.props.onFieldChange;
+ return this.props.onFieldChange
- }
+ }
}
-module.exports = Group;
+module.exports = Group
diff --git a/src/app/index.jsx b/src/app/index.jsx
index 8f42034..279ab79 100644
--- a/src/app/index.jsx
+++ b/src/app/index.jsx
@@ -1,73 +1,81 @@
-'use strict';
-
-import React from 'react';
-import ReactDOM from 'react-dom';
-import _ from 'lodash';
-import debounce from './utils/debounce';
-import Sidebar from './components/sidebar';
-import Main from './components/main';
-import '../../scss/style.scss';
-
-const allSections = api.getSections();
-const preferences = api.getPreferences();
-const defaults = api.getDefaults();
-
-const sections = allSections.filter((section) => {
- return _.isBoolean(section.enabled) ? section.enabled : true;
-});
-
-const dSavePreferences = debounce( preferences => {
- api.setPreferences(preferences);
+'use strict'
+
+import React from 'react'
+import ReactDOM from 'react-dom'
+import _ from 'lodash'
+import debounce from './utils/debounce'
+import Sidebar from './components/sidebar'
+import Main from './components/main'
+import '../../scss/style.scss'
+
+const allSections = api.getSections()
+const preferences = api.getPreferences()
+
+const sections = allSections.filter(section => _.isBoolean(section.enabled) ? section.enabled : true)
+
+const dSavePreferences = debounce(preferences => {
+
+ api.setPreferences(preferences)
+
}, 200)
-sections.forEach((section) => {
- if (!preferences[section.id]) {
- preferences[section.id] = {};
- }
-});
+sections.forEach(section => {
+
+ if (!preferences[section.id]) {
+
+ preferences[section.id] = {}
+
+ }
+
+})
class App extends React.Component {
- state = {
- 'sections': sections,
- 'activeSection': sections[0].id,
- 'preferences': preferences
- };
+ constructor(props) {
+
+ super(props)
+ this.state = {
+ sections,
+ activeSection: sections[0].id,
+ preferences,
+ }
+
+ }
- render() {
+ render() {
- return (
-
-
-
-
- );
+ return (
+
+
+
+
+ )
- }
+ }
- onSelectSection(sectionId) {
+ onSelectSection(sectionId) {
- this.setState({
- 'activeSection': sectionId
- });
+ this.setState({
+ activeSection: sectionId,
+ })
- }
+ }
- onFieldChange(key, value) {
+ onFieldChange(key, value) {
- preferences[this.state.activeSection][key] = value;
+ preferences[this.state.activeSection][key] = value
- this.setState({
- 'preferences': preferences
- });
+ this.setState({
+ preferences,
+ })
- dSavePreferences(preferences)
+ dSavePreferences(preferences)
- }
+ }
}
ReactDOM.render(
-
,
- document.getElementById('window')
-);
+
,
+ document.getElementById('window'),
+)
diff --git a/webpack.config.js b/webpack.config.js
index 96df6a7..1ce56f3 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -1,6 +1,5 @@
'use strict'
-const webpack = require('webpack')
const path = require('path')
const CopyWebpackPlugin = require('copy-webpack-plugin')