diff --git a/admin/css/closelabel.gif b/admin/css/closelabel.gif new file mode 100644 index 0000000..87b4f8b Binary files /dev/null and b/admin/css/closelabel.gif differ diff --git a/admin/css/loading.gif b/admin/css/loading.gif new file mode 100644 index 0000000..f864d5f Binary files /dev/null and b/admin/css/loading.gif differ diff --git a/admin/css/nextlabel.gif b/admin/css/nextlabel.gif new file mode 100644 index 0000000..7c66121 Binary files /dev/null and b/admin/css/nextlabel.gif differ diff --git a/admin/css/prevlabel.gif b/admin/css/prevlabel.gif new file mode 100644 index 0000000..0641876 Binary files /dev/null and b/admin/css/prevlabel.gif differ diff --git a/admin/css/slimbox.css b/admin/css/slimbox.css new file mode 100644 index 0000000..c67bb9e --- /dev/null +++ b/admin/css/slimbox.css @@ -0,0 +1,75 @@ +/* SLIMBOX */ + +#lbOverlay { + position: absolute; + left: 0; + width: 100%; + background-color: #000; + cursor: pointer; +} + +#lbCenter, #lbBottomContainer { + position: absolute; + left: 50%; + overflow: hidden; + background-color: #fff; +} + +.lbLoading { + background: #fff url(loading.gif) no-repeat center; +} + +#lbImage { + border: 10px solid #fff; +} + +#lbPrevLink, #lbNextLink { + display: block; + position: absolute; + top: 0; + width: 50%; + outline: none; +} + +#lbPrevLink { + left: 0; +} + +#lbPrevLink:hover { + background: transparent url(prevlabel.gif) no-repeat 0% 15%; +} + +#lbNextLink { + right: 0; +} + +#lbNextLink:hover { + background: transparent url(nextlabel.gif) no-repeat 100% 15%; +} + +#lbBottom { + font-family: Verdana, 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; +} + +#lbCaption, #lbNumber { + margin-right: 71px; +} + +#lbCaption { + font-weight: bold; +} diff --git a/admin/scripts/slimbox.js b/admin/scripts/slimbox.js new file mode 100644 index 0000000..ea21c0b --- /dev/null +++ b/admin/scripts/slimbox.js @@ -0,0 +1,188 @@ +/* + Slimbox v1.3 - The ultimate lightweight Lightbox clone + by Christophe Beyls (http://www.digitalia.be) - MIT-style license. + Inspired by the original Lightbox v2 by Lokesh Dhakar. +*/ + +var Lightbox = { + + init: function(options){ + this.options = Object.extend({ + resizeDuration: 400, + resizeTransition: Fx.Transitions.sineInOut, + initialWidth: 250, + initialHeight: 250, + animateCaption: true + }, options || {}); + + this.anchors = []; + $each(document.links, function(el){ + if (el.rel && el.rel.test(/^lightbox/i)){ + el.onclick = this.click.pass(el, this); + this.anchors.push(el); + } + }, this); + this.eventKeyDown = this.keyboardListener.bindAsEventListener(this); + this.eventPosition = this.position.bind(this); + + this.overlay = new Element('div').setProperty('id', 'lbOverlay').injectInside(document.body); + + this.center = new Element('div').setProperty('id', 'lbCenter').setStyles({width: this.options.initialWidth+'px', height: this.options.initialHeight+'px', marginLeft: '-'+(this.options.initialWidth/2)+'px', display: 'none'}).injectInside(document.body); + this.image = new Element('div').setProperty('id', 'lbImage').injectInside(this.center); + this.prevLink = new Element('a').setProperties({id: 'lbPrevLink', href: '#'}).setStyle('display', 'none').injectInside(this.image); + this.nextLink = this.prevLink.clone().setProperty('id', 'lbNextLink').injectInside(this.image); + this.prevLink.onclick = this.previous.bind(this); + this.nextLink.onclick = this.next.bind(this); + + this.bottomContainer = new Element('div').setProperty('id', 'lbBottomContainer').setStyle('display', 'none').injectInside(document.body); + this.bottom = new Element('div').setProperty('id', 'lbBottom').injectInside(this.bottomContainer); + new Element('a').setProperties({id: 'lbCloseLink', href: '#'}).injectInside(this.bottom).onclick = this.overlay.onclick = this.close.bind(this); + this.caption = new Element('div').setProperty('id', 'lbCaption').injectInside(this.bottom); + this.number = new Element('div').setProperty('id', 'lbNumber').injectInside(this.bottom); + new Element('div').setStyle('clear', 'both').injectInside(this.bottom); + + var nextEffect = this.nextEffect.bind(this); + this.fx = { + overlay: this.overlay.effect('opacity', {duration: 500}).hide(), + resize: this.center.effects({duration: this.options.resizeDuration, transition: this.options.resizeTransition, onComplete: nextEffect}), + image: this.image.effect('opacity', {duration: 500, onComplete: nextEffect}), + bottom: this.bottom.effect('margin-top', {duration: 400, onComplete: nextEffect}) + }; + + this.preloadPrev = new Image(); + this.preloadNext = new Image(); + }, + + click: function(link){ + if (link.rel.length == 8) return this.show(link.href, link.title); + + var j, imageNum, images = []; + this.anchors.each(function(el){ + if (el.rel == link.rel){ + for (j = 0; j < images.length; j++) if(images[j][0] == el.href) break; + if (j == images.length){ + images.push([el.href, el.title]); + if (el.href == link.href) imageNum = j; + } + } + }, this); + return this.open(images, imageNum); + }, + + show: function(url, title){ + return this.open([[url, title]], 0); + }, + + open: function(images, imageNum){ + this.images = images; + this.position(); + this.setup(true); + this.top = window.getScrollTop() + (window.getHeight() / 15); + this.center.setStyles({top: this.top+'px', display: ''}); + this.fx.overlay.start(0.8); + return this.changeImage(imageNum); + }, + + position: function(){ + this.overlay.setStyles({top: window.getScrollTop()+'px', height: window.getHeight()+'px'}); + }, + + setup: function(open){ + var elements = $A(document.getElementsByTagName('object')); + if (window.ie) elements.extend(document.getElementsByTagName('select')); + elements.each(function(el){ el.style.visibility = open ? 'hidden' : ''; }); + var fn = open ? 'addEvent' : 'removeEvent'; + window[fn]('scroll', this.eventPosition)[fn]('resize', this.eventPosition); + document[fn]('keydown', this.eventKeyDown); + this.step = 0; + }, + + keyboardListener: function(event){ + switch (event.keyCode){ + case 27: case 88: case 67: this.close(); break; + case 37: case 80: this.previous(); break; + case 39: case 78: this.next(); + } + }, + + previous: function(){ + return this.changeImage(this.activeImage-1); + }, + + next: function(){ + return this.changeImage(this.activeImage+1); + }, + + changeImage: function(imageNum){ + if (this.step || (imageNum < 0) || (imageNum >= this.images.length)) return false; + this.step = 1; + this.activeImage = imageNum; + + this.bottomContainer.style.display = this.prevLink.style.display = this.nextLink.style.display = 'none'; + this.fx.image.hide(); + this.center.className = 'lbLoading'; + + this.preload = new Image(); + this.preload.onload = this.nextEffect.bind(this); + this.preload.src = this.images[imageNum][0]; + return false; + }, + + nextEffect: function(){ + switch (this.step++){ + case 1: + this.center.className = ''; + this.image.style.backgroundImage = 'url('+this.images[this.activeImage][0]+')'; + this.image.style.width = this.bottom.style.width = this.preload.width+'px'; + this.image.style.height = this.prevLink.style.height = this.nextLink.style.height = this.preload.height+'px'; + + this.caption.setHTML(this.images[this.activeImage][1] || ''); + this.number.setHTML((this.images.length == 1) ? '' : 'Image '+(this.activeImage+1)+' of '+this.images.length); + + if (this.activeImage) this.preloadPrev.src = this.images[this.activeImage-1][0]; + if (this.activeImage != (this.images.length - 1)) this.preloadNext.src = this.images[this.activeImage+1][0]; + if (this.center.clientHeight != this.image.offsetHeight){ + this.fx.resize.start({height: this.image.offsetHeight}); + break; + } + this.step++; + case 2: + if (this.center.clientWidth != this.image.offsetWidth){ + this.fx.resize.start({width: this.image.offsetWidth, marginLeft: -this.image.offsetWidth/2}); + break; + } + this.step++; + case 3: + this.bottomContainer.setStyles({top: (this.top + this.center.clientHeight)+'px', height: '0px', marginLeft: this.center.style.marginLeft, display: ''}); + this.fx.image.start(1); + break; + case 4: + if (this.options.animateCaption){ + this.fx.bottom.set(-this.bottom.offsetHeight); + this.bottomContainer.style.height = ''; + this.fx.bottom.start(0); + break; + } + this.bottomContainer.style.height = ''; + case 5: + if (this.activeImage) this.prevLink.style.display = ''; + if (this.activeImage != (this.images.length - 1)) this.nextLink.style.display = ''; + this.step = 0; + } + }, + + close: function(){ + if (this.step < 0) return; + this.step = -1; + if (this.preload){ + this.preload.onload = Class.empty; + this.preload = null; + } + for (var f in this.fx) this.fx[f].stop(); + this.center.style.display = this.bottomContainer.style.display = 'none'; + this.fx.overlay.chain(this.setup.pass(false, this)).start(0); + return false; + } +}; + +window.addEvent('domready', Lightbox.init.bind(Lightbox)); diff --git a/images/Thumbs.db b/images/Thumbs.db deleted file mode 100644 index e232ab1..0000000 Binary files a/images/Thumbs.db and /dev/null differ diff --git a/images/favicon.ico b/images/favicon.ico new file mode 100644 index 0000000..8228965 Binary files /dev/null and b/images/favicon.ico differ diff --git a/index.php b/index.php index 6a92ebd..83233ad 100644 --- a/index.php +++ b/index.php @@ -44,8 +44,13 @@ } } - $input = array("{Title}", "{Description}", "{URL_Tumble}"); - $output = array($conf->title, $conf->description, $conf->urlGelato); + $gelato_includes = "\n"; + $gelato_includes .= "\t\n"; + $gelato_includes .= "\turlGelato."/admin/css/slimbox.css\" />\n"; + $gelato_includes .= "\turlGelato."/images/favicon.ico\" />"; + + $input = array("{Gelato_includes}","{Title}", "{Description}", "{URL_Tumble}"); + $output = array($gelato_includes, $conf->title, $conf->description, $conf->urlGelato); $template->cargarPlantilla($input, $output, "template_header"); $template->mostrarPlantilla(); @@ -92,8 +97,10 @@ $photoPath = $register["url"]; } - $input = array("{Date_Added}", "{Permalink}", "{PhotoURL}", "{PhotoAlt}", "{Caption}", "{URL_Tumble}"); - $output = array($formatedDate, $permalink, $photoPath, "", $register["description"], $conf->urlGelato); + $effect = " onclick=\"Lightbox.show('".$register["url"]."', '".strip_tags(htmlentities($register["description"]))."');\" "; + + $input = array("{Date_Added}", "{Permalink}", "{PhotoURL}", "{PhotoAlt}", "{Caption}", "{Effect}", "{URL_Tumble}"); + $output = array($formatedDate, $permalink, $photoPath, strip_tags($register["description"]), $register["description"], $effect, $conf->urlGelato); $template->cargarPlantilla($input, $output, "template_photo"); $template->mostrarPlantilla(); diff --git a/themes/tumblr/template_header.htm b/themes/tumblr/template_header.htm index e41536c..a981976 100644 --- a/themes/tumblr/template_header.htm +++ b/themes/tumblr/template_header.htm @@ -3,6 +3,7 @@
+ {Gelato_includes}