https://rsez.lv/wp-content/plugins/codespacing-progress-map/assets/js/izitoast/iziToast.js?ver=5.7.1
vendor: 35,471 bytes, lines 1-1292
1/* 2* iziToast | v1.4.0 3* http://izitoast.marcelodolce.com 4* by Marcelo Dolce. 5*/ 6(function (root, factory) { 7 if(typeof define === 'function' && define.amd) { 8 define([], factory(root)); 9 } else if(typeof exports === 'object') { 10 module.exports = factory(root); 11 } else { 12 root.iziToast = factory(root); 13 } 14})(typeof global !== 'undefined' ? global : window || this.window || this.global, function (root) { 15 16 'use strict'; 17 18 // 19 // Variables 20 // 21 var $iziToast = {}, 22 PLUGIN_NAME = 'iziToast', 23 BODY = document.querySelector('body'), 24 ISMOBILE = (/Mobi/.test(navigator.userAgent)) ? true : false, 25 ISCHROME = /Chrome/.test(navigator.userAgent) && /Google Inc/.test(navigator.vendor), 26 ISFIREFOX = typeof InstallTrigger !== 'undefined', 27 ACCEPTSTOUCH = 'ontouchstart' in document.documentElement, 28 POSITIONS = ['bottomRight','bottomLeft','bottomCenter','topRight','topLeft','topCenter','center'], 29 THEMES = { 30 info: { 31 color: 'blue', 32 icon: 'ico-info' 33 }, 34 success: { 35 color: 'green', 36 icon: 'ico-success' 37 }, 38 warning: { 39 color: 'orange', 40 icon: 'ico-warning' 41 }, 42 error: { 43 color: 'red', 44 icon: 'ico-error' 45 }, 46 question: { 47 color: 'yellow', 48 icon: 'ico-question' 49 } 50 }, 51 MOBILEWIDTH = 568, 52 CONFIG = {}; 53 54 $iziToast.children = {}; 55 56 // Default settings 57 var defaults = { 58 id: null, 59 class: '', 60 title: '', 61 titleColor: '', 62 titleSize: '', 63 titleLineHeight: '', 64 message: '', 65 messageColor: '', 66 messageSize: '', 67 messageLineHeight: '', 68 backgroundColor: '', 69 theme: 'light', // dark 70 color: '', // blue, red, green, yellow 71 icon: '', 72 iconText: '', 73 iconColor: '', 74 iconUrl: null, 75 image: '', 76 imageWidth: 50, 77 maxWidth: null, 78 zindex: null, 79 layout: 1, 80 balloon: false, 81 close: true, 82 closeOnEscape: false, 83 closeOnClick: false, 84 displayMode: 0, 85 position: 'bottomRight', // bottomRight, bottomLeft, topRight, topLeft, topCenter, bottomCenter, center 86 target: '', 87 targetFirst: true, 88 timeout: 5000, 89 rtl: false, 90 animateInside: true, 91 drag: true, 92 pauseOnHover: true, 93 resetOnHover: false, 94 progressBar: true, 95 progressBarColor: '', 96 progressBarEasing: 'linear', 97 overlay: false, 98 overlayClose: false, 99 overlayColor: 'rgba(0, 0, 0, 0.6)', 100 transitionIn: 'fadeInUp', // bounceInLeft, bounceInRight, bounceInUp, bounceInDown, fadeIn, fadeInDown, fadeInUp, fadeInLeft, fadeInRight, flipInX 101 transitionOut: 'fadeOut', // fadeOut, fadeOutUp, fadeOutDown, fadeOutLeft, fadeOutRight, flipOutX 102 transitionInMobile: 'fadeInUp', 103 transitionOutMobile: 'fadeOutDown', 104 buttons: {}, 105 inputs: {}, 106 onOpening: function () {}, 107 onOpened: function () {}, 108 onClosing: function () {}, 109 onClosed: function () {} 110 }; 111 112 // 113 // Methods 114 // 115 116 117 /** 118 * Polyfill for remove() method 119 */ 120 if(!('remove' in Element.prototype)) { 121 Element.prototype.remove = function() { 122 if(this.parentNode) { 123 this.parentNode.removeChild(this); 124 } 125 }; 126 } 127 128 /* 129 * Polyfill for CustomEvent for IE >= 9 130 * https://developer.mozilla.org/en-US/docs/Web/API/CustomEvent/CustomEvent#Polyfill 131 */ 132 if(typeof window.CustomEvent !== 'function') { 133 var CustomEventPolyfill = function (event, params) { 134 params = params || { bubbles: false, cancelable: false, detail: undefined }; 135 var evt = document.createEvent('CustomEvent'); 136 evt.initCustomEvent(event, params.bubbles, params.cancelable, params.detail); 137 return evt; 138 }; 139 140 CustomEventPolyfill.prototype = window.Event.prototype; 141 142 window.CustomEvent = CustomEventPolyfill; 143 } 144 145 /** 146 * A simple forEach() implementation for Arrays, Objects and NodeLists 147 * @private 148 * @param {Array|Object|NodeList} collection Collection of items to iterate 149 * @param {Function} callback Callback function for each iteration 150 * @param {Array|Object|NodeList} scope Object/NodeList/Array that forEach is iterating over (aka `this`) 151 */ 152 var forEach = function (collection, callback, scope) { 153 if(Object.prototype.toString.call(collection) === '[object Object]') { 154 for (var prop in collection) { 155 if(Object.prototype.hasOwnProperty.call(collection, prop)) { 156 callback.call(scope, collection[prop], prop, collection); 157 } 158 } 159 } else { 160 if(collection){ 161 for (var i = 0, len = collection.length; i < len; i++) { 162 callback.call(scope, collection[i], i, collection); 163 } 164 } 165 } 166 }; 167 168 /** 169 * Merge defaults with user options 170 * @private 171 * @param {Object} defaults Default settings 172 * @param {Object} options User options 173 * @returns {Object} Merged values of defaults and options 174 */ 175 var extend = function (defaults, options) { 176 var extended = {}; 177 forEach(defaults, function (value, prop) { 178 extended[prop] = defaults[prop]; 179 }); 180 forEach(options, function (value, prop) { 181 extended[prop] = options[prop]; 182 }); 183 return extended; 184 }; 185 186 187 /** 188 * Create a fragment DOM elements 189 * @private 190 */ 191 var createFragElem = function(htmlStr) { 192 var frag = document.createDocumentFragment(), 193 temp = document.createElement('div'); 194 temp.innerHTML = htmlStr; 195 while (temp.firstChild) { 196 frag.appendChild(temp.firstChild); 197 } 198 return frag; 199 }; 200 201 202 /** 203 * Generate new ID 204 * @private 205 */ 206 var generateId = function(params) { 207 var newId = btoa(encodeURIComponent(params)); 208 return newId.replace(/=/g, ""); 209 }; 210 211 212 /** 213 * Check if is a color 214 * @private 215 */ 216 var isColor = function(color){ 217 if( color.substring(0,1) == '#' || color.substring(0,3) == 'rgb' || color.substring(0,3) == 'hsl' ){ 218 return true; 219 } else { 220 return false; 221 } 222 }; 223 224 225 /** 226 * Check if is a Base64 string 227 * @private 228 */ 229 var isBase64 = function(str) { 230 try { 231 return btoa(atob(str)) == str; 232 } catch (err) { 233 return false; 234 } 235 }; 236 237 238 /** 239 * Drag method of toasts 240 * @private 241 */ 242 var drag = function() { 243 244 return { 245 move: function(toast, instance, settings, xpos) { 246 247 var opacity, 248 opacityRange = 0.3, 249 distance = 180; 250 251 if(xpos !== 0){ 252 253 toast.classList.add(PLUGIN_NAME+'-dragged'); 254 255 toast.style.transform = 'translateX('+xpos + 'px)'; 256 257 if(xpos > 0){ 258 opacity = (distance-xpos) / distance; 259 if(opacity < opacityRange){ 260 instance.hide(extend(settings, { transitionOut: 'fadeOutRight', transitionOutMobile: 'fadeOutRight' }), toast, 'drag'); 261 } 262 } else { 263 opacity = (distance+xpos) / distance; 264 if(opacity < opacityRange){ 265 instance.hide(extend(settings, { transitionOut: 'fadeOutLeft', transitionOutMobile: 'fadeOutLeft' }), toast, 'drag'); 266 } 267 } 268 toast.style.opacity = opacity; 269 270 if(opacity < opacityRange){ 271 272 if(ISCHROME || ISFIREFOX) 273 toast.style.left = xpos+'px'; 274 275 toast.parentNode.style.opacity = opacityRange; 276 277 this.stopMoving(toast, null); 278 } 279 } 280 281 282 }, 283 startMoving: function(toast, instance, settings, e) { 284 285 e = e || window.event; 286 var posX = ((ACCEPTSTOUCH) ? e.touches[0].clientX : e.clientX), 287 toastLeft = toast.style.transform.replace('px)', ''); 288 toastLeft = toastLeft.replace('translateX(', ''); 289 var offsetX = posX - toastLeft; 290 291 if(settings.transitionIn){ 292 toast.classList.remove(settings.transitionIn); 293 } 294 if(settings.transitionInMobile){ 295 toast.classList.remove(settings.transitionInMobile); 296 } 297 toast.style.transition = ''; 298 299 if(ACCEPTSTOUCH) { 300 document.ontouchmove = function(e) { 301 e.preventDefault(); 302 e = e || window.event; 303 var posX = e.touches[0].clientX, 304 finalX = posX - offsetX; 305 drag.move(toast, instance, settings, finalX); 306 }; 307 } else { 308 document.onmousemove = function(e) { 309 e.preventDefault(); 310 e = e || window.event; 311 var posX = e.clientX, 312 finalX = posX - offsetX; 313 drag.move(toast, instance, settings, finalX); 314 }; 315 } 316 317 }, 318 stopMoving: function(toast, e) { 319 320 if(ACCEPTSTOUCH) { 321 document.ontouchmove = function() {}; 322 } else { 323 document.onmousemove = function() {}; 324 } 325 326 toast.style.opacity = ''; 327 toast.style.transform = ''; 328 329 if(toast.classList.contains(PLUGIN_NAME+'-dragged')){ 330 331 toast.classList.remove(PLUGIN_NAME+'-dragged'); 332 333 toast.style.transition = 'transform 0.4s ease, opacity 0.4s ease'; 334 setTimeout(function() { 335 toast.style.transition = ''; 336 }, 400); 337 } 338 339 } 340 }; 341 342 }(); 343 344 345 346 347 348 $iziToast.setSetting = function (ref, option, value) { 349 350 $iziToast.children[ref][option] = value; 351 352 }; 353 354 355 $iziToast.getSetting = function (ref, option) { 356 357 return $iziToast.children[ref][option]; 358 359 }; 360 361 362 /** 363 * Destroy the current initialization. 364 * @public 365 */ 366 $iziToast.destroy = function () { 367 368 forEach(document.querySelectorAll('.'+PLUGIN_NAME+'-overlay'), function(element, index) { 369 element.remove(); 370 }); 371 372 forEach(document.querySelectorAll('.'+PLUGIN_NAME+'-wrapper'), function(element, index) { 373 element.remove(); 374 }); 375 376 forEach(document.querySelectorAll('.'+PLUGIN_NAME), function(element, index) { 377 element.remove(); 378 }); 379 380 this.children = {}; 381 382 // Remove event listeners 383 document.removeEventListener(PLUGIN_NAME+'-opened', {}, false); 384 document.removeEventListener(PLUGIN_NAME+'-opening', {}, false); 385 document.removeEventListener(PLUGIN_NAME+'-closing', {}, false); 386 document.removeEventListener(PLUGIN_NAME+'-closed', {}, false); 387 document.removeEventListener('keyup', {}, false); 388 389 // Reset variables 390 CONFIG = {}; 391 }; 392 393 /** 394 * Initialize Plugin 395 * @public 396 * @param {Object} options User settings 397 */ 398 $iziToast.settings = function (options) { 399 400 // Destroy any existing initializations 401 $iziToast.destroy(); 402 403 CONFIG = options; 404 defaults = extend(defaults, options || {}); 405 }; 406 407 408 /** 409 * Building themes functions. 410 * @public 411 * @param {Object} options User settings 412 */ 413 forEach(THEMES, function (theme, name) { 414 415 $iziToast[name] = function (options) { 416 417 var settings = extend(CONFIG, options || {}); 418 settings = extend(theme, settings || {}); 419 420 this.show(settings); 421 }; 422 423 }); 424 425 426 /** 427 * Do the calculation to move the progress bar 428 * @private 429 */ 430 $iziToast.progress = function (options, $toast, callback) { 431 432 433 var that = this, 434 ref = $toast.getAttribute('data-iziToast-ref'), 435 settings = extend(this.children[ref], options || {}), 436 $elem = $toast.querySelector('.'+PLUGIN_NAME+'-progressbar div'); 437 438 return { 439 start: function() { 440 441 if(typeof settings.time.REMAINING == 'undefined'){ 442 443 $toast.classList.remove(PLUGIN_NAME+'-reseted'); 444 445 if($elem !== null){ 446 $elem.style.transition = 'width '+ settings.timeout +'ms '+settings.progressBarEasing; 447 $elem.style.width = '0%'; 448 } 449 450 settings.time.START = new Date().getTime(); 451 settings.time.END = settings.time.START + settings.timeout; 452 settings.time.TIMER = setTimeout(function() { 453 454 clearTimeout(settings.time.TIMER); 455 456 if(!$toast.classList.contains(PLUGIN_NAME+'-closing')){ 457 458 that.hide(settings, $toast, 'timeout'); 459 460 if(typeof callback === 'function'){ 461 callback.apply(that); 462 } 463 } 464 465 }, settings.timeout); 466 that.setSetting(ref, 'time', settings.time); 467 } 468 }, 469 pause: function() { 470 471 if(typeof settings.time.START !== 'undefined' && !$toast.classList.contains(PLUGIN_NAME+'-paused') && !$toast.classList.contains(PLUGIN_NAME+'-reseted')){ 472 473 $toast.classList.add(PLUGIN_NAME+'-paused'); 474 475 settings.time.REMAINING = settings.time.END - new Date().getTime(); 476 477 clearTimeout(settings.time.TIMER); 478 479 that.setSetting(ref, 'time', settings.time); 480 481 if($elem !== null){ 482 var computedStyle = window.getComputedStyle($elem), 483 propertyWidth = computedStyle.getPropertyValue('width'); 484 485 $elem.style.transition = 'none'; 486 $elem.style.width = propertyWidth; 487 } 488 489 if(typeof callback === 'function'){ 490 setTimeout(function() { 491 callback.apply(that); 492 }, 10); 493 } 494 } 495 }, 496 resume: function() { 497 498 if(typeof settings.time.REMAINING !== 'undefined'){ 499 500 $toast.classList.remove(PLUGIN_NAME+'-paused'); 501 502 if($elem !== null){ 503 $elem.style.transition = 'width '+ settings.time.REMAINING +'ms '+settings.progressBarEasing; 504 $elem.style.width = '0%'; 505 } 506 507 settings.time.END = new Date().getTime() + settings.time.REMAINING; 508 settings.time.TIMER = setTimeout(function() { 509 510 clearTimeout(settings.time.TIMER); 511 512 if(!$toast.classList.contains(PLUGIN_NAME+'-closing')){ 513 514 that.hide(settings, $toast, 'timeout'); 515 516 if(typeof callback === 'function'){ 517 callback.apply(that); 518 } 519 } 520 521 522 }, settings.time.REMAINING); 523 524 that.setSetting(ref, 'time', settings.time); 525 } else { 526 this.start(); 527 } 528 }, 529 reset: function(){ 530 531 clearTimeout(settings.time.TIMER); 532 533 delete settings.time.REMAINING; 534 535 that.setSetting(ref, 'time', settings.time); 536 537 $toast.classList.add(PLUGIN_NAME+'-reseted'); 538 539 $toast.classList.remove(PLUGIN_NAME+'-paused'); 540 541 if($elem !== null){ 542 $elem.style.transition = 'none'; 543 $elem.style.width = '100%'; 544 } 545 546 if(typeof callback === 'function'){ 547 setTimeout(function() { 548 callback.apply(that); 549 }, 10); 550 } 551 } 552 }; 553 554 }; 555 556 557 /** 558 * Close the specific Toast 559 * @public 560 * @param {Object} options User settings 561 */ 562 $iziToast.hide = function (options, $toast, closedBy) { 563 564 if(typeof $toast != 'object'){ 565 $toast = document.querySelector($toast); 566 } 567 568 var that = this, 569 settings = extend(this.children[$toast.getAttribute('data-iziToast-ref')], options || {}); 570 settings.closedBy = closedBy || null; 571 572 delete settings.time.REMAINING; 573 574 $toast.classList.add(PLUGIN_NAME+'-closing'); 575 576 // Overlay 577 (function(){ 578 579 var $overlay = document.querySelector('.'+PLUGIN_NAME+'-overlay'); 580 if($overlay !== null){ 581 var refs = $overlay.getAttribute('data-iziToast-ref'); 582 refs = refs.split(','); 583 var index = refs.indexOf(String(settings.ref)); 584 585 if(index !== -1){ 586 refs.splice(index, 1); 587 } 588 $overlay.setAttribute('data-iziToast-ref', refs.join()); 589 590 if(refs.length === 0){ 591 $overlay.classList.remove('fadeIn'); 592 $overlay.classList.add('fadeOut'); 593 setTimeout(function() { 594 $overlay.remove(); 595 }, 700); 596 } 597 } 598 599 })(); 600 601 if(settings.transitionIn){ 602 $toast.classList.remove(settings.transitionIn); 603 } 604 605 if(settings.transitionInMobile){ 606 $toast.classList.remove(settings.transitionInMobile); 607 } 608 609 if(ISMOBILE || window.innerWidth <= MOBILEWIDTH){ 610 if(settings.transitionOutMobile) 611 $toast.classList.add(settings.transitionOutMobile); 612 } else { 613 if(settings.transitionOut) 614 $toast.classList.add(settings.transitionOut); 615 } 616 var H = $toast.parentNode.offsetHeight; 617 $toast.parentNode.style.height = H+'px'; 618 $toast.style.pointerEvents = 'none'; 619 620 if(!ISMOBILE || window.innerWidth > MOBILEWIDTH){ 621 $toast.parentNode.style.transitionDelay = '0.2s'; 622 } 623 624 try { 625 var event = new CustomEvent(PLUGIN_NAME+'-closing', {detail: settings, bubbles: true, cancelable: true}); 626 document.dispatchEvent(event); 627 } catch(ex){ 628 console.warn(ex); 629 } 630 631 setTimeout(function() { 632 633 $toast.parentNode.style.height = '0px'; 634 $toast.parentNode.style.overflow = ''; 635 636 setTimeout(function(){ 637 638 delete that.children[settings.ref]; 639 640 $toast.parentNode.remove(); 641 642 try { 643 var event = new CustomEvent(PLUGIN_NAME+'-closed', {detail: settings, bubbles: true, cancelable: true}); 644 document.dispatchEvent(event); 645 } catch(ex){ 646 console.warn(ex); 647 } 648 649 if(typeof settings.onClosed !== 'undefined'){ 650 settings.onClosed.apply(null, [settings, $toast, closedBy]); 651 } 652 653 }, 1000); 654 }, 200); 655 656 657 if(typeof settings.onClosing !== 'undefined'){ 658 settings.onClosing.apply(null, [settings, $toast, closedBy]); 659 } 660 }; 661 662 /** 663 * Create and show the Toast 664 * @public 665 * @param {Object} options User settings 666 */ 667 $iziToast.show = function (options) { 668 669 var that = this; 670 671 // Merge user options with defaults 672 var settings = extend(CONFIG, options || {}); 673 settings = extend(defaults, settings); 674 settings.time = {}; 675 676 if(settings.id === null){ 677 settings.id = generateId(settings.title+settings.message+settings.color); 678 } 679 680 if(settings.displayMode === 1 || settings.displayMode == 'once'){ 681 try { 682 if(document.querySelectorAll('.'+PLUGIN_NAME+'#'+settings.id).length > 0){ 683 return false; 684 } 685 } catch (exc) { 686 console.warn('['+PLUGIN_NAME+'] Could not find an element with this selector: '+'#'+settings.id+'. Try to set an valid id.'); 687 } 688 } 689 690 if(settings.displayMode === 2 || settings.displayMode == 'replace'){ 691 try { 692 forEach(document.querySelectorAll('.'+PLUGIN_NAME+'#'+settings.id), function(element, index) { 693 that.hide(settings, element, 'replaced'); 694 }); 695 } catch (exc) { 696 console.warn('['+PLUGIN_NAME+'] Could not find an element with this selector: '+'#'+settings.id+'. Try to set an valid id.'); 697 } 698 } 699 700 settings.ref = new Date().getTime() + Math.floor((Math.random() * 10000000) + 1); 701 702 $iziToast.children[settings.ref] = settings; 703 704 var $DOM = { 705 body: document.querySelector('body'), 706 overlay: document.createElement('div'), 707 toast: document.createElement('div'), 708 toastBody: document.createElement('div'), 709 toastTexts: document.createElement('div'), 710 toastCapsule: document.createElement('div'), 711 cover: document.createElement('div'), 712 buttons: document.createElement('div'), 713 inputs: document.createElement('div'), 714 icon: !settings.iconUrl ? document.createElement('i') : document.createElement('img'), 715 wrapper: null 716 }; 717 718 $DOM.toast.setAttribute('data-iziToast-ref', settings.ref); 719 $DOM.toast.appendChild($DOM.toastBody); 720 $DOM.toastCapsule.appendChild($DOM.toast); 721 722 // CSS Settings 723 (function(){ 724 725 $DOM.toast.classList.add(PLUGIN_NAME); 726 $DOM.toast.classList.add(PLUGIN_NAME+'-opening'); 727 $DOM.toastCapsule.classList.add(PLUGIN_NAME+'-capsule'); 728 $DOM.toastBody.classList.add(PLUGIN_NAME + '-body'); 729 $DOM.toastTexts.classList.add(PLUGIN_NAME + '-texts'); 730 731 if(ISMOBILE || window.innerWidth <= MOBILEWIDTH){ 732 if(settings.transitionInMobile) 733 $DOM.toast.classList.add(settings.transitionInMobile); 734 } else { 735 if(settings.transitionIn) 736 $DOM.toast.classList.add(settings.transitionIn); 737 } 738 739 if(settings.class){ 740 var classes = settings.class.split(' '); 741 forEach(classes, function (value, index) { 742 $DOM.toast.classList.add(value); 743 }); 744 } 745 746 if(settings.id){ $DOM.toast.id = settings.id; } 747 748 if(settings.rtl){ 749 $DOM.toast.classList.add(PLUGIN_NAME + '-rtl'); 750 $DOM.toast.setAttribute('dir', 'rtl'); 751 } 752 753 if(settings.layout > 1){ $DOM.toast.classList.add(PLUGIN_NAME+'-layout'+settings.layout); } 754 755 if(settings.balloon){ $DOM.toast.classList.add(PLUGIN_NAME+'-balloon'); } 756 757 if(settings.maxWidth){ 758 if( !isNaN(settings.maxWidth) ){ 759 $DOM.toast.style.maxWidth = settings.maxWidth+'px'; 760 } else { 761 $DOM.toast.style.maxWidth = settings.maxWidth; 762 } 763 } 764 765 if(settings.theme !== '' || settings.theme !== 'light') { 766 767 $DOM.toast.classList.add(PLUGIN_NAME+'-theme-'+settings.theme); 768 } 769 770 if(settings.color) { //#, rgb, rgba, hsl 771 772 if( isColor(settings.color) ){ 773 $DOM.toast.style.background = settings.color; 774 } else { 775 $DOM.toast.classList.add(PLUGIN_NAME+'-color-'+settings.color); 776 } 777 } 778 779 if(settings.backgroundColor) { 780 $DOM.toast.style.background = settings.backgroundColor; 781 if(settings.balloon){ 782 $DOM.toast.style.borderColor = settings.backgroundColor; 783 } 784 } 785 })(); 786 787 // Cover image 788 (function(){ 789 if(settings.image) { 790 $DOM.cover.classList.add(PLUGIN_NAME + '-cover'); 791 $DOM.cover.style.width = settings.imageWidth + 'px'; 792 793 if(isBase64(settings.image.replace(/ /g,''))){ 794 $DOM.cover.style.backgroundImage = 'url(data:image/png;base64,' + settings.image.replace(/ /g,'') + ')'; 795 } else { 796 $DOM.cover.style.backgroundImage = 'url(' + settings.image + ')'; 797 } 798 799 if(settings.rtl){ 800 $DOM.toastBody.style.marginRight = (settings.imageWidth + 10) + 'px'; 801 } else { 802 $DOM.toastBody.style.marginLeft = (settings.imageWidth + 10) + 'px'; 803 } 804 $DOM.toast.appendChild($DOM.cover); 805 } 806 })(); 807 808 // Button close 809 (function(){ 810 if(settings.close){ 811 812 $DOM.buttonClose = document.createElement('button'); 813 $DOM.buttonClose.type = 'button'; 814 $DOM.buttonClose.classList.add(PLUGIN_NAME + '-close'); 815 $DOM.buttonClose.addEventListener('click', function (e) { 816 var button = e.target; 817 that.hide(settings, $DOM.toast, 'button'); 818 }); 819 $DOM.toast.appendChild($DOM.buttonClose); 820 } else { 821 if(settings.rtl){ 822 $DOM.toast.style.paddingLeft = '18px'; 823 } else { 824 $DOM.toast.style.paddingRight = '18px'; 825 } 826 } 827 })(); 828 829 // Progress Bar & Timeout 830 (function(){ 831 832 if(settings.progressBar){ 833 $DOM.progressBar = document.createElement('div'); 834 $DOM.progressBarDiv = document.createElement('div'); 835 $DOM.progressBar.classList.add(PLUGIN_NAME + '-progressbar'); 836 $DOM.progressBarDiv.style.background = settings.progressBarColor; 837 $DOM.progressBar.appendChild($DOM.progressBarDiv); 838 $DOM.toast.appendChild($DOM.progressBar); 839 } 840 841 if(settings.timeout) { 842 843 if(settings.pauseOnHover && !settings.resetOnHover){ 844 845 $DOM.toast.addEventListener('mouseenter', function (e) { 846 that.progress(settings, $DOM.toast).pause(); 847 }); 848 $DOM.toast.addEventListener('mouseleave', function (e) { 849 that.progress(settings, $DOM.toast).resume(); 850 }); 851 } 852 853 if(settings.resetOnHover){ 854 855 $DOM.toast.addEventListener('mouseenter', function (e) { 856 that.progress(settings, $DOM.toast).reset(); 857 }); 858 $DOM.toast.addEventListener('mouseleave', function (e) { 859 that.progress(settings, $DOM.toast).start(); 860 }); 861 } 862 } 863 })(); 864 865 // Icon 866 (function(){ 867 868 if(settings.iconUrl) { 869 870 $DOM.icon.setAttribute('class', PLUGIN_NAME + '-icon'); 871 $DOM.icon.setAttribute('src', settings.iconUrl); 872 873 } else if(settings.icon) { 874 $DOM.icon.setAttribute('class', PLUGIN_NAME + '-icon ' + settings.icon); 875 876 if(settings.iconText){ 877 $DOM.icon.appendChild(document.createTextNode(settings.iconText)); 878 } 879 880 if(settings.iconColor){ 881 $DOM.icon.style.color = settings.iconColor; 882 } 883 } 884 885 if(settings.icon || settings.iconUrl) { 886 887 if(settings.rtl){ 888 $DOM.toastBody.style.paddingRight = '33px'; 889 } else { 890 $DOM.toastBody.style.paddingLeft = '33px'; 891 } 892 893 $DOM.toastBody.appendChild($DOM.icon); 894 } 895 896 })(); 897 898 // Title & Message 899 (function(){ 900 if(settings.title.length > 0) { 901 902 $DOM.strong = document.createElement('strong'); 903 $DOM.strong.classList.add(PLUGIN_NAME + '-title'); 904 $DOM.strong.appendChild(createFragElem(settings.title)); 905 $DOM.toastTexts.appendChild($DOM.strong); 906 907 if(settings.titleColor) { 908 $DOM.strong.style.color = settings.titleColor; 909 } 910 if(settings.titleSize) { 911 if( !isNaN(settings.titleSize) ){ 912 $DOM.strong.style.fontSize = settings.titleSize+'px'; 913 } else { 914 $DOM.strong.style.fontSize = settings.titleSize; 915 } 916 } 917 if(settings.titleLineHeight) { 918 if( !isNaN(settings.titleSize) ){ 919 $DOM.strong.style.lineHeight = settings.titleLineHeight+'px'; 920 } else { 921 $DOM.strong.style.lineHeight = settings.titleLineHeight; 922 } 923 } 924 } 925 926 if(settings.message.length > 0) { 927 928 $DOM.p = document.createElement('p'); 929 $DOM.p.classList.add(PLUGIN_NAME + '-message'); 930 $DOM.p.appendChild(createFragElem(settings.message)); 931 $DOM.toastTexts.appendChild($DOM.p); 932 933 if(settings.messageColor) { 934 $DOM.p.style.color = settings.messageColor; 935 } 936 if(settings.messageSize) { 937 if( !isNaN(settings.titleSize) ){ 938 $DOM.p.style.fontSize = settings.messageSize+'px'; 939 } else { 940 $DOM.p.style.fontSize = settings.messageSize; 941 } 942 } 943 if(settings.messageLineHeight) { 944 945 if( !isNaN(settings.titleSize) ){ 946 $DOM.p.style.lineHeight = settings.messageLineHeight+'px'; 947 } else { 948 $DOM.p.style.lineHeight = settings.messageLineHeight; 949 } 950 } 951 } 952 953 if(settings.title.length > 0 && settings.message.length > 0) { 954 if(settings.rtl){ 955 $DOM.strong.style.marginLeft = '10px'; 956 } else if(settings.layout !== 2 && !settings.rtl) { 957 $DOM.strong.style.marginRight = '10px'; 958 } 959 } 960 })(); 961 962 $DOM.toastBody.appendChild($DOM.toastTexts); 963 964 // Inputs 965 var $inputs; 966 (function(){ 967 if(settings.inputs.length > 0) { 968 969 $DOM.inputs.classList.add(PLUGIN_NAME + '-inputs'); 970 971 forEach(settings.inputs, function (value, index) { 972 $DOM.inputs.appendChild(createFragElem(value[0])); 973 974 $inputs = $DOM.inputs.childNodes; 975 976 $inputs[index].classList.add(PLUGIN_NAME + '-inputs-child'); 977 978 if(value[3]){ 979 setTimeout(function() { 980 $inputs[index].focus(); 981 }, 300); 982 } 983 984 $inputs[index].addEventListener(value[1], function (e) { 985 var ts = value[2]; 986 return ts(that, $DOM.toast, this, e); 987 }); 988 }); 989 $DOM.toastBody.appendChild($DOM.inputs); 990 } 991 })(); 992 993 // Buttons 994 (function(){ 995 if(settings.buttons.length > 0) { 996 997 $DOM.buttons.classList.add(PLUGIN_NAME + '-buttons'); 998 999 forEach(settings.buttons, function (value, index) { 1000 $DOM.buttons.appendChild(createFragElem(value[0])); 1001 1002 var $btns = $DOM.buttons.childNodes; 1003 1004 $btns[index].classList.add(PLUGIN_NAME + '-buttons-child'); 1005 1006 if(value[2]){ 1007 setTimeout(function() { 1008 $btns[index].focus(); 1009 }, 300); 1010 } 1011 1012 $btns[index].addEventListener('click', function (e) { 1013 e.preventDefault(); 1014 var ts = value[1]; 1015 return ts(that, $DOM.toast, this, e, $inputs); 1016 }); 1017 }); 1018 } 1019 $DOM.toastBody.appendChild($DOM.buttons); 1020 })(); 1021 1022 if(settings.message.length > 0 && (settings.inputs.length > 0 || settings.buttons.length > 0)) { 1023 $DOM.p.style.marginBottom = '0'; 1024 } 1025 1026 if(settings.inputs.length > 0 || settings.buttons.length > 0){ 1027 if(settings.rtl){ 1028 $DOM.toastTexts.style.marginLeft = '10px'; 1029 } else { 1030 $DOM.toastTexts.style.marginRight = '10px'; 1031 } 1032 if(settings.inputs.length > 0 && settings.buttons.length > 0){ 1033 if(settings.rtl){ 1034 $DOM.inputs.style.marginLeft = '8px'; 1035 } else { 1036 $DOM.inputs.style.marginRight = '8px'; 1037 } 1038 } 1039 } 1040 1041 // Wrap 1042 (function(){ 1043 $DOM.toastCapsule.style.visibility = 'hidden'; 1044 setTimeout(function() { 1045 var H = $DOM.toast.offsetHeight; 1046 var style = $DOM.toast.currentStyle || window.getComputedStyle($DOM.toast); 1047 var marginTop = style.marginTop; 1048 marginTop = marginTop.split('px'); 1049 marginTop = parseInt(marginTop[0]); 1050 var marginBottom = style.marginBottom; 1051 marginBottom = marginBottom.split('px'); 1052 marginBottom = parseInt(marginBottom[0]); 1053 1054 $DOM.toastCapsule.style.visibility = ''; 1055 $DOM.toastCapsule.style.height = (H+marginBottom+marginTop)+'px'; 1056 1057 setTimeout(function() { 1058 $DOM.toastCapsule.style.height = 'auto'; 1059 if(settings.target){ 1060 $DOM.toastCapsule.style.overflow = 'visible'; 1061 } 1062 }, 500); 1063 1064 if(settings.timeout) { 1065 that.progress(settings, $DOM.toast).start(); 1066 } 1067 }, 100); 1068 })(); 1069 1070 // Target 1071 (function(){ 1072 var position = settings.position; 1073 1074 if(settings.target){ 1075 1076 $DOM.wrapper = document.querySelector(settings.target); 1077 $DOM.wrapper.classList.add(PLUGIN_NAME + '-target'); 1078 1079 if(settings.targetFirst) { 1080 $DOM.wrapper.insertBefore($DOM.toastCapsule, $DOM.wrapper.firstChild); 1081 } else { 1082 $DOM.wrapper.appendChild($DOM.toastCapsule); 1083 } 1084 1085 } else { 1086 1087 if( POSITIONS.indexOf(settings.position) == -1 ){ 1088 console.warn('['+PLUGIN_NAME+'] Incorrect position.\nIt can be ⺠' + POSITIONS); 1089 return; 1090 } 1091 1092 if(ISMOBILE || window.innerWidth <= MOBILEWIDTH){ 1093 if(settings.position == 'bottomLeft' || settings.position == 'bottomRight' || settings.position == 'bottomCenter'){ 1094 position = PLUGIN_NAME+'-wrapper-bottomCenter'; 1095 } 1096 else if(settings.position == 'topLeft' || settings.position == 'topRight' || settings.position == 'topCenter'){ 1097 position = PLUGIN_NAME+'-wrapper-topCenter'; 1098 } 1099 else { 1100 position = PLUGIN_NAME+'-wrapper-center'; 1101 } 1102 } else { 1103 position = PLUGIN_NAME+'-wrapper-'+position; 1104 } 1105 $DOM.wrapper = document.querySelector('.' + PLUGIN_NAME + '-wrapper.'+position); 1106 1107 if(!$DOM.wrapper) { 1108 $DOM.wrapper = document.createElement('div'); 1109 $DOM.wrapper.classList.add(PLUGIN_NAME + '-wrapper'); 1110 $DOM.wrapper.classList.add(position); 1111 document.body.appendChild($DOM.wrapper); 1112 } 1113 if(settings.position == 'topLeft' || settings.position == 'topCenter' || settings.position == 'topRight'){ 1114 $DOM.wrapper.insertBefore($DOM.toastCapsule, $DOM.wrapper.firstChild); 1115 } else { 1116 $DOM.wrapper.appendChild($DOM.toastCapsule); 1117 } 1118 } 1119 1120 if(!isNaN(settings.zindex)) { 1121 $DOM.wrapper.style.zIndex = settings.zindex; 1122 } else { 1123 console.warn('['+PLUGIN_NAME+'] Invalid zIndex.'); 1124 } 1125 })(); 1126 1127 // Overlay 1128 (function(){ 1129 1130 if(settings.overlay) { 1131 1132 if( document.querySelector('.'+PLUGIN_NAME+'-overlay.fadeIn') !== null ){ 1133 1134 $DOM.overlay = document.querySelector('.'+PLUGIN_NAME+'-overlay'); 1135 $DOM.overlay.setAttribute('data-iziToast-ref', $DOM.overlay.getAttribute('data-iziToast-ref') + ',' + settings.ref); 1136 1137 if(!isNaN(settings.zindex) && settings.zindex !== null) { 1138 $DOM.overlay.style.zIndex = settings.zindex-1; 1139 } 1140 1141 } else { 1142 1143 $DOM.overlay.classList.add(PLUGIN_NAME+'-overlay'); 1144 $DOM.overlay.classList.add('fadeIn'); 1145 $DOM.overlay.style.background = settings.overlayColor; 1146 $DOM.overlay.setAttribute('data-iziToast-ref', settings.ref); 1147 if(!isNaN(settings.zindex) && settings.zindex !== null) { 1148 $DOM.overlay.style.zIndex = settings.zindex-1; 1149 } 1150 document.querySelector('body').appendChild($DOM.overlay); 1151 } 1152 1153 if(settings.overlayClose) { 1154 1155 $DOM.overlay.removeEventListener('click', {}); 1156 $DOM.overlay.addEventListener('click', function (e) { 1157 that.hide(settings, $DOM.toast, 'overlay'); 1158 }); 1159 } else { 1160 $DOM.overlay.removeEventListener('click', {}); 1161 } 1162 } 1163 })(); 1164 1165 // Inside animations 1166 (function(){ 1167 if(settings.animateInside){ 1168 $DOM.toast.classList.add(PLUGIN_NAME+'-animateInside'); 1169 1170 var animationTimes = [200, 100, 300]; 1171 if(settings.transitionIn == 'bounceInLeft' || settings.transitionIn == 'bounceInRight'){ 1172 animationTimes = [400, 200, 400]; 1173 } 1174 1175 if(settings.title.length > 0) { 1176 setTimeout(function(){ 1177 $DOM.strong.classList.add('slideIn'); 1178 }, animationTimes[0]); 1179 } 1180 1181 if(settings.message.length > 0) { 1182 setTimeout(function(){ 1183 $DOM.p.classList.add('slideIn'); 1184 }, animationTimes[1]); 1185 } 1186 1187 if(settings.icon || settings.iconUrl) { 1188 setTimeout(function(){ 1189 $DOM.icon.classList.add('revealIn'); 1190 }, animationTimes[2]); 1191 } 1192 1193 var counter = 150; 1194 if(settings.buttons.length > 0 && $DOM.buttons) { 1195 1196 setTimeout(function(){ 1197 1198 forEach($DOM.buttons.childNodes, function(element, index) { 1199 1200 setTimeout(function(){ 1201 element.classList.add('revealIn'); 1202 }, counter); 1203 counter = counter + 150; 1204 }); 1205 1206 }, settings.inputs.length > 0 ? 150 : 0); 1207 } 1208 1209 if(settings.inputs.length > 0 && $DOM.inputs) { 1210 counter = 150; 1211 forEach($DOM.inputs.childNodes, function(element, index) { 1212 1213 setTimeout(function(){ 1214 element.classList.add('revealIn'); 1215 }, counter); 1216 counter = counter + 150; 1217 }); 1218 } 1219 } 1220 })(); 1221 1222 settings.onOpening.apply(null, [settings, $DOM.toast]); 1223 1224 try { 1225 var event = new CustomEvent(PLUGIN_NAME + '-opening', {detail: settings, bubbles: true, cancelable: true}); 1226 document.dispatchEvent(event); 1227 } catch(ex){ 1228 console.warn(ex); 1229 } 1230 1231 setTimeout(function() { 1232 1233 $DOM.toast.classList.remove(PLUGIN_NAME+'-opening'); 1234 $DOM.toast.classList.add(PLUGIN_NAME+'-opened'); 1235 1236 try { 1237 var event = new CustomEvent(PLUGIN_NAME + '-opened', {detail: settings, bubbles: true, cancelable: true}); 1238 document.dispatchEvent(event); 1239 } catch(ex){ 1240 console.warn(ex); 1241 } 1242 1243 settings.onOpened.apply(null, [settings, $DOM.toast]); 1244 }, 1000); 1245 1246 if(settings.drag){ 1247 1248 if(ACCEPTSTOUCH) { 1249 1250 $DOM.toast.addEventListener('touchstart', function(e) { 1251 drag.startMoving(this, that, settings, e); 1252 }, false); 1253 1254 $DOM.toast.addEventListener('touchend', function(e) { 1255 drag.stopMoving(this, e); 1256 }, false); 1257 } else { 1258 1259 $DOM.toast.addEventListener('mousedown', function(e) { 1260 e.preventDefault(); 1261 drag.startMoving(this, that, settings, e); 1262 }, false); 1263 1264 $DOM.toast.addEventListener('mouseup', function(e) { 1265 e.preventDefault(); 1266 drag.stopMoving(this, e); 1267 }, false); 1268 } 1269 } 1270 1271 if(settings.closeOnEscape) { 1272 1273 document.addEventListener('keyup', function (evt) { 1274 evt = evt || window.event; 1275 if(evt.keyCode == 27) { 1276 that.hide(settings, $DOM.toast, 'esc'); 1277 } 1278 }); 1279 } 1280 1281 if(settings.closeOnClick) { 1282 $DOM.toast.addEventListener('click', function (evt) { 1283 that.hide(settings, $DOM.toast, 'toast'); 1284 }); 1285 } 1286 1287 that.toast = $DOM.toast; 1288 }; 1289 1290 1291 return $iziToast; 1292});
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.