function putiton() {
    
    function makeHoverbox() {
        hoverbox = new Element('div', {'class': 'hoverbox'})
            .adopt([new Element('div', {'class': 'inner_box'}),
                    new Element('div', {'class': 'inner_pointer'})]);
        
        var pm = Raphael(hoverbox.getChildren()[1], 140, 16);
        pm.draw_pin(70, 15, 139, 20);
    }
    
    function makePoint(element) {
        return function() {
            var x = element.point.x,
                y = element.point.y,
                size = Math.floor(3.2e-7 * element.size + 4);
                // sorgt dafür, dass die Punktgröße zwischen 2 und 12 liegt
                
            var knob = panel.rect(x - size / 2, y - size / 2, size, size)
                             .attr({
                                'stroke-opacity': 0.01, 
                                'stroke-width': (12 - size),
                                // damit hover schon früher anfängt
                                'fill': element.color})
                             .hover(showHoverbox(element), hideHoverbox(element))
                             .click(openViewer(element));
            element.knob = knob;
            
            var ageInSeconds = (new Date() - new Date(element.postdate))/1000;
            element.shouldBlur = ageInSeconds < 7.8e6; // three months old
            element.knobSize = size;
            
            if(showAnimation) {
                showHoverbox(element)();
                hideHoverbox(element).delay(1600);
                increaseCounter(element);
            }
        }
    }
    
    function showHoverbox(element) {
        return function() {
            var x = element.knob.attrs.x,
                y = element.knob.attrs.y;
            element['hoverbox'] = hoverbox.clone();
            element['hoverbox'].inject(document.body).getChildren()[0]
                                .set('html', Hyphenator.hyphenate(element.name, 'de'))
                                .getParent()
                                .setStyles({
                                    'top': Math.floor(y + $('thebigbox').getPosition().y)
                                            - (element['hoverbox'].getSize().y + 3),
                                    'left': Math.floor(x + $('thebigbox').getPosition().x)
                                            - 70 + element.knob.attrs.width / 2
                                });
            element.knob.node.setStyle('cursor','pointer');
        }
    }
    
    function hideHoverbox(element) {
        return function() {
            element['hoverbox'].destroy();
            element.knob.node.setStyle('cursor','default');
        }
    }
    
    function openViewer(element) {
        return function() {
            hideHoverbox(element)();
            hl.updateHash(element.url)
        }
    }
    
    function drawLine(elements, filter) {
        
        function drawOneLine(elements, index) {
            var from = elements[index - 1],
                to = elements[index],
                pathString = 'M' + from.point.x + ',' + from.point.y;
            
            if (index == elements.length) {
                from = elements[index - 1];
                to = elements[0];
            }
            
            var path = panel.path(pathString).attr({
                'stroke': color,
                'stroke-width': 1
            });
            pathArray[filter].push(path);
            
            pathString += 'L' + to.point.x + ',' + to.point.y;
            var timing = Math.sqrt(Math.pow(to.point.x - from.point.x, 2) +
                                   Math.pow(to.point.y - from.point.y, 2));
            timing = Math.floor(timing);
            path.animate({'path': pathString}, timing * .75,
                         drawNextLine(elements, index));
        }
        
        function drawNextLine(elements, index) {
            return function() {
                if(index < (elements.length)) {
                    makePoint(elements[index])();
                    index += 1;
                    drawOneLine(elements, index);
                }
                else {
                    var path = panel.path(area).hide();
                    path.attr({
                        'stroke': color,
                        'stroke-width': 1,
                        'fill': color,
                        'fill-opacity': 0,
                        'fill-rule': 'evenodd' 
                    });
                    path.toBack()
                    path.show();
                    path.animate({'fill-opacity': 0.5}, 500, function(){
                        pathArray[filter].remove();
                        finishDrawing(filteredElements[0])();
                    });
                }
            }
        }
        
        var filteredElements = elements.filter(function(item) {
            if(item.type==filter) {return item;}
        });
        
        var color = filteredElements[0].color,
            area = ''
            pathArray[filter] = panel.set();
        
        filteredElements.each(function(item, index, array) {
            var x = Math.ceil(item.x * (panelWidth - 160) + 80),
                y = Math.ceil(item.y * (panelHeight - 100) + 80);
            
            item['point'] = {'x': x, 'y': y};
            
            if(index == 0) {
                area += 'M' + x + ',' + y;
            }
            else if (index == (array.length - 1)) {
                area += 'L' + x + ',' + y + 'Z';
            }
            else {
                area += 'L' + x + ',' + y;
            }
            
            if(!showAnimation) {
                makePoint(item)();
            }
        });
        
        if(showAnimation) {
            drawNextLine(filteredElements, 0)();
        }
        else {
            var path = panel.path(area).attr({
                'stroke': color,
                'stroke-width': 1,
                'fill': color,
                'fill-opacity': 0.5,
                'fill-rule': 'evenodd' 
            }).toBack();
        }
    }
    
    function runWelcome() {
        var welcomes = $$('#statusmessage > span');
        tweenNext(0)();
        
        function tweenNext(index) {
            return function() {
                var timing = welcomes[index].hasClass('loading') ? 1 : 1500;
                
                if (index < (welcomes.length - 1)) {
                    new Fx.Tween(welcomes[index], {
                        duration: timing,
                        onComplete: tweenNext(index + 1)
                    }).start('opacity', 0, 1);
                }
                else {
                    new Fx.Tween(welcomes[index], {
                        duration: timing,
                        onComplete: drawWeb
                    }).start('opacity', 0, 1);
                }
            }
        }
        
    }
    
    function setCounter(elements) {
        var countArray = new Array(5);
        countArray[0] = elements.filter(function(item) {
            if(item.type == 'podcast')return item;
        }).length;
        countArray[1] = elements.filter(function(item) {
            if(item.type == 'objet_trouve')return item;
        }).length;
        countArray[2] = elements.filter(function(item) {
            if(item.type == 'product')return item;
        }).length;
        countArray[3] = elements.filter(function(item) {
            if(item.type == 'news')return item;
        }).length;
        countArray[4] = elements.filter(function(item) {
            if(item.type == 'press_text')return item;
        }).length;
        
        $$('#statusmessage > span.loading').each(function(item, index, array) {
            item.getElement('span').set('text', '0/' + countArray[index]);
        });
    }
    
    function increaseCounter(element) {
        var counter = $$('#statusmessage .' + element.type);
        if(counter.length > 0) {
            counter = counter[0];
            var count = parseInt(counter.get('text').split('/')[0]) + 1;
            var amount = counter.get('text').split('/')[1];
            counter.set('text', count + '/' + amount);
        }
    }
    
    function finishDrawing(element) {
        return function() {
            var counter = $$('#statusmessage .' + element.type);
            if(counter.length > 0) {
                counter = counter[0].getParent();
                counter.tween('opacity', 0.4);
            }
        }
    }
    
    function finishEverything() {
        
        var interval = (function() {
            var doFinish = $$('#statusmessage .loading').every(function(item){
                    return (item.getStyle('opacity') < 1);
                })
            
            if(doFinish) {
                
                $('statusmessage').fade('out');
                
                var controlbar = new Fx.Tween('controlbar', {
                    duration: 1000
                });
                var backgroundImage = new Fx.Tween('bg_img', {
                    duration: 1000
                });
                
                controlbar.start('top', -40, 0);
                backgroundImage.start('opacity', 0, 1);
                
                setCookie();
                var sanity = Boolean(Cookie.read('sanity'));
                if(!sanity) { doTheBlur(); }
                clearInterval(interval);
            }
        }).periodical(1000);
    }
    
    function drawWeb() {
        if($chk(filter) == false) {
            drawLine(elements, 'podcast');
            drawLine(elements, 'product');
            drawLine(elements, 'news');
            drawLine(elements, 'objet_trouve');
            drawLine(elements, 'press_text');
        }
        else {
            if(filter == 'Übersicht') {
                drawLine(elements, 'podcast');
                drawLine(elements, 'product');
                drawLine(elements, 'news');
                drawLine(elements, 'objet_trouve');
                drawLine(elements, 'press_text');
            }
            if(filter == 'Produkte') {
                drawLine(elements, 'product');
            }
            if(filter == 'Podcasts') {
                drawLine(elements, 'podcast');
            }
            if(filter == 'Objets trouvés') {
                drawLine(elements, 'objet_trouve');
            }
            if(filter == 'ObjetsTrouves') {
                drawLine(elements, 'objet_trouve');
            }
            if(filter == 'Meldungen') {
                drawLine(elements, 'news');
            }
            if(filter == 'Pressetexte') {
                drawLine(elements, 'press_text');
            }
        }
        
        setCookie();
        var sanity = Boolean(Cookie.read('sanity'));
        if(!sanity && !showAnimation) { doTheBlur(); }
    }
    
    function doTheBlur() {
        var blurries = elements.filter(function(item) {
            if(item.shouldBlur) { return item; }
        });
        
        function blurKnob(item) {
            return function() {
                if(item.fadeWay == 0) {
                    item.fadeWay = 1;
                    item.knob.animate({
                        'width': item.knobSize,
                        'height': item.knobSize,
                        'x': item.point.x - item.knobSize / 2,
                        'y': item.point.y - item.knobSize / 2
                    }, 500, blurKnob(item));
                }
                else {
                    item.fadeWay = 0;
                    item.knob.animate({
                        'width': item.knobSize*2,
                        'height': item.knobSize*2,
                        'x': item.point.x - item.knobSize*2 / 2,
                        'y': item.point.y - item.knobSize*2 / 2
                    }, 500, blurKnob(item));
                }
            }
        }
        
        blurries.each(function(item) {
            blurKnob(item)();
        });
    }
    
    function setCookie() {
        Cookie.write('show_animation', "false", {duration: 7, path:'/'});
    }
    
    $('thebigbox').empty();
    
    var panelWidth = window.innerWidth,
        panelHeight = window.innerHeight - 38,
        panel = Raphael('thebigbox', panelWidth, panelHeight),
        filter = Cookie.read('filter'),
        showAnimation = (Cookie.read('show_animation') === null
                         && window.location.hash.length < 2),
        pathArray = [],
        hoverbox;
    
    makeHoverbox();
    
    if(showAnimation) {
        $('controlbar').setStyle('top', -40);
        $('bg_img').setStyle('opacity', 0);
        runWelcome();
        setCounter(elements);
        finishEverything();
    }
    else {
        drawWeb();
    }
}

window.makeSanity = function() {
		Cookie.write('sanity', 'true', {'duration': 365});
		console.log('Sanity restored');
}