Commit 1760e3fc authored by Kevin Stover's avatar Kevin Stover

First pass at importing forms using the batch processor.

parent 9ecfa951
......@@ -67,4 +67,8 @@
.alignleft.actions input[type=text] {
height: 28px;
border-radius: 4px;
}
.jBox-content {
overflow: hidden !important;
}
\ No newline at end of file
jQuery( document ).ready( function( $ ) {
/**
* Stores the selected file details for form imports.
*
* name is the filename from the user's computer, including extension.
* content is the base64 encoded contents as a result of using the HTML5 FileReader API.
* @type {Object}
*/
var importFormFile = {
name: '',
content: ''
};
/**
* Listen for clicks on our "import" button.
* It sets data for our batch processor and then instantiates a batch process.
*
* @since UPDATE_VERSION_ON_MERGE
* @param object e Click Event
* @return void
*/
$( document ).on( 'click', '#nf-import-form', function( e ) {
// Settings object for our batch processor
var settings = {
// Initial content for the popup modal
content: '<h3>Select a file</h3><p><input id="nf-import-file" type="file" /></p>',
btnPrimaryText: 'Import!',
btnSecondaryText: 'Cancel',
// Batch processor slug. Must match what we have set in our PHP settings array.
batch_type: 'import_form',
extraData: importFormFile
}
/**
* Instantiate our batch processor.
*
* This will open the modal and present the user with content and buttons.
*/
new NinjaBatchProcessor( settings );
} );
/**
* Selecting a file within an input field triggers a jQuery change event.
*
* When we select a form file to import, we need to do a few things:
*
* Disable the primary button of our batch processing modal.
* Grab the file and make sure that it has a .nff extension.
* Read the contents and base64 encode them using the HTML5 FileReader API.
* Set the contents to our importFormFile variable.
*
* @since UPDATE_VERSION_ON_MERGE
* @param object e Change Event
* @return {[type]} [description]
*/
$( document ).on( 'change', '#nf-import-file', function( e ) {
// Grab the file from the input.
var file = e.target.files[0];
// If our file var is empty, bail.
if ( ! file ) {
return false;
}
// Use some Regex to get the extension
var extension = file.name.match(/\.[0-9a-z]+$/i);
// If we don't have a .nff extension, bail.
if ( '.nff' !== extension[0] ) {
return false;
}
// Disable the primary button for our batch processing modal.
jQuery( '#nf-button-primary-1' ).hide();
// Instantiate the HTML5 FileReader API.
var reader = new FileReader();
/**
* When the HTML5 API says that we've successfully loaded the file contents:
* Set our importFormFile var.
* Enable our batch processor primary button.
* We use Javascript's addEventListener to update our var.
*/
reader.addEventListener( 'load', function () {
importFormFile.name = file.name;
importFormFile.content = reader.result;
jQuery( '#nf-button-primary-1' ).show();
}, false);
// Use the readAsDataURL method of the FileReader API.
reader.readAsDataURL( file );
} );
var clickedElement;
......
......@@ -294,71 +294,13 @@ jQuery(document).ready(function($) {
} );
jQuery( '#nfTrashExpiredSubmissions' ).click( function( e ) {
var that = this;
var data = {
closeOnClick: false,
closeOnEsc: true,
content: '<p>' + nf_settings.i18n.trashExpiredSubsMessage + '<p>',
btnPrimary: {
text: nf_settings.i18n.trashExpiredSubsButtonPrimary,
callback: function( e ) {
// Hide the buttons.
deleteModal.maybeShowActions( false );
// Show the progress bar.
deleteModal.maybeShowProgress( true );
// Begin our cleanup process.
that.submissionExpirationProcess( that, -1, deleteModal );
}
},
btnSecondary: {
text: nf_settings.i18n.trashExpiredSubsButtonSecondary,
callback: function( e ) {
deleteModal.toggleModal( false );
}
},
useProgressBar: true,
};
this.submissionExpirationProcess = function( context, steps, modal ) {
var data = {
action: 'nf_batch_process',
batch_type: 'expired_submission_cleanup',
security: nf_settings.batch_nonce
};
jQuery.post( nf_settings.ajax_url, data, function( response ) {
response = JSON.parse( response );
// If we're done...
if ( response.batch_complete ) {
// Push our progress bar to 100%.
modal.setProgress( 100 );
modal.toggleModal( false );
// Exit.
return false;
}
// If we do not yet have a determined number of steps...
if ( -1 == steps ) {
// If step_toal is defined...
if ( 'undefined' != typeof response.step_total ) {
// Use the step_total.
steps = response.step_total;
} // Otherwise... (step_total is not defined)
else {
// Use step_remaining.
steps = response.step_remaining;
}
}
// Calculate our current step.
var step = steps - response.step_remaining;
// Calculate our maximum progress for this step.
var maxProgress = Math.round( step / steps * 100 );
// Increment the progress.
modal.incrementProgress ( maxProgress );
// Recall our function...
context.submissionExpirationProcess( context, steps, modal );
} );
}
var deleteModal = new NinjaModal( data );
var settings = {
content: '<p>' + nf_settings.i18n.trashExpiredSubsMessage + '</p>',
btnPrimaryText: nf_settings.i18n.trashExpiredSubsButtonPrimary,
btnSecondaryText: nf_settings.i18n.trashExpiredSubsButtonSecondary,
batch_type: 'expired_submission_cleanup',
extraData: [ 'test1', 'test2', 'test3' ]
}
new NinjaBatchProcessor( settings );
});
});
/**
* Batch Processor JS Object
*/
function NinjaBatchProcessor( settings ) {
var that = this;
var data = {
closeOnClick: false,
closeOnEsc: true,
content: settings.content,
btnPrimary: {
text: settings.btnPrimaryText,
callback: function( e ) {
// Hide the buttons.
modalInstance.maybeShowActions( false );
// Show the progress bar.
modalInstance.maybeShowProgress( true );
// Begin our cleanup process.
that.postToProcessor( that, -1, modalInstance );
}
},
btnSecondary: {
text: settings.btnSecondaryText,
callback: function( e ) {
modalInstance.toggleModal( false );
}
},
useProgressBar: true,
};
this.postToProcessor = function( context, steps, modal, data ) {
if ( 'undefined' == typeof data ) {
var data = {
action: 'nf_batch_process',
batch_type: settings.batch_type,
security: nf_settings.batch_nonce,
extraData: settings.extraData
};
}
jQuery.post( nf_settings.ajax_url, data, function( response ) {
response = JSON.parse( response );
// If we're done...
if ( response.batch_complete ) {
// Push our progress bar to 100%.
modal.setProgress( 100 );
modal.toggleModal( false );
// Exit.
return false;
}
// If we do not yet have a determined number of steps...
if ( -1 == steps ) {
// If step_toal is defined...
if ( 'undefined' != typeof response.step_total ) {
// Use the step_total.
steps = response.step_total;
} // Otherwise... (step_total is not defined)
else {
// Use step_remaining.
steps = response.step_remaining;
}
}
// If our PHP edited our extraData variable, update our JS var and pass it along.
if ( 'undefined' != typeof response.extraData ) {
// Update our extraData property.
data.extraData = response.extraData;
}
// Calculate our current step.
var step = steps - response.step_remaining;
// Calculate our maximum progress for this step.
var maxProgress = Math.round( step / steps * 100 );
// Increment the progress.
modal.incrementProgress ( maxProgress );
// Recall our function...
context.postToProcessor( context, steps, modal, data );
} );
}
var modalInstance = new NinjaModal( data );
}
\ No newline at end of file
......@@ -280,7 +280,7 @@ NinjaModal.prototype.renderTitle = function () {
// If we have a title...
if ( '' != this.title ) {
// Set our title.
this.popup.setTitle( this.title );
this.popup.setTitle( 'HELLO WORLD!' );
}
}
......
......@@ -40,6 +40,10 @@ class NF_AJAX_REST_BatchProcess extends NF_AJAX_REST_Controller
$batch = new NF_Admin_Processes_ExpiredSubmissionCleanup(
$request_data );
break;
case 'import_form':
$batch = new NF_Admin_Processes_ImportForm(
$request_data );
break;
default:
$data[ 'error' ] = __( 'Invalid request.', 'ninja-forms' );
break;
......
......@@ -161,6 +161,24 @@ final class NF_Admin_Menus_ImportExport extends NF_Abstracts_Submenu
wp_enqueue_script( 'ninja_forms_admin_import_export' );
wp_localize_script( 'ninja_forms_admin_import_export', 'nf_settings', array(
'ajax_url' => admin_url( 'admin-ajax.php' ),
'batch_nonce' => wp_create_nonce( 'ninja_forms_batch_nonce' ),
'i18n' => array(
'trashExpiredSubsMessage' => __( 'Are you sure you want to trash all expired submissions?', 'ninja-forms' ),
'trashExpiredSubsButtonPrimary' => __( 'Trash', 'ninja-forms' ),
'trashExpiredSubsButtonSecondary' => __( 'Cancel', 'ninja-forms' ),
),
));
wp_enqueue_script( 'jBox', Ninja_Forms::$url . 'assets/js/lib/jBox.min.js', array( 'jquery' ) );
wp_enqueue_style( 'jBox', Ninja_Forms::$url . 'assets/css/jBox.css' );
wp_enqueue_script( 'nf-ninja-modal', Ninja_Forms::$url . 'assets/js/lib/ninjaModal.js', array( 'jquery' ) );
wp_enqueue_script( 'nf-batch-processor', Ninja_Forms::$url . 'assets/js/lib/batch-processor.js', array( 'jquery' ) );
wp_enqueue_style( 'nf-font-awesome', Ninja_Forms::$url . 'assets/css/font-awesome.min.css' );
Ninja_Forms::template( 'admin-menu-import-export.html.php', compact( 'tabs', 'active_tab' ) );
}
......
......@@ -173,6 +173,7 @@ final class NF_Admin_Menus_Settings extends NF_Abstracts_Submenu
'allow_telemetry' => $allow_tel,
));
wp_enqueue_script( 'nf-ninja-modal', Ninja_Forms::$url . 'assets/js/lib/ninjaModal.js' );
wp_enqueue_script( 'nf-ninja-batch-processor', Ninja_Forms::$url . 'assets/js/lib/batch-processor.js' );
wp_enqueue_style( 'nf-font-awesome', Ninja_Forms::$url . 'assets/css/font-awesome.min.css' );
......
This diff is collapsed.
<div class="wrap">
<button id="nf-import-form" class="button-primary">Import</button>
<form action="" method="post" enctype="multipart/form-data">
<input type="hidden" name="nf_import_security" id="nf_import_security"
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment