﻿//    // 调用示例
//    var d = new directMove('logo', 'msg', null, 500, null, null, 100);
//    d.start();



var move_Count = 0;//移动次数
var stop_Time = 3000;//停留时间
var iMove = 0;
    function $(id) { return document.getElementById(id); }
    // Constructor 参数说明(如果想忽略中间的参数赋值给后面的参数，可用null代替)
    // id: 移动目标对象ID(必须)
    // msgId: 显示信息ID(可选)
    // speed: 移动速度(可选)
    // x: 初始x轴位置(可选)
    // y: 初始y轴位置(可选)
    // with: 移动目标对象的宽度(可选)
    // height: 移动目标对象的高度(可选)
    function directMove(id, msgId, speed, x, y, width, height) {
        this.target = $(id); // 目标对象
        this.p =
        {
            'speed': speed || 2,
            'x': x || parseInt(this.target.style.left) || 0, // 目标对象位置
            'y': y || parseInt(this.target.style.top) || 0,
            'width': width || parseInt(this.target.style.width) || 0,
            'height': height || parseInt(this.target.style.height) || 0,
            'msg': $(msgId),
            'm_x': 0, // 当前鼠标位置
            'm_y': 0,
            'isMoving': false,
            'opacity': 1 // 不透明度
        };

        this.moveTarget = function() {
        if (iMove >= move_Count) { this.target = null; this.p.msg.style.display = 'none'; return; }

            if (this.p.msg) {
                this.p.msg.style.display = 'none';
            }
            this.target.style.display = 'block';
            var dx = this.p.m_x - this.p.x - this.p.width / 2;
            var dy = this.p.m_y - this.p.y - this.p.height / 2;
            var distance = Math.sqrt(dx * dx + dy * dy); // 目标对象与鼠标的距离
            this.p.isMoving = distance > this.p.speed;

            var timeSpan = 30;
            if (this.p.isMoving) {

                this.p.x = this.p.x + dx / distance * this.p.speed;
                this.p.y = this.p.y + dy / distance * this.p.speed;
                this.target.style.left = this.p.x + 'px';
                this.target.style.top = this.p.y + 'px';
                // Set the opacity
                var r = parseInt(distance / this.p.speed);
                if (r <= 10) {
                    this.p.opacity = r / 20;
                }
                else {
                    this.p.opacity = 1;
                }
                this.target.style.opacity = this.p.opacity;
                this.target.style.filter = 'alpha(opacity=' + (this.p.opacity * 100) + ')';
            }
            else {
                iMove++;
                this.p.isMoving = true;

                this.p.x = Math.random() * (document.body.clientWidth) + document.body.scrollLeft;
                this.p.y = Math.random() * (document.body.clientHeight) + document.body.scrollTop;
                this.target.style.left = this.p.x + 'px';
                this.target.style.top = this.p.y + 'px';
                // Reset the opacity
                this.p.opacity = 1;
                this.target.style.opacity = 1;
                this.target.style.filter = 'alpha(opacity=100)';
                this.target.style.display = 'none';

                if (this.p.msg) {
                    timeSpan = stop_Time; // 提示信息显示的时间
                    this.p.msg.style.display = 'block';
                    this.p.msg.style.position = 'absolute';
                    this.p.msg.style.left = this.p.m_x + 'px';
                    this.p.msg.style.top = this.p.m_y + 'px';
                }
            }
            setTimeout(delegate(this, this.moveTarget), timeSpan);

        }

        this.mousemove = function(e) {
            e = getEvent(e);
            this.p.m_x = e.x + document.documentElement.scrollLeft;
            this.p.m_y = e.y + document.documentElement.scrollTop;

            //            var mouse_x = document.documentElement + event.clientX;
            //            var mouse_y = document.documentElement.scrollTop + event.clientY;
            //            window.status = "x= " + mouse_x + " y= " + mouse_y + "  top" + document.documentElement.scrollTop;

            if (!this.p.isMoving) {
                this.p.isMoving = true;
                this.moveTarget();
            }
        }
        
        this.start = function() {
            // Initialize the style properties of the target
            this.target.style.position = 'absolute';
            this.target.style.left = this.p.x + 'px';
            this.target.style.top = this.p.y + 'px';

            // Add the mousemove event to the document
            addEvent(document, 'mousemove', delegate(this, this.mousemove));
        }
        this.end = function() {
            document.getElementById("logo").style.display = "none";
            document.documentElement.removeChild(document.getElementById("logo"));
            document.documentElement.removeChild(this.target);
        }
    }

    

    function delegate(obj, fun) {
        return function() { return fun.apply(obj, arguments); }
    }
    //封装 event 对象，提供统一接口
    //e：event对象
    function getEvent(e) {
        e = window.event || e;
        if (e.target) {
            e.srcElement = e.target;
        }
        if (e.x && e.clientX) {//IE 8
        }
        else if (e.clientX) {//FF
            e.x = e.clientX;
        }
        if (e.y && e.clientY) {//IE8
        }
        else if (e.clientY) {//FF
            e.y = e.clientY;
        }
        return e;
    }
    // Add event handler to some event of target element
    // target：目标元素，可以是ID或元素对象
    // eventName：事件名称，无需加 'on'
    // eventHandler：事件处理程序，传递函数的引用而非字符串
    function addEvent(target, eventName, eventHandler) {
        if (typeof target == 'string') {
            target = document.getElementById(target);
        }
        // IE
        if (document.attachEvent) {
            target.attachEvent('on' + eventName, eventHandler);
        }
        // FF
        else if (document.addEventListener) {
            target.addEventListener(eventName, eventHandler, false);
        }
    }

//    $('div').style.height = '500px';
//    $('div').style.width = '100%';
//    $('div').style.background = '#CCCCCC';
//    $('div').style.position = 'absolute';
//    $('div').style.top = 0;
//    $('div').style.left = 0;
//    addEvent(document.body, 'click', function(e) {
//        e = getEvent(e);
//        var b = document.body;
//        $('div').innerHTML = b.scrollHeight.toString() + '-' +
//        b.clientHeight + '-' +
//        b.offsetHeight + '-' +
//        b.scrollTop;

//    });
//    for (var i in document.body) {
//        $('div').innerHTML += '<br />' + i;
//    }