Remove anonymous "function"

tohosaku · tohosaku · commit d5ae104c04af · 2020-03-19T01:35:18.000+09:00
diff --git a/src/editors/array.js b/src/editors/array.js
@@ -507,15 +507,15 @@ export class ArrayEditor extends AbstractEditor {
       self.rows[i].delete_button = this.getButton(self.getItemTitle(), 'delete', this.translate('button_delete_row_title', [self.getItemTitle()]))
       self.rows[i].delete_button.classList.add('delete', 'json-editor-btntype-delete')
       self.rows[i].delete_button.setAttribute('data-i', i)
-      self.rows[i].delete_button.addEventListener('click', function (e) {
+      self.rows[i].delete_button.addEventListener('click', e => {
         e.preventDefault()
         e.stopPropagation()
 
         if (!self.askConfirmation()) {
           return false
         }
 
-        const i = this.getAttribute('data-i') * 1
+        const i = e.currentTarget.getAttribute('data-i') * 1
         const newval = self.getValue().filter((row, j) => j !== i)
         let newActiveTab = null
 
@@ -548,11 +548,11 @@ export class ArrayEditor extends AbstractEditor {
       self.rows[i].copy_button = this.getButton(self.getItemTitle(), 'copy', `Copy ${self.getItemTitle()}`)
       self.rows[i].copy_button.classList.add('copy', 'json-editor-btntype-copy')
       self.rows[i].copy_button.setAttribute('data-i', i)
-      self.rows[i].copy_button.addEventListener('click', function (e) {
+      self.rows[i].copy_button.addEventListener('click', e => {
         const value = self.getValue()
         e.preventDefault()
         e.stopPropagation()
-        const i = this.getAttribute('data-i') * 1
+        const i = e.currentTarget.getAttribute('data-i') * 1
 
         value.forEach((row, j) => {
           if (j === i) {
@@ -572,10 +572,10 @@ export class ArrayEditor extends AbstractEditor {
       self.rows[i].moveup_button = this.getButton('', (this.schema.format === 'tabs-top' ? 'moveleft' : 'moveup'), this.translate('button_move_up_title'))
       self.rows[i].moveup_button.classList.add('moveup', 'json-editor-btntype-move')
       self.rows[i].moveup_button.setAttribute('data-i', i)
-      self.rows[i].moveup_button.addEventListener('click', function (e) {
+      self.rows[i].moveup_button.addEventListener('click', e => {
         e.preventDefault()
         e.stopPropagation()
-        const i = this.getAttribute('data-i') * 1
+        const i = e.currentTarget.getAttribute('data-i') * 1
 
         if (i <= 0) return
         const rows = self.getValue()
@@ -601,10 +601,10 @@ export class ArrayEditor extends AbstractEditor {
       self.rows[i].movedown_button = this.getButton('', (this.schema.format === 'tabs-top' ? 'moveright' : 'movedown'), this.translate('button_move_down_title'))
       self.rows[i].movedown_button.classList.add('movedown', 'json-editor-btntype-move')
       self.rows[i].movedown_button.setAttribute('data-i', i)
-      self.rows[i].movedown_button.addEventListener('click', function (e) {
+      self.rows[i].movedown_button.addEventListener('click', e => {
         e.preventDefault()
         e.stopPropagation()
-        const i = this.getAttribute('data-i') * 1
+        const i = e.currentTarget.getAttribute('data-i') * 1
 
         const rows = self.getValue()
         if (i >= rows.length - 1) return
@@ -642,7 +642,7 @@ export class ArrayEditor extends AbstractEditor {
 
     const rowHolderDisplay = self.row_holder.style.display
     const controlsDisplay = self.controls.style.display
-    this.toggle_button.addEventListener('click', function (e) {
+    this.toggle_button.addEventListener('click', e => {
       e.preventDefault()
       e.stopPropagation()
       if (self.collapsed) {
@@ -651,14 +651,14 @@ export class ArrayEditor extends AbstractEditor {
         self.row_holder.style.display = rowHolderDisplay
         if (self.tabs_holder) self.tabs_holder.style.display = ''
         self.controls.style.display = controlsDisplay
-        self.setButtonText(this, '', 'collapse', self.translate('button_collapse'))
+        self.setButtonText(e.currentTarget, '', 'collapse', self.translate('button_collapse'))
       } else {
         self.collapsed = true
         self.row_holder.style.display = 'none'
         if (self.tabs_holder) self.tabs_holder.style.display = 'none'
         self.controls.style.display = 'none'
         if (self.panel) self.panel.style.display = 'none'
-        self.setButtonText(this, '', 'expand', self.translate('button_expand'))
+        self.setButtonText(e.currentTarget, '', 'expand', self.translate('button_expand'))
       }
     })
 
diff --git a/src/editors/base64.js b/src/editors/base64.js
@@ -55,28 +55,28 @@ export class Base64Editor extends AbstractEditor {
         this.uploader.setAttribute('multiple', '')
       }
 
-      this.uploader.addEventListener('change', function (e) {
+      this.uploader.addEventListener('change', e => {
         e.preventDefault()
         e.stopPropagation()
 
-        if (this.files && this.files.length) {
+        if (e.currentTarget.files && e.currentTarget.files.length) {
           /* Check the amount of files uploaded. */
           /* If 1, use the regular upload, otherwise use the multiple upload method */
-          if (this.files.length > 1 && self.schema.options && self.schema.options.multiple && self.schema.options.multiple === true && self.parent && self.parent.schema.type === 'object' && self.parent.parent && self.parent.parent.schema.type === 'array') {
+          if (e.currentTarget.files.length > 1 && self.schema.options && self.schema.options.multiple && self.schema.options.multiple === true && self.parent && self.parent.schema.type === 'object' && self.parent.parent && self.parent.parent.schema.type === 'array') {
             /* Load editor of parent.parent to get the array */
             self.arrayEditor = self.jsoneditor.getEditor(self.parent.parent.path)
             /* Check the current value of this editor */
             self.value = self.arrayEditor.getValue()
             /* Set variables for amount of files, index of current array item and */
             /* count value containing current status of processed files */
-            self.total = this.files.length
+            self.total = e.currentTarget.files.length
             self.current_item_index = parseInt(self.parent.key)
             self.count = self.current_item_index
 
             for (let i = 0; i < self.total; i++) {
               const frMultiple = new FileReader()
               self.setFileReaderListener(frMultiple)
-              frMultiple.readAsDataURL(this.files[i])
+              frMultiple.readAsDataURL(e.currentTarget.files[i])
             }
           } else {
             let fr = new FileReader()
@@ -86,7 +86,7 @@ export class Base64Editor extends AbstractEditor {
               self.onChange(true)
               fr = null
             }
-            fr.readAsDataURL(this.files[0])
+            fr.readAsDataURL(e.currentTarget.files[0])
           }
         }
       })
diff --git a/src/editors/checkbox.js b/src/editors/checkbox.js
@@ -40,10 +40,10 @@ export class CheckboxEditor extends AbstractEditor {
       this.input.disabled = true
     }
 
-    this.input.addEventListener('change', function (e) {
+    this.input.addEventListener('change', e => {
       e.preventDefault()
       e.stopPropagation()
-      self.value = this.checked
+      self.value = e.currentTarget.checked
       self.onChange(true)
     })
 
diff --git a/src/editors/colorpicker.js b/src/editors/colorpicker.js
@@ -65,7 +65,6 @@ export class ColorEditor extends StringEditor {
   createPicker (create) {
     if (create) { /* create vanilla-picker */
       if (window.Picker && !this.picker_instance) { /* do when vanilla-picker loaded */
-        const self = this
         const options = this.expandCallbacks('colorpicker', extend({}, {
           editor: false, /* default no editor */
           alpha: false, /* default no alpha */
@@ -75,10 +74,10 @@ export class ColorEditor extends StringEditor {
           parent: this.container
         }))
 
-        const updateHandler = function (color) {
-          const format = this.settings.editorFormat
-          const isAlpha = this.settings.alpha
-          self.setValue(format === 'hex' ? (isAlpha ? color.hex : color.hex.slice(0, 7)) : color[`${format + (isAlpha ? 'a' : '')}String`])
+        const updateHandler = color => {
+          const format = this.picker_instance.settings.editorFormat
+          const isAlpha = this.picker_instance.settings.alpha
+          this.setValue(format === 'hex' ? (isAlpha ? color.hex : color.hex.slice(0, 7)) : color[`${format + (isAlpha ? 'a' : '')}String`])
         }
         if (!options.popup && typeof options.onChange !== 'function') options.onChange = updateHandler
         else if (options.popup && typeof options.onDone !== 'function') options.onDone = updateHandler
diff --git a/src/editors/enum.js b/src/editors/enum.js
@@ -33,8 +33,8 @@ export class EnumEditor extends AbstractEditor {
 
     if (this.options.hide_display) this.display_area.style.display = 'none'
 
-    this.switcher.addEventListener('change', function () {
-      self.selected = self.select_options.indexOf(this.value)
+    this.switcher.addEventListener('change', e => {
+      self.selected = self.select_options.indexOf(e.currentTarget.value)
       self.value = self.enum[self.selected]
       self.refreshValue()
       self.onChange(true)
diff --git a/src/editors/multiple.js b/src/editors/multiple.js
@@ -179,11 +179,11 @@ export class MultipleEditor extends AbstractEditor {
 
     this.switcher = this.theme.getSwitcher(this.display_text)
     container.appendChild(this.switcher)
-    this.switcher.addEventListener('change', function (e) {
+    this.switcher.addEventListener('change', e => {
       e.preventDefault()
       e.stopPropagation()
 
-      self.switchEditor(self.display_text.indexOf(this.value))
+      self.switchEditor(self.display_text.indexOf(e.currentTarget.value))
       self.onChange(true)
     })
 
diff --git a/src/editors/radio.js b/src/editors/radio.js
@@ -18,8 +18,8 @@ export class RadioEditor extends SelectEditor {
 
     this.radioGroup = []
 
-    const radioInputEventhandler = function (e) {
-      self.setValue(this.value)
+    const radioInputEventhandler = e => {
+      self.setValue(e.currentTarget.value)
       self.onChange(true)
     }
 
diff --git a/src/editors/starrating.js b/src/editors/starrating.js
@@ -23,10 +23,10 @@ export class StarratingEditor extends StringEditor {
 
     this.radioGroup = []
 
-    const radioInputEventhandler = function (e) {
+    const radioInputEventhandler = e => {
       e.preventDefault()
       e.stopPropagation()
-      self.setValue(this.value)
+      self.setValue(e.currentTarget.value)
       self.onChange(true)
     }
 
diff --git a/src/editors/string.js b/src/editors/string.js
@@ -132,22 +132,22 @@ export class StringEditor extends AbstractEditor {
     this.setInputAttributes(['maxlength', 'pattern', 'readonly', 'min', 'max', 'step'])
 
     this.input
-      .addEventListener('change', function (e) {
+      .addEventListener('change', e => {
         e.preventDefault()
         e.stopPropagation()
 
         /* Don't allow changing if this field is a template */
         if (self.schema.template) {
-          this.value = self.value
+          e.currentTarget.value = self.value
           return
         }
 
-        const val = this.value
+        const val = e.currentTarget.value
 
         /* sanitize value */
         const sanitized = self.sanitize(val)
         if (val !== sanitized) {
-          this.value = sanitized
+          e.currentTarget.value = sanitized
         }
 
         self.is_dirty = true
@@ -182,11 +182,11 @@ export class StringEditor extends AbstractEditor {
         }
       }
 
-      this.input.addEventListener('keyup', function (e) {
-        self.adjust_height(this)
+      this.input.addEventListener('keyup', e => {
+        self.adjust_height(e.currentTarget)
       })
-      this.input.addEventListener('change', function (e) {
-        self.adjust_height(this)
+      this.input.addEventListener('change', e => {
+        self.adjust_height(e.currentTarget)
       })
       this.adjust_height()
     }
diff --git a/src/editors/table.js b/src/editors/table.js
@@ -327,15 +327,15 @@ export class TableEditor extends ArrayEditor {
       self.rows[i].delete_button = this.getButton('', 'delete', this.translate('button_delete_row_title_short'))
       self.rows[i].delete_button.classList.add('delete', 'json-editor-btntype-delete')
       self.rows[i].delete_button.setAttribute('data-i', i)
-      self.rows[i].delete_button.addEventListener('click', function (e) {
+      self.rows[i].delete_button.addEventListener('click', e => {
         e.preventDefault()
         e.stopPropagation()
 
         if (!self.askConfirmation()) {
           return false
         }
 
-        const i = this.getAttribute('data-i') * 1
+        const i = e.currentTarget.getAttribute('data-i') * 1
         const newval = self.getValue().filter((row, j) => j !== i) /* If this is the one we're deleting */
         self.setValue(newval)
         self.onChange(true)
@@ -348,10 +348,10 @@ export class TableEditor extends ArrayEditor {
       self.rows[i].moveup_button = this.getButton('', 'moveup', this.translate('button_move_up_title'))
       self.rows[i].moveup_button.classList.add('moveup', 'json-editor-btntype-move')
       self.rows[i].moveup_button.setAttribute('data-i', i)
-      self.rows[i].moveup_button.addEventListener('click', function (e) {
+      self.rows[i].moveup_button.addEventListener('click', e => {
         e.preventDefault()
         e.stopPropagation()
-        const i = this.getAttribute('data-i') * 1
+        const i = e.currentTarget.getAttribute('data-i') * 1
 
         if (i <= 0) return
         const rows = self.getValue()
@@ -370,10 +370,10 @@ export class TableEditor extends ArrayEditor {
       self.rows[i].movedown_button = this.getButton('', 'movedown', this.translate('button_move_down_title'))
       self.rows[i].movedown_button.classList.add('movedown', 'json-editor-btntype-move')
       self.rows[i].movedown_button.setAttribute('data-i', i)
-      self.rows[i].movedown_button.addEventListener('click', function (e) {
+      self.rows[i].movedown_button.addEventListener('click', e => {
         e.preventDefault()
         e.stopPropagation()
-        const i = this.getAttribute('data-i') * 1
+        const i = e.currentTarget.getAttribute('data-i') * 1
         const rows = self.getValue()
         if (i >= rows.length - 1) return
         const tmp = rows[i + 1]
@@ -399,18 +399,18 @@ export class TableEditor extends ArrayEditor {
     this.toggle_button.style.margin = '0 10px 0 0'
     if (this.title_controls) {
       this.title.insertBefore(this.toggle_button, this.title.childNodes[0])
-      this.toggle_button.addEventListener('click', function (e) {
+      this.toggle_button.addEventListener('click', e => {
         e.preventDefault()
         e.stopPropagation()
 
         if (self.collapsed) {
           self.collapsed = false
           self.panel.style.display = ''
-          self.setButtonText(this, '', 'collapse', self.translate('button_collapse'))
+          self.setButtonText(e.currentTarget, '', 'collapse', self.translate('button_collapse'))
         } else {
           self.collapsed = true
           self.panel.style.display = 'none'
-          self.setButtonText(this, '', 'expand', self.translate('button_expand'))
+          self.setButtonText(e.currentTarget, '', 'expand', self.translate('button_expand'))
         }
       })
 
diff --git a/src/editors/upload.js b/src/editors/upload.js
@@ -116,11 +116,11 @@ export class UploadEditor extends AbstractEditor {
       this.uploader.addEventListener('change', this.uploadHandler)
 
       /* Drag&Drop Event Handler */
-      this.dragHandler = function (e) {
+      this.dragHandler = e => {
         const files = e.dataTransfer.items || e.dataTransfer.files
         const validType = files && files.length && (self.options.mime_type.length === 0 || self.isValidMimeType(files[0].type, self.options.mime_type))
         const validZone = e.currentTarget.classList && e.currentTarget.classList.contains('upload-dropzone') && validType
-        switch ((this === window ? 'w_' : 'e_') + e.type) {
+        switch ((e.currentTarget === window ? 'w_' : 'e_') + e.type) {
           case 'w_drop':
           case 'w_dragover':
             /* prevent default browser action if dropped outside dropzone */
@@ -190,8 +190,8 @@ export class UploadEditor extends AbstractEditor {
       img.onload = (event) => {
         self.preview.appendChild(img)
       }
-      img.onerror = function (error) {
-        console.error('upload error', error, this)
+      img.onerror = error => {
+        console.error('upload error', error, error.currentTarget)
       }
       img.src = self.container.querySelector('a').href
     }
diff --git a/src/theme.js b/src/theme.js
@@ -271,7 +271,7 @@ export class AbstractTheme {
     const output = document.createElement('output')
     output.value = startvalue || 0
 
-    const updateOutput = function () { output.value = this.value }
+    const updateOutput = e => { output.value = e.currentTarget.value }
     input.addEventListener('change', updateOutput, false)
     input.addEventListener('input', updateOutput, false)
     return output

Original file line number	Diff line number	Diff line change
`@@ -18,8 +18,8 @@ export class RadioEditor extends SelectEditor {`
`18`	`18`
`19`	`19`	`this.radioGroup = []`
`20`	`20`
`21`		`- const radioInputEventhandler = function (e) {`
`22`		`- self.setValue(this.value)`
	`21`	`+ const radioInputEventhandler = e => {`
	`22`	`+ self.setValue(e.currentTarget.value)`
`23`	`23`	`self.onChange(true)`
`24`	`24`	`}`
`25`	`25`