// Miscellaneous useful functions

// Log the current jQuery selection to the Firebug console.
// Taken from http://happygiraffe.net/blog/articles/2007/09/26/jquery-logging
// Use in the middle of a jQuery chain, e.g.,
//   $(root).find('li.source > input:checkbox').log("sources to uncheck").removeAttr("checked");
// "The nice thing about logging to firebug is that each node becomes
// clickable in the console, so you can immediately see the context."

$.fn.log = function (msg) {
    console.log("%s: %o", msg, this);
    return this;
};

$.fn.customFadeIn = function(speed, callback) {
	$(this).fadeIn(speed, function() {
		if($.browser.msie)
			$(this).get(0).style.removeAttribute('filter');
		if(callback !== undefined)
			callback();
	});
};
$.fn.customFadeOut = function(speed, callback) {
	$(this).fadeOut(speed, function() {
		if($.browser.msie)
			$(this).get(0).style.removeAttribute('filter');
		if(callback !== undefined)
			callback();
	});
};

// jquery 1.3.2 only returns the DOM element for these - override it to return the original object
$.fn.appendTo = function(parent) {
    $(parent).append(this);
    return this;
};
$.fn.prependTo = function(parent) {
    $(parent).prepend(this);
    return this;
};
$.fn.insertBefore = function(parent) {
    $(parent).before(this);
    return this;
};
$.fn.insertAfter = function(parent) {
    $(parent).after(this);
    return this;
};

// Function for standardizing the creation of dom elements
// type can be div, span, etc.
// ex: $.make('div', {id: 'coziDiv'});
$.extend($, {
    // don't use $.make for radio buttons - use $.makeRadioButton(group, value)
    make: function(type, attributes)
    {
        var element = $(document.createElement(type));
        if(attributes)
        {
            $.each(attributes, function(attr, value)
                {
                    element.attr(attr, value);
                });
        }
        return element;
    },
    makeClearingDiv: function()
    {
        return $.make('div').css({clear: 'both', 'float': 'none'});
    },
    // IE barfs if radio button isn't created with type and name initially
    makeRadioButton: function(group, value)
    {
        return $('<input type="radio" name=' + group + ' value=' + value + '/>');
    }
});

// :visible will return a false positive if it is hidden because a parent is hidden
// see: http://remysharp.com/2008/10/17/jquery-really-visible/
$.extend(
  $.expr[ ":" ], 
  { reallyVisible : function (a) { return !($(a).is(':hidden') || $(a).parents(':hidden').length); }}
);

/****************************************************/
/** Taken from jquery.imageCorners.js in webclient scripts **/
/****************************************************/
$.fn.imageCorners = function( options ) {
    var settings =
        {   // defaults
            dir_name    : null,     // directory and start of the name of the image files.
                                    // Images are made up of 3 files 8 panel grid (must follow this naming scheme) :
                                        // one containing all four corners (_full.png)
                                        // another with the sides (_horizontal.png)
                                        // and another with the top and bottom (_vertical.png)
                                      // 4 panel grid only requires one image (_4Panel.png)
            fourPanel      : true,    // whether to use a 4 panel grid or the default 8 panel (requies a different image type)
            // these change how big the divs are
            sideDivWidth   : 18, // only right side with 4 panel layouts
            topDivHeight   : 18, // not used with 4 panel layouts
            bottomDivHeight: 18,
            // these change how far the divs are "pulled" out of the parent container
            topHeight      : 18, // full height of top (including shadow, border, inside space)
            sideWidth      : 18, // full width of side (including shadow, border, inside space)
            bottomHeight   : 18  // full height of bottom (including shadow, border, inside space)
        };

    if ( options )
    {
        $.extend(settings, options);
    }

    var $box = $(this);

    var dir_name = settings.dir_name;

    // Size Vars
    var topDivHeight = settings.topDivHeight;
    var sideDivWidth = settings.sideDivWidth;
    var bottomDivHeight = settings.bottomDivHeight;

    // Strings from size vars
    var zeroPxStr = '0px';

    var topHeightStr = settings.topHeight + 'px';
    var topPosStr = '-' + topHeightStr;

    var sideWidthStr = settings.sideWidth + 'px';
    var sidePosStr = '-' + sideWidthStr;

    var bottomHeightStr = settings.bottomHeight + 'px';
    var bottomPosStr = '-' + bottomHeightStr;

    //urls - if no dir name, image location will be done in CSS
    var imageUrl = '';
    if(dir_name)
        imageUrl = settings.fourPanel ? 'url("' + dir_name + '_4Panel.png")' : 'url("' + dir_name + '_Full.png")';

    var $imageBox = $.make('div')
        .addClass('ImageCorners')
        .prependTo( $box )
        .css({
            position: 'absolute',
            top: topPosStr,
            bottom: bottomPosStr,
            left: sidePosStr,
            right: sidePosStr
         });

    var topLeft = $.make('div')
        .css({
            background: 'top left no-repeat',
            'background-image': imageUrl,
            position: 'absolute',
            height: topDivHeight,
            width: sideDivWidth,
            top: zeroPxStr,
            left: zeroPxStr })
        .appendTo( $imageBox );

    var topRight = $.make('div')
        .css({
            background: 'top right no-repeat',
            'background-image': imageUrl,
            position: 'absolute',
            height: topDivHeight,
            width: sideDivWidth,
            top: zeroPxStr,
            right: zeroPxStr })
        .appendTo( $imageBox );

    var bottomLeft = $.make('div')
        .css({
            background: 'bottom left no-repeat',
            'background-image': imageUrl,
            position: 'absolute',
            height: bottomDivHeight,
            width: sideDivWidth,
            bottom: zeroPxStr,
            left: zeroPxStr })
        .appendTo( $imageBox );

    var bottomRight = $.make('div') //bottom right is the same in 4 or 8 panel layouts
        .css({
            background: 'bottom right no-repeat',
            'background-image': imageUrl,
            position: 'absolute',
            height: bottomDivHeight,
            width: sideDivWidth,
            bottom: zeroPxStr,
            right: zeroPxStr })
        .appendTo( $imageBox );


    if (settings.fourPanel)
    {
        topLeft.css({
            right: sideDivWidth,
            bottom: bottomDivHeight,
            width: 'auto',
            height: 'auto'
        });
        topRight.css({
            bottom: bottomDivHeight,
            height: 'auto'
        });
        bottomLeft.css({
            right: sideDivWidth,
            width: 'auto'
        });
    }
    else
    {
        var horizontalUrl = 'url("' + dir_name + '_Horizontal.png")';
        var verticalUrl = 'url("' + dir_name + '_Vertical.png")';
        //top side
        $.make('div').css({
            background: 'top left repeat-x',
            'background-image': verticalUrl,
            position: 'absolute',
            height: topHeightStr,
            top: zeroPxStr,
            left: sideDivWidth,
            right: sideDivWidth
        }).appendTo($imageBox);

        // bottom side
        $.make('div').css({
            background: 'bottom left repeat-x',
            'background-image': verticalUrl,
            position: 'absolute',
            height: bottomHeightStr,
            bottom: zeroPxStr,
            left: sideDivWidth,
            right: sideDivWidth
        }).appendTo($imageBox);

        //left side
        $.make('div').css({
            background: 'top left repeat-y',
            'background-image': horizontalUrl,
            position: 'absolute',
            width: sideWidthStr,
            top: topDivHeight,
            bottom: bottomDivHeight,
            left: zeroPxStr
        }).appendTo($imageBox);

        //right side
        $.make('div').css({
            background: 'top right repeat-y',
            'background-image': horizontalUrl,
            position: 'absolute',
            width: sideWidthStr,
            top: topDivHeight,
            bottom: bottomDivHeight,
            right: zeroPxStr
        }).appendTo($imageBox);
    }

return(this);
};

