<div ng:controller="PollDetailsController" 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>
                    {{poll.Title}}
                </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">
                <button title="{{$resource('utility.new')}}" class="button lightblue tooltip" ng:click="newQuestion()"><i class="icon icon-plus"></i></button>
            </div>
           
        </div>
        <div class="table table-hover fillh">
            <div>
                <table>
                    <thead>
                       <tr><th><h2>{{$resource('polls.pitanja')}}</h2></th></tr>
                        <tr>
                            <th class="icon"></th>
                            <th>{{$resource('polls.title')}}</th>
                            <th>{{$resource('polls.brojglasova')}}</th>
                            <th>{{$resource('polls.postotak')}}</th>
                            <th></th>
                        </tr>
                    </thead>
                    <tr ng:repeat="question in questions">
                        <td class="icon">
                            <div title="{{question.Status.DisplayName}}" class="circle status-{{question.Status.LowerName}}"><i class="icon-file-alt"></i></div>
                        </td>
                        <td class="title" ng:click="selectQuestion(question.ID)">
                            <div class="inner">
                                <h2>{{question.Title}}</h2>
                            </div>
                        </td>
                        <td>{{question.VoteCount}}</td>
                         <td>{{question.VotePercentage}}</td>
                        <td class="command icon">
                            <a title="{{$resource('utility.options')}}" class="trigger tooltip"><i class="icon-reorder"></i></a>
                            <div qn:popover="{position: {my: 'right top', at: 'left top'}}">
                                <ul>
                                    <li ng:click="editQuestion(question, $index)"><a><i class="icon icon-trash"></i>{{$resource('polls.edit')}}</a></li>
                                    <li ng:click="removeQuestion(question, $index)"><a><i class="icon icon-trash"></i>{{$resource('polls.delete')}}</a></li>
                                    <li><a ng:click="startNewDialog(question)"><i class="icon icon-edit"></i>{{$resource('polls.odgovor')}}</a></li>
                                    <li><a ng:click="idiVote(question)"><i class="icon icon-edit"></i>{{$resource('polls.glasaj')}}</a></li>
                                     <li><a ng:click="grafika(question)"><i class="icon icon-edit"></i>{{$resource('polls.grafikon')}}</a></li>
                                </ul>
                            </div>
                        </td>
                    </tr>
                </table>
               <table ng-show="DisplayAnswer">
                   <tr><th><h2>{{$resource('polls.odgovori')}}</h2></th></tr>
                    <thead>
                        <tr>
                            <th class="icon"></th>
                            <th>{{$resource('polls.title')}}</th>
                            <th>{{$resource('polls.brojglasova')}}</th>
                            <th>{{$resource('polls.postotak')}}</th>
                            <th></th>
                        </tr>
                    </thead>
                    <tr ng:repeat="answer in answers">
                        <td class="icon">
                            <div title="{{question.Status.DisplayName}}" class="circle status-{{question.Status.LowerName}}"><i class="icon-file-alt"></i></div>
                        </td>
                        <td class="title">
                            <div class="inner">
                                <h2>{{answer.Title}}</h2>
                            </div>
                        </td>
                        <td>{{answer.VoteCount}}</td>
                         <td>{{answer.VotePercentage}}</td>
                        <td class="command icon">
                            <a title="{{$resource('utility.options')}}" class="trigger tooltip"><i class="icon-reorder"></i></a>
                            <div qn:popover="{position: {my: 'right top', at: 'left top'}}">
                                <ul>
                                    <li ng:click="removeAnswer(answer, $index)"><a><i class="icon icon-trash"></i>{{$resource('polls.delete')}}</a></li>
                                    <li><a ng:click="startEditDialog(answer)"><i class="icon icon-edit"></i>{{$resource('polls.edit')}}</a></li>
                                </ul>
                            </div>
                        </td>
                    </tr>
                </table>
            </div>
        </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:click="newQuestion()"><a><i class="icon-plus"></i>{{$resource('polls.pitanje')}}</a></li>
            </ul>
        </div>
    </div>      
  <div qn:dialog="ui.dialogNew">
          <input type="hidden" name="ID" value="{{qusion.ID}}" />
          <div class="control-group required">
                    <label class="control-label">{{$resource('polls.title')}}</label>
                    <div class="controls" style="width:350px !important">
                        <input type="text" name="Title" ng:model="answer.Title" required style="width:350px !important" />
                        <div ng:show="errors['answer.Title'][0]" class="error">{{$resource(errors['answer.Title'][0])}}</div>
                    </div>
                </div>
                  <div class="control-group cfix">
                            <label for="NewLabelColor">{{$resource('classifications.color')}}</label>
                            <div class="controls">
                                <input type="text" qn:colorpicker id="NewLabelColor" name="Color" ng:model="answer.Color" />
                            </div>
                 </div>
                <div class="control-group">
                    <label class="control-label"></label>
                    <div class="controls">
                        <button class="button green" ng:click="startNewAnswer()">{{$resource('polls.create')}}</button>
                        <button type="button" class="button" ng:click="cancelEdit()">{{$resource('polls.cancel')}}</button>
                    </div>
             </div>
    </div>
 <div qn:dialog="ui.dialogEdit">
          <input type="hidden" name="ID" value="{{answer.ID}}" />
          <div class="control-group required">
                    <label class="control-label">{{$resource('polls.title')}}</label>
                    <div class="controls" style="width:350px !important">
                        <input type="text" name="Title" ng:model="answer.Title" required style="width:350px !important" />
                        <div ng:show="errors['answer.Title'][0]" class="error">{{$resource(errors['answer.Title'][0])}}</div>
                    </div>
                </div>
                  <div class="control-group cfix">
                            <label for="EditLabelColor">{{$resource('classifications.color')}}</label>
                            <div class="controls">
                                <input type="text" qn:colorpicker id="Text1" name="Color" ng:model="answer.Color" />
                            </div>
                 </div>
                <div class="control-group">
                    <label class="control-label"></label>
                    <div class="controls">
                        <button class="button green" ng:click="EditPublish()">{{$resource('polls.save')}}</button>
                        <button type="button" class="button" ng:click="cancelEdit()">{{$resource('polls.cancel')}}</button>
                    </div>
             </div>
    </div>
</div>