clientele = {
  Typography : function() {}
}

clientele.Typography = function() {
  // The swapped-in image filenames will be generated from an attribute in the wrapping elements tag.

  // The following attributes specify how the replaced text tags are selected, how the 
  // corresponding image tag is constructed.
  
  // For instance, the tag:
  // <h1 class="swap" title="Best of Times">It was the best of times, it was the worst of times</h1>
  //   ...will get automatically replaced with the image at path:
  //     /images/heading-best-of-times.png
  this.REPLACED_TEXT_SELECTOR = '.swap'
  this.EMBEDDED_FILENAME_ATTRIBUTE = 'title'
  this.IMAGE_DIRECTORY = '/websites/eds/images';
  this.IMAGE_PREFIX = 'hdr-';
  this.IMAGE_SUFFIX = '.png';
  this.LINE_HEIGHT_TO_FONT_SIZE_RATIO = 1.2;

  this.swapHeadings();
  $('#banner-nav, .button').supersleight();
}

clientele.Typography.prototype.swapHeadings = function() {
  var t = this;
  $(t.REPLACED_TEXT_SELECTOR).each(function() {
    var swap_element = this;

    var title = $(this).attr(t.EMBEDDED_FILENAME_ATTRIBUTE);
    
    // If there is no title specified, use the text itself.
    if (!title.match(/\S/)) {
      title = $(this).html();
    }

    var line_height = parseFloat($(this).css('line-height'));
    var text_height = $(this).height();
    //  alert('line ' + line_height + ' text ' + text_height);

    if ($(this).get(0).tagName == 'SPAN'){
      $(this).css('display', 'block');
    }
    
    var multi_line = false;
    // Handle these edge cases:
    //  1) The live text wraps to two lines but gets replaced with a single-line graphic
    //     - In this case, we want to remove the extra block space that would have been left by the wrapped live text
    //  2) The graphic heading is known to contain multiple lines (signified by the "wrapped-N" class)
    //     - In this case, we need to make sure the live block will be tall enough to accomodate the graphic,
    //       whether or not the live text wrapped
    var classes = $(this).attr('class').split(' ');
    $.each( classes, function(index, item){
        if (item.match(/wrapped/)) {
          var num_lines = parseInt(item.split('-')[1]);
          if (num_lines == undefined){
            num_lines = 2;
          }
          text_height = num_lines * line_height;
//          alert('line: ' + line_height + 'text: ' + text_height);
          multi_line = true;
        }
    });

    if (!multi_line && (text_height > line_height)) {
      text_height = line_height;
    }
    
    image_path = t.titleToImagePath(title)

    var position = 'top left'

    if ($(this).get(0).tagName == 'LABEL'){
      position = 'center right'
    }

    if ($(this).hasClass('center')){
      position = 'top center';
    }

    if ($(this).hasClass('top-right')){
      position = 'top right';
    }
    
    if (image_path){
      $(this).html("&nbsp;").css('line-height', 0);
      $(this).css('background', 'transparent url(' + image_path + ') no-repeat ' + position);
      if (text_height > 0){
        $(this).height(0).css('padding-top', text_height);
      };
    };
  });
}

clientele.Typography.prototype.titleToImagePath = function(title) {
  if (title == ""){
    return false;
  }
  clean_title = title.replace("'", '').replace('&amp;', 'and').replace('&', 'and');
  var words = clean_title.toLowerCase().split(/ /);

  var path_token = words.join('-')
  var image_path = this.IMAGE_DIRECTORY + "/" + this.IMAGE_PREFIX + path_token + this.IMAGE_SUFFIX;
  return image_path;
}


/* ------------------------------------------------------------
 * supersleight: jQuery plugin for dynamic handling of IE6 png transparency
 * ------------------------------------------------------------ 
 */
jQuery.fn.supersleight = function(settings) {
	settings = jQuery.extend({
		imgs: true,
		backgrounds: true,
    shim: '/websites/eds/images/transparent.gif',
		apply_positioning: false
	}, settings);
	
	return this.each(function(){
		if (jQuery.browser.msie && parseInt(jQuery.browser.version, 10) < 7 && parseInt(jQuery.browser.version, 10) > 4) {
			jQuery(this).find('*').andSelf().each(function(i,obj) {
				var self = jQuery(obj);
				// background pngs
				if (settings.backgrounds && self.css('background-image').match(/\.png/i) !== null) {
					var bg = self.css('background-image');
					var src = bg.substring(5,bg.length-2);
					var mode = (self.css('background-repeat') == 'no-repeat' ? 'crop' : 'scale');
    			var styles = {
            'background' : 'none',
    				'filter': "progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=image, src='" + src + "')"
    		  };
					self.css(styles);
				};
				// image elements
				if (settings.imgs && self.is('img[src$=png]')){
					var styles = {
            'background' : 'none',
						'filter': "progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=image, src='" + self.attr('src') + "')"
					};
          self.css(styles).attr('src', settings.shim);
				};
				// apply position to 'active' elements
				if (settings.apply_positioning && self.is('a, input') && (self.css('position') === '' || self.css('position') == 'static')){
					self.css('position', 'relative');
				};
			});
		};
	});
};