https://hodogaya-zaitaku.net/assets/js/main.js

1/*
2	Hypothesis by Pixelarity
3	pixelarity.com | [email protected]
4	License: pixelarity.com/license
5*/
6
7(function($) {
8
9	var	$window = $(window),
10		$body = $('body'),
11		$header = $('#header'),
12		$banner = $('#banner');
13
14	// Breakpoints.
15		breakpoints({
16			xlarge:   [ '1281px',  '1680px' ],
17			large:    [ '981px',   '1280px' ],
18			medium:   [ '737px',   '980px'  ],
19			small:    [ '481px',   '736px'  ],
20			xsmall:   [ '361px',   '480px'  ],
21			xxsmall:  [ null,      '360px'  ]
22		});
23
24	// Play initial animations on page load.
25		$window.on('load', function() {
26			window.setTimeout(function() {
27				$body.removeClass('is-preload');
28			}, 100);
29		});
30
31	// Scrolly.
32		$('.scrolly').scrolly({
33			offset: function() { return $header.height() - 5; }
34		});
35
36	// Header.
37		if ($banner.length > 0
38		&&	$header.hasClass('alt')) {
39
40			$window.on('resize', function() { $window.trigger('scroll'); });
41
42			$banner.scrollex({
43				bottom:		$header.outerHeight(),
44				terminate:	function() { $header.removeClass('alt'); },
45				enter:		function() { $header.addClass('alt'); },
46				leave:		function() { $header.removeClass('alt'); $header.addClass('reveal'); }
47			});
48
49		}
50
51	// Dropdowns.
52		$('#nav > ul').dropotron({
53			alignment: 'right',
54			hideDelay: 350,
55			baseZIndex: 100000
56		});
57
58	// Menu.
59		$('<a href="#navPanel" class="navPanelToggle">Menu</a>')
60			.appendTo($header);
61
62		$(	'<div id="navPanel">' +
63				'<nav>' +
64					$('#nav') .navList() +
65				'</nav>' +
66				'<a href="#navPanel" class="close"></a>' +
67			'</div>')
68				.appendTo($body)
69				.panel({
70					delay: 500,
71					hideOnClick: true,
72					hideOnSwipe: true,
73					resetScroll: true,
74					resetForms: true,
75					target: $body,
76					visibleClass: 'is-navPanel-visible',
77					side: 'right'
78				});
79
80	// Banner.
81		if ($banner.length > 0) {
82
83			// Edge + IE: Workaround for object-fit.
84				if (browser.name == 'edge'
85				||	browser.name == 'ie') {
86
87					var $video = $banner.find('video'),
88						v = $video[0],
89						t, f;
90
91					// Handler function.
92						var f = function() {
93
94							var w = v.videoWidth, h = v.videoHeight,
95								pw = $window.width(), ph = $window.height(),
96								nw, nh, x;
97
98							// Calculate new width, height.
99								if (pw > ph) {
100
101									nw = pw;
102									nh = (nw / w) * h;
103
104								}
105								else {
106
107									nh = ph;
108									nw = (nh / h) * w;
109
110								}
111
112							// Set width, height.
113								if (nw < pw) {
114
115									v.style.width = '100vw';
116									v.style.height = 'auto';
117
118								}
119								else
120									v.style.width = nw + 'px';
121
122								if (nh < ph) {
123									v.style.height = '100vh';
124									v.style.width = 'auto';
125								}
126								else
127									v.style.height = nh + 'px';
128
129							// Set position (bottom-right).
130								v.style.top = v.style.bottom = v.style.left = v.style.right = 'auto';
131								v.style.bottom = '0';
132								v.style.right = '0';
133
134						};
135
136					// Do an initial call of the handler.
137						(f)();
138
139					// Add event listeners.
140						$window.on('resize load', function() {
141
142							clearTimeout(t);
143
144							t = setTimeout(f, 125);
145
146						});
147
148				}
149
150		}
151
152	// Tabs.
153		$('.tabs').selectorr({
154			titleSelector: 'h3',
155			delay: 250
156		});
157
158})(jQuery);