[ui] ScriptEditor: Updated Script Editor layout

ScriptEditor is now part of a ColumnLayout in an MSplitView allowing more control over what is being viewed.
This commit is contained in:
waaake 2024-10-28 15:48:26 +05:30
parent 8984aac20e
commit 4464cdf799

View file

@ -12,19 +12,49 @@ import Qt.labs.platform 1.0 as Platform
Item {
id: root
function formatInput(text) {
var lines = text.split("\n")
for (let i = 0; i < lines.length; ++i) {
lines[i] = ">>> " + lines[i]
}
return lines.join("\n")
function replace(text, string, replacement) {
/*
* Replaces all occurences of the string in the text
* @param text - overall text
* @param string - the string to be replaced in the text
* @param replacement - the replacement of the string
*/
// Split with the string
let lines = text.split(string)
// Return the overall text joined with the replacement
return lines.join(replacement)
}
function processScript() {
output.clear()
var ret = ScriptEditorManager.process(input.text)
output.text = formatInput(input.text) + "\n\n" + ret
input.clear()
function formatInput(text) {
/*
* Formats the text to be displayed as the input script executed
*/
// Replace the text to be RichText Supportive
return "<font color=#868686>" + replace(text, "\n", "<br>") + "</font><br><br>"
}
function formatOutput(text) {
/*
* Formats the text to be displayed as the result of the script executed
*/
// Replace the text to be RichText Supportive
return "<font color=#49a1f3>" + "Result: " + replace(text, "\n", "<br>") + "</font><br><br>"
}
function processScript(text = "") {
// Use either the provided/selected or the entire script
text = text || input.text
// Execute the process and fetch back the return for it
var ret = ScriptEditorManager.process(text)
// Append the input script and the output result to the output console
output.append(formatInput(text) + formatOutput(ret))
// Save the entire script after executing the commands
ScriptEditorManager.saveScript(input.text)
}
function loadScript(fileUrl) {
@ -83,12 +113,8 @@ Item {
RowLayout {
Layout.alignment: Qt.AlignVCenter | Qt.AlignHCenter
Item {
Layout.fillWidth: true
}
MaterialToolButton {
font.pointSize: 13
font.pointSize: 18
text: MaterialIcons.download
ToolTip.text: "Load Script"
@ -98,7 +124,7 @@ Item {
}
MaterialToolButton {
font.pointSize: 13
font.pointSize: 18
text: MaterialIcons.upload
ToolTip.text: "Save Script"
@ -113,7 +139,7 @@ Item {
MaterialToolButton {
id: executeButton
font.pointSize: 13
font.pointSize: 18
text: MaterialIcons.slideshow
ToolTip.text: "Execute Script"
@ -123,7 +149,7 @@ Item {
}
MaterialToolButton {
font.pointSize: 13
font.pointSize: 18
text: MaterialIcons.cancel_presentation
ToolTip.text: "Clear Output Window"
@ -137,7 +163,7 @@ Item {
}
MaterialToolButton {
font.pointSize: 13
font.pointSize: 18
text: MaterialIcons.history
ToolTip.text: "Get Previous Script"
@ -152,7 +178,7 @@ Item {
}
MaterialToolButton {
font.pointSize: 13
font.pointSize: 18
text: MaterialIcons.update
ToolTip.text: "Get Next Script"
@ -167,7 +193,7 @@ Item {
}
MaterialToolButton {
font.pointSize: 13
font.pointSize: 18
text: MaterialIcons.backspace
ToolTip.text: "Clear History"
@ -183,31 +209,50 @@ Item {
}
}
RowLayout {
Label {
text: "Input"
font.bold: true
horizontalAlignment: Text.AlignHCenter
Layout.fillWidth: true
}
Label {
text: "Output"
font.bold: true
horizontalAlignment: Text.AlignHCenter
Layout.fillWidth: true
}
}
RowLayout {
Layout.fillWidth: true
MSplitView {
id: topBottomSplit
Layout.fillHeight: true
width: root.width
Layout.fillWidth: true
orientation: Qt.Vertical
// Output Text Area -- Shows the output for the executed script(s)
Rectangle {
id: outputArea
// Has a minimum height
SplitView.minimumHeight: 80
color: palette.base
Flickable {
width: parent.width
height: parent.height
contentWidth: width
contentHeight: ( output.lineCount + 5 ) * output.font.pixelSize // + 5 lines for buffer to be scrolled and visibility
ScrollBar.vertical: MScrollBar {}
TextArea.flickable: TextArea {
id: output
readOnly: true
selectByMouse: true
padding: 0
Layout.fillHeight: true
Layout.fillWidth: true
wrapMode: Text.WordWrap
textFormat: Text.RichText
}
}
}
// Input Text Area -- Holds the input scripts to be executed
Rectangle {
id: inputArea
Layout.fillHeight: true
Layout.fillWidth: true
SplitView.fillHeight: true
color: palette.base
@ -254,7 +299,7 @@ Item {
width: parent.width
height: parent.height
contentWidth: width
contentHeight: height
contentHeight: ( input.lineCount + 5 ) * input.font.pixelSize // + 5 lines for buffer to be scrolled and visibility
anchors.left: lineNumbers.right
anchors.top: parent.top
@ -266,13 +311,8 @@ Item {
TextArea.flickable: TextArea {
id: input
text: {
var str = "from meshroom.ui import uiInstance\n\n"
str += "graph = uiInstance.activeProject.graph\n"
str += "for node in graph.nodes:\n"
str += " print(node.name)"
return str
}
text: ScriptEditorManager.loadLastScript()
font: lineNumbers.textMetrics.font
Layout.fillHeight: true
Layout.fillWidth: true
@ -287,7 +327,7 @@ Item {
Keys.onPressed: function(event) {
if ((event.key === Qt.Key_Enter || event.key === Qt.Key_Return) && event.modifiers === Qt.ControlModifier) {
root.processScript()
root.processScript(input.selectedText)
}
}
}
@ -299,33 +339,6 @@ Item {
}
}
}
Rectangle {
id: outputArea
Layout.fillHeight: true
Layout.fillWidth: true
color: palette.base
Flickable {
width: parent.width
height: parent.height
contentWidth: width
contentHeight: height
ScrollBar.vertical: MScrollBar {}
TextArea.flickable: TextArea {
id: output
readOnly: true
selectByMouse: true
padding: 0
Layout.fillHeight: true
Layout.fillWidth: true
}
}
}
}
}
}