Default page

Edit File: sweet-alerts.init.js

/*
Template Name: Qovex - Admin & Dashboard Template
Author: Themesbrand
Website: https://themesbrand.com/
Contact: themesbrand@gmail.com
File: Sweet alerts 
*/

!function ($) {
    "use strict";

var SweetAlert = function () {
    };

//examples
    SweetAlert.prototype.init = function () {

//Basic
        $('#sa-basic').on('click', function () {
            Swal.fire(
                {
                    title: 'Any fool can use a computer',
                    confirmButtonColor: '#3b5de7',
                }
            )
        });

//A title with a text under
        $('#sa-title').click(function () {
            Swal.fire(
                {
                    title: "The Internet?",
                    text: 'That thing is still around?',
                    type: 'question',
                    confirmButtonColor: '#3b5de7'
                }
            )
        });

//Success Message
        $('#sa-success').click(function () {
            Swal.fire(
                {
                    title: 'Good job!',
                    text: 'You clicked the button!',
                    type: 'success',
                    showCancelButton: true,
                    confirmButtonColor: '#3b5de7',
                    cancelButtonColor: "#f46a6a"
                }
            )
        });

//Warning Message
        $('#sa-warning').click(function () {
            Swal.fire({
                title: "Are you sure?",
                text: "You won't be able to revert this!",
                type: "warning",
                showCancelButton: true,
                confirmButtonColor: "#34c38f",
                cancelButtonColor: "#f46a6a",
                confirmButtonText: "Yes, delete it!"
              }).then(function (result) {
                if (result.value) {
                  Swal.fire("Deleted!", "Your file has been deleted.", "success");
                }
            });
        });

//Parameter
        $('#sa-params').click(function () {
			Swal.fire({
                title: 'Are you sure?',
                text: "You won't be able to revert this!",
                type: 'warning',
                showCancelButton: true,
                confirmButtonText: 'Yes, delete it!',
                cancelButtonText: 'No, cancel!',
                confirmButtonClass: 'btn btn-success mt-2',
                cancelButtonClass: 'btn btn-danger ms-2 mt-2',
                buttonsStyling: false
            }).then(function (result) {
                if (result.value) {
                    Swal.fire({
                      title: 'Deleted!',
                      text: 'Your file has been deleted.',
                      type: 'success'
                    })
                  } else if (
                    // Read more about handling dismissals
                    result.dismiss === Swal.DismissReason.cancel
                  ) {
                    Swal.fire({
                      title: 'Cancelled',
                      text: 'Your imaginary file is safe :)',
                      type: 'error'
                    })
                  }
            });
        });

//Custom Image
 $('#sa-image').click(function () {
 Swal.fire({
 title: 'Sweet!',
 text: 'Modal with a custom image.',
 imageUrl: 'assets/images/logo-dark.png',
 imageHeight: 20,
 confirmButtonColor: "#3b5de7",
 animation: false
 })
 });
		
 //Auto Close Timer
 $('#sa-close').click(function () {
 var timerInterval;
 Swal.fire({
 title: 'Auto close alert!',
 html: 'I will close in seconds.',
 timer: 2000,
 onBeforeOpen:function () {
 Swal.showLoading()
 timerInterval = setInterval(function() {
 Swal.getContent().querySelector('strong')
 .textContent = Swal.getTimerLeft()
 }, 100)
 },
 onClose: function () {
 clearInterval(timerInterval)
 }
 }).then(function (result) {
 if (
 // Read more about handling dismissals
 result.dismiss === Swal.DismissReason.timer
 ) {
 console.log('I was closed by the timer')
 }
 })
 });

//custom html alert
 $('#custom-html-alert').click(function () {
 Swal.fire({
 title: 'HTML example',
 type: 'info',
 html: 'You can use bold text, ' +
 '<a href="//Themesbrand.in/">links</a> ' +
 'and other HTML tags',
 showCloseButton: true,
 showCancelButton: true,
 confirmButtonClass: 'btn btn-success',
 cancelButtonClass: 'btn btn-danger ms-1',
 confirmButtonColor: "#47bd9a",
 cancelButtonColor: "#f46a6a",
 confirmButtonText: ' Great!',
 cancelButtonText: ''
 })
 });

//position
        $('#sa-position').click(function () {
            Swal.fire({
                position: 'top-end',
                type: 'success',
                title: 'Your work has been saved',
                showConfirmButton: false,
                timer: 1500
            })
        });

//Custom width padding
        $('#custom-padding-width-alert').click(function () {
            Swal.fire({
                title: 'Custom width, padding, background.',
                width: 600,
                padding: 100,
                confirmButtonColor: "#3b5de7",
                background: '#fff url(//subtlepatterns2015.subtlepatterns.netdna-cdn.com/patterns/geometry.png)'
            })
        });

//Ajax
        $('#ajax-alert').click(function () {
            Swal.fire({
                title: 'Submit email to run ajax request',
                input: 'email',
                showCancelButton: true,
                confirmButtonText: 'Submit',
                showLoaderOnConfirm: true,
                confirmButtonColor: "#3b5de7",
                cancelButtonColor: "#f46a6a",
                preConfirm: function (email) {
                    return new Promise(function (resolve, reject) {
                        setTimeout(function () {
                            if (email === 'taken@example.com') {
                                reject('This email is already taken.')
                            } else {
                                resolve()
                            }
                        }, 2000)
                    })
                },
                allowOutsideClick: false
            }).then(function (email) {
                Swal.fire({
                    type: 'success',
                    title: 'Ajax request finished!',
                    html: 'Submitted email: ' + email
                })
            })
        });

//chaining modal alert
 $('#chaining-alert').click(function () {
 Swal.mixin({
 input: 'text',
 confirmButtonText: 'Next &rarr;',
 showCancelButton: true,
 confirmButtonColor: "#3b5de7",
 cancelButtonColor: "#74788d",
 progressSteps: ['1', '2', '3']
 }).queue([
 {
 title: 'Question 1',
 text: 'Chaining swal2 modals is easy'
 },
 'Question 2',
 'Question 3'
 ]).then( function (result) {
 if (result.value) {
 Swal.fire({
 title: 'All done!',
 html:
 'Your answers: <pre><code>' +
 JSON.stringify(result.value) +
 '</code></pre>',
 confirmButtonText: 'Lovely!'
 })
 }
 })
 });

//Danger
        $('#dynamic-alert').click(function () {
            swal.queue([{
                title: 'Your public IP',
                confirmButtonColor: "#3b5de7",
                confirmButtonText: 'Show my public IP',
                text: 'Your public IP will be received ' +
                'via AJAX request',
                showLoaderOnConfirm: true,
                preConfirm: function () {
                    return new Promise(function (resolve) {
                        $.get('https://api.ipify.org?format=json')
                            .done(function (data) {
                                swal.insertQueueStep(data.ip)
                                resolve()
                            })
                    })
                }
            }]).catch(swal.noop)
        });

},
        //init
        $.SweetAlert = new SweetAlert, $.SweetAlert.Constructor = SweetAlert
}(window.jQuery),

//initializing
    function ($) {
        "use strict";
        $.SweetAlert.init()
    }(window.jQuery);