{if $ACTION == 'import_preview'}
<script>
{literal}
    $(function(){
        $('progress').hide();
        //$("form#importfile_form input.file").live('click', function(element) { element.click() });
        $('#upload-button').on('click',function(){
            if($('form#importfile_form input[name="import_file"]').val().length < 1){
               return false;
            }
            $('progress').show();
            $.ajax({
                // Your server script to process the upload
                url: 'groups.php?action=import',
                type: 'POST',
                dataType: 'json',

                // Form data
                data: new FormData($('form#importfile_form')[0]),

                // Tell jQuery not to process data or worry about content-type
                // You *must* include these options!
                cache: false,
                contentType: false,
                processData: false,

                // Custom XMLHttpRequest
                xhr: function() {
                    var myXhr = $.ajaxSettings.xhr();
                    if (myXhr.upload) {
                        // For handling the progress of the upload
                        myXhr.upload.addEventListener('progress', function(e) {
                            if (e.lengthComputable) {
                                $('progress').attr({
                                    value: e.loaded,
                                    max: e.total,
                                });
                            }
                        } , false);
                    }
                    return myXhr;
                },
                success: function(json){
                    if(json.ERROR){
                        alert(json.ERROR);
                        return false;
                    }else{
                        alert(json.MSG);
                        $('#modal_window').dialog('close');
                        return true;
                    }
                },
                error: function(XMLHttpRequest, textStatus, errorThrown){
                    alert(XMLHttpRequest.status+"\r\n"+XMLHttpRequest.responseText+': '+errorThrown);
                }
            });
        });
    });
{/literal}
</script>
<div class="main">
<form id="importfile_form" enctype="multipart/form-data" method="post">
    <input type="file" class="ui-button ui-corner-all ui-state-default" name="import_file"/>
    <br />
    <input type="button" id="upload-button"  class="ui-button ui-corner-all ui-state-highlight" value="Upload" />
    <br /><progress></progress>
</form>
</div>

{else}

    {yes_admin_page_menu main_title=$HEADING_TITLE buttons=$PAGE_HEADING_MENU_BUTTONS}
    
{/if}