mirror of
https://github.com/overleaf/overleaf.git
synced 2024-11-21 20:47:08 -05:00
Merge pull request #457 from sharelatex/pr-new-add-comment-btn
New "add comment" button
This commit is contained in:
commit
e705118dfe
5 changed files with 80 additions and 37 deletions
|
@ -19,7 +19,8 @@ div.full-size(
|
|||
'rp-size-mini': (!ui.reviewPanelOpen && reviewPanel.hasEntries),\
|
||||
'rp-size-expanded': ui.reviewPanelOpen,\
|
||||
'rp-layout-left': reviewPanel.layoutToLeft,\
|
||||
'rp-loading-threads': reviewPanel.loadingThreads\
|
||||
'rp-loading-threads': reviewPanel.loadingThreads,\
|
||||
'rp-new-comment-ui': reviewPanel.newAddCommentUI\
|
||||
}"
|
||||
)
|
||||
.loading-panel(ng-show="!editor.sharejs_doc || editor.opening")
|
||||
|
|
|
@ -1,10 +1,18 @@
|
|||
#review-panel
|
||||
.rp-in-editor-widgets
|
||||
a.rp-track-changes-indicator(
|
||||
href
|
||||
ng-if="editor.wantTrackChanges"
|
||||
ng-click="toggleReviewPanel();"
|
||||
ng-class="{ 'rp-track-changes-indicator-on-dark' : darkTheme }"
|
||||
) !{translate("track_changes_is_on")}
|
||||
a.rp-add-comment-btn(
|
||||
href
|
||||
ng-if="reviewPanel.newAddCommentUI && reviewPanel.entries[editor.open_doc_id]['add-comment'] != null"
|
||||
ng-click="addNewComment();"
|
||||
)
|
||||
i.fa.fa-comment
|
||||
| #{translate("add_comment")}
|
||||
#review-panel
|
||||
.review-panel-toolbar
|
||||
resolved-comments-dropdown(
|
||||
class="rp-flex-block"
|
||||
|
@ -314,7 +322,7 @@ script(type='text/ng-template', id='resolvedCommentEntryTemplate')
|
|||
script(type='text/ng-template', id='addCommentEntryTemplate')
|
||||
div
|
||||
.rp-entry-callout.rp-entry-callout-add-comment
|
||||
.rp-entry-indicator(
|
||||
.rp-entry-indicator.rp-entry-indicator-add-comment(
|
||||
ng-if="!commentState.adding"
|
||||
ng-click="startNewComment(); onIndicatorClick();"
|
||||
tooltip=translate("add_comment")
|
||||
|
|
|
@ -27,6 +27,10 @@ define [
|
|||
layoutToLeft: false
|
||||
rendererData: {}
|
||||
loadingThreads: false
|
||||
newAddCommentUI: false # Test new UI for adding comments; remove afterwards.
|
||||
|
||||
if window.location.search.match /new-comments=true/
|
||||
$scope.reviewPanel.newAddCommentUI = true
|
||||
|
||||
window.addEventListener "beforeunload", () ->
|
||||
collapsedStates = {}
|
||||
|
@ -163,7 +167,11 @@ define [
|
|||
|
||||
$scope.$watch (() ->
|
||||
entries = $scope.reviewPanel.entries[$scope.editor.open_doc_id] or {}
|
||||
Object.keys(entries).length
|
||||
permEntries = {}
|
||||
for entry, entryData of entries
|
||||
if entry != "add-comment" or !$scope.reviewPanel.newAddCommentUI
|
||||
permEntries[entry] = entryData
|
||||
Object.keys(permEntries).length
|
||||
), (nEntries) ->
|
||||
$scope.reviewPanel.hasEntries = nEntries > 0 and $scope.project.features.trackChangesVisible
|
||||
|
||||
|
@ -323,6 +331,10 @@ define [
|
|||
$scope.$broadcast "change:reject", entry_id
|
||||
event_tracking.sendMB "rp-change-rejected", { view: if $scope.ui.reviewPanelOpen then $scope.reviewPanel.subView else 'mini' }
|
||||
|
||||
$scope.addNewComment = () ->
|
||||
$scope.$broadcast "comment:start_adding"
|
||||
$scope.toggleReviewPanel()
|
||||
|
||||
$scope.startNewComment = () ->
|
||||
$scope.$broadcast "comment:select_line"
|
||||
$timeout () ->
|
||||
|
|
|
@ -8,13 +8,16 @@ define [
|
|||
onStartNew: "&"
|
||||
onSubmit: "&"
|
||||
onCancel: "&"
|
||||
onIndicatorClick: "&"
|
||||
onIndicatorClick: "&"
|
||||
layoutToLeft: "="
|
||||
link: (scope, element, attrs) ->
|
||||
scope.state =
|
||||
isAdding: false
|
||||
content: ""
|
||||
|
||||
scope.$on "comment:start_adding", () ->
|
||||
scope.startNewComment()
|
||||
|
||||
scope.startNewComment = () ->
|
||||
scope.state.isAdding = true
|
||||
scope.onStartNew()
|
||||
|
|
|
@ -194,6 +194,10 @@
|
|||
right: 4px;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.rp-new-comment-ui &-add-comment {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.rp-entry-wrapper {
|
||||
|
@ -445,6 +449,11 @@
|
|||
display: block;
|
||||
padding: 5px 10px;
|
||||
border-radius: 3px;
|
||||
|
||||
.rp-in-editor-widgets & {
|
||||
border-radius: 0;
|
||||
border-bottom-left-radius: 3px;
|
||||
}
|
||||
}
|
||||
|
||||
.rp-new-comment {
|
||||
|
@ -560,6 +569,10 @@
|
|||
border-color: @rp-yellow;
|
||||
}
|
||||
}
|
||||
|
||||
.rp-size-mini.rp-new-comment-ui &-add-comment {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.rp-overview-file-header {
|
||||
|
@ -871,43 +884,49 @@
|
|||
}
|
||||
}
|
||||
|
||||
.rp-track-changes-indicator {
|
||||
display: none;
|
||||
.rp-in-editor-widgets {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: @review-off-width;
|
||||
padding: 5px 10px;
|
||||
background-color: rgba(240, 240, 240, 0.9);
|
||||
color: @rp-type-blue;
|
||||
text-align: center;
|
||||
border-bottom-left-radius: 3px;
|
||||
font-size: 10px;
|
||||
z-index: 2;
|
||||
white-space: nowrap;
|
||||
|
||||
&.rp-track-changes-indicator-on-dark {
|
||||
background-color: rgba(88, 88, 88, .8);
|
||||
color: #FFF;
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
background-color: rgba(88, 88, 88, 1);
|
||||
color: #FFF;
|
||||
}
|
||||
}
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
outline: 0;
|
||||
text-decoration: none;
|
||||
background-color: rgba(240, 240, 240, 1);
|
||||
color: @rp-type-blue;
|
||||
}
|
||||
|
||||
right: 0;
|
||||
font-size: 11px;
|
||||
|
||||
.rp-size-mini & {
|
||||
display: block;
|
||||
right: @review-off-width;
|
||||
}
|
||||
}
|
||||
.rp-track-changes-indicator {
|
||||
display: block;
|
||||
padding: 5px 10px;
|
||||
background-color: rgba(240, 240, 240, 0.9);
|
||||
color: @rp-type-blue;
|
||||
text-align: center;
|
||||
border-bottom-left-radius: 3px;
|
||||
z-index: 2;
|
||||
white-space: nowrap;
|
||||
|
||||
&.rp-track-changes-indicator-on-dark {
|
||||
background-color: rgba(88, 88, 88, .8);
|
||||
color: #FFF;
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
background-color: rgba(88, 88, 88, 1);
|
||||
color: #FFF;
|
||||
}
|
||||
}
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
outline: 0;
|
||||
text-decoration: none;
|
||||
background-color: rgba(240, 240, 240, 1);
|
||||
color: @rp-type-blue;
|
||||
}
|
||||
|
||||
.rp-size-expanded & {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
// Helper class for elements which aren't treated as flex-items by IE10, e.g:
|
||||
// * inline items;
|
||||
|
|
Loading…
Reference in a new issue