var IMAGE_BLANK = 'common/css/img/blank.gif';
var ALPHA_IMAGE_FILTER = 'DXImageTransform.Microsoft.AlphaImageLoader';
var ud = null;

var ElementTypes = {
    IMAGE: "IMG",
    INPUT: "INPUT",
    DIV: "DIV",
    SPAN: "SPAN",
    LIST_ITEM: "LI",
    ANCHOR: "A"
}

function PngFixer() {
    this.FixImageElements();
    this.FixAnchorElements();
    this.FixInputElements();
    this.FixLayoutElements(ElementTypes.DIV);
    this.FixLayoutElements(ElementTypes.SPAN);
    this.FixLayoutElements(ElementTypes.LIST_ITEM);
}

PngFixer.prototype.FixImageElements = function() {
    for (i = 0; i < document.images.length; i++) {
        var img = document.images[i];
        if ((/\.png/i).test(img.src)) {
            this.FixPNG(img, img.src);
            AddHandler(img, 'propertychange', CreateDelegate(this, this.PropertyChangeHandler));
            //window.status = 'image: ' + i;
        }
    }
};

PngFixer.prototype.FixAnchorElements = function() {
    for (i = 0; i < document.anchors.length; i++) {
        var link = document.anchors[i];
        var linkImages = link.getElementsByTagName(ElementTypes.IMAGE);
        for (var p = 0; p < linkImages.length; p++) {
            linkImages[p].style.width = link.style.width;
            linkImages[p].style.height = link.style.height;
        }
    }
};

PngFixer.prototype.FixInputElements = function() {
    var inputs = document.getElementsByTagName('input');
    for (i = 0; i < inputs.length; i++) {
        var input = inputs[i];
        if (input.type == "image") {
            if ((/\.png/i).test(input.src)) {
                this.FixPNG(input, input.src);
                AddHandler(input, 'propertychange', CreateDelegate(this, this.PropertyChangeHandler));
                //window.status = 'input: ' + i;
            }
        }
    }
};

PngFixer.prototype.FixLayoutElements = function(tagName) {
    var elements = document.getElementsByTagName(tagName);
    for (i = 0; i < elements.length; i++) {
        var element = elements[i];
        var bgSrc = element.currentStyle.backgroundImage || element.style.backgroundImage;
        if ((/\.png/i).test(bgSrc)) {
            this.FixPNG(element, bgSrc);
            AddHandler(element, 'propertychange', CreateDelegate(this, this.PropertyChangeHandler));

            //window.status = tagName + ': ' + i;
        }

        if (element.getElementsByTagName(ElementTypes.IMAGE).length > 0) {
            AddHandler(element, 'filterchange', CreateDelegate(this, this.FilterChangeHandler));
        }
    }
};

PngFixer.prototype.ElementUsesPNG = function(element) {
}
 
PngFixer.prototype.PropertyChangeHandler = function() {
    switch (event.srcElement.nodeName) {
        case ElementTypes.IMAGE:
        case ElementTypes.INPUT:
            if (event.propertyName == "src" && (/\.png/i).test(event.srcElement.src)) {
                this.FixPNG(event.srcElement, event.srcElement.src);
            }
            break;
        case ElementTypes.DIV:
            if (/background/.test(event.propertyName) && (/\.png/i).test(event.srcElement.style.backgroundImage)) {
                this.FixPNG(event.srcElement, event.srcElement.style.backgroundImage);
            }
            break;
    }
}

PngFixer.prototype.FilterChangeHandler = function() {
    try {
        if (event.srcElement.filters['DXImageTransform.Microsoft.Alpha'].opacity == 100) {
            this.ReLoadImages(event.srcElement)
        }
    }
    catch (e) {
    }
}

PngFixer.prototype.ReLoadImages = function(div) {
    div.style.filter = null;
    var images = div.getElementsByTagName(ElementTypes.IMAGE);
    for (i = 0; i < images.length; i++) {
        var img = images[i];
        if ((/\.png/i).test(img.ImageSrc)) {
            img.style.filter = null;
            this.FixPNG(img, img.ImageSrc);
        }
    }
}

PngFixer.prototype.FixPNG = function(elem, src) {

    switch (elem.nodeName) {

        case ElementTypes.IMAGE:
        case ElementTypes.INPUT:
            if ((/\.png/i).test(src)) {
                this.LoadImageInFilter(elem, src, 1);
                elem.src = IMAGE_BLANK;
            }
            break;
        case ElementTypes.ANCHOR:
        case ElementTypes.LIST_ITEM:
        case ElementTypes.DIV:
            var bgSrc = elem.currentStyle.backgroundImage || elem.style.backgroundImage;
            if ((bgSrc + src).indexOf(IMAGE_BLANK) == -1) {
                var bgPNG = bgSrc.match(/^url[("']+(.*\.png[^\)"']*)[\)"']+[^\)]*$/i);

                if (bgPNG) {
                    //elem.style.backgroundImage = 'url("' + IMAGE_BLANK + '")';
                    elem.style.backgroundImage = 'none';
                    this.LoadImageInFilter(elem, bgPNG[1], 0);
                }
                //else LoadImageInFilter(elem);
            }
            break;
    }

}

PngFixer.prototype.LoadImageInFilter = function(e, s, b) {
    var f = 'DXImageTransform.Microsoft.AlphaImageLoader';
    var sM = (e.currentStyle.backgroundRepeat == 'no-repeat') ? 'crop' : 'scale';
    s = (s || '').replace(/\(/g, '%28').replace(/\)/g, '%29');

    if (s && !(/IMG|INPUT/.test(e.nodeName) && !b) && e.currentStyle.width == 'auto' && e.currentStyle.height == 'auto') {
        e.style.width = e.offsetWidth + 'px';
        e.style.height = e.clientHeight + 'px';
        if (e.currentStyle.display == 'inline') e.style.display = 'inline-block';
    }

    if (e.filters[f]) {
        e.filters[f].enabled = s ? true : false;
        if (s) with (e.filters[f]) { src = s }
    }
    else if (s) e.style.filter = 'progid:' + f + '( enabled="true", src="' + s + '",sizingMethod="' + sM + '")';

    e.ImageSrc = s;
}

var PngFixManager = null;

// attach to onload event only for IE 6 or below
if (/MSIE (5\.5|6)/.test(navigator.userAgent) || typeof filters == 'unknown') {
    window.attachEvent("onload", function() { PngFixManager = new PngFixer(); });
}