Merge branch 'master', remote-tracking branch 'remotes/upstream/master'
* remotes/upstream/master: click anywhere to close notifications -> zeros and bubbles revup fix css use fancybox instead of lightbox fixes * master:
2
boot.php
|
@ -9,7 +9,7 @@ require_once('include/nav.php');
|
||||||
require_once('include/cache.php');
|
require_once('include/cache.php');
|
||||||
|
|
||||||
define ( 'FRIENDICA_PLATFORM', 'Friendica');
|
define ( 'FRIENDICA_PLATFORM', 'Friendica');
|
||||||
define ( 'FRIENDICA_VERSION', '2.3.1278' );
|
define ( 'FRIENDICA_VERSION', '2.3.1279' );
|
||||||
define ( 'DFRN_PROTOCOL_VERSION', '2.22' );
|
define ( 'DFRN_PROTOCOL_VERSION', '2.22' );
|
||||||
define ( 'DB_UPDATE_VERSION', 1131 );
|
define ( 'DB_UPDATE_VERSION', 1131 );
|
||||||
|
|
||||||
|
|
|
@ -1,4 +1,22 @@
|
||||||
<?php
|
<?php
|
||||||
|
|
||||||
|
/*
|
||||||
|
* Name: Dark Bubble
|
||||||
|
* Version: 1.0
|
||||||
|
* Maintainer: Mike Macgirvin <mike@macgirvin.com>
|
||||||
|
*/
|
||||||
|
|
||||||
|
|
||||||
$a->theme_info = array(
|
$a->theme_info = array(
|
||||||
'extends' => 'testbubble',
|
'extends' => 'testbubble',
|
||||||
);
|
);
|
||||||
|
|
||||||
|
|
||||||
|
$a->page['htmlhead'] .= <<< EOT
|
||||||
|
<script>
|
||||||
|
$(document).ready(function() {
|
||||||
|
|
||||||
|
$('html').click(function() { $("#nav-notifications-menu" ).hide(); });
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
EOT;
|
||||||
|
|
|
@ -15,6 +15,8 @@ $a->page['htmlhead'] .= <<< EOT
|
||||||
<script>
|
<script>
|
||||||
$(document).ready(function() {
|
$(document).ready(function() {
|
||||||
|
|
||||||
|
$('html').click(function() { $("#nav-notifications-menu" ).hide(); });
|
||||||
|
|
||||||
$('.group-edit-icon').hover(
|
$('.group-edit-icon').hover(
|
||||||
function() {
|
function() {
|
||||||
$(this).addClass('icon'); $(this).removeClass('iconspacer');},
|
$(this).addClass('icon'); $(this).removeClass('iconspacer');},
|
||||||
|
|
|
@ -16,6 +16,8 @@ $a->page['htmlhead'] .= <<< EOT
|
||||||
<script>
|
<script>
|
||||||
$(document).ready(function() {
|
$(document).ready(function() {
|
||||||
|
|
||||||
|
$('html').click(function() { $("#nav-notifications-menu" ).hide(); });
|
||||||
|
|
||||||
$('.group-edit-icon').hover(
|
$('.group-edit-icon').hover(
|
||||||
function() {
|
function() {
|
||||||
$(this).addClass('icon'); $(this).removeClass('iconspacer');},
|
$(this).addClass('icon'); $(this).removeClass('iconspacer');},
|
||||||
|
|
|
@ -0,0 +1,29 @@
|
||||||
|
<div id="group-sidebar" class="widget">
|
||||||
|
<div class="title tool">
|
||||||
|
<h3 class="label">$title</h3>
|
||||||
|
<a href="group/new" title="$createtext" class="action"><span class="icon text s16 add"></span></a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="sidebar-group-list">
|
||||||
|
<ul>
|
||||||
|
{{ for $groups as $group }}
|
||||||
|
<li class="tool {{ if $group.selected }}selected{{ endif }}">
|
||||||
|
<a href="$group.href" class="label">
|
||||||
|
$group.text
|
||||||
|
</a>
|
||||||
|
{{ if $group.edit }}
|
||||||
|
<a href="$group.edit.href" class="action"><span class="icon text s10 edit"></span></a>
|
||||||
|
{{ endif }}
|
||||||
|
{{ if $group.cid }}
|
||||||
|
<input type="checkbox"
|
||||||
|
class="{{ if $group.selected }}ticked{{ else }}unticked {{ endif }} action"
|
||||||
|
onclick="contactgroupChangeMember('$group.id','$group.cid');return true;"
|
||||||
|
{{ if $group.ismember }}checked="checked"{{ endif }}
|
||||||
|
/>
|
||||||
|
{{ endif }}
|
||||||
|
</li>
|
||||||
|
{{ endfor }}
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
Before Width: | Height: | Size: 795 B After Width: | Height: | Size: 727 B |
|
@ -1,101 +0,0 @@
|
||||||
/**
|
|
||||||
* jQuery lightBox plugin
|
|
||||||
* This jQuery plugin was inspired and based on Lightbox 2 by Lokesh Dhakar (http://www.huddletogether.com/projects/lightbox2/)
|
|
||||||
* and adapted to me for use like a plugin from jQuery.
|
|
||||||
* @name jquery-lightbox-0.5.css
|
|
||||||
* @author Leandro Vieira Pinho - http://leandrovieira.com
|
|
||||||
* @version 0.5
|
|
||||||
* @date April 11, 2008
|
|
||||||
* @category jQuery plugin
|
|
||||||
* @copyright (c) 2008 Leandro Vieira Pinho (leandrovieira.com)
|
|
||||||
* @license CCAttribution-ShareAlike 2.5 Brazil - http://creativecommons.org/licenses/by-sa/2.5/br/deed.en_US
|
|
||||||
* @example Visit http://leandrovieira.com/projects/jquery/lightbox/ for more informations about this jQuery plugin
|
|
||||||
*/
|
|
||||||
#jquery-overlay {
|
|
||||||
position: absolute;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
z-index: 90;
|
|
||||||
width: 100%;
|
|
||||||
height: 500px;
|
|
||||||
}
|
|
||||||
#jquery-lightbox {
|
|
||||||
position: absolute;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
width: 100%;
|
|
||||||
z-index: 100;
|
|
||||||
text-align: center;
|
|
||||||
line-height: 0;
|
|
||||||
}
|
|
||||||
#jquery-lightbox a img { border: none; }
|
|
||||||
#lightbox-container-image-box {
|
|
||||||
position: relative;
|
|
||||||
background-color: #fff;
|
|
||||||
width: 250px;
|
|
||||||
height: 250px;
|
|
||||||
margin: 0 auto;
|
|
||||||
}
|
|
||||||
#lightbox-container-image { padding: 10px; }
|
|
||||||
#lightbox-loading {
|
|
||||||
position: absolute;
|
|
||||||
top: 40%;
|
|
||||||
left: 0%;
|
|
||||||
height: 25%;
|
|
||||||
width: 100%;
|
|
||||||
text-align: center;
|
|
||||||
line-height: 0;
|
|
||||||
}
|
|
||||||
#lightbox-nav {
|
|
||||||
position: absolute;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
height: 100%;
|
|
||||||
width: 100%;
|
|
||||||
z-index: 10;
|
|
||||||
}
|
|
||||||
#lightbox-container-image-box > #lightbox-nav { left: 0; }
|
|
||||||
#lightbox-nav a { outline: none;}
|
|
||||||
#lightbox-nav-btnPrev, #lightbox-nav-btnNext {
|
|
||||||
width: 49%;
|
|
||||||
height: 100%;
|
|
||||||
zoom: 1;
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
#lightbox-nav-btnPrev {
|
|
||||||
left: 0;
|
|
||||||
float: left;
|
|
||||||
}
|
|
||||||
#lightbox-nav-btnNext {
|
|
||||||
right: 0;
|
|
||||||
float: right;
|
|
||||||
}
|
|
||||||
#lightbox-container-image-data-box {
|
|
||||||
font: 10px Verdana, Helvetica, sans-serif;
|
|
||||||
background-color: #fff;
|
|
||||||
margin: 0 auto;
|
|
||||||
line-height: 1.4em;
|
|
||||||
overflow: auto;
|
|
||||||
width: 100%;
|
|
||||||
padding: 0 10px 0;
|
|
||||||
}
|
|
||||||
#lightbox-container-image-data {
|
|
||||||
padding: 0 10px;
|
|
||||||
color: #666;
|
|
||||||
}
|
|
||||||
#lightbox-container-image-data #lightbox-image-details {
|
|
||||||
width: 70%;
|
|
||||||
float: left;
|
|
||||||
text-align: left;
|
|
||||||
}
|
|
||||||
#lightbox-image-details-caption { font-weight: bold; }
|
|
||||||
#lightbox-image-details-currentNumber {
|
|
||||||
display: block;
|
|
||||||
clear: left;
|
|
||||||
padding-bottom: 1.0em;
|
|
||||||
}
|
|
||||||
#lightbox-secNav-btnClose {
|
|
||||||
width: 66px;
|
|
||||||
float: right;
|
|
||||||
padding-bottom: 0.7em;
|
|
||||||
}
|
|
Before Width: | Height: | Size: 43 B |
Before Width: | Height: | Size: 700 B |
Before Width: | Height: | Size: 812 B |
Before Width: | Height: | Size: 832 B |
Before Width: | Height: | Size: 3.9 KiB |
|
@ -1,78 +0,0 @@
|
||||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
|
|
||||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
|
||||||
<head>
|
|
||||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
|
||||||
<title>jQuery lightBox plugin</title>
|
|
||||||
|
|
||||||
<link rel="stylesheet" type="text/css" href="../style-projects-jquery.css" />
|
|
||||||
|
|
||||||
<!-- Arquivos utilizados pelo jQuery lightBox plugin -->
|
|
||||||
<script type="text/javascript" src="js/jquery.js"></script>
|
|
||||||
<script type="text/javascript" src="js/jquery.lightbox-0.5.js"></script>
|
|
||||||
<link rel="stylesheet" type="text/css" href="css/jquery.lightbox-0.5.css" media="screen" />
|
|
||||||
<!-- / fim dos arquivos utilizados pelo jQuery lightBox plugin -->
|
|
||||||
|
|
||||||
<!-- Ativando o jQuery lightBox plugin -->
|
|
||||||
<script type="text/javascript">
|
|
||||||
$(function() {
|
|
||||||
$('#gallery a').lightBox();
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
<style type="text/css">
|
|
||||||
/* jQuery lightBox plugin - Gallery style */
|
|
||||||
#gallery {
|
|
||||||
background-color: #444;
|
|
||||||
padding: 10px;
|
|
||||||
width: 520px;
|
|
||||||
}
|
|
||||||
#gallery ul { list-style: none; }
|
|
||||||
#gallery ul li { display: inline; }
|
|
||||||
#gallery ul img {
|
|
||||||
border: 5px solid #3e3e3e;
|
|
||||||
border-width: 5px 5px 20px;
|
|
||||||
}
|
|
||||||
#gallery ul a:hover img {
|
|
||||||
border: 5px solid #fff;
|
|
||||||
border-width: 5px 5px 20px;
|
|
||||||
color: #fff;
|
|
||||||
}
|
|
||||||
#gallery ul a:hover { color: #fff; }
|
|
||||||
</style>
|
|
||||||
</head>
|
|
||||||
|
|
||||||
<body>
|
|
||||||
|
|
||||||
<h2 id="example">Example</h2>
|
|
||||||
<p>Click in the image and see the <strong>jQuery lightBox plugin</strong> in action.</p>
|
|
||||||
<div id="gallery">
|
|
||||||
<ul>
|
|
||||||
<li>
|
|
||||||
<a href="photos/image1.jpg" title="Utilize a flexibilidade dos seletores da jQuery e crie um grupo de imagens como desejar. $('#gallery').lightBox();">
|
|
||||||
<img src="photos/thumb_image1.jpg" width="72" height="72" alt="" />
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<a href="photos/image2.jpg" title="Utilize a flexibilidade dos seletores da jQuery e crie um grupo de imagens como desejar. $('#gallery a').lightBox();">
|
|
||||||
<img src="photos/thumb_image2.jpg" width="72" height="72" alt="" />
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<a href="photos/image3.jpg" title="Utilize a flexibilidade dos seletores da jQuery e crie um grupo de imagens como desejar. $('#gallery a').lightBox();">
|
|
||||||
<img src="photos/thumb_image3.jpg" width="72" height="72" alt="" />
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<a href="photos/image4.jpg" title="Utilize a flexibilidade dos seletores da jQuery e crie um grupo de imagens como desejar. $('#gallery a').lightBox();">
|
|
||||||
<img src="photos/thumb_image4.jpg" width="72" height="72" alt="" />
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<a href="photos/image5.jpg" title="Utilize a flexibilidade dos seletores da jQuery e crie um grupo de imagens como desejar. $('#gallery a').lightBox();">
|
|
||||||
<img src="photos/thumb_image5.jpg" width="72" height="72" alt="" />
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</body>
|
|
||||||
</html>
|
|
|
@ -1,472 +0,0 @@
|
||||||
/**
|
|
||||||
* jQuery lightBox plugin
|
|
||||||
* This jQuery plugin was inspired and based on Lightbox 2 by Lokesh Dhakar (http://www.huddletogether.com/projects/lightbox2/)
|
|
||||||
* and adapted to me for use like a plugin from jQuery.
|
|
||||||
* @name jquery-lightbox-0.5.js
|
|
||||||
* @author Leandro Vieira Pinho - http://leandrovieira.com
|
|
||||||
* @version 0.5
|
|
||||||
* @date April 11, 2008
|
|
||||||
* @category jQuery plugin
|
|
||||||
* @copyright (c) 2008 Leandro Vieira Pinho (leandrovieira.com)
|
|
||||||
* @license CCAttribution-ShareAlike 2.5 Brazil - http://creativecommons.org/licenses/by-sa/2.5/br/deed.en_US
|
|
||||||
* @example Visit http://leandrovieira.com/projects/jquery/lightbox/ for more informations about this jQuery plugin
|
|
||||||
*/
|
|
||||||
|
|
||||||
// Offering a Custom Alias suport - More info: http://docs.jquery.com/Plugins/Authoring#Custom_Alias
|
|
||||||
(function($) {
|
|
||||||
/**
|
|
||||||
* $ is an alias to jQuery object
|
|
||||||
*
|
|
||||||
*/
|
|
||||||
$.fn.lightBox = function(settings) {
|
|
||||||
// Settings to configure the jQuery lightBox plugin how you like
|
|
||||||
settings = jQuery.extend({
|
|
||||||
// Configuration related to overlay
|
|
||||||
overlayBgColor: '#000', // (string) Background color to overlay; inform a hexadecimal value like: #RRGGBB. Where RR, GG, and BB are the hexadecimal values for the red, green, and blue values of the color.
|
|
||||||
overlayOpacity: 0.8, // (integer) Opacity value to overlay; inform: 0.X. Where X are number from 0 to 9
|
|
||||||
// Configuration related to navigation
|
|
||||||
fixedNavigation: false, // (boolean) Boolean that informs if the navigation (next and prev button) will be fixed or not in the interface.
|
|
||||||
// Configuration related to images
|
|
||||||
imageLoading: 'images/lightbox-ico-loading.gif', // (string) Path and the name of the loading icon
|
|
||||||
imageBtnPrev: 'images/lightbox-btn-prev.gif', // (string) Path and the name of the prev button image
|
|
||||||
imageBtnNext: 'images/lightbox-btn-next.gif', // (string) Path and the name of the next button image
|
|
||||||
imageBtnClose: 'images/lightbox-btn-close.gif', // (string) Path and the name of the close btn
|
|
||||||
imageBlank: 'images/lightbox-blank.gif', // (string) Path and the name of a blank image (one pixel)
|
|
||||||
// Configuration related to container image box
|
|
||||||
containerBorderSize: 10, // (integer) If you adjust the padding in the CSS for the container, #lightbox-container-image-box, you will need to update this value
|
|
||||||
containerResizeSpeed: 400, // (integer) Specify the resize duration of container image. These number are miliseconds. 400 is default.
|
|
||||||
// Configuration related to texts in caption. For example: Image 2 of 8. You can alter either "Image" and "of" texts.
|
|
||||||
txtImage: 'Image', // (string) Specify text "Image"
|
|
||||||
txtOf: 'of', // (string) Specify text "of"
|
|
||||||
// Configuration related to keyboard navigation
|
|
||||||
keyToClose: 'c', // (string) (c = close) Letter to close the jQuery lightBox interface. Beyond this letter, the letter X and the SCAPE key is used to.
|
|
||||||
keyToPrev: 'p', // (string) (p = previous) Letter to show the previous image
|
|
||||||
keyToNext: 'n', // (string) (n = next) Letter to show the next image.
|
|
||||||
// Don´t alter these variables in any way
|
|
||||||
imageArray: [],
|
|
||||||
activeImage: 0
|
|
||||||
},settings);
|
|
||||||
// Caching the jQuery object with all elements matched
|
|
||||||
var jQueryMatchedObj = this; // This, in this context, refer to jQuery object
|
|
||||||
/**
|
|
||||||
* Initializing the plugin calling the start function
|
|
||||||
*
|
|
||||||
* @return boolean false
|
|
||||||
*/
|
|
||||||
function _initialize() {
|
|
||||||
_start(this,jQueryMatchedObj); // This, in this context, refer to object (link) which the user have clicked
|
|
||||||
return false; // Avoid the browser following the link
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Start the jQuery lightBox plugin
|
|
||||||
*
|
|
||||||
* @param object objClicked The object (link) whick the user have clicked
|
|
||||||
* @param object jQueryMatchedObj The jQuery object with all elements matched
|
|
||||||
*/
|
|
||||||
function _start(objClicked,jQueryMatchedObj) {
|
|
||||||
// Hime some elements to avoid conflict with overlay in IE. These elements appear above the overlay.
|
|
||||||
$('embed, object, select').css({ 'visibility' : 'hidden' });
|
|
||||||
// Call the function to create the markup structure; style some elements; assign events in some elements.
|
|
||||||
_set_interface();
|
|
||||||
// Unset total images in imageArray
|
|
||||||
settings.imageArray.length = 0;
|
|
||||||
// Unset image active information
|
|
||||||
settings.activeImage = 0;
|
|
||||||
// We have an image set? Or just an image? Let´s see it.
|
|
||||||
if ( jQueryMatchedObj.length == 1 ) {
|
|
||||||
settings.imageArray.push(new Array(objClicked.getAttribute('href'),objClicked.getAttribute('title')));
|
|
||||||
} else {
|
|
||||||
// Add an Array (as many as we have), with href and title atributes, inside the Array that storage the images references
|
|
||||||
for ( var i = 0; i < jQueryMatchedObj.length; i++ ) {
|
|
||||||
settings.imageArray.push(new Array(jQueryMatchedObj[i].getAttribute('href'),jQueryMatchedObj[i].getAttribute('title')));
|
|
||||||
}
|
|
||||||
}
|
|
||||||
while ( settings.imageArray[settings.activeImage][0] != objClicked.getAttribute('href') ) {
|
|
||||||
settings.activeImage++;
|
|
||||||
}
|
|
||||||
// Call the function that prepares image exibition
|
|
||||||
_set_image_to_view();
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Create the jQuery lightBox plugin interface
|
|
||||||
*
|
|
||||||
* The HTML markup will be like that:
|
|
||||||
<div id="jquery-overlay"></div>
|
|
||||||
<div id="jquery-lightbox">
|
|
||||||
<div id="lightbox-container-image-box">
|
|
||||||
<div id="lightbox-container-image">
|
|
||||||
<img src="../fotos/XX.jpg" id="lightbox-image">
|
|
||||||
<div id="lightbox-nav">
|
|
||||||
<a href="#" id="lightbox-nav-btnPrev"></a>
|
|
||||||
<a href="#" id="lightbox-nav-btnNext"></a>
|
|
||||||
</div>
|
|
||||||
<div id="lightbox-loading">
|
|
||||||
<a href="#" id="lightbox-loading-link">
|
|
||||||
<img src="../images/lightbox-ico-loading.gif">
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div id="lightbox-container-image-data-box">
|
|
||||||
<div id="lightbox-container-image-data">
|
|
||||||
<div id="lightbox-image-details">
|
|
||||||
<span id="lightbox-image-details-caption"></span>
|
|
||||||
<span id="lightbox-image-details-currentNumber"></span>
|
|
||||||
</div>
|
|
||||||
<div id="lightbox-secNav">
|
|
||||||
<a href="#" id="lightbox-secNav-btnClose">
|
|
||||||
<img src="../images/lightbox-btn-close.gif">
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
*
|
|
||||||
*/
|
|
||||||
function _set_interface() {
|
|
||||||
// Apply the HTML markup into body tag
|
|
||||||
$('body').append('<div id="jquery-overlay"></div><div id="jquery-lightbox"><div id="lightbox-container-image-box"><div id="lightbox-container-image"><img id="lightbox-image"><div style="" id="lightbox-nav"><a href="#" id="lightbox-nav-btnPrev"></a><a href="#" id="lightbox-nav-btnNext"></a></div><div id="lightbox-loading"><a href="#" id="lightbox-loading-link"><img src="' + settings.imageLoading + '"></a></div></div></div><div id="lightbox-container-image-data-box"><div id="lightbox-container-image-data"><div id="lightbox-image-details"><span id="lightbox-image-details-caption"></span><span id="lightbox-image-details-currentNumber"></span></div><div id="lightbox-secNav"><a href="#" id="lightbox-secNav-btnClose"><img src="' + settings.imageBtnClose + '"></a></div></div></div></div>');
|
|
||||||
// Get page sizes
|
|
||||||
var arrPageSizes = ___getPageSize();
|
|
||||||
// Style overlay and show it
|
|
||||||
$('#jquery-overlay').css({
|
|
||||||
backgroundColor: settings.overlayBgColor,
|
|
||||||
opacity: settings.overlayOpacity,
|
|
||||||
width: arrPageSizes[0],
|
|
||||||
height: arrPageSizes[1]
|
|
||||||
}).fadeIn();
|
|
||||||
// Get page scroll
|
|
||||||
var arrPageScroll = ___getPageScroll();
|
|
||||||
// Calculate top and left offset for the jquery-lightbox div object and show it
|
|
||||||
$('#jquery-lightbox').css({
|
|
||||||
top: arrPageScroll[1] + (arrPageSizes[3] / 10),
|
|
||||||
left: arrPageScroll[0]
|
|
||||||
}).show();
|
|
||||||
// Assigning click events in elements to close overlay
|
|
||||||
$('#jquery-overlay,#jquery-lightbox').click(function() {
|
|
||||||
_finish();
|
|
||||||
});
|
|
||||||
// Assign the _finish function to lightbox-loading-link and lightbox-secNav-btnClose objects
|
|
||||||
$('#lightbox-loading-link,#lightbox-secNav-btnClose').click(function() {
|
|
||||||
_finish();
|
|
||||||
return false;
|
|
||||||
});
|
|
||||||
// If window was resized, calculate the new overlay dimensions
|
|
||||||
$(window).resize(function() {
|
|
||||||
// Get page sizes
|
|
||||||
var arrPageSizes = ___getPageSize();
|
|
||||||
// Style overlay and show it
|
|
||||||
$('#jquery-overlay').css({
|
|
||||||
width: arrPageSizes[0],
|
|
||||||
height: arrPageSizes[1]
|
|
||||||
});
|
|
||||||
// Get page scroll
|
|
||||||
var arrPageScroll = ___getPageScroll();
|
|
||||||
// Calculate top and left offset for the jquery-lightbox div object and show it
|
|
||||||
$('#jquery-lightbox').css({
|
|
||||||
top: arrPageScroll[1] + (arrPageSizes[3] / 10),
|
|
||||||
left: arrPageScroll[0]
|
|
||||||
});
|
|
||||||
});
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Prepares image exibition; doing a image´s preloader to calculate it´s size
|
|
||||||
*
|
|
||||||
*/
|
|
||||||
function _set_image_to_view() { // show the loading
|
|
||||||
// Show the loading
|
|
||||||
$('#lightbox-loading').show();
|
|
||||||
if ( settings.fixedNavigation ) {
|
|
||||||
$('#lightbox-image,#lightbox-container-image-data-box,#lightbox-image-details-currentNumber').hide();
|
|
||||||
} else {
|
|
||||||
// Hide some elements
|
|
||||||
$('#lightbox-image,#lightbox-nav,#lightbox-nav-btnPrev,#lightbox-nav-btnNext,#lightbox-container-image-data-box,#lightbox-image-details-currentNumber').hide();
|
|
||||||
}
|
|
||||||
// Image preload process
|
|
||||||
var objImagePreloader = new Image();
|
|
||||||
objImagePreloader.onload = function() {
|
|
||||||
$('#lightbox-image').attr('src',settings.imageArray[settings.activeImage][0]);
|
|
||||||
// Perfomance an effect in the image container resizing it
|
|
||||||
_resize_container_image_box(objImagePreloader.width,objImagePreloader.height);
|
|
||||||
// clear onLoad, IE behaves irratically with animated gifs otherwise
|
|
||||||
objImagePreloader.onload=function(){};
|
|
||||||
};
|
|
||||||
objImagePreloader.src = settings.imageArray[settings.activeImage][0];
|
|
||||||
};
|
|
||||||
/**
|
|
||||||
* Perfomance an effect in the image container resizing it
|
|
||||||
*
|
|
||||||
* @param integer intImageWidth The image´s width that will be showed
|
|
||||||
* @param integer intImageHeight The image´s height that will be showed
|
|
||||||
*/
|
|
||||||
function _resize_container_image_box(intImageWidth,intImageHeight) {
|
|
||||||
// Get current width and height
|
|
||||||
var intCurrentWidth = $('#lightbox-container-image-box').width();
|
|
||||||
var intCurrentHeight = $('#lightbox-container-image-box').height();
|
|
||||||
// Get the width and height of the selected image plus the padding
|
|
||||||
var intWidth = (intImageWidth + (settings.containerBorderSize * 2)); // Plus the image´s width and the left and right padding value
|
|
||||||
var intHeight = (intImageHeight + (settings.containerBorderSize * 2)); // Plus the image´s height and the left and right padding value
|
|
||||||
// Diferences
|
|
||||||
var intDiffW = intCurrentWidth - intWidth;
|
|
||||||
var intDiffH = intCurrentHeight - intHeight;
|
|
||||||
// Perfomance the effect
|
|
||||||
$('#lightbox-container-image-box').animate({ width: intWidth, height: intHeight },settings.containerResizeSpeed,function() { _show_image(); });
|
|
||||||
if ( ( intDiffW == 0 ) && ( intDiffH == 0 ) ) {
|
|
||||||
if ( $.browser.msie ) {
|
|
||||||
___pause(250);
|
|
||||||
} else {
|
|
||||||
___pause(100);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
$('#lightbox-container-image-data-box').css({ width: intImageWidth });
|
|
||||||
$('#lightbox-nav-btnPrev,#lightbox-nav-btnNext').css({ height: intImageHeight + (settings.containerBorderSize * 2) });
|
|
||||||
};
|
|
||||||
/**
|
|
||||||
* Show the prepared image
|
|
||||||
*
|
|
||||||
*/
|
|
||||||
function _show_image() {
|
|
||||||
$('#lightbox-loading').hide();
|
|
||||||
$('#lightbox-image').fadeIn(function() {
|
|
||||||
_show_image_data();
|
|
||||||
_set_navigation();
|
|
||||||
});
|
|
||||||
_preload_neighbor_images();
|
|
||||||
};
|
|
||||||
/**
|
|
||||||
* Show the image information
|
|
||||||
*
|
|
||||||
*/
|
|
||||||
function _show_image_data() {
|
|
||||||
$('#lightbox-container-image-data-box').slideDown('fast');
|
|
||||||
$('#lightbox-image-details-caption').hide();
|
|
||||||
if ( settings.imageArray[settings.activeImage][1] ) {
|
|
||||||
$('#lightbox-image-details-caption').html(settings.imageArray[settings.activeImage][1]).show();
|
|
||||||
}
|
|
||||||
// If we have a image set, display 'Image X of X'
|
|
||||||
if ( settings.imageArray.length > 1 ) {
|
|
||||||
$('#lightbox-image-details-currentNumber').html(settings.txtImage + ' ' + ( settings.activeImage + 1 ) + ' ' + settings.txtOf + ' ' + settings.imageArray.length).show();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Display the button navigations
|
|
||||||
*
|
|
||||||
*/
|
|
||||||
function _set_navigation() {
|
|
||||||
$('#lightbox-nav').show();
|
|
||||||
|
|
||||||
// Instead to define this configuration in CSS file, we define here. And it´s need to IE. Just.
|
|
||||||
$('#lightbox-nav-btnPrev,#lightbox-nav-btnNext').css({ 'background' : 'transparent url(' + settings.imageBlank + ') no-repeat' });
|
|
||||||
|
|
||||||
// Show the prev button, if not the first image in set
|
|
||||||
if ( settings.activeImage != 0 ) {
|
|
||||||
if ( settings.fixedNavigation ) {
|
|
||||||
$('#lightbox-nav-btnPrev').css({ 'background' : 'url(' + settings.imageBtnPrev + ') left 15% no-repeat' })
|
|
||||||
.unbind()
|
|
||||||
.bind('click',function() {
|
|
||||||
settings.activeImage = settings.activeImage - 1;
|
|
||||||
_set_image_to_view();
|
|
||||||
return false;
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
// Show the images button for Next buttons
|
|
||||||
$('#lightbox-nav-btnPrev').unbind().hover(function() {
|
|
||||||
$(this).css({ 'background' : 'url(' + settings.imageBtnPrev + ') left 15% no-repeat' });
|
|
||||||
},function() {
|
|
||||||
$(this).css({ 'background' : 'transparent url(' + settings.imageBlank + ') no-repeat' });
|
|
||||||
}).show().bind('click',function() {
|
|
||||||
settings.activeImage = settings.activeImage - 1;
|
|
||||||
_set_image_to_view();
|
|
||||||
return false;
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// Show the next button, if not the last image in set
|
|
||||||
if ( settings.activeImage != ( settings.imageArray.length -1 ) ) {
|
|
||||||
if ( settings.fixedNavigation ) {
|
|
||||||
$('#lightbox-nav-btnNext').css({ 'background' : 'url(' + settings.imageBtnNext + ') right 15% no-repeat' })
|
|
||||||
.unbind()
|
|
||||||
.bind('click',function() {
|
|
||||||
settings.activeImage = settings.activeImage + 1;
|
|
||||||
_set_image_to_view();
|
|
||||||
return false;
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
// Show the images button for Next buttons
|
|
||||||
$('#lightbox-nav-btnNext').unbind().hover(function() {
|
|
||||||
$(this).css({ 'background' : 'url(' + settings.imageBtnNext + ') right 15% no-repeat' });
|
|
||||||
},function() {
|
|
||||||
$(this).css({ 'background' : 'transparent url(' + settings.imageBlank + ') no-repeat' });
|
|
||||||
}).show().bind('click',function() {
|
|
||||||
settings.activeImage = settings.activeImage + 1;
|
|
||||||
_set_image_to_view();
|
|
||||||
return false;
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
// Enable keyboard navigation
|
|
||||||
_enable_keyboard_navigation();
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Enable a support to keyboard navigation
|
|
||||||
*
|
|
||||||
*/
|
|
||||||
function _enable_keyboard_navigation() {
|
|
||||||
$(document).keydown(function(objEvent) {
|
|
||||||
_keyboard_action(objEvent);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Disable the support to keyboard navigation
|
|
||||||
*
|
|
||||||
*/
|
|
||||||
function _disable_keyboard_navigation() {
|
|
||||||
$(document).unbind();
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Perform the keyboard actions
|
|
||||||
*
|
|
||||||
*/
|
|
||||||
function _keyboard_action(objEvent) {
|
|
||||||
// To ie
|
|
||||||
if ( objEvent == null ) {
|
|
||||||
keycode = event.keyCode;
|
|
||||||
escapeKey = 27;
|
|
||||||
// To Mozilla
|
|
||||||
} else {
|
|
||||||
keycode = objEvent.keyCode;
|
|
||||||
escapeKey = objEvent.DOM_VK_ESCAPE;
|
|
||||||
}
|
|
||||||
// Get the key in lower case form
|
|
||||||
key = String.fromCharCode(keycode).toLowerCase();
|
|
||||||
// Verify the keys to close the ligthBox
|
|
||||||
if ( ( key == settings.keyToClose ) || ( key == 'x' ) || ( keycode == escapeKey ) ) {
|
|
||||||
_finish();
|
|
||||||
}
|
|
||||||
// Verify the key to show the previous image
|
|
||||||
if ( ( key == settings.keyToPrev ) || ( keycode == 37 ) ) {
|
|
||||||
// If we´re not showing the first image, call the previous
|
|
||||||
if ( settings.activeImage != 0 ) {
|
|
||||||
settings.activeImage = settings.activeImage - 1;
|
|
||||||
_set_image_to_view();
|
|
||||||
_disable_keyboard_navigation();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
// Verify the key to show the next image
|
|
||||||
if ( ( key == settings.keyToNext ) || ( keycode == 39 ) ) {
|
|
||||||
// If we´re not showing the last image, call the next
|
|
||||||
if ( settings.activeImage != ( settings.imageArray.length - 1 ) ) {
|
|
||||||
settings.activeImage = settings.activeImage + 1;
|
|
||||||
_set_image_to_view();
|
|
||||||
_disable_keyboard_navigation();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Preload prev and next images being showed
|
|
||||||
*
|
|
||||||
*/
|
|
||||||
function _preload_neighbor_images() {
|
|
||||||
if ( (settings.imageArray.length -1) > settings.activeImage ) {
|
|
||||||
objNext = new Image();
|
|
||||||
objNext.src = settings.imageArray[settings.activeImage + 1][0];
|
|
||||||
}
|
|
||||||
if ( settings.activeImage > 0 ) {
|
|
||||||
objPrev = new Image();
|
|
||||||
objPrev.src = settings.imageArray[settings.activeImage -1][0];
|
|
||||||
}
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Remove jQuery lightBox plugin HTML markup
|
|
||||||
*
|
|
||||||
*/
|
|
||||||
function _finish() {
|
|
||||||
$('#jquery-lightbox').remove();
|
|
||||||
$('#jquery-overlay').fadeOut(function() { $('#jquery-overlay').remove(); });
|
|
||||||
// Show some elements to avoid conflict with overlay in IE. These elements appear above the overlay.
|
|
||||||
$('embed, object, select').css({ 'visibility' : 'visible' });
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
/ THIRD FUNCTION
|
|
||||||
* getPageSize() by quirksmode.com
|
|
||||||
*
|
|
||||||
* @return Array Return an array with page width, height and window width, height
|
|
||||||
*/
|
|
||||||
function ___getPageSize() {
|
|
||||||
var xScroll, yScroll;
|
|
||||||
if (window.innerHeight && window.scrollMaxY) {
|
|
||||||
xScroll = window.innerWidth + window.scrollMaxX;
|
|
||||||
yScroll = window.innerHeight + window.scrollMaxY;
|
|
||||||
} else if (document.body.scrollHeight > document.body.offsetHeight){ // all but Explorer Mac
|
|
||||||
xScroll = document.body.scrollWidth;
|
|
||||||
yScroll = document.body.scrollHeight;
|
|
||||||
} else { // Explorer Mac...would also work in Explorer 6 Strict, Mozilla and Safari
|
|
||||||
xScroll = document.body.offsetWidth;
|
|
||||||
yScroll = document.body.offsetHeight;
|
|
||||||
}
|
|
||||||
var windowWidth, windowHeight;
|
|
||||||
if (self.innerHeight) { // all except Explorer
|
|
||||||
if(document.documentElement.clientWidth){
|
|
||||||
windowWidth = document.documentElement.clientWidth;
|
|
||||||
} else {
|
|
||||||
windowWidth = self.innerWidth;
|
|
||||||
}
|
|
||||||
windowHeight = self.innerHeight;
|
|
||||||
} else if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode
|
|
||||||
windowWidth = document.documentElement.clientWidth;
|
|
||||||
windowHeight = document.documentElement.clientHeight;
|
|
||||||
} else if (document.body) { // other Explorers
|
|
||||||
windowWidth = document.body.clientWidth;
|
|
||||||
windowHeight = document.body.clientHeight;
|
|
||||||
}
|
|
||||||
// for small pages with total height less then height of the viewport
|
|
||||||
if(yScroll < windowHeight){
|
|
||||||
pageHeight = windowHeight;
|
|
||||||
} else {
|
|
||||||
pageHeight = yScroll;
|
|
||||||
}
|
|
||||||
// for small pages with total width less then width of the viewport
|
|
||||||
if(xScroll < windowWidth){
|
|
||||||
pageWidth = xScroll;
|
|
||||||
} else {
|
|
||||||
pageWidth = windowWidth;
|
|
||||||
}
|
|
||||||
arrayPageSize = new Array(pageWidth,pageHeight,windowWidth,windowHeight);
|
|
||||||
return arrayPageSize;
|
|
||||||
};
|
|
||||||
/**
|
|
||||||
/ THIRD FUNCTION
|
|
||||||
* getPageScroll() by quirksmode.com
|
|
||||||
*
|
|
||||||
* @return Array Return an array with x,y page scroll values.
|
|
||||||
*/
|
|
||||||
function ___getPageScroll() {
|
|
||||||
var xScroll, yScroll;
|
|
||||||
if (self.pageYOffset) {
|
|
||||||
yScroll = self.pageYOffset;
|
|
||||||
xScroll = self.pageXOffset;
|
|
||||||
} else if (document.documentElement && document.documentElement.scrollTop) { // Explorer 6 Strict
|
|
||||||
yScroll = document.documentElement.scrollTop;
|
|
||||||
xScroll = document.documentElement.scrollLeft;
|
|
||||||
} else if (document.body) {// all other Explorers
|
|
||||||
yScroll = document.body.scrollTop;
|
|
||||||
xScroll = document.body.scrollLeft;
|
|
||||||
}
|
|
||||||
arrayPageScroll = new Array(xScroll,yScroll);
|
|
||||||
return arrayPageScroll;
|
|
||||||
};
|
|
||||||
/**
|
|
||||||
* Stop the code execution from a escified time in milisecond
|
|
||||||
*
|
|
||||||
*/
|
|
||||||
function ___pause(ms) {
|
|
||||||
var date = new Date();
|
|
||||||
curDate = null;
|
|
||||||
do { var curDate = new Date(); }
|
|
||||||
while ( curDate - date < ms);
|
|
||||||
};
|
|
||||||
// Return the jQuery object for chaining. The unbind method is used to avoid click conflict when the plugin is called more than once
|
|
||||||
return this.unbind('click').click(_initialize);
|
|
||||||
};
|
|
||||||
})(jQuery); // Call and execute the function immediately passing the jQuery object
|
|
|
@ -1,42 +0,0 @@
|
||||||
/**
|
|
||||||
* jQuery lightBox plugin
|
|
||||||
* This jQuery plugin was inspired and based on Lightbox 2 by Lokesh Dhakar (http://www.huddletogether.com/projects/lightbox2/)
|
|
||||||
* and adapted to me for use like a plugin from jQuery.
|
|
||||||
* @name jquery-lightbox-0.5.js
|
|
||||||
* @author Leandro Vieira Pinho - http://leandrovieira.com
|
|
||||||
* @version 0.5
|
|
||||||
* @date April 11, 2008
|
|
||||||
* @category jQuery plugin
|
|
||||||
* @copyright (c) 2008 Leandro Vieira Pinho (leandrovieira.com)
|
|
||||||
* @license CCAttribution-ShareAlike 2.5 Brazil - http://creativecommons.org/licenses/by-sa/2.5/br/deed.en_US
|
|
||||||
* @example Visit http://leandrovieira.com/projects/jquery/lightbox/ for more informations about this jQuery plugin
|
|
||||||
*/
|
|
||||||
(function($){$.fn.lightBox=function(settings){settings=jQuery.extend({overlayBgColor:'#000',overlayOpacity:0.8,fixedNavigation:false,imageLoading:'images/lightbox-ico-loading.gif',imageBtnPrev:'images/lightbox-btn-prev.gif',imageBtnNext:'images/lightbox-btn-next.gif',imageBtnClose:'images/lightbox-btn-close.gif',imageBlank:'images/lightbox-blank.gif',containerBorderSize:10,containerResizeSpeed:400,txtImage:'Image',txtOf:'of',keyToClose:'c',keyToPrev:'p',keyToNext:'n',imageArray:[],activeImage:0},settings);var jQueryMatchedObj=this;function _initialize(){_start(this,jQueryMatchedObj);return false;}
|
|
||||||
function _start(objClicked,jQueryMatchedObj){$('embed, object, select').css({'visibility':'hidden'});_set_interface();settings.imageArray.length=0;settings.activeImage=0;if(jQueryMatchedObj.length==1){settings.imageArray.push(new Array(objClicked.getAttribute('href'),objClicked.getAttribute('title')));}else{for(var i=0;i<jQueryMatchedObj.length;i++){settings.imageArray.push(new Array(jQueryMatchedObj[i].getAttribute('href'),jQueryMatchedObj[i].getAttribute('title')));}}
|
|
||||||
while(settings.imageArray[settings.activeImage][0]!=objClicked.getAttribute('href')){settings.activeImage++;}
|
|
||||||
_set_image_to_view();}
|
|
||||||
function _set_interface(){$('body').append('<div id="jquery-overlay"></div><div id="jquery-lightbox"><div id="lightbox-container-image-box"><div id="lightbox-container-image"><img id="lightbox-image"><div style="" id="lightbox-nav"><a href="#" id="lightbox-nav-btnPrev"></a><a href="#" id="lightbox-nav-btnNext"></a></div><div id="lightbox-loading"><a href="#" id="lightbox-loading-link"><img src="'+settings.imageLoading+'"></a></div></div></div><div id="lightbox-container-image-data-box"><div id="lightbox-container-image-data"><div id="lightbox-image-details"><span id="lightbox-image-details-caption"></span><span id="lightbox-image-details-currentNumber"></span></div><div id="lightbox-secNav"><a href="#" id="lightbox-secNav-btnClose"><img src="'+settings.imageBtnClose+'"></a></div></div></div></div>');var arrPageSizes=___getPageSize();$('#jquery-overlay').css({backgroundColor:settings.overlayBgColor,opacity:settings.overlayOpacity,width:arrPageSizes[0],height:arrPageSizes[1]}).fadeIn();var arrPageScroll=___getPageScroll();$('#jquery-lightbox').css({top:arrPageScroll[1]+(arrPageSizes[3]/10),left:arrPageScroll[0]}).show();$('#jquery-overlay,#jquery-lightbox').click(function(){_finish();});$('#lightbox-loading-link,#lightbox-secNav-btnClose').click(function(){_finish();return false;});$(window).resize(function(){var arrPageSizes=___getPageSize();$('#jquery-overlay').css({width:arrPageSizes[0],height:arrPageSizes[1]});var arrPageScroll=___getPageScroll();$('#jquery-lightbox').css({top:arrPageScroll[1]+(arrPageSizes[3]/10),left:arrPageScroll[0]});});}
|
|
||||||
function _set_image_to_view(){$('#lightbox-loading').show();if(settings.fixedNavigation){$('#lightbox-image,#lightbox-container-image-data-box,#lightbox-image-details-currentNumber').hide();}else{$('#lightbox-image,#lightbox-nav,#lightbox-nav-btnPrev,#lightbox-nav-btnNext,#lightbox-container-image-data-box,#lightbox-image-details-currentNumber').hide();}
|
|
||||||
var objImagePreloader=new Image();objImagePreloader.onload=function(){$('#lightbox-image').attr('src',settings.imageArray[settings.activeImage][0]);_resize_container_image_box(objImagePreloader.width,objImagePreloader.height);objImagePreloader.onload=function(){};};objImagePreloader.src=settings.imageArray[settings.activeImage][0];};function _resize_container_image_box(intImageWidth,intImageHeight){var intCurrentWidth=$('#lightbox-container-image-box').width();var intCurrentHeight=$('#lightbox-container-image-box').height();var intWidth=(intImageWidth+(settings.containerBorderSize*2));var intHeight=(intImageHeight+(settings.containerBorderSize*2));var intDiffW=intCurrentWidth-intWidth;var intDiffH=intCurrentHeight-intHeight;$('#lightbox-container-image-box').animate({width:intWidth,height:intHeight},settings.containerResizeSpeed,function(){_show_image();});if((intDiffW==0)&&(intDiffH==0)){if($.browser.msie){___pause(250);}else{___pause(100);}}
|
|
||||||
$('#lightbox-container-image-data-box').css({width:intImageWidth});$('#lightbox-nav-btnPrev,#lightbox-nav-btnNext').css({height:intImageHeight+(settings.containerBorderSize*2)});};function _show_image(){$('#lightbox-loading').hide();$('#lightbox-image').fadeIn(function(){_show_image_data();_set_navigation();});_preload_neighbor_images();};function _show_image_data(){$('#lightbox-container-image-data-box').slideDown('fast');$('#lightbox-image-details-caption').hide();if(settings.imageArray[settings.activeImage][1]){$('#lightbox-image-details-caption').html(settings.imageArray[settings.activeImage][1]).show();}
|
|
||||||
if(settings.imageArray.length>1){$('#lightbox-image-details-currentNumber').html(settings.txtImage+' '+(settings.activeImage+1)+' '+settings.txtOf+' '+settings.imageArray.length).show();}}
|
|
||||||
function _set_navigation(){$('#lightbox-nav').show();$('#lightbox-nav-btnPrev,#lightbox-nav-btnNext').css({'background':'transparent url('+settings.imageBlank+') no-repeat'});if(settings.activeImage!=0){if(settings.fixedNavigation){$('#lightbox-nav-btnPrev').css({'background':'url('+settings.imageBtnPrev+') left 15% no-repeat'}).unbind().bind('click',function(){settings.activeImage=settings.activeImage-1;_set_image_to_view();return false;});}else{$('#lightbox-nav-btnPrev').unbind().hover(function(){$(this).css({'background':'url('+settings.imageBtnPrev+') left 15% no-repeat'});},function(){$(this).css({'background':'transparent url('+settings.imageBlank+') no-repeat'});}).show().bind('click',function(){settings.activeImage=settings.activeImage-1;_set_image_to_view();return false;});}}
|
|
||||||
if(settings.activeImage!=(settings.imageArray.length-1)){if(settings.fixedNavigation){$('#lightbox-nav-btnNext').css({'background':'url('+settings.imageBtnNext+') right 15% no-repeat'}).unbind().bind('click',function(){settings.activeImage=settings.activeImage+1;_set_image_to_view();return false;});}else{$('#lightbox-nav-btnNext').unbind().hover(function(){$(this).css({'background':'url('+settings.imageBtnNext+') right 15% no-repeat'});},function(){$(this).css({'background':'transparent url('+settings.imageBlank+') no-repeat'});}).show().bind('click',function(){settings.activeImage=settings.activeImage+1;_set_image_to_view();return false;});}}
|
|
||||||
_enable_keyboard_navigation();}
|
|
||||||
function _enable_keyboard_navigation(){$(document).keydown(function(objEvent){_keyboard_action(objEvent);});}
|
|
||||||
function _disable_keyboard_navigation(){$(document).unbind();}
|
|
||||||
function _keyboard_action(objEvent){if(objEvent==null){keycode=event.keyCode;escapeKey=27;}else{keycode=objEvent.keyCode;escapeKey=objEvent.DOM_VK_ESCAPE;}
|
|
||||||
key=String.fromCharCode(keycode).toLowerCase();if((key==settings.keyToClose)||(key=='x')||(keycode==escapeKey)){_finish();}
|
|
||||||
if((key==settings.keyToPrev)||(keycode==37)){if(settings.activeImage!=0){settings.activeImage=settings.activeImage-1;_set_image_to_view();_disable_keyboard_navigation();}}
|
|
||||||
if((key==settings.keyToNext)||(keycode==39)){if(settings.activeImage!=(settings.imageArray.length-1)){settings.activeImage=settings.activeImage+1;_set_image_to_view();_disable_keyboard_navigation();}}}
|
|
||||||
function _preload_neighbor_images(){if((settings.imageArray.length-1)>settings.activeImage){objNext=new Image();objNext.src=settings.imageArray[settings.activeImage+1][0];}
|
|
||||||
if(settings.activeImage>0){objPrev=new Image();objPrev.src=settings.imageArray[settings.activeImage-1][0];}}
|
|
||||||
function _finish(){$('#jquery-lightbox').remove();$('#jquery-overlay').fadeOut(function(){$('#jquery-overlay').remove();});$('embed, object, select').css({'visibility':'visible'});}
|
|
||||||
function ___getPageSize(){var xScroll,yScroll;if(window.innerHeight&&window.scrollMaxY){xScroll=window.innerWidth+window.scrollMaxX;yScroll=window.innerHeight+window.scrollMaxY;}else if(document.body.scrollHeight>document.body.offsetHeight){xScroll=document.body.scrollWidth;yScroll=document.body.scrollHeight;}else{xScroll=document.body.offsetWidth;yScroll=document.body.offsetHeight;}
|
|
||||||
var windowWidth,windowHeight;if(self.innerHeight){if(document.documentElement.clientWidth){windowWidth=document.documentElement.clientWidth;}else{windowWidth=self.innerWidth;}
|
|
||||||
windowHeight=self.innerHeight;}else if(document.documentElement&&document.documentElement.clientHeight){windowWidth=document.documentElement.clientWidth;windowHeight=document.documentElement.clientHeight;}else if(document.body){windowWidth=document.body.clientWidth;windowHeight=document.body.clientHeight;}
|
|
||||||
if(yScroll<windowHeight){pageHeight=windowHeight;}else{pageHeight=yScroll;}
|
|
||||||
if(xScroll<windowWidth){pageWidth=xScroll;}else{pageWidth=windowWidth;}
|
|
||||||
arrayPageSize=new Array(pageWidth,pageHeight,windowWidth,windowHeight);return arrayPageSize;};function ___getPageScroll(){var xScroll,yScroll;if(self.pageYOffset){yScroll=self.pageYOffset;xScroll=self.pageXOffset;}else if(document.documentElement&&document.documentElement.scrollTop){yScroll=document.documentElement.scrollTop;xScroll=document.documentElement.scrollLeft;}else if(document.body){yScroll=document.body.scrollTop;xScroll=document.body.scrollLeft;}
|
|
||||||
arrayPageScroll=new Array(xScroll,yScroll);return arrayPageScroll;};function ___pause(ms){var date=new Date();curDate=null;do{var curDate=new Date();}
|
|
||||||
while(curDate-date<ms);};return this.unbind('click').click(_initialize);};})(jQuery);
|
|
Before Width: | Height: | Size: 20 KiB |
Before Width: | Height: | Size: 44 KiB |
Before Width: | Height: | Size: 38 KiB |
Before Width: | Height: | Size: 18 KiB |
Before Width: | Height: | Size: 30 KiB |
Before Width: | Height: | Size: 2.0 KiB |
Before Width: | Height: | Size: 2.5 KiB |
Before Width: | Height: | Size: 2.2 KiB |
Before Width: | Height: | Size: 1.9 KiB |
Before Width: | Height: | Size: 2.0 KiB |
|
@ -970,6 +970,10 @@ aside #side-peoplefind-url {
|
||||||
widht: 55px;
|
widht: 55px;
|
||||||
height: 55px;
|
height: 55px;
|
||||||
}
|
}
|
||||||
|
#lost-password-link {
|
||||||
|
float: left;
|
||||||
|
margin-right: 20px;
|
||||||
|
}
|
||||||
/* widget */
|
/* widget */
|
||||||
.widget {
|
.widget {
|
||||||
margin-bottom: 2em;
|
margin-bottom: 2em;
|
||||||
|
@ -1065,7 +1069,8 @@ body .pageheader{
|
||||||
padding: 10px;
|
padding: 10px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
font-size: 1.0em;
|
font-size: 1.0em;
|
||||||
margin-top: 140%;
|
clear: both;
|
||||||
|
display: block;
|
||||||
}
|
}
|
||||||
|
|
||||||
.tabs {
|
.tabs {
|
||||||
|
@ -1618,7 +1623,7 @@ body .pageheader{
|
||||||
box-shadow: 0 1px 1px #CFCFCF;
|
box-shadow: 0 1px 1px #CFCFCF;
|
||||||
}
|
}
|
||||||
.button.creation2 {
|
.button.creation2 {
|
||||||
background-color: #33ACFF;
|
background-color: #1872A2;
|
||||||
background-image: -moz-linear-gradient(center top , #66C1FF 0%, #0097FF 100%);
|
background-image: -moz-linear-gradient(center top , #66C1FF 0%, #0097FF 100%);
|
||||||
border: 1px solid #777777;
|
border: 1px solid #777777;
|
||||||
color: white;
|
color: white;
|
||||||
|
|
|
@ -1,8 +1,8 @@
|
||||||
<?php
|
<?php
|
||||||
|
|
||||||
/*
|
/*
|
||||||
* Name: Diabook
|
* Name: Diabook-blue
|
||||||
* Description: Diabook: report bugs and request here: http://pad.toktan.org/p/diabook or contact me : thomas_bierey@friendica.eu
|
* Description: Diabook-blue: report bugs and request here: http://pad.toktan.org/p/diabook or contact me : thomas_bierey@friendica.eu
|
||||||
* Version:
|
* Version:
|
||||||
* Author:
|
* Author:
|
||||||
*/
|
*/
|
||||||
|
@ -13,11 +13,6 @@ $a->theme_info = array(
|
||||||
|
|
||||||
$a->page['htmlhead'] .= <<< EOT
|
$a->page['htmlhead'] .= <<< EOT
|
||||||
|
|
||||||
|
|
||||||
<script type="text/javascript" src="view/theme/diabook/lightbox/js/jquery.lightbox-0.5.js"></script>
|
|
||||||
<link rel="stylesheet" type="text/css" href="view/theme/diabook/lightbox/css/jquery.lightbox-0.5.css" media="screen" />
|
|
||||||
|
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
|
||||||
//contacts
|
//contacts
|
||||||
|
@ -80,7 +75,7 @@ $('html').click(function() {
|
||||||
});
|
});
|
||||||
|
|
||||||
$(function() {
|
$(function() {
|
||||||
$('a.lightbox').lightBox(); // Select all links with lightbox class
|
$('a.lightbox').fancybox(); // Select all links with lightbox class
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
|
|
|
@ -0,0 +1,29 @@
|
||||||
|
<div id="group-sidebar" class="widget">
|
||||||
|
<div class="title tool">
|
||||||
|
<h3 class="label">$title</h3>
|
||||||
|
<a href="group/new" title="$createtext" class="action"><span class="icon text s16 add"></span></a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="sidebar-group-list">
|
||||||
|
<ul>
|
||||||
|
{{ for $groups as $group }}
|
||||||
|
<li class="tool {{ if $group.selected }}selected{{ endif }}">
|
||||||
|
<a href="$group.href" class="label">
|
||||||
|
$group.text
|
||||||
|
</a>
|
||||||
|
{{ if $group.edit }}
|
||||||
|
<a href="$group.edit.href" class="action"><span class="icon text s10 edit"></span></a>
|
||||||
|
{{ endif }}
|
||||||
|
{{ if $group.cid }}
|
||||||
|
<input type="checkbox"
|
||||||
|
class="{{ if $group.selected }}ticked{{ else }}unticked {{ endif }} action"
|
||||||
|
onclick="contactgroupChangeMember('$group.id','$group.cid');return true;"
|
||||||
|
{{ if $group.ismember }}checked="checked"{{ endif }}
|
||||||
|
/>
|
||||||
|
{{ endif }}
|
||||||
|
</li>
|
||||||
|
{{ endfor }}
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
|
@ -1,101 +0,0 @@
|
||||||
/**
|
|
||||||
* jQuery lightBox plugin
|
|
||||||
* This jQuery plugin was inspired and based on Lightbox 2 by Lokesh Dhakar (http://www.huddletogether.com/projects/lightbox2/)
|
|
||||||
* and adapted to me for use like a plugin from jQuery.
|
|
||||||
* @name jquery-lightbox-0.5.css
|
|
||||||
* @author Leandro Vieira Pinho - http://leandrovieira.com
|
|
||||||
* @version 0.5
|
|
||||||
* @date April 11, 2008
|
|
||||||
* @category jQuery plugin
|
|
||||||
* @copyright (c) 2008 Leandro Vieira Pinho (leandrovieira.com)
|
|
||||||
* @license CCAttribution-ShareAlike 2.5 Brazil - http://creativecommons.org/licenses/by-sa/2.5/br/deed.en_US
|
|
||||||
* @example Visit http://leandrovieira.com/projects/jquery/lightbox/ for more informations about this jQuery plugin
|
|
||||||
*/
|
|
||||||
#jquery-overlay {
|
|
||||||
position: absolute;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
z-index: 90;
|
|
||||||
width: 100%;
|
|
||||||
height: 500px;
|
|
||||||
}
|
|
||||||
#jquery-lightbox {
|
|
||||||
position: absolute;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
width: 100%;
|
|
||||||
z-index: 100;
|
|
||||||
text-align: center;
|
|
||||||
line-height: 0;
|
|
||||||
}
|
|
||||||
#jquery-lightbox a img { border: none; }
|
|
||||||
#lightbox-container-image-box {
|
|
||||||
position: relative;
|
|
||||||
background-color: #fff;
|
|
||||||
width: 250px;
|
|
||||||
height: 250px;
|
|
||||||
margin: 0 auto;
|
|
||||||
}
|
|
||||||
#lightbox-container-image { padding: 10px; }
|
|
||||||
#lightbox-loading {
|
|
||||||
position: absolute;
|
|
||||||
top: 40%;
|
|
||||||
left: 0%;
|
|
||||||
height: 25%;
|
|
||||||
width: 100%;
|
|
||||||
text-align: center;
|
|
||||||
line-height: 0;
|
|
||||||
}
|
|
||||||
#lightbox-nav {
|
|
||||||
position: absolute;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
height: 100%;
|
|
||||||
width: 100%;
|
|
||||||
z-index: 10;
|
|
||||||
}
|
|
||||||
#lightbox-container-image-box > #lightbox-nav { left: 0; }
|
|
||||||
#lightbox-nav a { outline: none;}
|
|
||||||
#lightbox-nav-btnPrev, #lightbox-nav-btnNext {
|
|
||||||
width: 49%;
|
|
||||||
height: 100%;
|
|
||||||
zoom: 1;
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
#lightbox-nav-btnPrev {
|
|
||||||
left: 0;
|
|
||||||
float: left;
|
|
||||||
}
|
|
||||||
#lightbox-nav-btnNext {
|
|
||||||
right: 0;
|
|
||||||
float: right;
|
|
||||||
}
|
|
||||||
#lightbox-container-image-data-box {
|
|
||||||
font: 10px Verdana, Helvetica, sans-serif;
|
|
||||||
background-color: #fff;
|
|
||||||
margin: 0 auto;
|
|
||||||
line-height: 1.4em;
|
|
||||||
overflow: auto;
|
|
||||||
width: 100%;
|
|
||||||
padding: 0 10px 0;
|
|
||||||
}
|
|
||||||
#lightbox-container-image-data {
|
|
||||||
padding: 0 10px;
|
|
||||||
color: #666;
|
|
||||||
}
|
|
||||||
#lightbox-container-image-data #lightbox-image-details {
|
|
||||||
width: 70%;
|
|
||||||
float: left;
|
|
||||||
text-align: left;
|
|
||||||
}
|
|
||||||
#lightbox-image-details-caption { font-weight: bold; }
|
|
||||||
#lightbox-image-details-currentNumber {
|
|
||||||
display: block;
|
|
||||||
clear: left;
|
|
||||||
padding-bottom: 1.0em;
|
|
||||||
}
|
|
||||||
#lightbox-secNav-btnClose {
|
|
||||||
width: 66px;
|
|
||||||
float: right;
|
|
||||||
padding-bottom: 0.7em;
|
|
||||||
}
|
|
Before Width: | Height: | Size: 43 B |
Before Width: | Height: | Size: 700 B |
Before Width: | Height: | Size: 812 B |
Before Width: | Height: | Size: 832 B |
Before Width: | Height: | Size: 3.9 KiB |
|
@ -1,78 +0,0 @@
|
||||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
|
|
||||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
|
||||||
<head>
|
|
||||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
|
||||||
<title>jQuery lightBox plugin</title>
|
|
||||||
|
|
||||||
<link rel="stylesheet" type="text/css" href="../style-projects-jquery.css" />
|
|
||||||
|
|
||||||
<!-- Arquivos utilizados pelo jQuery lightBox plugin -->
|
|
||||||
<script type="text/javascript" src="js/jquery.js"></script>
|
|
||||||
<script type="text/javascript" src="js/jquery.lightbox-0.5.js"></script>
|
|
||||||
<link rel="stylesheet" type="text/css" href="css/jquery.lightbox-0.5.css" media="screen" />
|
|
||||||
<!-- / fim dos arquivos utilizados pelo jQuery lightBox plugin -->
|
|
||||||
|
|
||||||
<!-- Ativando o jQuery lightBox plugin -->
|
|
||||||
<script type="text/javascript">
|
|
||||||
$(function() {
|
|
||||||
$('#gallery a').lightBox();
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
<style type="text/css">
|
|
||||||
/* jQuery lightBox plugin - Gallery style */
|
|
||||||
#gallery {
|
|
||||||
background-color: #444;
|
|
||||||
padding: 10px;
|
|
||||||
width: 520px;
|
|
||||||
}
|
|
||||||
#gallery ul { list-style: none; }
|
|
||||||
#gallery ul li { display: inline; }
|
|
||||||
#gallery ul img {
|
|
||||||
border: 5px solid #3e3e3e;
|
|
||||||
border-width: 5px 5px 20px;
|
|
||||||
}
|
|
||||||
#gallery ul a:hover img {
|
|
||||||
border: 5px solid #fff;
|
|
||||||
border-width: 5px 5px 20px;
|
|
||||||
color: #fff;
|
|
||||||
}
|
|
||||||
#gallery ul a:hover { color: #fff; }
|
|
||||||
</style>
|
|
||||||
</head>
|
|
||||||
|
|
||||||
<body>
|
|
||||||
|
|
||||||
<h2 id="example">Example</h2>
|
|
||||||
<p>Click in the image and see the <strong>jQuery lightBox plugin</strong> in action.</p>
|
|
||||||
<div id="gallery">
|
|
||||||
<ul>
|
|
||||||
<li>
|
|
||||||
<a href="photos/image1.jpg" title="Utilize a flexibilidade dos seletores da jQuery e crie um grupo de imagens como desejar. $('#gallery').lightBox();">
|
|
||||||
<img src="photos/thumb_image1.jpg" width="72" height="72" alt="" />
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<a href="photos/image2.jpg" title="Utilize a flexibilidade dos seletores da jQuery e crie um grupo de imagens como desejar. $('#gallery a').lightBox();">
|
|
||||||
<img src="photos/thumb_image2.jpg" width="72" height="72" alt="" />
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<a href="photos/image3.jpg" title="Utilize a flexibilidade dos seletores da jQuery e crie um grupo de imagens como desejar. $('#gallery a').lightBox();">
|
|
||||||
<img src="photos/thumb_image3.jpg" width="72" height="72" alt="" />
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<a href="photos/image4.jpg" title="Utilize a flexibilidade dos seletores da jQuery e crie um grupo de imagens como desejar. $('#gallery a').lightBox();">
|
|
||||||
<img src="photos/thumb_image4.jpg" width="72" height="72" alt="" />
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<a href="photos/image5.jpg" title="Utilize a flexibilidade dos seletores da jQuery e crie um grupo de imagens como desejar. $('#gallery a').lightBox();">
|
|
||||||
<img src="photos/thumb_image5.jpg" width="72" height="72" alt="" />
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</body>
|
|
||||||
</html>
|
|
|
@ -1,472 +0,0 @@
|
||||||
/**
|
|
||||||
* jQuery lightBox plugin
|
|
||||||
* This jQuery plugin was inspired and based on Lightbox 2 by Lokesh Dhakar (http://www.huddletogether.com/projects/lightbox2/)
|
|
||||||
* and adapted to me for use like a plugin from jQuery.
|
|
||||||
* @name jquery-lightbox-0.5.js
|
|
||||||
* @author Leandro Vieira Pinho - http://leandrovieira.com
|
|
||||||
* @version 0.5
|
|
||||||
* @date April 11, 2008
|
|
||||||
* @category jQuery plugin
|
|
||||||
* @copyright (c) 2008 Leandro Vieira Pinho (leandrovieira.com)
|
|
||||||
* @license CCAttribution-ShareAlike 2.5 Brazil - http://creativecommons.org/licenses/by-sa/2.5/br/deed.en_US
|
|
||||||
* @example Visit http://leandrovieira.com/projects/jquery/lightbox/ for more informations about this jQuery plugin
|
|
||||||
*/
|
|
||||||
|
|
||||||
// Offering a Custom Alias suport - More info: http://docs.jquery.com/Plugins/Authoring#Custom_Alias
|
|
||||||
(function($) {
|
|
||||||
/**
|
|
||||||
* $ is an alias to jQuery object
|
|
||||||
*
|
|
||||||
*/
|
|
||||||
$.fn.lightBox = function(settings) {
|
|
||||||
// Settings to configure the jQuery lightBox plugin how you like
|
|
||||||
settings = jQuery.extend({
|
|
||||||
// Configuration related to overlay
|
|
||||||
overlayBgColor: '#000', // (string) Background color to overlay; inform a hexadecimal value like: #RRGGBB. Where RR, GG, and BB are the hexadecimal values for the red, green, and blue values of the color.
|
|
||||||
overlayOpacity: 0.8, // (integer) Opacity value to overlay; inform: 0.X. Where X are number from 0 to 9
|
|
||||||
// Configuration related to navigation
|
|
||||||
fixedNavigation: false, // (boolean) Boolean that informs if the navigation (next and prev button) will be fixed or not in the interface.
|
|
||||||
// Configuration related to images
|
|
||||||
imageLoading: 'images/lightbox-ico-loading.gif', // (string) Path and the name of the loading icon
|
|
||||||
imageBtnPrev: 'images/lightbox-btn-prev.gif', // (string) Path and the name of the prev button image
|
|
||||||
imageBtnNext: 'images/lightbox-btn-next.gif', // (string) Path and the name of the next button image
|
|
||||||
imageBtnClose: 'images/lightbox-btn-close.gif', // (string) Path and the name of the close btn
|
|
||||||
imageBlank: 'images/lightbox-blank.gif', // (string) Path and the name of a blank image (one pixel)
|
|
||||||
// Configuration related to container image box
|
|
||||||
containerBorderSize: 10, // (integer) If you adjust the padding in the CSS for the container, #lightbox-container-image-box, you will need to update this value
|
|
||||||
containerResizeSpeed: 400, // (integer) Specify the resize duration of container image. These number are miliseconds. 400 is default.
|
|
||||||
// Configuration related to texts in caption. For example: Image 2 of 8. You can alter either "Image" and "of" texts.
|
|
||||||
txtImage: 'Image', // (string) Specify text "Image"
|
|
||||||
txtOf: 'of', // (string) Specify text "of"
|
|
||||||
// Configuration related to keyboard navigation
|
|
||||||
keyToClose: 'c', // (string) (c = close) Letter to close the jQuery lightBox interface. Beyond this letter, the letter X and the SCAPE key is used to.
|
|
||||||
keyToPrev: 'p', // (string) (p = previous) Letter to show the previous image
|
|
||||||
keyToNext: 'n', // (string) (n = next) Letter to show the next image.
|
|
||||||
// Don´t alter these variables in any way
|
|
||||||
imageArray: [],
|
|
||||||
activeImage: 0
|
|
||||||
},settings);
|
|
||||||
// Caching the jQuery object with all elements matched
|
|
||||||
var jQueryMatchedObj = this; // This, in this context, refer to jQuery object
|
|
||||||
/**
|
|
||||||
* Initializing the plugin calling the start function
|
|
||||||
*
|
|
||||||
* @return boolean false
|
|
||||||
*/
|
|
||||||
function _initialize() {
|
|
||||||
_start(this,jQueryMatchedObj); // This, in this context, refer to object (link) which the user have clicked
|
|
||||||
return false; // Avoid the browser following the link
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Start the jQuery lightBox plugin
|
|
||||||
*
|
|
||||||
* @param object objClicked The object (link) whick the user have clicked
|
|
||||||
* @param object jQueryMatchedObj The jQuery object with all elements matched
|
|
||||||
*/
|
|
||||||
function _start(objClicked,jQueryMatchedObj) {
|
|
||||||
// Hime some elements to avoid conflict with overlay in IE. These elements appear above the overlay.
|
|
||||||
$('embed, object, select').css({ 'visibility' : 'hidden' });
|
|
||||||
// Call the function to create the markup structure; style some elements; assign events in some elements.
|
|
||||||
_set_interface();
|
|
||||||
// Unset total images in imageArray
|
|
||||||
settings.imageArray.length = 0;
|
|
||||||
// Unset image active information
|
|
||||||
settings.activeImage = 0;
|
|
||||||
// We have an image set? Or just an image? Let´s see it.
|
|
||||||
if ( jQueryMatchedObj.length == 1 ) {
|
|
||||||
settings.imageArray.push(new Array(objClicked.getAttribute('href'),objClicked.getAttribute('title')));
|
|
||||||
} else {
|
|
||||||
// Add an Array (as many as we have), with href and title atributes, inside the Array that storage the images references
|
|
||||||
for ( var i = 0; i < jQueryMatchedObj.length; i++ ) {
|
|
||||||
settings.imageArray.push(new Array(jQueryMatchedObj[i].getAttribute('href'),jQueryMatchedObj[i].getAttribute('title')));
|
|
||||||
}
|
|
||||||
}
|
|
||||||
while ( settings.imageArray[settings.activeImage][0] != objClicked.getAttribute('href') ) {
|
|
||||||
settings.activeImage++;
|
|
||||||
}
|
|
||||||
// Call the function that prepares image exibition
|
|
||||||
_set_image_to_view();
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Create the jQuery lightBox plugin interface
|
|
||||||
*
|
|
||||||
* The HTML markup will be like that:
|
|
||||||
<div id="jquery-overlay"></div>
|
|
||||||
<div id="jquery-lightbox">
|
|
||||||
<div id="lightbox-container-image-box">
|
|
||||||
<div id="lightbox-container-image">
|
|
||||||
<img src="../fotos/XX.jpg" id="lightbox-image">
|
|
||||||
<div id="lightbox-nav">
|
|
||||||
<a href="#" id="lightbox-nav-btnPrev"></a>
|
|
||||||
<a href="#" id="lightbox-nav-btnNext"></a>
|
|
||||||
</div>
|
|
||||||
<div id="lightbox-loading">
|
|
||||||
<a href="#" id="lightbox-loading-link">
|
|
||||||
<img src="../images/lightbox-ico-loading.gif">
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div id="lightbox-container-image-data-box">
|
|
||||||
<div id="lightbox-container-image-data">
|
|
||||||
<div id="lightbox-image-details">
|
|
||||||
<span id="lightbox-image-details-caption"></span>
|
|
||||||
<span id="lightbox-image-details-currentNumber"></span>
|
|
||||||
</div>
|
|
||||||
<div id="lightbox-secNav">
|
|
||||||
<a href="#" id="lightbox-secNav-btnClose">
|
|
||||||
<img src="../images/lightbox-btn-close.gif">
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
*
|
|
||||||
*/
|
|
||||||
function _set_interface() {
|
|
||||||
// Apply the HTML markup into body tag
|
|
||||||
$('body').append('<div id="jquery-overlay"></div><div id="jquery-lightbox"><div id="lightbox-container-image-box"><div id="lightbox-container-image"><img id="lightbox-image"><div style="" id="lightbox-nav"><a href="#" id="lightbox-nav-btnPrev"></a><a href="#" id="lightbox-nav-btnNext"></a></div><div id="lightbox-loading"><a href="#" id="lightbox-loading-link"><img src="' + settings.imageLoading + '"></a></div></div></div><div id="lightbox-container-image-data-box"><div id="lightbox-container-image-data"><div id="lightbox-image-details"><span id="lightbox-image-details-caption"></span><span id="lightbox-image-details-currentNumber"></span></div><div id="lightbox-secNav"><a href="#" id="lightbox-secNav-btnClose"><img src="' + settings.imageBtnClose + '"></a></div></div></div></div>');
|
|
||||||
// Get page sizes
|
|
||||||
var arrPageSizes = ___getPageSize();
|
|
||||||
// Style overlay and show it
|
|
||||||
$('#jquery-overlay').css({
|
|
||||||
backgroundColor: settings.overlayBgColor,
|
|
||||||
opacity: settings.overlayOpacity,
|
|
||||||
width: arrPageSizes[0],
|
|
||||||
height: arrPageSizes[1]
|
|
||||||
}).fadeIn();
|
|
||||||
// Get page scroll
|
|
||||||
var arrPageScroll = ___getPageScroll();
|
|
||||||
// Calculate top and left offset for the jquery-lightbox div object and show it
|
|
||||||
$('#jquery-lightbox').css({
|
|
||||||
top: arrPageScroll[1] + (arrPageSizes[3] / 10),
|
|
||||||
left: arrPageScroll[0]
|
|
||||||
}).show();
|
|
||||||
// Assigning click events in elements to close overlay
|
|
||||||
$('#jquery-overlay,#jquery-lightbox').click(function() {
|
|
||||||
_finish();
|
|
||||||
});
|
|
||||||
// Assign the _finish function to lightbox-loading-link and lightbox-secNav-btnClose objects
|
|
||||||
$('#lightbox-loading-link,#lightbox-secNav-btnClose').click(function() {
|
|
||||||
_finish();
|
|
||||||
return false;
|
|
||||||
});
|
|
||||||
// If window was resized, calculate the new overlay dimensions
|
|
||||||
$(window).resize(function() {
|
|
||||||
// Get page sizes
|
|
||||||
var arrPageSizes = ___getPageSize();
|
|
||||||
// Style overlay and show it
|
|
||||||
$('#jquery-overlay').css({
|
|
||||||
width: arrPageSizes[0],
|
|
||||||
height: arrPageSizes[1]
|
|
||||||
});
|
|
||||||
// Get page scroll
|
|
||||||
var arrPageScroll = ___getPageScroll();
|
|
||||||
// Calculate top and left offset for the jquery-lightbox div object and show it
|
|
||||||
$('#jquery-lightbox').css({
|
|
||||||
top: arrPageScroll[1] + (arrPageSizes[3] / 10),
|
|
||||||
left: arrPageScroll[0]
|
|
||||||
});
|
|
||||||
});
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Prepares image exibition; doing a image´s preloader to calculate it´s size
|
|
||||||
*
|
|
||||||
*/
|
|
||||||
function _set_image_to_view() { // show the loading
|
|
||||||
// Show the loading
|
|
||||||
$('#lightbox-loading').show();
|
|
||||||
if ( settings.fixedNavigation ) {
|
|
||||||
$('#lightbox-image,#lightbox-container-image-data-box,#lightbox-image-details-currentNumber').hide();
|
|
||||||
} else {
|
|
||||||
// Hide some elements
|
|
||||||
$('#lightbox-image,#lightbox-nav,#lightbox-nav-btnPrev,#lightbox-nav-btnNext,#lightbox-container-image-data-box,#lightbox-image-details-currentNumber').hide();
|
|
||||||
}
|
|
||||||
// Image preload process
|
|
||||||
var objImagePreloader = new Image();
|
|
||||||
objImagePreloader.onload = function() {
|
|
||||||
$('#lightbox-image').attr('src',settings.imageArray[settings.activeImage][0]);
|
|
||||||
// Perfomance an effect in the image container resizing it
|
|
||||||
_resize_container_image_box(objImagePreloader.width,objImagePreloader.height);
|
|
||||||
// clear onLoad, IE behaves irratically with animated gifs otherwise
|
|
||||||
objImagePreloader.onload=function(){};
|
|
||||||
};
|
|
||||||
objImagePreloader.src = settings.imageArray[settings.activeImage][0];
|
|
||||||
};
|
|
||||||
/**
|
|
||||||
* Perfomance an effect in the image container resizing it
|
|
||||||
*
|
|
||||||
* @param integer intImageWidth The image´s width that will be showed
|
|
||||||
* @param integer intImageHeight The image´s height that will be showed
|
|
||||||
*/
|
|
||||||
function _resize_container_image_box(intImageWidth,intImageHeight) {
|
|
||||||
// Get current width and height
|
|
||||||
var intCurrentWidth = $('#lightbox-container-image-box').width();
|
|
||||||
var intCurrentHeight = $('#lightbox-container-image-box').height();
|
|
||||||
// Get the width and height of the selected image plus the padding
|
|
||||||
var intWidth = (intImageWidth + (settings.containerBorderSize * 2)); // Plus the image´s width and the left and right padding value
|
|
||||||
var intHeight = (intImageHeight + (settings.containerBorderSize * 2)); // Plus the image´s height and the left and right padding value
|
|
||||||
// Diferences
|
|
||||||
var intDiffW = intCurrentWidth - intWidth;
|
|
||||||
var intDiffH = intCurrentHeight - intHeight;
|
|
||||||
// Perfomance the effect
|
|
||||||
$('#lightbox-container-image-box').animate({ width: intWidth, height: intHeight },settings.containerResizeSpeed,function() { _show_image(); });
|
|
||||||
if ( ( intDiffW == 0 ) && ( intDiffH == 0 ) ) {
|
|
||||||
if ( $.browser.msie ) {
|
|
||||||
___pause(250);
|
|
||||||
} else {
|
|
||||||
___pause(100);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
$('#lightbox-container-image-data-box').css({ width: intImageWidth });
|
|
||||||
$('#lightbox-nav-btnPrev,#lightbox-nav-btnNext').css({ height: intImageHeight + (settings.containerBorderSize * 2) });
|
|
||||||
};
|
|
||||||
/**
|
|
||||||
* Show the prepared image
|
|
||||||
*
|
|
||||||
*/
|
|
||||||
function _show_image() {
|
|
||||||
$('#lightbox-loading').hide();
|
|
||||||
$('#lightbox-image').fadeIn(function() {
|
|
||||||
_show_image_data();
|
|
||||||
_set_navigation();
|
|
||||||
});
|
|
||||||
_preload_neighbor_images();
|
|
||||||
};
|
|
||||||
/**
|
|
||||||
* Show the image information
|
|
||||||
*
|
|
||||||
*/
|
|
||||||
function _show_image_data() {
|
|
||||||
$('#lightbox-container-image-data-box').slideDown('fast');
|
|
||||||
$('#lightbox-image-details-caption').hide();
|
|
||||||
if ( settings.imageArray[settings.activeImage][1] ) {
|
|
||||||
$('#lightbox-image-details-caption').html(settings.imageArray[settings.activeImage][1]).show();
|
|
||||||
}
|
|
||||||
// If we have a image set, display 'Image X of X'
|
|
||||||
if ( settings.imageArray.length > 1 ) {
|
|
||||||
$('#lightbox-image-details-currentNumber').html(settings.txtImage + ' ' + ( settings.activeImage + 1 ) + ' ' + settings.txtOf + ' ' + settings.imageArray.length).show();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Display the button navigations
|
|
||||||
*
|
|
||||||
*/
|
|
||||||
function _set_navigation() {
|
|
||||||
$('#lightbox-nav').show();
|
|
||||||
|
|
||||||
// Instead to define this configuration in CSS file, we define here. And it´s need to IE. Just.
|
|
||||||
$('#lightbox-nav-btnPrev,#lightbox-nav-btnNext').css({ 'background' : 'transparent url(' + settings.imageBlank + ') no-repeat' });
|
|
||||||
|
|
||||||
// Show the prev button, if not the first image in set
|
|
||||||
if ( settings.activeImage != 0 ) {
|
|
||||||
if ( settings.fixedNavigation ) {
|
|
||||||
$('#lightbox-nav-btnPrev').css({ 'background' : 'url(' + settings.imageBtnPrev + ') left 15% no-repeat' })
|
|
||||||
.unbind()
|
|
||||||
.bind('click',function() {
|
|
||||||
settings.activeImage = settings.activeImage - 1;
|
|
||||||
_set_image_to_view();
|
|
||||||
return false;
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
// Show the images button for Next buttons
|
|
||||||
$('#lightbox-nav-btnPrev').unbind().hover(function() {
|
|
||||||
$(this).css({ 'background' : 'url(' + settings.imageBtnPrev + ') left 15% no-repeat' });
|
|
||||||
},function() {
|
|
||||||
$(this).css({ 'background' : 'transparent url(' + settings.imageBlank + ') no-repeat' });
|
|
||||||
}).show().bind('click',function() {
|
|
||||||
settings.activeImage = settings.activeImage - 1;
|
|
||||||
_set_image_to_view();
|
|
||||||
return false;
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// Show the next button, if not the last image in set
|
|
||||||
if ( settings.activeImage != ( settings.imageArray.length -1 ) ) {
|
|
||||||
if ( settings.fixedNavigation ) {
|
|
||||||
$('#lightbox-nav-btnNext').css({ 'background' : 'url(' + settings.imageBtnNext + ') right 15% no-repeat' })
|
|
||||||
.unbind()
|
|
||||||
.bind('click',function() {
|
|
||||||
settings.activeImage = settings.activeImage + 1;
|
|
||||||
_set_image_to_view();
|
|
||||||
return false;
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
// Show the images button for Next buttons
|
|
||||||
$('#lightbox-nav-btnNext').unbind().hover(function() {
|
|
||||||
$(this).css({ 'background' : 'url(' + settings.imageBtnNext + ') right 15% no-repeat' });
|
|
||||||
},function() {
|
|
||||||
$(this).css({ 'background' : 'transparent url(' + settings.imageBlank + ') no-repeat' });
|
|
||||||
}).show().bind('click',function() {
|
|
||||||
settings.activeImage = settings.activeImage + 1;
|
|
||||||
_set_image_to_view();
|
|
||||||
return false;
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
// Enable keyboard navigation
|
|
||||||
_enable_keyboard_navigation();
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Enable a support to keyboard navigation
|
|
||||||
*
|
|
||||||
*/
|
|
||||||
function _enable_keyboard_navigation() {
|
|
||||||
$(document).keydown(function(objEvent) {
|
|
||||||
_keyboard_action(objEvent);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Disable the support to keyboard navigation
|
|
||||||
*
|
|
||||||
*/
|
|
||||||
function _disable_keyboard_navigation() {
|
|
||||||
$(document).unbind();
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Perform the keyboard actions
|
|
||||||
*
|
|
||||||
*/
|
|
||||||
function _keyboard_action(objEvent) {
|
|
||||||
// To ie
|
|
||||||
if ( objEvent == null ) {
|
|
||||||
keycode = event.keyCode;
|
|
||||||
escapeKey = 27;
|
|
||||||
// To Mozilla
|
|
||||||
} else {
|
|
||||||
keycode = objEvent.keyCode;
|
|
||||||
escapeKey = objEvent.DOM_VK_ESCAPE;
|
|
||||||
}
|
|
||||||
// Get the key in lower case form
|
|
||||||
key = String.fromCharCode(keycode).toLowerCase();
|
|
||||||
// Verify the keys to close the ligthBox
|
|
||||||
if ( ( key == settings.keyToClose ) || ( key == 'x' ) || ( keycode == escapeKey ) ) {
|
|
||||||
_finish();
|
|
||||||
}
|
|
||||||
// Verify the key to show the previous image
|
|
||||||
if ( ( key == settings.keyToPrev ) || ( keycode == 37 ) ) {
|
|
||||||
// If we´re not showing the first image, call the previous
|
|
||||||
if ( settings.activeImage != 0 ) {
|
|
||||||
settings.activeImage = settings.activeImage - 1;
|
|
||||||
_set_image_to_view();
|
|
||||||
_disable_keyboard_navigation();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
// Verify the key to show the next image
|
|
||||||
if ( ( key == settings.keyToNext ) || ( keycode == 39 ) ) {
|
|
||||||
// If we´re not showing the last image, call the next
|
|
||||||
if ( settings.activeImage != ( settings.imageArray.length - 1 ) ) {
|
|
||||||
settings.activeImage = settings.activeImage + 1;
|
|
||||||
_set_image_to_view();
|
|
||||||
_disable_keyboard_navigation();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Preload prev and next images being showed
|
|
||||||
*
|
|
||||||
*/
|
|
||||||
function _preload_neighbor_images() {
|
|
||||||
if ( (settings.imageArray.length -1) > settings.activeImage ) {
|
|
||||||
objNext = new Image();
|
|
||||||
objNext.src = settings.imageArray[settings.activeImage + 1][0];
|
|
||||||
}
|
|
||||||
if ( settings.activeImage > 0 ) {
|
|
||||||
objPrev = new Image();
|
|
||||||
objPrev.src = settings.imageArray[settings.activeImage -1][0];
|
|
||||||
}
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Remove jQuery lightBox plugin HTML markup
|
|
||||||
*
|
|
||||||
*/
|
|
||||||
function _finish() {
|
|
||||||
$('#jquery-lightbox').remove();
|
|
||||||
$('#jquery-overlay').fadeOut(function() { $('#jquery-overlay').remove(); });
|
|
||||||
// Show some elements to avoid conflict with overlay in IE. These elements appear above the overlay.
|
|
||||||
$('embed, object, select').css({ 'visibility' : 'visible' });
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
/ THIRD FUNCTION
|
|
||||||
* getPageSize() by quirksmode.com
|
|
||||||
*
|
|
||||||
* @return Array Return an array with page width, height and window width, height
|
|
||||||
*/
|
|
||||||
function ___getPageSize() {
|
|
||||||
var xScroll, yScroll;
|
|
||||||
if (window.innerHeight && window.scrollMaxY) {
|
|
||||||
xScroll = window.innerWidth + window.scrollMaxX;
|
|
||||||
yScroll = window.innerHeight + window.scrollMaxY;
|
|
||||||
} else if (document.body.scrollHeight > document.body.offsetHeight){ // all but Explorer Mac
|
|
||||||
xScroll = document.body.scrollWidth;
|
|
||||||
yScroll = document.body.scrollHeight;
|
|
||||||
} else { // Explorer Mac...would also work in Explorer 6 Strict, Mozilla and Safari
|
|
||||||
xScroll = document.body.offsetWidth;
|
|
||||||
yScroll = document.body.offsetHeight;
|
|
||||||
}
|
|
||||||
var windowWidth, windowHeight;
|
|
||||||
if (self.innerHeight) { // all except Explorer
|
|
||||||
if(document.documentElement.clientWidth){
|
|
||||||
windowWidth = document.documentElement.clientWidth;
|
|
||||||
} else {
|
|
||||||
windowWidth = self.innerWidth;
|
|
||||||
}
|
|
||||||
windowHeight = self.innerHeight;
|
|
||||||
} else if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode
|
|
||||||
windowWidth = document.documentElement.clientWidth;
|
|
||||||
windowHeight = document.documentElement.clientHeight;
|
|
||||||
} else if (document.body) { // other Explorers
|
|
||||||
windowWidth = document.body.clientWidth;
|
|
||||||
windowHeight = document.body.clientHeight;
|
|
||||||
}
|
|
||||||
// for small pages with total height less then height of the viewport
|
|
||||||
if(yScroll < windowHeight){
|
|
||||||
pageHeight = windowHeight;
|
|
||||||
} else {
|
|
||||||
pageHeight = yScroll;
|
|
||||||
}
|
|
||||||
// for small pages with total width less then width of the viewport
|
|
||||||
if(xScroll < windowWidth){
|
|
||||||
pageWidth = xScroll;
|
|
||||||
} else {
|
|
||||||
pageWidth = windowWidth;
|
|
||||||
}
|
|
||||||
arrayPageSize = new Array(pageWidth,pageHeight,windowWidth,windowHeight);
|
|
||||||
return arrayPageSize;
|
|
||||||
};
|
|
||||||
/**
|
|
||||||
/ THIRD FUNCTION
|
|
||||||
* getPageScroll() by quirksmode.com
|
|
||||||
*
|
|
||||||
* @return Array Return an array with x,y page scroll values.
|
|
||||||
*/
|
|
||||||
function ___getPageScroll() {
|
|
||||||
var xScroll, yScroll;
|
|
||||||
if (self.pageYOffset) {
|
|
||||||
yScroll = self.pageYOffset;
|
|
||||||
xScroll = self.pageXOffset;
|
|
||||||
} else if (document.documentElement && document.documentElement.scrollTop) { // Explorer 6 Strict
|
|
||||||
yScroll = document.documentElement.scrollTop;
|
|
||||||
xScroll = document.documentElement.scrollLeft;
|
|
||||||
} else if (document.body) {// all other Explorers
|
|
||||||
yScroll = document.body.scrollTop;
|
|
||||||
xScroll = document.body.scrollLeft;
|
|
||||||
}
|
|
||||||
arrayPageScroll = new Array(xScroll,yScroll);
|
|
||||||
return arrayPageScroll;
|
|
||||||
};
|
|
||||||
/**
|
|
||||||
* Stop the code execution from a escified time in milisecond
|
|
||||||
*
|
|
||||||
*/
|
|
||||||
function ___pause(ms) {
|
|
||||||
var date = new Date();
|
|
||||||
curDate = null;
|
|
||||||
do { var curDate = new Date(); }
|
|
||||||
while ( curDate - date < ms);
|
|
||||||
};
|
|
||||||
// Return the jQuery object for chaining. The unbind method is used to avoid click conflict when the plugin is called more than once
|
|
||||||
return this.unbind('click').click(_initialize);
|
|
||||||
};
|
|
||||||
})(jQuery); // Call and execute the function immediately passing the jQuery object
|
|
|
@ -1,42 +0,0 @@
|
||||||
/**
|
|
||||||
* jQuery lightBox plugin
|
|
||||||
* This jQuery plugin was inspired and based on Lightbox 2 by Lokesh Dhakar (http://www.huddletogether.com/projects/lightbox2/)
|
|
||||||
* and adapted to me for use like a plugin from jQuery.
|
|
||||||
* @name jquery-lightbox-0.5.js
|
|
||||||
* @author Leandro Vieira Pinho - http://leandrovieira.com
|
|
||||||
* @version 0.5
|
|
||||||
* @date April 11, 2008
|
|
||||||
* @category jQuery plugin
|
|
||||||
* @copyright (c) 2008 Leandro Vieira Pinho (leandrovieira.com)
|
|
||||||
* @license CCAttribution-ShareAlike 2.5 Brazil - http://creativecommons.org/licenses/by-sa/2.5/br/deed.en_US
|
|
||||||
* @example Visit http://leandrovieira.com/projects/jquery/lightbox/ for more informations about this jQuery plugin
|
|
||||||
*/
|
|
||||||
(function($){$.fn.lightBox=function(settings){settings=jQuery.extend({overlayBgColor:'#000',overlayOpacity:0.8,fixedNavigation:false,imageLoading:'images/lightbox-ico-loading.gif',imageBtnPrev:'images/lightbox-btn-prev.gif',imageBtnNext:'images/lightbox-btn-next.gif',imageBtnClose:'images/lightbox-btn-close.gif',imageBlank:'images/lightbox-blank.gif',containerBorderSize:10,containerResizeSpeed:400,txtImage:'Image',txtOf:'of',keyToClose:'c',keyToPrev:'p',keyToNext:'n',imageArray:[],activeImage:0},settings);var jQueryMatchedObj=this;function _initialize(){_start(this,jQueryMatchedObj);return false;}
|
|
||||||
function _start(objClicked,jQueryMatchedObj){$('embed, object, select').css({'visibility':'hidden'});_set_interface();settings.imageArray.length=0;settings.activeImage=0;if(jQueryMatchedObj.length==1){settings.imageArray.push(new Array(objClicked.getAttribute('href'),objClicked.getAttribute('title')));}else{for(var i=0;i<jQueryMatchedObj.length;i++){settings.imageArray.push(new Array(jQueryMatchedObj[i].getAttribute('href'),jQueryMatchedObj[i].getAttribute('title')));}}
|
|
||||||
while(settings.imageArray[settings.activeImage][0]!=objClicked.getAttribute('href')){settings.activeImage++;}
|
|
||||||
_set_image_to_view();}
|
|
||||||
function _set_interface(){$('body').append('<div id="jquery-overlay"></div><div id="jquery-lightbox"><div id="lightbox-container-image-box"><div id="lightbox-container-image"><img id="lightbox-image"><div style="" id="lightbox-nav"><a href="#" id="lightbox-nav-btnPrev"></a><a href="#" id="lightbox-nav-btnNext"></a></div><div id="lightbox-loading"><a href="#" id="lightbox-loading-link"><img src="'+settings.imageLoading+'"></a></div></div></div><div id="lightbox-container-image-data-box"><div id="lightbox-container-image-data"><div id="lightbox-image-details"><span id="lightbox-image-details-caption"></span><span id="lightbox-image-details-currentNumber"></span></div><div id="lightbox-secNav"><a href="#" id="lightbox-secNav-btnClose"><img src="'+settings.imageBtnClose+'"></a></div></div></div></div>');var arrPageSizes=___getPageSize();$('#jquery-overlay').css({backgroundColor:settings.overlayBgColor,opacity:settings.overlayOpacity,width:arrPageSizes[0],height:arrPageSizes[1]}).fadeIn();var arrPageScroll=___getPageScroll();$('#jquery-lightbox').css({top:arrPageScroll[1]+(arrPageSizes[3]/10),left:arrPageScroll[0]}).show();$('#jquery-overlay,#jquery-lightbox').click(function(){_finish();});$('#lightbox-loading-link,#lightbox-secNav-btnClose').click(function(){_finish();return false;});$(window).resize(function(){var arrPageSizes=___getPageSize();$('#jquery-overlay').css({width:arrPageSizes[0],height:arrPageSizes[1]});var arrPageScroll=___getPageScroll();$('#jquery-lightbox').css({top:arrPageScroll[1]+(arrPageSizes[3]/10),left:arrPageScroll[0]});});}
|
|
||||||
function _set_image_to_view(){$('#lightbox-loading').show();if(settings.fixedNavigation){$('#lightbox-image,#lightbox-container-image-data-box,#lightbox-image-details-currentNumber').hide();}else{$('#lightbox-image,#lightbox-nav,#lightbox-nav-btnPrev,#lightbox-nav-btnNext,#lightbox-container-image-data-box,#lightbox-image-details-currentNumber').hide();}
|
|
||||||
var objImagePreloader=new Image();objImagePreloader.onload=function(){$('#lightbox-image').attr('src',settings.imageArray[settings.activeImage][0]);_resize_container_image_box(objImagePreloader.width,objImagePreloader.height);objImagePreloader.onload=function(){};};objImagePreloader.src=settings.imageArray[settings.activeImage][0];};function _resize_container_image_box(intImageWidth,intImageHeight){var intCurrentWidth=$('#lightbox-container-image-box').width();var intCurrentHeight=$('#lightbox-container-image-box').height();var intWidth=(intImageWidth+(settings.containerBorderSize*2));var intHeight=(intImageHeight+(settings.containerBorderSize*2));var intDiffW=intCurrentWidth-intWidth;var intDiffH=intCurrentHeight-intHeight;$('#lightbox-container-image-box').animate({width:intWidth,height:intHeight},settings.containerResizeSpeed,function(){_show_image();});if((intDiffW==0)&&(intDiffH==0)){if($.browser.msie){___pause(250);}else{___pause(100);}}
|
|
||||||
$('#lightbox-container-image-data-box').css({width:intImageWidth});$('#lightbox-nav-btnPrev,#lightbox-nav-btnNext').css({height:intImageHeight+(settings.containerBorderSize*2)});};function _show_image(){$('#lightbox-loading').hide();$('#lightbox-image').fadeIn(function(){_show_image_data();_set_navigation();});_preload_neighbor_images();};function _show_image_data(){$('#lightbox-container-image-data-box').slideDown('fast');$('#lightbox-image-details-caption').hide();if(settings.imageArray[settings.activeImage][1]){$('#lightbox-image-details-caption').html(settings.imageArray[settings.activeImage][1]).show();}
|
|
||||||
if(settings.imageArray.length>1){$('#lightbox-image-details-currentNumber').html(settings.txtImage+' '+(settings.activeImage+1)+' '+settings.txtOf+' '+settings.imageArray.length).show();}}
|
|
||||||
function _set_navigation(){$('#lightbox-nav').show();$('#lightbox-nav-btnPrev,#lightbox-nav-btnNext').css({'background':'transparent url('+settings.imageBlank+') no-repeat'});if(settings.activeImage!=0){if(settings.fixedNavigation){$('#lightbox-nav-btnPrev').css({'background':'url('+settings.imageBtnPrev+') left 15% no-repeat'}).unbind().bind('click',function(){settings.activeImage=settings.activeImage-1;_set_image_to_view();return false;});}else{$('#lightbox-nav-btnPrev').unbind().hover(function(){$(this).css({'background':'url('+settings.imageBtnPrev+') left 15% no-repeat'});},function(){$(this).css({'background':'transparent url('+settings.imageBlank+') no-repeat'});}).show().bind('click',function(){settings.activeImage=settings.activeImage-1;_set_image_to_view();return false;});}}
|
|
||||||
if(settings.activeImage!=(settings.imageArray.length-1)){if(settings.fixedNavigation){$('#lightbox-nav-btnNext').css({'background':'url('+settings.imageBtnNext+') right 15% no-repeat'}).unbind().bind('click',function(){settings.activeImage=settings.activeImage+1;_set_image_to_view();return false;});}else{$('#lightbox-nav-btnNext').unbind().hover(function(){$(this).css({'background':'url('+settings.imageBtnNext+') right 15% no-repeat'});},function(){$(this).css({'background':'transparent url('+settings.imageBlank+') no-repeat'});}).show().bind('click',function(){settings.activeImage=settings.activeImage+1;_set_image_to_view();return false;});}}
|
|
||||||
_enable_keyboard_navigation();}
|
|
||||||
function _enable_keyboard_navigation(){$(document).keydown(function(objEvent){_keyboard_action(objEvent);});}
|
|
||||||
function _disable_keyboard_navigation(){$(document).unbind();}
|
|
||||||
function _keyboard_action(objEvent){if(objEvent==null){keycode=event.keyCode;escapeKey=27;}else{keycode=objEvent.keyCode;escapeKey=objEvent.DOM_VK_ESCAPE;}
|
|
||||||
key=String.fromCharCode(keycode).toLowerCase();if((key==settings.keyToClose)||(key=='x')||(keycode==escapeKey)){_finish();}
|
|
||||||
if((key==settings.keyToPrev)||(keycode==37)){if(settings.activeImage!=0){settings.activeImage=settings.activeImage-1;_set_image_to_view();_disable_keyboard_navigation();}}
|
|
||||||
if((key==settings.keyToNext)||(keycode==39)){if(settings.activeImage!=(settings.imageArray.length-1)){settings.activeImage=settings.activeImage+1;_set_image_to_view();_disable_keyboard_navigation();}}}
|
|
||||||
function _preload_neighbor_images(){if((settings.imageArray.length-1)>settings.activeImage){objNext=new Image();objNext.src=settings.imageArray[settings.activeImage+1][0];}
|
|
||||||
if(settings.activeImage>0){objPrev=new Image();objPrev.src=settings.imageArray[settings.activeImage-1][0];}}
|
|
||||||
function _finish(){$('#jquery-lightbox').remove();$('#jquery-overlay').fadeOut(function(){$('#jquery-overlay').remove();});$('embed, object, select').css({'visibility':'visible'});}
|
|
||||||
function ___getPageSize(){var xScroll,yScroll;if(window.innerHeight&&window.scrollMaxY){xScroll=window.innerWidth+window.scrollMaxX;yScroll=window.innerHeight+window.scrollMaxY;}else if(document.body.scrollHeight>document.body.offsetHeight){xScroll=document.body.scrollWidth;yScroll=document.body.scrollHeight;}else{xScroll=document.body.offsetWidth;yScroll=document.body.offsetHeight;}
|
|
||||||
var windowWidth,windowHeight;if(self.innerHeight){if(document.documentElement.clientWidth){windowWidth=document.documentElement.clientWidth;}else{windowWidth=self.innerWidth;}
|
|
||||||
windowHeight=self.innerHeight;}else if(document.documentElement&&document.documentElement.clientHeight){windowWidth=document.documentElement.clientWidth;windowHeight=document.documentElement.clientHeight;}else if(document.body){windowWidth=document.body.clientWidth;windowHeight=document.body.clientHeight;}
|
|
||||||
if(yScroll<windowHeight){pageHeight=windowHeight;}else{pageHeight=yScroll;}
|
|
||||||
if(xScroll<windowWidth){pageWidth=xScroll;}else{pageWidth=windowWidth;}
|
|
||||||
arrayPageSize=new Array(pageWidth,pageHeight,windowWidth,windowHeight);return arrayPageSize;};function ___getPageScroll(){var xScroll,yScroll;if(self.pageYOffset){yScroll=self.pageYOffset;xScroll=self.pageXOffset;}else if(document.documentElement&&document.documentElement.scrollTop){yScroll=document.documentElement.scrollTop;xScroll=document.documentElement.scrollLeft;}else if(document.body){yScroll=document.body.scrollTop;xScroll=document.body.scrollLeft;}
|
|
||||||
arrayPageScroll=new Array(xScroll,yScroll);return arrayPageScroll;};function ___pause(ms){var date=new Date();curDate=null;do{var curDate=new Date();}
|
|
||||||
while(curDate-date<ms);};return this.unbind('click').click(_initialize);};})(jQuery);
|
|
Before Width: | Height: | Size: 20 KiB |
Before Width: | Height: | Size: 44 KiB |
Before Width: | Height: | Size: 38 KiB |
Before Width: | Height: | Size: 18 KiB |
Before Width: | Height: | Size: 30 KiB |
Before Width: | Height: | Size: 2.0 KiB |
Before Width: | Height: | Size: 2.5 KiB |
Before Width: | Height: | Size: 2.2 KiB |
Before Width: | Height: | Size: 1.9 KiB |
Before Width: | Height: | Size: 2.0 KiB |
|
@ -962,6 +962,10 @@ aside #side-peoplefind-url {
|
||||||
widht: 55px;
|
widht: 55px;
|
||||||
height: 55px;
|
height: 55px;
|
||||||
}
|
}
|
||||||
|
#lost-password-link {
|
||||||
|
float: left;
|
||||||
|
margin-right: 20px;
|
||||||
|
}
|
||||||
/* widget */
|
/* widget */
|
||||||
.widget {
|
.widget {
|
||||||
margin-bottom: 2em;
|
margin-bottom: 2em;
|
||||||
|
@ -1058,7 +1062,8 @@ body .pageheader{
|
||||||
padding: 10px;
|
padding: 10px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
font-size: 1.0em;
|
font-size: 1.0em;
|
||||||
margin-top: 140%;
|
clear: both;
|
||||||
|
display: block;
|
||||||
}
|
}
|
||||||
.tabs {
|
.tabs {
|
||||||
|
|
||||||
|
|
|
@ -13,11 +13,6 @@ $a->theme_info = array(
|
||||||
|
|
||||||
$a->page['htmlhead'] .= <<< EOT
|
$a->page['htmlhead'] .= <<< EOT
|
||||||
|
|
||||||
|
|
||||||
<script type="text/javascript" src="view/theme/diabook/lightbox/js/jquery.lightbox-0.5.js"></script>
|
|
||||||
<link rel="stylesheet" type="text/css" href="view/theme/diabook/lightbox/css/jquery.lightbox-0.5.css" media="screen" />
|
|
||||||
|
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
|
||||||
//contacts
|
//contacts
|
||||||
|
@ -80,7 +75,7 @@ $('html').click(function() {
|
||||||
});
|
});
|
||||||
|
|
||||||
$(function() {
|
$(function() {
|
||||||
$('a.lightbox').lightBox(); // Select all links with lightbox class
|
$('a.lightbox').fancybox(); // Select all links with lightbox class
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
|
|
|
@ -5,6 +5,8 @@ $a->page['htmlhead'] .= <<< EOT
|
||||||
<script>
|
<script>
|
||||||
$(document).ready(function() {
|
$(document).ready(function() {
|
||||||
|
|
||||||
|
$('html').click(function() { $("#nav-notifications-menu" ).hide(); });
|
||||||
|
|
||||||
$('.group-edit-icon').hover(
|
$('.group-edit-icon').hover(
|
||||||
function() {
|
function() {
|
||||||
$(this).addClass('icon'); $(this).removeClass('iconspacer');},
|
$(this).addClass('icon'); $(this).removeClass('iconspacer');},
|
||||||
|
|
|
@ -7,6 +7,8 @@ $a->page['htmlhead'] .= <<< EOT
|
||||||
<script>
|
<script>
|
||||||
$(document).ready(function() {
|
$(document).ready(function() {
|
||||||
|
|
||||||
|
$('html').click(function() { $("#nav-notifications-menu" ).hide(); });
|
||||||
|
|
||||||
$('.group-edit-icon').hover(
|
$('.group-edit-icon').hover(
|
||||||
function() {
|
function() {
|
||||||
$(this).addClass('icon'); $(this).removeClass('iconspacer');},
|
$(this).addClass('icon'); $(this).removeClass('iconspacer');},
|
||||||
|
|
|
@ -7,6 +7,8 @@ $a->page['htmlhead'] .= <<< EOT
|
||||||
<script>
|
<script>
|
||||||
$(document).ready(function() {
|
$(document).ready(function() {
|
||||||
|
|
||||||
|
$('html').click(function() { $("#nav-notifications-menu" ).hide(); });
|
||||||
|
|
||||||
$('.group-edit-icon').hover(
|
$('.group-edit-icon').hover(
|
||||||
function() {
|
function() {
|
||||||
$(this).addClass('icon'); $(this).removeClass('iconspacer');},
|
$(this).addClass('icon'); $(this).removeClass('iconspacer');},
|
||||||
|
|
|
@ -7,6 +7,8 @@ $a->page['htmlhead'] .= <<< EOT
|
||||||
<script>
|
<script>
|
||||||
$(document).ready(function() {
|
$(document).ready(function() {
|
||||||
|
|
||||||
|
$('html').click(function() { $("#nav-notifications-menu" ).hide(); });
|
||||||
|
|
||||||
$('.group-edit-icon').hover(
|
$('.group-edit-icon').hover(
|
||||||
function() {
|
function() {
|
||||||
$(this).addClass('icon'); $(this).removeClass('iconspacer');},
|
$(this).addClass('icon'); $(this).removeClass('iconspacer');},
|
||||||
|
|
|
@ -7,3 +7,12 @@
|
||||||
* Author: Devlon Duthied
|
* Author: Devlon Duthied
|
||||||
* Maintainer: Mike Macgirvin <mike@macgirvin.com>
|
* Maintainer: Mike Macgirvin <mike@macgirvin.com>
|
||||||
*/
|
*/
|
||||||
|
|
||||||
|
$a->page['htmlhead'] .= <<< EOT
|
||||||
|
<script>
|
||||||
|
$(document).ready(function() {
|
||||||
|
|
||||||
|
$('html').click(function() { $("#nav-notifications-menu" ).hide(); });
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
EOT;
|
||||||
|
|