var layerObject = {
    supported: document.getElementById && (document.addEventListener || document.attachEvent),
    obj: null,
    zOrder: 1000,
    skipClass: "xBox",
    init: function(id, rootID, x, y, minX, maxX, minY, maxY){
        if (this.supported) {
            var o = document.getElementById(id);
            o.root = rootID ? document.getElementById(rootID) : o;
            o.idx = id;
            if (isNaN(parseInt(o.root.style.left))) 
                o.root.style.left = x ? x + "px" : 0 + "px";
            if (isNaN(parseInt(o.root.style.top))) 
                o.root.style.top = y ? y + "px" : 0 + "px";
            o.minX = minX;
            o.maxX = maxX;
            o.minY = minY;
            o.maxY = maxY;
            o.root.on_drag_start = function(){
            }
            o.root.on_drag = function(){
            }
            o.root.on_drag_end = function(){
            }
            dw_event.add(o, "mousedown", layerObject.start, false);
        }
    },
    
    start: function(e){
        var o;
        e = dw_event.DOMit(e);
        if (e.tgt.nodeType && e.tgt.nodeType == 3) 
            e.tgt = e.tgt.parentNode;
        if (e.tgt.className && e.tgt.className == layerObject.skipClass) 
            return;
        if (this.idx) 
            o = layerObject.obj = this;
        else {
            while (!e.tgt.idx) 
                e.tgt = e.tgt.parentNode;
            o = layerObject.obj = e.tgt;
        }
        o.root.style.zIndex = layerObject.zOrder++;
        o.downX = e.clientX;
        o.downY = e.clientY;
        o.startX = parseInt(o.root.style.left);
        o.startY = parseInt(o.root.style.top);
        o.root.on_drag_start(o.startX, o.startY);
        dw_event.add(document, "mousemove", layerObject.drag, true);
        dw_event.add(document, "mouseup", layerObject.end, true);
        e.preventDefault();
    },
    
    drag: function(e){
        e = e ? e : window.event;
        var o = layerObject.obj;
        var nx = o.startX + e.clientX - o.downX;
        var ny = o.startY + e.clientY - o.downY;
        if (o.minX != null) 
            nx = Math.max(o.minX, nx);
        if (o.maxX != null) 
            nx = Math.min(o.maxX, nx);
        if (o.minY != null) 
            ny = Math.max(o.minY, ny);
        if (o.maxY != null) 
            ny = Math.min(o.maxY, ny);
        o.root.style.left = nx + "px";
        o.root.style.top = ny + "px";
        o.root.on_drag(nx, ny);
        return false;
    },
    
    end: function(){
        dw_event.remove(document, "mousemove", layerObject.drag, true);
        dw_event.remove(document, "mouseup", layerObject.end, true);
        if (!layerObject.obj) 
            return;
        layerObject.obj.root.on_drag_end(parseInt(layerObject.obj.root.style.left), parseInt(layerObject.obj.root.style.top));
        layerObject.obj = null;
    }
}

var dw_event = {
    add: function(obj, etype, fp, cap){
        cap = cap || false;
        if (obj.addEventListener) 
            obj.addEventListener(etype, fp, cap);
        else 
            if (obj.attachEvent) 
                obj.attachEvent("on" + etype, fp);
    },
    
    remove: function(obj, etype, fp, cap){
        cap = cap || false;
        if (obj.removeEventListener) 
            obj.removeEventListener(etype, fp, cap);
        else 
            if (obj.detachEvent) 
                obj.detachEvent("on" + etype, fp);
    },
    
    DOMit: function(e){
        e = e ? e : window.event;
        e.tgt = e.srcElement ? e.srcElement : e.target;
        if (!e.preventDefault) 
            e.preventDefault = function(){
                return false;
            }
        if (!e.stopPropagation) 
            e.stopPropagation = function(){
                if (window.event) 
                    window.event.cancelBubble = true;
            }
        return e;
    }
}

var schermresolutie = {
    getWinWidth: function(){
        this.width = 0;
        if (window.innerWidth) 
            this.width = window.innerWidth - 18;
        else 
            if (document.documentElement && document.documentElement.clientWidth) 
                this.width = document.documentElement.clientWidth;
            else 
                if (document.body && document.body.clientWidth) 
                    this.width = document.body.clientWidth;
    },
    
    getWinHeight: function(){
        this.height = 0;
        if (window.innerHeight) 
            this.height = window.innerHeight - 18;
        else 
            if (document.documentElement && document.documentElement.clientHeight) 
                this.height = document.documentElement.clientHeight;
            else 
                if (document.body && document.body.clientHeight) 
                    this.height = document.body.clientHeight;
    },
    
    getScrollX: function(){
        this.scrollX = 0;
        if (typeof window.pageXOffset == "number") 
            this.scrollX = window.pageXOffset;
        else 
            if (document.documentElement && document.documentElement.scrollLeft) 
                this.scrollX = document.documentElement.scrollLeft;
            else 
                if (document.body && document.body.scrollLeft) 
                    this.scrollX = document.body.scrollLeft;
                else 
                    if (window.scrollX) 
                        this.scrollX = window.scrollX;
    },
    
    getScrollY: function(){
        this.scrollY = 0;
        if (typeof window.pageYOffset == "number") 
            this.scrollY = window.pageYOffset;
        else 
            if (document.documentElement && document.documentElement.scrollTop) 
                this.scrollY = document.documentElement.scrollTop;
            else 
                if (document.body && document.body.scrollTop) 
                    this.scrollY = document.body.scrollTop;
                else 
                    if (window.scrollY) 
                        this.scrollY = window.scrollY;
    },
    
    getAll: function(){
        this.getWinWidth();
        this.getWinHeight();
        this.getScrollX();
        this.getScrollY();
    }
}

