Basic structure for the resolved comments dropdown.

This commit is contained in:
Paulo Reis 2017-01-05 17:15:27 +00:00
parent 22db36d21b
commit a1435d13a3
4 changed files with 79 additions and 9 deletions

View file

@ -1,5 +1,9 @@
#review-panel
.review-panel-toolbar
resolved-comments-dropdown(
entries="reviewPanel.entries"
threads="reviewPanel.commentThreads"
)
span.review-panel-toolbar-label(ng-click="editor.wantTrackChanges = true;", ng-if="editor.wantTrackChanges === false") Track Changes is
strong off
span.review-panel-toolbar-label(ng-click="editor.wantTrackChanges = false;", ng-if="editor.wantTrackChanges === true") Track Changes is
@ -118,8 +122,7 @@ script(type='text/ng-template', id='changeEntryTemplate')
span(ng-switch-when="delete") Deleted 
del.rp-content-highlight {{ entry.content }}
.rp-entry-metadata
| {{ entry.metadata.ts | date : 'MMM d, y h:mm a' }}
|  • 
| {{ entry.metadata.ts | date : 'MMM d, y h:mm a' }} • 
span.rp-entry-user(style="color: hsl({{ user.hue }}, 70%, 40%);") {{ user.name }}
.rp-entry-actions
a.rp-entry-button(href, ng-click="onReject();")
@ -142,13 +145,16 @@ script(type='text/ng-template', id='commentEntryTemplate')
)
div
.rp-comment(
ng-repeat="comment in threads[entry.thread_id].messages"
ng-repeat="comment in threads[entry.thread_id].messages track by comment.id"
)
p.rp-comment-content {{ comment.content }}
p.rp-comment-content
span.rp-entry-user(
style="color: hsl({{ comment.user.hue }}, 70%, 40%);"
ng-if="$first || comment.user.id !== threads[entry.thread_id].messages[$index - 1].user.id"
) {{ comment.user.name }}: 
| {{ comment.content }}
.rp-entry-metadata
| {{ comment.timestamp | date : 'MMM d, y h:mm a' }}
|  • 
span.rp-entry-user(style="color: hsl({{ comment.user.hue }}, 70%, 40%);") {{ comment.user.name }}
.rp-comment-reply
textarea.rp-comment-input(
ng-model="entry.replyContent"
@ -163,7 +169,7 @@ script(type='text/ng-template', id='commentEntryTemplate')
//- div {{ threads[entry.thread_id].resolved_at | date : 'MMM d, y h:mm a' }}
.rp-entry-actions
a.rp-entry-button(href, ng-click="onResolve();")
i.fa.fa-check
i.fa.fa-inbox
|  Resolve
a.rp-entry-button(href, ng-click="onReply();")
i.fa.fa-reply
@ -212,4 +218,16 @@ script(type='text/ng-template', id='addCommentEntryTemplate')
|  Cancel
a.rp-entry-button(href, ng-click="submitNewComment()")
i.fa.fa-comment
|  Comment
|  Comment
script(type='text/ng-template', id='resolvedCommentsDropdownTemplate')
.resolved-comments
a.resolved-comments-toggle(
href
ng-click="state.isOpen = !state.isOpen"
)
i.fa.fa-inbox
.resolved-comments-dropdown(
ng-class="{ 'resolved-comments-dropdown-open' : state.isOpen }"
)
div wut

View file

@ -5,6 +5,7 @@ define [
"ide/review-panel/directives/changeEntry"
"ide/review-panel/directives/commentEntry"
"ide/review-panel/directives/addCommentEntry"
"ide/review-panel/directives/resolvedCommentsDropdown"
"ide/review-panel/filters/notEmpty"
"ide/review-panel/filters/orderOverviewEntries"
], () ->

View file

@ -0,0 +1,28 @@
define [
"base"
], (App) ->
App.directive "resolvedCommentsDropdown", () ->
restrict: "E"
templateUrl: "resolvedCommentsDropdownTemplate"
scope:
entries: "="
threads: "="
link: (scope, element, attrs) ->
scope.state =
isOpen: false
scope.resolvedComments = {}
filterResolvedComments = () ->
scope.resolvedComments = {}
for fileId, fileEntries of scope.entries
scope.resolvedComments[fileId] = {}
for entryId, entry of fileEntries
if entry.type == "comment" and scope.threads[entry.thread_id].resolved?
scope.resolvedComments[fileId][entryId] = scope.threads[entry.thread_id]
scope.$watchCollection "entries", filterResolvedComments
scope.$watchCollection "threads", filterResolvedComments

View file

@ -100,7 +100,6 @@
.rp-size-expanded & {
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 5px;
}
.rp-state-current-file & {
@ -120,6 +119,8 @@
.review-panel-toolbar-label {
cursor: pointer;
margin-right: 5px;
text-align: right;
flex-grow: 1;
}
.rp-entry-list {
@ -633,3 +634,25 @@
}
}
.resolved-comments-toggle {
font-size: @rp-icon-large-size;
color: lighten(@rp-type-blue, 25%);
border: solid 1px @rp-border-grey;
border-radius: 3px;
padding: 0 4px;
&:hover,
&:focus {
text-decoration: none;
color: @rp-type-blue;
}
}
.resolved-comments-dropdown {
display: none;
&-open {
display: block;
}
}