', {
class: 'lte-sole-modal-content',
html: temporaryContent
}));
},
setContent: function(html) {
this.lazyInit();
this.$getContent().html(html || ' ');
},
runPendingMethod: function() {
if (this.currentMethod) {
return false;
}
if (!this.pendingMethod) {
if (this.queue.length) {
// there are messages to display
this.pendingMethod = 'show';
} else {
return false;
}
}
var pendingMethod = this.pendingMethod;
this.pendingMethod = '';
if (pendingMethod == 'hide') {
this.hide();
return true;
} else if (pendingMethod == 'show') {
this.show();
return true;
} else {
console.warn('Unknown pending method:', pendingMethod);
this.hide();
return false;
}
},
setSize: function(width, height) {
var $size = this.$modal.find('> .media-modal');
var $modal = this.$modal;
$modal.addClass('fw-modal-opening');
if (
$size.height() != height
||
$size.width() != width
) {
$size.animate({
'height': height +'px',
'width': width +'px'
}, this.animationTime);
}
setTimeout(function () {
$modal.removeClass('fw-modal-opening');
}, this.animationTime);
$size = undefined;
},
/**
* Show modal
* Call without arguments to display next from queue
* @param {String} [id]
* @param {String} [html]
* @param {Object} [opts]
* @returns {Boolean}
*/
show: function (id, html, opts) {
if (typeof id != 'undefined') {
// make sure to remove this id from queue (if was added previously)
this.queue = _.filter(this.queue, function (item) { return item.id != id; });
{
opts = jQuery.extend({
autoHide: 0,
allowClose: true,
showCloseButton: true,
width: 350,
height: 200,
hidePrevious: false,
updateIfCurrent: false,
wrapWithTable: true,
backdrop: null,
customClass: null,
afterOpen: function(){},
afterOpenStart: function(){},
afterClose: function(){},
afterCloseStart: function(){}
}, opts || {});
// hide close button if close is not allowed
opts.showCloseButton = opts.showCloseButton && opts.allowClose;
opts.id = id;
opts.html = html;
}
this.queue.push(opts);
return this.show();
}
if (this.currentMethod) {
return false;
}
if (this.current) {
if (
this.queue.length
&&
this.queue[0].id === this.current.id
&&
this.queue[0].updateIfCurrent
) {
if (this.$modal && this.current.customClass !== null) {
this.$modal.removeClass(this.current.customClass);
}
if (this.$modal && ! this.current.wrapWithTable) {
this.wrapWithTable(this.$modal);
}
this.current = this.queue.shift();
if (this.$modal && this.current.customClass !== null) {
this.$modal.addClass(this.current.customClass);
}
this.setContent(this.current.html);
if (this.$modal && ! this.current.wrapWithTable) {
this.unwrapWithTable(this.$modal);
}
return true;
} else {
return false;
}
}
if (this.current && this.$modal && this.current.customClass !== null) {
this.$modal.removeClass(this.current.customClass);
}
if (this.current && this.$modal && ! this.current.wrapWithTable) {
this.unwrapWithTable(this.$modal);
}
this.currentMethod = '';
this.current = this.queue.shift();
if (!this.current) {
this.hide();
return false;
}
this.currentMethod = 'show';
this.setContent(this.current.html);
this.$getCloseButton().css('display', this.current.showCloseButton ? '' : 'none');
{
this.$modal.removeClass('fw-modal-backdrop-light fw-modal-backdrop-dark');
if (this.current.backdrop !== null) {
this.$modal.addClass('fw-modal-backdrop-'+ (this.current.backdrop ? 'light' : 'dark'));
}
}
this.$modal.removeClass('fw-modal-closing');
this.$modal.addClass('fw-modal-open');
if (this.$modal && this.current.customClass !== null) {
this.$modal.addClass(this.current.customClass);
}
if (this.$modal && ! this.current.wrapWithTable) {
this.unwrapWithTable(this.$modal);
}
this.$modal.css('display', '');
this.setSize(this.current.width, this.current.height);
this.current.afterOpenStart(this.$modal);
this.currentMethodTimeoutId = setTimeout(_.bind(function() {
this.current.afterOpen();
this.currentMethod = '';
if (this.runPendingMethod()) {
return;
}
if (this.current.autoHide > 0) {
this.currentMethod = 'auto-hide';
this.currentMethodTimeoutId = setTimeout(_.bind(function () {
this.currentMethod = '';
this.hide();
}, this), this.current.autoHide);
}
}, this), this.animationTime * 2);
return true;
},
/**
* @param {String} [id]
* @returns {boolean}
*/
hide: function(id) {
if (typeof id != 'undefined') {
if (this.current && this.current.id == id) {
// this id is currently displayed, hide it
} else {
// remove id from queue
this.queue = _.filter(this.queue, function (item) {
return item.id != id;
});
return true;
}
}
if (this.currentMethod) {
if (this.currentMethod == 'hide') {
return false;
} else if (this.currentMethod == 'auto-hide') {
clearTimeout(this.currentMethodTimeoutId);
} else {
this.pendingMethod = 'hide';
return true;
}
}
this.currentMethod = '';
if (!this.current) {
// nothing to hide
return this.runPendingMethod();
}
this.currentMethod = 'hide';
if (this.queue.length && !this.queue[0].hidePrevious) {
// replace content
this.current.afterCloseStart(this.$modal);
this.$getContent().fadeOut('fast', _.bind(function(){
this.current.afterClose();
if (this.$modal && this.current.customClass !== null) {
this.$modal.removeClass(this.current.customClass);
}
if (this.$modal && ! this.current.wrapWithTable) {
this.wrapWithTable(this.$modal);
}
this.currentMethod = '';
this.current = null;
this.show();
this.$getContent().fadeIn('fast');
}, this));
return true;
}
this.$modal.addClass('fw-modal-closing');
this.current.afterCloseStart(this.$modal);
this.currentMethodTimeoutId = setTimeout(_.bind(function(){
this.current.afterClose();
this.currentMethod = '';
this.$modal.css('display', 'none');
this.$modal.removeClass('fw-modal-open');
this.$modal.removeClass('fw-modal-closing');
if (this.$modal && this.current.customClass !== null) {
this.$modal.removeClass(this.current.customClass);
}
if (this.$modal && ! this.current.wrapWithTable) {
this.wrapWithTable(this.$modal);
}
this.setContent('');
this.current = null;
this.runPendingMethod();
}, this), this.animationTime);
}
};
return {
show: function(id, html, opts) {
inst.show(id, html, opts);
},
hide: function(id){
inst.hide(id);
},
/**
* Generate flash messages html for soleModal content
*/
renderFlashMessages: function (flashMessages) {
var html = [],
typeHtml = [],
typeMessageClass = '',
typeIconClass = '',
typeTitle = '';
jQuery.each(flashMessages, function(type, messages){
typeHtml = [];
switch (type) {
case 'error':
typeMessageClass = 'fw-text-danger';
typeIconClass = 'dashicons dashicons-dismiss';
//typeTitle = _lte_localized.l10n.ah_sorry;
break;
case 'warning':
typeMessageClass = 'fw-text-warning';
typeIconClass = 'dashicons dashicons-no-alt';
//typeTitle = _lte_localized.l10n.ah_sorry;
break;
case 'success':
typeMessageClass = 'fw-text-success';
typeIconClass = 'dashicons dashicons-star-filled';
//typeTitle = _lte_localized.l10n.done;
break;
case 'info':
typeMessageClass = 'fw-text-info';
typeIconClass = 'dashicons dashicons-info';
//typeTitle = _lte_localized.l10n.done;
break;
default:
typeMessageClass = typeIconClass = typeTitle = '';
}
jQuery.each(messages, function(messageId, message){
if (!typeTitle.length) {
return;
}
typeHtml.push(
'
'+
' '+ typeTitle +'
'+
''+ message +'
'+
''
);
});
if (typeHtml.length) {
html.push(
'
'
);
}
});
return html.join('');
}
};
})();
/**
* Simple mechanism of getting confirmations from the user.
*
* Usage:
*
* var confirm = lte.soleConfirm.create();
* confirm.result.then(function (data) {
* // SUCCESS!!
* });
*
* confirm.result.fail(function (data) {
* // FAIL!!
* });
*
* confirm.show();
*
* Note: confirm.result is a full-featured jQuery.Deferred object, you can also
* use methods like always, done, jQuery.when with it.
*
* Warning:
* You confirm object will be garbage collected after the user will pick an
* option, that is, it will become null. You should create one more confirm
* afterwards, if you need it.
*
* TODO:
* 1. Maybe pass unknown options to lte.soleModal itself.
*/
lte.soleConfirm = (function ($) {
var hashMap = {};
function create (opts) {
var confirm = new Confirm(opts);
hashMap[confirm.id] = confirm;
return hashMap[confirm.id];
}
function Confirm (opts) {
this.result = jQuery.Deferred();
this.id = lte.randomMD5();
this.opts = _.extend({
severity: 'info', // warning | info
message: null,
backdrop: null,
renderFunction: null,
shouldResolvePromise: function (confirm, el, action) { return true; },
//okHTML: _lte_localized.l10n.ok,
//cancelHTML: _lte_localized.l10n.cancel,
customClass: ''
}, opts);
}
Confirm.prototype.destroy = function () {
hashMap[this.id] = null;
delete hashMap[this.id];
}
/**
* Attached listeners on this.result will be lost after this operation.
* You'll have to add them once again.
*/
Confirm.prototype.reset = function () {
if (hashMap[this.id]) {
throw "You can't reset till your promise is not resolved! Do a .destroy() if you don't need Confirm anymore!";
}
if (this.result.isRejected() || this.result.isResolved()) {
this.result = jQuery.Deferred();
}
hashMap[this.id] = this;
};
Confirm.prototype.show = function () {
this._checkIsSet();
lte.soleModal.show(this.id, this._getHtml(), {
wrapWithTable: false,
showCloseButton: false,
allowClose: false, // a confirm window can't be closed on click of it's backdrop
backdrop: this.opts.backdrop,
customClass: 'lte-sole-confirm-modal lte-sole-confirm-' + this.opts.severity + ' ' + this.opts.customClass,
updateIfCurrent: true,
afterOpenStart: _.bind(this._fireEvents, this),
afterCloseStart: _.bind(this._teardownEvents, this),
onFireEvents: jQuery.noop,
onTeardownEvents: jQuery.noop
});
};
Confirm.prototype.hide = function (reason) {
this._checkIsSet();
lte.soleModal.hide(this.id);
};
//////////////////
Confirm.prototype._fireEvents = function ($modal) {
$modal.attr('data-lte-sole-confirm-id', this.id);
$modal.find('.lte-sole-confirm-button')
.add(
$modal.find('.media-modal-backdrop')
)
.on('click.lte-sole-confirm', _.bind(this._handleClose, this));
if (this.opts.onFireEvents) {
this.opts.onFireEvents(this, $modal[0]);
}
};
Confirm.prototype._teardownEvents = function ($modal) {
$modal.find('.lte-sole-confirm-button')
.add(
$modal.find('.media-modal-backdrop')
)
.off('click.lte-sole-confirm');
if (this.opts.onTeardownEvents) {
this.opts.onTeardownEvents(this, $modal[0]);
}
};
Confirm.prototype._checkIsSet = function () {
if (! hashMap[this.id]) {
throw "You can't do operations on fullfilled Confirm! Do a .reset() first.";
}
};
Confirm.prototype._handleClose = function (event) {
event.preventDefault();
var $el = $(event.target);
if ($el.hasClass('media-modal-backdrop')) {
// do not do any transformation on $el here by intent
} else if (! $el.hasClass('lte-sole-confirm-button')) {
$el = $el.closest('.lte-sole-confirm-button');
}
var action = $el.attr('data-lte-sole-confirm-action') || 'reject';
var id = $el.closest('.lte-sole-modal').attr('data-lte-sole-confirm-id');
var confirm = hashMap[id];
if (confirm) {
var modal_container = $el.closest('.lte-sole-modal')[0];
if (action === 'reject') {
confirm.result.reject({
confirm: confirm,
modal_container: modal_container
});
} else {
var shouldHideAfterResolve = confirm.opts.shouldResolvePromise(
confirm, modal_container
);
if (! shouldHideAfterResolve) {
return;
}
// probably keep this syntax for another actions in future
_.contains(['resolve'], action) &&
confirm.result[action]({
confirm: confirm,
modal_container: $el.closest('.lte-sole-modal')[0]
});
}
confirm.hide();
confirm.destroy();
confirm = null;
}
};
Confirm.prototype._getHtml = function () {
if (this.opts.renderFunction) {
return this.opts.renderFunction(this);
}
var topHtml = '';
var iconClass = 'dashicons-' + this.opts.severity;
var icon = '
';
var heading = '
' + lte.capitalizeFirstLetter(this.opts.severity) + '
';
var message = this.opts.message ? '
' + this.opts.message + '
' : '';
topHtml = icon + heading + message;
var cancelButton = $('