<?xml version="1.0" encoding="utf-8" ?> 
<!--********** Copyright 2016 Roku Corp.  All Rights Reserved. **********--> 

<!-- node that renders Grid Screen 
    handles bookmark buttons
    handles start of video playback
 -->
<component name="Search" extends="Group" initialFocus="Keyboard">
    <interface>
        <!-- Grid searched Content Node -->
        <field id="content" type="node" alias="Grid.content" />

        <!-- item selection handler -->
        <field id="itemSelected" type="int" alwaysnotify="true" alias="Grid.itemSelected" onChange="OnItemSelected"/>
		 
        <!-- item focused handler -->
        <field id="itemFocused" type="int" alwaysnotify="true" alias="Grid.itemFocused" onChange="OnItemFocused"/>
		
		<!-- Flag denies search screen close if any children are opened.-->
        <field id="isChildrensVisible" type="bool" alwaysnotify="true" />

        <!-- Interface to focused item (Content Node) -->
        <field id="focusedContent"  type="node"/>
		
		<!-- Returns search string from text editor of keyboard. -->
        <field id="SearchString" type="string" alwaysnotify="true" alias="Keyboard.text" onChange="search"/>
    </interface>
    
    <!-- main handler -->
    <script type="text/brightscript" uri="pkg:/components/Search/Search.brs" />
    
    <children>
    	
    	<MiniKeyboard
	       id="Keyboard"
	       translation="[150, 250]"
	       lowerCase="false"/>
		
		<PosterGrid
			id="Grid"
			translation="[750,250]"
			itemSpacing="[30,10]"
	    	basePosterSize="[203,285]"
	    	caption1NumLines="1"
	    	numColumns="5"
	    	numRows="2"
	    	failedBitmapUri="pkg:/images/no-poster.jpg"
        	loadingBitmapUri="pkg:/images/loading-poster.png">
	       	<!-- <LoadingIndicator
	       		  id="loading"
	       		  imageUri="pkg:/components/LoadingIndicator/loader.png"
			      clockwise="true"
			      spinInterval="2"
			      fadeInterval="0.5"
			      spacing="20"
			      imageWidth="100"
			      text="Loading..."
			      centered="true"
			      translation="[0, 0]"
			      textPadding="10"
			      font="font:SmallBoldSystemFont"
			      backgroundColor="0x551A8B"
			      backgroundOpacity="0"/>-->
        	</PosterGrid>
        	
        <!-- Details Screen with Play button -->
        <DetailsScreen
            id="DetailsScreen"
            visible="false"/>
        <Seasons
	    	id="Seasons"
	    	visible="false"/>
    </children>
</component>