{
  "custom": {
    "payload": {}
  },
  "params": {
    "password": "helloWorld",
    "username": "user1"
  },
  "propConfig": {
    "custom.payload": {
      "persistent": true
    },
    "custom.payload.username": {
      "binding": {
        "config": {
          "path": "view.params.username"
        },
        "type": "property"
      }
    },
    "params.password": {
      "paramDirection": "input",
      "persistent": true
    },
    "params.username": {
      "paramDirection": "input",
      "persistent": true
    }
  },
  "props": {
    "defaultSize": {
      "height": 150,
      "width": 400
    }
  },
  "root": {
    "children": [
      {
        "children": [
          {
            "meta": {
              "name": "label"
            },
            "position": {
              "basis": "100px",
              "shrink": 0
            },
            "propConfig": {
              "props.text": {
                "binding": {
                  "config": {
                    "expression": "translate(\u0027Username\u0027) + \u0027:\u0027"
                  },
                  "type": "expr"
                }
              }
            },
            "type": "ia.display.label"
          },
          {
            "meta": {
              "name": "value"
            },
            "position": {
              "grow": 1
            },
            "propConfig": {
              "props.text": {
                "binding": {
                  "config": {
                    "path": "view.params.username"
                  },
                  "type": "property"
                }
              }
            },
            "type": "ia.display.label"
          }
        ],
        "meta": {
          "name": "username"
        },
        "position": {
          "basis": "45px",
          "shrink": 0
        },
        "type": "ia.container.flex"
      },
      {
        "children": [
          {
            "meta": {
              "name": "label"
            },
            "position": {
              "basis": "100px",
              "shrink": 0
            },
            "propConfig": {
              "props.text": {
                "binding": {
                  "config": {
                    "expression": "translate(\u0027Password\u0027) + \":\""
                  },
                  "type": "expr"
                }
              }
            },
            "type": "ia.display.label"
          },
          {
            "meta": {
              "name": "password"
            },
            "position": {
              "shrink": 0
            },
            "propConfig": {
              "custom.password_visible": {
                "binding": {
                  "config": {
                    "expression": "false"
                  },
                  "type": "expr"
                }
              },
              "props.text": {
                "binding": {
                  "config": {
                    "expression": "if({this.custom.password_visible},\n  {view.params.password}, \n  \u0027********************\u0027\n )"
                  },
                  "type": "expr"
                }
              }
            },
            "props": {
              "style": {
                "marginRight": "20px"
              },
              "textStyle": {
                "fontFamily": "monospace",
                "fontSize": "1.25em"
              }
            },
            "type": "ia.display.label"
          },
          {
            "events": {
              "component": {
                "onActionPerformed": {
                  "config": {
                    "script": "\tcustom_props\u003dself.getSibling(\"password\").custom\n\tcustom_props.password_visible\u003dnot custom_props.password_visible"
                  },
                  "scope": "G",
                  "type": "script"
                }
              }
            },
            "meta": {
              "name": "hide_or_reveal"
            },
            "position": {
              "basis": "80px"
            },
            "propConfig": {
              "props.text": {
                "binding": {
                  "config": {
                    "expression": "if({../password.custom.password_visible},\u0027Hide\u0027,\u0027Reveal\u0027)"
                  },
                  "type": "expr"
                }
              }
            },
            "props": {
              "style": {
                "classes": "Buttons/Small_Button",
                "fontSize": 18
              }
            },
            "type": "ia.input.button"
          }
        ],
        "meta": {
          "name": "password"
        },
        "position": {
          "basis": "45px",
          "shrink": 0
        },
        "type": "ia.container.flex"
      },
      {
        "children": [
          {
            "events": {
              "component": {
                "onActionPerformed": [
                  {
                    "config": {
                      "script": "\t#TODO perform a confirm action and move the regenerate to that instead\n\t#confirm_regenerate_mqtt_password(self.view.custom.mqtt_users[1].username)\n\t\n\tmessageType \u003d \u0027regenerate_mqtt_password\u0027\n\n\t# Create a payload to be passed with the message\n\tpayload \u003d {\u0027username\u0027:self.view.params.username}\n\t \n\t# Send the message, pass the payload, limit the scope to the view\n\tsystem.perspective.sendMessage(messageType, payload, scope \u003d \u0027page\u0027 )"
                    },
                    "enabled": false,
                    "scope": "G",
                    "type": "script"
                  },
                  {
                    "config": {
                      "draggable": true,
                      "id": "vIfnTlET",
                      "modal": false,
                      "overlayDismiss": false,
                      "resizable": true,
                      "showCloseIcon": true,
                      "type": "open",
                      "viewParams": {
                        "event_message_type": "regenerate_mqtt_password",
                        "event_payload": "{view.custom.payload}",
                        "text": "All clients will be disconnected!"
                      },
                      "viewPath": "Popup/Confirm",
                      "viewportBound": false
                    },
                    "scope": "C",
                    "type": "popup"
                  }
                ]
              }
            },
            "meta": {
              "name": "regenerate password"
            },
            "position": {
              "basis": "210px",
              "shrink": 0
            },
            "props": {
              "style": {
                "classes": "Buttons/Small_Button",
                "padding": "0px .5em"
              },
              "text": "Regenerate Password",
              "textStyle": {
                "fontSize": 18
              }
            },
            "type": "ia.input.button"
          },
          {
            "events": {
              "component": {
                "onActionPerformed": {
                  "config": {
                    "draggable": true,
                    "id": "Confirm",
                    "modal": false,
                    "overlayDismiss": false,
                    "resizable": true,
                    "showCloseIcon": true,
                    "type": "open",
                    "viewParams": {
                      "event_message_type": "delete_mqtt_user",
                      "event_payload": "{view.custom.payload}",
                      "text": "All clients will be disconnected!"
                    },
                    "viewPath": "Popup/Confirm",
                    "viewportBound": false
                  },
                  "scope": "C",
                  "type": "popup"
                }
              }
            },
            "meta": {
              "name": "delete user"
            },
            "position": {
              "basis": "125px",
              "shrink": 0
            },
            "props": {
              "style": {
                "classes": "Buttons/Small_Button",
                "fontSize": 18,
                "marginLeft": "45px",
                "padding": "0px .5em"
              },
              "text": "Delete User"
            },
            "type": "ia.input.button"
          }
        ],
        "meta": {
          "name": "actions"
        },
        "position": {
          "basis": "45px",
          "shrink": 0
        },
        "props": {
          "style": {
            "marginTop": "10px"
          }
        },
        "type": "ia.container.flex"
      }
    ],
    "meta": {
      "name": "root"
    },
    "props": {
      "direction": "column"
    },
    "type": "ia.container.flex"
  }
}