https://www.turning-down-the-noise.info/wp-content/themes/tdtnfasw/library/js/scripts.js

1/*
2Bones Scripts File
3Author: Eddie Machado
4
5This file should contain any js scripts you want to add to the site.
6Instead of calling it in the header or throwing it inside wp_head()
7this file will be called automatically in the footer so as not to
8slow the page load.
9
10*/
11
12// IE8 ployfill for GetComputed Style (for Responsive Script below)
13if (!window.getComputedStyle) {
14	window.getComputedStyle = function(el, pseudo) {
15		this.el = el;
16		this.getPropertyValue = function(prop) {
17			var re = /(\-([a-z]){1})/g;
18			if (prop == 'float') prop = 'styleFloat';
19			if (re.test(prop)) {
20				prop = prop.replace(re, function () {
21					return arguments[2].toUpperCase();
22				});
23			}
24			return el.currentStyle[prop] ? el.currentStyle[prop] : null;
25		}
26		return this;
27	}
28}
29
30function updateViewportDimensions() {
31	var w=window,d=document,e=d.documentElement,g=d.getElementsByTagName('body')[0],x=w.innerWidth||e.clientWidth||g.clientWidth,y=w.innerHeight||e.clientHeight||g.clientHeight;
32	return { width:x,height:y }
33}
34// setting the viewport width
35var viewport = updateViewportDimensions();
36
37// as the page loads, call these scripts
38jQuery(document).ready(function($) {
39	
40	// add all your scripts here
41	
42	initKeys();
43	
44	$(".draggable").draggable({ 
45		containment: "body"
46	});
47	
48	$(window).load(function() {
49		initThumbs();
50		$('#intro-header').waypoint(function() {
51			endScatter();
52		});
53		resizeDrawings();
54	});
55	
56	$(window).resize(function() {
57		resizeIntro();
58		repositionThumbs();
59		initThumbs();
60		resizeDrawings();
61	});
62	
63	var scrolled = false;
64	var scattering = false;
65	
66	$(window).scroll(function() {
67		if(!scrolled) {
68			startScatter();
69			scrolled = true;
70		}
71	});
72	
73	function startScatter() {
74		if(!scattering) {
75			scattering = true;
76			//alert('scatter');
77			interval = setInterval(function(){
78					initThumbs();
79			},100);
80		}
81	}
82	
83	function endScatter() {
84		timer = setTimeout(function(){
85			clearInterval(interval);
86			scattering = false;
87			clearTimeout(timer);
88		},2000);
89	}
90	
91	resizeIntro();
92	
93	$('#close a').click(function(event){
94		if ( !$('body').hasClass('single')) {
95			event.preventDefault();
96			closeLayer();
97		}
98	});
99	
100	function closeLayer() {
101		$('#layer-content').html('');
102		$('#layer').fadeOut(300);
103		$('#close').fadeOut(300);
104		$('body').removeClass('noscroll');
105		//window.history.pushState({}, '', myhome);
106	}
107	
108	var myhome;
109	
110	$('.persona-link').click(function(event){
111		event.preventDefault();
112		var mylink = $(this).attr('href');
113		myhome = $(location).attr('href');
114		$('#layer').fadeIn(300);
115		$('#close').fadeIn(300);
116		$('#layer-content').load(mylink + ' #content', function() {
117			resizeDrawings();
118		});
119		$('body').addClass('noscroll');
120		//window.history.pushState({}, '', mylink);
121	});
122	
123	function initThumbs() {
124		var viewport = updateViewportDimensions();
125		if( viewport.width >= 768 ) {
126			var mintop = viewport.height; //$('#intro').height();
127			var textpos = $('#text-section').position();
128			var maxtop = textpos.top + $('#text-section').height();
129			var minleft = 0;
130			var mywidth = viewport.width; //$('body').width();
131			$('.portrait-thumb').each(function(){
132				var maxleft = mywidth - $(this).width();
133				var randtop = Math.floor(Math.random() * (maxtop - mintop + 1)) + mintop;
134				var randleft = Math.floor(Math.random() * (maxleft - minleft + 1)) + minleft;
135				$(this).css('position', 'absolute').css('top', randtop).css('left', randleft);
136				$(this).show();
137				$(this).draggable('enable');
138			});
139		} else {
140			$('.portrait-thumb').each(function(){
141				$(this).css('position', 'relative').css('top', 0).css('left', 0);
142				$(this).draggable('disable');
143			});
144		}
145		/*$('.portrait-thumb').each(function(){
146			$(this).show();
147		});*/
148	}
149	
150	function resizeIntro() {
151		var height = $(window).innerHeight();
152		$('#intro').css('height', height);
153		$('body').show();
154	}
155	
156	$('#intro').click(function() {
157		var body = $("html, body");
158		var height = $(window).innerHeight();
159		startScatter();
160		body.animate({scrollTop:height}, '500', 'swing', function() { 
161			endScatter();
162		   //alert("Finished animating");
163		});
164	});
165	
166	function repositionThumbs() {
167		$('.portrait-thumb').each(function(){
168			var mypos = $(this).position();
169			var maxleft = $('body').width() - $(this).width();
170			if (mypos.left > maxleft) {
171				$(this).css('left', maxleft);
172			}
173			
174		});
175	}
176	
177	function resizeDrawings() {
178		var viewport = updateViewportDimensions();
179		var mywidth = viewport.width,
180			myheight = viewport.height;
181		if (mywidth < 768) {
182			// RESET
183			$('.drawings').find('img').each(function(){
184				$(this).css('height', '').removeClass('fitheight').removeClass('fitwidth');
185				$('.person-text').css('width', '');			
186			});
187		} else {
188			var	screenHeight = myheight,
189				slideHeight = myheight - 100,
190				slideWidth = $('.drawings').width(),
191				slideProportion = slideWidth / slideHeight;
192				//console.log(slideProportion);
193			var firstPoportion = $('.drawings').find('img').first().attr('width') / $('.drawings').find('img').first().attr('height');
194			$('.drawings').find('img').each(function(){
195				var imgWidth = $(this).attr('width'),
196					imgHeight = $(this).attr('height'),
197					imgProportion = imgWidth / imgHeight;
198					//console.log(imgProportion);
199				$(this).removeClass('fitheight').removeClass('fitwidth');
200				if( imgProportion <= slideProportion) { 
201					$(this).addClass('fitheight').css('height', slideHeight);
202				} else {
203					$(this).addClass('fitwidth').css('height', '');
204				}
205				$('.person-text').css('max-width', slideHeight * firstPoportion );
206			});
207		}
208	}
209	
210	/*$.fn.fitText = function( kompressor, options ) {
211	// Setup options
212		var compressor = kompressor || 1,
213		settings = $.extend({
214			'minFontSize' : Number.NEGATIVE_INFINITY,
215			'maxFontSize' : Number.POSITIVE_INFINITY
216		}, options);
217		return this.each(function(){
218			// Store the object
219			var $this = $(this);
220			// Resizer() resizes items based on the object width divided by the compressor * 10
221			var resizer = function () {
222				$this.css('font-size', Math.max(Math.min($this.width() / (compressor*10), parseFloat(settings.maxFontSize)), parseFloat(settings.minFontSize)));
223			};
224			// Call once to set.
225			$(window).load(function(){
226				resizer();
227			});
228			// Call on resize. Opera debounces their resize by default.
229			$(window).on('resize.fittext orientationchange.fittext', resizer);
230		});
231	};
232	*/
233	
234	//fitTheText();
235	
236	/*function fitTheText() {
237	
238		$('.persona-text').fitText(0.9, { minFontSize: '10px', maxFontSize: '28px' });
239		$('.click-to-open').fitText(0.9, { minFontSize: '8px', maxFontSize: '12px' });
240	
241	}*/
242	
243	function initKeys() {
244		$('body').keydown(function(e) {
245			if (e.keyCode == 37) { 
246				// left
247			}
248			else if (e.keyCode == 39) {
249				// right
250			}
251			else if (e.keyCode == 27) {
252				// esc
253				closeLayer();
254			}
255		});
256	}
257	
258 
259}); /* end of as page load scripts */
260
261
262/*! A fix for the iOS orientationchange zoom bug.
263 Script by @scottjehl, rebound by @wilto.
264 MIT License.
265*/
266(function(w){
267	// This fix addresses an iOS bug, so return early if the UA claims it's something else.
268	if( !( /iPhone|iPad|iPod/.test( navigator.platform ) && navigator.userAgent.indexOf( "AppleWebKit" ) > -1 ) ){ return; }
269	var doc = w.document;
270	if( !doc.querySelector ){ return; }
271	var meta = doc.querySelector( "meta[name=viewport]" ),
272		initialContent = meta && meta.getAttribute( "content" ),
273		disabledZoom = initialContent + ",maximum-scale=1",
274		enabledZoom = initialContent + ",maximum-scale=10",
275		enabled = true,
276		x, y, z, aig;
277	if( !meta ){ return; }
278	function restoreZoom(){
279		meta.setAttribute( "content", enabledZoom );
280		enabled = true; }
281	function disableZoom(){
282		meta.setAttribute( "content", disabledZoom );
283		enabled = false; }
284	function checkTilt( e ){
285		aig = e.accelerationIncludingGravity;
286		x = Math.abs( aig.x );
287		y = Math.abs( aig.y );
288		z = Math.abs( aig.z );
289		// If portrait orientation and in one of the danger zones
290		if( !w.orientation && ( x > 7 || ( ( z > 6 && y < 8 || z < 8 && y > 6 ) && x > 5 ) ) ){
291			if( enabled ){ disableZoom(); } }
292		else if( !enabled ){ restoreZoom(); } }
293	w.addEventListener( "orientationchange", restoreZoom, false );
294	w.addEventListener( "devicemotion", checkTilt, false );
295})( this );