<Page.actionBar>
    <ActionBar title="PrintZ">
      <NavigationButton visibility="collapsed"></NavigationButton>
      <ActionItem (tap)="onLogout()"
        ios.position="right"
        android.position="right"
        text="Sign Out" >
      </ActionItem>
    </ActionBar>
</Page.actionBar>
<TabView #tabView [(ngModel)]="tabSelectedIndex") selectedColor="#FFFFFF" borderBottomColor="#FFFFFF">
  <GridLayout *tabItem="{'title':'List'}" >
     <RadListView [items]="printSpots" pullToRefresh="true" (pullToRefreshInitiated)="onRefresh($event)">
          <template tkListItemTemplate let-item="item">
            <GridLayout class="vitem" columns="auto, *, auto" rows="auto, 25, 2" verticalAlignment="top">
                 <Image [src]="item.photoUrl" rowSpan="2" class="image"></Image>
                 <Label class="name-label" [text]="item.name" col="1"></Label>
                 <Label class="address-label" [text]="item.address" width="auto" col="1" row="1"></Label>
                 <Image col="2" rowSpan="2" marginRight="30" width="38"height="38" [src]="item.statusImageUrl"></Image>
                 <StackLayout class="separator" row="3" col="1" colSpan="2" ></StackLayout>
            </GridLayout>
          </template>
          <ListViewLinearLayout tkListViewLayout scrollDirection="Vertical"></ListViewLinearLayout>
        </RadListView >
  </GridLayout>
  <GridLayout height="100%" rows="auto,*" columns="auto" *tabItem="{'title':'Map'}">
    <MapView #mapView row="0" height='70%' (mapReady)="onMapReady($event)" latitude="50.43",longitude="40.52" zoom="3"></MapView>
    <GridLayout row="1">
        <RadListView [items]="printSpots">
          <template tkListItemTemplate let-item="item" let-index="i">
            <StackLayout class="hitem" orientation="vertical">
                <Border borderRadius="3" borderWidth="1" borderColor="rgba(0, 0, 0, 245)" class="image">
                  <Image [src]="item.photoUrl" width="142" height="110"></Image>
                </Border>
              <Label [text]="item.name" class="label"></Label>
            </StackLayout>
          </template>
          <ListViewLinearLayout tkListViewLayout scrollDirection="Horizontal"></ListViewLinearLayout>
        </RadListView >
    </GridLayout>
  </GridLayout>
  </TabView>