فهرست منبع

Dynamically determine if the files dropdown should drop up or drop down.

Paulo Reis 10 سال پیش
والد
کامیت
88564ea126
2فایلهای تغییر یافته به همراه22 افزوده شده و 2 حذف شده
  1. 6 2
      services/web/app/views/project/editor/pdf.jade
  2. 16 0
      services/web/public/coffee/ide/pdf/controllers/PdfController.coffee

+ 6 - 2
services/web/app/views/project/editor/pdf.jade

@@ -151,12 +151,16 @@ div.full-size.pdf(ng-controller="PdfController")
 				)
 				)
 					i.fa.fa-trash-o
 					i.fa.fa-trash-o
 				|  
 				|  
-				div.dropdown(style="display: inline-block;", dropdown)
+				div.files-dropdown(
+					style="display: inline-block;",
+					ng-class="shouldDropUp ? 'dropup' : 'dropdown'"
+					dropdown
+				)
 					a.btn.btn-default.btn-sm(
 					a.btn.btn-default.btn-sm(
 						href
 						href
 						dropdown-toggle
 						dropdown-toggle
 					)
 					)
-						| !{translate("other_logs_and_files")} 
+						| !{translate("other_logs_and_files")}
 						span.caret
 						span.caret
 					ul.dropdown-menu.dropdown-menu-right
 					ul.dropdown-menu.dropdown-menu-right
 						li(ng-repeat="file in pdf.outputFiles")
 						li(ng-repeat="file in pdf.outputFiles")

+ 16 - 0
services/web/public/coffee/ide/pdf/controllers/PdfController.coffee

@@ -15,6 +15,22 @@ define [
 		$scope.shouldShowLogs = false
 		$scope.shouldShowLogs = false
 		$scope.wikiEnabled = window.wikiEnabled;
 		$scope.wikiEnabled = window.wikiEnabled;
 
 
+		# view logic to check whether the files dropdown should "drop up" or "drop down"
+		$scope.shouldDropUp = false
+
+		logsContainerEl	= document.querySelector ".pdf-logs"
+		filesDropdownEl	= logsContainerEl?.querySelector ".files-dropdown"
+
+		# get the top coordinate of the files dropdown as a ratio (to the logs container height)
+		# logs container supports scrollable content, so it's possible that ratio > 1.
+		getFilesDropdownTopCoordAsRatio = () ->
+			 filesDropdownEl?.getBoundingClientRect().top / logsContainerEl?.getBoundingClientRect().height
+
+		$scope.$watch "shouldShowLogs", (shouldShow) ->
+			if shouldShow
+				$scope.$applyAsync () -> 
+					$scope.shouldDropUp = getFilesDropdownTopCoordAsRatio() > 0.65
+
 		if ace.require("ace/lib/useragent").isMac
 		if ace.require("ace/lib/useragent").isMac
 			$scope.modifierKey = "Cmd"
 			$scope.modifierKey = "Cmd"
 		else
 		else