/**
*     Placement
*/

// Center
document.querySelector('.widget-content .default').addEventListener('click', function() {
Swal.fire({
position: 'center',
icon: 'success',
title: 'Placement set at default (center)',
showConfirmButton: false,
timer: 1500
})
})

// Top Start
document.querySelector('.widget-content .top-start').addEventListener('click', function() {
Swal.fire({
position: 'top-start',
icon: 'success',
title: 'Placement set at top left',
showConfirmButton: false,
timer: 1500
})
})

// Top End
document.querySelector('.widget-content .top-end').addEventListener('click', function() {
Swal.fire({
position: 'top-end',
icon: 'success',
title: 'Placement set at top right',
showConfirmButton: false,
timer: 1500
})
})

// Bottom Start
document.querySelector('.widget-content .bottom-start').addEventListener('click', function() {
Swal.fire({
position: 'bottom-start',
icon: 'success',
title: 'Placement set at bottom left',
showConfirmButton: false,
timer: 1500
})
})

// Bottom End
document.querySelector('.widget-content .bottom-end').addEventListener('click', function() {
Swal.fire({
position: 'bottom-end',
icon: 'success',
title: 'Placement set at bottom right',
showConfirmButton: false,
timer: 1500
})
})

document.querySelector('.widget-content .timer').addEventListener('click', function() {
let timerInterval
Swal.fire({
title: 'Auto close alert!',
html: 'I will close in  milliseconds.',
timer: 2000,
timerProgressBar: true,
didOpen: () => {
Swal.showLoading()
const b = Swal.getHtmlContainer().querySelector('b')
timerInterval = setInterval(() => {
b.textContent = Swal.getTimerLeft()
}, 100)
},
willClose: () => {
clearInterval(timerInterval)
}
}).then((result) => {
/* Read more about handling dismissals below */
if (result.dismiss === Swal.DismissReason.timer) {
console.log('I was closed by the timer')
}
})
})

document.querySelector('.widget-content .custom-image').addEventListener('click', function() {
Swal.fire({
title: 'Sweet!',
text: 'Modal with a custom image.',
imageUrl: 'https://unsplash.it/400/200',
imageWidth: 400,
imageHeight: 200,
imageAlt: 'Custom image',
})
})

document.querySelector('.widget-content .warning.confirm').addEventListener('click', function() {
Swal.fire({
title: 'Are you sure?',
text: "You won't be able to revert this!",
icon: 'warning',
showCancelButton: true,
confirmButtonColor: '#3085d6',
cancelButtonColor: '#d33',
confirmButtonText: 'Yes, delete it!'
}).then((result) => {
if (result.isConfirmed) {
Swal.fire(
'Deleted!',
'Your file has been deleted.',
'success'
)
}
})
})

const swalWithBootstrapButtons = Swal.mixin({
customClass: {
confirmButton: 'btn btn-success',
cancelButton: 'btn btn-danger'
},
buttonsStyling: false
})

document.querySelector('.widget-content .warning.cancel').addEventListener('click', function() {
Swal.fire({
title: 'Are you sure?',
text: "You won't be able to revert this!",
icon: 'warning',
showCancelButton: true,
confirmButtonText: 'Yes, delete it!',
cancelButtonText: 'No, cancel!',
reverseButtons: true
}).then((result) => {
if (result.isConfirmed) {
swalWithBootstrapButtons.fire(
'Deleted!',
'Your file has been deleted.',
'success'
)
} else if (
/* Read more about handling dismissals below */
result.dismiss === Swal.DismissReason.cancel
) {
swalWithBootstrapButtons.fire(
'Cancelled',
'Your imaginary file is safe :)',
'error'
)
}
})
})

document.querySelector('.widget-content .RTL').addEventListener('click', function() {
Swal.fire({
title: 'هل تريد الاستمرار؟',
icon: 'question',
iconHtml: '؟',
confirmButtonText: 'نعم',
cancelButtonText: 'لا',
showCancelButton: true,
showCloseButton: true
})
})

document.querySelector('.widget-content .mixin').addEventListener('click', function() {
const Toast = Swal.mixin({
toast: true,
position: 'top-end',
showConfirmButton: false,
timer: 3000,
timerProgressBar: true,
didOpen: (toast) => {
toast.addEventListener('mouseenter', Swal.stopTimer)
toast.addEventListener('mouseleave', Swal.resumeTimer)
}
})

Toast.fire({
icon: 'success',
title: 'Signed in successfully'
})
})

/**
*     Icons Type
*/
                                
// Succcess
document.querySelector('.widget-content .icon-success').addEventListener('click', function() {
Swal.fire({
icon: 'success',
title: 'Icon Success',
})
})

// Error
document.querySelector('.widget-content .icon-error').addEventListener('click', function() {
Swal.fire({
icon: 'error',
title: 'Icon Error',
})
})

// Warning
document.querySelector('.widget-content .icon-warning').addEventListener('click', function() {
Swal.fire({
icon: 'warning',
title: 'Icon Warning',
})
})

// Info
document.querySelector('.widget-content .icon-info').addEventListener('click', function() {
Swal.fire({
icon: 'info',
title: 'Icon Info',
})
})

// Question
document.querySelector('.widget-content .icon-question').addEventListener('click', function() {
Swal.fire({
icon: 'question',
title: 'Icon Question',
})
})