<mvc:View
	id="view1"
	height="100%"
	xmlns:mvc="sap.ui.core.mvc"
	xmlns="sap.m"
	xmlns:layout="sap.ui.layout"
	xmlns:semantic="sap.f.semantic"
	controllerName="sap.f.sample.SemanticPage.controller.SemanticPage">

	<semantic:SemanticPage
		id="mySemanticPage"
		headerPinnable="true"
		toggleHeaderOnTitleClick="true"
		preserveHeaderStateOnScroll="false"
		titleAreaShrinkRatio="1:1.6:1.6"
		showFooter="{/showFooter}">

		<!-- Title Heading-->
		<semantic:titleHeading>
			<Title text="{/title}" />
		</semantic:titleHeading>

		<!-- TitleExpanded content-->
		<semantic:titleSnappedContent>
			<Text text="{/titleSnappedContent/text}"/>
		</semantic:titleSnappedContent>

		<!-- TitleSnapped content-->
		<semantic:titleExpandedContent>
			<Text text="{/titleExpandedContent/text}"/>
		</semantic:titleExpandedContent>

		<!-- Header Content -->
		<semantic:headerContent>
			<layout:HorizontalLayout allowWrapping="true">
				<layout:VerticalLayout class="sapUiMediumMarginEnd">
					<ObjectAttribute title="Functional Area" text="{/objectDescription/category}"/>
					<ObjectAttribute title="Cost Center" text="{/objectDescription/center}"/>
					<ObjectAttribute title="Email" text="{/objectDescription/email}"/>
				</layout:VerticalLayout>

				<layout:VerticalLayout>
					<ObjectAttribute title="Availability"/>
					<ObjectStatus text="In Stock" state="{/objectDescription/status}" />
				</layout:VerticalLayout>
			</layout:HorizontalLayout>
		</semantic:headerContent>

		<!-- Content -->
		<semantic:content>
			<Table
				id="idProductsTable"
				inset="false"
				items="{path:'/ProductCollection'}"
				class="sapFSemanticPageAlignContent"
				width="auto">

				<columns>
					<Column>
						<Text text="Name"/>
					</Column>
					<Column minScreenWidth="Tablet" demandPopin="true">
						<Text text="Category"/>
					</Column>
					<Column minScreenWidth="Tablet" demandPopin="true">
						<Text text="SupplierName"/>
					</Column>
				</columns>

				<items>
					<ColumnListItem vAlign="Middle">
						<cells>
							<ObjectIdentifier title="{Name}" text="{ProductId}"/>
							<Text text="{Category}"/>
							<Text text="{SupplierName}"/>
						</cells>
					</ColumnListItem>
				</items>
			</Table>
		</semantic:content>

		<semantic:titleMainAction>
			<semantic:TitleMainAction id="editAction" text="Edit" press="onEdit"/>
		</semantic:titleMainAction>

		 <!--Semantic ShareMenu Buttons-->
		<semantic:discussInJamAction>
			<semantic:DiscussInJamAction />
		</semantic:discussInJamAction>

		<semantic:saveAsTileAction>
			<Button icon= "sap-icon://add-favorite" text="Save as Tile"/>
		</semantic:saveAsTileAction>

		<semantic:sendEmailAction>
			<semantic:SendEmailAction />
		</semantic:sendEmailAction>

		<semantic:sendMessageAction>
			<semantic:SendMessageAction />
		</semantic:sendMessageAction>

		<!-- Semantic Footer Buttons -->
		<semantic:footerMainAction>
			<semantic:FooterMainAction text="Save" press="onSave"/>
		</semantic:footerMainAction>

		<semantic:footerCustomActions>
			<Button id="cancelAction" text="Cancel" press="onCancel"/>
		</semantic:footerCustomActions>

		<semantic:messagesIndicator>
			<semantic:MessagesIndicator press="onMessagesButtonPress"/>
		</semantic:messagesIndicator>

		<semantic:draftIndicator>
			<DraftIndicator state="Saved"/>
		</semantic:draftIndicator>

	</semantic:SemanticPage>
</mvc:View>
