https://dynamo.kiev.ua/static/js/imp-matches-widget.js?v5

1$(function(){
2	/* Литсалка матчей в виджете */
3
4	var MatchLister = function() {
5		this.opt = opt;
6		this.active = 1;
7		this.init();
8	}
9
10	MatchLister.prototype.move = function() {
11		var self = this;
12
13		self.opt.line.css({
14			marginLeft: -1 * self.active * self.opt.matchWidth
15		});
16	}
17
18	MatchLister.prototype.moveLeft = function() {
19		var self = this;
20
21		if (self.active > 0)
22			self.active -= 1;
23		self.move();
24		if (self.active == 0)
25			self.loadMatch({played: true});
26	}
27
28	MatchLister.prototype.moveRight = function(skipLoad) {
29		var self = this;
30		var max = self.opt.matches.length - self.opt.viewPort;
31
32		if (self.active < max)
33			self.active += 1;
34		self.move();
35		if (!skipLoad && self.active == max)
36			self.loadMatch({played: false});
37	}
38
39	MatchLister.prototype.showLoader = function() {
40		var self = this;
41
42		self.opt.loader.show();
43		self.opt.prev.addClass('busy').css('opacity', 0.2);
44		self.opt.next.addClass('busy').css('opacity', 0.2);
45	}
46
47	MatchLister.prototype.hideLoader = function() {
48		var self = this;
49
50		self.opt.loader.hide();
51		self.opt.prev.removeClass('busy').css('opacity', 1);
52		self.opt.next.removeClass('busy').css('opacity', 1);
53	}
54
55	MatchLister.prototype.loadMatch = function(opt) {
56		var self = this;
57		var date = null;
58
59		if (opt.played)
60			date = self.opt.matches.eq(0)
61				.find('span.match-date').text();
62		else
63			date = self.opt.matches.eq(self.opt.matches.length - 1)
64				.find('span.match-date').text();
65		
66		club_id = self.opt.root.attr('data-club-id') || '';
67
68		$.ajax({
69			url: self.opt.url,
70			data: {
71				status: (opt.played) ? 2 : 1,
72				date: date,
73				club_id: club_id
74			},
75			beforeSend: function() {
76				self.showLoader();
77			},
78			error: function(xhr, textStatus, errorThrown) {
79				alert(textStatus);
80
81				self.hideLoader();
82			},
83			success: function(data) {
84				if (data) {
85					if (opt.played) {
86						self.opt.line.prepend(data);
87						self.active = 1;
88					} else {
89						self.opt.line.append(data);
90					}
91
92					self.update(opt);
93				}
94
95				self.hideLoader();
96			}
97		});
98	}
99
100	MatchLister.prototype.update = function(opt) {
101		var self = this;
102
103		self.opt.matches = $(self.opt.matchesDom);
104		self.opt.line.width(self.opt.matches.length * self.opt.matchWidth);
105		if (opt && opt.played)
106			self.opt.line.css('marginLeft', -self.active * self.opt.matchWidth + 'px');
107
108		self.links = $(self.opt.linksDom, self.root);
109		self.links.each(function(){
110			if (!$(this).hasClass(self.opt.openLinkClass))
111				$(this).unbind('click');
112		});
113
114		self.links.click(function(){
115			if ($(this).hasClass(self.opt.openLinkClass)) {
116				self.hideLinks();
117			} else {
118				self.hideLinks();
119				// Копируем меню из того матча, в котором
120				// нажата ссылка
121				var ul = $(this).parent()
122					.children(self.opt.linksNavDom);
123				var clone = ul.clone();
124				var position = $(this).parent().position();
125
126				self.opt.root.parent().append(clone);
127				clone.append('<li class="bottom"> \
128					<a class="hide-links" href="#"> \
129						Скрыть ссылки \
130					</a> \
131					</li>')
132					.css({marginLeft: position.left + 'px'})
133					.show();
134				$(this).addClass(self.opt.openLinkClass);
135				$('a.hide-links', clone).click(function(){
136					self.hideLinks();
137
138					return false;
139				});
140
141				$(window).click(function(e){
142					var target = $(e.target);
143					var nav = target.parents(self.opt.linksNavDom);
144
145					if (!nav.length) {
146						self.hideLinks();
147					}
148				});
149			}
150
151			return false;
152		});
153	}
154
155	MatchLister.prototype.hideLinks = function() {
156		var self = this;
157
158		self.opt.root.parent().children(self.opt.linksNavDom)
159			.remove();
160		self.opt.root.find('a.' + self.opt.openLinkClass)
161			.removeClass(self.opt.openLinkClass);
162	}
163
164	MatchLister.prototype.viewport_elements = function() {
165		var self = this;
166
167		if (self.opt.root.width() == 1168) {
168			self.opt.viewPort = 4
169		} else if (self.opt.root.width() == 876) {
170			self.opt.viewPort = 3
171		} else if (self.opt.root.width() == 584) {
172			self.opt.viewPort = 2
173		} else if (self.opt.root.width() == 292) {
174			self.opt.viewPort = 1
175		}
176	}
177
178	MatchLister.prototype.init = function() {
179		var self = this;
180
181		self.opt.prev.click(function() {
182			if (!$(this).hasClass('busy')) {
183				self.hideLinks();
184				self.moveLeft();
185			}
186
187			return false;

188		});
189		self.opt.next.click(function() {
190			if (!$(this).hasClass('busy')) {
191				self.hideLinks();
192				self.moveRight();
193			}
194
195			return false;
196		});
197
198		self.update();
199
200		self.viewport_elements();
201
202		$(window).resize(function(){
203			self.viewport_elements();
204		});
205
206		if (self.opt.root.length) {
207			self.root_width = self.opt.root.width();
208
209			if (self.root_width == 876) {
210				self.moveRight();
211			}
212			if (self.root_width == 584) {
213				self.moveRight();
214			}
215			if (self.root_width == 292) {
216				self.moveRight();
217				self.moveRight();
218			}
219		}
220		self.opt.match_tickets.mouseover(function(){
221			var pos = $(this).position();
222			$(this).children('.tickets-bl').css('left', pos.left + 'px').show();
223		});
224		self.opt.match_tickets.mouseleave(function(){
225			$(this).children('.tickets-bl').hide();
226		});
227	}
228
229	var opt = {
230		root: $('#important'),
231		line: $('#important div.line:first'),
232		matches: $('#important div.match'),
233		matchesDom: '#important div.match',
234		loader: $('img.imp-loader'),
235		matchWidth: 292,
236		viewPort: 4,
237		prev: $('#imp-prev'),
238		next: $('#imp-next'),
239		url: '/comp/important/',
240		linksNavDom: 'ul.match-nav',
241		linksDom: 'a.show-links',
242		openLinkClass: 'show-links-opened',
243		match_tickets: $('.match-tickets')
244	}
245
246	self.ml = new MatchLister(opt);
247});