+++ /dev/null
-/**
- *
- * Spacegallery
- * Author: Stefan Petre www.eyecon.ro
- *
- */
-
-(function($){
- EYE.extend({
-
- spacegallery: {
-
- //default options (many options are controled via CSS)
- defaults: {
- border: 6, // border arround the image
- perspective: 140, // perpective height
- minScale: 0.2, // minimum scale for the image in the back
- duration: 800, // aimation duration
- loadingClass: null, // CSS class applied to the element while looading images
- before: function(){return false},
- after: function(){return false}
- },
-
- animated: false,
-
- //position images
- positionImages: function(el) {
- var top = 0;
- EYE.spacegallery.animated = false;
- $(el)
- .find('a')
- .removeClass(el.spacegalleryCfg.loadingClass)
- .end()
- .find('img')
- .removeAttr('height')
- .each(function(nr){
- var newWidth = this.spacegallery.origWidth - (this.spacegallery.origWidth - this.spacegallery.origWidth * el.spacegalleryCfg.minScale) * el.spacegalleryCfg.asins[nr];
- $(this)
- .css({
- top: el.spacegalleryCfg.tops[nr] + 'px',
- marginLeft: - parseInt((newWidth + el.spacegalleryCfg.border)/2, 10) + 'px',
- opacity: 1 - el.spacegalleryCfg.asins[nr]
- })
- .attr('width', parseInt(newWidth));
- this.spacegallery.next = el.spacegalleryCfg.asins[nr+1];
- this.spacegallery.nextTop = el.spacegalleryCfg.tops[nr+1] - el.spacegalleryCfg.tops[nr];
- this.spacegallery.origTop = el.spacegalleryCfg.tops[nr];
- this.spacegallery.opacity = 1 - el.spacegalleryCfg.asins[nr];
- this.spacegallery.increment = el.spacegalleryCfg.asins[nr] - this.spacegallery.next;
- this.spacegallery.current = el.spacegalleryCfg.asins[nr];
- this.spacegallery.width = newWidth;
- })
- },
-
- //animate to nex image
- next: function(e) {
- if (EYE.spacegallery.animated === false) {
- EYE.spacegallery.animated = true;
- var el = this.parentNode;
- el.spacegalleryCfg.before.apply(el);
- $(el)
- .css('spacegallery', 0)
- .animate({
- spacegallery: 100
- },{
- easing: 'easeOut',
- duration: el.spacegalleryCfg.duration,
- complete: function() {
- $(el)
- .find('img:last')
- .prependTo(el);
- EYE.spacegallery.positionImages(el);
- el.spacegalleryCfg.after.apply(el);
- },
- step: function(now) {
- $('img', this)
- .each(function(nr){
- var newWidth, top, next;
- if (nr + 1 == el.spacegalleryCfg.images) {
- top = this.spacegallery.origTop + this.spacegallery.nextTop * 4 * now /100;
- newWidth = this.spacegallery.width * top / this.spacegallery.origTop;
- $(this)
- .css({
- top: top + 'px',
- opacity: 0.7 - now/100,
- marginLeft: - parseInt((newWidth + el.spacegalleryCfg.border)/2, 10) + 'px'
- })
- .attr('width', newWidth);
- } else {
- next = this.spacegallery.current - this.spacegallery.increment * now /100;
- newWidth = this.spacegallery.origWidth - (this.spacegallery.origWidth - this.spacegallery.origWidth * el.spacegalleryCfg.minScale) * next;
- $(this).css({
- top: this.spacegallery.origTop + this.spacegallery.nextTop * now /100 + 'px',
- opacity: 1 - next,
- marginLeft: - parseInt((newWidth + el.spacegalleryCfg.border)/2, 10) + 'px'
- })
- .attr('width', newWidth);
- }
- });
- }
- });
- }
-
- this.blur();
- return false;
- },
-
- autoNext: function(el) {
-
- if (EYE.spacegallery.animated === false) {
- EYE.spacegallery.animated = true;
- el.spacegalleryCfg.before.apply(el); // run the "before" function
- $(el)
- .css('spacegallery', 0)
- .animate({
- spacegallery: 100
- },{
- easing: 'easeOut',
- duration: el.spacegalleryCfg.duration,
- complete: function() { // after animation is complete, move the front image to the back
- $(el)
- .find('img:last') // find the last image in this div
- .prependTo(el); // and stick it at the beginning
- EYE.spacegallery.positionImages(el); // run "position images"
- el.spacegalleryCfg.after.apply(el); //run the "after" function
- },
- step: function(now) {
- $('img', this)
- .each(function(nr){
- var newWidth, top, next;
- if (nr + 1 == el.spacegalleryCfg.images) {
- top = this.spacegallery.origTop + this.spacegallery.nextTop * 4 * now /100;
- newWidth = this.spacegallery.width * top / this.spacegallery.origTop;
- $(this)
- .css({
- top: top + 'px',
- opacity: 0.7 - now/100,
- marginLeft: - parseInt((newWidth + el.spacegalleryCfg.border)/2, 10) + 'px'
- })
- .attr('width', newWidth);
- } else {
- next = this.spacegallery.current - this.spacegallery.increment * now /100;
- newWidth = this.spacegallery.origWidth - (this.spacegallery.origWidth - this.spacegallery.origWidth * el.spacegalleryCfg.minScale) * next;
- $(this).css({
- top: this.spacegallery.origTop + this.spacegallery.nextTop * now /100 + 'px',
- opacity: 1 - next,
- marginLeft: - parseInt((newWidth + el.spacegalleryCfg.border)/2, 10) + 'px'
- })
- .attr('width', newWidth);
- }
- });
- }
- });
- }
-
- return false;
- },
-
- //constructor
- init: function(opt) {
- opt = $.extend({}, EYE.spacegallery.defaults, opt||{});
- return this.each(function(){
- var el = this;
- if ($(el).is('.spacegallery')) {
- $('<a href="#"></a>')
- .appendTo(this)
- .addClass(opt.loadingClass)
- .bind('click', EYE.spacegallery.next);
- el.spacegalleryCfg = opt;
- el.spacegalleryCfg.images = el.getElementsByTagName('img').length;
- el.spacegalleryCfg.loaded = 0;
- el.spacegalleryCfg.asin = Math.asin(1);
- el.spacegalleryCfg.asins = {};
- el.spacegalleryCfg.tops = {};
- el.spacegalleryCfg.increment = parseInt(el.spacegalleryCfg.perspective/el.spacegalleryCfg.images, 10);
- var top = 0;
- $('img', el)
- .each(function(nr){
- var imgEl = new Image();
- var elImg = this;
- el.spacegalleryCfg.asins[nr] = 1 - Math.asin((nr+1)/el.spacegalleryCfg.images)/el.spacegalleryCfg.asin;
- top += el.spacegalleryCfg.increment - el.spacegalleryCfg.increment * el.spacegalleryCfg.asins[nr];
- el.spacegalleryCfg.tops[nr] = top;
- elImg.spacegallery = {};
- imgEl.src = this.src;
- if (imgEl.complete) {
- el.spacegalleryCfg.loaded ++;
- elImg.spacegallery.origWidth = imgEl.width;
- elImg.spacegallery.origHeight = imgEl.height
- } else {
- imgEl.onload = function() {
- el.spacegalleryCfg.loaded ++;
- elImg.spacegallery.origWidth = imgEl.width;
- elImg.spacegallery.origHeight = imgEl.height
- if (el.spacegalleryCfg.loaded == el.spacegalleryCfg.images) {
-
- EYE.spacegallery.positionImages(el);
- }
- };
- }
- });
- el.spacegalleryCfg.asins[el.spacegalleryCfg.images] = el.spacegalleryCfg.asins[el.spacegalleryCfg.images - 1] * 1.3;
- el.spacegalleryCfg.tops[el.spacegalleryCfg.images] = el.spacegalleryCfg.tops[el.spacegalleryCfg.images - 1] * 1.3;
- if (el.spacegalleryCfg.loaded == el.spacegalleryCfg.images) {
- EYE.spacegallery.positionImages(el);
- setInterval(function() { EYE.spacegallery.autoNext(el); }, 4000);
- }
- }
- });
- }
- }
- });
-
- $.fn.extend({
-
- /**
- * Create a space gallery
- * @name spacegallery
- * @description create a space gallery
- * @option int border Images' border. Default: 6
- * @option int perspective Perpective height. Default: 140
- * @option float minScale Minimum scale for the image in the back. Default: 0.2
- * @option int duration Animation duration. Default: 800
- * @option string loadingClass CSS class applied to the element while looading images. Default: null
- * @option function before Callback function triggered before going to the next image
- * @option function after Callback function triggered after going to the next image
- */
- spacegallery: EYE.spacegallery.init
- });
- $.extend($.easing,{
- easeOut:function (x, t, b, c, d) {
- return -c *(t/=d)*(t-2) + b;
- }
- });
-})(jQuery);
\ No newline at end of file
Code Review / policy / engine.git / blobdiff