$.extend($,
{
    // directory is specified in CSS the logon page is secure and IE7 gets upset if you 
    // specify image urls for background images in javascript on a secure page
	logonPanel: function(){
        return $.make('div').imageCorners({
                sideDivWidth: 40,
                bottomDivHeight: 40})
            .addClass('LogonPanel');},
    
	coziFrame: function(){
        return $.make('div').imageCorners({
                dir_name: '../Images/borders/CoziFrame',
                sideDivWidth: 40,
                bottomDivHeight: 40})
            .addClass('CoziFrame');},

    // just like coziFrame, but sides and top are pulled in so scrollbar (and frame) sits at edge
	taskFrame: function(){
        return $.make('div').imageCorners({
                dir_name: '../Images/borders/CoziFrame',
                sideWidth: 9,
                topHeight: 9,
                bottomHeight: 9,
                sideDivWidth: 40,
                bottomDivHeight: 40})
            .addClass('CoziFrame');},
            
    // just like coziFrame, but sides are pulled in so scrollbar sits at edge
	calendarFrame: function(){
        return $.make('div').imageCorners({
                dir_name: '../Images/borders/CoziFrame',
                sideWidth: 9,
                sideDivWidth: 40,
                bottomDivHeight: 40})
            .addClass('CoziFrame');},

    photoFrame: function(){
        return $.make('div').imageCorners({
                dir_name: 'http://family.cozi.com/Images/borders/Photo',
                sideDivWidth: 15,
                bottomDivHeight: 20,
                topHeight: 3,
                sideWidth: 6,
                bottomHeight: 13})
            .addClass('PhotoFrame');},
        
    modalFrame: function(){
        return $.make('div').imageCorners({
                dir_name: '../Images/Calendar/Edit/Edit',
                sideDivWidth: 40,
                bottomDivHeight: 40,
                topHeight: 15,
                sideWidth: 15,
                bottomHeight: 22 })
            .addClass( 'ModalFrame');},

    squareFrame: function(){
	    return $.make('div').imageCorners({
                dir_name: '../Images/borders/MoreContainer',
                topHeight: 7,
                sideWidth: 10,
                bottomHeight: 13})
            .addClass( 'SquareFrame');},
            
    bubbleFrame: function(){
	    return $.make('div').imageCorners({
                dir_name: '../Images/borders/Bubble',
                topHeight: 1,
                sideWidth: 4,
                bottomHeight: 16,
                bottomDivHeight: 68,
                sideDivWidth: 200})
            .addClass( 'BubbleFrame');}
});