{
    "type": "APL",
    "version": "1.0",
    "theme": "dark",
    "import": [{
            "name": "alexa-viewport-profiles",
            "version": "1.0.0"
        },
        {
            "name": "alexa-layouts",
            "version": "1.0.0"
        }
    ],
    "resources": [
    ],
    "styles": {
        "textStylePressable": {
            "values": [
              {
                "backgroundColor": "#00000080"
              },
              {
                "when": "${state.focused}",
                "backgroundColor": "#3d3d3d80"
              },
              {
                "when": "${state.pressed}",
                "backgroundColor": "#60606080"
              }
            ]
          }
    },
    "layouts": {
        "TouchableBox": {
            "parameters": [
                {}
            ],
            "items": [{
                "type": "TouchWrapper",
                "onPress": {
                    "type": "SendEvent",
                    "arguments": ["${touch}"]
                },
                "items": [{
                    "type": "Container",
                    "direction": "column",
                    "width": "${viewport.width / 3.3}",
                    "height": "${viewport.height / 2.7}",
                    "inheritParentState": true,
                    "paddingRight": 15,
                    "items": [{
                            "type": "Frame",
                            "inheritParentState": true,
                            "style": "textStylePressable",
                            "items": [
                            {}
                    ]
                }]
            }]
        }]
    }
    },
    "mainTemplate": {
        "parameters": [
            "payload"
        ],
        "item": [{
            "type": "Container",
            "direction": "column",
            "width": "100vw",
            "height": "100vh",
            "items": [
                {
                    "type": "Image",
                    "source": "${payload.data.properties.backgroundImage.sources[0].url}",
                    "position": "absolute",
                    "width": "100vw",
                    "height": "100vh",
                    "scale": "best-fill"
                },
                {
                    "type": "Container",
                    "paddingTop": 10,
                    "paddingLeft": 50,
                    "paddingRight": 50,
                    "height": "${viewport.height}",
                    "width": "${viewport.width}",
                    "item": [{
                        "type": "ScrollView",
                        "id": "Scrollarea",
                        "width": "${viewport.width}",
			                  "paddingTop": 15,
                        "height": "100%",
                        "items": [{
                            "type": "Container",
                            "direction": "column",
                            "width": "${viewport.width}",
                            "items": [
                                {
                                    "type": "Container",
                                    "direction": "row",
                                    "width": "${viewport.width}",
                                    "items": [
                                        {
                                            "type": "TouchableBox",
                                            "boxIndex": 0,
                                            "touch": "touchparameter"
                                        },
                                        {
                                            "type": "TouchableBox",
                                            "boxIndex": 1,
                                            "touch": "touchparameter_box1"
                                        },
                                        {
                                            "type": "TouchableBox",
                                            "boxIndex": 2,
                                            "touch": "touchparameter_box2"
                                        }
                                    ]
                                }
                            ]
                        }]
                    }]
                }
            ]
        }]
    }
}