function PhotoSelector () {
    this.pitchId = 0;
    this.dragBox = null;
    this.src = null;
    this.dst = null;
    this.dsttext = null;
    this.activeBox = null;
    this.moveOffsetX = 0;
    this.moveOffsetY = 0;
    this.srcPhotoList = null;
    this.dstPhotoList = null;
    this.srcPhotoOffset = 0;
    this.srcPhotoCount = 20;
    this.dstPhotoCount = 5;
    this.pager = null;
    this.marker = null;
    this.scrolltimer = null;
    this.finished = false;
	
    // initialize class
    this.init = function (pitchId, src, dst, dsttext, finished) {
        var that = this;

        this.pitchId = pitchId;
        this.finished = finished;
		
        // register event handlers
        document.onselectstart = function () {
            return false;
        };
        document.ondragstart = function () {
            return false;
        }
        document.onmouseup = function (e) {
            if (! e)
                e = event;
            that.dragEnd (this, e);
        }
        document.onmousemove = function (e) {
            if (! e)
                e = event;
			
            that.drag (this, e);
        }
		
        // create div for dragging
        this.dragBox = document.createElement ("div");
        this.dragBox.className = "dragbox";
        document.body.appendChild (this.dragBox);

        // store source and destination container
        this.src = src;
        this.dst = dst;
        if (dsttext) {
            this.dsttext = dsttext;
        }
		
        this.srcPhotoList = new Array ();
        this.dstPhotoList = new Array ();
        this.srcPhotoOffset = 0;

        this.marker = document.getElementById('insertionMarker');
		
        // load pictures
        this.loadPics ();
    }

    this.setPicsPerPage = function (count) {
        this.srcPhotoCount = count;
        this.fillPhotoDiv ();
    }

    // write HTML code for the image insertion marker
    this.writeMarker = function (obj) {
        var marker = "<div id=\"insertionMarker\" class=\"marker\">\
							<img src=\"/content/pitchs/rank/images/marker_top.png\">\
							<img src=\"/content/pitchs/rank/images/marker_middle.png\" class=\"mid\">\
							<img src=\"/content/pitchs/rank/images/marker_bottom.png\">\
						</div>";
        try {
            obj.innerHTML += marker;
        }
        catch (e) {
            return marker;
        }
    }
	
    // load pics into div
    this.loadPics = function () {
        var content = loadContent ("/hooks/list_full.php?pitchid=" + this.pitchId);
        var listArray = new Array();
        try {
            listArray = content.split(";");
        }
        catch (e) { }
        
        for (var i in listArray) {
            var entryParts = new Array();
            try {
                entryParts = listArray[i].split (",");
            }
            catch (e) { }
            
            if (entryParts.length < 7)
                continue;

            var elem = {
                'id': entryParts[0],
                'hash': entryParts[1],
                'user': entryParts[2],
                'comment': entryParts[3],
                'star': entryParts[4],
                'path': 'get_image.php?id=' + entryParts[1] + '&size=2',
                //'path': '/content/pitchs/rank/images/pics.jpg',
                'freeze': entryParts[5],
                'rank': entryParts[6],
                'box': null
            }

            if (entryParts[6] > 0)
                this.dstPhotoList.push (elem);
            else
                this.srcPhotoList.push (elem);
        }
        
        for (i = 0; i < this.dstPhotoList.length; i++) {
            for (j = i + 1; j < this.dstPhotoList.length; j++) {
                if (this.dstPhotoList[j].rank < this.dstPhotoList[i].rank) {
                    var h = this.dstPhotoList[j];
                    this.dstPhotoList[j] = this.dstPhotoList[i];
                    this.dstPhotoList[i] = h;
                }
            }
        }

        this.fillPhotoDiv ();
        this.fillDstDiv ();
    }

    this.changeFreeze = function (obj) {
        var newfreeze = 0;
        if (obj.freeze == 0)
            newfreeze = 1;
        else
            newfreeze = 0;

        //var ret = loadContent ("/hooks/freeze.php?pitchid=" + this.pitchId + "&freeze=" + obj.freeze);
        var ret = loadContent ("/hooks/freeze.php?pitchid=" + obj.id + "&freeze=" + (obj.freeze ^ 1));
        //alert("freeze: " + ret);
        //var ret = "1";

        if (ret.substr (0, 1) == "1") {
            obj.freeze = newfreeze;
            obj.box = this.createPhotoBox (obj);
            this.fillPhotoDiv ();
            this.fillDstDiv ();
        }
    }

    this.deleteFav = function (obj) {
        var index = this.getIndex (this.dstPhotoList, obj.box);

        if (index >= 0) {
            var element = this.dstPhotoList[index];
            if (element) {
                this.dstPhotoList.splice (index, 1);
                this.srcPhotoList.push (element);
            }
        }

        this.save ();
        this.fillDstDiv ();
        this.fillPhotoDiv ();
    }
	
    this.fillPhotoDiv = function () {
        this.clearPhotoBoxes (this.src);

        if (this.srcPhotoOffset > 0 && this.srcPhotoList.length <= this.srcPhotoOffset)
            this.srcPhotoOffset -= this.srcPhotoCount;

        for (var i = this.srcPhotoOffset; i < this.srcPhotoList.length && i < this.srcPhotoOffset + this.srcPhotoCount; i++) {
            if (this.srcPhotoList[i].rank != 0)
                this.srcPhotoList[i].box = null;
            this.srcPhotoList[i].rank = 0;
            if (! this.srcPhotoList[i].box) {
                this.srcPhotoList[i].box = this.createPhotoBox (this.srcPhotoList[i]);
            }

            this.src.appendChild (this.srcPhotoList[i].box);
        }
		
        this.setPager ();
    }
	
    this.fillDstDiv = function () {
        this.clearPhotoBoxes (this.dst);
			
        for (var i = 0; i < this.dstPhotoList.length; i++) {
            if (this.dstPhotoList[i].rank != i + 1 || this.finished)
                this.dstPhotoList[i].box = null;
            this.dstPhotoList[i].rank = i + 1;
            if (! this.dstPhotoList[i].box) {
                this.dstPhotoList[i].box = this.createPhotoBox (this.dstPhotoList[i]);
            }
			
            this.dst.appendChild (this.dstPhotoList[i].box);
        }

        if (this.dstPhotoList.length == 0) {
            if (this.dsttext)
                this.dsttext.style.display = "block";
        }
    }
	
    this.clearPhotoBoxes = function (div) {
        for (var child = div.firstChild; child != null;) {
            var rem = child;
            child = child.nextSibling;
            if (rem.className) {
                if (rem.className.search (/photobox[a-z]*/) >= 0) {
                    div.removeChild (rem);
                }
            }
        }
    }
	
    this.save = function () {
        var url = "/hooks/update_winners.php?pitchid=" + this.pitchId;

        for (i = 0; i < this.dstPhotoList.length; i++) {
            if (this.dstPhotoList[i].freeze == 0)
                this.changeFreeze(this.dstPhotoList[i]);
            url += "&r" + (i + 1) + "=" + this.dstPhotoList[i].id;
        }

        var ret = loadContent (url);
    }
	
    // initialize dragging
    this.dragStart = function (box, e) {
        this.activeBox = box;
        this.dragBox.appendChild (box.cloneNode (true));
        //box.className = "photobox photoboxsel";

        this.moveOffsetX = e.clientX - getLeftPos (box);
        this.moveOffsetY = e.clientY - getTopPos (box);
		
        this.dragBox.style.display = "block";
        this.dragBox.style.top = e.clientY - this.moveOffsetY + "px";
        this.dragBox.style.left = e.clientX - this.moveOffsetX + "px";
		
        if (this.dsttext && this.getIndex (this.dstPhotoList, box) == -1 && this.dstPhotoList.length < this.dstPhotoCount)
            this.dsttext.style.display = "block";
		
        return false;
    }
	
    // finalize dragging
    this.dragEnd = function (obj, e) {
        if (! this.activeBox)
            return;
        
        // hide dragBox
        this.dragBox.style.display = "none";
		
        // delete content of dragBox
        for (var child = this.dragBox.firstChild; child != null;) {
            var rem = child;
            child = child.nextSibling;
            this.dragBox.removeChild (rem);
        }

        // check drop target
        if (this.getIndex (this.dstPhotoList, this.activeBox) >= 0) {
            if (! this.inDiv (e, this.dst) && (this.finished == false || this.dstPhotoList.length > 1)) {
                var index = this.getIndex (this.dstPhotoList, this.activeBox);

                if (index >= 0) {
                    var element = this.dstPhotoList[index];
                    if (element) {
                        this.dstPhotoList.splice (index, 1);
                        this.srcPhotoList.push (element);
                    }
                }

                this.save ();
                this.fillDstDiv ();
                this.fillPhotoDiv ();
            }
            else {
                var newindex = 0;

                newindex = this.getDstIndex (e);

                var index = this.getIndex (this.dstPhotoList, this.activeBox);

                if (newindex > index)
                    newindex--;

                if (index != newindex) {
                    var element = this.dstPhotoList[index];
                    if (element) {
                        this.dstPhotoList.splice (index, 1);
                        this.dstPhotoList.splice (newindex, 0, element);
                    }

                    this.save ();
                    this.fillDstDiv ();
                }
            }
        }
        else if (this.getIndex (this.srcPhotoList, this.activeBox) >= 0) {
            if (this.inDiv (e, this.dst) && this.dstPhotoList.length < this.dstPhotoCount) {
                var newindex = 0;

                newindex = this.getDstIndex (e);

                var index = this.getIndex (this.srcPhotoList, this.activeBox);
				
                if (index >= 0) {
                    var element = this.srcPhotoList[index];
                    if (element) {
                        this.srcPhotoList.splice (index, 1);
                        this.dstPhotoList.splice (newindex, 0, element);
                    }
                }

                this.save ();
                this.fillDstDiv ();
                this.fillPhotoDiv ();
            }
        }
		
        // reset drag target
        if (this.activeBox) {
            this.activeBox.className = "photobox";
            this.activeBox = null;
        }
		
        // hide message
        if (this.dsttext)
            this.dsttext.style.display = "none";

        if (this.marker)
            this.marker.style.display = 'none';
    }

    this.getDstIndex = function (e) {
        var index = 0;
        var box = null;

        if (this.dstPhotoList.length == 0)
            return 0;

        for (var i = 0; i < this.dstPhotoList.length; i++) {
            if (e.clientX + getScrollX () > getLeftPos (this.dstPhotoList[i].box)) {
                index = i;
                box = this.dstPhotoList[i].box;
            }
        }

        if (box == null)
            return 0;

        if (e.clientX + getScrollX () - getLeftPos (box) > box.offsetWidth / 2)
            index++;

        return index;
    }

    this.scroll = function (e, x, y) {
        var scrollx = 0;
        var scrolly = 0;
        var that = this;

        scrollx = getScrollX ();
        scrolly = getScrollY ();
        window.scrollBy (x, y);
        scrollx -= getScrollX ();
        scrolly -= getScrollY ();
        
        this.moveOffsetX += scrollx;
        this.moveOffsetY += scrolly;

        if (scrollx == 0 && scrolly == 0) {
            window.clearInterval (this.scrolltimer);
            this.scrolltimer = null;
        }
    }

    this.drag = function (obj, e) {
        if (this.activeBox) {
            this.dragBox.style.top = e.clientY - this.moveOffsetY + "px";
            this.dragBox.style.left = e.clientX - this.moveOffsetX + "px";
			
            if (this.dsttext && this.getIndex (this.srcPhotoList, this.activeBox) >= 0) {
                if (this.inDiv (e, this.dst)) {
                    this.dsttext.style.display = "none";
                }
                else {
                    if (this.dstPhotoList.length < this.dstPhotoCount)
                        this.dsttext.style.display = "block";
                }
            }

            // set marker
            if (! this.marker) {
                this.marker = document.getElementById ('insertionMakrer');
            }
            if (this.marker && (this.dstPhotoList.length < this.dstPhotoCount || this.getIndex (this.dstPhotoList, this.activeBox) >= 0)) {
                if (this.inDiv (e, this.dst)) {
                    var box = null;
                    for (var i = 0; i < this.dstPhotoList.length; i++) {
                        var tmpbox = this.dstPhotoList[i].box;
                        if (e.clientX + getScrollX () > getLeftPos (tmpbox) || box == null)
                            box = tmpbox;
                    }

                    if (! box) {
                        this.marker.style.top = getTopPos (this.dst) + 8 + "px";
                        this.marker.style.left = getLeftPos (this.dst) + "px";
                        this.marker.style.display = 'block';
                    }
                    else {
                        this.marker.style.top = getTopPos (this.dst) + 8 + "px";
                        if (e.clientX + getScrollX () - getLeftPos (box) <= box.offsetWidth / 2)
                            this.marker.style.left = getLeftPos (box) - 5 + "px";
                        else
                            this.marker.style.left = getLeftPos (box) + box.offsetWidth + 2 + "px";
                        this.marker.style.display = 'block';
                    }
                }
                else
                    this.marker.style.display = 'none';
            }

            // scrolling
            if (this.scrolltimer) {
                window.clearInterval (this.scrolltimer);
                this.scrolltimer = null;
            }
            var x = 0;
            var y = 0;
            var that = this;
            if (e.clientX <= 10)
                x = -10;
            if (e.clientY <= 10)
                y = -10;
            if (e.clientX >= getWindowWidth () - 10)
                x = 10;
            if (e.clientY >= getWindowHeight () - 10)
                y = 10;

            if (x != 0 || y != 0)
                this.scrolltimer = window.setInterval (function () {
                    that.scroll (e, x, y);
                }, 50);
        }
    }
	
    // create photo box and register event handler
    this.createPhotoBox = function (obj) {
        var that = this;
        var container = document.createElement ("div");
        container.className = "photobox";

        var pic = document.createElement ("img");
        pic.src = obj.path;
        pic.className = "image";
        pic.onmousedown = function (e) {
            if (! e)
                e = event;
            that.dragStart (container, e);
        }
        container.appendChild (pic);

        if (obj.rank > 0) { // delete button
            if (this.finished == false || this.dstPhotoList.length > 1) {
                var picDelete = document.createElement ("img");
                picDelete.src = "/content/pitchs/rank/images/delete.gif";
                picDelete.className = "delete";
                picDelete.onclick = function () {
                    that.deleteFav (obj);
                }
                container.appendChild (picDelete);
            }

            if (obj.rank == 1) {
                var picWinner = document.createElement ("img");
                picWinner.src = "/content/pitchs/rank/images/winner.png";
                picWinner.className = "winner";
                picWinner.onmousedown = function (e) {
                    if (! e)
                        e = event;
                    that.dragStart (container, e);
                }
                container.appendChild (picWinner);
            }
        }
        else { // freeze button
            var picFreeze = document.createElement ("img");
            if (obj.freeze == 0)
                picFreeze.src = "/content/pitchs/rank/images/unfreeze.gif";
            else
                picFreeze.src = "/content/pitchs/rank/images/freeze.gif";
            picFreeze.className = "freeze";
            picFreeze.onclick = function () {
                that.changeFreeze (obj);
            }
            container.appendChild (picFreeze);

        }

        var label = document.createElement ("div");
        label.className = "label";
        container.appendChild (label);

        var lblPicId = document.createElement ("div");
        lblPicId.className = "picid";
        lblPicId.innerHTML = "#" + obj.id;
        label.appendChild (lblPicId);

        var lblDesigner = document.createElement ("div");
        lblDesigner.className = "designer";
        lblDesigner.innerHTML = obj.user;
        label.appendChild (lblDesigner);

        /*if (obj.rank > 0) {
            var lblRank = document.createElement ("div");
            lblRank.className = "rank";
            lblRank.innerHTML = "rank:" + obj.rank;
            label.appendChild (lblRank);
        }*/

        /*var picStar = document.createElement ("img");
        picStar.src = obj.star;
        picStar.className = "imageStar";
        label.appendChild (picStar);*/
		
        return container;
    }
	
    this.inDiv = function (event, div)  {
        if (event.clientX + getScrollX () >= getLeftPos (div) && event.clientX + getScrollX () <= getLeftPos (div) + div.offsetWidth
            && event.clientY + getScrollY () >= getTopPos (div) && event.clientY + getScrollY () <= getTopPos (div) + div.offsetHeight)
            return true;
        return false;
    }
	
    this.getIndex = function (array, element) {
        for (var i = 0; i < array.length; i++) {
            if (array[i].box === element)
                return i;
        }
		
        return -1;
    }
	
    this.setPager = function () {
        if (this.srcPhotoList.length > this.srcPhotoCount) {
            var text = null;
            var newPager = document.createElement ("div");
            newPager.className = "pager";
            text = document.createTextNode ("Seite");
            newPager.appendChild (text);

            for (var i = 0, j = 1; i < this.srcPhotoList.length; i += this.srcPhotoCount, j++) {
                text = document.createTextNode (" ");
                newPager.appendChild (text);
                if (this.srcPhotoOffset == i) {
                    text = document.createTextNode (j);
                    newPager.appendChild (text);
                }
                else {
                    var link = this.createPageLink (i, j);
                    newPager.appendChild (link);
                }
            }
				
            if (this.pager)
                this.src.removeChild (this.pager);
            this.pager = newPager;
            this.src.appendChild (this.pager);
        }
        else if (this.pager) {
            this.src.removeChild (this.pager);
            this.pager = null;
        }
    }

    this.createPageLink = function (offset, text) {
        var that = this;
        var link = document.createElement ("a");
        link.setAttribute ("href", "#");
        link.onclick = function (e) {
            that.switchPage (offset);
        }
        link.innerHTML = text;
        
        return link;
    }
	
    this.switchPage = function (offset) {
        this.srcPhotoOffset = offset;
        this.fillPhotoDiv ();
    }
}