From ec82384b20945faba521fe022361b80a681a32e3 Mon Sep 17 00:00:00 2001 From: Pieter-Jan Van Robays Date: Sat, 10 Jul 2021 20:27:39 +0200 Subject: [PATCH] always add semicolons. My OCD can't handle it --- .eslintrc | 2 +- example/main.js | 44 ++--- example/preferences.js | 12 +- example/preload.js | 22 +-- example/renderer.js | 18 +- index.js | 178 +++++++++--------- misc/build-icon-list.js | 18 +- preload.js | 10 +- .../components/fields/accelerator/index.jsx | 72 +++---- .../components/fields/checkbox/index.jsx | 40 ++-- .../components/fields/dropdown/index.jsx | 22 +-- .../group/components/fields/message/index.jsx | 18 +- .../group/components/fields/radio/index.jsx | 34 ++-- .../group/components/fields/slider/index.jsx | 24 +-- .../group/components/fields/text/index.jsx | 20 +- .../main/components/group/index.jsx | 54 +++--- src/app/components/main/index.jsx | 30 +-- src/app/components/sidebar/index.jsx | 32 ++-- src/app/index.jsx | 46 ++--- src/app/utils/debounce.js | 14 +- src/app/utils/isArray.js | 2 +- src/app/utils/keycodeToChar.js | 2 +- src/app/utils/newGuid.js | 4 +- webpack.config.js | 8 +- 24 files changed, 363 insertions(+), 363 deletions(-) diff --git a/.eslintrc b/.eslintrc index f3ea375..70a80e6 100644 --- a/.eslintrc +++ b/.eslintrc @@ -35,7 +35,7 @@ ], "semi": [ 2, - "never" + "always" ], "space-in-parens": [ "error", diff --git a/example/main.js b/example/main.js index 910a944..d112549 100644 --- a/example/main.js +++ b/example/main.js @@ -1,24 +1,24 @@ -'use strict' +'use strict'; -const electron = require('electron') -const { app } = electron -const { nativeTheme } = electron -const { BrowserWindow } = electron -const path = require('path') -const url = require('url') -const preferences = require('./preferences') +const electron = require('electron'); +const { app } = electron; +const { nativeTheme } = electron; +const { BrowserWindow } = electron; +const path = require('path'); +const url = require('url'); +const preferences = require('./preferences'); -nativeTheme.themeSource = preferences.preferences?.theme?.theme ?? 'system' +nativeTheme.themeSource = preferences.preferences?.theme?.theme ?? 'system'; preferences.on('save', preferences => { - console.log('Preferences were saved.', JSON.stringify(preferences, null, 4)) + console.log('Preferences were saved.', JSON.stringify(preferences, null, 4)); - nativeTheme.themeSource = preferences?.theme?.theme ?? 'system' + nativeTheme.themeSource = preferences?.theme?.theme ?? 'system'; -}) +}); -let mainWindow +let mainWindow; function createWindow() { @@ -30,42 +30,42 @@ function createWindow() { preload: path.join(__dirname, './Preload.js'), contextIsolation: true, }, - }) + }); mainWindow.loadURL(url.format({ pathname: path.join(__dirname, 'index.html'), protocol: 'file:', slashes: true, - })) + })); // MainWindow.webContents.openDevTools(); mainWindow.on('closed', () => { - mainWindow = null + mainWindow = null; - }) + }); } -app.on('ready', createWindow) +app.on('ready', createWindow); app.on('window-all-closed', () => { if (process.platform !== 'darwin') { - app.quit() + app.quit(); } -}) +}); app.on('activate', () => { if (mainWindow === null) { - createWindow() + createWindow(); } -}) +}); diff --git a/example/preferences.js b/example/preferences.js index 68d8bf5..1bde05c 100644 --- a/example/preferences.js +++ b/example/preferences.js @@ -1,10 +1,10 @@ -'use strict' +'use strict'; // Const electron = require('electron'); // const app = electron.app; -const path = require('path') -const os = require('os') -const ElectronPreferences = require('../') +const path = require('path'); +const os = require('os'); +const ElectronPreferences = require('../'); const preferences = new ElectronPreferences({ css: 'custom-style.css', @@ -256,6 +256,6 @@ const preferences = new ElectronPreferences({ }, }, ], -}) +}); -module.exports = preferences +module.exports = preferences; diff --git a/example/preload.js b/example/preload.js index e1fa361..6272a05 100644 --- a/example/preload.js +++ b/example/preload.js @@ -1,29 +1,29 @@ -'use strict' +'use strict'; -const electron = require('electron') -const { contextBridge } = electron -const { ipcRenderer } = electron +const electron = require('electron'); +const { contextBridge } = electron; +const { ipcRenderer } = electron; -let onPreferencesChangedHandler = () => {} +let onPreferencesChangedHandler = () => {}; contextBridge.exposeInMainWorld('api', { showPreferences: () => { - ipcRenderer.send('showPreferences') + ipcRenderer.send('showPreferences'); }, getPreferences: () => ipcRenderer.sendSync('getPreferences'), onPreferencesChanged: handler => { - onPreferencesChangedHandler = handler + onPreferencesChangedHandler = handler; }, -}) +}); ipcRenderer.on('preferencesUpdated', (e, preferences) => { - onPreferencesChangedHandler(preferences) + onPreferencesChangedHandler(preferences); -}) +}); -console.log('Preloaded') +console.log('Preloaded'); diff --git a/example/renderer.js b/example/renderer.js index 746ce40..c3bc36d 100644 --- a/example/renderer.js +++ b/example/renderer.js @@ -1,18 +1,18 @@ -'use strict' +'use strict'; -const bt = document.getElementsByClassName('bt')[0] -const prefsEl = document.getElementsByClassName('preferences')[0] -prefsEl.innerHTML = JSON.stringify(api.getPreferences(), null, 4) +const bt = document.getElementsByClassName('bt')[0]; +const prefsEl = document.getElementsByClassName('preferences')[0]; +prefsEl.innerHTML = JSON.stringify(api.getPreferences(), null, 4); bt.addEventListener('click', () => { - api.showPreferences() + api.showPreferences(); -}) +}); api.onPreferencesChanged(preferences => { - console.log('Preferences were updated', preferences) - prefsEl.innerHTML = JSON.stringify(preferences, null, 4) + console.log('Preferences were updated', preferences); + prefsEl.innerHTML = JSON.stringify(preferences, null, 4); -}) +}); diff --git a/index.js b/index.js index 4fbbf85..dcd78b2 100644 --- a/index.js +++ b/index.js @@ -1,27 +1,27 @@ -'use strict' - -const electron = require('electron') -const { app, BrowserWindow, ipcMain, webContents, dialog } = electron -const path = require('path') -const url = require('url') -const fs = require('fs') -const _ = require('lodash') -const { EventEmitter2 } = require('eventemitter2') -const loadJsonFile = require('load-json-file') -const writeJsonFile = require('write-json-file') +'use strict'; + +const electron = require('electron'); +const { app, BrowserWindow, ipcMain, webContents, dialog } = electron; +const path = require('path'); +const url = require('url'); +const fs = require('fs'); +const _ = require('lodash'); +const { EventEmitter2 } = require('eventemitter2'); +const loadJsonFile = require('load-json-file'); +const writeJsonFile = require('write-json-file'); class ElectronPreferences extends EventEmitter2 { constructor(options = {}) { - super() + super(); _.defaultsDeep(options, { sections: [], webPreferences: { devTools: false, }, - }) + }); options.sections.forEach((section, sectionIdx) => { @@ -29,22 +29,22 @@ class ElectronPreferences extends EventEmitter2 { form: { groups: [], }, - }) + }); section.form.groups = section.form.groups.map((group, groupIdx) => { - group.id = 'group' + sectionIdx + groupIdx + group.id = 'group' + sectionIdx + groupIdx; - return group + return group; - }) + }); - }) + }); - this.options = options + this.options = options; if (!this.dataStore) { - throw new Error('The \'dataStore\' option is required.') + throw new Error('The \'dataStore\' option is required.'); } @@ -53,95 +53,95 @@ class ElectronPreferences extends EventEmitter2 { if (fs.existsSync(this.dataStore)) { - this.preferences = loadJsonFile.sync(this.dataStore) + this.preferences = loadJsonFile.sync(this.dataStore); } } catch (err) { - console.error(err) - this.preferences = null + console.error(err); + this.preferences = null; } if (!this.preferences) { - this.preferences = this.defaults + this.preferences = this.defaults; } else { - // Set default preference values + // Set default preference values _.keys(this.defaults).forEach(prefDefault => { if (!(prefDefault in this.preferences)) { - this.preferences[prefDefault] = this.defaults[prefDefault] + this.preferences[prefDefault] = this.defaults[prefDefault]; } - }) + }); } if (_.isFunction(options.onLoad)) { - this.preferences = options.onLoad(this.preferences) + this.preferences = options.onLoad(this.preferences); } - this.save() + this.save(); ipcMain.on('showPreferences', event => { - this.show() + this.show(); - }) + }); ipcMain.on('getSections', event => { - event.returnValue = this.options.sections + event.returnValue = this.options.sections; - }) + }); ipcMain.on('restoreDefaults', event => { - this.preferences = this.defaults - this.save() - this.broadcast() + this.preferences = this.defaults; + this.save(); + this.broadcast(); - }) + }); ipcMain.on('getDefaults', event => { - event.returnValue = this.defaults + event.returnValue = this.defaults; - }) + }); ipcMain.on('getPreferences', event => { - event.returnValue = this.preferences + event.returnValue = this.preferences; - }) + }); ipcMain.on('setPreferences', (event, value) => { - this.preferences = value - this.save() - this.broadcast() - this.emit('save', Object.freeze(_.cloneDeep(this.preferences))) - event.returnValue = null + this.preferences = value; + this.save(); + this.broadcast(); + this.emit('save', Object.freeze(_.cloneDeep(this.preferences))); + event.returnValue = null; - }) + }); ipcMain.on('showOpenDialog', (event, dialogOptions) => { - event.returnValue = dialog.showOpenDialogSync(dialogOptions) + event.returnValue = dialog.showOpenDialogSync(dialogOptions); - }) + }); if (_.isFunction(options.afterLoad)) { - options.afterLoad(this) + options.afterLoad(this); } @@ -149,25 +149,25 @@ class ElectronPreferences extends EventEmitter2 { get dataStore() { - return this.options.dataStore + return this.options.dataStore; } get defaults() { - return this.options.defaults || {} + return this.options.defaults || {}; } get preferences() { - return this._preferences + return this._preferences; } set preferences(value) { - this._preferences = value + this._preferences = value; } @@ -175,7 +175,7 @@ class ElectronPreferences extends EventEmitter2 { writeJsonFile(this.dataStore, this.preferences, { indent: 4, - }) + }); } @@ -186,27 +186,27 @@ class ElectronPreferences extends EventEmitter2 { key.forEach(({ key, value }) => { - _.set(this.preferences, key, value) + _.set(this.preferences, key, value); - }) - this.save() - this.broadcast() + }); + this.save(); + this.broadcast(); } else if (!_.isUndefined(key) && !_.isUndefined(value)) { - _.set(this.preferences, key, value) - this.save() - this.broadcast() + _.set(this.preferences, key, value); + this.save(); + this.broadcast(); } else if (_.isUndefined(value)) { - // Value is undefined - return _.cloneDeep(_.get(this.preferences, key)) + // Value is undefined + return _.cloneDeep(_.get(this.preferences, key)); } else { - // Key is undefined - return _.cloneDeep(this.preferences) + // Key is undefined + return _.cloneDeep(this.preferences); } @@ -217,9 +217,9 @@ class ElectronPreferences extends EventEmitter2 { webContents.getAllWebContents() .forEach(wc => { - wc.send('preferencesUpdated', this.preferences) + wc.send('preferencesUpdated', this.preferences); - }) + }); } @@ -227,7 +227,7 @@ class ElectronPreferences extends EventEmitter2 { if (this.prefsWindow) { - return + return; } @@ -243,42 +243,42 @@ class ElectronPreferences extends EventEmitter2 { backgroundColor: '#E7E7E7', show: false, webPreferences: this.options.webPreferences, - } + }; const defaultWebPreferences = { nodeIntegration: false, enableRemoteModule: false, contextIsolation: true, preload: path.join(__dirname, './preload.js'), - } + }; // User provider `browserWindow`, we load those if (this.options.browserWindowOverrides) { - browserWindowOpts = Object.assign(browserWindowOpts, this.options.browserWindowOverrides) + browserWindowOpts = Object.assign(browserWindowOpts, this.options.browserWindowOverrides); } // if (browserWindowOpts.webPreferences) { - browserWindowOpts.webPreferences = Object.assign(defaultWebPreferences, browserWindowOpts.webPreferences) + browserWindowOpts.webPreferences = Object.assign(defaultWebPreferences, browserWindowOpts.webPreferences); } else { - browserWindowOpts.webPreferences = defaultWebPreferences + browserWindowOpts.webPreferences = defaultWebPreferences; } - this.prefsWindow = new BrowserWindow(browserWindowOpts) + this.prefsWindow = new BrowserWindow(browserWindowOpts); if (this.options.menuBar) { - this.prefsWindow.setMenu(this.options.menuBar) + this.prefsWindow.setMenu(this.options.menuBar); } else { - this.prefsWindow.removeMenu() + this.prefsWindow.removeMenu(); } @@ -286,49 +286,49 @@ class ElectronPreferences extends EventEmitter2 { pathname: path.join(__dirname, 'build/index.html'), protocol: 'file:', slashes: true, - })) + })); this.prefsWindow.once('ready-to-show', async () => { // Load custom css file if (this.options.css) { - const file = path.join(app.getAppPath(), this.options.css) - try { + const file = path.join(app.getAppPath(), this.options.css); + try { if (await fs.promises.stat(file)) { - await this.prefsWindow.webContents.executeJavaScript(` \ + await this.prefsWindow.webContents.executeJavaScript(` \ var f = document.createElement("link"); \ f.rel = "stylesheet"; \ f.type = "text/css"; \ f.href = "${file}"; \ document.getElementsByTagName("head")[0].appendChild(f) \ - `) + `); } } catch (err) { - console.error(`Could not load css file ${file}: ${err}`) + console.error(`Could not load css file ${file}: ${err}`); } } - // Show: false by default, then show when ready to prevent page "flicker" - this.prefsWindow.show() + // Show: false by default, then show when ready to prevent page "flicker" + this.prefsWindow.show(); - }) + }); this.prefsWindow.on('closed', () => { - this.prefsWindow = null + this.prefsWindow = null; - }) + }); } } -module.exports = ElectronPreferences +module.exports = ElectronPreferences; diff --git a/misc/build-icon-list.js b/misc/build-icon-list.js index 3dd692b..45c6a09 100644 --- a/misc/build-icon-list.js +++ b/misc/build-icon-list.js @@ -1,9 +1,9 @@ -'use strict' +'use strict'; -const Handlebars = require('handlebars') -const glob = require('glob') -const path = require('path') -const srcFolder = path.resolve(__dirname, '../assets/svg') +const Handlebars = require('handlebars'); +const glob = require('glob'); +const path = require('path'); +const srcFolder = path.resolve(__dirname, '../assets/svg'); const tpl = Handlebars.compile(` @@ -22,7 +22,7 @@ const tpl = Handlebars.compile(` {{/each}}
-`) +`); const icons = glob.sync('*.svg', { cwd: srcFolder, @@ -30,10 +30,10 @@ const icons = glob.sync('*.svg', { .map(icon => ({ path: `assets/svg/${icon}`, name: path.basename(icon, '.svg'), - })) + })); const rendered = tpl({ icons, -}) +}); -console.log(rendered) +console.log(rendered); diff --git a/preload.js b/preload.js index 5d893ba..49c4a44 100644 --- a/preload.js +++ b/preload.js @@ -1,8 +1,8 @@ -'use strict' +'use strict'; -const electron = require('electron') -const { contextBridge } = electron -const { ipcRenderer } = electron +const electron = require('electron'); +const { contextBridge } = electron; +const { ipcRenderer } = electron; contextBridge.exposeInMainWorld('api', { getSections: () => ipcRenderer.sendSync('getSections'), @@ -10,4 +10,4 @@ contextBridge.exposeInMainWorld('api', { getDefaults: () => ipcRenderer.sendSync('getDefaults'), setPreferences: preferences => ipcRenderer.send('setPreferences', preferences), showOpenDialog: dialogOptions => ipcRenderer.sendSync('showOpenDialog', dialogOptions), -}) +}); diff --git a/src/app/components/main/components/group/components/fields/accelerator/index.jsx b/src/app/components/main/components/group/components/fields/accelerator/index.jsx index fa2f415..3955c90 100644 --- a/src/app/components/main/components/group/components/fields/accelerator/index.jsx +++ b/src/app/components/main/components/group/components/fields/accelerator/index.jsx @@ -1,7 +1,7 @@ -'use strict' +'use strict'; -import React from 'react' -import keycodeToChar from '../../../../../../../utils/keycodeToChar.js' +import React from 'react'; +import keycodeToChar from '../../../../../../../utils/keycodeToChar.js'; const AcceleratorField = ({ field, value, onChange, ...props }) => { @@ -13,64 +13,64 @@ const AcceleratorField = ({ field, value, onChange, ...props }) => { modifierRequired: By default any key can be used, if this is true, a modifier must be provided. */ - // Display the keys being pushed while trying to set accelerator - const [ pressing, setPressing ] = React.useState(false) - const [ accelerator, setAccelerator ] = React.useState('') + // Display the keys being pushed while trying to set accelerator + const [ pressing, setPressing ] = React.useState(false); + const [ accelerator, setAccelerator ] = React.useState(''); - /* - Using this info: https://keycode.info/ we exclude some keys that we need for modifiers - like control, shift, etc. as well as a handful of oddball codes. - We only save if we receive one of these non-modifier keys. - */ - const excludeKeyCodes = [ 0, 1, 2, 3, 4, 5, 6, 7, 10, 11, 16, 17, 18, 21, 22, 23, 24, 25, 26, 28, 29, 30, 31, 91, 92, 93, 94, 95 ] + /* + Using this info: https://keycode.info/ we exclude some keys that we need for modifiers + like control, shift, etc. as well as a handful of oddball codes. + We only save if we receive one of these non-modifier keys. + */ + const excludeKeyCodes = [ 0, 1, 2, 3, 4, 5, 6, 7, 10, 11, 16, 17, 18, 21, 22, 23, 24, 25, 26, 28, 29, 30, 31, 91, 92, 93, 94, 95 ]; const handleKeyDown = event => { - event.preventDefault() + event.preventDefault(); - const keys = [] - event.ctrlKey && keys.push('Control') - event.metaKey && keys.push('Command') // Probably should be called meta - event.altKey && keys.push('Alt') - event.shiftKey && keys.push('Shift') + const keys = []; + event.ctrlKey && keys.push('Control'); + event.metaKey && keys.push('Command'); // Probably should be called meta + event.altKey && keys.push('Alt'); + event.shiftKey && keys.push('Shift'); // I've not tested every combo to verify it will work in electron, all the documentation they provide: - // https://www.electronjs.org/docs/api/accelerator#available-key-codes + // https://www.electronjs.org/docs/api/accelerator#available-key-codes if (!excludeKeyCodes.includes(event.which) && keycodeToChar.hasOwnProperty(event.which)) { - // We allow single-keys to be set, unless `modifierRequired` is passed - if (field.modifierRequired && keys.length < 1) { + // We allow single-keys to be set, unless `modifierRequired` is passed + if (field.modifierRequired && keys.length < 1) { - return + return; } - // Save values - keys.push(keycodeToChar[event.which]) - onChange(keys.join('+')) + // Save values + keys.push(keycodeToChar[event.which]); + onChange(keys.join('+')); } // Display current keys pressed - setPressing(true) - setAccelerator(keys.join('+')) + setPressing(true); + setAccelerator(keys.join('+')); - } + }; const handleKeyUp = event => { - setPressing(false) + setPressing(false); - } + }; return (
-
{ field.label }
- - { field.help && { field.help } } +
{field.label}
+ + {field.help && {field.help}}
- ) + ); -} +}; -export default AcceleratorField +export default AcceleratorField; diff --git a/src/app/components/main/components/group/components/fields/checkbox/index.jsx b/src/app/components/main/components/group/components/fields/checkbox/index.jsx index b2a0fb1..ef25233 100644 --- a/src/app/components/main/components/group/components/fields/checkbox/index.jsx +++ b/src/app/components/main/components/group/components/fields/checkbox/index.jsx @@ -1,17 +1,17 @@ -'use strict' +'use strict'; -import React from 'react' -import { newGuid } from '../../../../../../../utils/newGuid' +import React from 'react'; +import { newGuid } from '../../../../../../../utils/newGuid'; class CheckboxField extends React.Component { render() { - const fieldID = `checkbox_${newGuid()}` + const fieldID = `checkbox_${newGuid()}`; const options = this.options.map((option, idx) => { - const id = `${fieldID}_${idx}` + const id = `${fieldID}_${idx}`; return ( - ) + ); - }) + }); return (
@@ -29,68 +29,68 @@ class CheckboxField extends React.Component { { options } { this.help && { this.help } }
- ) + ); } get field() { - return this.props.field + return this.props.field; } get value() { - return this.props.value || [] + return this.props.value || []; } get label() { - return this.field.label + return this.field.label; } get options() { - return this.field.options || [] + return this.field.options || []; } get help() { - return this.field.help + return this.field.help; } onChange(e) { - const idx = e.target.id.split('_')[2] - const option = this.options[idx] + const idx = e.target.id.split('_')[2]; + const option = this.options[idx]; if (e.target.checked) { if (this.value.indexOf(option.value) === -1) { - this.value.push(option.value) + this.value.push(option.value); } } else { - const valIdx = this.value.indexOf(option.value) + const valIdx = this.value.indexOf(option.value); if (valIdx > -1) { - this.value.splice(valIdx, 1) + this.value.splice(valIdx, 1); } } - return this.props.onChange(this.value) + return this.props.onChange(this.value); } } -export default CheckboxField +export default CheckboxField; diff --git a/src/app/components/main/components/group/components/fields/dropdown/index.jsx b/src/app/components/main/components/group/components/fields/dropdown/index.jsx index cbc1b47..f003f00 100644 --- a/src/app/components/main/components/group/components/fields/dropdown/index.jsx +++ b/src/app/components/main/components/group/components/fields/dropdown/index.jsx @@ -1,6 +1,6 @@ -'use strict' +'use strict'; -import React from 'react' +import React from 'react'; class DropdownField extends React.Component { @@ -8,7 +8,7 @@ class DropdownField extends React.Component { const options = this.options.map((option, idx) => ( - )) + )); return (
@@ -19,46 +19,46 @@ class DropdownField extends React.Component { { this.help && { this.help } }
- ) + ); } get field() { - return this.props.field + return this.props.field; } get value() { - return this.props.value || '' + return this.props.value || ''; } get label() { - return this.field.label + return this.field.label; } get options() { - return this.field.options || [] + return this.field.options || []; } get help() { - return this.field.help + return this.field.help; } onChange(e) { - return this.props.onChange(e.target.value) + return this.props.onChange(e.target.value); } } -export default DropdownField +export default DropdownField; diff --git a/src/app/components/main/components/group/components/fields/message/index.jsx b/src/app/components/main/components/group/components/fields/message/index.jsx index 50a7c21..b2bb128 100644 --- a/src/app/components/main/components/group/components/fields/message/index.jsx +++ b/src/app/components/main/components/group/components/fields/message/index.jsx @@ -1,6 +1,6 @@ -'use strict' +'use strict'; -import React from 'react' +import React from 'react'; class MessageField extends React.Component { @@ -8,7 +8,7 @@ class MessageField extends React.Component { if (!this.heading && !this.content) { - return null + return null; } @@ -17,25 +17,25 @@ class MessageField extends React.Component { { this.heading &&
{ this.heading }
}
- ) + ); } get field() { - return this.props.field + return this.props.field; } get content() { - return this.field.content + return this.field.content; } get heading() { - return this.field.heading + return this.field.heading; } @@ -43,10 +43,10 @@ class MessageField extends React.Component { 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 4f99400..1eb6b3c 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,17 +1,17 @@ -'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 { render() { - const fieldID = `radio_${newGuid()}` + const fieldID = `radio_${newGuid()}`; const options = this.options.map((option, idx) => { - const id = `${fieldID}_${idx}` + const id = `${fieldID}_${idx}`; return ( - ) + ); - }) + }); return (
@@ -29,49 +29,49 @@ class RadioField extends React.Component { { options } { this.help && { this.help } }
- ) + ); } get field() { - return this.props.field + return this.props.field; } get value() { - return this.props.value || false + return this.props.value || false; } get label() { - return this.field.label + return this.field.label; } get options() { - return this.field.options || [] + return this.field.options || []; } get help() { - return this.field.help + return this.field.help; } onChange(e) { - const idx = e.target.id.split('_')[2] - const option = this.options[idx] + const idx = e.target.id.split('_')[2]; + const option = this.options[idx]; - return this.props.onChange(option.value) + 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 7dce0aa..18373bc 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,6 +1,6 @@ -'use strict' +'use strict'; -import React from 'react' +import React from 'react'; class SliderField extends React.Component { @@ -13,58 +13,58 @@ class SliderField extends React.Component { { this.help && { this.help } } - ) + ); } get field() { - return this.props.field + return this.props.field; } get value() { - return this.props.value || this.min + return this.props.value || this.min; } get label() { - return this.field.label + return this.field.label; } get min() { - return this.field.min || 0 + return this.field.min || 0; } get max() { - return this.field.max || 100 + return this.field.max || 100; } get step() { - return this.field.step || 1 + return this.field.step || 1; } get help() { - return this.field.help + return this.field.help; } 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 f7ad657..6dcfe1a 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,6 +1,6 @@ -'use strict' +'use strict'; -import React from 'react' +import React from 'react'; class TextField extends React.Component { @@ -12,46 +12,46 @@ class TextField extends React.Component { { this.help && { this.help } } - ) + ); } get field() { - return this.props.field + return this.props.field; } get value() { - return this.props.value || '' + return this.props.value || ''; } get label() { - return this.field.label + return this.field.label; } get inputType() { - return this.field.inputType || 'text' + return this.field.inputType || 'text'; } get help() { - return this.field.help + return this.field.help; } 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 19902d3..ad933b2 100644 --- a/src/app/components/main/components/group/index.jsx +++ b/src/app/components/main/components/group/index.jsx @@ -1,17 +1,17 @@ -'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, @@ -25,67 +25,67 @@ const fieldMap = { color: ColorField, list: ListField, file: FileField, -} +}; class Group extends React.Component { render() { - const label = this.label ?
{ this.label }
: null + const label = this.label ?
{ this.label }
: null; const fields = this.fields.map((field, idx) => { - const Field = fieldMap[field.type] + const Field = fieldMap[field.type]; if (!Field) { - return + return; } - return + return ; }) - .filter(field => field) + .filter(field => field); return (
{ label } { fields }
- ) + ); } get label() { - return this.group.label + return this.group.label; } get fields() { - return this.group.fields + return this.group.fields; } get group() { - return this.props.group + return this.props.group; } get preferences() { - return this.props.preferences + return this.props.preferences; } get onFieldChange() { - return this.props.onFieldChange + return this.props.onFieldChange; } } -module.exports = Group +module.exports = Group; diff --git a/src/app/components/main/index.jsx b/src/app/components/main/index.jsx index 2c26a89..ff58efb 100644 --- a/src/app/components/main/index.jsx +++ b/src/app/components/main/index.jsx @@ -1,9 +1,9 @@ -'use strict' +'use strict'; -import React from 'react' -import PropTypes from 'prop-types' -import Group from './components/group' -import _ from 'lodash' +import React from 'react'; +import PropTypes from 'prop-types'; +import Group from './components/group'; +import _ from 'lodash'; class Main extends React.Component { @@ -11,37 +11,37 @@ class Main extends React.Component { const groups = this.form.groups.map((group, idx) => ( - )) + )); return (
{ groups }
- ) + ); } get sections() { - return this.props.sections + return this.props.sections; } get form() { - return this.section.form + return this.section.form; } get preferences() { - return this.props.preferences + return this.props.preferences; } get activeSection() { - return this.props.activeSection + return this.props.activeSection; } @@ -49,13 +49,13 @@ class Main extends React.Component { return _.find(this.sections, { id: this.activeSection, - }) + }); } get onFieldChange() { - return this.props.onFieldChange + return this.props.onFieldChange; } @@ -66,6 +66,6 @@ Main.propTypes = { preferences: PropTypes.string, activeSection: PropTypes.string, onFieldChange: PropTypes.func, -} +}; -module.exports = Main +module.exports = Main; diff --git a/src/app/components/sidebar/index.jsx b/src/app/components/sidebar/index.jsx index 8ebc7d0..01a2c71 100644 --- a/src/app/components/sidebar/index.jsx +++ b/src/app/components/sidebar/index.jsx @@ -1,7 +1,7 @@ -'use strict' +'use strict'; -import React from 'react' -import PropTypes from 'prop-types' +import React from 'react'; +import PropTypes from 'prop-types'; class Sidebar extends React.Component { @@ -9,50 +9,50 @@ class Sidebar extends React.Component { const sections = this.sections.map(section => { - let className = 'sidebar-section' + let className = 'sidebar-section'; if (this.activeSection === section.id) { - className += ' active' + className += ' active'; } const style = { mask: `url("svg/${section.icon}.svg") no-repeat center / contain`, webkitMask: `url("svg/${section.icon}.svg") no-repeat center / contain`, - } + }; return (
{ section.label }
- ) + ); - }) + }); return (
{ sections }
- ) + ); } get sections() { - return this.props.sections + return this.props.sections; } get activeSection() { - return this.props.activeSection + return this.props.activeSection; } get onSelectSection() { - return this.props.onSelectSection + return this.props.onSelectSection; } @@ -60,9 +60,9 @@ class Sidebar extends React.Component { this.setState({ activeSection: sectionId, - }) + }); - this.onSelectSection(sectionId) + this.onSelectSection(sectionId); } @@ -72,6 +72,6 @@ Sidebar.propTypes = { sections: PropTypes.string, activeSection: PropTypes.string, onSelectSection: PropTypes.funct, -} +}; -module.exports = Sidebar +module.exports = Sidebar; diff --git a/src/app/index.jsx b/src/app/index.jsx index 279ab79..517b8cb 100644 --- a/src/app/index.jsx +++ b/src/app/index.jsx @@ -1,44 +1,44 @@ -'use strict' +'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' +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 allSections = api.getSections(); +const preferences = api.getPreferences(); -const sections = allSections.filter(section => _.isBoolean(section.enabled) ? section.enabled : true) +const sections = allSections.filter(section => _.isBoolean(section.enabled) ? section.enabled : true); const dSavePreferences = debounce(preferences => { - api.setPreferences(preferences) + api.setPreferences(preferences); -}, 200) +}, 200); sections.forEach(section => { if (!preferences[section.id]) { - preferences[section.id] = {} + preferences[section.id] = {}; } -}) +}); class App extends React.Component { constructor(props) { - super(props) + super(props); this.state = { sections, activeSection: sections[0].id, preferences, - } + }; } @@ -49,7 +49,7 @@ class App extends React.Component {
- ) + ); } @@ -57,19 +57,19 @@ class App extends React.Component { this.setState({ activeSection: sectionId, - }) + }); } onFieldChange(key, value) { - preferences[this.state.activeSection][key] = value + preferences[this.state.activeSection][key] = value; this.setState({ preferences, - }) + }); - dSavePreferences(preferences) + dSavePreferences(preferences); } @@ -78,4 +78,4 @@ class App extends React.Component { ReactDOM.render( , document.getElementById('window'), -) +); diff --git a/src/app/utils/debounce.js b/src/app/utils/debounce.js index fb9185e..926e54e 100644 --- a/src/app/utils/debounce.js +++ b/src/app/utils/debounce.js @@ -2,22 +2,22 @@ export default (func, delay) => { - let debounceTimer + let debounceTimer; return function (...args) { - clearTimeout(debounceTimer) + clearTimeout(debounceTimer); // Pass { abort: true } to cancel if (args[0] && args[0].abort) { - return + return; } - const context = this - debounceTimer = setTimeout(() => func.apply(context, args), delay) + const context = this; + debounceTimer = setTimeout(() => func.apply(context, args), delay); - } + }; -} +}; diff --git a/src/app/utils/isArray.js b/src/app/utils/isArray.js index 7661410..d6dc828 100644 --- a/src/app/utils/isArray.js +++ b/src/app/utils/isArray.js @@ -1,5 +1,5 @@ export function isArray(obj) { - return Array.isArray(obj) + return Array.isArray(obj); } diff --git a/src/app/utils/keycodeToChar.js b/src/app/utils/keycodeToChar.js index 43e7550..c832725 100644 --- a/src/app/utils/keycodeToChar.js +++ b/src/app/utils/keycodeToChar.js @@ -1 +1 @@ -export default { 8: 'Backspace', 9: 'Tab', 13: 'Enter', 16: 'Shift', 17: 'Ctrl', 18: 'Alt', 19: 'Pause/Break', 20: 'Caps Lock', 27: 'Esc', 32: 'Space', 33: 'Page Up', 34: 'Page Down', 35: 'End', 36: 'Home', 37: 'Left', 38: 'Up', 39: 'Right', 40: 'Down', 45: 'Insert', 46: 'Delete', 48: '0', 49: '1', 50: '2', 51: '3', 52: '4', 53: '5', 54: '6', 55: '7', 56: '8', 57: '9', 65: 'A', 66: 'B', 67: 'C', 68: 'D', 69: 'E', 70: 'F', 71: 'G', 72: 'H', 73: 'I', 74: 'J', 75: 'K', 76: 'L', 77: 'M', 78: 'N', 79: 'O', 80: 'P', 81: 'Q', 82: 'R', 83: 'S', 84: 'T', 85: 'U', 86: 'V', 87: 'W', 88: 'X', 89: 'Y', 90: 'Z', 91: 'Windows', 93: 'Right Click', 96: 'Numpad 0', 97: 'Numpad 1', 98: 'Numpad 2', 99: 'Numpad 3', 100: 'Numpad 4', 101: 'Numpad 5', 102: 'Numpad 6', 103: 'Numpad 7', 104: 'Numpad 8', 105: 'Numpad 9', 106: 'Numpad *', 107: 'Numpad +', 109: 'Numpad -', 110: 'Numpad .', 111: 'Numpad /', 112: 'F1', 113: 'F2', 114: 'F3', 115: 'F4', 116: 'F5', 117: 'F6', 118: 'F7', 119: 'F8', 120: 'F9', 121: 'F10', 122: 'F11', 123: 'F12', 144: 'Num Lock', 145: 'Scroll Lock', 182: 'My Computer', 183: 'My Calculator', 186: ';', 187: '=', 188: ',', 189: '-', 190: '.', 191: '/', 192: '`', 219: '[', 220: '\\', 221: ']', 222: '\'' } +export default { 8: 'Backspace', 9: 'Tab', 13: 'Enter', 16: 'Shift', 17: 'Ctrl', 18: 'Alt', 19: 'Pause/Break', 20: 'Caps Lock', 27: 'Esc', 32: 'Space', 33: 'Page Up', 34: 'Page Down', 35: 'End', 36: 'Home', 37: 'Left', 38: 'Up', 39: 'Right', 40: 'Down', 45: 'Insert', 46: 'Delete', 48: '0', 49: '1', 50: '2', 51: '3', 52: '4', 53: '5', 54: '6', 55: '7', 56: '8', 57: '9', 65: 'A', 66: 'B', 67: 'C', 68: 'D', 69: 'E', 70: 'F', 71: 'G', 72: 'H', 73: 'I', 74: 'J', 75: 'K', 76: 'L', 77: 'M', 78: 'N', 79: 'O', 80: 'P', 81: 'Q', 82: 'R', 83: 'S', 84: 'T', 85: 'U', 86: 'V', 87: 'W', 88: 'X', 89: 'Y', 90: 'Z', 91: 'Windows', 93: 'Right Click', 96: 'Numpad 0', 97: 'Numpad 1', 98: 'Numpad 2', 99: 'Numpad 3', 100: 'Numpad 4', 101: 'Numpad 5', 102: 'Numpad 6', 103: 'Numpad 7', 104: 'Numpad 8', 105: 'Numpad 9', 106: 'Numpad *', 107: 'Numpad +', 109: 'Numpad -', 110: 'Numpad .', 111: 'Numpad /', 112: 'F1', 113: 'F2', 114: 'F3', 115: 'F4', 116: 'F5', 117: 'F6', 118: 'F7', 119: 'F8', 120: 'F9', 121: 'F10', 122: 'F11', 123: 'F12', 144: 'Num Lock', 145: 'Scroll Lock', 182: 'My Computer', 183: 'My Calculator', 186: ';', 187: '=', 188: ',', 189: '-', 190: '.', 191: '/', 192: '`', 219: '[', 220: '\\', 221: ']', 222: '\'' }; diff --git a/src/app/utils/newGuid.js b/src/app/utils/newGuid.js index 28768d0..d7c63fb 100644 --- a/src/app/utils/newGuid.js +++ b/src/app/utils/newGuid.js @@ -2,12 +2,12 @@ function s4() { return Math.floor((1 + Math.random()) * 0x10000) .toString(16) - .substring(1) + .substring(1); } export function newGuid() { - return s4() + s4() + '-' + s4() + '-' + s4() + '-' + s4() + '-' + s4() + s4() + s4() + return s4() + s4() + '-' + s4() + '-' + s4() + '-' + s4() + '-' + s4() + s4() + s4(); } diff --git a/webpack.config.js b/webpack.config.js index 1ce56f3..b9e38cf 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -1,7 +1,7 @@ -'use strict' +'use strict'; -const path = require('path') -const CopyWebpackPlugin = require('copy-webpack-plugin') +const path = require('path'); +const CopyWebpackPlugin = require('copy-webpack-plugin'); module.exports = { mode: 'production', @@ -60,4 +60,4 @@ module.exports = { }, ], }, -} +};