EffectComposer: Add advanced mode button

In advanced mode, users can add/edit/remove properties and shader code
of non-custom nodes.

Fixes: QDS-14219
Change-Id: I9fe0b64da0201c47b83e31fbc5fd55d99c323316
Reviewed-by: Mahmoud Badri <mahmoud.badri@qt.io>

share/qtcreator/qmldesigner/effectComposerQmlSources/EffectComposerTopBar.qml

@@ -82,6 +82,7 @@ Rectangle {
             enabled: root.backendModel ? root.backendModel.isEnabled
                                          && root.backendModel.currentComposition !== ""
                                        : false
+            visible: root.backendModel ? root.backendModel.advancedMode : false
 
             onClicked: root.backendModel.openMainCodeEditor()
 
@@ -111,13 +112,33 @@ Rectangle {
         color: StudioTheme.Values.themeTextColor
     }
 
-    HelperWidgets.AbstractButton {
+    Row {
-        objectName: "btnEffectComposerHelp"
+        spacing: 5
-
         anchors.verticalCenter: parent.verticalCenter
         anchors.rightMargin: 5
         anchors.right: parent.right
 
+        HelperWidgets.AbstractButton {
+            objectName: "btnEffectComposerAdvancedMode"
+
+            anchors.verticalCenter: parent.verticalCenter
+
+            style: StudioTheme.Values.viewBarButtonStyle
+            buttonIcon: StudioTheme.Constants.settings_medium
+            tooltip: qsTr("In advanced mode, you can manage effect properties and edit shader code for all effects.")
+            checkable: true
+            checked: root.backendModel ? root.backendModel.advancedMode : false
+
+            onClicked: root.backendModel.advancedMode = !root.backendModel.advancedMode
+        }
+
+        HelperWidgets.AbstractButton {
+            id: openHelpButton
+
+            objectName: "btnEffectComposerHelp"
+
+            anchors.verticalCenter: parent.verticalCenter
+
             style: StudioTheme.Values.viewBarButtonStyle
             buttonIcon: StudioTheme.Constants.help
             tooltip: qsTr("How to use Effect Composer:
@@ -129,4 +150,5 @@ Rectangle {
 
             onClicked: Qt.openUrlExternally("https://doc.qt.io/qtdesignstudio/qtquick-effect-composer-view.html")
         }
+    }
 }

share/qtcreator/qmldesigner/effectComposerQmlSources/EffectCompositionNode.qml

@@ -219,6 +219,7 @@ HelperWidgets.Section {
                     editing: root.editedUniformIndex === index
                     disableMoreMenu: root.editedUniformIndex >= 0
                     isDependencyNode: isDependency
+                    isCustomNode: isCustom
 
                     onReset: nodeUniformsModel.resetData(index)
                     onRemove: {
@@ -282,7 +283,7 @@ HelperWidgets.Section {
 
             Row {
                 height: 40
-                visible: !isDependency && !addPropertyForm.visible
+                visible: (root.backendModel.advancedMode || isCustom) && !isDependency && !addPropertyForm.visible
                 anchors.horizontalCenter: parent.horizontalCenter
                 spacing: 10
 

share/qtcreator/qmldesigner/effectComposerQmlSources/EffectCompositionNodeUniform.qml

@@ -14,8 +14,10 @@ Item {
 
     property bool editing: false
     property bool disableMoreMenu: false
-    property bool isDependencyNode: true
+    property bool isDependencyNode: false
+    property bool isCustomNode: false
     property alias editPropertyFormParent: editPropertyFormPlaceholder
+    readonly property var backendModel: EffectComposerBackend.effectComposerModel
 
     height: layout.implicitHeight + editPropertyFormPlaceholder.height + column.spacing
     visible: !uniformUseCustomValue
@@ -146,7 +148,7 @@ Item {
                     tooltip: root.disableMoreMenu ? qsTr("Additional actions disabled while editing existing property.")
                                                   : qsTr("Access additional property actions.")
                     enabled: !root.disableMoreMenu
-                    visible: !root.isDependencyNode
+                    visible: (root.backendModel.advancedMode || root.isCustomNode) && !root.isDependencyNode
 
                     onClicked: menuLoader.show()
                 }

src/plugins/effectcomposer/effectcomposermodel.h

@@ -61,6 +61,7 @@ class EffectComposerModel : public QAbstractListModel
     Q_PROPERTY(int customPreviewImageCount READ customPreviewImageCount NOTIFY customPreviewImageCountChanged)
     Q_PROPERTY(int mainCodeEditorIndex READ mainCodeEditorIndex CONSTANT)
     Q_PROPERTY(QString effectErrors READ effectErrors NOTIFY effectErrorsChanged)
+    Q_PROPERTY(bool advancedMode MEMBER m_advancedMode NOTIFY advancedModeChanged)
 
 public:
     EffectComposerModel(QObject *parent = nullptr);
@@ -181,6 +182,7 @@ signals:
     void currentPreviewImageChanged();
     void previewImagesChanged();
     void customPreviewImageCountChanged();
+    void advancedModeChanged();
 
 private:
     enum ErrorTypes {
@@ -291,6 +293,7 @@ private:
     QUrl m_currentPreviewImage;
     QList<QUrl> m_customPreviewImages;
     int m_currentBakeCounter = 0;
+    bool m_advancedMode = false;
 
     const QRegularExpression m_spaceReg = QRegularExpression("\\s+");
 };