function load_comments( story_id, page ) {
    $.ajax( {
        url: '/cms/comments',
        global: false,
        data: { story_id:story_id, page:page, no_cache:new Date().getTime() },
        dataType: 'json',
        success: function(data) { 
            $('#comments #commentlist').hide();
            obj = data.json_comments;

            var head_text = 'Schreiben Sie jetzt den ersten Kommentar!';
            if( obj.total_comments > 0 ) {
                head_text = 'Leser-Kommentare zu diesem Artikel (' + obj.total_comments + ')';
            }
            $('#comments > div.comment-head > span.title').html( head_text );

            var html = '';
            html += '<ol start="' + ( ( page - 1 ) * 3 + 1 ) + '">';
            for( var i in obj.comments ) {
                html += '<li><div class="meta">';
                if( obj.comments[i].avatar_url ) {
                    html += '<img src="/static/user/' + obj.comments[i].avatar_url + '" width="32" height="32" />';
                }
                html += 'Am ' + obj.comments[i].date + ' schrieb <a href="/profile/' + obj.comments[i].username + '">' + obj.comments[i].username + '</a> dazu:</div>';
                html += '<p>' + obj.comments[i].text + '</p>';
                html += '</li>';
            }
            html += '</ol>';
            if( obj.next_page ) { html += '<a href="#" class="btn lightblue more" style="float:right" onclick="trigger_ivw(); load_comments(' + story_id + ', ' + obj.next_page + '); return false;"><span><b>Weitere Kommentare ...</b></span></a>' }
            $('#comments #commentlist a.more').remove();
            if( page == 1 ) {   /* replace on 1st page */
                $('#comments #commentlist').html( html ).show();
            } else {            /* append on following pages */
                $('#comments #commentlist').append( html ).show();
            }
        }
    } );
}

function init_comments( story_id, may_create ) {
    document.write( '<div id="comments">' );
    document.write( '<div class="comment-head">' );
    if( may_create ) {
        document.write( '<a id="createlink" class="btn" href="#"><span><b>Kommentar schreiben ...</b></span></a></li>' );
    } else {
        document.write( '<a id="createlink" class="btn" href="/login?go=' + escape( location.href ) + '#comments"><span><b>Anmelden und kommentieren!</b></span></a></li>' );
    }
    document.write( '<span class="title"></span>' );
    if( may_create ) {
        /* Render create form */
        document.write( '<div id="createform"><form style="margin:1em 0 2em 0;clear:both" method="post" action="/cms/comments/create">' );
        document.write( '<input type="hidden" name="story_id" value="' + story_id + '" />');
        document.write( '<textarea rows="6" cols="60" id="comment-text" name="comment-text"></textarea>' );
        document.write( '<img class="captcha" width="240" height="70" /><br />Sicherheitscode: <input type="text" name="code" size="5" maxlength="5" id="comment-captcha" />' );
        document.write( '<br style="clear:both" /><button type="submit" class="btn" id="comment-submit"><span><b>Abschicken</b></span></button>' );
        document.write( '</form></div>' );
    
        $('#comments a#createlink').click( function(e) { 
            e.preventDefault();
            if( ! $('#comments .captcha').attr( 'src' ) )                   /* Load captcha if not loaded yet */ 
                $('#comments .captcha').attr( 'src', '/captcha?' + ( new Date() ).getTime() ).show();
            $('#comments #createform').slideToggle(); 
        } );
        $('#comments form').submit( function(e) { 
            e.preventDefault();
            $('#comment-submit').addClass('dis');
            $('#comment-submit').attr('disabled','disabled');
            $.ajax( {
                url:        '/cms/comments/create',
                data:       $(this).serialize(),
                dataType:   'json',
                success:    function(data) { 
                    if( data.json_error ) {
                        alert( 'Sicherheitscode stimmt nicht überein!' );
                    } 
                    else {
                        $('#comments #createform').slideUp();               /* Hide create form */
                        $('#comments .captcha').hide().attr( 'src', '' );   /* Clear captcha */
                        $('#comment-captcha').val('');
                        $('#comment-text').val('');                         /* Clear textarea */
                        load_comments( story_id, 1 );                       /* Reload comments */
                    }
                    $('#comment-submit').removeAttr('disabled');
                    $('#comment-submit').removeClass('dis');
                } 
            } );
        } );
        $("#comments textarea#comment-text").textLimiter( 1250 );
    }
    document.write( '</div><div id="commentlist"></div></div>' );

    load_comments( story_id, 1 );
}