{$dialog_id = uniqid('f-share-dialog')}

{function form_begin}
    {if $file.full_access}<form>{/if}
{/function}

{function form_end}
    {if $file.full_access}</form>{/if}
{/function}

{function title file=[]}
    {if !$wa->get('public_link')}
        {if $file.type === filesFileModel::TYPE_FILE}[`Share file`]{else}[`Share folder`]{/if}
    {else}
        [`Public link to`]
    {/if}
{/function}

<style>
    .f-file-preview-link-value { padding-top: 1em; }
    .f-ibutton-checkbox ul.menu-h li { padding: 0.35em 0 0; vertical-align: top; }
    .f-share-dialog .f-file-preview-link-block { width: 99%; margin-top: 20px; }
    .f-share-dialog .f-file-preview-link { width: 100%; }
    .f-share-dialog .f-private-link-on .f-private-link-off-text { display: none; }
    .f-share-dialog .f-private-link-off .f-private-link-text { color: gray; }
    .f-share-dialog .f-private-link-off .f-file-preview-link-block { display: none; }
</style>

<div class="dialog f-dialog f-share-dialog" id="{$dialog_id}">
    {form_begin}
        <div class="dialog-background"></div>
        <div class="dialog-body" style="width: 800px">
            <h3 class="dialog-header">
                {title file=$file}
                {$file.name|escape|truncate:32}
            </h3>
            <div class="dialog-content">

                {if $file.full_access}
                    {if !$wa->get('public_link')}
                        {include file='./include.share.html' is_dialog=true inline}
                    {else}
                        {include file='./include.public_link.html' is_dialog=true inline}
                    {/if}
                {else}
                    <p class="state-error-hint">
                        [`Insufficient access rights`]
                    </p>
                {/if}

            </div>
            <div class="dialog-footer">
                {if $file.full_access}
                    <a class="js-close-dialog button light-gray" href="javascript:void(0);" id="f-share-dialog-cancel">[`Close`]</a>
                    <div style="display:none;" id="f-share-dialog-ctrl">
                        <button type="submit" class="button"><i class="fas fa-spinner fa-spin loading custom-mr-4" style="display:none;"></i> [`Save`]</button>
                        <a class="js-close-dialog button light-gray" href="javascript:void(0);">[`Cancel`]</a>
                        <input type="hidden" name="file_id" value="{$file.id}">
                    </div>
                {else}
                    <a class="js-close-dialog button red" href="javascript:void(0);">[`Cancel`]</a>
                {/if}
            </div>
        </div>
    {form_end}
    <script>
        $(function() {
            var dialog = $('#{$dialog_id}');
            $('.f-share-dialog').not(dialog).remove();

            var showSubmitButton = function() {
                $('#f-share-dialog-cancel').slideUp(0, function() {
                    $('#f-share-dialog-ctrl').slideDown(0);
                });
            };

            {if $file.full_access}
            dialog.filesDialog({
                onFirstLoad: function() {

                    // trigger share block link
                    (function(link) {
                        link.on('click', function() {
                            var block = $(this).closest('.block');
                            var groups_block = block.find('.f-groups-block');
                            if (groups_block.is(':hidden')) {
                                groups_block.show();
                            } else {
                                groups_block.hide();
                            }
                        });
                    })($('.f-share-block-trigger', dialog));

                    // preview link click and select
                    (function (input) {
                        input.select().on('click', function() {
                            $(this).select();
                        });
                    })($('.f-file-preview-link', dialog));

                    var createLink = function() {
                        var self = $(this);
                        $.files.jsonPost(
                            '?module=share&action=createLink',
                            { file_id: '{$file.id}' },
                            function(r) {
                                if (r.status == 'ok' && r.data.link) {
                                    var private_link = r.data.link;
                                    var block = $('.f-file-preview-link-value', dialog).removeClass('f-private-link-off').addClass('f-private-link-on');
                                    block.find('.f-file-preview-link').val(private_link).trigger('click');
                                    block.find('.f-file-go-link').attr('href', private_link);
                                    $.files.controller.reloadPage();
                                }
                            }
                        );
                    };

                    var removeLink = function() {
                        var self = $(this);
                        $.files.jsonPost(
                            '?module=share&action=removeLink',
                            { file_id: '{$file.id}' },
                            function(r) {
                                if (r.status == 'ok') {
                                    $('.f-file-preview-link-value', dialog).removeClass('f-private-link-on').addClass('f-private-link-off');
                                    $.files.controller.reloadPage();
                                }
                            }
                        );
                    };

                    $(".js-private-link-toggle").waSwitch({
                        change: function(active) {
                            if (active) {
                                createLink();
                            } else {
                                removeLink();
                            }
                        }
                    });

                    {if !$wa->get('public_link')}
                    $('.f-share-dialog input').change(function() {
                        showSubmitButton();
                    });
                    {/if}

                    $('.f-autocomplete', dialog).bind('autocomplete_select', function() {
                        showSubmitButton()
                    });
                    $('.f-share-settings-level-select', dialog).change(function () {
                        showSubmitButton();
                    });
                    $('.f-delete', dialog).on('click', function() {
                        showSubmitButton();
                    });

                },
                onOpen: function($dialog, dialog_instance) {
                    $dialog.find('[type="submit"]').on('click', function(e) {
                        e.preventDefault();
                        const $btn = $(this);

                        $dialog.find('.loading').show();
                        $btn.prop('disabled', true);

                        const form = $dialog.find('form');
                        $.files.jsonPost({
                            url: '?module=share&action=save',
                            data: form.serialize(),
                            onSuccess: function(r) {
                                dialog_instance.close();
                                $.files.refreshSidebar();
                                const old_file = {$file|json_encode};
                                const new_file = r && r.status == 'ok' && r.data && r.data.file;
                                if (new_file && (old_file.hash !== new_file.hash || old_file.is_personal !== new_file.is_personal)) {
                                    $.files.controller.reloadPage();
                                }
                            },
                            onFailure: function(r) {
                                $.files.alertError("[`Couldn't share folder`]", r);
                            },
                            onAlways: function() {
                                form.data('loading', 0);
                                $dialog.find('.loading').hide();
                                $btn.prop('disabled', false);
                            }
                        });

                    })
                }
            });
            {else}
            dialog.filesDialog();
            {/if}
        });
    </script>
</div>