<div ng:controller="KartaDetailsController" class="row-fluid" id="body-main" qn:fillheight>
    <div class="col10">
        <div class="toolbar cfix">
            <div class="toolbar-group">
                <h3>
                    <span class="circle circle-small blue"><span class="icon icon-book"></span></span>
                    {{$resource('karte.title')}}<br />
                    <br />
                </h3>
            </div>
            <div class="toolbar-group">
                <button title="{{$resource('utility.home')}}" class="button tooltip" ng:click="back()"><i class="icon-home"></i></button>
            </div>
            <div class="toolbar-group">
                <button title="{{$resource('utility.reset')}}" class="button tooltip" ng:show="isSearch()" ng:click="reset()"><i class="icon-angle-left"></i></button>
                <button title="{{$resource('utility.refresh')}}" class="button tooltip" ng:click="refresh()"><i class="icon-refresh"></i></button>
            </div>
            <div class="toolbar-group right">
                <span class="info">{{pager.from}}-{{pager.to}} of {{pager.total}}</span>
                <button class="button prev" ng:disabled="!pager.canPrev()" ng:click="pager.prev()"><i class="icon-chevron-left"></i></button>
                <button class="button next" ng:disabled="!pager.canNext()" ng:click="pager.next()"><i class="icon-chevron-right"></i></button>
            </div>
            <div class="toolbar-group left">
                <h3>
                    <label class="control-label">{{$resource('karte.title')}}</label>
                </h3>
            </div>
            <div class="toolbar-group left">
                <select ng:model="Selected">
                    <option value="cms">{{$resource('karte.cms')}}</option>
                    <option value="Trn">{{$resource('karte.trn')}}</option>
                    <option value="Aleksandrovac">{{$resource('karte.aleksandrovac')}}</option>
                    <option value="Slatina">{{$resource('karte.slatina')}}</option>
                </select>
            </div>
        </div>
        <div class="table table-hover fillh">
            <div id="map" style="width: 600px; height: 400px;" draggable="true"></div>
            <div class="form form-horizontal fillh">
                <div class="control-group required">
                    <label class="control-label">{{$resource('karte.title')}}</label>
                    <div class="controls">
                        <input type="text" name="Title" ng:model="karta.Title" style="width: 500px;" required />
                        <div ng:show="errors['karta.Title'][0]" class="error">{{$resource(errors['karta.Title'][0])}}</div>
                    </div>
                </div>
                <div class="control-group">
                    <label class="control-label">{{$resource('karte.latitude')}}</label>
                    <div class="controls">
                        <input type="text" id="latitude" name="Latitude" ng:model="karta.Latitude" />
                        <div ng:show="errors['karta.Latitude'][0]" class="error">{{$resource(errors['karta.Latitude'][0])}}</div>
                    </div>
                </div>
                <div class="control-group">
                    <label class="control-label">{{$resource('karte.longitude')}}</label>
                    <div class="controls">
                        <input type="text" id="longitude" name="Longitude" ng:model="karta.Longitude" />
                        <div ng:show="errors['karta.Longitude'][0]" class="error">{{$resource(errors['karta.Longitude'][0])}}</div>
                    </div>
                </div>
                <div class="control-group required">
                    <label class="control-label">{{$resource('karte.description')}}</label>
                    <div class="controls">
                        <textarea class="span5" rows="3" name="Summary" ng:model="karta.Summary" required></textarea>
                        <div ng:show="errors['karta.Summary'][0]" class="error">{{$resource(errors['karta.Summary'][0])}}</div>
                    </div>
                </div>
                <div class="control-group">
                    <label class="control-label"></label>
                    <div class="controls">
                        <button class="button green" ng:click="create()">{{$resource('karte.create')}}</button>
                        <button type="button" class="button" ng:click="back()">{{$resource('karte.cancel')}}</button>
                    </div>
                </div>
            </div>
            <br />
             <table>
                <thead>
                    <tr>
                        <th ng:click="sort('Title')">{{$resource('karte.title')}}</th>
                        <th ng:click="sort('Latitude', 'Ascending')">{{$resource('karte.latitude')}}</th>
                        <th ng:click="sort('ExpiresOn', 'Ascending')">{{$resource('karte.longitude')}}</th>
                        <th class="command icon">&nbsp;</th>
                    </tr>
                </thead>
                <tbody>
                    <tr ng:repeat="karta in karte | filter : Title">
                        <td class="title">
                            <div class="inner">
                                <h2>{{karta.Title}}</h2>
                            </div>
                        </td>
                         <td class="title">
                            <div class="inner">
                                <h2>{{karta.Latitude}}</h2>
                            </div>
                        </td>
                           <td class="title">
                            <div class="inner">
                                <h2>{{karta.Longitude}}</h2>
                            </div>
                        </td>
                        <td class="command icon">
                            <span title="{{$resource('utility.options')}}" class="trigger tooltip"><i class="icon-reorder"></i></span>
                            <div qn:popover="{position: {my: 'right top', at: 'left top'}}">
                                <ul>
                                    <li><a ng:click="remove(karta)"><i class="icon-trash"></i>{{$resource('karte.delete')}}</a></li>
                                </ul>
                            </div>
                        </td>
                    </tr>
                </tbody>
            </table>
        </div>
    </div>
    <div class="col2 sidebar">
        <div class="toolbar toolbar-strip lightblue cfix">
            <div class="toolbar-group row-fluid">
                <button class="button lightblue col4"><i class="icon-star"></i></button>
                <button class="button lightblue col4"><i class="icon-tag"></i></button>
                <button class="button lightblue col4"><i class="icon-tasks"></i></button>
            </div>
        </div>
        <div class="inner fillh">
            <ul class="nav">
                <!--<li ng:class="{active: isCurrentView('karta')}"><button class="button" ng:click="show('karta')"><i class="icon-file"></i>Postovi</button></li>-->
            </ul>
        </div>
    </div>
</div>
