Version Description
- Updated it to match with the original JetPack plugin updates.
- Added support for mobile and touchscreen devices.
- Increased the size of the close button as many of you requested in the forums.
Download this release
Release Info
| Developer | smub |
| Plugin | |
| Version | 0.4 |
| Comparing to | |
| See all releases | |
Code changes from version 0.3 to 0.4
- jetpack-carousel.css +113 -44
- jetpack-carousel.js +128 -84
- jetpack-carousel.php +12 -11
- readme.txt +8 -2
jetpack-carousel.css
CHANGED
|
@@ -4,12 +4,6 @@
|
|
| 4 |
|
| 5 |
.jp-carousel-overlay {
|
| 6 |
background: #000;
|
| 7 |
-
position: fixed!important;
|
| 8 |
-
}
|
| 9 |
-
|
| 10 |
-
div.jp-carousel-buttons a.jp-carousel-permalink {
|
| 11 |
-
background: url(./images/carousel-link.png) no-repeat;
|
| 12 |
-
background-size: 12px 32px;
|
| 13 |
}
|
| 14 |
|
| 15 |
div.jp-carousel-fadeaway {
|
|
@@ -28,20 +22,11 @@ div.jp-carousel-fadeaway {
|
|
| 28 |
background-size: 200px 126px;
|
| 29 |
}
|
| 30 |
|
| 31 |
-
|
| 32 |
-
|
| 33 |
-
|
| 34 |
-
|
| 35 |
-
|
| 36 |
-
div.jp-carousel-buttons a.jp-carousel-permalink:hover {
|
| 37 |
-
background-position: 2px -14px;
|
| 38 |
-
}
|
| 39 |
-
|
| 40 |
-
@media only screen and (-webkit-min-device-pixel-ratio: 1.5) {
|
| 41 |
-
div.jp-carousel-buttons a.jp-carousel-permalink {
|
| 42 |
-
background-image: url(./images/carousel-link-2x.png);
|
| 43 |
-
background-position: 2px 6px;
|
| 44 |
-
}
|
| 45 |
.jp-carousel-next-button span,
|
| 46 |
.jp-carousel-previous-button span {
|
| 47 |
background-image: url(./images/arrows-2x.png);
|
|
@@ -133,17 +118,19 @@ div.jp-carousel-buttons a.jp-carousel-permalink:hover {
|
|
| 133 |
}
|
| 134 |
|
| 135 |
.jp-carousel-buttons {
|
| 136 |
-
margin
|
| 137 |
-
padding
|
| 138 |
border-bottom:1px solid #222;
|
|
|
|
|
|
|
| 139 |
}
|
| 140 |
|
| 141 |
div.jp-carousel-buttons a {
|
| 142 |
border: none !important;
|
| 143 |
color: #999;
|
| 144 |
-
font: normal
|
| 145 |
letter-spacing: 0 !important;
|
| 146 |
-
padding: 5px 2px 5px
|
| 147 |
text-decoration: none !important;
|
| 148 |
text-shadow: none !important;
|
| 149 |
vertical-align: baseline !important;
|
|
@@ -185,8 +172,10 @@ div.jp-carousel-buttons a:hover {
|
|
| 185 |
|
| 186 |
.jp-carousel-slide img {
|
| 187 |
display: block;
|
| 188 |
-
width: 100
|
| 189 |
-
height: 100
|
|
|
|
|
|
|
| 190 |
background: none !important;
|
| 191 |
border: none !important;
|
| 192 |
padding: 0 !important;
|
|
@@ -210,7 +199,7 @@ div.jp-carousel-buttons a:hover {
|
|
| 210 |
.jp-carousel-close-hint {
|
| 211 |
color: #999;
|
| 212 |
cursor: default;
|
| 213 |
-
font:
|
| 214 |
font-weight: 600 !important;
|
| 215 |
letter-spacing: 0 !important;
|
| 216 |
padding:0.55em 0 0;
|
|
@@ -254,29 +243,31 @@ div.jp-carousel-buttons a:hover {
|
|
| 254 |
|
| 255 |
div.jp-carousel-buttons a.jp-carousel-like,
|
| 256 |
div.jp-carousel-buttons a.jp-carousel-reblog,
|
|
|
|
| 257 |
a.jp-carousel-image-download {
|
| 258 |
-
background: url(./images/carousel-sprite.png
|
| 259 |
-
background-size: 16px
|
| 260 |
}
|
| 261 |
|
| 262 |
-
div.jp-carousel-buttons a.jp-carousel-reblog
|
| 263 |
-
|
|
|
|
| 264 |
}
|
| 265 |
|
| 266 |
div.jp-carousel-buttons a.jp-carousel-reblog.reblogged,
|
| 267 |
div.jp-carousel-buttons a.jp-carousel-like.liked {
|
| 268 |
-
background-color: #
|
| 269 |
padding-right: 8px !important;
|
| 270 |
-
border-radius:
|
| 271 |
-
border-radius:
|
| 272 |
-
-webkit-border-radius:
|
| 273 |
-
-moz-border-radius:
|
| 274 |
-
-ms-border-radius:
|
| 275 |
-
-o-border-radius:
|
| 276 |
}
|
| 277 |
|
| 278 |
div.jp-carousel-buttons a.jp-carousel-reblog.reblogged {
|
| 279 |
-
margin:0
|
| 280 |
}
|
| 281 |
|
| 282 |
|
|
@@ -287,6 +278,11 @@ div.jp-carousel-buttons a.jp-carousel-reblog.reblogged:hover {
|
|
| 287 |
color: #999;
|
| 288 |
}
|
| 289 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 290 |
div.jp-carousel-buttons a.jp-carousel-reblog.reblogged:hover {
|
| 291 |
cursor: default;
|
| 292 |
}
|
|
@@ -312,8 +308,9 @@ only screen and (min--moz-device-pixel-ratio: 1.5),
|
|
| 312 |
only screen and (min-device-pixel-ratio: 1.5) {
|
| 313 |
div.jp-carousel-buttons a.jp-carousel-like,
|
| 314 |
div.jp-carousel-buttons a.jp-carousel-reblog,
|
|
|
|
| 315 |
a.jp-carousel-image-download {
|
| 316 |
-
background-image: url(./images/carousel-sprite-2x.png
|
| 317 |
}
|
| 318 |
}
|
| 319 |
|
|
@@ -485,7 +482,10 @@ div#carousel-reblog-box {
|
|
| 485 |
display: none;
|
| 486 |
}
|
| 487 |
|
| 488 |
-
h1:before,
|
|
|
|
|
|
|
|
|
|
| 489 |
content:none !important;
|
| 490 |
}
|
| 491 |
/** Title and Desc End **/
|
|
@@ -493,12 +493,13 @@ h1:before, h1:after {
|
|
| 493 |
/** Meta Box Start **/
|
| 494 |
.jp-carousel-image-meta {
|
| 495 |
background: #111;
|
| 496 |
-
|
| 497 |
color: #fff;
|
| 498 |
font-size: 13px;
|
| 499 |
font: 12px/1.4 "Helvetica Neue", sans-serif !important;
|
|
|
|
|
|
|
| 500 |
width: 209px !important;
|
| 501 |
-
border: 1px solid #222;
|
| 502 |
}
|
| 503 |
|
| 504 |
.jp-carousel-image-meta li,
|
|
@@ -633,6 +634,8 @@ a.jp-carousel-image-download:hover {
|
|
| 633 |
width:auto;
|
| 634 |
display: inline;
|
| 635 |
float:none;
|
|
|
|
|
|
|
| 636 |
}
|
| 637 |
|
| 638 |
.jp-carousel-comment .comment-author a {
|
|
@@ -646,6 +649,7 @@ a.jp-carousel-image-download:hover {
|
|
| 646 |
.jp-carousel-comment .comment-content {
|
| 647 |
border:none;
|
| 648 |
margin-left:85px;
|
|
|
|
| 649 |
}
|
| 650 |
|
| 651 |
.jp-carousel-comment .avatar {
|
|
@@ -879,7 +883,8 @@ textarea#jp-carousel-comment-form-comment-field:focus::-webkit-input-placeholder
|
|
| 879 |
}
|
| 880 |
|
| 881 |
.jp-carousel-light .jp-carousel-buttons {
|
| 882 |
-
border-bottom-color: #
|
|
|
|
| 883 |
}
|
| 884 |
|
| 885 |
.jp-carousel-light div.jp-carousel-buttons a:hover {
|
|
@@ -899,6 +904,10 @@ textarea#jp-carousel-comment-form-comment-field:focus::-webkit-input-placeholder
|
|
| 899 |
color: #fff;
|
| 900 |
}
|
| 901 |
|
|
|
|
|
|
|
|
|
|
|
|
|
| 902 |
.jp-carousel-light div.jp-carousel-buttons a.jp-carousel-like,
|
| 903 |
.jp-carousel-light div.jp-carousel-buttons a.jp-carousel-like:hover {
|
| 904 |
background-position: 5px -15px;
|
|
@@ -1034,3 +1043,63 @@ textarea#jp-carousel-comment-form-comment-field:focus::-webkit-input-placeholder
|
|
| 1034 |
background: -moz-linear-gradient(bottom, rgba(255,255,255,0.75), rgba(255,255,255,0));
|
| 1035 |
background: -webkit-gradient(linear, left bottom, left top, from(rgba(255,255,255,0.75)), to(rgba(255,255,255,0)));
|
| 1036 |
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 4 |
|
| 5 |
.jp-carousel-overlay {
|
| 6 |
background: #000;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 7 |
}
|
| 8 |
|
| 9 |
div.jp-carousel-fadeaway {
|
| 22 |
background-size: 200px 126px;
|
| 23 |
}
|
| 24 |
|
| 25 |
+
@media
|
| 26 |
+
only screen and (-webkit-min-device-pixel-ratio: 1.5),
|
| 27 |
+
only screen and (-o-min-device-pixel-ratio: 3/2),
|
| 28 |
+
only screen and (min--moz-device-pixel-ratio: 1.5),
|
| 29 |
+
only screen and (min-device-pixel-ratio: 1.5) {
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 30 |
.jp-carousel-next-button span,
|
| 31 |
.jp-carousel-previous-button span {
|
| 32 |
background-image: url(./images/arrows-2x.png);
|
| 118 |
}
|
| 119 |
|
| 120 |
.jp-carousel-buttons {
|
| 121 |
+
margin:-18px -20px 15px;
|
| 122 |
+
padding:8px 10px;
|
| 123 |
border-bottom:1px solid #222;
|
| 124 |
+
background: #222;
|
| 125 |
+
text-align: center;
|
| 126 |
}
|
| 127 |
|
| 128 |
div.jp-carousel-buttons a {
|
| 129 |
border: none !important;
|
| 130 |
color: #999;
|
| 131 |
+
font: normal 11px/1.2em "Helvetica Neue", sans-serif !important;
|
| 132 |
letter-spacing: 0 !important;
|
| 133 |
+
padding: 5px 2px 5px 0;
|
| 134 |
text-decoration: none !important;
|
| 135 |
text-shadow: none !important;
|
| 136 |
vertical-align: baseline !important;
|
| 172 |
|
| 173 |
.jp-carousel-slide img {
|
| 174 |
display: block;
|
| 175 |
+
width: 100% !important;
|
| 176 |
+
height: 100% !important;
|
| 177 |
+
max-width: 100% !important;
|
| 178 |
+
max-height: 100% !important;
|
| 179 |
background: none !important;
|
| 180 |
border: none !important;
|
| 181 |
padding: 0 !important;
|
| 199 |
.jp-carousel-close-hint {
|
| 200 |
color: #999;
|
| 201 |
cursor: default;
|
| 202 |
+
font: 24px/1 "Helvetica Neue", sans-serif !important;
|
| 203 |
font-weight: 600 !important;
|
| 204 |
letter-spacing: 0 !important;
|
| 205 |
padding:0.55em 0 0;
|
| 243 |
|
| 244 |
div.jp-carousel-buttons a.jp-carousel-like,
|
| 245 |
div.jp-carousel-buttons a.jp-carousel-reblog,
|
| 246 |
+
div.jp-carousel-buttons a.jp-carousel-commentlink,
|
| 247 |
a.jp-carousel-image-download {
|
| 248 |
+
background: url(./images/carousel-sprite.png) no-repeat;
|
| 249 |
+
background-size: 16px 160px;
|
| 250 |
}
|
| 251 |
|
| 252 |
+
div.jp-carousel-buttons a.jp-carousel-reblog,
|
| 253 |
+
div.jp-carousel-buttons a.jp-carousel-commentlink {
|
| 254 |
+
margin:0 14px 0 0 !important;
|
| 255 |
}
|
| 256 |
|
| 257 |
div.jp-carousel-buttons a.jp-carousel-reblog.reblogged,
|
| 258 |
div.jp-carousel-buttons a.jp-carousel-like.liked {
|
| 259 |
+
background-color: #303030;
|
| 260 |
padding-right: 8px !important;
|
| 261 |
+
border-radius: 2px;
|
| 262 |
+
border-radius:2px;
|
| 263 |
+
-webkit-border-radius:2px;
|
| 264 |
+
-moz-border-radius:2px;
|
| 265 |
+
-ms-border-radius:2px;
|
| 266 |
+
-o-border-radius:2px;
|
| 267 |
}
|
| 268 |
|
| 269 |
div.jp-carousel-buttons a.jp-carousel-reblog.reblogged {
|
| 270 |
+
margin:0 2px 0 -12px !important;
|
| 271 |
}
|
| 272 |
|
| 273 |
|
| 278 |
color: #999;
|
| 279 |
}
|
| 280 |
|
| 281 |
+
div.jp-carousel-buttons a.jp-carousel-commentlink {
|
| 282 |
+
background-position: 0px -116px;
|
| 283 |
+
padding-left: 19px !important;
|
| 284 |
+
}
|
| 285 |
+
|
| 286 |
div.jp-carousel-buttons a.jp-carousel-reblog.reblogged:hover {
|
| 287 |
cursor: default;
|
| 288 |
}
|
| 308 |
only screen and (min-device-pixel-ratio: 1.5) {
|
| 309 |
div.jp-carousel-buttons a.jp-carousel-like,
|
| 310 |
div.jp-carousel-buttons a.jp-carousel-reblog,
|
| 311 |
+
div.jp-carousel-buttons a.jp-carousel-commentlink,
|
| 312 |
a.jp-carousel-image-download {
|
| 313 |
+
background-image: url(./images/carousel-sprite-2x.png);
|
| 314 |
}
|
| 315 |
}
|
| 316 |
|
| 482 |
display: none;
|
| 483 |
}
|
| 484 |
|
| 485 |
+
.jp-carousel-photo-info h1:before,
|
| 486 |
+
.jp-carousel-photo-info h1:after,
|
| 487 |
+
.jp-carousel-left-column-wrapper h1:before,
|
| 488 |
+
.jp-carousel-left-column-wrapper h1:after {
|
| 489 |
content:none !important;
|
| 490 |
}
|
| 491 |
/** Title and Desc End **/
|
| 493 |
/** Meta Box Start **/
|
| 494 |
.jp-carousel-image-meta {
|
| 495 |
background: #111;
|
| 496 |
+
border: 1px solid #222;
|
| 497 |
color: #fff;
|
| 498 |
font-size: 13px;
|
| 499 |
font: 12px/1.4 "Helvetica Neue", sans-serif !important;
|
| 500 |
+
overflow: hidden;
|
| 501 |
+
padding: 18px 20px;
|
| 502 |
width: 209px !important;
|
|
|
|
| 503 |
}
|
| 504 |
|
| 505 |
.jp-carousel-image-meta li,
|
| 634 |
width:auto;
|
| 635 |
display: inline;
|
| 636 |
float:none;
|
| 637 |
+
border:none;
|
| 638 |
+
margin:0;
|
| 639 |
}
|
| 640 |
|
| 641 |
.jp-carousel-comment .comment-author a {
|
| 649 |
.jp-carousel-comment .comment-content {
|
| 650 |
border:none;
|
| 651 |
margin-left:85px;
|
| 652 |
+
padding: 0;
|
| 653 |
}
|
| 654 |
|
| 655 |
.jp-carousel-comment .avatar {
|
| 883 |
}
|
| 884 |
|
| 885 |
.jp-carousel-light .jp-carousel-buttons {
|
| 886 |
+
border-bottom-color: #f0f0f0;
|
| 887 |
+
background: #f5f5f5;
|
| 888 |
}
|
| 889 |
|
| 890 |
.jp-carousel-light div.jp-carousel-buttons a:hover {
|
| 904 |
color: #fff;
|
| 905 |
}
|
| 906 |
|
| 907 |
+
.jp-carousel-light div.jp-carousel-buttons a.jp-carousel-commentlink {
|
| 908 |
+
background-position: 0px -136px;
|
| 909 |
+
}
|
| 910 |
+
|
| 911 |
.jp-carousel-light div.jp-carousel-buttons a.jp-carousel-like,
|
| 912 |
.jp-carousel-light div.jp-carousel-buttons a.jp-carousel-like:hover {
|
| 913 |
background-position: 5px -15px;
|
| 1043 |
background: -moz-linear-gradient(bottom, rgba(255,255,255,0.75), rgba(255,255,255,0));
|
| 1044 |
background: -webkit-gradient(linear, left bottom, left top, from(rgba(255,255,255,0.75)), to(rgba(255,255,255,0)));
|
| 1045 |
}
|
| 1046 |
+
|
| 1047 |
+
/* Small screens */
|
| 1048 |
+
@media only screen and (max-width: 760px) {
|
| 1049 |
+
|
| 1050 |
+
.jp-carousel-info {
|
| 1051 |
+
margin: 0 10px !important;
|
| 1052 |
+
}
|
| 1053 |
+
|
| 1054 |
+
.jp-carousel-next-button, .jp-carousel-previous-button {
|
| 1055 |
+
display: none !important;
|
| 1056 |
+
}
|
| 1057 |
+
|
| 1058 |
+
.jp-carousel-buttons {
|
| 1059 |
+
display: none !important;
|
| 1060 |
+
}
|
| 1061 |
+
|
| 1062 |
+
.jp-carousel-image-meta {
|
| 1063 |
+
float: none !important;
|
| 1064 |
+
width: 100% !important;
|
| 1065 |
+
-moz-box-sizing:border-box;
|
| 1066 |
+
-webkit-box-sizing:border-box;
|
| 1067 |
+
box-sizing: border-box;
|
| 1068 |
+
}
|
| 1069 |
+
|
| 1070 |
+
.jp-carousel-close-hint {
|
| 1071 |
+
font-weight: 800 !important;
|
| 1072 |
+
font-size: 26px !important;
|
| 1073 |
+
position: fixed !important;
|
| 1074 |
+
top: -10px;
|
| 1075 |
+
}
|
| 1076 |
+
|
| 1077 |
+
.jp-carousel-slide img {
|
| 1078 |
+
filter: alpha(opacity=100);
|
| 1079 |
+
opacity: 1;
|
| 1080 |
+
}
|
| 1081 |
+
|
| 1082 |
+
.jp-carousel-wrap {
|
| 1083 |
+
background-color: #000;
|
| 1084 |
+
}
|
| 1085 |
+
|
| 1086 |
+
.jp-carousel-fadeaway {
|
| 1087 |
+
display: none;
|
| 1088 |
+
}
|
| 1089 |
+
|
| 1090 |
+
#jp-carousel-comment-form-container {
|
| 1091 |
+
display: none !important;
|
| 1092 |
+
}
|
| 1093 |
+
|
| 1094 |
+
.jp-carousel-titleanddesc {
|
| 1095 |
+
padding-top: 0 !important;
|
| 1096 |
+
border: none !important;
|
| 1097 |
+
}
|
| 1098 |
+
.jp-carousel-titleanddesc-title {
|
| 1099 |
+
font-size: 1em !important;
|
| 1100 |
+
}
|
| 1101 |
+
|
| 1102 |
+
.jp-carousel-left-column-wrapper {
|
| 1103 |
+
padding: 0;
|
| 1104 |
+
}
|
| 1105 |
+
}
|
jetpack-carousel.js
CHANGED
|
@@ -4,7 +4,12 @@ jQuery(document).ready(function($) {
|
|
| 4 |
// gallery faded layer and container elements
|
| 5 |
var overlay, comments, gallery, container, nextButton, previousButton, info, title,
|
| 6 |
caption, resizeTimeout, mouseTimeout, photo_info, close_hint, commentInterval, buttons,
|
| 7 |
-
screenPadding = 110, originalOverflow = $('body').css('overflow'), proportion = 85;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 8 |
|
| 9 |
var keyListener = function(e){
|
| 10 |
switch(e.which){
|
|
@@ -62,7 +67,8 @@ jQuery(document).ready(function($) {
|
|
| 62 |
'left' : 0
|
| 63 |
});
|
| 64 |
|
| 65 |
-
buttons
|
|
|
|
| 66 |
|
| 67 |
caption = $('<h2></h2>');
|
| 68 |
photo_info = $('<div class="jp-carousel-photo-info"></div>').append(caption);
|
|
@@ -133,6 +139,9 @@ jQuery(document).ready(function($) {
|
|
| 133 |
else if ( $.browser.msie )
|
| 134 |
leftWidth -= 20;
|
| 135 |
leftWidth += 'px';
|
|
|
|
|
|
|
|
|
|
| 136 |
|
| 137 |
leftColWrapper = $('<div></div>')
|
| 138 |
.addClass('jp-carousel-left-column-wrapper')
|
|
@@ -146,7 +155,7 @@ jQuery(document).ready(function($) {
|
|
| 146 |
|
| 147 |
fadeaway = $('<div></div>')
|
| 148 |
.addClass('jp-carousel-fadeaway');
|
| 149 |
-
|
| 150 |
info = $('<div></div>')
|
| 151 |
.addClass('jp-carousel-info')
|
| 152 |
.css({
|
|
@@ -157,6 +166,11 @@ jQuery(document).ready(function($) {
|
|
| 157 |
.append(photo_info)
|
| 158 |
.append(imageMeta)
|
| 159 |
.append(leftColWrapper);
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 160 |
|
| 161 |
targetBottomPos = ( $(window).height() - parseInt( info.css('top'), 10 ) ) + 'px';
|
| 162 |
|
|
@@ -238,6 +252,13 @@ jQuery(document).ready(function($) {
|
|
| 238 |
|
| 239 |
if ( target.is(gallery) || target.parents().add(target).is(close_hint) ) {
|
| 240 |
container.jp_carousel('close');
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 241 |
} else if ( target.parents('#jp-carousel-comment-form-container').length ) {
|
| 242 |
var textarea = $('#jp-carousel-comment-form-comment-field')
|
| 243 |
.blur(function(){
|
|
@@ -350,6 +371,14 @@ jQuery(document).ready(function($) {
|
|
| 350 |
document.location.hash = '';
|
| 351 |
$(window).scrollTop(scroll);
|
| 352 |
});
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 353 |
|
| 354 |
nextButton.add(previousButton).click(function(e){
|
| 355 |
e.preventDefault();
|
|
@@ -366,7 +395,7 @@ jQuery(document).ready(function($) {
|
|
| 366 |
var methods = {
|
| 367 |
open: function(options) {
|
| 368 |
var settings = {
|
| 369 |
-
'items_selector' : ".gallery-item [data-attachment-id]",
|
| 370 |
'start_index': 0
|
| 371 |
},
|
| 372 |
data = $(this).data('carousel-extra');
|
|
@@ -465,29 +494,21 @@ jQuery(document).ready(function($) {
|
|
| 465 |
gallery.jp_carousel('selectedSlide').removeClass('selected').css({'position': 'fixed'});
|
| 466 |
if (reverse !== true ) {
|
| 467 |
last = slides.last();
|
| 468 |
-
slides.first().nextAll().not(last).
|
| 469 |
-
last.
|
| 470 |
-
|
| 471 |
-
|
| 472 |
-
last.prev().css({
|
| 473 |
-
'left' : -last.width() - last.prev().width()
|
| 474 |
-
});
|
| 475 |
-
slides.first().css({'left':gallery.width()});
|
| 476 |
setTimeout(function(){
|
| 477 |
gallery.jp_carousel('selectSlide', slides.show().first());
|
| 478 |
}, 400);
|
| 479 |
|
| 480 |
} else {
|
| 481 |
first = slides.first();
|
| 482 |
-
first.
|
| 483 |
-
|
| 484 |
-
|
| 485 |
-
|
| 486 |
-
|
| 487 |
-
});
|
| 488 |
-
first.next().nextAll().hide().css({'left':-slides.last().width()});
|
| 489 |
-
slides.last().css({'left':-slides.last().width()});
|
| 490 |
-
slides.last().prevAll().not(first, first.next()).hide().css({'left':-slides.last().width()-slides.last().prev().width()});
|
| 491 |
setTimeout(function(){
|
| 492 |
gallery.jp_carousel('selectSlide', slides.show().last());
|
| 493 |
}, 400);
|
|
@@ -498,6 +519,16 @@ jQuery(document).ready(function($) {
|
|
| 498 |
selectedSlide : function(){
|
| 499 |
return this.find('.selected');
|
| 500 |
},
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 501 |
|
| 502 |
selectSlide : function(slide, animate){
|
| 503 |
var last = this.find('.selected').removeClass('selected'),
|
|
@@ -526,7 +557,7 @@ jQuery(document).ready(function($) {
|
|
| 526 |
// slide the whole view to the x we want
|
| 527 |
slides.not(animated).hide();
|
| 528 |
|
| 529 |
-
current
|
| 530 |
|
| 531 |
// minimum width
|
| 532 |
gallery.jp_carousel('fitInfo', animate);
|
|
@@ -534,45 +565,43 @@ jQuery(document).ready(function($) {
|
|
| 534 |
// prep the slides
|
| 535 |
var direction = last.is(current.prevAll()) ? 1 : -1;
|
| 536 |
if ( 1 == direction ) {
|
| 537 |
-
next_next.
|
| 538 |
-
next.hide().
|
| 539 |
-
previous_previous.
|
| 540 |
} else {
|
| 541 |
-
previous.
|
| 542 |
-
next_next.
|
| 543 |
}
|
| 544 |
|
| 545 |
// if advancing prepare the slide that will enter the screen
|
| 546 |
-
previous
|
| 547 |
-
next
|
| 548 |
|
| 549 |
-
|
| 550 |
-
|
| 551 |
-
|
| 552 |
-
container.trigger('jp_carousel.selectSlide', [current]);
|
| 553 |
|
| 554 |
-
|
| 555 |
-
|
| 556 |
-
|
| 557 |
-
|
| 558 |
-
|
| 559 |
-
|
| 560 |
-
|
| 561 |
-
|
| 562 |
-
|
| 563 |
-
|
| 564 |
-
|
| 565 |
-
|
| 566 |
-
|
| 567 |
-
|
| 568 |
-
|
| 569 |
-
|
| 570 |
-
|
| 571 |
-
|
| 572 |
-
|
| 573 |
-
|
| 574 |
-
|
| 575 |
-
}, 600 );
|
| 576 |
|
| 577 |
},
|
| 578 |
|
|
@@ -587,7 +616,7 @@ jQuery(document).ready(function($) {
|
|
| 587 |
};
|
| 588 |
},
|
| 589 |
|
| 590 |
-
loadSlide : function(){
|
| 591 |
return this.each(function(){
|
| 592 |
var slide = $(this);
|
| 593 |
slide.find('img')
|
|
@@ -636,6 +665,12 @@ jQuery(document).ready(function($) {
|
|
| 636 |
'left' : (info.width() - size.width) * 0.5,
|
| 637 |
'width' : size.width
|
| 638 |
});
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 639 |
return this;
|
| 640 |
},
|
| 641 |
|
|
@@ -660,29 +695,16 @@ jQuery(document).ready(function($) {
|
|
| 660 |
method = 'css',
|
| 661 |
max = gallery.jp_carousel('slideDimensions');
|
| 662 |
|
| 663 |
-
|
| 664 |
-
dimensions.left = $(window).width();
|
| 665 |
-
} else if ($this.is(selected)) {
|
| 666 |
-
dimensions.left = ($(window).width() - dimensions.width) * 0.5;
|
| 667 |
-
} else if ($this.is(selected.next())) {
|
| 668 |
-
dimensions.left = gallery.width() - ( screenPadding * 0.75 );
|
| 669 |
-
} else if ($this.is(selected.prev())) {
|
| 670 |
-
dimensions.left = -dimensions.width + screenPadding * 0.75;
|
| 671 |
-
} else {
|
| 672 |
-
if ($this.is(selected.nextAll())) {
|
| 673 |
-
dimensions.left = $(window).width();
|
| 674 |
-
} else {
|
| 675 |
-
dimensions.left = -dimensions.width;
|
| 676 |
-
}
|
| 677 |
-
}
|
| 678 |
dimensions.top = ( (max.height - dimensions.height) * 0.5 ) + 40;
|
| 679 |
$this[method](dimensions);
|
| 680 |
});
|
| 681 |
},
|
| 682 |
|
| 683 |
texturize : function(text) {
|
| 684 |
-
text = text.replace(
|
| 685 |
-
text = text.replace(
|
|
|
|
| 686 |
return $.trim(text);
|
| 687 |
},
|
| 688 |
|
|
@@ -705,7 +727,9 @@ jQuery(document).ready(function($) {
|
|
| 705 |
src = gallery.jp_carousel('selectBestImageSize', {
|
| 706 |
orig_file : src,
|
| 707 |
orig_width : orig_size.width,
|
|
|
|
| 708 |
max_width : max.width,
|
|
|
|
| 709 |
medium_file : medium_file,
|
| 710 |
large_file : large_file
|
| 711 |
});
|
|
@@ -728,9 +752,14 @@ jQuery(document).ready(function($) {
|
|
| 728 |
title = src_item.attr('title') || '',
|
| 729 |
description = src_item.data('image-description') || '',
|
| 730 |
caption = src_item.parents('dl').find('dd.gallery-caption').html() || '',
|
| 731 |
-
src
|
| 732 |
medium_file = src_item.data('medium-file') || '',
|
| 733 |
-
large_file = src_item.data('large-file') || ''
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 734 |
|
| 735 |
if ( !attachment_id || !orig_size )
|
| 736 |
return false; // break the loop if we are missing the data-* attributes
|
|
@@ -758,6 +787,7 @@ jQuery(document).ready(function($) {
|
|
| 758 |
.data('image-meta', image_meta)
|
| 759 |
.data('medium-file', medium_file)
|
| 760 |
.data('large-file', large_file)
|
|
|
|
| 761 |
.jp_carousel('fitSlide', false);
|
| 762 |
|
| 763 |
|
|
@@ -783,18 +813,22 @@ jQuery(document).ready(function($) {
|
|
| 783 |
var medium_size = args.medium_file.replace(/^https?:\/\/.+-([\d]+x[\d]+)\..+$/, '$1'),
|
| 784 |
medium_size_parts = (medium_size != args.medium_file) ? medium_size.split('x') : [args.orig_width, 0],
|
| 785 |
medium_width = parseInt( medium_size_parts[0], 10 ),
|
|
|
|
| 786 |
large_size = args.large_file.replace(/^https?:\/\/.+-([\d]+x[\d]+)\..+$/, '$1'),
|
| 787 |
large_size_parts = (large_size != args.large_file) ? large_size.split('x') : [args.orig_width, 0],
|
| 788 |
-
large_width = parseInt( large_size_parts[0], 10 )
|
|
|
|
| 789 |
|
| 790 |
// Give devices with a higher devicePixelRatio higher-res images (Retina display = 2, Android phones = 1.5, etc)
|
| 791 |
-
if ('undefined' != typeof window.devicePixelRatio && window.devicePixelRatio > 1)
|
| 792 |
-
args.max_width
|
|
|
|
|
|
|
| 793 |
|
| 794 |
-
if ( medium_width >= args.max_width )
|
| 795 |
return args.medium_file;
|
| 796 |
|
| 797 |
-
if ( large_width >= args.max_width )
|
| 798 |
return args.large_file;
|
| 799 |
|
| 800 |
return args.orig_file;
|
|
@@ -926,6 +960,8 @@ jQuery(document).ready(function($) {
|
|
| 926 |
$ul.append( '<li><h5>' + jetpackCarouselStrings[key] + '</h5>' + val + '</li>' );
|
| 927 |
});
|
| 928 |
|
|
|
|
|
|
|
| 929 |
|
| 930 |
$( 'div.jp-carousel-image-meta', 'div.jp-carousel-wrap' )
|
| 931 |
.append( $ul );
|
|
@@ -934,7 +970,7 @@ jQuery(document).ready(function($) {
|
|
| 934 |
getFullSizeLink: function(current) {
|
| 935 |
if(!current || !current.data)
|
| 936 |
return false;
|
| 937 |
-
var original = current.data('
|
| 938 |
origSize = current.data('orig-size').split(','),
|
| 939 |
permalink = $( '<a>'+gallery.jp_carousel('format', {'text': jetpackCarouselStrings.download_original, 'replacements': origSize})+'</a>' )
|
| 940 |
.addClass( 'jp-carousel-image-download' )
|
|
@@ -977,8 +1013,10 @@ jQuery(document).ready(function($) {
|
|
| 977 |
|
| 978 |
testCommentsOpened: function( opened ) {
|
| 979 |
if ( 1 == parseInt( opened, 10 ) ) {
|
|
|
|
| 980 |
commentForm.fadeIn('fast');
|
| 981 |
} else {
|
|
|
|
| 982 |
commentForm.fadeOut('fast');
|
| 983 |
}
|
| 984 |
},
|
|
@@ -1114,15 +1152,17 @@ jQuery(document).ready(function($) {
|
|
| 1114 |
};
|
| 1115 |
|
| 1116 |
// register the event listener for staring the gallery
|
| 1117 |
-
$( document.body ).on( 'click', 'div.gallery', function(e) {
|
|
|
|
|
|
|
| 1118 |
e.preventDefault();
|
| 1119 |
-
$(this).jp_carousel('open', {start_index: $(this).find('.gallery-item').index($(e.target).parents('.gallery-item'))});
|
| 1120 |
});
|
| 1121 |
|
| 1122 |
// start on page load if hash exists
|
| 1123 |
if ( document.location.hash && document.location.hash.match(/jp-carousel-(\d+)/) ) {
|
| 1124 |
$(document).ready(function(){
|
| 1125 |
-
var gallery = $('div.gallery'), index = -1, n = document.location.hash.match(/jp-carousel-(\d+)/);
|
| 1126 |
|
| 1127 |
n = parseInt(n[1], 10);
|
| 1128 |
|
|
@@ -1138,3 +1178,7 @@ jQuery(document).ready(function($) {
|
|
| 1138 |
});
|
| 1139 |
}
|
| 1140 |
});
|
|
|
|
|
|
|
|
|
|
|
|
| 4 |
// gallery faded layer and container elements
|
| 5 |
var overlay, comments, gallery, container, nextButton, previousButton, info, title,
|
| 6 |
caption, resizeTimeout, mouseTimeout, photo_info, close_hint, commentInterval, buttons,
|
| 7 |
+
screenPadding = 110, originalOverflow = $('body').css('overflow'), proportion = 85, isMobile;
|
| 8 |
+
|
| 9 |
+
isMobile = /Android|iPhone|iPod/i.test(navigator.userAgent);
|
| 10 |
+
|
| 11 |
+
if (isMobile)
|
| 12 |
+
screenPadding = 0;
|
| 13 |
|
| 14 |
var keyListener = function(e){
|
| 15 |
switch(e.which){
|
| 67 |
'left' : 0
|
| 68 |
});
|
| 69 |
|
| 70 |
+
buttons = '<a class="jp-carousel-commentlink" href="#">' + jetpackCarouselStrings.comment + '</a>';
|
| 71 |
+
buttons = $('<div class="jp-carousel-buttons">' + buttons + '</div>');
|
| 72 |
|
| 73 |
caption = $('<h2></h2>');
|
| 74 |
photo_info = $('<div class="jp-carousel-photo-info"></div>').append(caption);
|
| 139 |
else if ( $.browser.msie )
|
| 140 |
leftWidth -= 20;
|
| 141 |
leftWidth += 'px';
|
| 142 |
+
|
| 143 |
+
if (isMobile)
|
| 144 |
+
leftWidth = '100%';
|
| 145 |
|
| 146 |
leftColWrapper = $('<div></div>')
|
| 147 |
.addClass('jp-carousel-left-column-wrapper')
|
| 155 |
|
| 156 |
fadeaway = $('<div></div>')
|
| 157 |
.addClass('jp-carousel-fadeaway');
|
| 158 |
+
|
| 159 |
info = $('<div></div>')
|
| 160 |
.addClass('jp-carousel-info')
|
| 161 |
.css({
|
| 166 |
.append(photo_info)
|
| 167 |
.append(imageMeta)
|
| 168 |
.append(leftColWrapper);
|
| 169 |
+
|
| 170 |
+
if (isMobile)
|
| 171 |
+
info.prepend(leftColWrapper);
|
| 172 |
+
else
|
| 173 |
+
info.append(leftColWrapper);
|
| 174 |
|
| 175 |
targetBottomPos = ( $(window).height() - parseInt( info.css('top'), 10 ) ) + 'px';
|
| 176 |
|
| 252 |
|
| 253 |
if ( target.is(gallery) || target.parents().add(target).is(close_hint) ) {
|
| 254 |
container.jp_carousel('close');
|
| 255 |
+
} else if ( target.hasClass('jp-carousel-commentlink') ) {
|
| 256 |
+
e.preventDefault();
|
| 257 |
+
e.stopPropagation();
|
| 258 |
+
$(window).unbind('keydown', keyListener);
|
| 259 |
+
container.animate({scrollTop: parseInt(info.position()['top'], 10)}, 'fast');
|
| 260 |
+
$('#jp-carousel-comment-form-submit-and-info-wrapper').slideDown('fast');
|
| 261 |
+
$('#jp-carousel-comment-form-comment-field').focus();
|
| 262 |
} else if ( target.parents('#jp-carousel-comment-form-container').length ) {
|
| 263 |
var textarea = $('#jp-carousel-comment-form-comment-field')
|
| 264 |
.blur(function(){
|
| 371 |
document.location.hash = '';
|
| 372 |
$(window).scrollTop(scroll);
|
| 373 |
});
|
| 374 |
+
|
| 375 |
+
$('.jp-carousel').touchwipe({
|
| 376 |
+
wipeLeft: function() { gallery.jp_carousel('next'); },
|
| 377 |
+
wipeRight: function() { gallery.jp_carousel('previous'); },
|
| 378 |
+
min_move_x: 20,
|
| 379 |
+
min_move_y: 20,
|
| 380 |
+
preventDefaultEvents: true
|
| 381 |
+
});
|
| 382 |
|
| 383 |
nextButton.add(previousButton).click(function(e){
|
| 384 |
e.preventDefault();
|
| 395 |
var methods = {
|
| 396 |
open: function(options) {
|
| 397 |
var settings = {
|
| 398 |
+
'items_selector' : ".gallery-item [data-attachment-id], .tiled-gallery-item [data-attachment-id]",
|
| 399 |
'start_index': 0
|
| 400 |
},
|
| 401 |
data = $(this).data('carousel-extra');
|
| 494 |
gallery.jp_carousel('selectedSlide').removeClass('selected').css({'position': 'fixed'});
|
| 495 |
if (reverse !== true ) {
|
| 496 |
last = slides.last();
|
| 497 |
+
slides.first().nextAll().not(last).jp_carousel('setSlidePosition', gallery.width()+slides.first().width()).hide();
|
| 498 |
+
last.jp_carousel('setSlidePosition', -last.width());
|
| 499 |
+
last.prev().jp_carousel('setSlidePosition', -last.width() - last.prev().width());
|
| 500 |
+
slides.first().jp_carousel('setSlidePosition', gallery.width());
|
|
|
|
|
|
|
|
|
|
|
|
|
| 501 |
setTimeout(function(){
|
| 502 |
gallery.jp_carousel('selectSlide', slides.show().first());
|
| 503 |
}, 400);
|
| 504 |
|
| 505 |
} else {
|
| 506 |
first = slides.first();
|
| 507 |
+
first.jp_carousel('setSlidePosition', gallery.width());
|
| 508 |
+
first.next().jp_carousel('setSlidePosition', gallery.width() + first.width());
|
| 509 |
+
first.next().nextAll().hide().jp_carousel('setSlidePosition', -slides.last().width());
|
| 510 |
+
slides.last().jp_carousel('setSlidePosition', -slides.last().width());
|
| 511 |
+
slides.last().prevAll().not(first, first.next()).hide().jp_carousel('setSlidePosition', -slides.last().width()-slides.last().prev().width());
|
|
|
|
|
|
|
|
|
|
|
|
|
| 512 |
setTimeout(function(){
|
| 513 |
gallery.jp_carousel('selectSlide', slides.show().last());
|
| 514 |
}, 400);
|
| 519 |
selectedSlide : function(){
|
| 520 |
return this.find('.selected');
|
| 521 |
},
|
| 522 |
+
|
| 523 |
+
setSlidePosition : function(x) {
|
| 524 |
+
return this.css({
|
| 525 |
+
'-webkit-transform':'translate3d(' + x + 'px,0,0)',
|
| 526 |
+
'-moz-transform':'translate3d(' + x + 'px,0,0)',
|
| 527 |
+
'-ms-transform':'translate(' + x + 'px,0)',
|
| 528 |
+
'-o-transform':'translate(' + x + 'px,0)',
|
| 529 |
+
'transform':'translate3d(' + x + 'px,0,0)'
|
| 530 |
+
});
|
| 531 |
+
},
|
| 532 |
|
| 533 |
selectSlide : function(slide, animate){
|
| 534 |
var last = this.find('.selected').removeClass('selected'),
|
| 557 |
// slide the whole view to the x we want
|
| 558 |
slides.not(animated).hide();
|
| 559 |
|
| 560 |
+
current.jp_carousel('setSlidePosition', left).show();
|
| 561 |
|
| 562 |
// minimum width
|
| 563 |
gallery.jp_carousel('fitInfo', animate);
|
| 565 |
// prep the slides
|
| 566 |
var direction = last.is(current.prevAll()) ? 1 : -1;
|
| 567 |
if ( 1 == direction ) {
|
| 568 |
+
next_next.jp_carousel('setSlidePosition', gallery.width() + next.width()).show();
|
| 569 |
+
next.hide().jp_carousel('setSlidePosition', gallery.width() + current.width()).show();
|
| 570 |
+
previous_previous.jp_carousel('setSlidePosition', -previous_previous.width() - current.width()).show();
|
| 571 |
} else {
|
| 572 |
+
previous.jp_carousel('setSlidePosition', -previous.width() - current.width()).show();
|
| 573 |
+
next_next.jp_carousel('setSlidePosition', gallery.width() + current.width()).show();
|
| 574 |
}
|
| 575 |
|
| 576 |
// if advancing prepare the slide that will enter the screen
|
| 577 |
+
previous.jp_carousel('setSlidePosition', -previous.width() + (screenPadding * 0.75)).show();
|
| 578 |
+
next.jp_carousel('setSlidePosition', gallery.width() - (screenPadding * 0.75)).show();
|
| 579 |
|
| 580 |
+
document.location.href = document.location.href.replace(/#.*/, '') + '#jp-carousel-' + current.data('attachment-id');
|
| 581 |
+
gallery.jp_carousel('resetButtons', current);
|
| 582 |
+
container.trigger('jp_carousel.selectSlide', [current]);
|
|
|
|
| 583 |
|
| 584 |
+
$( 'div.jp-carousel-image-meta', 'div.jp-carousel-wrap' ).html('');
|
| 585 |
+
|
| 586 |
+
gallery.jp_carousel('getTitleDesc', { title: current.data('title'), desc: current.data('desc') } );
|
| 587 |
+
gallery.jp_carousel('getMeta', current.data('image-meta'));
|
| 588 |
+
gallery.jp_carousel('getFullSizeLink', current);
|
| 589 |
+
gallery.jp_carousel('getMap', current.data('image-meta'));
|
| 590 |
+
gallery.jp_carousel('testCommentsOpened', current.data('comments-opened'));
|
| 591 |
+
gallery.jp_carousel('getComments', {'attachment_id': current.data('attachment-id'), 'offset': 0, 'clear': true});
|
| 592 |
+
|
| 593 |
+
$('#jp-carousel-comment-post-results').slideUp();
|
| 594 |
+
|
| 595 |
+
// $('<div />').html(sometext).text() is a trick to go to HTML to plain text (including HTML emntities decode, etc)
|
| 596 |
+
if ( current.data('caption') ) {
|
| 597 |
+
if ( $('<div />').html(current.data('caption')).text() == $('<div />').html(current.data('title')).text() )
|
| 598 |
+
$('.jp-carousel-titleanddesc-title').fadeOut('fast').empty();
|
| 599 |
+
if ( $('<div />').html(current.data('caption')).text() == $('<div />').html(current.data('desc')).text() )
|
| 600 |
+
$('.jp-carousel-titleanddesc-desc').fadeOut('fast').empty();
|
| 601 |
+
caption.html( current.data('caption') ).fadeIn('slow');
|
| 602 |
+
} else {
|
| 603 |
+
caption.fadeOut('fast').empty();
|
| 604 |
+
}
|
|
|
|
| 605 |
|
| 606 |
},
|
| 607 |
|
| 616 |
};
|
| 617 |
},
|
| 618 |
|
| 619 |
+
loadSlide : function() {
|
| 620 |
return this.each(function(){
|
| 621 |
var slide = $(this);
|
| 622 |
slide.find('img')
|
| 665 |
'left' : (info.width() - size.width) * 0.5,
|
| 666 |
'width' : size.width
|
| 667 |
});
|
| 668 |
+
|
| 669 |
+
if (isMobile){
|
| 670 |
+
photo_info.css('left', '0px');
|
| 671 |
+
photo_info.css('top', '-20px');
|
| 672 |
+
}
|
| 673 |
+
|
| 674 |
return this;
|
| 675 |
},
|
| 676 |
|
| 695 |
method = 'css',
|
| 696 |
max = gallery.jp_carousel('slideDimensions');
|
| 697 |
|
| 698 |
+
dimensions.left = 0;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 699 |
dimensions.top = ( (max.height - dimensions.height) * 0.5 ) + 40;
|
| 700 |
$this[method](dimensions);
|
| 701 |
});
|
| 702 |
},
|
| 703 |
|
| 704 |
texturize : function(text) {
|
| 705 |
+
text = text.replace(/'/g, '’').replace(/'/g, '’').replace(/[\u2019]/g, '’');
|
| 706 |
+
text = text.replace(/"/g, '”').replace(/"/g, '”').replace(/"/g, '”').replace(/[\u201D]/g, '”');
|
| 707 |
+
text = text.replace(/([\w]+)=&#[\d]+;(.+?)&#[\d]+;/g, '$1="$2"'); // untexturize allowed HTML tags params double-quotes
|
| 708 |
return $.trim(text);
|
| 709 |
},
|
| 710 |
|
| 727 |
src = gallery.jp_carousel('selectBestImageSize', {
|
| 728 |
orig_file : src,
|
| 729 |
orig_width : orig_size.width,
|
| 730 |
+
orig_height : orig_size.height,
|
| 731 |
max_width : max.width,
|
| 732 |
+
max_height : max.height,
|
| 733 |
medium_file : medium_file,
|
| 734 |
large_file : large_file
|
| 735 |
});
|
| 752 |
title = src_item.attr('title') || '',
|
| 753 |
description = src_item.data('image-description') || '',
|
| 754 |
caption = src_item.parents('dl').find('dd.gallery-caption').html() || '',
|
| 755 |
+
src = src_item.data('gallery-src') || '',
|
| 756 |
medium_file = src_item.data('medium-file') || '',
|
| 757 |
+
large_file = src_item.data('large-file') || '',
|
| 758 |
+
orig_file = src_item.data('orig-file') || '';
|
| 759 |
+
|
| 760 |
+
var tiledCaption = src_item.parents('div.tiled-gallery-item').find('div.tiled-gallery-caption').html();
|
| 761 |
+
if ( tiledCaption )
|
| 762 |
+
caption = tiledCaption;
|
| 763 |
|
| 764 |
if ( !attachment_id || !orig_size )
|
| 765 |
return false; // break the loop if we are missing the data-* attributes
|
| 787 |
.data('image-meta', image_meta)
|
| 788 |
.data('medium-file', medium_file)
|
| 789 |
.data('large-file', large_file)
|
| 790 |
+
.data('orig-file', orig_file)
|
| 791 |
.jp_carousel('fitSlide', false);
|
| 792 |
|
| 793 |
|
| 813 |
var medium_size = args.medium_file.replace(/^https?:\/\/.+-([\d]+x[\d]+)\..+$/, '$1'),
|
| 814 |
medium_size_parts = (medium_size != args.medium_file) ? medium_size.split('x') : [args.orig_width, 0],
|
| 815 |
medium_width = parseInt( medium_size_parts[0], 10 ),
|
| 816 |
+
medium_height = parseInt( medium_size_parts[1], 10 ),
|
| 817 |
large_size = args.large_file.replace(/^https?:\/\/.+-([\d]+x[\d]+)\..+$/, '$1'),
|
| 818 |
large_size_parts = (large_size != args.large_file) ? large_size.split('x') : [args.orig_width, 0],
|
| 819 |
+
large_width = parseInt( large_size_parts[0], 10 ),
|
| 820 |
+
large_height = parseInt( large_size_parts[1], 10 );
|
| 821 |
|
| 822 |
// Give devices with a higher devicePixelRatio higher-res images (Retina display = 2, Android phones = 1.5, etc)
|
| 823 |
+
if ('undefined' != typeof window.devicePixelRatio && window.devicePixelRatio > 1) {
|
| 824 |
+
args.max_width = args.max_width * window.devicePixelRatio;
|
| 825 |
+
args.max_height = args.max_height * window.devicePixelRatio;
|
| 826 |
+
}
|
| 827 |
|
| 828 |
+
if ( medium_width >= args.max_width || medium_height >= args.max_height )
|
| 829 |
return args.medium_file;
|
| 830 |
|
| 831 |
+
if ( large_width >= args.max_width || large_height >= args.max_height )
|
| 832 |
return args.large_file;
|
| 833 |
|
| 834 |
return args.orig_file;
|
| 960 |
$ul.append( '<li><h5>' + jetpackCarouselStrings[key] + '</h5>' + val + '</li>' );
|
| 961 |
});
|
| 962 |
|
| 963 |
+
$( 'div.jp-carousel-image-meta', 'div.jp-carousel-wrap' )
|
| 964 |
+
.append( $( buttons ) );
|
| 965 |
|
| 966 |
$( 'div.jp-carousel-image-meta', 'div.jp-carousel-wrap' )
|
| 967 |
.append( $ul );
|
| 970 |
getFullSizeLink: function(current) {
|
| 971 |
if(!current || !current.data)
|
| 972 |
return false;
|
| 973 |
+
var original = current.data('orig-file').replace(/\?.+$/, ''),
|
| 974 |
origSize = current.data('orig-size').split(','),
|
| 975 |
permalink = $( '<a>'+gallery.jp_carousel('format', {'text': jetpackCarouselStrings.download_original, 'replacements': origSize})+'</a>' )
|
| 976 |
.addClass( 'jp-carousel-image-download' )
|
| 1013 |
|
| 1014 |
testCommentsOpened: function( opened ) {
|
| 1015 |
if ( 1 == parseInt( opened, 10 ) ) {
|
| 1016 |
+
$('.jp-carousel-buttons').fadeIn('fast');
|
| 1017 |
commentForm.fadeIn('fast');
|
| 1018 |
} else {
|
| 1019 |
+
$('.jp-carousel-buttons').fadeOut('fast');
|
| 1020 |
commentForm.fadeOut('fast');
|
| 1021 |
}
|
| 1022 |
},
|
| 1152 |
};
|
| 1153 |
|
| 1154 |
// register the event listener for staring the gallery
|
| 1155 |
+
$( document.body ).on( 'click', 'div.gallery,div.tiled-gallery', function(e) {
|
| 1156 |
+
if ( $(e.target).parent().hasClass('gallery-caption') )
|
| 1157 |
+
return;
|
| 1158 |
e.preventDefault();
|
| 1159 |
+
$(this).jp_carousel('open', {start_index: $(this).find('.gallery-item, .tiled-gallery-item').index($(e.target).parents('.gallery-item, .tiled-gallery-item'))});
|
| 1160 |
});
|
| 1161 |
|
| 1162 |
// start on page load if hash exists
|
| 1163 |
if ( document.location.hash && document.location.hash.match(/jp-carousel-(\d+)/) ) {
|
| 1164 |
$(document).ready(function(){
|
| 1165 |
+
var gallery = $('div.gallery, div.tiled-gallery'), index = -1, n = document.location.hash.match(/jp-carousel-(\d+)/);
|
| 1166 |
|
| 1167 |
n = parseInt(n[1], 10);
|
| 1168 |
|
| 1178 |
});
|
| 1179 |
}
|
| 1180 |
});
|
| 1181 |
+
|
| 1182 |
+
// Swipe gesture detection
|
| 1183 |
+
(function($){$.fn.touchwipe=function(settings){var config={min_move_x:20,min_move_y:20,wipeLeft:function(){},wipeRight:function(){},wipeUp:function(){},wipeDown:function(){},preventDefaultEvents:true};if(settings)$.extend(config,settings);this.each(function(){var startX;var startY;var isMoving=false;function cancelTouch(){this.removeEventListener('touchmove',onTouchMove);startX=null;isMoving=false}function onTouchMove(e){if(config.preventDefaultEvents){e.preventDefault()}if(isMoving){var x=e.touches[0].pageX;var y=e.touches[0].pageY;var dx=startX-x;var dy=startY-y;if(Math.abs(dx)>=config.min_move_x){cancelTouch();if(dx>0){config.wipeLeft()}else{config.wipeRight()}}else if(Math.abs(dy)>=config.min_move_y){cancelTouch();if(dy>0){config.wipeDown()}else{config.wipeUp()}}}}function onTouchStart(e){if(e.touches.length==1){startX=e.touches[0].pageX;startY=e.touches[0].pageY;isMoving=true;this.addEventListener('touchmove',onTouchMove,false)}}if('ontouchstart'in document.documentElement){this.addEventListener('touchstart',onTouchStart,false)}});return this}})(jQuery);
|
| 1184 |
+
|
jetpack-carousel.php
CHANGED
|
@@ -3,7 +3,7 @@
|
|
| 3 |
Plugin Name: Gallery Carousel Without JetPack
|
| 4 |
Plugin URI: http://www.wpbeginner.com/
|
| 5 |
Description: Transform your standard galleries into an immersive full-screen experience without requiring you to connect to WordPress.com
|
| 6 |
-
Version: 0.
|
| 7 |
Author: Syed Balkhi
|
| 8 |
Author URI: http://www.wpbeginner.com
|
| 9 |
License: GPLv2 or later
|
|
@@ -33,7 +33,7 @@ class No_Jetpack_Carousel {
|
|
| 33 |
if ( $this->maybe_disable_jp_carousel() )
|
| 34 |
return;
|
| 35 |
|
| 36 |
-
$this->in_jetpack = ( class_exists( '
|
| 37 |
|
| 38 |
if ( is_admin() ) {
|
| 39 |
// Register the Carousel-related related settings
|
|
@@ -59,7 +59,7 @@ class No_Jetpack_Carousel {
|
|
| 59 |
add_filter( 'wp_get_attachment_link', array( $this, 'add_data_to_images' ), 10, 2 );
|
| 60 |
}
|
| 61 |
|
| 62 |
-
if ( $this->in_jetpack && method_exists( '
|
| 63 |
Jetpack::enable_module_configurable( dirname( dirname( __FILE__ ) ) . '/carousel.php' );
|
| 64 |
Jetpack::module_configuration_load( dirname( dirname( __FILE__ ) ) . '/carousel.php', array( $this, 'jetpack_configuration_load' ) );
|
| 65 |
}
|
|
@@ -79,7 +79,6 @@ class No_Jetpack_Carousel {
|
|
| 79 |
}
|
| 80 |
|
| 81 |
function enqueue_assets( $output ) {
|
| 82 |
-
|
| 83 |
if ( ! empty( $output ) ) {
|
| 84 |
// Bail because someone is overriding the [gallery] shortcode.
|
| 85 |
remove_filter( 'gallery_style', array( $this, 'add_data_to_container' ) );
|
|
@@ -90,12 +89,14 @@ class No_Jetpack_Carousel {
|
|
| 90 |
do_action( 'jp_carousel_thumbnails_shown' );
|
| 91 |
|
| 92 |
if ( $this->first_run ) {
|
| 93 |
-
if ( !
|
| 94 |
-
|
| 95 |
-
|
|
|
|
|
|
|
| 96 |
}
|
| 97 |
|
| 98 |
-
wp_enqueue_script( 'jetpack-carousel', plugins_url( 'jetpack-carousel.js', __FILE__ ), array( 'jquery' ), $this->asset_version( '
|
| 99 |
|
| 100 |
// Note: using home_url() instead of admin_url() for ajaxurl to be sure to get same domain on wpcom when using mapped domains (also works on self-hosted)
|
| 101 |
// Also: not hardcoding path since there is no guarantee site is running on site root in self-hosted context.
|
|
@@ -109,9 +110,10 @@ class No_Jetpack_Carousel {
|
|
| 109 |
'display_exif' => $this->test_1or0_option( get_option( 'carousel_display_exif' ), true ),
|
| 110 |
'display_geo' => $this->test_1or0_option( get_option( 'carousel_display_geo' ), true ),
|
| 111 |
'background_color' => $this->carousel_background_color_sanitize( get_option( 'carousel_background_color' ) ),
|
|
|
|
| 112 |
'post_comment' => __( 'Post Comment', 'carousel' ),
|
| 113 |
'loading_comments' => __( 'Loading Comments...', 'carousel' ),
|
| 114 |
-
'download_original' => __( 'View full size <span class="photo-size"
|
| 115 |
'no_comment_text' => __( 'Please be sure to submit some text with your comment.', 'carousel' ),
|
| 116 |
'no_comment_email' => __( 'Please provide an email address to comment.', 'carousel' ),
|
| 117 |
'no_comment_author' => __( 'Please provide your name to comment.', 'carousel' ),
|
|
@@ -150,7 +152,6 @@ class No_Jetpack_Carousel {
|
|
| 150 |
}
|
| 151 |
|
| 152 |
return $output;
|
| 153 |
-
|
| 154 |
}
|
| 155 |
|
| 156 |
function add_data_to_images( $html, $attachment_id ) {
|
|
@@ -373,7 +374,7 @@ class No_Jetpack_Carousel {
|
|
| 373 |
register_setting( 'media', 'carousel_display_exif', array( $this, 'carousel_display_exif_sanitize' ) );
|
| 374 |
|
| 375 |
// No geo setting yet, need to "fuzzify" data first, for privacy
|
| 376 |
-
// add_settings_field('carousel_display_geo', __( 'Geolocation', '
|
| 377 |
// register_setting( 'media', 'carousel_display_geo', array( $this, 'carousel_display_geo_sanitize' ) );
|
| 378 |
}
|
| 379 |
|
| 3 |
Plugin Name: Gallery Carousel Without JetPack
|
| 4 |
Plugin URI: http://www.wpbeginner.com/
|
| 5 |
Description: Transform your standard galleries into an immersive full-screen experience without requiring you to connect to WordPress.com
|
| 6 |
+
Version: 0.4
|
| 7 |
Author: Syed Balkhi
|
| 8 |
Author URI: http://www.wpbeginner.com
|
| 9 |
License: GPLv2 or later
|
| 33 |
if ( $this->maybe_disable_jp_carousel() )
|
| 34 |
return;
|
| 35 |
|
| 36 |
+
$this->in_jetpack = ( class_exists( 'carousel' ) && method_exists( 'carousel', 'enable_module_configurable' ) ) ? true : false;
|
| 37 |
|
| 38 |
if ( is_admin() ) {
|
| 39 |
// Register the Carousel-related related settings
|
| 59 |
add_filter( 'wp_get_attachment_link', array( $this, 'add_data_to_images' ), 10, 2 );
|
| 60 |
}
|
| 61 |
|
| 62 |
+
if ( $this->in_jetpack && method_exists( 'carousel', 'module_configuration_load' ) ) {
|
| 63 |
Jetpack::enable_module_configurable( dirname( dirname( __FILE__ ) ) . '/carousel.php' );
|
| 64 |
Jetpack::module_configuration_load( dirname( dirname( __FILE__ ) ) . '/carousel.php', array( $this, 'jetpack_configuration_load' ) );
|
| 65 |
}
|
| 79 |
}
|
| 80 |
|
| 81 |
function enqueue_assets( $output ) {
|
|
|
|
| 82 |
if ( ! empty( $output ) ) {
|
| 83 |
// Bail because someone is overriding the [gallery] shortcode.
|
| 84 |
remove_filter( 'gallery_style', array( $this, 'add_data_to_container' ) );
|
| 89 |
do_action( 'jp_carousel_thumbnails_shown' );
|
| 90 |
|
| 91 |
if ( $this->first_run ) {
|
| 92 |
+
if ( !wp_script_is( 'spin', 'registered' ) ) {
|
| 93 |
+
wp_register_script( 'spin', plugins_url( 'spin.js', __FILE__ ), false, '1.2.4' );
|
| 94 |
+
}
|
| 95 |
+
if ( !wp_script_is( 'jquery.spin', 'registered' ) ) {
|
| 96 |
+
wp_register_script( 'jquery.spin', plugins_url( 'jquery.spin.js', __FILE__ ) , array( 'jquery', 'spin' ) );
|
| 97 |
}
|
| 98 |
|
| 99 |
+
wp_enqueue_script( 'jetpack-carousel', plugins_url( 'jetpack-carousel.js', __FILE__ ), array( 'jquery.spin' ), $this->asset_version( '20120926' ), true );
|
| 100 |
|
| 101 |
// Note: using home_url() instead of admin_url() for ajaxurl to be sure to get same domain on wpcom when using mapped domains (also works on self-hosted)
|
| 102 |
// Also: not hardcoding path since there is no guarantee site is running on site root in self-hosted context.
|
| 110 |
'display_exif' => $this->test_1or0_option( get_option( 'carousel_display_exif' ), true ),
|
| 111 |
'display_geo' => $this->test_1or0_option( get_option( 'carousel_display_geo' ), true ),
|
| 112 |
'background_color' => $this->carousel_background_color_sanitize( get_option( 'carousel_background_color' ) ),
|
| 113 |
+
'comment' => __( 'Comment', 'carousel' ),
|
| 114 |
'post_comment' => __( 'Post Comment', 'carousel' ),
|
| 115 |
'loading_comments' => __( 'Loading Comments...', 'carousel' ),
|
| 116 |
+
'download_original' => sprintf( __( 'View full size <span class="photo-size">%1$s<span class="photo-size-times">×</span>%2$s</span>', 'carousel' ), '{0}', '{1}' ),
|
| 117 |
'no_comment_text' => __( 'Please be sure to submit some text with your comment.', 'carousel' ),
|
| 118 |
'no_comment_email' => __( 'Please provide an email address to comment.', 'carousel' ),
|
| 119 |
'no_comment_author' => __( 'Please provide your name to comment.', 'carousel' ),
|
| 152 |
}
|
| 153 |
|
| 154 |
return $output;
|
|
|
|
| 155 |
}
|
| 156 |
|
| 157 |
function add_data_to_images( $html, $attachment_id ) {
|
| 374 |
register_setting( 'media', 'carousel_display_exif', array( $this, 'carousel_display_exif_sanitize' ) );
|
| 375 |
|
| 376 |
// No geo setting yet, need to "fuzzify" data first, for privacy
|
| 377 |
+
// add_settings_field('carousel_display_geo', __( 'Geolocation', 'carousel' ), array( $this, 'carousel_display_geo_callback' ), 'media', 'carousel_section' );
|
| 378 |
// register_setting( 'media', 'carousel_display_geo', array( $this, 'carousel_display_geo_sanitize' ) );
|
| 379 |
}
|
| 380 |
|
readme.txt
CHANGED
|
@@ -3,8 +3,8 @@ Contributors: smub, iamdpegg
|
|
| 3 |
Donate link:http://www.wpbeginner.com/wpbeginner-needs-your-help/
|
| 4 |
Tags: gallery, lightbox, carousel, gallery carousel, jetpack
|
| 5 |
Requires at least: 3.4.1
|
| 6 |
-
Tested up to: 3.
|
| 7 |
-
Stable tag: 0.
|
| 8 |
License: GPLv2 or later
|
| 9 |
License URI: http://www.gnu.org/licenses/gpl-2.0.html
|
| 10 |
|
|
@@ -54,6 +54,12 @@ However, if you want to turn off comments on Media attachments, you can follow t
|
|
| 54 |
|
| 55 |
== Changelog ==
|
| 56 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 57 |
= 0.3 =
|
| 58 |
* Fixed styling issue with the background going up as soon as one writes a comment (props Philipp)
|
| 59 |
* Added translation support. (props Philipp)
|
| 3 |
Donate link:http://www.wpbeginner.com/wpbeginner-needs-your-help/
|
| 4 |
Tags: gallery, lightbox, carousel, gallery carousel, jetpack
|
| 5 |
Requires at least: 3.4.1
|
| 6 |
+
Tested up to: 3.5 beta
|
| 7 |
+
Stable tag: 0.4
|
| 8 |
License: GPLv2 or later
|
| 9 |
License URI: http://www.gnu.org/licenses/gpl-2.0.html
|
| 10 |
|
| 54 |
|
| 55 |
== Changelog ==
|
| 56 |
|
| 57 |
+
= 0.4 =
|
| 58 |
+
* Updated it to match with the original JetPack plugin updates.
|
| 59 |
+
* Added support for mobile and touchscreen devices.
|
| 60 |
+
* Increased the size of the close button as many of you requested in the forums.
|
| 61 |
+
|
| 62 |
+
|
| 63 |
= 0.3 =
|
| 64 |
* Fixed styling issue with the background going up as soon as one writes a comment (props Philipp)
|
| 65 |
* Added translation support. (props Philipp)
|
