diff --git a/autoload.js b/autoload.js
new file mode 100644
index 0000000..7961f8d
--- /dev/null
+++ b/autoload.js
@@ -0,0 +1,22 @@
+// AUTOLOAD CODE BLOCK (MAY BE CHANGED OR REMOVED)
+addListener(window, 'load', function(){
+ if (!/android|iphone|ipod|series60|symbian|windows ce|blackberry/i.test(navigator.userAgent)) {
+ var as = document.getElementsByTagName('A');
+ var links = [];
+ var w = 100*Math.floor((document.documentElement.offsetWidth*0.8)/100);
+ var h = 100*Math.floor((document.documentElement.offsetHeight*0.8)/100);
+ var t;
+ for (var i = 0; i < as.length; i++) {
+ if (as[i].getAttribute('rel') == 'lightbox') {
+ t = as[i].title;
+ t += ' '+(t?'(с':'С')+'м. полный размер'+(t?')':'')+'';
+ links.push({
+ element: as[i],
+ url: as[i].href + (as[i].href.indexOf('?') ? '&' : '?') + ('w='+w+'&h='+h),
+ title: t
+ });
+ }
+ }
+ setSlimbox(links);
+ }
+});
diff --git a/closelabel.gif b/closelabel.gif
new file mode 100644
index 0000000..af0cab2
Binary files /dev/null and b/closelabel.gif differ
diff --git a/loading.gif b/loading.gif
new file mode 100644
index 0000000..6371884
Binary files /dev/null and b/loading.gif differ
diff --git a/next.png b/next.png
new file mode 100644
index 0000000..40b5884
Binary files /dev/null and b/next.png differ
diff --git a/nextlabel.gif b/nextlabel.gif
new file mode 100644
index 0000000..7c66121
Binary files /dev/null and b/nextlabel.gif differ
diff --git a/prev.png b/prev.png
new file mode 100644
index 0000000..6f50afd
Binary files /dev/null and b/prev.png differ
diff --git a/prevlabel.gif b/prevlabel.gif
new file mode 100644
index 0000000..0641876
Binary files /dev/null and b/prevlabel.gif differ
diff --git a/slimbox2-rtl.css b/slimbox2-rtl.css
new file mode 100644
index 0000000..d59e371
--- /dev/null
+++ b/slimbox2-rtl.css
@@ -0,0 +1,84 @@
+/* SLIMBOX */
+
+#lbOverlay {
+ position: fixed;
+ z-index: 9999;
+ left: 0;
+ top: 0;
+ width: 100%;
+ height: 100%;
+ background-color: #000;
+ cursor: pointer;
+}
+
+#lbCenter, #lbBottomContainer {
+ position: absolute;
+ z-index: 9999;
+ overflow: hidden;
+ background-color: #fff;
+}
+
+.lbLoading {
+ background: #fff url(loading.gif) no-repeat center;
+}
+
+#lbImage {
+ position: absolute;
+ left: 0;
+ top: 0;
+ border: 10px solid #fff;
+ background-repeat: no-repeat;
+}
+
+#lbPrevLink, #lbNextLink {
+ display: block;
+ position: absolute;
+ top: 0;
+ width: 50%;
+ outline: none;
+}
+
+#lbPrevLink {
+ right: 0;
+}
+
+#lbPrevLink:hover {
+ background: transparent url(prevlabel.gif) no-repeat 100% 15%;
+}
+
+#lbNextLink {
+ left: 0;
+}
+
+#lbNextLink:hover {
+ background: transparent url(nextlabel.gif) no-repeat 0 15%;
+}
+
+#lbBottom {
+ font-family: Verdana, Arial, Geneva, Helvetica, sans-serif;
+ font-size: 10px;
+ color: #666;
+ line-height: 1.4em;
+ text-align: right;
+ border: 10px solid #fff;
+ border-top-style: none;
+ direction: rtl;
+}
+
+#lbCloseLink {
+ display: block;
+ float: left;
+ width: 66px;
+ height: 22px;
+ background: transparent url(closelabel.gif) no-repeat center;
+ margin: 5px 0;
+ outline: none;
+}
+
+#lbCaption, #lbNumber {
+ margin-left: 71px;
+}
+
+#lbCaption {
+ font-weight: bold;
+}
diff --git a/slimbox2.css b/slimbox2.css
new file mode 100644
index 0000000..9eed9bc
--- /dev/null
+++ b/slimbox2.css
@@ -0,0 +1,83 @@
+/* SLIMBOX */
+
+#lbOverlay {
+ position: fixed;
+ z-index: 9999;
+ left: 0;
+ top: 0;
+ width: 100%;
+ height: 100%;
+ background-color: #000;
+ cursor: pointer;
+}
+
+#lbCenter, #lbBottomContainer {
+ position: absolute;
+ z-index: 9999;
+ overflow: hidden;
+ background-color: #fff;
+}
+
+.lbLoading {
+ background: #fff url(loading.gif) no-repeat center;
+}
+
+#lbImage {
+ position: absolute;
+ left: 0;
+ top: 0;
+ border: 10px solid #fff;
+ background-repeat: no-repeat;
+}
+
+#lbPrevLink, #lbNextLink {
+ display: block;
+ position: absolute;
+ top: 0;
+ width: 50%;
+ outline: none;
+}
+
+#lbPrevLink {
+ left: 0;
+}
+
+#lbPrevLink:hover {
+ background: transparent url(prev.png) no-repeat 0 15%;
+}
+
+#lbNextLink {
+ right: 0;
+}
+
+#lbNextLink:hover {
+ background: transparent url(next.png) no-repeat 100% 15%;
+}
+
+#lbBottom {
+ font-family: Verdana, Arial, Geneva, Helvetica, sans-serif;
+ font-size: 10px;
+ color: #666;
+ line-height: 1.4em;
+ text-align: left;
+ border: 10px solid #fff;
+ border-top-style: none;
+}
+
+#lbCloseLink {
+ display: block;
+ float: right;
+ width: 66px;
+ height: 22px;
+ background: transparent url(closelabel.gif) no-repeat center;
+ margin: 5px 0;
+ outline: none;
+}
+
+#lbCaption, #lbNumber {
+ margin-right: 71px;
+}
+
+#lbCaption {
+ font-weight: bold;
+}
diff --git a/slimbox2.js b/slimbox2.js
new file mode 100644
index 0000000..e3d51ba
--- /dev/null
+++ b/slimbox2.js
@@ -0,0 +1,288 @@
+/*
+ Standalone (no jQuery) lightweight Lightbox implementation with minimal CSS3 animations
+ Based on and compatible with Slimbox2
+ (c) 2012 Vitaliy Filippov
+ MIT-style license.
+*/
+
+window.addListener = (function() {
+ return window.addEventListener
+ ? function(el, type, fn) { el.addEventListener(type, fn, false); }
+ : function(el, type, fn) { el.attachEvent('on'+type, fn); };
+})();
+
+window.removeListener = (function() {
+ return window.removeEventListener
+ ? function(el, type, fn) { el.removeEventListener(type, fn, false); }
+ : function(el, type, fn) { el.detachEvent('on'+type, fn); };
+})();
+
+addListener(window, 'load', function() {
+
+ // Global variables, accessible to Slimbox only
+ var options, images, activeImage = -1, activeURL, prevImage, nextImage, compatibleOverlay, middle, centerWidth, centerHeight,
+ ie6 = !window.XMLHttpRequest, hiddenElements = [], els = {}, css, keyActions,
+ // Preload images
+ preload = {}, preloadPrev = new Image(), preloadNext = new Image();
+
+ // Initialization
+
+ // Append the Slimbox HTML code at the bottom of the document
+ var d = document.createElement('div');
+ d.innerHTML = ''+
+ '';
+ while (d.childNodes.length) {
+ document.body.appendChild(d.childNodes[0]);
+ }
+ var l = 'overlay center image sizer prevLink nextLink bottomContainer bottom closeLink caption number'.split(' ');
+ for (var i = 0; i < l.length; i++) {
+ els[l[i]] = document.getElementById('lb'+l[i].substr(0, 1).toUpperCase()+l[i].substr(1));
+ }
+ els.prevLink.onclick = previous;
+ els.nextLink.onclick = next;
+ els.closeLink.onclick = close;
+
+ // Utils
+
+ function apply(a, b) {
+ for (var i in b) {
+ a[i] = b[i];
+ }
+ }
+ function foreach(a, f) {
+ for (var i in a) {
+ f(i, a[i]);
+ }
+ }
+
+ // API
+
+ // Open Slimbox with the specified parameters
+ window.slimbox = function(_images, startImage, _options) {
+ options = {
+ loop: false, // Allows to navigate between first and last images
+ overlayOpacity: 0.8, // 1 is opaque, 0 is completely transparent (change the color in the CSS file)
+ overlayFadeDuration: 400, // Duration of the overlay fade-in and fade-out animations (in milliseconds)
+ initialWidth: 250, // Initial width of the box (in pixels)
+ initialHeight: 250, // Initial height of the box (in pixels)
+ imageFadeDuration: 400, // Duration of the image fade-in animation (in milliseconds)
+ counterText: "Image {x} of {y}", // Translate or change as you wish, or set it to false to disable counter text for image groups
+ closeKeys: [27, 88, 67], // Array of keycodes to close Slimbox, default: Esc (27), 'x' (88), 'c' (67)
+ previousKeys: [37, 80], // Array of keycodes to navigate to the previous image, default: Left arrow (37), 'p' (80)
+ nextKeys: [39, 78] // Array of keycodes to navigate to the next image, default: Right arrow (39), 'n' (78)
+ };
+ if (_options) {
+ apply(options, _options);
+ }
+ css = document.createElement('style');
+ var t1 = 'transition: opacity '+options.overlayFadeDuration+'ms ease;';
+ var t2 = 'transition: opacity '+options.imageFadeDuration+'ms ease;';
+ css.type = 'text/css';
+ css.innerHTML =
+'#lbOverlay { opacity: 0; '+t1+' -moz-'+t1+' -o-'+t1+' -webkit-'+t1+' }\n\
+#lbOverlay.lbvisible { opacity: '+options.overlayOpacity+'; '+t1+' -moz-'+t1+' -o-'+t1+' -webkit-'+t1+' }\n\
+#lbImage { opacity: 0; }\n\
+#lbImage.lbvisible { opacity: 1; '+t2+' -moz-'+t2+' -o-'+t2+' -webkit-'+t2+' }';
+ document.head.appendChild(css);
+
+ keyActions = {};
+ for (var i in options.closeKeys) {
+ keyActions[options.closeKeys[i]] = close;
+ }
+ for (var i in options.previousKeys) {
+ keyActions[options.previousKeys[i]] = previous;
+ }
+ for (var i in options.nextKeys) {
+ keyActions[options.nextKeys[i]] = next;
+ }
+
+ // The function is called for a single image, with URL and Title as first two arguments
+ if (typeof _images == "string") {
+ _images = [ { url: _images, title: startImage } ];
+ startImage = 0;
+ }
+
+ middle = document.documentElement.scrollTop + ((window.innerHeight || document.documentElement.offsetHeight) / 2);
+ centerWidth = options.initialWidth;
+ centerHeight = options.initialHeight;
+ apply(els.center.style, {
+ top: Math.max(0, middle - (centerHeight / 2))+'px',
+ width: centerWidth+'px',
+ height: centerHeight+'px',
+ marginLeft: (-centerWidth/2)+'px',
+ display: ''
+ });
+ compatibleOverlay = ie6 || (els.overlay.style && (els.overlay.style.position != "fixed"));
+ if (compatibleOverlay) els.overlay.style.position = "absolute";
+
+ els.overlay.style.display = '';
+ setTimeout(function() {
+ els.overlay.className = 'lbvisible';
+ }, 10);
+
+ position();
+ setup(1);
+
+ images = _images;
+ options.loop = options.loop && (images.length > 1);
+ return changeImage(startImage);
+ };
+
+ // images = [ { element: clickOnWhatElement, url: imgUrl, title: titleHTML } ];
+ window.setSlimbox = function(images, options) {
+ foreach (images, function(i, img) {
+ if (img.element.nodeName == 'A') {
+ img.element.target = '';
+ }
+ addListener(img.element, 'click', function(ev) {
+ ev = ev || window.event;
+ ev.preventDefault();
+ window.slimbox(images, parseInt(''+i), options);
+ return false;
+ });
+ });
+ };
+
+ // Internal functions
+
+ function position() {
+ var l = document.documentElement.scrollLeft, w = document.documentElement.offsetWidth;
+ els.center.style.left = els.bottomContainer.style.left = (l + (w / 2))+'px';
+ if (compatibleOverlay) {
+ apply(els.overlay.style, {
+ left: l+'px',
+ top: document.documentElement.scrollTop+'px',
+ width: w+'px',
+ height: document.documentElement.offsetHeight+'px'
+ });
+ }
+ }
+
+ function hide(nodes) {
+ for (var i = 0; i < nodes.length; i++) {
+ hiddenElements.push([nodes[i], nodes[i].style.visibility]);
+ nodes[i].style.visibility = "hidden";
+ }
+ }
+
+ function setup(open) {
+ if (open) {
+ hide(document.getElementsByTagName('object'));
+ hide(document.getElementsByTagName(ie6 ? 'select' : 'embed'));
+ } else {
+ for (var i in hiddenElements) {
+ hiddenElements[i][0].style.visibility = hiddenElements[i][1];
+ }
+ hiddenElements = [];
+ }
+ var f = (open ? addListener : removeListener);
+ f(window, 'scroll', position);
+ f(window, 'resize', position);
+ f(document, 'keydown', keyDown);
+ }
+
+ function keyDown(event) {
+ event = event || window.event;
+ var code = event.keyCode;
+ // Prevent default keyboard action (like navigating inside the page)
+ return keyActions[code] ? keyActions[code]() : false;
+ }
+
+ function previous() {
+ return changeImage(prevImage);
+ }
+
+ function next() {
+ return changeImage(nextImage);
+ }
+
+ function changeImage(imageIndex) {
+ if (imageIndex >= 0) {
+ activeImage = imageIndex;
+ activeURL = images[activeImage].url;
+ prevImage = (activeImage || (options.loop ? images.length : 0)) - 1;
+ nextImage = ((activeImage + 1) % images.length) || (options.loop ? 0 : -1);
+
+ els.center.className = "lbLoading";
+
+ preload = new Image();
+ preload.onload = animateBox;
+ preload.src = activeURL;
+ }
+
+ return false;
+ }
+
+ function animateBox() {
+ els.center.className = "";
+ els.image.style.backgroundImage = "url(" + activeURL + ")";
+ els.image.style.display = '';
+ els.sizer.style.width = preload.width+'px';
+ els.sizer.style.height = preload.height+'px';
+ els.prevLink.style.height = preload.height+'px';
+ els.nextLink.style.height = preload.height+'px';
+ els.caption.innerHTML = images[activeImage]['title'] || "";
+ els.number.innerHTML = (((images.length > 1) && options.counterText) || "").replace(/{x}/, activeImage + 1).replace(/{y}/, images.length);
+
+ if (prevImage >= 0) preloadPrev.src = images[prevImage]['url'];
+ if (nextImage >= 0) preloadNext.src = images[nextImage]['url'];
+
+ centerWidth = els.image.offsetWidth;
+ centerHeight = els.image.offsetHeight;
+ var top = Math.max(0, middle - (centerHeight / 2));
+ if (els.center.offsetHeight != centerHeight) {
+ els.center.style.height = centerHeight+'px';
+ els.center.style.top = top+'px';
+ }
+ if (els.center.offsetWidth != centerWidth) {
+ els.center.style.width = centerWidth+'px';
+ els.center.style.marginLeft = (-centerWidth/2)+'px';
+ }
+ apply(els.bottomContainer.style, {
+ width: centerWidth+'px',
+ top: (top+centerHeight)+'px',
+ marginLeft: (-centerWidth/2)+'px',
+ visibility: 'hidden',
+ display: ''
+ });
+ els.image.className = '';
+ setTimeout(showImg, 10);
+ if (prevImage >= 0) els.prevLink.style.display = '';
+ if (nextImage >= 0) els.nextLink.style.display = '';
+ els.bottomContainer.style.visibility = "";
+ }
+
+ function showImg() {
+ els.image.className = 'lbvisible';
+ }
+
+ function stop() {
+ preload.onload = null;
+ preload.src = preloadPrev.src = preloadNext.src = activeURL;
+ els.prevLink.style.display = 'none';
+ els.nextLink.style.display = 'none';
+ els.image.style.display = 'none';
+ els.bottomContainer.style.display = 'none';
+ setup(0);
+ }
+
+ function close() {
+ if (activeImage >= 0) {
+ stop();
+ activeImage = prevImage = nextImage = -1;
+ els.center.style.display = 'none';
+ els.overlay.className = '';
+ setTimeout(function() {
+ els.overlay.style.display = 'none';
+ document.head.removeChild(css);
+ }, options.overlayFadeDuration);
+ }
+ return false;
+ }
+
+});