Merge pull request #415 from sharelatex/ja-track-changes

Don't animate review panel entries on toggle and resize
This commit is contained in:
James Allen 2017-02-13 12:17:45 +01:00 committed by GitHub
commit 3334078fe6
4 changed files with 19 additions and 7 deletions

View file

@ -201,7 +201,7 @@ script(type='text/ng-template', id='commentEntryTemplate')
span.rp-entry-user( span.rp-entry-user(
style="color: hsl({{ comment.user.hue }}, 70%, 40%);", style="color: hsl({{ comment.user.hue }}, 70%, 40%);",
) {{ comment.user.name }}:  ) {{ comment.user.name }}: 
| {{ comment.content }} span(ng-bind-html="comment.content | linky:'_blank'")
textarea.rp-comment-input( textarea.rp-comment-input(
expandable-text-area expandable-text-area
ng-if="comment.editing" ng-if="comment.editing"
@ -272,7 +272,7 @@ script(type='text/ng-template', id='resolvedCommentEntryTemplate')
style="color: hsl({{ comment.user.hue }}, 70%, 40%);" style="color: hsl({{ comment.user.hue }}, 70%, 40%);"
ng-if="$first || comment.user.id !== thread.messages[$index - 1].user.id" ng-if="$first || comment.user.id !== thread.messages[$index - 1].user.id"
) {{ comment.user.name }}:  ) {{ comment.user.name }}: 
| {{ comment.content }} span(ng-bind-html="comment.content | linky:'_blank'")
.rp-entry-metadata .rp-entry-metadata
| {{ comment.timestamp | date : 'MMM d, y h:mm a' }} | {{ comment.timestamp | date : 'MMM d, y h:mm a' }}
.rp-comment.rp-comment-resolver .rp-comment.rp-comment-resolver

View file

@ -33,7 +33,7 @@ define [
$scope.$on "layout:pdf:resize", (event, state) -> $scope.$on "layout:pdf:resize", (event, state) ->
$scope.reviewPanel.layoutToLeft = (state.east?.size < 220 || state.east?.initClosed) $scope.reviewPanel.layoutToLeft = (state.east?.size < 220 || state.east?.initClosed)
$scope.$broadcast "review-panel:layout" $scope.$broadcast "review-panel:layout", false
$scope.$on "expandable-text-area:resize", (event) -> $scope.$on "expandable-text-area:resize", (event) ->
$timeout () -> $timeout () ->
@ -154,7 +154,7 @@ define [
return if !reviewPanelOpen? return if !reviewPanelOpen?
$timeout () -> $timeout () ->
$scope.$broadcast "review-panel:toggle" $scope.$broadcast "review-panel:toggle"
$scope.$broadcast "review-panel:layout" $scope.$broadcast "review-panel:layout", false
regenerateTrackChangesId = (doc) -> regenerateTrackChangesId = (doc) ->
old_id = getChangeTracker(doc.doc_id).getIdSeed() old_id = getChangeTracker(doc.doc_id).getIdSeed()

View file

@ -6,7 +6,11 @@ define [
link: (scope, element, attrs) -> link: (scope, element, attrs) ->
previous_focused_entry_index = 0 previous_focused_entry_index = 0
layout = () -> layout = (animate = true) ->
if animate
element.removeClass("no-animate")
else
element.addClass("no-animate")
sl_console.log "LAYOUT" sl_console.log "LAYOUT"
if scope.ui.reviewPanelOpen if scope.ui.reviewPanelOpen
PADDING = 8 PADDING = 8
@ -101,9 +105,9 @@ define [
scope.$applyAsync () -> scope.$applyAsync () ->
layout() layout()
scope.$on "review-panel:layout", () -> scope.$on "review-panel:layout", (e, animate = true) ->
scope.$applyAsync () -> scope.$applyAsync () ->
layout() layout(animate)
scope.$watch "reviewPanel.rendererData.lineHeight", () -> scope.$watch "reviewPanel.rendererData.lineHeight", () ->
layout() layout()

View file

@ -184,6 +184,9 @@
color: #FFF; color: #FFF;
cursor: pointer; cursor: pointer;
transition: top 0.3s, left 0.1s, right 0.1s; transition: top 0.3s, left 0.1s, right 0.1s;
.no-animate & {
transition: none;
}
&-focused { &-focused {
left: 0px; left: 0px;
@ -277,6 +280,9 @@
border-radius: 3px; border-radius: 3px;
background-color: #FFF; background-color: #FFF;
transition: top 0.3s, left 0.1s, right 0.1s; transition: top 0.3s, left 0.1s, right 0.1s;
.no-animate & {
transition: none;
}
&-insert { &-insert {
border-color: @rp-green; border-color: @rp-green;
@ -339,6 +345,7 @@
// We need to set any low-enough flex base size (0px), making it growable (1) and non-shrinkable (0). // We need to set any low-enough flex base size (0px), making it growable (1) and non-shrinkable (0).
// This is needed to ensure that IE makes the element fill the available space. // This is needed to ensure that IE makes the element fill the available space.
flex: 1 0 1px; flex: 1 0 1px;
overflow-x: auto;
.rp-state-overview & { .rp-state-overview & {
margin-left: 0; margin-left: 0;
@ -417,6 +424,7 @@
.rp-comment-content { .rp-comment-content {
margin: 0; margin: 0;
color: @rp-type-darkgrey; color: @rp-type-darkgrey;
overflow-x: auto; // Long words, like links can overflow without this.
} }
.rp-comment-resolver { .rp-comment-resolver {