diff --git a/scripts/system/create/entityProperties/html/js/entityProperties.js b/scripts/system/create/entityProperties/html/js/entityProperties.js index 0f60c13258..458ebc1b7c 100644 --- a/scripts/system/create/entityProperties/html/js/entityProperties.js +++ b/scripts/system/create/entityProperties/html/js/entityProperties.js @@ -1997,14 +1997,14 @@ const GROUPS = [ properties: [ { label: "Script", - type: "string", + type: "code", buttons: [ { id: "reload", label: "F", className: "glyph", onClick: reloadScripts } ], propertyID: "script", placeholder: "URL", }, { label: "Server Script", - type: "string", + type: "code", buttons: [ { id: "reload", label: "F", className: "glyph", onClick: reloadServerScripts } ], propertyID: "serverScripts", placeholder: "URL", @@ -2292,6 +2292,7 @@ function getPropertyInputElement(propertyID) { case 'bool': case 'dropdown': case 'textarea': + case 'code': case 'texture': return property.elInput; case 'multipleZonesSelection': @@ -2450,7 +2451,8 @@ function resetProperties() { setDropdownText(property.elInput); break; } - case 'textarea': { + case 'textarea': + case 'code': { property.elInput.classList.remove('multi-diff'); property.elInput.value = ""; setTextareaScrolling(property.elInput); @@ -3428,6 +3430,47 @@ function createTextareaProperty(property, elProperty) { return elInput; } +function createCodeProperty(property, elProperty) { + let elementID = property.elementID; + let propertyData = property.data; + + elProperty.className = "textarea"; + + let elInput = document.createElement('textarea'); + elInput.setAttribute("id", elementID); + if (propertyData.readOnly) { + elInput.readOnly = true; + } + + elInput.addEventListener('change', createEmitTextPropertyUpdateFunction(property)); + elInput.addEventListener('keydown', function(event) { + if (event.key === 'Tab') { + event.preventDefault(); + const prevStart = this.selectionStart + 1; + this.value = this.value.substring(0, this.selectionStart) + + "\t" + + this.value.substring(this.selectionEnd); + this.selectionStart = prevStart; + this.selectionEnd = prevStart; + } else if (event.key === 'Escape') { + event.preventDefault(); + this.blur(); + } + }); + + let elMultiDiff = document.createElement('span'); + elMultiDiff.className = "multi-diff"; + + elProperty.appendChild(elInput); + elProperty.appendChild(elMultiDiff); + + if (propertyData.buttons !== undefined) { + addButtons(elProperty, elementID, propertyData.buttons, true); + } + + return elInput; +} + function createIconProperty(property, elProperty) { let elementID = property.elementID; @@ -3665,6 +3708,10 @@ function createProperty(propertyData, propertyElementID, propertyName, propertyI property.elInput = createTextareaProperty(property, elProperty); break; } + case 'code': { + property.elInput = createCodeProperty(property, elProperty); + break; + } case 'multipleZonesSelection': { property.elInput = createZonesSelection(property, elProperty); break; @@ -5476,7 +5523,8 @@ function handleEntitySelectionUpdate(selections, isPropertiesToolUpdate) { setDropdownText(property.elInput); break; } - case 'textarea': { + case 'textarea': + case 'code': { property.elInput.value = propertyValue; setTextareaScrolling(property.elInput); break;