|
| 1 | +From 3fc42c02b31accf49aae8f1b5e4ecc2ac3b7355f Mon Sep 17 00:00:00 2001 |
| 2 | +From: Jan Niggemann <jn@hz6.de> |
| 3 | +Date: Mon, 23 Feb 2015 16:34:25 +0100 |
| 4 | +Subject: [PATCH 1/2] adds lightbox image autorotation (FF >v26) Firefox |
| 5 | + respects the CSS3 property "image-rotation". This makes |
| 6 | + the lightbox squared and centeres the browser-rotated |
| 7 | + image therein. |
| 8 | + |
| 9 | +--- |
| 10 | + css/mediaboxBlack.css | 9 ++++++++- |
| 11 | + css/mediaboxWhite.css | 9 ++++++++- |
| 12 | + js/mediabox1.5.4.js | 16 ++++++++++++++-- |
| 13 | + 3 files changed, 30 insertions(+), 4 deletions(-) |
| 14 | + |
| 15 | +diff --git a/css/mediaboxBlack.css b/css/mediaboxBlack.css |
| 16 | +index 9213688..e4e7fde 100644 |
| 17 | +--- a/css/mediaboxBlack.css |
| 18 | ++++ b/css/mediaboxBlack.css |
| 19 | +@@ -41,10 +41,17 @@ |
| 20 | + } |
| 21 | + #mbCenter img{ |
| 22 | + border-radius: 4px; |
| 23 | ++ image-orientation: from-image; |
| 24 | ++ position: absolute; |
| 25 | ++ margin: auto; |
| 26 | ++ top: 0; |
| 27 | ++ left: 0; |
| 28 | ++ right: 0; |
| 29 | ++ bottom: 0; |
| 30 | + } |
| 31 | + |
| 32 | + #mbCenter.mbLoading { |
| 33 | +- background: #000 url(../images/loading-dark.gif) no-repeat center; |
| 34 | ++ background: #000 url(../images/loading2.gif) no-repeat center; |
| 35 | + /* This style is applied only during animation. */ |
| 36 | + /* For example, the next lines turn off shadows */ |
| 37 | + /* improving browser performance on slow systems. */ |
| 38 | +diff --git a/css/mediaboxWhite.css b/css/mediaboxWhite.css |
| 39 | +index de9d439..7a62a90 100644 |
| 40 | +--- a/css/mediaboxWhite.css |
| 41 | ++++ b/css/mediaboxWhite.css |
| 42 | +@@ -42,10 +42,17 @@ |
| 43 | + |
| 44 | + #mbCenter img{ |
| 45 | + border-radius: 4px; |
| 46 | ++ image-orientation: from-image; |
| 47 | ++ position: absolute; |
| 48 | ++ margin: auto; |
| 49 | ++ top: 0; |
| 50 | ++ left: 0; |
| 51 | ++ right: 0; |
| 52 | ++ bottom: 0; |
| 53 | + } |
| 54 | + |
| 55 | + #mbCenter.mbLoading { |
| 56 | +- background: #fff url(../images/loading-light.gif) no-repeat center; |
| 57 | ++ background: #fff url(../images/WhiteLoading.gif) no-repeat center; |
| 58 | + /* This style is applied only during animation. */ |
| 59 | + /* For example, the next lines turn off shadows */ |
| 60 | + /* improving browser performance on slow systems. */ |
| 61 | +diff --git a/js/mediabox1.5.4.js b/js/mediabox1.5.4.js |
| 62 | +index 821e599..9e1f04f 100644 |
| 63 | +--- a/js/mediabox1.5.4.js |
| 64 | ++++ b/js/mediabox1.5.4.js |
| 65 | +@@ -815,6 +815,16 @@ var Mediabox; |
| 66 | + if (mediaType == "img"){ |
| 67 | + mediaWidth = preload.width; |
| 68 | + mediaHeight = preload.height; |
| 69 | ++ |
| 70 | ++ // 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]) |
| 71 | ++ if (mediaWidth >= mediaHeight) { |
| 72 | ++ mediaHeight = mediaWidth |
| 73 | ++ } |
| 74 | ++ |
| 75 | ++ if (mediaWidth < mediaHeight) { |
| 76 | ++ mediaWidth = mediaHeight |
| 77 | ++ } |
| 78 | ++ |
| 79 | + if (options.imgBackground) { |
| 80 | + media.setStyles({backgroundImage: "url("+URL+")", display: ""}); |
| 81 | + } else { // Thanks to Dusan Medlin for fixing large 16x9 image errors in a 4x3 browser |
| 82 | +@@ -829,7 +839,9 @@ var Mediabox; |
| 83 | + } |
| 84 | + if (Browser.ie) preload = document.id(preload); |
| 85 | + if (options.clickBlock) preload.addEvent('mousedown', function(e){ e.stop(); }).addEvent('contextmenu', function(e){ e.stop(); }); |
| 86 | +- media.setStyles({backgroundImage: "none", display: ""}); |
| 87 | ++ |
| 88 | ++ // Hack jn@hz6.de: Make position relative to work together with centered image (which is absolutely placed) |
| 89 | ++ media.setStyles({backgroundImage: "none", display: "", position: "relative"}); |
| 90 | + preload.inject(media); |
| 91 | + } |
| 92 | + // mediaWidth += "px"; |
| 93 | +@@ -973,4 +985,4 @@ Mediabox.scanPage = function() { |
| 94 | + }); |
| 95 | + }; |
| 96 | + |
| 97 | +-window.addEvents({domready: Mediabox.scanPage, resize: Mediabox.recenter}); // to recenter the overlay while scrolling, add "scroll: Mediabox.recenter" to the object |
| 98 | +\ No newline at end of file |
| 99 | ++window.addEvents({domready: Mediabox.scanPage, resize: Mediabox.recenter}); // to recenter the overlay while scrolling, add "scroll: Mediabox.recenter" to the object |
| 100 | +-- |
| 101 | +1.7.10.4 |
| 102 | + |
| 103 | + |
| 104 | +From 7a11265131c002dbef0940d036105e05b07b9311 Mon Sep 17 00:00:00 2001 |
| 105 | +From: Jan Niggemann <jn@hz6.de> |
| 106 | +Date: Mon, 23 Feb 2015 16:39:33 +0100 |
| 107 | +Subject: [PATCH 2/2] fixes spinner filenames |
| 108 | + |
| 109 | +--- |
| 110 | + css/mediaboxBlack.css | 2 +- |
| 111 | + css/mediaboxWhite.css | 2 +- |
| 112 | + 2 files changed, 2 insertions(+), 2 deletions(-) |
| 113 | + |
| 114 | +diff --git a/css/mediaboxBlack.css b/css/mediaboxBlack.css |
| 115 | +index e4e7fde..95963cd 100644 |
| 116 | +--- a/css/mediaboxBlack.css |
| 117 | ++++ b/css/mediaboxBlack.css |
| 118 | +@@ -51,7 +51,7 @@ |
| 119 | + } |
| 120 | + |
| 121 | + #mbCenter.mbLoading { |
| 122 | +- background: #000 url(../images/loading2.gif) no-repeat center; |
| 123 | ++ background: #000 url(../images/loading-dark.gif) no-repeat center; |
| 124 | + /* This style is applied only during animation. */ |
| 125 | + /* For example, the next lines turn off shadows */ |
| 126 | + /* improving browser performance on slow systems. */ |
| 127 | +diff --git a/css/mediaboxWhite.css b/css/mediaboxWhite.css |
| 128 | +index 7a62a90..3d9f2d4 100644 |
| 129 | +--- a/css/mediaboxWhite.css |
| 130 | ++++ b/css/mediaboxWhite.css |
| 131 | +@@ -52,7 +52,7 @@ |
| 132 | + } |
| 133 | + |
| 134 | + #mbCenter.mbLoading { |
| 135 | +- background: #fff url(../images/WhiteLoading.gif) no-repeat center; |
| 136 | ++ background: #fff url(../images/loading-light.gif) no-repeat center; |
| 137 | + /* This style is applied only during animation. */ |
| 138 | + /* For example, the next lines turn off shadows */ |
| 139 | + /* improving browser performance on slow systems. */ |
| 140 | +-- |
| 141 | +1.7.10.4 |
| 142 | + |
0 commit comments