qbi/additional_plugins
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

lightbox fix chrome

Browse source
This commit is contained in:
Ian 2014-11-01 20:00:10 +01:00
parent 881ed4bb89
commit f84a851156
5 changed files with 85 additions and 30 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
serendipity_event_lightbox/ChangeLog
View file

@ -1,3 +1,12 @@
------------------------------------------------------------------------
2.0.2:
* set prettyPhoto image width to ~100% beneath a certain device size
* append css to head, scripts to end of body
* try to fix webkit engines, not displaying certain images in lightboxes,
with colorbox, magnific and prettyphoto
(http://board.s9y.org/viewtopic.php?f=4&t=20133&p=10440915#p10440915 ff)
------------------------------------------------------------------------
2.0.1: fix magnific noConflict mode and plugins path default var

13
serendipity_event_lightbox/fixchrome.css Normal file
View file

@ -0,0 +1,13 @@
/* on Safari and Chrome */
@media screen and (-webkit-min-device-pixel-ratio:0)
{
/* allows floated images to display in lightbox without need to disable the float */
.serendipity_image_link:before {
content: '';
display: inline-block;
}
/* same for centered images */
.serendipity_image_center {
display: block;
}
}

8
serendipity_event_lightbox/magnific-popup/jquery.magnific-popup.init.js
View file

@ -14,10 +14,10 @@ jQuery(document).ready(function($){
// Init magnificPopup for grouped galleries
$('a:visible[rel^="'+theRel+'"]').magnificPopup({
gallery:{
enabled:true
},
type:'image'
type: 'image',
gallery: { enabled: true },
removalDelay: 300,
mainClass: 'popup-slide'
});
});

15
serendipity_event_lightbox/prettyphoto/css/prettyPhotoScreens.css Normal file
View file

@ -0,0 +1,15 @@
/* prettyPhoto styling for small screens */
@media (max-width: 620px) {
.pp_pic_holder.pp_default { width: 100%!important; margin-top:-100px !important;left: 0!important; overflow: hidden; }
div.pp_default .pp_content_container .pp_left { padding-left: 0!important; }
div.pp_default .pp_content_container .pp_right { padding-right: 0!important; }
.pp_content { width: 100%!important; height: auto!important; }
.pp_fade { width: 100%!important; height: 100%!important; }
a.pp_expand, a.pp_contract, .pp_hoverContainer, .pp_gallery, .pp_top, .pp_bottom { display: none!important; }
#pp_full_res img { width: 100%!important; height: auto!important; }
.pp_details { width: 100%!important; padding-left: 3%; padding-right: 4%; padding-top: 10px; padding-bottom: 10px; background-color: #fff; margin-top: -2px!important; }
a.pp_close { right: 50px!important; top: 10px!important; }
}
@media (max-width: 400px) {
a.pp_close { right: 30px!important; top: 10px!important; }
}

70
serendipity_event_lightbox/serendipity_event_lightbox.php
View file

@ -28,12 +28,12 @@ class serendipity_event_lightbox extends serendipity_event {
$propbag->add('name', PLUGIN_EVENT_LIGHTBOX_NAME);
$propbag->add('description', PLUGIN_EVENT_LIGHTBOX_DESC);
$propbag->add('author', 'Thomas Nesges, Andy Hopkins, Lokesh Dhakar, Cody Lindley, Stephan Manske, Grischa Brockhaus, Ian');
$propbag->add('version', '2.0.1');
$propbag->add('version', '2.0.2');
$propbag->add('requirements', array(
'serendipity' => '1.6',
'php' => '5.3.0'
));
$propbag->add('event_hooks', array('frontend_display' => true, 'frontend_footer' => true ));
$propbag->add('event_hooks', array('frontend_display' => true, 'frontend_header' => true, 'frontend_footer' => true ));
$propbag->add('stackable', false);
$propbag->add('groups', array('IMAGES'));
$propbag->add('cachable_events', array('frontend_display' => true));
@ -100,7 +100,7 @@ class serendipity_event_lightbox extends serendipity_event {
$propbag->add('type', 'string');
$propbag->add('name', PLUGIN_EVENT_LIGHTBOX_PATH);
$propbag->add('description', PLUGIN_EVENT_LIGHTBOX_PATH_DESC);
$propbag->add('default', $serendipity['serendipityHTTPPath'] . '/plugins/serendipity_event_lightbox');
$propbag->add('default', $serendipity['serendipityHTTPPath'] . 'plugins/serendipity_event_lightbox');
break;
case 'init_js':
@ -169,6 +169,8 @@ class serendipity_event_lightbox extends serendipity_event {
}
switch($event) {
case 'frontend_header':
$headcss = true;
case 'frontend_footer':
// If no imagelink was processed, don't add css or js files to the header! (configurable optimization)
@ -178,42 +180,58 @@ class serendipity_event_lightbox extends serendipity_event {
echo "\n";
// ColorBox code (https://github.com/jackmoore/colorbox) - init with :visible to ensure to not show hidden elements via hideafter function in imageselectorplus ranges
if ($type == 'colorbox') {
echo ' <link rel="stylesheet" type="text/css" href="' . $pluginDir . '/colorbox/colorbox.css" />' . "\n";
if (!class_exists('serendipity_event_jquery') && !$serendipity['capabilities']['jquery']) {
echo ' <script type="text/javascript" src="' . $pluginDir . '/jquery-1.11.1.min.js" charset="utf-8"></script>' . "\n";
if ($headcss) {
echo ' <link rel="stylesheet" type="text/css" href="' . $pluginDir . '/fixchrome.css" />' . "\n";
echo ' <link rel="stylesheet" type="text/css" href="' . $pluginDir . '/colorbox/colorbox.css" />' . "\n";
} else {
if (!class_exists('serendipity_event_jquery') && !$serendipity['capabilities']['jquery']) {
echo ' <script type="text/javascript" src="' . $pluginDir . '/jquery-1.11.1.min.js" charset="utf-8"></script>' . "\n";
}
echo ' <script type="text/javascript" src="' . $pluginDir . '/colorbox/jquery.colorbox-min.js" charset="utf-8"></script>' . "\n";
echo ' <script type="text/javascript" src="' . $pluginDir . '/colorbox/jquery.colorbox.init.js" charset="utf-8"></script>' . "\n";
}
echo ' <script type="text/javascript" src="' . $pluginDir . '/colorbox/jquery.colorbox-min.js" charset="utf-8"></script>' . "\n";
echo ' <script type="text/javascript" src="' . $pluginDir . '/colorbox/jquery.colorbox.init.js" charset="utf-8"></script>' . "\n";
}
// LightBox2 jQuery based - http://lokeshdhakar.com/projects/lightbox2/ - this lightbox does not allow to show :visible anchors only - it shows and counts all gallery images, if set to view galleries
elseif ($type == 'lightbox2jq') {
echo ' <link rel="stylesheet" type="text/css" href="' . $pluginDir . '/lightbox2-jquery/css/lightbox.css" />' . "\n";
if (!class_exists('serendipity_event_jquery') && !$serendipity['capabilities']['jquery']) {
echo ' <script type="text/javascript" src="' . $pluginDir . '/jquery-1.11.1.min.js" charset="utf-8"></script>' . "\n";
if ($headcss) {
echo ' <link rel="stylesheet" type="text/css" href="' . $pluginDir . '/lightbox2-jquery/css/lightbox.css" />' . "\n";
} else {
if (!class_exists('serendipity_event_jquery') && !$serendipity['capabilities']['jquery']) {
echo ' <script type="text/javascript" src="' . $pluginDir . '/jquery-1.11.1.min.js" charset="utf-8"></script>' . "\n";
}
// remove anchors possible onclick handler
echo ' <script type="text/javascript"> jQuery(document).ready(function(){ jQuery(\'a[rel^="lightbox"]\').removeAttr("onclick"); }); </script>' . "\n";
echo ' <script type="text/javascript" src="' . $pluginDir . '/lightbox2-jquery/js/lightbox.min.js" charset="utf-8"></script>' . "\n";
}
// remove anchors possible onclick handler
echo ' <script type="text/javascript"> jQuery(document).ready(function(){ jQuery(\'a[rel^="lightbox"]\').removeAttr("onclick"); }); </script>' . "\n";
echo ' <script type="text/javascript" src="' . $pluginDir . '/lightbox2-jquery/js/lightbox.min.js" charset="utf-8"></script>' . "\n";
}
// Magnific-Popup code (https://github.com/dimsemenov/Magnific-Popup) - init with :visible to ensure to not show hidden elements via hideafter function in imageselectorplus ranges
elseif ($type == 'magnific') {
echo ' <link rel="stylesheet" type="text/css" href="' . $pluginDir . '/magnific-popup/magnific-popup.css" />' . "\n";
if (!class_exists('serendipity_event_jquery') && !$serendipity['capabilities']['jquery']) {
echo ' <script type="text/javascript" src="' . $pluginDir . '/jquery-1.11.1.min.js" charset="utf-8"></script>' . "\n";
if ($headcss) {
echo ' <link rel="stylesheet" type="text/css" href="' . $pluginDir . '/fixchrome.css" />' . "\n";
echo ' <link rel="stylesheet" type="text/css" href="' . $pluginDir . '/magnific-popup/magnific-popup.css" />' . "\n";
} else {
if (!class_exists('serendipity_event_jquery') && !$serendipity['capabilities']['jquery']) {
echo ' <script type="text/javascript" src="' . $pluginDir . '/jquery-1.11.1.min.js" charset="utf-8"></script>' . "\n";
}
echo ' <script type="text/javascript" src="' . $pluginDir . '/magnific-popup/jquery.magnific-popup.min.js" charset="utf-8"></script>' . "\n";
echo ' <script type="text/javascript" src="' . $pluginDir . '/magnific-popup/jquery.magnific-popup.init.js" charset="utf-8"></script>' . "\n";
}
echo ' <script type="text/javascript" src="' . $pluginDir . '/magnific-popup/jquery.magnific-popup.min.js" charset="utf-8"></script>' . "\n";
echo ' <script type="text/javascript" src="' . $pluginDir . '/magnific-popup/jquery.magnific-popup.init.js" charset="utf-8"></script>' . "\n";
}
// PrettyPhoto code - http://www.no-margin-for-errors.com/projects/prettyPhoto/ - init with :visible to ensure to not show hidden elements via hideafter function in imageselectorplus ranges
elseif ($type == 'prettyPhoto') {
echo ' <link rel="stylesheet" type="text/css" href="' . $pluginDir . '/prettyphoto/css/prettyPhoto.css" />' . "\n";
if (!class_exists('serendipity_event_jquery') && !$serendipity['capabilities']['jquery']) {
echo ' <script type="text/javascript" src="' . $pluginDir . '/jquery-1.11.1.min.js" charset="utf-8"></script>' . "\n";
if ($headcss) {
echo ' <link rel="stylesheet" type="text/css" href="' . $pluginDir . '/fixchrome.css" />' . "\n";
echo ' <link rel="stylesheet" type="text/css" href="' . $pluginDir . '/prettyphoto/css/prettyPhoto.css" />' . "\n";
echo ' <link rel="stylesheet" type="text/css" href="' . $pluginDir . '/prettyphoto/css/prettyPhotoScreens.css" />' . "\n";
} else {
if (!class_exists('serendipity_event_jquery') && !$serendipity['capabilities']['jquery']) {
echo ' <script type="text/javascript" src="' . $pluginDir . '/jquery-1.11.1.min.js" charset="utf-8"></script>' . "\n";
}
// remove anchors possible onclick handler
echo ' <script type="text/javascript">jQuery(document).ready(function(){ jQuery(\'a[rel^="prettyPhoto"]\').removeAttr("onclick"); }); </script>' . "\n";
echo ' <script type="text/javascript" src="' . $pluginDir . '/prettyphoto/js/jquery.prettyPhoto.min.js" charset="utf-8"></script>' . "\n";
echo ' <script type="text/javascript">jQuery(document).ready(function(){ jQuery(\'a:visible[rel^="prettyPhoto"]\').prettyPhoto(' . $this->get_config('init_js') . '); }); </script>' . "\n";
}
// remove anchors possible onclick handler
echo ' <script type="text/javascript"> jQuery(document).ready(function(){ jQuery(\'a[rel^="prettyPhoto"]\').removeAttr("onclick"); }); </script>' . "\n";
echo ' <script type="text/javascript" src="' . $pluginDir . '/prettyphoto/js/jquery.prettyPhoto.min.js" charset="utf-8"></script>' . "\n";
echo ' <script type="text/javascript"> jQuery(document).ready(function(){ jQuery(\'a:visible[rel^="prettyPhoto"]\').prettyPhoto(' . $this->get_config('init_js') . '); }); </script>' . "\n";
}
return true;
break;