﻿//
// Layout.js - Site-wide functions.
//

// HTML5 Helper for Older Browsers
var HTML5_TAGS = 'article,aside,bdi,command,details,summary,figure,figcaption,footer,header,hgroup,mark,meter,nav,progress,ruby,rt,rp,section,time,wbr,audio,video,source,embed,track,canvas,datalist,keygen,output'.split(/,/);
for (var i in HTML5_TAGS) { document.createElement(HTML5_TAGS[i]); }

// Console Helper for IE
if (typeof console == 'undefined') console = { log: function() { }, warn: function() { }, error: function() { } };
if (typeof console.debug == 'undefined') console.debug = function(m) { console.log(m); };

var Layout = {

	ready: function() {
		this.applyBannerCorners();
		this.applyCorners();
		this.applyHorizontalRules();
		this.applyDevFormatting();
		this.applyEdits();

		this.indexNewsletter();

		if ($('#MainInner > .Newsletter').length) {
			this.wireScrollBuddy('#SideInner');
		}

		return;

		var $sidebar = $('.xmobile #Side');

		if (($sidebar.text().replace(/^\s|\s$/), '') == '') {
			$sidebar.hide();
			return;
		}

		/*
		$sidebar.each(function() {
		this.hide = function() {
		var $this = $(this);
		if ($this.hasClass('hidden')) return;
		alert($this.position());
		var isLeft = ($this.position().left < 5);
		var width = $this.width();
		$this.animate({
		left: isLeft ? '-=' + width + 'px' : 'auto',
		right: !isLeft ? '-=' + width + 'px' : 'auto',
		opacity: .5
		}, function() {
		$this.addClass('hidden');
		});
		}
		this.hide();
		});
		return;
		*/

		var hide = function() {
			var $this = $(this);
			if ($this.hasClass('hidden')) return false;
			var isLeft = ($this.position().left < 5);
			var width = $this.outerWidth();
			width -= 10;
			this.move = width;
			$this.animate({
				left: '-=' + width + 'px',
				//left: isLeft ? '-=' + width + 'px' : 'auto',
				//right: !isLeft ? '-=' + width + 'px' : 'auto',
				opacity: .5
			}, function() {
				$this.addClass('hidden');
			});
		}
		var show = function() {
			var $this = $(this);
			if (!$this.hasClass('hidden')) return false;
			var isLeft = ($this.position().left < 5);
			isLeft = true;
			$this.css('display', 'block').animate({
				display: 'block',
				//left: isLeft ? '0' : 'auto',
				//right: !isLeft ? '0' : 'auto',
				left: '+=' + this.move + 'px',
				//right: !isLeft ? '0' : 'auto',
				opacity: 1
			}, function() {
				$this.removeClass('hidden');
			});
		}
		var onclick = function(e) {
			var $this = $(this);
			if ($this.hasClass('hidden')) {
				$this[0].show();
			} else {
				//$this[0].hide();
			}
			e.preventDefault();
		}

		$sidebar.addClass('autohide').each(function() {
			this.hide = hide;
			this.show = show;
			$(this).click(onclick);
			this.hide();
		});

		$('body').click(function(e) {
			return $sidebar[0].hide();
		});

		/*
		$('#main-menu .AspNet-Menu > li > a').each(function() {
		var $this = $(this);
		if ($this.text().match(/Log/)) $this.text('Log');
		if ($this.text().match(/Tips/)) $this.text('Tips');
		if ($this.text().match(/Status/)) $this.text('Status');
		});
		*/

	},

	applyEdits: function() {
		$('body.public del').remove();
		$('body.public ins').each(function() {
			$(this).before($(this).html()).remove();
		});
	},

	applyHorizontalRules: function() {
		$("#Side, #Main").find("h3:not(:first), article:not(:first)").each(function() {
			$(this).before('<div class="HR"/>');
		});
	},

	applyBannerCorners: function() {
		this.applyCorners("#Main .Banner");
	},

	applyCorners: function(selector) {
		var script = this;
		var genericClass = '.cornered';
		if (!selector) {
			$(genericClass).each(function() {
				script.applyCorners(this);
			});
			return;
		}
		var $selection = $(selector);
		if (!$selection.length) return;
		if ($selection[0].tagName == 'IMG') {
			var $img = $selection;
			var $block = $('<div/>');
			$img.replaceWith($block);
			$block.append($img);
			$(['position', 'float', 'margin-left', 'margin-top', 'margin-right', 'margin-bottom']).each(function(i, v) {
				$block.css(v, $img.css(v));
			});
			$img.css({
				position: 'static',
				float: 'none',
				margin: 0
			});
			if (!$img.width()) {
				$img.load(function() {
					script.applyCorners(this);
				});
				return;
			}
			$block.width($img.width());
			$block.height($img.height());
			$block.offset($img.offset());
			//console.warn($img.css());
		} else {
			$block = $selection;
		}
		//$block.css({ position: 'relative' });
		var $corners = $('<div class="Corners"/>').appendTo($block);
		$('<div class="TopLeft"/>').appendTo($corners);
		$('<div class="TopRight"/>').appendTo($corners);
		$('<div class="BottomLeft"/>').appendTo($corners);
		$('<div class="BottomRight"/>').appendTo($corners);
		$corners.click = function() {
			//$(this).parent().find("a").eq(0).click();
		};
	},

	applyDevFormatting: function() {
		$("a.TBD").click(function() {
			alert("Link TBD");
		}).css({
			//fontStyle: "italic",
			color: "red"
		});
	},

	indexNewsletter: function() {
		var $list = $('#SideInner h3:eq(1) + ul');
		if (!$list.find('li').length) {
			$('.Newsletter article').each(function() {
				var $article = $(this);
				$('<li/>').append($('<a/>').text($article.find('h1').text()).attr('href', '#' + $article.attr('id'))).appendTo($list);
			});
		}
	},

	wireScrollBuddy: function(tag) {
		var delay = 50;
		var transition = 500;
		var $div = $(tag);
		$div[0].lineUp = $div[0].lineUp || function() {
			var $window = $(window);
			var scrollTop = $window.scrollTop();
			var offsetTop = $div[0].originalOffset;
			console.warn(scrollTop + ':' + offsetTop);
			var newTop = (scrollTop > offsetTop) ? (scrollTop - offsetTop) : 0;
			//console.warn(newTop + ':' + move);
			//console.warn('Move: ' + move);
			//return;
			$div.stop().animate({
				top: newTop + 'px'
			}, transition);
			/*
			$div.offset({
			left: offset.left,
			top: scrollTop
			});
			*/
		}
		$(window).scroll(function() {
			var $div = $(tag);
			clearTimeout($div[0].to);
			var $div = $(tag);
			$div[0].to = setTimeout(function() { $div[0].lineUp(); }, delay);
		});
		$div[0].originalOffset = $div.offset().top;
		$div.css({ position: 'relative' });
	}

};
$(document).ready(function() { Layout.ready(); });

