github/overleaf
1
0
Fork 0
mirror of https://github.com/overleaf/overleaf.git synced 2024-11-21 20:47:08 -05:00
Code Issues Projects Releases Packages Wiki Activity

Determine placement of popover based on width of pdf panel

Browse source
This commit is contained in:
Alasdair Smith 2017-09-28 11:32:38 +01:00
parent 464c7c79d8
commit 2d5a61f5b6
2 changed files with 26 additions and 14 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

21
services/web/app/views/project/editor/editor.pug
View file

@ -95,16 +95,17 @@ div.full-size(
)
include ./pdf
.popover.right.onboarding__autocompile(
div(
ng-controller="AutoCompileOnboardingController"
ng-if="onboarding.autoCompile == 'show'"
)
.arrow
.popover-inner
h3.popover-title Auto Compile
.popover-content
p Try out the new auto compile setting!
img(src="/img/onboarding/autocompile/setting-dropdown.png" width="100%")
p When enabled, your project will be compiled after you finish your sentence.
button.btn.btn-default.btn-block(ng-click="dismiss()")
| Got it
.onboarding__autocompile.popover(ng-class="placement")
.arrow
.popover-inner
h3.popover-title Auto Compile
.popover-content
p Try out the new auto compile setting!
img(src="/img/onboarding/autocompile/setting-dropdown.png" width="100%")
p When enabled, your project will be compiled after you finish your sentence.
button.btn.btn-default.btn-block(ng-click="dismiss()")
| Got it

19
services/web/public/coffee/ide/AutoCompileOnboardingController.coffee
View file

@ -3,11 +3,22 @@ define [
], (App) ->
App.controller "AutoCompileOnboardingController", ($scope) ->
recompileBtn = angular.element('#recompile')
popover = angular.element('.onboarding__autocompile')
{ top, left } = recompileBtn.offset()
angular.element('.onboarding__autocompile').offset({
top: top,
left: left + recompileBtn.width() + 11 # Width of arrow
})
if $scope.ui.pdfWidth < 475
$scope.placement = 'left'
popover.offset({
top: top,
left: left - popover.width() - 11 # Width of arrow
})
else
$scope.placement = 'right'
angular.element('.onboarding__autocompile').offset({
top: top,
left: left + recompileBtn.width() + 11 # Width of arrow
})
$scope.dismiss = () ->
$scope.onboarding.autoCompile = 'dismissed'