Add text-plain mode

package-lock.json

@@ -10006,9 +10006,9 @@
       "dev": true
     },
     "uglify-js": {
-      "version": "3.11.2",
+      "version": "3.11.1",
-      "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.11.2.tgz",
+      "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.11.1.tgz",
-      "integrity": "sha512-G440NU6fewtnQftSgqRV1r2A5ChKbU1gqFCJ7I8S7MPpY/eZZfLGefaY6gUZYiWebMaO+txgiQ1ZyLDuNWJulg==",
+      "integrity": "sha512-OApPSuJcxcnewwjSGGfWOjx3oix5XpmrK9Z2j0fTRlHGoZ49IU6kExfZTM0++fCArOOCet+vIfWwFHbvWqwp6g==",
       "dev": true
     },
     "unc-path-regex": {

package.json

@@ -53,7 +53,7 @@
     "mocha": "8.1.3",
     "source-map-loader": "1.1.0",
     "standard": "14.3.4",
-    "uglify-js": "3.11.2",
+    "uglify-js": "3.11.1",
     "webpack": "4.44.2"
   },
   "files": [

src/js/ace/index.js

@@ -9,6 +9,7 @@ if (window.ace) {
 
     // load required Ace plugins
     require('ace-builds/src-noconflict/mode-json')
+    require('ace-builds/src-noconflict/mode-text')
     require('ace-builds/src-noconflict/ext-searchbox')
 
     // embed Ace json worker

src/js/textmode.js

@@ -68,7 +68,7 @@ textmode.create = function (container, options = {}) {
   // TODO: make the option options.ace deprecated, it's not needed anymore (see #309)
 
   // determine mode
-  this.mode = (options.mode === 'code') ? 'code' : 'text'
+  this.mode = (options.mode === 'code') ? 'code' : ((options.mode === 'text') ? 'text' : 'text-plain')
   if (this.mode === 'code') {
     // verify whether Ace editor is available and supported
     if (typeof _ace === 'undefined') {
@@ -132,37 +132,41 @@ textmode.create = function (container, options = {}) {
     this.frame.appendChild(this.menu)
 
     // create format button
-    const buttonFormat = document.createElement('button')
+    if(this.mode !== 'text-plain') {
-    buttonFormat.type = 'button'
+      const buttonFormat = document.createElement('button')
-    buttonFormat.className = 'jsoneditor-format'
+      buttonFormat.type = 'button'
-    buttonFormat.title = translate('formatTitle')
+      buttonFormat.className = 'jsoneditor-format'
-    this.menu.appendChild(buttonFormat)
+      buttonFormat.title = translate('formatTitle')
-    buttonFormat.onclick = () => {
+      this.menu.appendChild(buttonFormat)
-      try {
+      buttonFormat.onclick = () => {
-        me.format()
+        try {
-        me._onChange()
+          me.format()
-      } catch (err) {
+          me._onChange()
-        me._onError(err)
+        } catch (err) {
+          me._onError(err)
+        }
       }
     }
 
     // create compact button
-    const buttonCompact = document.createElement('button')
+    if(this.mode !== 'text-plain') {
-    buttonCompact.type = 'button'
+      const buttonCompact = document.createElement('button')
-    buttonCompact.className = 'jsoneditor-compact'
+      buttonCompact.type = 'button'
-    buttonCompact.title = translate('compactTitle')
+      buttonCompact.className = 'jsoneditor-compact'
-    this.menu.appendChild(buttonCompact)
+      buttonCompact.title = translate('compactTitle')
-    buttonCompact.onclick = () => {
+      this.menu.appendChild(buttonCompact)
-      try {
+      buttonCompact.onclick = () => {
-        me.compact()
+        try {
-        me._onChange()
+          me.compact()
-      } catch (err) {
+          me._onChange()
-        me._onError(err)
+        } catch (err) {
+          me._onError(err)
+        }
       }
     }
 
     // create sort button
-    if (this.options.enableSort) {
+    if (this.options.enableSort && this.mode !== 'text-plain') {
       const sort = document.createElement('button')
       sort.type = 'button'
       sort.className = 'jsoneditor-sort'
@@ -174,7 +178,7 @@ textmode.create = function (container, options = {}) {
     }
 
     // create transform button
-    if (this.options.enableTransform) {
+    if (this.options.enableTransform && this.mode !== 'text-plain') {
       const transform = document.createElement('button')
       transform.type = 'button'
       transform.title = translate('transformTitleShort')
@@ -186,22 +190,24 @@ textmode.create = function (container, options = {}) {
     }
 
     // create repair button
-    const buttonRepair = document.createElement('button')
+    if(this.mode !== 'text-plain') {
-    buttonRepair.type = 'button'
+      const buttonRepair = document.createElement('button')
-    buttonRepair.className = 'jsoneditor-repair'
+      buttonRepair.type = 'button'
-    buttonRepair.title = translate('repairTitle')
+      buttonRepair.className = 'jsoneditor-repair'
-    this.menu.appendChild(buttonRepair)
+      buttonRepair.title = translate('repairTitle')
-    buttonRepair.onclick = () => {
+      this.menu.appendChild(buttonRepair)
-      try {
+      buttonRepair.onclick = () => {
-        me.repair()
+        try {
-        me._onChange()
+          me.repair()
-      } catch (err) {
+          me._onChange()
-        me._onError(err)
+        } catch (err) {
+          me._onError(err)
+        }
       }
     }
 
     // create undo/redo buttons
-    if (this.mode === 'code') {
+    if (this.mode === 'code' || this.mode === 'text-plain') {
       // create undo button
       const undo = document.createElement('button')
       undo.type = 'button'
@@ -234,7 +240,7 @@ textmode.create = function (container, options = {}) {
       })
     }
 
-    if (this.mode === 'code') {
+    if (this.mode === 'code' || this.mode === 'text-plain') {
       const poweredBy = document.createElement('a')
       poweredBy.appendChild(document.createTextNode('powered by ace'))
       poweredBy.href = 'https://ace.c9.io/'
@@ -258,7 +264,7 @@ textmode.create = function (container, options = {}) {
   this.frame.appendChild(this.content)
   this.container.appendChild(this.frame)
 
-  if (this.mode === 'code') {
+  if (this.mode === 'code' || this.mode === 'text-plain') {
     this.editorDom = document.createElement('div')
     this.editorDom.style.height = '100%' // TODO: move to css
     this.editorDom.style.width = '100%' // TODO: move to css
@@ -271,7 +277,12 @@ textmode.create = function (container, options = {}) {
     aceEditor.setOptions({ readOnly: isReadOnly })
     aceEditor.setShowPrintMargin(false)
     aceEditor.setFontSize('13px')
-    aceSession.setMode('ace/mode/json')
+    if(this.mode === 'text-plain') {
+      aceSession.setMode('ace/mode/text')
+    }
+    else{
+      aceSession.setMode('ace/mode/json')
+    }
     aceSession.setTabSize(this.indentation)
     aceSession.setUseSoftTabs(true)
     aceSession.setUseWrapMode(true)
@@ -691,17 +702,24 @@ textmode.compact = function () {
  */
 textmode.format = function () {
   const json = this.get()
-  const text = JSON.stringify(json, null, this.indentation)
+  if(this.mode !== 'text-plain') {
-  this.updateText(text)
+    const text = JSON.stringify(json, null, this.indentation)
+    this.updateText(text)
+  }
+  else {
+    this.updateText(json)
+  }
 }
 
 /**
  * Repair the code in the text editor
  */
 textmode.repair = function () {
-  const text = this.getText()
+  if(this.mode !== 'text-plain') {
-  const repairedText = repair(text)
+    const text = this.getText()
-  this.updateText(repairedText)
+    const repairedText = repair(text)
+    this.updateText(repairedText)
+  }
 }
 
 /**
@@ -731,7 +749,12 @@ textmode.resize = function () {
  * @param {*} json
  */
 textmode.set = function (json) {
-  this.setText(JSON.stringify(json, null, this.indentation))
+  if(this.mode !== 'text-plain') {
+    this.setText(JSON.stringify(json, null, this.indentation))
+  }
+  else{
+    this.setText(json)
+  }
 }
 
 /**
@@ -829,6 +852,9 @@ textmode.updateText = function (jsonText) {
  * Throws an exception when no JSON schema is configured
  */
 textmode.validate = function () {
+  if(this.mode === 'text-plain') {
+    return
+  }
   let schemaErrors = []
   let parseErrors = []
   let json
@@ -1063,5 +1089,11 @@ export const textModeMixins = [
     mixin: textmode,
     data: 'text',
     load: load
+  },
+  {
+    mode: 'text-plain',
+    mixin: textmode,
+    data: 'text',
+    load: load
   }
 ]