var alertTypes = ['error', 'warning', 'info', 'success', 'input', 'prompt'];
import {
isIE8
} from './utils';
import {
getModal,
getInput,
setFocusStyle
} from './handle-swal-dom';
import {
hasClass, addClass, removeClass,
escapeHtml,
_show, show, _hide, hide
} from './handle-dom';
/*
* Set type, text and actions on modal
*/
var setParameters = function(params) {
var modal = getModal();
var $title = modal.querySelector('h2');
var $text = modal.querySelector('p');
var $cancelBtn = modal.querySelector('button.cancel');
var $confirmBtn = modal.querySelector('button.confirm');
/*
* Title
*/
$title.innerHTML = params.html ? params.title : escapeHtml(params.title).split('\n').join('
');
/*
* Text
*/
$text.innerHTML = params.html ? params.text : escapeHtml(params.text || '').split('\n').join('
');
if (params.text) show($text);
/*
* Custom class
*/
if (params.customClass) {
addClass(modal, params.customClass);
modal.setAttribute('data-custom-class', params.customClass);
} else {
// Find previously set classes and remove them
let customClass = modal.getAttribute('data-custom-class');
removeClass(modal, customClass);
modal.setAttribute('data-custom-class', '');
}
/*
* Icon
*/
hide(modal.querySelectorAll('.sa-icon'));
if (params.type && !isIE8()) {
let validType = false;
for (let i = 0; i < alertTypes.length; i++) {
if (params.type === alertTypes[i]) {
validType = true;
break;
}
}
if (!validType) {
logStr('Unknown alert type: ' + params.type);
return false;
}
let typesWithIcons = ['success', 'error', 'warning', 'info'];
let $icon;
if (typesWithIcons.indexOf(params.type) !== -1) {
$icon = modal.querySelector('.sa-icon.' + 'sa-' + params.type);
show($icon);
}
let $input = getInput();
// Animate icon
switch (params.type) {
case 'success':
addClass($icon, 'animate');
addClass($icon.querySelector('.sa-tip'), 'animateSuccessTip');
addClass($icon.querySelector('.sa-long'), 'animateSuccessLong');
break;
case 'error':
addClass($icon, 'animateErrorIcon');
addClass($icon.querySelector('.sa-x-mark'), 'animateXMark');
break;
case 'warning':
addClass($icon, 'pulseWarning');
addClass($icon.querySelector('.sa-body'), 'pulseWarningIns');
addClass($icon.querySelector('.sa-dot'), 'pulseWarningIns');
break;
case 'input':
case 'prompt':
$input.setAttribute('type', params.inputType);
$input.value = params.inputValue;
$input.setAttribute('placeholder', params.inputPlaceholder);
addClass(modal, 'show-input');
setTimeout(function () {
$input.focus();
$input.addEventListener('keyup', swal.resetInputError);
}, 400);
break;
}
}
/*
* Custom image
*/
if (params.imageUrl) {
let $customIcon = modal.querySelector('.sa-icon.sa-custom');
$customIcon.style.backgroundImage = 'url(' + params.imageUrl + ')';
show($customIcon);
let _imgWidth = 80;
let _imgHeight = 80;
if (params.imageSize) {
let dimensions = params.imageSize.toString().split('x');
let imgWidth = dimensions[0];
let imgHeight = dimensions[1];
if (!imgWidth || !imgHeight) {
logStr('Parameter imageSize expects value with format WIDTHxHEIGHT, got ' + params.imageSize);
} else {
_imgWidth = imgWidth;
_imgHeight = imgHeight;
}
}
$customIcon.setAttribute('style', $customIcon.getAttribute('style') + 'width:' + _imgWidth + 'px; height:' + _imgHeight + 'px');
}
/*
* Show cancel button?
*/
modal.setAttribute('data-has-cancel-button', params.showCancelButton);
if (params.showCancelButton) {
$cancelBtn.style.display = 'inline-block';
} else {
hide($cancelBtn);
}
/*
* Show confirm button?
*/
modal.setAttribute('data-has-confirm-button', params.showConfirmButton);
if (params.showConfirmButton) {
$confirmBtn.style.display = 'inline-block';
} else {
hide($confirmBtn);
}
/*
* Custom text on cancel/confirm buttons
*/
if (params.cancelButtonText) {
$cancelBtn.innerHTML = escapeHtml(params.cancelButtonText);
}
if (params.confirmButtonText) {
$confirmBtn.innerHTML = escapeHtml(params.confirmButtonText);
}
/*
* Custom color on confirm button
*/
if (params.confirmButtonColor) {
// Set confirm button to selected background color
$confirmBtn.style.backgroundColor = params.confirmButtonColor;
// Set the confirm button color to the loading ring
$confirmBtn.style.borderLeftColor = params.confirmLoadingButtonColor;
$confirmBtn.style.borderRightColor = params.confirmLoadingButtonColor;
// Set box-shadow to default focused button
setFocusStyle($confirmBtn, params.confirmButtonColor);
}
/*
* Allow outside click
*/
modal.setAttribute('data-allow-outside-click', params.allowOutsideClick);
/*
* Callback function
*/
var hasDoneFunction = params.doneFunction ? true : false;
modal.setAttribute('data-has-done-function', hasDoneFunction);
/*
* Animation
*/
if (!params.animation) {
modal.setAttribute('data-animation', 'none');
} else if (typeof params.animation === 'string') {
modal.setAttribute('data-animation', params.animation); // Custom animation
} else {
modal.setAttribute('data-animation', 'pop');
}
/*
* Timer
*/
modal.setAttribute('data-timer', params.timer);
};
export default setParameters;