var plaatsen = {
    // xoffset en yoffset: cijfers ofwel "c"
    xoffset: 20,
    yoffset: 20,
    posX: null, //20090614 Dirk Toegevoegd zodat vaste positie kan ingesteld worden
    posY: null,
    dragId: "mijnLayer",
    handleId: "",
    writeId: "",
    draggable: false,
    hideFlag: true,
    
    init: function(){
        if (this.handleId) 
            layerObject.init(this.handleId, this.dragId);
        else 
            layerObject.init(this.dragId);
        this.draggable = true;
        dw_event.add(document, "click", plaatsen.checkHide, false);
        dw_event.add(document, "keydown", plaatsen.checkKey, true);
    },
    
    set: function(e, inhoud, wd, xoffset, yoffset){
        this.hideFlag = false;
        var wobj = this.writeId ? document.getElementById(this.writeId) : document.getElementById(this.dragId);
        var dobj = document.getElementById(this.dragId);
        if (!this.draggable) 
            this.init();
        this.hide();
        wobj.innerHTML = inhoud;
        
        if (wd) {
            var bw = dobj.style.borderWidth ? parseInt(dobj.style.borderWidth) : 0;
            var pw = wobj.style.padding ? parseInt(wobj.style.padding) : 0;
            wd += 2 * bw + 2 * pw;
            dobj.style.width = wd + "px";
        }
        this.positionIt(e, dobj, xoffset, yoffset);
    },
    
    positionIt: function(e, o, xoffset, yoffset){
        var x = 0, y = 0;
        schermresolutie.getAll();
        if (this.posX == null) {
            if (this.xoffset == "c") {
                x = Math.round((schermresolutie.width - o.offsetWidth) / 2) + schermresolutie.scrollX;
            }
            else {
                x = e.pageX ? e.pageX : e.clientX + schermresolutie.scrollX;
                xoffset = xoffset || this.xoffset;
                if (x + o.offsetWidth + xoffset > schermresolutie.width + schermresolutie.scrollX) 
                    x = schermresolutie.width + schermresolutie.scrollX - o.offsetWidth;
                else 
                    x = x + xoffset;
            }
        }
        else {
            x = this.posX;
        }
        
		
        if (this.posY == null) {
	        if (this.yoffset == "c") {
	            y = Math.round((schermresolutie.height - o.offsetHeight) / 2) + schermresolutie.scrollY;
	        }
	        else {
	            y = e.pageY ? e.pageY : e.clientY + schermresolutie.scrollY;
	            yoffset = yoffset || this.yoffset;
	            if (y + o.offsetHeight + yoffset > schermresolutie.height + schermresolutie.scrollY) 
	                y = schermresolutie.height + schermresolutie.scrollY - o.offsetHeight;
	            else 
	                y = y + yoffset;
	        }
        }
        else {
            y = this.posY;
        }
        o.style.left = x + "px";
        o.style.top = y + "px";
        document.getElementById(this.dragId).style.visibility = "visible";
        setTimeout("plaatsen.hideFlag = true", 200);
    },
    
    checkKey: function(e){ // check voor esc toets
        e = e ? e : window.event;
        if (e.keyCode == 27) 
            plaatsen.hide();
    },
    
    checkHide: function(e){
        dw_event.DOMit(e);
        
        if (e.tgt.nodeType && e.tgt.nodeType == 3) 
            e.tgt = e.tgt.parentNode;
        if (contained(e.tgt, document.getElementById("mijnLayer"))) {
            if (e.tgt.tagName && e.tgt.tagName == "IMG") 
                e.tgt = e.tgt.parentNode;
            if (e.tgt.tagName == "A" && e.tgt.href.indexOf("plaatsen.hide") != -1) 
                plaatsen.hide();
            else 
                return;
        }
        if (plaatsen.hideFlag) 
            plaatsen.hide();
    },
    
    hide: function(){
        document.getElementById(plaatsen.dragId).style.visibility = "hidden";
    }
}

function contained(oNode, oCont){
    while (oNode.parentNode) {
        oNode = oNode.parentNode;
        if (oNode == oCont) 
            return true;
    }
    return false;
}