Просмотр исходного кода

Show PDF button in toolbar if file tree is closed in PDF flat view

James Allen 12 лет назад
Родитель
Сommit
6bfefea5cb

+ 3 - 2
services/web/app/views/project/editor/file-tree.jade

@@ -46,14 +46,15 @@ aside#file-tree(ng-controller="FileTreeController").full-size
 		ng-class="{ 'no-toolbar': !permissions.write }"
 		ng-class="{ 'no-toolbar': !permissions.write }"
 	)
 	)
 
 
-		div(ng-show="ui.pdfLayout == 'flat' && (ui.view == 'editor' || ui.view == 'pdf')")
+		div(ng-show="ui.pdfLayout == 'flat' && (ui.view == 'editor' || ui.view == 'pdf' || ui.view == 'file')")
 			ul.list-unstyled.file-tree-list
 			ul.list-unstyled.file-tree-list
 				li(
 				li(
 					ng-class="{ 'selected': ui.view == 'pdf' }"
 					ng-class="{ 'selected': ui.view == 'pdf' }"
+					ng-controller="PdfViewToggleController"
 				)
 				)
 					.entity
 					.entity
 						.entity-name(
 						.entity-name(
-							ng-click="ui.view = 'pdf'"
+							ng-click="togglePdfView()"
 						)
 						)
 							i.fa.fa-fw.toggle
 							i.fa.fa-fw.toggle
 							i.fa.fa-fw.fa-file-pdf-o
 							i.fa.fa-fw.fa-file-pdf-o

+ 11 - 0
services/web/app/views/project/editor/header.jade

@@ -14,6 +14,17 @@ header.toolbar.toolbar-header(ng-cloak, ng-hide="state.loading")
 		tooltip-append-to-body="true"
 		tooltip-append-to-body="true"
 	)
 	)
 		i.fa.fa-fw.fa-level-up
 		i.fa.fa-fw.fa-level-up
+	span(ng-controller="PdfViewToggleController")
+		a(
+			href,
+			ng-show="ui.pdfLayout == 'flat' && fileTreeClosed",
+			tooltip="PDF",
+			tooltip-placement="bottom",
+			tooltip-append-to-body="true",
+			ng-click="togglePdfView()",
+			ng-class="{ 'active': ui.view == 'pdf' }"
+		)
+			i.fa.fa-file-pdf-o
 
 
 	.toolbar-center.project-name(ng-controller="ProjectNameController")
 	.toolbar-center.project-name(ng-controller="ProjectNameController")
 		span.name(
 		span.name(

+ 1 - 0
services/web/public/coffee/ide/pdf/PdfManager.coffee

@@ -1,5 +1,6 @@
 define [
 define [
 	"ide/pdf/controllers/PdfController"
 	"ide/pdf/controllers/PdfController"
+	"ide/pdf/controllers/PdfViewToggleController"
 	"ide/pdf/directives/pdfJs"
 	"ide/pdf/directives/pdfJs"
 ], () ->
 ], () ->
 	class PdfManager
 	class PdfManager

+ 17 - 0
services/web/public/coffee/ide/pdf/controllers/PdfViewToggleController.coffee

@@ -0,0 +1,17 @@
+define [
+	"base"
+], (App) ->
+	App.controller "PdfViewToggleController", ($scope) ->
+		$scope.togglePdfView = () ->
+			if $scope.ui.view == "pdf"
+				$scope.ui.view = "editor"
+			else
+				$scope.ui.view = "pdf"
+		
+		$scope.fileTreeClosed = false		
+		$scope.$on "layout:main:resize", (e, state) ->
+			if state.west.initClosed
+				$scope.fileTreeClosed = true
+			else
+				$scope.fileTreeClosed = false
+			$scope.$apply()

+ 1 - 1
services/web/public/stylesheets/app/editor/file-tree.less

@@ -72,7 +72,7 @@ aside#file-tree {
 					color: @link-color;
 					color: @link-color;
 					border-right: 4px solid @link-color;
 					border-right: 4px solid @link-color;
 					font-weight: bold;
 					font-weight: bold;
-					i.fa-folder-open, i.fa-folder, i.fa-file, i.fa-image {
+					i.fa-folder-open, i.fa-folder, i.fa-file, i.fa-image, i.fa-file-pdf-o {
 						color: @link-color;
 						color: @link-color;
 					}
 					}
 					padding-right: 32px;
 					padding-right: 32px;

+ 0 - 14
services/web/public/stylesheets/app/editor/pdf.less

@@ -74,20 +74,6 @@
 }
 }
 
 
 .pdf .toolbar {
 .pdf .toolbar {
-	.log-btn {
-		&.active, &:active {
-			.label {
-				display: none;
-			}
-			color: white;
-			background-color: @link-color;
-			.box-shadow(inset 0 3px 5px rgba(0, 0, 0, 0.225));
-			&:hover {
-				color: white;
-			}
-		}
-	}
-	
 	.toolbar-right {
 	.toolbar-right {
 		margin-right: @line-height-computed / 2;
 		margin-right: @line-height-computed / 2;
 		a {
 		a {

+ 14 - 2
services/web/public/stylesheets/app/editor/toolbar.less

@@ -16,14 +16,25 @@
 	a:not(.btn) {
 	a:not(.btn) {
 		display: inline-block;
 		display: inline-block;
 		color: @gray-light;
 		color: @gray-light;
-		padding: 5px 12px 6px;
-		margin: 0;
+		padding: 4px 10px 5px;
+		margin: 1px 2px;
 		border-radius: @border-radius-small;
 		border-radius: @border-radius-small;
 		&:hover {
 		&:hover {
 			text-shadow: 0 1px 0 rgba(0, 0, 0, 0.25);
 			text-shadow: 0 1px 0 rgba(0, 0, 0, 0.25);
 			color: @gray-dark;
 			color: @gray-dark;
 			text-decoration: none;
 			text-decoration: none;
 		}
 		}
+		&.active, &:active {
+			.label {
+				display: none;
+			}
+			color: white;
+			background-color: @link-color;
+			.box-shadow(inset 0 3px 5px rgba(0, 0, 0, 0.225));
+			&:hover {
+				color: white;
+			}
+		}
 	}
 	}
 
 
 	.btn-full-height {
 	.btn-full-height {
@@ -81,6 +92,7 @@
 		height: 32px;
 		height: 32px;
 		a {
 		a {
 			padding: 4px 2px 2px;
 			padding: 4px 2px 2px;
+			margin: 0;
 			margin-left: 6px;
 			margin-left: 6px;
 		}
 		}
 		.toolbar-right {
 		.toolbar-right {