function initIndex() {

        var $flagDock = $('#flag-dock');
        var $flagLI = $('li', $flagDock);

        var permstr = "permsel=1";

        $('#permsel').click(function() {

            var permsel = $(this).is(':checked');

            $('a', $flagLI).each( function() {
                if( permsel ) {
                    if( this.href.indexOf('?') > -1 ) {
                        this.href += '&' + permstr;    
                    }else{
                        this.href += '?' + permstr;
                    }
                }else{
                    this.href = this.href.replace(/[\?&]permsel=1/g, ''); 
                }
            });

        });

        var $label  = $('<div>', { id: 'flag-label'} ).appendTo( $flagDock );

        // Configuration

        var lastLeft        = 0;
        var lastTop         = 0;

        var mouseRadius     = 90;
        var maxSize         = 128;
        var flagPadding     = 2;
        var maxZoomPixels   = 179;

        var originSize  = { width: 64, height: 64 };

        // == READ FLAGS INTO ARRAY =============================================

        var flagArray = [];
        $flagLI.each( function() {
            var $this = $(this);
            flagArray.push({
                        'curHeight': $this.height(),
                        'curWidth' : $this.width(),
                        'newHeight': $this.height(),
                        'newWidth' : $this.width(),
                        'title'    : $('img', $this).attr('alt'),
                        'left'     : parseInt( $this.css('left') ),
                        'top'      : parseInt( $this.css('top') ),
                        'object'   : $this
                    });
        });

        var selectedLeft = false;

        $('li[selected="selected"]', $flagDock).each( function() {
                var $this = $(this);
                var curOffset = $this.offset();
                var pageX = $this.width()/2 + curOffset.left;
                selectedLeft = pageX;
                fishEye( pageX, 0);
        });

        // Remove title tags
        $('a, a img', $flagDock).removeAttr('title');

        
        var $easer = $('<div>');
        var inAnimation = false;
        var entered = false;

        $flagDock
            .mouseenter( function(e) {
                entered = true;
                inAnimation = true;
                $easer.stop().css({ left: lastLeft }).animate({ left: e.pageX }, {
                    duration: 500,
                    step: function( i ) {
                        fishEye( i, lastTop );
                    }, complete: function() { 
                        inAnimation = false;
                    }
                });  
            })
            .mouseleave( function(e) {
                entered = false;
                if( selectedLeft ) {
                    inAnimation = false;
                    $easer.stop().css({ left: lastLeft }).animate({ left: selectedLeft }, {
                        duration: 500,
                        step: function( i ) {
                            fishEye( i, lastTop );
                        }
                    });  
                }
            })
            .mousemove( function(e) {
                if( entered && !inAnimation ) {
                    $easer.stop();
                        fishEye( e.pageX, e.pageY );
                }
            });


        var lastTitle = false;
            
        function fishEye( mouseLeft, mouseTop ) {

            lastLeft = mouseLeft;
            lastTop  = mouseTop;

            var zoomedFlags  = 0;
            var zoomedPixels = 0;

            var flagMid = false;
            var nearest = false;
            var nearestDistance = 0;

            // Loop through every div
            $.each(flagArray, function( Key, Flag){ 

                var $this = Flag.object;

                // Retrieve item Dimensions
                var curOffset = $this.offset();

                // Calculate absolute middle position of image (xAxis)
                if( !flagMid ) {
                    flagMid = ( curOffset.left + (Flag.curWidth/2) );
                }else{
                    flagMid += (Flag.curWidth/2);    
                }

                // Calculate Distance to Mouse
                var xDistance = Math.abs( mouseLeft - flagMid );
                
                var newHeight = Flag.curHeight,
                    newWidth  = Flag.curWidth;

                // Only calculate if distance smaller then mouseRadius
                if( xDistance < mouseRadius ) {

                    // Calculate proz. distance                   
                    var przDistance = 1-( xDistance / mouseRadius );

                    // Determine nearest position to flag
                    if( przDistance >= nearestDistance ) {
                        nearestDistance = przDistance;
                        nearest = Key;
                    }

                    // Calculate new Height/Width
                    newHeight = Math.ceil( ( maxSize - originSize.height ) * przDistance) + originSize.height;
                    newWidth  = Math.ceil( ( maxSize - originSize.width  ) * przDistance) + originSize.width;

                    // Flag is zoomed
                    zoomedFlags++;
                    zoomedPixels += newWidth;

                }else{
                    // Outside the Radius => Reset width
                    newWidth = originSize.width;
                    newHeight = originSize.height;

                    // If zoomedflag is 4, then add this one to zoom too
                    if( zoomedFlags == 4 ) {
                        zoomedFlags++;
                        zoomedPixels += newWidth;
                    }
                }

                // Update midoffset
                flagMid += ( Math.round(newWidth/2) + flagPadding );

                // Update Flagarray
                flagArray[ Key ].newWidth = newWidth;
                flagArray[ Key ].newHeight = newHeight;


            });

            var pixelLeft       = (maxZoomPixels-zoomedPixels);
            var pixelPerPiece   = (pixelLeft>0)? 1 : -1;

            var leftOffset = 0;

            // Loop through all entries
            $.each( flagArray, function( Key, Flag ) {
                
                if( Flag.newWidth != Flag.curWidth || Flag.newHeight != Flag.curHeight || Flag.left != leftOffset ) {

                    // Add pixel to flag if there are 5 zoomed, to get a static-zoomWidth
                    if( zoomedFlags >= 5 && pixelLeft != 0 ) {
                        pixelLeft -= pixelPerPiece;
                        Flag.newWidth += pixelPerPiece;
                        Flag.newHeight += pixelPerPiece;
                    }

                    // Update flag
                    Flag.object.css({
                                'left':   leftOffset + 'px',
                                'top':    Math.round((maxSize-Flag.newHeight)/2) + 'px',
                                'width':  Flag.newWidth + 'px',
                                'height': Flag.newHeight + 'px'
                            });

                }

                // Update FlagArray
                flagArray[ Key ].curWidth = Flag.newWidth;
                flagArray[ Key ].curHeight = Flag.newHeight;
                flagArray[ Key ].left = leftOffset;


                leftOffset += Flag.newWidth+flagPadding;

            });

            // Check if theres a nearest Flag
            if( nearest !== false ) {

                var flag  = flagArray[ nearest ];
                var $flag = flag.object;

                // Only update title, if it has changed (reduces dom changes)
                if( !lastTitle || flag.title != lastTitle ) {
                    lastTitle = flag.title;
                    $label.html( lastTitle );
                }
                // Set Flag position
                $label.css({
                    'left':  flag.left-($label.width()/2)+( flag.curWidth/2)-7
                });
            }
        }
}