https://techwriterdays.ru/conf/js/index.js

1$(function () {
2	var isResizedBlock = false;
3    $(document).ready(function () {
4
5        //Скрытие блоков в статье SQA Days, блоком считается HTML от h2 до h2 не включительно
6        var titles = $('.article h2');
7
8        //проходим в статье по каждому заголовку, выставляем им классы для идентификации
9        //суем к заголовку стрелочку
10        titles.each(function (index) {
11            $(this).addClass("title-" + index);
12            $(this).addClass("menu-title");
13            $(this).append('<i class="arrow"/>');
14        });
15
16       // $('.title-1').prevAll().wrapAll('<div class="menu-body-0"/>');
17
18        //оборачиваем html с h2 до следующего h2 в div, вешаем на заголовок событие по клику
19        titles.each(function (index) {
20
21            $('.title-' + (index))
22                .nextUntil('.title-' + (index + 1))
23                .wrapAll('<div class="menu-body-' + (index) + '"/>');
24
25            if ($(this).hasClass("open")) {
26                $(this).find(".arrow").removeClass("down");
27                $(this).find(".arrow").addClass("up");
28            }
29            else {
30                $('.menu-body-' + (index))
31                    .css('display', 'none');
32                $(this).find(".arrow").removeClass("up");
33                $(this).find(".arrow").addClass("down");
34            }
35
36            $(this).click(function (elm) {
37                if ($(".menu-body-" + (index)).is(":visible")) {
38                    $(".menu-body-" + (index)).slideUp();
39                    $(this).find(".arrow").removeClass("up");
40                    $(this).find(".arrow").addClass("down");
41                }
42
43                else {
44                    $(".menu-body-" + (index)).slideDown();
45                    $(this).find(".arrow").removeClass("down");
46                    $(this).find(".arrow").addClass("up");
47                }
48            });
49        });
50
51		var action = $("#dialog-message")
52			.dialog({
53				modal: true,
54				resizable: false,
55				autoOpen: true,
56				closeOnEscape: true,
57				open: function (event, ui) {
58					$(event.target).dialog('widget')
59						.css({ position: 'fixed' })
60						.position({ my: 'center', at: 'center', of: window });
61				},
62				hide: { effect: "fade", duration: 1000 },
63				beforeClose: function () {
64					var $this = $(this);
65					$(".close").hide();
66					$(".ui-dialog").animate({
67						left: $(".conf-action:visible").offset().left + $(".conf-action:visible").width() / 2,
68						top: $(".conf-action:visible").offset().top - $(".conf-action:visible").height() / 2,
69						width: 0,  
70						height: 0,
71					}, 1000, "linear", function () {
72						$(".conf-action:visible").effect("pulsate");
73					});
74
75					$(".action").animate({
76						width: 0,
77						height: 0,
78						opacity: 0.2
79					}, 1000, "swing");
80				}
81			});
82		if (typeof action != "undefined" && action != null) {
83			$(".close").click(function () {
84				action.dialog("close");
85			});
86			setTimeout(function () { action.dialog("close"); }, 10000);
87		}
88
89		var getNoun = function (number, one, two, five) {
90			number = Math.abs(number);
91			number %= 100;
92			if (number >= 5 && number <= 20) {
93				return five;
94			}
95			number %= 10;
96			if (number == 1) {
97				return one;
98			}
99			if (number >= 2 && number <= 4) {
100				return two;
101			}
102			return five;
103		}
104		var toDouble = function (m) {
105			if (m < 10)
106				m = "0" + m;
107			return m;
108		}
109
110		var timeLeft = function (next) {
111
112			var counter = $('#counter');
113			var now = new Date(counter.attr("now"));
114			var inner = "";
115			var eventDate = new Date(counter.attr("start"));
116			var eventEnd = new Date(counter.attr("end"));
117			var locale = counter.attr("locale");
118
119			// Осталось времени
120			if (now < eventDate) {
121				var left = typeof next == "undefined" ? Math.floor((eventDate - (now)) / 1000) : next;
122				inner = timer(locale, left);
123			}
124
125			else {
126				if (now < eventEnd) {
127					inner = locale === "ru" ? "Событие началось" : "Event is going";
128					setTimeout(function () { timeLeft() }, 60000);
129				} else {
130					inner = locale === "ru" ? "Событие окончено" : "Event is over";
131				}
132			}
133			counter.html(inner);
134		}
135
136		var timer = function (locale, left) {
137
138			var days = 24 * 60 * 60;
139			var hours = 60 * 60;
140			var minutes = 60;
141
142			var next = left - 1;
143			setTimeout(function () { timeLeft(next) }, 1000);
144
145			if (left < 0) {
146				left = 0;
147			}
148			// Осталось дней
149			var d = Math.floor(left / days);
150			left -= d * days;
151
152			// Осталось часов
153			var h = Math.floor(left / hours);
154			left -= h * hours;
155
156			// Осталось минут
157			var m = Math.floor(left / minutes);
158			left -= m * minutes;
159
160			// Осталось секунд
161			var s = left;
162
163			var day = locale === "ru" ? getNoun(d, "день", "дня", "дней") : d === 1 ? "day" : "days";
164
165			return d + " " + day + " " + toDouble(h) + ":" + toDouble(m) + ":" + toDouble(s);
166
167		}
168
169		setTimeout(function () { timeLeft() }, 1000);
170
171		var menu_buttons = $(".go-to-menu");
172
173		var initMenuItems = function () {
174			var buttons = $(".go-to-menu li");
175
176			buttons.each(function () {
177				var currentLink = $(this).find('a');
178				var href = currentLink.attr("href");
179				var target = href.substr(href.indexOf("#"));
180				var $target = $(target);
181				if (!$target.length) {
182					$(this).css("display", "none");
183				}
184			});
185		}
186
187		$('img.svg').each(function () {
188			var $img = $(this);
189			var imgID = $img.attr('id');
190			var imgClass = $img.attr('class');
191			var imgURL = $img.attr('src');
192
193			$.ajax({

194				url: imgURL + '?' + Date.now(),
195				type: 'GET',
196				dataType: 'xml',
197				cache: false,
198				async: true,
199				success: function (dataSvg) {
200					// Get the SVG tag, ignore the rest
201					var $svg = $(dataSvg).find('svg');
202
203					// Add replaced image's ID to the new SVG
204					if (typeof imgID !== 'undefined') {
205						$svg = $svg.attr('id', imgID);
206					}
207					// Add replaced image's classes to the new SVG
208					if (typeof imgClass !== 'undefined') {
209						$svg = $svg.attr('class', imgClass + ' replaced-svg');
210					}
211
212					// Remove any invalid XML tags as per http://validator.w3.org
213					$svg = $svg.removeAttr('xmlns:a');
214
215					// Replace image with new SVG
216					$img.replaceWith($svg);
217				}
218			});
219		});
220
221		var clearMenuItems = function (elements) {
222			$(elements).each(function (num, obj) {
223				$(obj).find('svg.svg').css('fill', '');
224			});
225		}
226
227		var setActiveItem = function (elm) {
228			//Простит меня Господь за этот костыль
229			//Сделано, т.к. js не умеет делать addClass у svg элемента
230			var activeColor = $('.conf-top-block')
231				.css('background-color');
232			$(elm).find('svg.svg').css('fill', activeColor);
233		}
234
235		var changePositon = function () {
236			$('.menu-block').css('top', $('.show-menu').position().top + 50);
237		};
238
239		var clearActiveStyle = function () {
240			$('.show-menu').removeClass('active-show');
241			$('.menu-block').removeClass('open-menu');
242			$(".modalOverlay").remove();
243		}
244
245		var onScroll = function (e) {
246			e.preventDefault();
247			var buttons = $(".go-to-menu a");
248			var scrollPos = $(document).scrollTop();
249			var showMenuBtn = $('.show-menu');
250
251			if (showMenuBtn.is(':visible')) {
252				changePositon();
253				var window_top = $(window).scrollTop();
254				var div_top = $('.conf-list').offset().top;
255				if (window_top > div_top) {
256					showMenuBtn.addClass('stick');
257				} else {
258					showMenuBtn.removeClass('stick');
259				}
260			}
261
262			buttons.each(function () {
263				var target = this.hash;
264				var $target = $(target);
265				if ($target.length) {
266					if ($target.position().top <= scrollPos + 60 &&
267						$target.position().top + $target.height() > scrollPos) {
268						clearMenuItems(buttons);
269						setActiveItem(this);
270					} else {
271						clearMenuItems(this);
272					}
273				}
274			});
275
276		}
277
278		initMenuItems();
279
280		$(document).on('scroll', onScroll);
281
282		var openMenuBtn = $('div.show-menu');
283		var menuBlock = $('div.menu-block');
284		var overlay = '.modalOverlay';
285
286		$(openMenuBtn).on('click', function (e) {
287			changePositon();
288			if (openMenuBtn.hasClass('active-show')) {
289				clearActiveStyle();
290			}
291			else {
292				openMenuBtn.addClass('active-show');
293				menuBlock.addClass('open-menu');
294				$("body").append('<div class="modalOverlay"></div>');
295			}
296			e.preventDefault();
297		});
298
299		$(document).on('click touchstart', overlay, function () {
300			if (openMenuBtn.hasClass('active-show')) {
301				clearActiveStyle();
302			}
303		});
304		$(document).on('click touchstart', ".header", function () {
305			if (openMenuBtn.hasClass('active-show')) {
306				clearActiveStyle();
307			}
308		});
309
310		$(menu_buttons).on('click', 'a', function (e) {
311			var currentLink = $(this);
312			var target = currentLink.attr("href");
313			var $target = $(target);
314			var buttons = $(".go-to-menu li");
315
316			e.preventDefault();
317			$(document).off('scroll');
318			clearMenuItems(buttons);
319			setActiveItem(this);
320
321			if ($target.length) {
322				$('html, body').stop().animate({
323					'scrollTop': $target.offset().top - 58
324				}, 900, 'swing', function () {
325					$(document).on("scroll", onScroll);
326				});
327			}
328
329		});
330
331		$(menu_buttons).on('click', '.hint', function (e) {
332			var currentLink = $(this).parent().find('a');
333			var target = currentLink.attr("href");
334			var $target = $(target);
335			var buttons = $(".go-to-menu li");
336
337			e.preventDefault();
338			$(document).off('scroll');
339			clearMenuItems(buttons);
340			setActiveItem(currentLink);
341
342			if ($target.length) {
343				$('html, body').stop().animate({
344					'scrollTop': $target.offset().top - 58
345				}, 900, 'swing', function () {
346					$(document).on("scroll", onScroll);
347				});
348			}
349
350		});
351
352		if (openMenuBtn.is(':visible')) {
353			clearActiveStyle();
354		}
355
356		var resizeBlocks = function () {
357			if (innerWidth > 450 && innerWidth < 1024 && !isResizedBlock) {
358				setTimeout(function () {
359					resizeBlock('.news-item');
360					resizeBlock('.talk');
361				}, 0.5)
362
363			}
364			else {
365				setTimeout(function () {
366					clearResize('.news-item');
367				},
368					0.5);
369			}
370		};
371
372		var latestEventDataBlock = $('.latest-event-data');
373		var setLatestEventData = function (id) {
374			$.ajax('/latestEvent/' + lang + '/' + id + '?' + Date.now(), {
375				type: 'GET',
376				cache: false,
377				dataType: 'html',
378				async: true,
379				timeout: 1000
380			})
381				.done(function (data) {
382					latestEventDataBlock.fadeOut('slow', function (e) { latestEventDataBlock.html(data); });
383					latestEventDataBlock.fadeIn('slow', function (e) {
384						if (innerWidth > 450) {
385							resizeBlock('.talk');
386						}
387					});

388				});
389		};
390
391
392		$(".time").each(function (index, item) {
393			var curItem = $(item);
394
395			var date = new Date(curItem.attr("time"));
396			//date.setDate(date.getDate() + 1);
397			var dd = date.getDate();
398			var mm = date.getMonth() + 1; //January is 0!
399
400			var yyyy = date.getFullYear();
401			if (dd < 10) {
402				dd = '0' + dd;
403			}
404			if (mm < 10) {
405				mm = '0' + mm;
406			}
407			var stringDate = dd + '.' + mm + '.' + yyyy;
408
409			curItem.html(stringDate);
410		});
411		$(".exp-date").show();
412   
413    });
414});
415