Knah-Tsaeb
/
Minigalnano
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

adds patch for FF-only users

This commit is contained in:
Jan Niggemann 2015-02-23 16:50:51 +01:00
parent 5d295b0ac1
commit 1392dacc3a
2 changed files with 153 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

142
patches/firefox-lightbox-image-autorotation.patch Normal file
View File

@ -0,0 +1,142 @@
From 3fc42c02b31accf49aae8f1b5e4ecc2ac3b7355f Mon Sep 17 00:00:00 2001
From: Jan Niggemann <jn@hz6.de>
Date: Mon, 23 Feb 2015 16:34:25 +0100
Subject: [PATCH 1/2] adds lightbox image autorotation (FF >v26) Firefox
respects the CSS3 property "image-rotation". This makes
the lightbox squared and centeres the browser-rotated
image therein.
---
css/mediaboxBlack.css | 9 ++++++++-
css/mediaboxWhite.css | 9 ++++++++-
js/mediabox1.5.4.js | 16 ++++++++++++++--
3 files changed, 30 insertions(+), 4 deletions(-)
diff --git a/css/mediaboxBlack.css b/css/mediaboxBlack.css
index 9213688..e4e7fde 100644
--- a/css/mediaboxBlack.css
+++ b/css/mediaboxBlack.css
@@ -41,10 +41,17 @@
}
#mbCenter img{
border-radius: 4px;
+ image-orientation: from-image;
+ position: absolute;
+ margin: auto;
+ top: 0;
+ left: 0;
+ right: 0;
+ bottom: 0;
}
#mbCenter.mbLoading {
- background: #000 url(../images/loading-dark.gif) no-repeat center;
+ background: #000 url(../images/loading2.gif) no-repeat center;
/* This style is applied only during animation. */
/* For example, the next lines turn off shadows */
/* improving browser performance on slow systems. */
diff --git a/css/mediaboxWhite.css b/css/mediaboxWhite.css
index de9d439..7a62a90 100644
--- a/css/mediaboxWhite.css
+++ b/css/mediaboxWhite.css
@@ -42,10 +42,17 @@
#mbCenter img{
border-radius: 4px;
+ image-orientation: from-image;
+ position: absolute;
+ margin: auto;
+ top: 0;
+ left: 0;
+ right: 0;
+ bottom: 0;
}
#mbCenter.mbLoading {
- background: #fff url(../images/loading-light.gif) no-repeat center;
+ background: #fff url(../images/WhiteLoading.gif) no-repeat center;
/* This style is applied only during animation. */
/* For example, the next lines turn off shadows */
/* improving browser performance on slow systems. */
diff --git a/js/mediabox1.5.4.js b/js/mediabox1.5.4.js
index 821e599..9e1f04f 100644
--- a/js/mediabox1.5.4.js
+++ b/js/mediabox1.5.4.js
@@ -815,6 +815,16 @@ var Mediabox;
if (mediaType == "img"){
mediaWidth = preload.width;
mediaHeight = preload.height;
+
+ // Hack jn@hz6.de: make lightbox squared to make room for the image (that will be properly rotated by the browser [at least FF since v26])
+ if (mediaWidth >= mediaHeight) {
+ mediaHeight = mediaWidth
+ }
+
+ if (mediaWidth < mediaHeight) {
+ mediaWidth = mediaHeight
+ }
+
if (options.imgBackground) {
media.setStyles({backgroundImage: "url("+URL+")", display: ""});
} else { // Thanks to Dusan Medlin for fixing large 16x9 image errors in a 4x3 browser
@@ -829,7 +839,9 @@ var Mediabox;
}
if (Browser.ie) preload = document.id(preload);
if (options.clickBlock) preload.addEvent('mousedown', function(e){ e.stop(); }).addEvent('contextmenu', function(e){ e.stop(); });
- media.setStyles({backgroundImage: "none", display: ""});
+
+ // Hack jn@hz6.de: Make position relative to work together with centered image (which is absolutely placed)
+ media.setStyles({backgroundImage: "none", display: "", position: "relative"});
preload.inject(media);
}
// mediaWidth += "px";
@@ -973,4 +985,4 @@ Mediabox.scanPage = function() {
});
};
-window.addEvents({domready: Mediabox.scanPage, resize: Mediabox.recenter}); // to recenter the overlay while scrolling, add "scroll: Mediabox.recenter" to the object
\ No newline at end of file
+window.addEvents({domready: Mediabox.scanPage, resize: Mediabox.recenter}); // to recenter the overlay while scrolling, add "scroll: Mediabox.recenter" to the object
--
1.7.10.4
From 7a11265131c002dbef0940d036105e05b07b9311 Mon Sep 17 00:00:00 2001
From: Jan Niggemann <jn@hz6.de>
Date: Mon, 23 Feb 2015 16:39:33 +0100
Subject: [PATCH 2/2] fixes spinner filenames
---
css/mediaboxBlack.css | 2 +-
css/mediaboxWhite.css | 2 +-
2 files changed, 2 insertions(+), 2 deletions(-)
diff --git a/css/mediaboxBlack.css b/css/mediaboxBlack.css
index e4e7fde..95963cd 100644
--- a/css/mediaboxBlack.css
+++ b/css/mediaboxBlack.css
@@ -51,7 +51,7 @@
}
#mbCenter.mbLoading {
- background: #000 url(../images/loading2.gif) no-repeat center;
+ background: #000 url(../images/loading-dark.gif) no-repeat center;
/* This style is applied only during animation. */
/* For example, the next lines turn off shadows */
/* improving browser performance on slow systems. */
diff --git a/css/mediaboxWhite.css b/css/mediaboxWhite.css
index 7a62a90..3d9f2d4 100644
--- a/css/mediaboxWhite.css
+++ b/css/mediaboxWhite.css
@@ -52,7 +52,7 @@
}
#mbCenter.mbLoading {
- background: #fff url(../images/WhiteLoading.gif) no-repeat center;
+ background: #fff url(../images/loading-light.gif) no-repeat center;
/* This style is applied only during animation. */
/* For example, the next lines turn off shadows */
/* improving browser performance on slow systems. */
--
1.7.10.4

11
patches/firefox-lightbox-image-autorotation.readme Normal file
View File

@ -0,0 +1,11 @@
You access your MinigalNano exclusively with firefox >v26 (for example
on your home server)?
If you apply this patch, the images in the lightbox are properly rotated
by the browser itself using the information from the EXIF data.
To fit the images, I made the lightbox squared so there are white
stripes either on the sides or the top and the bottom.
Jan
(jn@hz6.de)