Skip to content

Commit

Permalink
Merge pull request #118 from QutBioacoustics/annotation-comments
Browse files Browse the repository at this point in the history 
feat(annotationLibrary) Adding annotation comments on annotation item page
  • Loading branch information
@atruskie
atruskie committed Dec 12, 2014
2 parents 1606036 + b6573cf commit 99c3397
Show file tree
Hide file tree
Showing 11 changed files with 346 additions and 26 deletions.
9 changes: 9 additions & 0 deletions src/app/annotationLibrary/_annotationLibrary.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -57,6 +57,15 @@ $loadGifPath: image-url('load.gif');

.library-single-info {
margin: 0 auto 0 auto;

& .reported {
color: $brand-danger;
margin: 0 $padding-base-horizontal;
}

& .reported-comment {
color: $gray-lighter;
}
}

/* Shared spectrogram and grid */
Expand Down
110 changes: 102 additions & 8 deletions src/app/annotationLibrary/annotationItem.tpl.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -44,20 +44,21 @@ <h3 class="panel-title pull-left">Details</h3>
</div>
<div class="panel-body">
<div class="list-group">
<a ng-repeat="tag in annotation.tags"
ng-href="{{$parent.createFilterUrl({'tagsPartial': tag.text})}}"
<a data-ng-repeat="tag in annotation.tags"
data-ng-href="{{tag.similarPartial}}"
class="list-group-item" title="Tag.">
<span class="glyphicon glyphicon-tags"></span>&nbsp;
<span class="badge">{{tag.typeOfTag.replace('_',' ')}}</span>
<span class="badge" ng-show="tag.retired">retired</span>
<span class="badge" ng-show="tag.isTaxanomic">taxonomic</span>
{{tag.text}} (ID {{tag.id}})
</a>
<a ng-show="annotation.isReference"
ng-href="{{$parent.createFilterUrl({'reference': annotation.isReference})}}"
<a data-ng-show="annotation.isReference"
data-ng-href="{{annotation.urls.isReference}}"

class="list-group-item" title="Reference tag.">
<span class="glyphicon glyphicon-book"></span>&nbsp;
Reference Tag
Reference Annotation
</a>
<a ng-href="{{annotation.urls.listen}}" class="list-group-item" title="Start date.">
<span class="glyphicon glyphicon-record"></span>&nbsp;
Expand All @@ -76,7 +77,12 @@ <h3 class="panel-title pull-left">Details</h3>
<span class="glyphicon glyphicon-map-marker"></span>&nbsp;
Site: {{annotation.siteName}}
</a>
<a ng-href="{{annotation.urls.user}}" target="_self" class="list-group-item" title="User.">
<a data-ng-href="{{annotation.urls.audioRecording}}" class="list-group-item" title="Site name.">
<span class="glyphicon glyphicon-music"></span>&nbsp;
Audio recording: {{annotation.audioRecordingId}}
</a>
<a data-ng-href="{{annotation.urls.user}}" target="_self" class="list-group-item" title="User.">

<span class="glyphicon glyphicon-user"></span>&nbsp;
{{annotation.ownerName }}
</a>
Expand All @@ -92,11 +98,99 @@ <h3 class="panel-title pull-left">Details</h3>
<div class="col-md-6">
<div class="library-single-info panel panel-default">
<div class="panel-heading clearfix">
<h3 class="panel-title pull-left"><span class="glyphicon glyphicon-comment"></span>&nbsp;Comments
<h3 class="panel-title pull-left">
<span class="glyphicon glyphicon-comment"></span>
&nbsp;{{comments.length == 0 ? 'No Comments Yet' : (comments.length == 1 ? '1 Comment' : comments.length + ' Comments') }}
</h3>
</div>
<div class="panel-body">
<em>Coming soon...</em>
<ul class="media-list">
<li class="media">
<a class="pull-left" href="#">
<img class="media-object" src="" alt="">
</a>

<div class="media-body">
<h4 class="media-heading">
{{profile.userName}}
<small title="now">now</small>
</h4>

<form role="form" name="createCommentForm">
<div class="form-group" ng-class="{'has-error': newComment.errors.length > 0}">
<textarea class="form-control" required
placeholder="{{comments.length < 1 ? 'Add a comment' : 'Continue the discussion'}}"
style="width:90%" id="addAnnotationComment"
ng-model="newComment.text"></textarea>
<span class="help-block" ng-show="newComment.errors.length > 0"
ng-repeat="error in newComment.errors">{{error}}</span>
</div>
<div class="form-group">
<button type="submit" class="btn btn-default" ng-click="createComment()">Post
</button>
</div>
</form>

</div>
</li>
</ul>
<ul class="media-list">
<li class="media" ng-repeat="comment in comments"
id="{{comment.id}}">
<a class="pull-left" href="#">
<img class="media-object" src="" alt="">
</a>

<div class="media-body">
<div class="pull-right">
<a href="{{$parent.createCommentLinkUrl(comment.id)}}">link</a>

<ng-switch class="btn-group btn-group-xs"
role="group" on="comment.creatorId == profile.id">
<button ng-switch-when="true" type="button" class="btn btn-default"
ng-click="editComment(comment)">edit</button>
<button ng-switch-when="true" type="button" class="btn btn-default"
ng-click="deleteComment(comment.comment, comment.id)">delete</button>
<button ng-switch-when="false" type="button" class="btn btn-default"
ng-show="!comment.flag"
ng-click="reportComment(comment)">report</button>
</ng-switch>
<span class="reported glyphicon glyphicon-warning-sign"
ng-show="comment.flag"
title="This comment has been reported as inappropriate" ></span>
</div>

<h4 class="media-heading">
{{comment.updater.userName}}
<small title="{{comment.updatedAt}}">
last change {{formatTimeAgo(comment.updatedAt)}}
</small>
</h4>
<p ng-show="!comment.editing" ng-class="{'reported-comment':comment.flag}">
{{comment.comment}}
</p>

<form role="form" name="updateForm" ng-show="comment.editing" >
<div class="form-group" ng-class="{'has-error': editComment.errors.length > 0}">
<textarea class="form-control" required
placeholder="Add a comment / Continue the discussion"
style="width:90%" id="{{'editAnnotationComment'+comment.id}}"
ng-model="comment.comment"></textarea>
<span class="help-block" ng-show="$parent.editComment.errors.length > 0"
ng-repeat="error in $parent.editComment.errors">{{error}}</span>
</div>
<button type="submit" class="btn btn-primary" ng-click="updateComment(comment, updateForm)">
Update
</button>
<button type="submit" class="btn btn-default"
ng-click="comment.editing = false">
cancel
</button>
</form>
</div>
</li>
</ul>

</div>
</div>
</div>
Expand Down
Loading

0 comments on commit 99c3397

Please sign in to comment.