{% load staticfiles %}
<div id='{{ id_src }}'>{{ value|safe }}</div>
<script>
$(function() {
    var {{ id }}_textarea = window.document.getElementById('{{ id_src }}-textarea');
    var {{ id }}_src = window.document.getElementById('{{ id_src }}');
    var {{ id }}_settings = {{ settings|safe }};
    var csrftoken = getCookie('csrftoken');

    // include summernote language pack, synchronously
    if( {{ id }}_settings.lang != 'en-US' ) {
        $.ajaxSetup({async:false});
        $.getScript('{{ STATIC_URL }}django_summernote/lang/summernote-' + {{ id }}_settings.lang + '.min.js');
        $.ajaxSetup({async:true});
    }

    $({{ id }}_textarea).hide();

    $summernote = $({{ id }}_src);
    $summernote.summernote($.extend({{ id }}_settings, {
        callbacks: {
            onInit: function() {
                var nEditor = $('.note-editor');
                var nToolbar = $('.note-toolbar');
                var nEditable = $('.note-editable');
                var nStatusbar = $('.note-statusbar');
                var setHeight = parseInt({{ id }}_settings.height)  // default
                        - nToolbar.outerHeight()  // toolbar height including margin,border,padding
                        - (nEditable.innerHeight() - nEditable.height())  // editable's padding
                        - (nEditor.outerHeight() - nEditor.innerHeight())  // editor's border
                        - nStatusbar.outerHeight();  // status bar height

                nEditable.height(setHeight);
            },
            onBlur: function() {
                {{ id }}_textarea.value = $(this).summernote('code');
            },
            onImageUpload: function(files) {
                var imageInput = $('.note-image-input');
                var sn = $(this);
                // custom attachment data
                var attachmentData = {{ id }}_textarea.dataset;
                imageInput.fileupload();
                var jqXHR = imageInput.fileupload('send', 
                    {
                        files: files,
                        formData: $.extend({csrfmiddlewaretoken: csrftoken}, attachmentData),
                        url: {{ id }}_settings.url.upload_attachment,
                    })
                    .success(function (result, textStatus, jqXHR) {
                        data = $.parseJSON(result);
                        $.each(data.files, function (index, file) {
                            sn.summernote("insertImage", file.url);
                        });
                    })
                    .error(function (jqXHR, textStatus, errorThrown) {
                        // TODO: Display a detailed error message. It will come from JSON.
                        alert( 'Got an error while uploading images.' );
                    });
            }
        }
    }));

    // See https://docs.djangoproject.com/en/dev/ref/contrib/csrf/#ajax
    function getCookie(name) {
        var cookieValue = null;
        if (document.cookie && document.cookie != '') {
            var cookies = document.cookie.split(';');
            for (var i = 0; i < cookies.length; i++) {
                var cookie = jQuery.trim(cookies[i]);
                // Does this cookie string begin with the name we want?
                if (cookie.substring(0, name.length + 1) == (name + '=')) {
                    cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
                    break;
                }
            }
        }
        return cookieValue;
    }
});
</script>
