Textarea drag'n drop no reorder

$(document).ready(function() {
    var lineHeight = parseInt($('#personer').css('line-height').replace('px',''));

    if (/Chrome/.test(navigator.userAgent) && /Google Inc/.test(navigator.vendor)) {
        lineHeight -= 0.3; //Chrome adds 0.3px to the lineHeight for some reason ...
    }

    var previousLineNo = 0;
    var content = $('#personer').val();
    var linesArray = content.length > 0 ? content.split('\n') : [];
    var lineNo = 0;
    var emptyLineAdded = false;

    $('.draggable').draggable({
        helper:'clone',
        revert: function(is_valid_drop) {
            if (!is_valid_drop) {
                $('#personer').val(content);
                $('#replace-warn').css('opacity', 0);

                return true;
            }
        },
        drag: function(event, ui) {
            lineNo = getLineNo(ui, lineHeight);

            if (linesArray.length > 0 && previousLineNo != lineNo) {
                insertIndicator(lineNo, linesArray);
            }

            previousLineNo = lineNo;
        }
    });

    $("#personer").droppable({
        accept: ".draggable",
        drop: function( event, ui ) {
            appendAtLine(lineNo, linesArray, ui.draggable.text());
            $(this).append($(ui.draggable).clone());
            content = $('#personer').val();
            linesArray = content.split('\n');

            if (linesArray[linesArray.length - 1] == '')
                linesArray.pop(); //remove empty line
        }
    });

    $('#personer').on('input', function() {
        if (!emptyLineAdded) {
            content = $('#personer').val();
            linesArray = content.split('\n');

            if (linesArray[linesArray.length - 1] == '')
                linesArray.pop(); //remove empty line
        }
    });

    $('#button-populate').click(function() {
        $('#personer').val("vl1:\nvl1:\nvl1:\nvl1:\nvl1:\nvl1:\nvl1:\n");
        $('#personer').val($('#personer').val() + "vl2:\nvl2:\nvl2:\nvl2:\nvl2:\nvl2:\nvl2:\n");
        $('#personer').val($('#personer').val() + "synth1:\nsynth1:\nsynth1:\nsynth1:\nsynth1:\nsynth1:\nsynth1:\n");
        content = $('#personer').val();
        linesArray = content.split('\n');
    });
});


//Returns the top position of a draggable element,
//relative to the textarea. (0 means at the very top of the textarea)
function getYPosition(element, lineHeight) {
    var participantIndex = $(element.helper.context).index();
    var initPos = participantIndex * lineHeight;
    var actualPos = initPos + element.position.top;

    return element.position.top + $('#personer').scrollTop();
}


//Returns the line number corresponding to where the element
//would be dropped
function getLineNo(element, lineHeight) {
    return Math.round(getYPosition(element, lineHeight) / lineHeight);
}


//Inserts an indicator at the given line number,
//to show where the element would be dropped in the textarea
function insertIndicator(lineNo, linesArray) {
    var lineHeight = parseInt($('#personer').css('line-height').replace('px',''));
    var scrollTop = $('#personer').scrollTop(); //Has to be here, otherwise causes bugs ...

    if (/Chrome/.test(navigator.userAgent) && /Google Inc/.test(navigator.vendor)) {
        lineHeight -= 0.3; //Chrome adds 0.3px to the lineHeight for some reason ...
    }

    $('#personer').val('');
    $(linesArray).each(function(index, value) {
        if (index < lineNo)
            $('#personer').val($('#personer').val() + value + '\n');
    });

    if (linesArray[lineNo] != null && linesArray[lineNo] != 'undefined') {
        if (linesArray[lineNo].split(':')[1].length > 0) { //If there's already a participant on that role
            $('#replace-warn').css('top', (lineNo * lineHeight) - scrollTop);
            $('#replace-warn').css('opacity', 0.5);
            $('#personer').val($('#personer').val() + linesArray[lineNo].split(':')[0] + ': --> ' + linesArray[lineNo].split(':')[1] + '\n');
        } else {
            $('#replace-warn').css('opacity', 0);
            $('#personer').val($('#personer').val() + linesArray[lineNo] + ' <--\n');
        }
    }

    $(linesArray).each(function(index, value) {
        if (index > lineNo)
            $('#personer').val($('#personer').val() + value + '\n');
    });
}


//Inserts content of draggable at the given line number
function appendAtLine(lineNo, linesArray, content) {
    $('#personer').val('');
    $(linesArray).each(function(index, value) {
        if (index < lineNo)
            $('#personer').val($('#personer').val() + value + '\n');
    });

    if (linesArray[lineNo].split(':')[1].length > 0) {
        $('#replace-warn').css('opacity', 0);
        $('#personer').val($('#personer').val() + linesArray[lineNo].split(':')[0] + ': ' + content + '\n');
    }
    else
        $('#personer').val($('#personer').val() + linesArray[lineNo] + ' ' + content + '\n'); //content to be added

    $(linesArray).each(function(index, value) {
        if (index > lineNo)
            $('#personer').val($('#personer').val() + value + '\n');
    });
}