var Slidera = {
    create: function(Menu) {
        return {
            id: "no name",
            orientation: "horizontal",
            min: 0,
            max: 500,
            speed: 300,
            myObject: Menu,
            moveTo: function(start, end) {
                c = (this.speed / 50);
                d = Math.round(this.speed / c);
                w = new Array();
                t = new Array();
                this.myObject.currentStep = 0;
                this.myObject.testTime = null;
                for (var i = 1; i <= d; i++) {
                    w.push(this.easeOutCubic(i * c, start['left'], end['left'] - start['left'], this.speed));
                    t.push(this.easeOutCubic(i * c, start['width'], end['width'] - start['width'], this.speed))
                }
                this.go(this, c, w, t);
            },
            go: function(b, c, w, t) {
                b.myObject.testTime = window.setInterval(function() {
                    var a = true;
                    if (w[b.myObject.currentStep]) {
                        b.myObject.style['left'] = w[b.myObject.currentStep] + 'px';
                        b.myObject.style['width'] = t[b.myObject.currentStep] + 'px';
                        b.myObject.currentStep++;
                        a = false
                    }
                    if (a) {
                        window.clearInterval(b.myObject.testTime);
                        b.myObject.testTime = null;
                        if (b.callBack) {
                            b.callBack()
                        }
                        return
                    }
                },
                c);
            },
            easeOutCubic: function(t, b, c, d) {
                return c * ((t = t / d - 1) * t * t + 1) + b;
            },
        }
    }
};
window.onload = function() {
    var slide1 = Slidera.create(document.getElementById('indicator'));
    var mouseInfo = document.getElementById('content');
    mouseInfo.onmouseover = function(event) {
        var mouseInfos = getMousePosition(event);
        if (mouseInfos) {
            if (slide1.myObject.testTime != null) {
                window.clearInterval(slide1.myObject.testTime);
                slide1.myObject.testTime = null;
            }
            var start = {
                "left": document.getElementById('indicator').offsetLeft,
                "width": document.getElementById('indicator').offsetWidth
            };
            var end = {
                "left": mouseInfos['left'],
                "width": mouseInfos['width']
            };
            slide1.moveTo(start, end);
        }
    };
    mouseInfo.onmouseout = function() {
        var first = document.getElementById('content').getElementsByTagName("li")[0];
        var mouseInfos = null;
        if (!mouseInfo.currentClick || mouseInfo.currentClick == null) {
            mouseInfos = {
                "left": first.offsetLeft,
                "width": first.offsetWidth
            };
        } else {
            mouseInfos = {
                "left": mouseInfo.currentClick.offsetLeft,
                "width": mouseInfo.currentClick.offsetWidth
            };
        }
        if (mouseInfos) {
            if (slide1.myObject.testTime != null) {
                window.clearInterval(slide1.myObject.testTime);
                slide1.myObject.testTime = null;
            }
            var start = {
                "left": document.getElementById('indicator').offsetLeft,
                "width": document.getElementById('indicator').offsetWidth
            };
            var end = {
                "left": mouseInfos['left'],
                "width": mouseInfos['width']
            };
            slide1.moveTo(start, end);
        }
    };
    mouseInfo.onclick = function(event) {
        var e = event || window.event;
		var tempClick = (e.target) ? e.target: e.srcElement;
        mouseInfo.currentClick = (tempClick.nodeName == "LI") ? tempClick : ( (tempClick.nodeName == "A") ? tempClick.parentNode : (mouseInfo.currentClick != "undefined") ? mouseInfo.currentClick:null);
        var mouseInfos = getMousePosition(event);
        if (mouseInfos) {
            if (slide1.myObject.testTime != null) {
                window.clearInterval(slide1.myObject.testTime);
                slide1.myObject.testTime = null;
            }
            var start = {
                "left": document.getElementById('indicator').offsetLeft,
                "width": document.getElementById('indicator').offsetWidth
            };
            var end = {
                "left": mouseInfos['left'],
                "width": mouseInfos['width']
            };
            slide1.moveTo(start, end);
        }
    };
};
function getMousePosition(event) {
    var e = event || window.event;
    monElement = (e.target) ? e.target: e.srcElement;
    if (monElement.nodeName == "A") {
        return {
            "left": monElement.parentNode.offsetLeft,
            "width": monElement.parentNode.offsetWidth
        };
    }
	else if(monElement.nodeName == "LI"){
		return {
            "left": monElement.offsetLeft,
            "width": monElement.offsetWidth
        };
	}
    return false;
};