<mvc:View
        controllerName="sap.ui.documentation.sdk.controller.LiveEditor"
        xmlns="sap.m"
        xmlns:l="sap.ui.layout"
        xmlns:core="sap.ui.core"
        xmlns:mvc="sap.ui.core.mvc"
        xmlns:custom="sap.ui.documentation"
        xmlns:editor="sap.ui.codeeditor"
        class="liveEditor">
        <Page
		id="liveEditorPage"
		showSubHeader="false"
		showFooter="false"
		showNavButton="true"
        enableScrolling="false"
		title="{i18n>LIVE_EDITOR_TITLE}"
		navButtonPress=".onNavButtonPress">
        <custom:DivContainer class="editorWrapper">
            <custom:DivContainer>
                <IconTabHeader selectedKey="{viewModel>/selectedFileName}" select=".onFileSwitch">
                    <items>
                        <IconTabFilter text="App.view.xml" key="App.view.xml"/>
                        <IconTabFilter text="App.controller.js" key="App.controller.js"/>
                        <IconTabFilter text="index.js" key="index.js"/>
                        <IconTabFilter text="index.html" key="index.html"/>
                    </items>
                </IconTabHeader>
                <custom:DivContainer class="editorSrcWindow">
                    <editor:CodeEditor id="srcEditor"
                                       editable="{= ${viewModel>/selectedFileType} !== 'text' }"
                                       value="{viewModel>/selectedFileContent}"
                                       type="{viewModel>/selectedFileType}"
                                       liveChange=".onSrcLiveChange"/>
                </custom:DivContainer>
            </custom:DivContainer>

            <VBox id="resultBox" class="liveEditorResultBox" width="100%" height="100%">
                <Toolbar style="Clear" class="editorToolbar">
                    <Button text="{i18n>LIVE_EDITOR_PREVIEW_BTN}"
                            press=".requestExecuteCurrentSrc"
                            enabled="{= !${viewModel>/autoPreview}}"/>
                    <CheckBox text="{i18n>LIVE_EDITOR_LIVE_PREVIEW_TEXT}"
                              selected="{viewModel>/autoPreview}"/>
                </Toolbar>
                <core:HTML id="outputWindowWrapper" class="outputWindowWrapper" content="&lt;div class=&quot;outputWindowWrapper&quot;&gt;&lt;/div&gt;">
                    <core:layoutData>
                        <FlexItemData growFactor="1"></FlexItemData>
                    </core:layoutData>
                </core:HTML>
            </VBox>
        </custom:DivContainer>
    </Page>

</mvc:View>