<div class="annotation-list">
    <div ng-repeat="annotation in annotationListCtrl.annotations" ng-init="annotationId=Annotations.getIdByAnnotation(annotation)" class="annotation-list-item" id="{{annotationId}}" ng-style="{'top':(annotation.top||'-200px'),'z-index':annotationListCtrl.getZIndexByAnnotationId(annotationId) , left:annotationListCtrl.getLeftByAnnotationId(annotationId) }">
        <uib-accordion>
            <div uib-accordion-group 
                ng-class="{'annotation-list-item-positive': annotation.sentiment === 1,
                'annotation-list-item-neutral': annotation.sentiment === 0.5,
                'annotation-list-item-negative': annotation.sentiment === 0,
                'annotation-list-item-toggled': annotation.toggled}"
                ng-init="isEditable=false; isDeletable=false;"
                is-open="annotations[$index].toggled">
                <uib-accordion-heading>
                    <div ng-click="annotationListCtrl.setIdOfCurrentAnnotation(annotationId);">
                        {{annotations[$index].isOpen}} {{annotation.uid}}
                    </div>
                    <div class="annotation-badges">
                        <i ng-if="annotationListCtrl.isCreatedByMachine(annotation)" class="fa fa-cogs"></i>
                        <i ng-if="annotationListCtrl.isCreatedByHuman(annotation) || annotationListCtrl.hasAnnotationBeenReviewed(annotation)" class="fa fa-user"></i>
                        <i class="fa fa-warning" style="color: red" ng-if="annotationListCtrl.hasAnnotationIssues(annotation)"></i>
                    </div>

                </uib-accordion-heading>
                <div ng-click="$event.stopPropagation()">
                    <div class="annotation-list-item-text"
                        ng-class="{'annotation-list-item-text-positive': annotation.sentiment === 1,
                        'annotation-list-item-text-neutral': annotation.sentiment === 0.5,
                        'annotation-list-item-text-negative': annotation.sentiment === 0}">
                        <p>
                            <span style="font-weight:600">Expression:</span>
                            {{annotation.text}}
                        </p>
                        <p>
                            <span style="font-weight:600">Aspect:</span>
                            {{annotation.name}}
                        </p>
                        <p>
                            <span style="font-weight:600">Sentiment</span>
                            <span class="annotation-sentiment">{{annotation.sentiment | annotationSentimentFilter}}</span>
                        </p>
                        
                    </div>
                    <ul class="annotation-list-item-actions list-inline">
                        <li ng-click="isEditable = !isEditable; isDeletable = false"
                            class="w-edit-annotation">
                            EDIT
                        </li>
                        <li ng-click="isDeletable = !isDeletable; isEditable = false"
                            class="w-delete-annotation">
                            DELETE
                        </li>
                    </ul>
                    <div class="btn-group sentiment-btn-group"
                        ng-show="isEditable">
                        <button class="btn btn-positive"
                        ng-class="{'btn-positive-active': annotation.sentiment === 1}"
                        ng-click="annotationListCtrl.changeAnnotationSentiment(annotationListCtrl.review, annotation, 1)">
                        +
                        </button>
                        <button class="btn btn-neutral"
                        ng-class="{'btn-neutral-active': annotation.sentiment === 0.5}"
                        ng-click="annotationListCtrl.changeAnnotationSentiment(annotationListCtrl.review, annotation, 0.5)">
                        =
                        </button>
                        <button class="btn btn-negative"
                        ng-class="{'btn-negative-active': annotation.sentiment === 0}"
                        ng-click=" annotationListCtrl.changeAnnotationSentiment(annotationListCtrl.review, annotation, 0)">
                        -
                        </button>
                    </div>
                    <div class="annotation-delete-confirmation" ng-show="isDeletable">
                        <p>Are you sure you want to delete this annotation?</p>
                        <div class="btn-group">
                            <button class="btn w-delete-button-yes" 
                                    ng-click="annotationListCtrl.removeAnnotation(annotationListCtrl.review, annotation)">
                                Yes
                            </button>
                            <button class="btn w-delete-button-no" 
                                    ng-click="isDeletable=false">
                                No
                            </button>
                        </div>
                    </div>
                </div>
            </div uib-accordion-group>
        </uib-accordion>
    </div>
</div> 