<section role="region">
  <header>
  	<a ng-tap="$navigate.back()"><span class="icon icon-back">menu</span></a>
    <menu type="toolbar">
    </menu>
    <h1>{{store.title}}</h1>
  </header>
</section>
<section data-type="sidebar" class="stroreTabs">
    <ul class="button-group tabGroup">
        <li><a ng-tap="switchTab('info')" class="tabBtn">Info</a></li>
        <li><a ng-tap="switchTab('sales')" class="tabBtn">Akcije</a></li>
        <li><a ng-tap="switchTab('map')" class="tabBtn">Mapa</a></li>
    </ul>
</section>
<section data-type="sidebar" class="drawer drawerSmall">
    <div ng-show="section_info">
        <div class="row">
            <div class="large-12 columns pFix">
                <div class="listStore" style="background: url({{store.backgroundImage}}) no-repeat;">
                    <img ng-src="{{store.image}}" alt="{{store.title}}" class="storeLogo">
                </div>
                <div class="large-12 columns">
                    <div class="storeGeneral">
                        <h2 class="storeTitle">{{store.title}}</h2>
                        <span class="storeInfo">Lokacija:<span> Nivo {{store.location}}</span></span>
                        <span class="storeInfo">Lokal:<span> {{store.space}}</span></span>
                        <span class="storeInfo">Radno vrijeme:<span> {{store.hours}}</span></span>
                        
                    </div>
                    <div class="storeDesc" ng-tap="$navigate.go('/desc/{{store.id}}', 'slide')">
                        <span class="descTitle">Opis</span> 
                        <p>{{store.short_description}}</p>
                    </div>
                </div>
            </div>
            <div class="large-12 columns" ng-hide="newsStore.counter == 0">
                <span class="titleSeparator">Vijesti i dešavanja</span>
                <div class="" ng-repeat="newsStore in allStoreNews" ng-tap="$navigate.go('/single/{{newsStore.id}}', 'slide')" >
                    <h2 ng-bind-html-unsafe="newsStore.title"></h2>
                    <span class="category {{newsStore.catClass}}">{{newsStore.category}}</span>
                    <div ng-show="newsStore.category == 'Dešavanja'" class="eventTime">
                        {{newsStore.start_date}} u {{newsStore.time}}
                    </div>
                    <span class="date">{{newsStore.pubDate}}</span>
                    <p ng-bind-html-unsafe="newsStore.short_description"></p>
                </div>
            </div>
        </div>
        
        <div class="row contentHolder container">
            <div class="large-12 columns">
                <span class="titleSeparator2">Slične prodavnice</span>
                <div class="catStore" ng-repeat="store in similarStores">
                    <a ng-tap="$navigate.go('/store/{{store.id}}', 'slide')">
                        <div class="listStore" style="background: url({{store.backgroundImage}}) no-repeat;">
                            <img ng-src="{{store.image}}" alt="{{store.title}}" class="storeLogo">
                        </div>
                        <div class="titleHolder">
                            <span class="catTitle fL">{{store.title}}</span>
                            <span class="catLevel fR">Nivo {{store.location}}</span>
                        </div>
                    </a>
                </div>
            </div>
        </div>
    </div>

    <div ng-show="section_sales" class="salesHolder">
        <div class="large-12 columns" ng-show="sales.length > 0">
            <div class="sale" ng-repeat="sale in sales">
                <a ng-tap="$navigate.go('/store/{{sale.store}}', 'slide')">
                    <span class="percentage {{sale.saleClass}}">od <span class="prct">{{sale.percentage}}%</span></span>
                    <span class="salesTitle" ng-bind-html-unsafe="sale.title"></span>
                    <p ng-bind-html-unsafe="sale.content"></p>
                    <span class="saleDate">{{sale.pubDate}}</span>
                </a>
            </div>
        </div>
        <div class="row container" ng-show="sales.length == 0">
            <div class="large-12 columns container" >
                <span class="noAction">%</span>
                <p class="noActionTxt">Trenutno nema akcija.</p>
            </div>
        </div>

    </div>


    <div ng-show="section_map" class="">
            <div class="large-12 columns container" >
                <div class="storeGeneral">
                    <span class="storeInfo">Lokacija:<span> Nivo {{store.location}}</span></span>
                    <span class="storeInfo">Lokal:<span> {{store.space}}</span></span>
                    <span class="storeInfo">Radno vrijeme:<span> {{store.hours}}</span></span>
                </div>

                <iframe src="http://www.deltacity.me/mobile-map/?id={{store.id}}&app=ffos" frameborder="0"></iframe>

            </div>

    </div>

</section>