https://www.praha11.cz/js/as4u_roller.js?ver=20261002071001

1/** *****************************
2 * As4u roller - based on jquery
3 * 
4 * 1.2.2011 - Jan Navratil
5 * v 1.1 - # oprava 7.11.2011 - spatne pocitana sirka elementu s marginem 
6 */
7 
8
9function As4uRoller(options) {
10  this.options = options;
11  this.inProgress = false;
12  this.automatic = options.automatic;
13  this.animeTime = options.animeTime ? options.animeTime : 1500;
14  this.stayTime = options.stayTime ? options.stayTime : 10000;
15}
16
17function log(d) {
18  try {
19    console.log(d);
20  } catch(e) {}
21}
22
23
24As4uRoller.prototype.show = function () {
25  var toto = this;
26  this.rollerMain = $('#'+this.options.rollid);
27  this.rollerMain.css('position','relative');
28  
29  
30  //nalezeni vnitrniho contu
31  this.itemsCont = this.rollerMain.find('.rollbox-cont').eq(0);
32  
33  this.itemsCont.css('position','absolute');
34  this.itemsCont.css('top','0');
35  this.itemsCont.css('left','0');
36  
37  //projdeme si v cyklu existujici itemy
38  this.itemsCount = 0;
39  this.items = [];
40  this.itemWidth = 0;
41  this.itemHeight = 0;
42  
43  this.itemsCont.find('.rollitem').each(function(index, element) {
44  
45    //mouse eventy
46    /*$(element).mouseenter(function(){
47      toto.automaticBefore = toto.automatic;
48      toto.automatic = false;       
49    });
50    $(element).mouseleave(function(){
51      toto.automatic = toto.automaticBefore;  
52      if (toto.automatic)
53        toto.animate();       
54    });   */
55  
56    toto.items.push($(element)); //create array of elements
57    var width = $(element).width();
58    if (parseInt($(element).css('marginLeft')) > 0)  {
59      width += parseInt($(element).css('marginLeft'));
60    } 
61    if (parseInt($(element).css('marginRight')) > 0)  {
62      width += parseInt($(element).css('marginRight'));
63    } 
64    if (parseInt($(element).css('marginLeft')) > 0)  {
65      width += parseInt($(element).css('marginLeft'));
66    } 
67    if (parseInt($(element).css('paddingRight')) > 0)  {
68      width += parseInt($(element).css('paddingRight'));
69    } 
70    if (parseInt($(element).css('paddingLeft')) > 0)  {
71      width += parseInt($(element).css('paddingLeft'));
72    } 
73
74    //log('Width : ' + width);  
75    if (width > toto.itemWidth) {
76      toto.itemWidth = width;  
77    }
78    if ($(element).outerHeight(true) > toto.itemHeight) {
79      toto.itemHeight = $(element).outerHeight(true);  
80    }   
81    toto.itemsCount++;  
82  });
83    
84  if (!this.itemsCount) return;
85  
86  //naklonujeme posledni element pred prvni  
87  var cloneItem = this.items[this.items.length-1].clone();
88  this.itemsCont.prepend(cloneItem);
89  
90  
91  if (this.itemsCount*this.itemWidth > this.rollerMain.width() + this.itemWidth) {
92    this.items[this.items.length-1].detach();
93    this.items.pop();
94    this.itemsCount--; 
95  } else { //mame pouze o jeden element vice -> pri posunu budou dva vedle sebe, to neni dobre -> naklonujeme druhy zleva (drive prvni) na konec
96      //#BUG - 5.1.2012   
97    if (this.rollerMain.width() < this.itemsCount*this.itemWidth) {  
98      cloneItem.detach();
99      for (var i=0;i < this.items.length-1;i++) {
100        this.itemsCont.append(this.items[i].clone());
101        this.itemsCount++;    
102      }
103      var newItems = [];
104      newItems.push(cloneItem);
105      for (var i in this.items) {
106        newItems.push(this.items[i]); 
107      }
108      this.items = newItems; 
109      this.itemsCont.prepend(this.items[this.items.length-1].clone());            
110    }
111  }
112  
113  this.itemsCont.css('width', this.itemsCount*this.itemWidth+this.itemWidth);
114  this.itemsCont.css('height', this.itemHeight);
115
116  
117  //posuneme absolutni pozici
118  this.itemsCont.css('left', -parseInt(this.itemWidth));
119  
120  this.smer = this.options.smer ? this.options.smer : "left";
121  
122  //nastaveni akci na tlacitka
123  if ($('#'+this.options.btnleft)) {
124    $('#'+this.options.btnleft).click(function(){
125      if (!$(this).hasClass('noScroll'))
126        toto.btnLeft();
127    });  
128  }
129  if ($('#'+this.options.btnright)) {
130    $('#'+this.options.btnright).click(function(){
131      if (!$(this).hasClass('noScroll'))
132        toto.btnRight();
133    });  
134  }  
135  /*
136  try {
137    console.log(' --- ' + this.options.rollid + ' ---- ');
138    console.log(this.itemWidth);
139    console.log(this.itemsCount*this.itemWidth);
140    console.log(this.rollerMain.width());
141  } catch(e) {} */ 
142  
143  if (this.itemsCount*this.itemWidth > this.rollerMain.width() && this.options.automatic == true) {//animovat jen kdyz je kam
144    var fce = function() {
145        toto.animate();
146    };
147    this.animateTimeout = setTimeout(fce, this.stayTime);
148    //this.animate();
149  }

149 else { //neni kam animovat, nastavime tlacitkum specialni tridy
150    if ( !(this.itemsCount*this.itemWidth > this.rollerMain.width()) ) {
151      $('#'+this.options.btnleft).addClass('noScroll');
152      $('#'+this.options.btnright).addClass('noScroll');
153    }
154  }
155 
156};
157
158As4uRoller.prototype.btnLeft = function () {  
159  if (!this.inProgress) { 
160    
161    this.smer = "left";
162    if (this.options.automatic == true)
163      this.afterBtnClick();
164      
165    this.automatic = false;
166    if (this.itemsCount*this.itemWidth > this.rollerMain.width())
167      this.animate();  
168  }
169}
170
171As4uRoller.prototype.btnRight = function () { 
172  if (!this.inProgress) {
173    if (this.options.automatic == true)
174      this.afterBtnClick();
175      
176    this.smer = "right";
177    this.automatic = false;
178    if (this.itemsCount*this.itemWidth > this.rollerMain.width())
179      this.animate();  
180    
181  }
182}
183
184As4uRoller.prototype.afterBtnClick = function () { 
185  var toto = this;
186  clearTimeout(this.clickTimeout);
187  var fce = function () {
188    toto.smer = toto.options.smer ? toto.options.smer : "left"; //vychozi hodnota
189    toto.automatic = toto.options.automatic;
190    if (toto.itemsCount*toto.itemWidth > toto.rollerMain.width() && toto.options.automatic == true)
191      toto.animate();
192  };
193  this.clickTimeout = setTimeout(fce, 15000); 
194}
195
196
197As4uRoller.prototype.animate = function () {  
198  var toto = this;
199  if (!this.inProgress) {
200    
201    this.direction = this.smer == 'right' ? '+=' : '-=';  
202    this.inProgress = true;
203    this.itemsCont.animate({   
204      left: this.direction+this.itemWidth    
205    }, this.animeTime, function (){toto.afterAnimate();});
206  }                             
207}
208
209As4uRoller.prototype.afterAnimate = function () {  
210  this.inProgress = false; //animace ukoncena  
211  //prosunuti elementu
212  if (this.smer == "left") { //jede to doleva
213    //vezmeme element zleva a nacpem doprava
214    this.itemsCont.append(this.itemsCont.find('.rollitem').eq(0));            
215  } else {  //obracene    
216    this.itemsCont.prepend(this.itemsCont.find('.rollitem').eq(-1));  
217  }
218  this.itemsCont.css('left', -parseInt(this.itemWidth));  
219    //pokud je tam clear element musime ho presunout
220  try {
221    var clear = this.itemsCont.find('.clear').eq(0).clone();
222    if (clear.length > 0) {
223      this.itemsCont.find('.clear').detach();
224      this.itemsCont.append(clear);
225    }
226  } catch(e) {
227    log('Presun se nepovedl ' + e.message);
228  }  
229  if (this.automatic) {
230    var toto = this;
231    this.animateTimeout = setTimeout(function() { if (toto.automatic) toto.animate();}, this.stayTime);
232  }
233}
234
235As4uRoller.prototype.stopAnimate = function () {
236  clearTimeout(this.animateTimeout);
237}
238
239
240 
241  
242 
243 
244 
245