function initializeFileDisplay(byteArray, fileId, translations) {
    var selectedFileId = fileId;

    $("#mediaViewerContainer").mediaViewer({
        dataByte: byteArray,
        fileName: $("#attachmentName" + fileId).val(),
        displayNavigation: true,
        onNavigationPrevious: function () {
            var previousElement = $("#attachmentName" + selectedFileId).closest(".attachments-grid-file").prev();
            if (previousElement.length === 0)
                previousElement = $("#attachmentName" + selectedFileId).closest(".attachments-grid").find(".attachments-grid-file").last();

            previousElement.find(".attachment-item").first().click();
        },
        onNavigationNext: function () {
            var nextElement = $("#attachmentName" + selectedFileId).closest(".attachments-grid-file").next();
            if (nextElement.length === 0)
                nextElement = $("#attachmentName" + selectedFileId).closest(".attachments-grid").find(".attachments-grid-file").first();

            nextElement.find(".attachment-item").first().click();
        },
        translations: {
            previewNotAvailable: (paw.utils.value.isSet(translations)? translations.previewNotAvailable : '')
        }
    });

    $(".attachment-item").on("click", function () {
        selectAttachment($(this).closest(".attachments-grid-file").attr("data-fileId"));
    });

    function selectAttachment(fileId) {
        selectedFileId = fileId;
        $("#mediaViewerContainer").mediaViewer("displayLoader");

        $.post("/Documents/GetThumbnailImage", {
            DocumentKey: $("#documentKey" + fileId).val(),
            AttachmentId: $("#attachmentId" + fileId).val(),
            AttachmentGuid: $("#attachmentGuid" + fileId).val(),
            AttachmentName: $("#attachmentName" + fileId).val()
        }).done(function (response) {
            if (response) {
                $("#mediaViewerContainer").mediaViewer({
                    dataByte: response,
                    fileName: $("#attachmentName" + fileId).val(),
                    fileId: fileId,
                    translations: {
                        previewNotAvailable: (paw.utils.value.isSet(translations) ? translations.previewNotAvailable : '')
                    }
                });

                $("#attachments-grid").addClass("hidden");
                $("#mediaViewerContainer").removeClass("hidden");
                $(".attachments-list-btn").removeClass("hidden");
            }
        });
    }

    document.addEventListener("dragenter", function (event) {
        if ($(event.target).parents('.divided-content-side').length > 0) {
            $(".dropify-wrapper").height($(".tab-content").height());
        }

    }, false);

    document.addEventListener("dragleave", function (event) {
        if ($(event.target).parents('.divided-content-side').length === 0) {
            $(".dropify-wrapper").height("44px");
        }

    }, false);

    if ($(".attachments-grid-file").length === 1) {
        $(".attachments-grid-file > .attachment-item").last().trigger("click");
    }
}

function dropifyUpload($form) {
    $drForm = $form;
    var error = $("#GeneralErrorMessage").val();
    var remove = $("#Remove").val();
    var dragOrClick = $("#AddAttachment").val();
    var dragOrClickToReplace = $("#AddAttachment").val();
    var fileSizeMessage = $("#FileSizeMessage").val();
    var fileNotAllowedMessage = $("#FileNotAllowedMessage").val();

    dr = $('.dropify').dropify({
        messages: {
            'default': dragOrClick,
            'replace': dragOrClickToReplace,
            'remove': remove,
            'error': error
        },
        error: {
            'fileSize': fileSizeMessage,
            'fileExtension': fileNotAllowedMessage
        }
    });

    var allowSubmit = true;
    dr.on('dropify.errors', function (event, element) {
        console.log("Dropify Error");
        allowSubmit = false;
    });

    $('.dropify').on('change', function () {
        allowSubmit = uploadAttachmentFD(function () {
            setTimeout(function () { $('.dropify-loader').css('display', 'block'); }, 600);
            $form.submit();
        }, allowSubmit);
    });

    var cc = paw.com.CameraCaptureComponent.create($('#camera-capture'), function (captured) {        
        allowSubmit = uploadAttachmentFD(function () {
            paw.com.CameraCaptureComponent.uploadAsForm($form[0], 'uploadFiles', captured, cc).then(function () {
                window.location.reload();
            });
        }, allowSubmit);
    });
}

function uploadAttachmentFD(onUpload, allowSubmit) {
    if (allowSubmit) {
        $('#Redirect').val('false');
        onUpload();
    }
    else {
        return true;
    }
}

function showAttachmentsClick() {
    $("#attachments-grid").removeClass("hidden");
    $("#mediaViewerContainer").addClass("hidden");
    $(".attachments-list-btn").addClass("hidden");
    fixIframeAttachments();
}

function fixIframeAttachments() {
    $("#attachments-grid iframe").each(function () {
        $(this).toggleClass("attachment-resize");
        if ($(this).hasClass("attachment-resize"))
            $(this).height($(this).height() + 1);
        else
            $(this).height($(this).height() - 1);
    });
    $('#AttachmentsTable').docxListRefresh().xlsxListRefresh().csvListRefresh();
}

function confirmDeleteAttachment(docId, attachmentId) {
    $().customModal({
        destroyOnClose: true,
        showCloseButton: true,
        type: "question",
        text: $("#ConfirmDeleteMessageLoc").val(),
        buttons: [
            {
                icon: 'fa fa-times',
                text: $("#NoLoc").val(),
                closeOnAction: true,
                type: 'ghost'
            },
            {
                icon: 'fa fa-check',
                text: $("#YesLoc").val(),
                action: function () {
                    deleteAttachment(docId, attachmentId);
                },
                closeOnAction: true,
                type: 'primary'
            }
        ]
    });
}

function deleteAttachment(docId, attachmentId) {
    $.get($("#DeleteAttachmentUrl").val() + "?docId=" + docId + "&attachId=" + attachmentId, function (response) {
        if (response) {
            $("#attachmentRow-" + attachmentId).remove();
            $("#documentsCount").text($(".attachments-grid-file").length);
        } else {
            $().customModal({
                title: "",
                destroyOnClose: true,
                showCloseButton: true,
                type: "error",
                text: $("#GeneralErrorLoc").val(),
                buttons: [
                    {
                        icon: 'fa fa-check',
                        text: $("#ConfirmLoc").val(),
                        closeOnAction: true,
                        type: 'primary'
                    }
                ]
            });
        }
    });
}