Commit dfe13b71 authored by Eric Windham's avatar Eric Windham

Merge branch 'update-delete-modal' into 'develop'

Update delete modal

See merge request ninja-forms/ninja-forms!3617
parents 4024f611 75001e66
This diff is collapsed.
This diff is collapsed.
......@@ -3,6 +3,7 @@
.jBox-wrapper {
text-align: left;
z-index: 100000000 !important;
}
.jBox-wrapper,
......@@ -141,6 +142,11 @@
padding: 12px 15px;
}
.ninja-forms-settings #jBox-overlay .jBox-closeButton,
.ninja-forms-app #jBox-overlay .jBox-closeButton {
display: none;
}
/* jBox Confirm */
.jBox-Confirm .jBox-content {
......@@ -474,6 +480,7 @@
height: 100%;
background: #000;
background-color: rgba(0, 0, 0, .6);
z-index: 99999999 !important;
}
/* Block scrolling */
......@@ -568,3 +575,21 @@ body[class*=" jBox-blockScroll-"] {
font-size: 18px;
color: #888;
}
/* Progress Bar */
.jBox-content .nf-progress-bar {
height: 20px;
border-radius: 3px;
margin: 25px 0px;
border: 1px solid #1ea9ea;
position: relative;
overflow: hidden;
}
.jBox-content .nf-progress-bar-slider {
height: 20px;
width: 0%;
background-color: #1ea9ea;
transition: width 0.3s;
}
......@@ -114,94 +114,34 @@ define( [], function() {
*/
doDeleteFieldModal: function( e, dataModel ) {
// Build warning modal to warn user a losing all data related to field
var message, container, messageBox, deleteMsgs, buttons, confirm, cancel, lineBreak;
container = document.createElement( 'div' );
messageBox = document.createElement( 'p' );
buttons = document.createElement( 'div' );
buttons.style.marginTop = '10px';
buttons.style.backgroundColor = '#f4f5f6';
confirm = document.createElement( 'div' );
confirm.style.padding = '8px';
confirm.style.backgroundColor = '#d9534f';
confirm.style.borderColor = '#d9534f';
confirm.style.fontSize = '14pt';
confirm.style.fontWeight = 'bold';
confirm.style.color = '#ffffff';
confirm.style.borderRadius = '4px';
cancel = document.createElement( 'div' );
cancel.style.padding = '8px';
cancel.style.backgroundColor = '#5bc0de';
cancel.style.borderColor = '#5bc0de';
cancel.style.fontSize = '14pt';
cancel.style.fontWeight = 'bold';
cancel.style.color = '#ffffff';
cancel.style.borderRadius = '4px';
lineBreak = document.createElement( 'br' );
container.classList.add( 'message' );
messageBox.innerHTML += nfi18n.fieldDataDeleteMsg;
messageBox.appendChild( lineBreak );
container.appendChild( messageBox );
container.appendChild( lineBreak );
confirm.innerHTML = nfi18n.delete;
confirm.classList.add( 'confirm', 'nf-button', 'primary' );
confirm.style.float = 'left';
cancel.innerHTML = nfi18n.cancel;
cancel.classList.add( 'cancel', 'nf-button', 'secondary', 'cancel-delete-all' );
cancel.style.float = 'right';
buttons.appendChild( confirm );
buttons.appendChild( cancel );
buttons.classList.add( 'buttons' );
container.appendChild( buttons );
message = document.createElement( 'div' );
message.appendChild( container );
// set up delete model with all the elements created above
var deleteFieldModal = new jBox( 'Modal', {
width: 450,
addClass: 'dashboard-modal',
zIndex: 999999999,
overlay: true,
closeOnClick: false
} );
deleteFieldModal.setContent( message.innerHTML );
deleteFieldModal.setTitle( 'Delete Field?' );
var that = this;
// add event listener for cancel button
var btnCancel = deleteFieldModal.container[0].getElementsByClassName('cancel')[0];
btnCancel.addEventListener('click', function() {
// close and destroy modal
deleteFieldModal.close();
deleteFieldModal.destroy();
// set deleting to false so edit can work as normal
that.deleting = false;
} );
// add event listener for delete button
var btnDelete = deleteFieldModal.container[0].getElementsByClassName('confirm')[0];
btnDelete.addEventListener('click', function() {
// close and destroy modal.
deleteFieldModal.close();
deleteFieldModal.destroy();
// proceed as normal, data will be deleted in backend on publish
that.clickDelete( e, dataModel );
} );
deleteFieldModal.open();
var that = this;
var modalData = {
width: 400,
closeOnClick: false,
closeOnEsc: true,
content: nfi18n.fieldDataDeleteMsg,
btnPrimary: {
text: nfi18n.delete,
callback: function() {
// close and destory modal.
deleteModal.toggleModal( false );
deleteModal.destroy();
// proceed as normal, data will be deleted in backend on publish
that.clickDelete( e, dataModel );
}
},
btnSecondary: {
text: nfi18n.cancel,
callback: function() {
// close and destory modal
deleteModal.toggleModal( false );
deleteModal.destroy();
// set deleting to false so edit can work as normal
that.deleting = false;
}
}
};
var deleteModal = new NinjaModal( modalData );
},
/**
......
......@@ -55,6 +55,14 @@ function NinjaModal ( data ) {
}
/**
* Function to destory the modal.
*/
NinjaModal.prototype.destroy = function () {
this.popup.destroy();
}
/**
* Function to increment the progress bar.
*
......
This source diff could not be displayed because it is too large. You can view the blob instead.
This source diff could not be displayed because it is too large. You can view the blob instead.
File mode changed from 100644 to 100755
File mode changed from 100755 to 100644
......@@ -234,26 +234,6 @@ jBox
}
}
/*
Progress Bar
---------------------------------------------*/
.nf-progress-bar {
height: 20px;
border-radius: 3px;
margin: 25px 0px;
border: 1px solid #1ea9ea;
position: relative;
overflow: hidden;
.nf-progress-bar-slider {
height: 20px;
width: 0%;
background-color: #1ea9ea;
transition: width 0.3s;
}
}
/*
Loading Spinner
---------------------------------------------*/
......
......@@ -220,6 +220,7 @@ final class NF_Admin_Menus_Forms extends NF_Abstracts_Menu
wp_enqueue_script( 'jquery-perfect-scrollbar', Ninja_Forms::$url . 'assets/js/lib/perfect-scrollbar.jquery.min.js', array( 'jquery' ) );
wp_enqueue_script( 'jquery-hotkeys-new', Ninja_Forms::$url . 'assets/js/lib/jquery.hotkeys.min.js' );
wp_enqueue_script( 'jBox', Ninja_Forms::$url . 'assets/js/lib/jBox.min.js' );
wp_enqueue_script( 'nf-ninjamodal', Ninja_Forms::$url . 'assets/js/lib/ninjaModal.js', array( 'jBox' ) );
wp_enqueue_script( 'nf-jquery-caret', Ninja_Forms::$url . 'assets/js/lib/jquery.caret.min.js' );
wp_enqueue_script( 'speakingurl', Ninja_Forms::$url . 'assets/js/lib/speakingurl.js' );
wp_enqueue_script( 'jquery-slugify', Ninja_Forms::$url . 'assets/js/lib/slugify.min.js', array( 'jquery', 'speakingurl' ) );
......
......@@ -71,9 +71,7 @@ return apply_filters( 'ninja_forms_i18n_builder', array(
__( 'Fr', 'ninja-forms' ),
__( 'Sa', 'ninja-forms' )
),
'fieldDataDeleteMsg' => __( 'This will DELETE all data' .
' associated with this field. You will not be able to' .
' retrieve data for this field!' ),
'fieldDataDeleteMsg' => sprintf( __( '%sThis will also DELETE all submission data associated with this field.%sYou will not be able to retrieve this data later!%s' ), '<p>', '</p><p>', '</p><br />' ),
'delete' => __( 'Delete' ),
'cancel' => __( 'Cancel' ),
'valueChars' => __( 'In order to prevent errors, values may only contain'
......
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