From 0a265d7e969a0062997d35cbc067872aacf3d60e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Gerg=C5=91=20Tisza?= <tgr.huwiki@gmail.com>
Date: Tue, 17 Jun 2014 21:57:44 +0000
Subject: [PATCH] Fullscreen improvements

- fix sizing error so that the image actually fits the screen
- hide some stuff that didn't work properly in fullscreen anyway
  (commons/survey buttons just exited fullscreen, reuse menu
  did not fade with the metadata panel, view terms link didn't do
  anything)
- move metadata scroller CSS rules into metadata scroller LESS file
- disable invite animation which broke the opacity transition
- move opacity transition to the main metadata panel element;
  remove background-color transition which is pointless since there
  is an opacity transition

Change-Id: Ib26160cc6431ea007dab8441c634d0faf9ee1d0a
---
 resources/mmv/mmv.lightboxinterface.less           | 13 -------------
 resources/mmv/ui/mmv.ui.canvas.js                  | 11 ++++++-----
 resources/mmv/ui/mmv.ui.metadataPanel.less         |  4 ++++
 resources/mmv/ui/mmv.ui.metadataPanelScroller.less |  8 ++++++++
 4 files changed, 18 insertions(+), 18 deletions(-)

diff --git a/resources/mmv/mmv.lightboxinterface.less b/resources/mmv/mmv.lightboxinterface.less
index 4e2a389d2..96591580c 100644
--- a/resources/mmv/mmv.lightboxinterface.less
+++ b/resources/mmv/mmv.lightboxinterface.less
@@ -83,29 +83,16 @@
 		bottom: 0px;
 	}
 
-	.mw-mmv-drag-affordance {
-		display: none;
-	}
-
 	.mw-mmv-post-image,
 	.mw-mmv-controls {
 		@fullscreen-padding: 10px;
 		padding: (@fullscreen-padding / 2) 0;
 		height: (@metadatabar-top-content-height + @fullscreen-padding);
-		background-color: rgba(251, 251, 251, 0);
-		transition: background-color 0.25s;
 		min-height: 0;
-
-		&:hover {
-			background-color: @metadata-background;
-		}
 	}
 
 	.mw-mmv-post-image {
 		position: fixed;
-	}
-
-	.mw-mmv-controls {
 		.opacity(0);
 		transition: opacity 0.25s;
 
diff --git a/resources/mmv/ui/mmv.ui.canvas.js b/resources/mmv/ui/mmv.ui.canvas.js
index fc07b41fa..0d6dc758d 100644
--- a/resources/mmv/ui/mmv.ui.canvas.js
+++ b/resources/mmv/ui/mmv.ui.canvas.js
@@ -287,12 +287,13 @@
 	C.getLightboxImageWidths = function ( image ) {
 		var thumb = image.thumbnail,
 			$window = $( window ),
+			$aboveFold = $( '.mw-mmv-controls' ),
+			isFullscreened = !!$aboveFold.closest( '.jq-fullscreened' ).length,
+			// Don't rely on this.$imageWrapper's sizing because it's fragile.
+			// Depending on what the wrapper contains, its size can be 0 on some browsers.
+			// Therefore, we calculate the available space manually
 			availableWidth = $window.width(),
-			availableHeight = $window.height() - $( '.mw-mmv-controls' ).height();
-
-		// For the above don't rely on this.$imageWrapper's sizing anymore because it's fragile
-		// Depending on what the wrapper contains, its size can be 0 on some browsers.
-		// Therefore, we calculate the available space manually
+			availableHeight =  $window.height() - ( isFullscreened ? 0 : $aboveFold.height() );
 
 		return this.thumbnailWidthCalculator.calculateWidths(
 			availableWidth, availableHeight, thumb.width, thumb.height );
diff --git a/resources/mmv/ui/mmv.ui.metadataPanel.less b/resources/mmv/ui/mmv.ui.metadataPanel.less
index 541b9e242..f979396c9 100644
--- a/resources/mmv/ui/mmv.ui.metadataPanel.less
+++ b/resources/mmv/ui/mmv.ui.metadataPanel.less
@@ -253,6 +253,10 @@
 
 .mw-mmv-permission-link {
 	cursor: pointer;
+
+	.jq-fullscreened & {
+		display: none;
+	}
 }
 
 .mw-mmv-optout-link.pending {
diff --git a/resources/mmv/ui/mmv.ui.metadataPanelScroller.less b/resources/mmv/ui/mmv.ui.metadataPanelScroller.less
index b1f757a87..c439d11e2 100644
--- a/resources/mmv/ui/mmv.ui.metadataPanelScroller.less
+++ b/resources/mmv/ui/mmv.ui.metadataPanelScroller.less
@@ -7,6 +7,10 @@
 	&.invite {
 		.animation( mw-mmv-invite-animation 1s ease 0s 1 normal forwards );
 	}
+
+	.jq-fullscreened & {
+		.animation(none);
+	}
 }
 
 .mw-mmv-appear-animation() {
@@ -69,6 +73,10 @@
 	width: 100%;
 	height: @metadatabar-drag-height;
 	cursor: pointer;
+
+	.jq-fullscreened & {
+		display: none;
+	}
 }
 
 .mw-mmv-drag-icon {