// A few simple plugins that do cool effects.
// Dependencies: yi.jquery.js
(function($){

// Quickie jQuery drop shadows, based on http://alistapart.com/articles/onionskin/
// The outermost div needs some way to contract onto the original element: float, position:absolute, or
// fixing the width of both all work. attr is a hash to be applied to the outer div; some possiblilities include
// {className: 'class-with-appropriate-style'} , {id: 'ditto'}, {style: {float: 'left'}}, {style: {width: '100px'}}
// Need to remove any existing floatingness; floats inside floats look real weird.
$.fn.cheapDropShadow = $.extend(function(opts){
  opts = $.extend({}, arguments.callee['default'], opts);
  return this.each(function(){
    var outerdiv = $.DIV(opts, ['div',{},['div',{}]]).addClass('dropshadow');
    this.oldFloat = $(this).css('float');
    $(this).css({float: 'none'}).wrap(outerdiv);
  });
},{ //option sets
  'default' : {},
  right:  {style: {float: 'right'}},
  left: {style: {float: 'left'}}
}); // dropshadow

// remove the drop shadow div's.
$.fn.undoDropShadow = function(){
  return this.each(function(){
    var shadow = $(this).parents('div.dropshadow');
    if (shadow.length == 0) return;
    shadow[0].parentNode.replaceChild(this, shadow[0]);
    if (this.oldFloat) $(this).css('float', this.oldFloat);
  });
}; // undoDropShadow 

// Quickie text-embossing, based on http://www.cssplay.co.uk/mozilla/shadow_text.html
// adds a 1-pixel black copy behind and one pixel above and left of the item.
// Options:
// light: {Boolean} If true, adds a 1-pixel white copy behind and one pixel below and right of the item. Default: false
// center; {Boolean} If true, centers the items in the container. Default: false (DO NOT set text-align:center, since IE and standards interpret them differently)
$.fn.emboss = $.extend(function(opts){
  opts = $.extend({}, arguments.callee['default'], opts);
  return this.each(function() {
    var textDir = 'left';
    var lightDir = 1; // this makes sure the apparent light comes from the left, no matter what the text dir is
    if ($(this).css('direction') == 'rtl'){
      textDir = 'right';
      lightDir = -1;
    }
    var w = $(this).width();
    // need margin of zero of we come up against the IE vs. standard box model problem
    // display: block allows the line to move up and down
    $(this).css({margin: '0', display: 'block'}).wrap ('<div style="position:relative;"></div>');
    $(this.parentNode).css('height', $(this).height()+'px');
    var center = opts.center ? ($(this).width()-w)/2-0.5 : 0; // distance to move to center it (when we switch to display:block it fills the container
    var shadow=this.cloneNode(true);
    $(this)
      .before($(shadow).css({color: 'black',position: 'absolute', top: '-1px'}).css(textDir, (center-lightDir)+'px'))
      .css({position: 'absolute', top: '0'}).css(textDir, (center)+'px');
    if (opts.light){
      var light=this.cloneNode(true);
      $(this).before($(light).css({color: 'white',position: 'absolute', top: '1px'}).css(textDir, (center+lightDir)+'px'));
    }
  });
},{ // option sets
  'default' : {light: false, center: false},
  center: {center: true},
  light: {light: true}
}); // emboss
})(jQuery); // end custom alias