function getElById(obj) {
    return typeof(obj) == "string" ? document.getElementById(obj) : obj;
}

// BOF imageLoad
function imageLoad(objId, urls, iAlt, iWidth, iHeight) {
    var loader = new ImageLoader(urls);
    loader.loadEvent = function(url) {
        obj = getElById(objId);
        obj.src = url;
        drawImage(obj, iAlt, iWidth, iHeight);
    }
    loader.load();
}

var ImageLoader = function(url) {
    this.url = url;
    this.image = null;
    this.loadEvent = null;
};

ImageLoader.prototype = {
    load:function() {
        this.image = document.createElement('img');
        var url = this.url;
        var image = this.image;
        var loadEvent = this.loadEvent;
        addListener(this.image, 'load', function(e) {
            if(loadEvent != null) {
                loadEvent(url, image);
            }
        }, false);
        this.image.src = this.url;
    },
    getImage:function() {
        return this.image;
    }
};

function addListener(element, type, expression, bubbling) {
    bubbling = bubbling || false;
    if(window.addEventListener) { // Standard
        element.addEventListener(type, expression, bubbling);
        return true;
    }
    else if(window.attachEvent) { // IE
        element.attachEvent('on' + type, expression);
        return true;
    } else {
        return false;
    }
}

function drawImage(iId, iAlt, iWidth, iHeight) {
    if(!iWidth) iWidth = 300;
    if(!iHeight) iHeight = 300;
    var iId = getElById(iId);
    var image = new Image();
    image.src = iId.src;
    if(image.width > 0 && image.height > 0) { //以宽为准
        if(image.width / image.height >= iWidth / iHeight) {
            if(image.width > iWidth) {
                iId.width = iWidth;
                iId.height = (image.height * iWidth) / image.width;
            } else {
                iId.width = image.width;
                iId.height = image.height;
            }
            if(iAlt) iId.alt = iAlt;
        } else { //以高为准
            if(image.height > iHeight) {
                iId.height = iHeight;
                iId.width = (image.width * iHeight) / image.height;
            } else {
                iId.width = image.width;
                iId.height = image.height;
            }
            if(iAlt) iId.alt = iAlt;
        }
    }
}
// EOF imageLoad

function changeImage(elm, obj, set) {
    var elm = getElById(elm);
    var obj = getElById(obj);
    obj.src = 'images/loading.gif';
    drawImage(obj);
    imageLoad(obj, elm.src.replace('small/', 'large/'), '', 300, 300);
    if(set) {
        var set = getElById(set).getElementsByTagName('IMG');
        for(i = 0; i < set.length; i++) set[i].style.border = '#CCC solid 1px';
    }
    elm.style.border = '#F93 solid 1px';
}