From 28de63d628598bcf78c02820c9725f511916117d Mon Sep 17 00:00:00 2001 From: Stunedgithub <136639208+Stunedgithub@users.noreply.github.com> Date: Sun, 2 Jul 2023 10:54:59 +0200 Subject: [PATCH] Add files via upload --- 9105e9014d.js | 2 + allah.js | 20 + app.js | 112 ++++ creativa-popup.js | 329 ++++++++++ main.js | 54 ++ particles.js | 1562 +++++++++++++++++++++++++++++++++++++++++++++ popup.js | 158 +++++ title.js | 25 + typed.js | 1150 +++++++++++++++++++++++++++++++++ 9 files changed, 3412 insertions(+) create mode 100644 9105e9014d.js create mode 100644 allah.js create mode 100644 app.js create mode 100644 creativa-popup.js create mode 100644 main.js create mode 100644 particles.js create mode 100644 popup.js create mode 100644 title.js create mode 100644 typed.js diff --git a/9105e9014d.js b/9105e9014d.js new file mode 100644 index 0000000..6b7a80d --- /dev/null +++ b/9105e9014d.js @@ -0,0 +1,2 @@ +window.FontAwesomeKitConfig = {"asyncLoading":{"enabled":false},"autoA11y":{"enabled":true},"baseUrl":"https://ka-f.fontawesome.com","baseUrlKit":"https://kit.fontawesome.com","detectConflictsUntil":null,"iconUploads":{},"id":130816606,"license":"free","method":"css","minify":{"enabled":true},"token":"9105e9014d","v4FontFaceShim":{"enabled":true},"v4shim":{"enabled":true},"v5FontFaceShim":{"enabled":true},"version":"6.4.0"}; +!function(t){"function"==typeof define&&define.amd?define("kit-loader",t):t()}((function(){"use strict";function t(t,e){var n=Object.keys(t);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(t);e&&(r=r.filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable}))),n.push.apply(n,r)}return n}function e(e){for(var n=1;nt.length)&&(e=t.length);for(var n=0,r=new Array(e);n-1}(t)&&("URLSearchParams"in window?(i=new URL(t)).searchParams.set("token",o):i=i+"?token="+encodeURIComponent(o)),i=i.toString(),new E((function(t,e){if("function"==typeof n)n(i,{mode:"cors",cache:"default"}).then((function(t){if(t.ok)return t.text();throw new Error("")})).then((function(e){t(e)})).catch(e);else if("function"==typeof r){var o=new r;o.addEventListener("loadend",(function(){this.responseText?t(this.responseText):e(new Error(""))}));["abort","error","timeout"].map((function(t){o.addEventListener(t,(function(){e(new Error(""))}))})),o.open("GET",i),o.send()}else{e(new Error(""))}}))}function _(t,e,n){var r=t;return[[/(url\("?)\.\.\/\.\.\/\.\./g,function(t,n){return"".concat(n).concat(e)}],[/(url\("?)\.\.\/webfonts/g,function(t,r){return"".concat(r).concat(e,"/releases/v").concat(n,"/webfonts")}],[/(url\("?)https:\/\/kit-free([^.])*\.fontawesome\.com/g,function(t,n){return"".concat(n).concat(e)}]].forEach((function(t){var e=o(t,2),n=e[0],i=e[1];r=r.replace(n,i)})),r}function F(t,n){var r=arguments.length>2&&void 0!==arguments[2]?arguments[2]:function(){},o=n.document||o,i=a.bind(a,o,["fa","fab","fas","far","fal","fad","fak"]);t.autoA11y.enabled&&r(i);var u=t.subsetPath&&t.baseUrl+"/"+t.subsetPath,f=[{id:"fa-main",addOn:void 0,url:u}];if(t.v4shim&&t.v4shim.enabled&&f.push({id:"fa-v4-shims",addOn:"-v4-shims"}),t.v5FontFaceShim&&t.v5FontFaceShim.enabled&&f.push({id:"fa-v5-font-face",addOn:"-v5-font-face"}),t.v4FontFaceShim&&t.v4FontFaceShim.enabled&&f.push({id:"fa-v4-font-face",addOn:"-v4-font-face"}),!u&&t.customIconsCssPath){var s=t.customIconsCssPath.indexOf("kit-upload.css")>-1?t.baseUrlKit:t.baseUrl,l=s+"/"+t.customIconsCssPath;f.push({id:"fa-kit-upload",url:l})}var d=f.map((function(r){return new E((function(o,i){var a=r.url||c(t,{addOn:r.addOn,minify:t.minify.enabled}),u={id:r.id},f=t.subset?u:e(e(e({},n),u),{},{baseUrl:t.baseUrl,version:t.version,id:r.id,contentFilter:function(t,e){return _(t,e.baseUrl,e.version)}});P(a,n).then((function(t){o(C(t,f))})).catch(i)}))}));return E.all(d)}function C(t,e){var n=e.contentFilter||function(t,e){return t},r=document.createElement("style"),o=document.createTextNode(n(t,e));return r.appendChild(o),r.media="all",e.id&&r.setAttribute("id",e.id),e&&e.detectingConflicts&&e.detectionIgnoreAttr&&r.setAttributeNode(document.createAttribute(e.detectionIgnoreAttr)),r}function I(t,n){n.autoA11y=t.autoA11y.enabled,"pro"===t.license&&(n.autoFetchSvg=!0,n.fetchSvgFrom=t.baseUrl+"/releases/"+("latest"===t.version?"latest":"v".concat(t.version))+"/svgs",n.fetchUploadedSvgFrom=t.uploadsUrl);var r=[];return t.v4shim.enabled&&r.push(new E((function(r,o){P(c(t,{addOn:"-v4-shims",minify:t.minify.enabled}),n).then((function(t){r(U(t,e(e({},n),{},{id:"fa-v4-shims"})))})).catch(o)}))),r.push(new E((function(r,o){P(t.subsetPath&&t.baseUrl+"/"+t.subsetPath||c(t,{minify:t.minify.enabled}),n).then((function(t){var o=U(t,e(e({},n),{},{id:"fa-main"}));r(function(t,e){var n=e&&void 0!==e.autoFetchSvg?e.autoFetchSvg:void 0,r=e&&void 0!==e.autoA11y?e.autoA11y:void 0;void 0!==r&&t.setAttribute("data-auto-a11y",r?"true":"false");n&&(t.setAttributeNode(document.createAttribute("data-auto-fetch-svg")),t.setAttribute("data-fetch-svg-from",e.fetchSvgFrom),t.setAttribute("data-fetch-uploaded-svg-from",e.fetchUploadedSvgFrom));return t}(o,n))})).catch(o)}))),E.all(r)}function U(t,e){var n=document.createElement("SCRIPT"),r=document.createTextNode(t);return n.appendChild(r),n.referrerPolicy="strict-origin",e.id&&n.setAttribute("id",e.id),e&&e.detectingConflicts&&e.detectionIgnoreAttr&&n.setAttributeNode(document.createAttribute(e.detectionIgnoreAttr)),n}function T(t){var e,n=[],r=document,o=r.documentElement.doScroll,i=(o?/^loaded|^c/:/^loaded|^i|^c/).test(r.readyState);i||r.addEventListener("DOMContentLoaded",e=function(){for(r.removeEventListener("DOMContentLoaded",e),i=1;e=n.shift();)e()}),i?setTimeout(t,0):n.push(t)}function L(t){"undefined"!=typeof MutationObserver&&new MutationObserver(t).observe(document,{childList:!0,subtree:!0})}try{if(window.FontAwesomeKitConfig){var k=window.FontAwesomeKitConfig,x={detectingConflicts:k.detectConflictsUntil&&new Date<=new Date(k.detectConflictsUntil),detectionIgnoreAttr:"data-fa-detection-ignore",fetch:window.fetch,token:k.token,XMLHttpRequest:window.XMLHttpRequest,document:document},M=document.currentScript,N=M?M.parentElement:document.head;(function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};return"js"===t.method?I(t,e):"css"===t.method?F(t,e,(function(t){T(t),L(t)})):void 0})(k,x).then((function(t){t.map((function(t){try{N.insertBefore(t,M?M.nextSibling:null)}catch(e){N.appendChild(t)}})),x.detectingConflicts&&M&&T((function(){M.setAttributeNode(document.createAttribute(x.detectionIgnoreAttr));var t=function(t,e){var n=document.createElement("script");return e&&e.detectionIgnoreAttr&&n.setAttributeNode(document.createAttribute(e.detectionIgnoreAttr)),n.src=c(t,{baseFilename:"conflict-detection",fileSuffix:"js",subdir:"js",minify:t.minify.enabled}),n}(k,x);document.body.appendChild(t)}))})).catch((function(t){console.error("".concat("Font Awesome Kit:"," ").concat(t))}))}}catch(t){console.error("".concat("Font Awesome Kit:"," ").concat(t))}})); \ No newline at end of file diff --git a/allah.js b/allah.js new file mode 100644 index 0000000..6f5072e --- /dev/null +++ b/allah.js @@ -0,0 +1,20 @@ +//husky <3 +const closeBtn = document.getElementById('close'); +const modalMenu = document.getElementById('modal'); +const modalBtn = document.querySelector('.modal__button'); + +setTimeout(() => { + modalMenu.classList.add('show'); +}, 1); + +closeBtn.addEventListener('click', () => { + modalMenu.classList.remove('show') +}); +modalBtn.addEventListener('click', () => { + modalMenu.classList.remove('show') +}); +modalMenu.addEventListener('click', () => { + modalMenu.classList.remove('show'); +}); + +const countEl = document.getElementById('count'); \ No newline at end of file diff --git a/app.js b/app.js new file mode 100644 index 0000000..2fcee13 --- /dev/null +++ b/app.js @@ -0,0 +1,112 @@ +/* ---- particles.js config ---- */ + +particlesJS("particles-js", { + "particles": { + "number": { + "value": 100, + "density": { + "enable": true, + "value_area": 1000 + } + }, + "color": { + "value": "#ffffff" + }, + "shape": { + "type": "circle", + "stroke": { + "width": 0, + "color": "#000000" + }, + "polygon": { + "nb_sides": 5 + }, + "image": { + "src": "img/github.svg", + "width": 100, + "height": 100 + } + }, + "opacity": { + "value": .69, + "random": false, + "anim": { + "enable": false, + "speed": 1, + "opacity_min": 0.1, + "sync": false + } + }, + "size": { + "value": 2, + "random": true, + "anim": { + "enable": false, + "speed": 40, + "size_min": 0.1, + "sync": false + } + }, + "line_linked": { + "enable": true, + "distance": 100, + "color": "#ffffff", + "opacity": 0.4, + "width": 1 + }, + "move": { + "enable": true, + "speed": 2, + "direction": "none", + "random": false, + "straight": false, + "out_mode": "out", + "bounce": false, + "attract": { + "enable": false, + "rotateX": 600, + "rotateY": 1200 + } + } + }, + "interactivity": { + "detect_on": "canvas", + "events": { + "onhover": { + "enable": true, + "mode": "grab", + }, + "onclick": { + "enable": false, + "mode": "push" + }, + "resize": true + }, + "modes": { + "grab": { + "distance": 200, + "line_linked": { + "opacity": 1 + } + }, + "bubble": { + "distance": 400, + "size": 40, + "duration": 2, + "opacity": 8, + "speed": 3 + }, + "repulse": { + "distance": 200, + "duration": 0.4 + }, + "push": { + "particles_nb": 4 + }, + "remove": { + "particles_nb": 2 + } + } + }, + "retina_detect": true +}); \ No newline at end of file diff --git a/creativa-popup.js b/creativa-popup.js new file mode 100644 index 0000000..6eacec6 --- /dev/null +++ b/creativa-popup.js @@ -0,0 +1,329 @@ +class CreativaPopup { + + static version = '0.2'; + static cdn = 'https://creativajs.altervista.org/popup/0.2/'; + + static totalPopups = 0; + static animationSpeed = 150; + + static loadContent(popupId, url) { + let target = document.getElementById('ct-popup-other-content-' + popupId); + let request = new XMLHttpRequest(); + request.open('GET', url, true); + request.onload = function() { + if (request.status >= 200 && request.status < 400) { + let resp = request.responseText; + target.innerHTML = resp; + } + } + request.send(); + } + + static closeAll() { + for (let i = CreativaPopup.totalPopups; i > 0; i--) { + if (!document.getElementById('ct-popup-box-' + i)) { + console.warn(`The popup with ID (${i}) does not exist.`); + } else { + CreativaPopup.close(i); + } + } + } + + static close(popupId) { + let selectedPopupBg = document.getElementById('ct-popup-bg-' + popupId); + let selectedPopupBox = document.getElementById('ct-popup-box-' + popupId); + + // Check for blocked popup + let isSelectedPopupBlocked = false; + if (selectedPopupBg && (selectedPopupBg.getAttribute('isBlocked') == 'true')) { + isSelectedPopupBlocked = true; + } + + if (!isSelectedPopupBlocked) { + + if (!selectedPopupBg) { + console.warn('Creativa Popup: ID not found: ' + popupId); + return; + } + + selectedPopupBg.classList.add('fade-ct-popup-animation-close'); + setTimeout(function() { + selectedPopupBg.remove(); + }, CreativaPopup.animationSpeed); + + selectedPopupBox.classList.remove(selectedPopupBox.getAttribute('openAnimation') + '-ct-popup-animation-open'); + selectedPopupBox.classList.add(selectedPopupBox.getAttribute('closeAnimation') + '-ct-popup-animation-close'); + + setTimeout(function() { + const event = new CustomEvent('onPopupClose', { + detail: parseInt(CreativaPopup.totalPopups) + }); + document.dispatchEvent(event); + selectedPopupBox.remove(); + CreativaPopup.totalPopups--; + }, CreativaPopup.animationSpeed); + } + } + + static timerClose(popupId, timerTime) { + setTimeout(function() { + CreativaPopup.close(popupId); + }, timerTime * 1000); + } + + static create(text, title, icon, inputOptions) { + + // Instance and popup ID + CreativaPopup.totalPopups++; + let popupId = CreativaPopup.totalPopups; + + // Popup background creation + var divBackground = document.createElement('div'); + divBackground.className = 'ct-popup-background'; + divBackground.id = 'ct-popup-bg-' + popupId; + divBackground.onclick = function() { + CreativaPopup.timerClose(popupId, options); + }; + + // Popup box creation + var divBox = document.createElement('div'); + divBox.className = 'ct-popup-box'; + divBox.id = 'ct-popup-box-' + popupId; + divBox.innerHTML = ` + +
+ +

+

+
+
+
+
+
+
+
+ `; + + // Append popup to page + document.body.appendChild(divBackground); + document.body.appendChild(divBox); + + let options = { + image: '', + content: null, + isPage: false, + isBlocked: false, + width: null, + height: null, + openAnimation: 'card-bottom', + closeAnimation: 'card-top', + animationType: '', + animationSpeed: 500, + position: 'center', + bgColor: '#0a0a0a', + titleColor: '#404040', + textColor: '#606060', + borderRadius: '8px', + fontFamily: 'sans-serif', + boxShadow: '8px -8px 8px 0px rgb(0 0 0 / 22%)', + closeButton: true, + background: true, + box: true, + timer: false, + } + + // Popup components + let popupBg = document.getElementById('ct-popup-bg-' + popupId); + let popupBox = document.getElementById('ct-popup-box-' + popupId); + let popupImage = document.getElementById('ct-popup-image-' + popupId); + let popupIcon = document.getElementById('ct-popup-icon-' + popupId); + let popupTitle = document.getElementById('ct-popup-title-' + popupId); + let popupText = document.getElementById('ct-popup-text-' + popupId); + let popupCloseIcon = document.getElementById('ct-popup-close-icon-' + popupId); + let popupOtherContent = document.getElementById('ct-popup-other-content-' + popupId); + + // Input option values + if (inputOptions) { + Object.keys(inputOptions).forEach(function(key) { + if (key === 'animationSpeed') CreativaPopup.animationSpeed = inputOptions[key]; + if (key in options) options[key] = inputOptions[key]; + }); + } + + // Box hide + if (options.box === false) { + options.bgColor = 'rgba(0, 0, 0, 0)'; + options.boxShadow = false; + } + + // Box options + Object.keys(options).forEach(function(key) { + let backgroundOptions = ['isBlocked']; + if (backgroundOptions.includes(key)) { + popupBg.setAttribute(key, options[key]); + } else { + popupBox.setAttribute(key, options[key]); + } + }); + + // Timer close + if (options.timer) { + CreativaPopup.timerClose(popupId, options.timer); + } + + // Close button + if (popupBox.getAttribute('closeButton') == 'false' || popupBg.getAttribute('isBlocked') == 'true') { + popupCloseIcon.setAttribute('style', 'display: none;'); + } + + // No background + if (popupBox.getAttribute('background') === 'false') { + popupBg.setAttribute('style', 'display: none;'); + } + + // Text and title + if (text) popupText.innerHTML = text; + if (title) popupTitle.innerHTML = title; + if (!title) popupTitle.remove(); + + // Icon + popupIcon.style.display = 'none'; + if (icon) { + let iconUrl = ''; + switch (icon) { + case 'error': + iconUrl = this.cdn + 'icons/error.png'; + break; + case 'success': + iconUrl = this.cdn + 'icons/success.png'; + break; + case 'info': + iconUrl = this.cdn + 'icons/info.png'; + break; + default: + iconUrl = icon; + } + popupIcon.style.backgroundImage = 'url(' + iconUrl + ')'; + popupIcon.style.display = 'block'; + } + + // Image + popupImage.style.display = 'none'; + if (options.image) { + popupImage.style.backgroundImage = 'url(' + options.image + ')'; + popupImage.style.display = 'block'; + popupImage.style.borderTopLeftRadius = options.borderRadius; + popupImage.style.borderTopRightRadius = options.borderRadius; + } + + // Other content + if (!popupOtherContent) { + popupOtherContent.style.marginTop = '0'; + popupOtherContent.style.innerHtml = ''; + } else { + if (options.content) { + if (!options.isPage) { + popupOtherContent.innerHTML = options.content; + } else { + if (window.jQuery) { + $(popupOtherContent).load(options.content); + } else { + CreativaPopup.loadContent(popupId, options.content); + } + } + if (text || title) { + popupOtherContent.style.marginTop = '10px'; + } + } + } + + // z-index + let zIndexBackground = (999999 + popupId + 1).toString(); + let zIndexBox = (999999 + popupId + 2).toString(); + popupBg.style.zIndex = zIndexBackground; + + // Background animation + popupBg.style.animationDuration = parseInt(popupBox.getAttribute('animationSpeed')) / 1000 + 's'; + popupBg.classList.add('ct-popup-show'); + popupBg.classList.add('fade-ct-popup-animation-open'); + + // Popup position + let positionBottom = window.innerHeight - 100; + let popupBoxPosition = ''; + if (options.position) { + switch (options.position) { + case 'top': + popupBoxPosition = 'top: 100px'; + break; + case 'bottom': + popupBoxPosition = 'top: ' + positionBottom + 'px'; + break; + } + } + + // Box style + let popupBoxStyle = ` + background-color: ${popupBox.getAttribute('bgColor')} !important; + z-index: ${zIndexBox} !important; + box-shadow: ${popupBox.getAttribute('boxShadow')} !important; + ${popupBoxPosition} !important; + border-radius: ${popupBox.getAttribute('borderRadius')} !important; + font-family: ${popupBox.getAttribute('fontFamily')} !important; + animation-timing-function: ${popupBox.getAttribute('animationType')} !important; + animation-duration: ${popupBox.getAttribute('animationSpeed') / 1000}s !important; + `; + + // Other box style + if (options.width) popupBoxStyle += ' width: ' + options.width + ' !important;'; + if (options.height) popupBoxStyle += ' height: ' + options.height + ' !important;'; + + // Box animation + popupBox.classList.add('ct-popup-show'); + popupBox.classList.add(popupBox.getAttribute('openAnimation') + '-ct-popup-animation-open'); + + // Box style application + popupBox.setAttribute('style', popupBoxStyle); + popupTitle.setAttribute('style', 'color: ' + popupBox.getAttribute('titleColor') + ' !important'); + popupText.setAttribute('style', 'color: ' + popupBox.getAttribute('textColor') + ' !important'); + + // Box max height + popupOtherContent.style.maxHeight = (window.innerHeight - 170) + 'px'; + window.addEventListener('resize', function() { + popupOtherContent.style.maxHeight = (window.innerHeight - 170) + 'px'; + }); + + } + +} + +// CSS load +window.onload = function() { + var head = document.getElementsByTagName('head')[0]; + var link = document.createElement('link'); + link.rel = 'stylesheet'; + link.type = 'text/css'; + link.href = 'creativa-popup.css'; + link.media = 'all'; + head.appendChild(link); +} + +// Esc button to close +document.onkeydown = function(evt) { + if (evt.key && evt.key.toString().toLowerCase() === 'escape') { + if (CreativaPopup.totalPopups > 0) { + CreativaPopup.close(CreativaPopup.totalPopups); + } + } +} + +// Resize +window.onresize = function(event) { + let allPopups = this.document.getElementsByClassName('ct-popup-box'); + for (let i = 0; i < allPopups.length; i++) { + let element = document.getElementById(allPopups[i].id); + if (element.getAttribute('position') == 'bottom') { + positionBottom = window.innerHeight - 100; + element.style.top = positionBottom + 'px'; + } + } +} \ No newline at end of file diff --git a/main.js b/main.js new file mode 100644 index 0000000..a1386f4 --- /dev/null +++ b/main.js @@ -0,0 +1,54 @@ +// +// function playRandomSound(){ +// var sounds = [ +// "audio/outuby_exeos.mp3", +// "audio/outuby_skush.mp3", +// "audio/outuby_exeos.mp3", +// "audio/outuby_skush.mp3", +// "audio/outuby_justin.mp3", +// "audio/outuby_matthew.mp3", +// "audio/outuby_joey.mp3", +// "audio/outuby_petermann.mp3", +// "audio/outuby_gaffi.mp3", +// // "assets/audio/outuby_GLaDOS_15ai.wav", +// // "assets/audio/outuby_HAL 9000_15ai.wav", +// "audio/outuby_Peter.wav", +// // "assets/audio/outuby_Rise Kajukawa_15ai (1).wav", +// // "assets/audio/outuby_Rise Kajukawa_15ai (2).wav", +// "audio/outuby_sans.wav", +// // "assets/audio/outuby_Sentry Turret_15ai.wav", +// // "assets/audio/outuby_SpongeBob_15ai.wav", +// "audio/outuby_Walter White.wav", +// +// ]; +// +// +// var soundFile = sounds[Math.floor(Math.random()*sounds.length)]; +// document.getElementById("player").innerHTML=""; +// console.log(soundFile) +// } + +function playRandomSound() { + var sounds = [ + "audio/outuby_exeos.mp3", + "audio/outuby_skush.mp3", + "audio/outuby_exeos.mp3", + "audio/outuby_skush.mp3", + "audio/outuby_justin.mp3", + "audio/outuby_matthew.mp3", + "audio/outuby_joey.mp3", + "audio/outuby_petermann.mp3" + ]; + + var soundFile = sounds[Math.floor(Math.random() * sounds.length)]; + document.getElementById("player").innerHTML = ""; +} + + +function changeIcon(anchor) { + var icon = anchor.querySelector("i"); + icon.classList.toggle('fa-volume-xmark'); + icon.classList.toggle('fa-volume-high'); + + anchor.querySelector("span").textContent = icon.classList.contains('fa-volume-xmark') ? " " : " "; +} \ No newline at end of file diff --git a/particles.js b/particles.js new file mode 100644 index 0000000..fca045c --- /dev/null +++ b/particles.js @@ -0,0 +1,1562 @@ +/* ----------------------------------------------- +/* Author : Vincent Garreau - vincentgarreau.com +/* MIT license: http://opensource.org/licenses/MIT +/* Demo / Generator : vincentgarreau.com/particles.js +/* GitHub : github.com/VincentGarreau/particles.js +/* How to use? : Check the GitHub README +/* v2.0.0 +/* ----------------------------------------------- */ + +var pJS = function(tag_id, params) { + + var canvas_el = document.querySelector('#' + tag_id + ' > .particles-js-canvas-el'); + + /* particles.js variables with default values */ + this.pJS = { + canvas: { + el: canvas_el, + w: canvas_el.offsetWidth, + h: canvas_el.offsetHeight + }, + particles: { + number: { + value: 400, + density: { + enable: true, + value_area: 800 + } + }, + color: { + value: '#fff' + }, + shape: { + type: 'circle', + stroke: { + width: 0, + color: '#ff0000' + }, + polygon: { + nb_sides: 5 + }, + image: { + src: '', + width: 100, + height: 100 + } + }, + opacity: { + value: 1, + random: false, + anim: { + enable: false, + speed: 2, + opacity_min: 0, + sync: false + } + }, + size: { + value: 20, + random: false, + anim: { + enable: false, + speed: 20, + size_min: 0, + sync: false + } + }, + line_linked: { + enable: true, + distance: 100, + color: '#fff', + opacity: 1, + width: 1 + }, + move: { + enable: true, + speed: 2, + direction: 'none', + random: false, + straight: false, + out_mode: 'out', + bounce: false, + attract: { + enable: false, + rotateX: 3000, + rotateY: 3000 + } + }, + array: [] + }, + interactivity: { + detect_on: 'canvas', + events: { + onhover: { + enable: true, + mode: 'grab' + }, + onclick: { + enable: true, + mode: 'push' + }, + resize: true + }, + modes: { + grab: { + distance: 100, + line_linked: { + opacity: 1 + } + }, + bubble: { + distance: 200, + size: 80, + duration: 0.4 + }, + repulse: { + distance: 200, + duration: 0.4 + }, + push: { + particles_nb: 4 + }, + remove: { + particles_nb: 2 + } + }, + mouse: {} + }, + retina_detect: false, + fn: { + interact: {}, + modes: {}, + vendors: {} + }, + tmp: {} + }; + + var pJS = this.pJS; + + /* params settings */ + if (params) { + Object.deepExtend(pJS, params); + } + + pJS.tmp.obj = { + size_value: pJS.particles.size.value, + size_anim_speed: pJS.particles.size.anim.speed, + move_speed: pJS.particles.move.speed, + line_linked_distance: pJS.particles.line_linked.distance, + line_linked_width: pJS.particles.line_linked.width, + mode_grab_distance: pJS.interactivity.modes.grab.distance, + mode_bubble_distance: pJS.interactivity.modes.bubble.distance, + mode_bubble_size: pJS.interactivity.modes.bubble.size, + mode_repulse_distance: pJS.interactivity.modes.repulse.distance + }; + + + pJS.fn.retinaInit = function() { + + if (pJS.retina_detect && window.devicePixelRatio > 1) { + pJS.canvas.pxratio = window.devicePixelRatio; + pJS.tmp.retina = true; + } else { + pJS.canvas.pxratio = 1; + pJS.tmp.retina = false; + } + + pJS.canvas.w = pJS.canvas.el.offsetWidth * pJS.canvas.pxratio; + pJS.canvas.h = pJS.canvas.el.offsetHeight * pJS.canvas.pxratio; + + pJS.particles.size.value = pJS.tmp.obj.size_value * pJS.canvas.pxratio; + pJS.particles.size.anim.speed = pJS.tmp.obj.size_anim_speed * pJS.canvas.pxratio; + pJS.particles.move.speed = pJS.tmp.obj.move_speed * pJS.canvas.pxratio; + pJS.particles.line_linked.distance = pJS.tmp.obj.line_linked_distance * pJS.canvas.pxratio; + pJS.interactivity.modes.grab.distance = pJS.tmp.obj.mode_grab_distance * pJS.canvas.pxratio; + pJS.interactivity.modes.bubble.distance = pJS.tmp.obj.mode_bubble_distance * pJS.canvas.pxratio; + pJS.particles.line_linked.width = pJS.tmp.obj.line_linked_width * pJS.canvas.pxratio; + pJS.interactivity.modes.bubble.size = pJS.tmp.obj.mode_bubble_size * pJS.canvas.pxratio; + pJS.interactivity.modes.repulse.distance = pJS.tmp.obj.mode_repulse_distance * pJS.canvas.pxratio; + + }; + + + + /* ---------- pJS functions - canvas ------------ */ + + pJS.fn.canvasInit = function() { + pJS.canvas.ctx = pJS.canvas.el.getContext('2d'); + }; + + pJS.fn.canvasSize = function() { + + pJS.canvas.el.width = pJS.canvas.w; + pJS.canvas.el.height = pJS.canvas.h; + + if (pJS && pJS.interactivity.events.resize) { + + window.addEventListener('resize', function() { + + pJS.canvas.w = pJS.canvas.el.offsetWidth; + pJS.canvas.h = pJS.canvas.el.offsetHeight; + + /* resize canvas */ + if (pJS.tmp.retina) { + pJS.canvas.w *= pJS.canvas.pxratio; + pJS.canvas.h *= pJS.canvas.pxratio; + } + + pJS.canvas.el.width = pJS.canvas.w; + pJS.canvas.el.height = pJS.canvas.h; + + /* repaint canvas on anim disabled */ + if (!pJS.particles.move.enable) { + pJS.fn.particlesEmpty(); + pJS.fn.particlesCreate(); + pJS.fn.particlesDraw(); + pJS.fn.vendors.densityAutoParticles(); + } + + /* density particles enabled */ + pJS.fn.vendors.densityAutoParticles(); + + }); + + } + + }; + + + pJS.fn.canvasPaint = function() { + pJS.canvas.ctx.fillRect(0, 0, pJS.canvas.w, pJS.canvas.h); + }; + + pJS.fn.canvasClear = function() { + pJS.canvas.ctx.clearRect(0, 0, pJS.canvas.w, pJS.canvas.h); + }; + + + /* --------- pJS functions - particles ----------- */ + + pJS.fn.particle = function(color, opacity, position) { + + /* size */ + this.radius = (pJS.particles.size.random ? Math.random() : 1) * pJS.particles.size.value; + if (pJS.particles.size.anim.enable) { + this.size_status = false; + this.vs = pJS.particles.size.anim.speed / 100; + if (!pJS.particles.size.anim.sync) { + this.vs = this.vs * Math.random(); + } + } + + /* position */ + this.x = position ? position.x : Math.random() * pJS.canvas.w; + this.y = position ? position.y : Math.random() * pJS.canvas.h; + + /* check position - into the canvas */ + if (this.x > pJS.canvas.w - this.radius * 2) this.x = this.x - this.radius; + else if (this.x < this.radius * 2) this.x = this.x + this.radius; + if (this.y > pJS.canvas.h - this.radius * 2) this.y = this.y - this.radius; + else if (this.y < this.radius * 2) this.y = this.y + this.radius; + + /* check position - avoid overlap */ + if (pJS.particles.move.bounce) { + pJS.fn.vendors.checkOverlap(this, position); + } + + /* color */ + this.color = {}; + if (typeof(color.value) == 'object') { + + if (color.value instanceof Array) { + var color_selected = color.value[Math.floor(Math.random() * pJS.particles.color.value.length)]; + this.color.rgb = hexToRgb(color_selected); + } else { + if (color.value.r != undefined && color.value.g != undefined && color.value.b != undefined) { + this.color.rgb = { + r: color.value.r, + g: color.value.g, + b: color.value.b + } + } + if (color.value.h != undefined && color.value.s != undefined && color.value.l != undefined) { + this.color.hsl = { + h: color.value.h, + s: color.value.s, + l: color.value.l + } + } + } + + } else if (color.value == 'random') { + this.color.rgb = { + r: (Math.floor(Math.random() * (255 - 0 + 1)) + 0), + g: (Math.floor(Math.random() * (255 - 0 + 1)) + 0), + b: (Math.floor(Math.random() * (255 - 0 + 1)) + 0) + } + } else if (typeof(color.value) == 'string') { + this.color = color; + this.color.rgb = hexToRgb(this.color.value); + } + + /* opacity */ + this.opacity = (pJS.particles.opacity.random ? Math.random() : 1) * pJS.particles.opacity.value; + if (pJS.particles.opacity.anim.enable) { + this.opacity_status = false; + this.vo = pJS.particles.opacity.anim.speed / 100; + if (!pJS.particles.opacity.anim.sync) { + this.vo = this.vo * Math.random(); + } + } + + /* animation - velocity for speed */ + var velbase = {} + switch (pJS.particles.move.direction) { + case 'top': + velbase = { + x: 0, + y: -1 + }; + break; + case 'top-right': + velbase = { + x: 0.5, + y: -0.5 + }; + break; + case 'right': + velbase = { + x: 1, + y: -0 + }; + break; + case 'bottom-right': + velbase = { + x: 0.5, + y: 0.5 + }; + break; + case 'bottom': + velbase = { + x: 0, + y: 1 + }; + break; + case 'bottom-left': + velbase = { + x: -0.5, + y: 1 + }; + break; + case 'left': + velbase = { + x: -1, + y: 0 + }; + break; + case 'top-left': + velbase = { + x: -0.5, + y: -0.5 + }; + break; + default: + velbase = { + x: 0, + y: 0 + }; + break; + } + + if (pJS.particles.move.straight) { + this.vx = velbase.x; + this.vy = velbase.y; + if (pJS.particles.move.random) { + this.vx = this.vx * (Math.random()); + this.vy = this.vy * (Math.random()); + } + } else { + this.vx = velbase.x + Math.random() - 0.5; + this.vy = velbase.y + Math.random() - 0.5; + } + + // var theta = 2.0 * Math.PI * Math.random(); + // this.vx = Math.cos(theta); + // this.vy = Math.sin(theta); + + this.vx_i = this.vx; + this.vy_i = this.vy; + + + + /* if shape is image */ + + var shape_type = pJS.particles.shape.type; + if (typeof(shape_type) == 'object') { + if (shape_type instanceof Array) { + var shape_selected = shape_type[Math.floor(Math.random() * shape_type.length)]; + this.shape = shape_selected; + } + } else { + this.shape = shape_type; + } + + if (this.shape == 'image') { + var sh = pJS.particles.shape; + this.img = { + src: sh.image.src, + ratio: sh.image.width / sh.image.height + } + if (!this.img.ratio) this.img.ratio = 1; + if (pJS.tmp.img_type == 'svg' && pJS.tmp.source_svg != undefined) { + pJS.fn.vendors.createSvgImg(this); + if (pJS.tmp.pushing) { + this.img.loaded = false; + } + } + } + + + + }; + + + pJS.fn.particle.prototype.draw = function() { + + var p = this; + + if (p.radius_bubble != undefined) { + var radius = p.radius_bubble; + } else { + var radius = p.radius; + } + + if (p.opacity_bubble != undefined) { + var opacity = p.opacity_bubble; + } else { + var opacity = p.opacity; + } + + if (p.color.rgb) { + var color_value = 'rgba(' + p.color.rgb.r + ',' + p.color.rgb.g + ',' + p.color.rgb.b + ',' + opacity + ')'; + } else { + var color_value = 'hsla(' + p.color.hsl.h + ',' + p.color.hsl.s + '%,' + p.color.hsl.l + '%,' + opacity + ')'; + } + + pJS.canvas.ctx.fillStyle = color_value; + pJS.canvas.ctx.beginPath(); + + switch (p.shape) { + + case 'circle': + pJS.canvas.ctx.arc(p.x, p.y, radius, 0, Math.PI * 2, false); + break; + + case 'edge': + pJS.canvas.ctx.rect(p.x - radius, p.y - radius, radius * 2, radius * 2); + break; + + case 'triangle': + pJS.fn.vendors.drawShape(pJS.canvas.ctx, p.x - radius, p.y + radius / 1.66, radius * 2, 3, 2); + break; + + case 'polygon': + pJS.fn.vendors.drawShape( + pJS.canvas.ctx, + p.x - radius / (pJS.particles.shape.polygon.nb_sides / 3.5), // startX + p.y - radius / (2.66 / 3.5), // startY + radius * 2.66 / (pJS.particles.shape.polygon.nb_sides / 3), // sideLength + pJS.particles.shape.polygon.nb_sides, // sideCountNumerator + 1 // sideCountDenominator + ); + break; + + case 'star': + pJS.fn.vendors.drawShape( + pJS.canvas.ctx, + p.x - radius * 2 / (pJS.particles.shape.polygon.nb_sides / 4), // startX + p.y - radius / (2 * 2.66 / 3.5), // startY + radius * 2 * 2.66 / (pJS.particles.shape.polygon.nb_sides / 3), // sideLength + pJS.particles.shape.polygon.nb_sides, // sideCountNumerator + 2 // sideCountDenominator + ); + break; + + case 'image': + + function draw() { + pJS.canvas.ctx.drawImage( + img_obj, + p.x - radius, + p.y - radius, + radius * 2, + radius * 2 / p.img.ratio + ); + } + + if (pJS.tmp.img_type == 'svg') { + var img_obj = p.img.obj; + } else { + var img_obj = pJS.tmp.img_obj; + } + + if (img_obj) { + draw(); + } + + break; + + } + + pJS.canvas.ctx.closePath(); + + if (pJS.particles.shape.stroke.width > 0) { + pJS.canvas.ctx.strokeStyle = pJS.particles.shape.stroke.color; + pJS.canvas.ctx.lineWidth = pJS.particles.shape.stroke.width; + pJS.canvas.ctx.stroke(); + } + + pJS.canvas.ctx.fill(); + + }; + + + pJS.fn.particlesCreate = function() { + for (var i = 0; i < pJS.particles.number.value; i++) { + pJS.particles.array.push(new pJS.fn.particle(pJS.particles.color, pJS.particles.opacity.value)); + } + }; + + pJS.fn.particlesUpdate = function() { + + for (var i = 0; i < pJS.particles.array.length; i++) { + + /* the particle */ + var p = pJS.particles.array[i]; + + // var d = ( dx = pJS.interactivity.mouse.click_pos_x - p.x ) * dx + ( dy = pJS.interactivity.mouse.click_pos_y - p.y ) * dy; + // var f = -BANG_SIZE / d; + // if ( d < BANG_SIZE ) { + // var t = Math.atan2( dy, dx ); + // p.vx = f * Math.cos(t); + // p.vy = f * Math.sin(t); + // } + + /* move the particle */ + if (pJS.particles.move.enable) { + var ms = pJS.particles.move.speed / 2; + p.x += p.vx * ms; + p.y += p.vy * ms; + } + + /* change opacity status */ + if (pJS.particles.opacity.anim.enable) { + if (p.opacity_status == true) { + if (p.opacity >= pJS.particles.opacity.value) p.opacity_status = false; + p.opacity += p.vo; + } else { + if (p.opacity <= pJS.particles.opacity.anim.opacity_min) p.opacity_status = true; + p.opacity -= p.vo; + } + if (p.opacity < 0) p.opacity = 0; + } + + /* change size */ + if (pJS.particles.size.anim.enable) { + if (p.size_status == true) { + if (p.radius >= pJS.particles.size.value) p.size_status = false; + p.radius += p.vs; + } else { + if (p.radius <= pJS.particles.size.anim.size_min) p.size_status = true; + p.radius -= p.vs; + } + if (p.radius < 0) p.radius = 0; + } + + /* change particle position if it is out of canvas */ + if (pJS.particles.move.out_mode == 'bounce') { + var new_pos = { + x_left: p.radius, + x_right: pJS.canvas.w, + y_top: p.radius, + y_bottom: pJS.canvas.h + } + } else { + var new_pos = { + x_left: -p.radius, + x_right: pJS.canvas.w + p.radius, + y_top: -p.radius, + y_bottom: pJS.canvas.h + p.radius + } + } + + if (p.x - p.radius > pJS.canvas.w) { + p.x = new_pos.x_left; + p.y = Math.random() * pJS.canvas.h; + } else if (p.x + p.radius < 0) { + p.x = new_pos.x_right; + p.y = Math.random() * pJS.canvas.h; + } + if (p.y - p.radius > pJS.canvas.h) { + p.y = new_pos.y_top; + p.x = Math.random() * pJS.canvas.w; + } else if (p.y + p.radius < 0) { + p.y = new_pos.y_bottom; + p.x = Math.random() * pJS.canvas.w; + } + + /* out of canvas modes */ + switch (pJS.particles.move.out_mode) { + case 'bounce': + if (p.x + p.radius > pJS.canvas.w) p.vx = -p.vx; + else if (p.x - p.radius < 0) p.vx = -p.vx; + if (p.y + p.radius > pJS.canvas.h) p.vy = -p.vy; + else if (p.y - p.radius < 0) p.vy = -p.vy; + break; + } + + /* events */ + if (isInArray('grab', pJS.interactivity.events.onhover.mode)) { + pJS.fn.modes.grabParticle(p); + } + + if (isInArray('bubble', pJS.interactivity.events.onhover.mode) || isInArray('bubble', pJS.interactivity.events.onclick.mode)) { + pJS.fn.modes.bubbleParticle(p); + } + + if (isInArray('repulse', pJS.interactivity.events.onhover.mode) || isInArray('repulse', pJS.interactivity.events.onclick.mode)) { + pJS.fn.modes.repulseParticle(p); + } + + /* interaction auto between particles */ + if (pJS.particles.line_linked.enable || pJS.particles.move.attract.enable) { + for (var j = i + 1; j < pJS.particles.array.length; j++) { + var p2 = pJS.particles.array[j]; + + /* link particles */ + if (pJS.particles.line_linked.enable) { + pJS.fn.interact.linkParticles(p, p2); + } + + /* attract particles */ + if (pJS.particles.move.attract.enable) { + pJS.fn.interact.attractParticles(p, p2); + } + + /* bounce particles */ + if (pJS.particles.move.bounce) { + pJS.fn.interact.bounceParticles(p, p2); + } + + } + } + + + } + + }; + + pJS.fn.particlesDraw = function() { + + /* clear canvas */ + pJS.canvas.ctx.clearRect(0, 0, pJS.canvas.w, pJS.canvas.h); + + /* update each particles param */ + pJS.fn.particlesUpdate(); + + /* draw each particle */ + for (var i = 0; i < pJS.particles.array.length; i++) { + var p = pJS.particles.array[i]; + p.draw(); + } + + }; + + pJS.fn.particlesEmpty = function() { + pJS.particles.array = []; + }; + + pJS.fn.particlesRefresh = function() { + + /* init all */ + cancelRequestAnimFrame(pJS.fn.checkAnimFrame); + cancelRequestAnimFrame(pJS.fn.drawAnimFrame); + pJS.tmp.source_svg = undefined; + pJS.tmp.img_obj = undefined; + pJS.tmp.count_svg = 0; + pJS.fn.particlesEmpty(); + pJS.fn.canvasClear(); + + /* restart */ + pJS.fn.vendors.start(); + + }; + + + /* ---------- pJS functions - particles interaction ------------ */ + + pJS.fn.interact.linkParticles = function(p1, p2) { + + var dx = p1.x - p2.x, + dy = p1.y - p2.y, + dist = Math.sqrt(dx * dx + dy * dy); + + /* draw a line between p1 and p2 if the distance between them is under the config distance */ + if (dist <= pJS.particles.line_linked.distance) { + + var opacity_line = pJS.particles.line_linked.opacity - (dist / (1 / pJS.particles.line_linked.opacity)) / pJS.particles.line_linked.distance; + + if (opacity_line > 0) { + + /* style */ + var color_line = pJS.particles.line_linked.color_rgb_line; + pJS.canvas.ctx.strokeStyle = 'rgba(' + color_line.r + ',' + color_line.g + ',' + color_line.b + ',' + opacity_line + ')'; + pJS.canvas.ctx.lineWidth = pJS.particles.line_linked.width; + //pJS.canvas.ctx.lineCap = 'round'; /* performance issue */ + + /* path */ + pJS.canvas.ctx.beginPath(); + pJS.canvas.ctx.moveTo(p1.x, p1.y); + pJS.canvas.ctx.lineTo(p2.x, p2.y); + pJS.canvas.ctx.stroke(); + pJS.canvas.ctx.closePath(); + + } + + } + + }; + + + pJS.fn.interact.attractParticles = function(p1, p2) { + + /* condensed particles */ + var dx = p1.x - p2.x, + dy = p1.y - p2.y, + dist = Math.sqrt(dx * dx + dy * dy); + + if (dist <= pJS.particles.line_linked.distance) { + + var ax = dx / (pJS.particles.move.attract.rotateX * 1000), + ay = dy / (pJS.particles.move.attract.rotateY * 1000); + + p1.vx -= ax; + p1.vy -= ay; + + p2.vx += ax; + p2.vy += ay; + + } + + + } + + + pJS.fn.interact.bounceParticles = function(p1, p2) { + + var dx = p1.x - p2.x, + dy = p1.y - p2.y, + dist = Math.sqrt(dx * dx + dy * dy), + dist_p = p1.radius + p2.radius; + + if (dist <= dist_p) { + p1.vx = -p1.vx; + p1.vy = -p1.vy; + + p2.vx = -p2.vx; + p2.vy = -p2.vy; + } + + } + + + /* ---------- pJS functions - modes events ------------ */ + + pJS.fn.modes.pushParticles = function(nb, pos) { + + pJS.tmp.pushing = true; + + for (var i = 0; i < nb; i++) { + pJS.particles.array.push( + new pJS.fn.particle( + pJS.particles.color, + pJS.particles.opacity.value, { + 'x': pos ? pos.pos_x : Math.random() * pJS.canvas.w, + 'y': pos ? pos.pos_y : Math.random() * pJS.canvas.h + } + ) + ) + if (i == nb - 1) { + if (!pJS.particles.move.enable) { + pJS.fn.particlesDraw(); + } + pJS.tmp.pushing = false; + } + } + + }; + + + pJS.fn.modes.removeParticles = function(nb) { + + pJS.particles.array.splice(0, nb); + if (!pJS.particles.move.enable) { + pJS.fn.particlesDraw(); + } + + }; + + + pJS.fn.modes.bubbleParticle = function(p) { + + /* on hover event */ + if (pJS.interactivity.events.onhover.enable && isInArray('bubble', pJS.interactivity.events.onhover.mode)) { + + var dx_mouse = p.x - pJS.interactivity.mouse.pos_x, + dy_mouse = p.y - pJS.interactivity.mouse.pos_y, + dist_mouse = Math.sqrt(dx_mouse * dx_mouse + dy_mouse * dy_mouse), + ratio = 1 - dist_mouse / pJS.interactivity.modes.bubble.distance; + + function init() { + p.opacity_bubble = p.opacity; + p.radius_bubble = p.radius; + } + + /* mousemove - check ratio */ + if (dist_mouse <= pJS.interactivity.modes.bubble.distance) { + + if (ratio >= 0 && pJS.interactivity.status == 'mousemove') { + + /* size */ + if (pJS.interactivity.modes.bubble.size != pJS.particles.size.value) { + + if (pJS.interactivity.modes.bubble.size > pJS.particles.size.value) { + var size = p.radius + (pJS.interactivity.modes.bubble.size * ratio); + if (size >= 0) { + p.radius_bubble = size; + } + } else { + var dif = p.radius - pJS.interactivity.modes.bubble.size, + size = p.radius - (dif * ratio); + if (size > 0) { + p.radius_bubble = size; + } else { + p.radius_bubble = 0; + } + } + + } + + /* opacity */ + if (pJS.interactivity.modes.bubble.opacity != pJS.particles.opacity.value) { + + if (pJS.interactivity.modes.bubble.opacity > pJS.particles.opacity.value) { + var opacity = pJS.interactivity.modes.bubble.opacity * ratio; + if (opacity > p.opacity && opacity <= pJS.interactivity.modes.bubble.opacity) { + p.opacity_bubble = opacity; + } + } else { + var opacity = p.opacity - (pJS.particles.opacity.value - pJS.interactivity.modes.bubble.opacity) * ratio; + if (opacity < p.opacity && opacity >= pJS.interactivity.modes.bubble.opacity) { + p.opacity_bubble = opacity; + } + } + + } + + } + + } else { + init(); + } + + + /* mouseleave */ + if (pJS.interactivity.status == 'mouseleave') { + init(); + } + + } + + /* on click event */ + else if (pJS.interactivity.events.onclick.enable && isInArray('bubble', pJS.interactivity.events.onclick.mode)) { + + + if (pJS.tmp.bubble_clicking) { + var dx_mouse = p.x - pJS.interactivity.mouse.click_pos_x, + dy_mouse = p.y - pJS.interactivity.mouse.click_pos_y, + dist_mouse = Math.sqrt(dx_mouse * dx_mouse + dy_mouse * dy_mouse), + time_spent = (new Date().getTime() - pJS.interactivity.mouse.click_time) / 1000; + + if (time_spent > pJS.interactivity.modes.bubble.duration) { + pJS.tmp.bubble_duration_end = true; + } + + if (time_spent > pJS.interactivity.modes.bubble.duration * 2) { + pJS.tmp.bubble_clicking = false; + pJS.tmp.bubble_duration_end = false; + } + } + + + function process(bubble_param, particles_param, p_obj_bubble, p_obj, id) { + + if (bubble_param != particles_param) { + + if (!pJS.tmp.bubble_duration_end) { + if (dist_mouse <= pJS.interactivity.modes.bubble.distance) { + if (p_obj_bubble != undefined) var obj = p_obj_bubble; + else var obj = p_obj; + if (obj != bubble_param) { + var value = p_obj - (time_spent * (p_obj - bubble_param) / pJS.interactivity.modes.bubble.duration); + if (id == 'size') p.radius_bubble = value; + if (id == 'opacity') p.opacity_bubble = value; + } + } else { + if (id == 'size') p.radius_bubble = undefined; + if (id == 'opacity') p.opacity_bubble = undefined; + } + } else { + if (p_obj_bubble != undefined) { + var value_tmp = p_obj - (time_spent * (p_obj - bubble_param) / pJS.interactivity.modes.bubble.duration), + dif = bubble_param - value_tmp; + value = bubble_param + dif; + if (id == 'size') p.radius_bubble = value; + if (id == 'opacity') p.opacity_bubble = value; + } + } + + } + + } + + if (pJS.tmp.bubble_clicking) { + /* size */ + process(pJS.interactivity.modes.bubble.size, pJS.particles.size.value, p.radius_bubble, p.radius, 'size'); + /* opacity */ + process(pJS.interactivity.modes.bubble.opacity, pJS.particles.opacity.value, p.opacity_bubble, p.opacity, 'opacity'); + } + + } + + }; + + + pJS.fn.modes.repulseParticle = function(p) { + + if (pJS.interactivity.events.onhover.enable && isInArray('repulse', pJS.interactivity.events.onhover.mode) && pJS.interactivity.status == 'mousemove') { + + var dx_mouse = p.x - pJS.interactivity.mouse.pos_x, + dy_mouse = p.y - pJS.interactivity.mouse.pos_y, + dist_mouse = Math.sqrt(dx_mouse * dx_mouse + dy_mouse * dy_mouse); + + var normVec = { + x: dx_mouse / dist_mouse, + y: dy_mouse / dist_mouse + }, + repulseRadius = pJS.interactivity.modes.repulse.distance, + velocity = 100, + repulseFactor = clamp((1 / repulseRadius) * (-1 * Math.pow(dist_mouse / repulseRadius, 2) + 1) * repulseRadius * velocity, 0, 50); + + var pos = { + x: p.x + normVec.x * repulseFactor, + y: p.y + normVec.y * repulseFactor + } + + if (pJS.particles.move.out_mode == 'bounce') { + if (pos.x - p.radius > 0 && pos.x + p.radius < pJS.canvas.w) p.x = pos.x; + if (pos.y - p.radius > 0 && pos.y + p.radius < pJS.canvas.h) p.y = pos.y; + } else { + p.x = pos.x; + p.y = pos.y; + } + + } else if (pJS.interactivity.events.onclick.enable && isInArray('repulse', pJS.interactivity.events.onclick.mode)) { + + if (!pJS.tmp.repulse_finish) { + pJS.tmp.repulse_count++; + if (pJS.tmp.repulse_count == pJS.particles.array.length) { + pJS.tmp.repulse_finish = true; + } + } + + if (pJS.tmp.repulse_clicking) { + + var repulseRadius = Math.pow(pJS.interactivity.modes.repulse.distance / 6, 3); + + var dx = pJS.interactivity.mouse.click_pos_x - p.x, + dy = pJS.interactivity.mouse.click_pos_y - p.y, + d = dx * dx + dy * dy; + + var force = -repulseRadius / d * 1; + + function process() { + + var f = Math.atan2(dy, dx); + p.vx = force * Math.cos(f); + p.vy = force * Math.sin(f); + + if (pJS.particles.move.out_mode == 'bounce') { + var pos = { + x: p.x + p.vx, + y: p.y + p.vy + } + if (pos.x + p.radius > pJS.canvas.w) p.vx = -p.vx; + else if (pos.x - p.radius < 0) p.vx = -p.vx; + if (pos.y + p.radius > pJS.canvas.h) p.vy = -p.vy; + else if (pos.y - p.radius < 0) p.vy = -p.vy; + } + + } + + // default + if (d <= repulseRadius) { + process(); + } + + // bang - slow motion mode + // if(!pJS.tmp.repulse_finish){ + // if(d <= repulseRadius){ + // process(); + // } + // }else{ + // process(); + // } + + + } else { + + if (pJS.tmp.repulse_clicking == false) { + + p.vx = p.vx_i; + p.vy = p.vy_i; + + } + + } + + } + + } + + + pJS.fn.modes.grabParticle = function(p) { + + if (pJS.interactivity.events.onhover.enable && pJS.interactivity.status == 'mousemove') { + + var dx_mouse = p.x - pJS.interactivity.mouse.pos_x, + dy_mouse = p.y - pJS.interactivity.mouse.pos_y, + dist_mouse = Math.sqrt(dx_mouse * dx_mouse + dy_mouse * dy_mouse); + + /* draw a line between the cursor and the particle if the distance between them is under the config distance */ + if (dist_mouse <= pJS.interactivity.modes.grab.distance) { + + var opacity_line = pJS.interactivity.modes.grab.line_linked.opacity - (dist_mouse / (1 / pJS.interactivity.modes.grab.line_linked.opacity)) / pJS.interactivity.modes.grab.distance; + + if (opacity_line > 0) { + + /* style */ + var color_line = pJS.particles.line_linked.color_rgb_line; + pJS.canvas.ctx.strokeStyle = 'rgba(' + color_line.r + ',' + color_line.g + ',' + color_line.b + ',' + opacity_line + ')'; + pJS.canvas.ctx.lineWidth = pJS.particles.line_linked.width; + //pJS.canvas.ctx.lineCap = 'round'; /* performance issue */ + + /* path */ + pJS.canvas.ctx.beginPath(); + pJS.canvas.ctx.moveTo(p.x, p.y); + pJS.canvas.ctx.lineTo(pJS.interactivity.mouse.pos_x, pJS.interactivity.mouse.pos_y); + pJS.canvas.ctx.stroke(); + pJS.canvas.ctx.closePath(); + + } + + } + + } + + }; + + + + /* ---------- pJS functions - vendors ------------ */ + + pJS.fn.vendors.eventsListeners = function() { + + /* events target element */ + if (pJS.interactivity.detect_on == 'window') { + pJS.interactivity.el = window; + } else { + pJS.interactivity.el = pJS.canvas.el; + } + + + /* detect mouse pos - on hover / click event */ + if (pJS.interactivity.events.onhover.enable || pJS.interactivity.events.onclick.enable) { + + /* el on mousemove */ + pJS.interactivity.el.addEventListener('mousemove', function(e) { + + if (pJS.interactivity.el == window) { + var pos_x = e.clientX, + pos_y = e.clientY; + } else { + var pos_x = e.offsetX || e.clientX, + pos_y = e.offsetY || e.clientY; + } + + pJS.interactivity.mouse.pos_x = pos_x; + pJS.interactivity.mouse.pos_y = pos_y; + + if (pJS.tmp.retina) { + pJS.interactivity.mouse.pos_x *= pJS.canvas.pxratio; + pJS.interactivity.mouse.pos_y *= pJS.canvas.pxratio; + } + + pJS.interactivity.status = 'mousemove'; + + }); + + /* el on onmouseleave */ + pJS.interactivity.el.addEventListener('mouseleave', function(e) { + + pJS.interactivity.mouse.pos_x = null; + pJS.interactivity.mouse.pos_y = null; + pJS.interactivity.status = 'mouseleave'; + + }); + + } + + /* on click event */ + if (pJS.interactivity.events.onclick.enable) { + + pJS.interactivity.el.addEventListener('click', function() { + + pJS.interactivity.mouse.click_pos_x = pJS.interactivity.mouse.pos_x; + pJS.interactivity.mouse.click_pos_y = pJS.interactivity.mouse.pos_y; + pJS.interactivity.mouse.click_time = new Date().getTime(); + + if (pJS.interactivity.events.onclick.enable) { + + switch (pJS.interactivity.events.onclick.mode) { + + case 'push': + if (pJS.particles.move.enable) { + pJS.fn.modes.pushParticles(pJS.interactivity.modes.push.particles_nb, pJS.interactivity.mouse); + } else { + if (pJS.interactivity.modes.push.particles_nb == 1) { + pJS.fn.modes.pushParticles(pJS.interactivity.modes.push.particles_nb, pJS.interactivity.mouse); + } else if (pJS.interactivity.modes.push.particles_nb > 1) { + pJS.fn.modes.pushParticles(pJS.interactivity.modes.push.particles_nb); + } + } + break; + + case 'remove': + pJS.fn.modes.removeParticles(pJS.interactivity.modes.remove.particles_nb); + break; + + case 'bubble': + pJS.tmp.bubble_clicking = true; + break; + + case 'repulse': + pJS.tmp.repulse_clicking = true; + pJS.tmp.repulse_count = 0; + pJS.tmp.repulse_finish = false; + setTimeout(function() { + pJS.tmp.repulse_clicking = false; + }, pJS.interactivity.modes.repulse.duration * 1000) + break; + + } + + } + + }); + + } + + + }; + + pJS.fn.vendors.densityAutoParticles = function() { + + if (pJS.particles.number.density.enable) { + + /* calc area */ + var area = pJS.canvas.el.width * pJS.canvas.el.height / 1000; + if (pJS.tmp.retina) { + area = area / (pJS.canvas.pxratio * 2); + } + + /* calc number of particles based on density area */ + var nb_particles = area * pJS.particles.number.value / pJS.particles.number.density.value_area; + + /* add or remove X particles */ + var missing_particles = pJS.particles.array.length - nb_particles; + if (missing_particles < 0) pJS.fn.modes.pushParticles(Math.abs(missing_particles)); + else pJS.fn.modes.removeParticles(missing_particles); + + } + + }; + + + pJS.fn.vendors.checkOverlap = function(p1, position) { + for (var i = 0; i < pJS.particles.array.length; i++) { + var p2 = pJS.particles.array[i]; + + var dx = p1.x - p2.x, + dy = p1.y - p2.y, + dist = Math.sqrt(dx * dx + dy * dy); + + if (dist <= p1.radius + p2.radius) { + p1.x = position ? position.x : Math.random() * pJS.canvas.w; + p1.y = position ? position.y : Math.random() * pJS.canvas.h; + pJS.fn.vendors.checkOverlap(p1); + } + } + }; + + + pJS.fn.vendors.createSvgImg = function(p) { + + /* set color to svg element */ + var svgXml = pJS.tmp.source_svg, + rgbHex = /#([0-9A-F]{3,6})/gi, + coloredSvgXml = svgXml.replace(rgbHex, function(m, r, g, b) { + if (p.color.rgb) { + var color_value = 'rgba(' + p.color.rgb.r + ',' + p.color.rgb.g + ',' + p.color.rgb.b + ',' + p.opacity + ')'; + } else { + var color_value = 'hsla(' + p.color.hsl.h + ',' + p.color.hsl.s + '%,' + p.color.hsl.l + '%,' + p.opacity + ')'; + } + return color_value; + }); + + /* prepare to create img with colored svg */ + var svg = new Blob([coloredSvgXml], { + type: 'image/svg+xml;charset=utf-8' + }), + DOMURL = window.URL || window.webkitURL || window, + url = DOMURL.createObjectURL(svg); + + /* create particle img obj */ + var img = new Image(); + img.addEventListener('load', function() { + p.img.obj = img; + p.img.loaded = true; + DOMURL.revokeObjectURL(url); + pJS.tmp.count_svg++; + }); + img.src = url; + + }; + + + pJS.fn.vendors.destroypJS = function() { + cancelAnimationFrame(pJS.fn.drawAnimFrame); + canvas_el.remove(); + pJSDom = null; + }; + + + pJS.fn.vendors.drawShape = function(c, startX, startY, sideLength, sideCountNumerator, sideCountDenominator) { + + // By Programming Thomas - https://programmingthomas.wordpress.com/2013/04/03/n-sided-shapes/ + var sideCount = sideCountNumerator * sideCountDenominator; + var decimalSides = sideCountNumerator / sideCountDenominator; + var interiorAngleDegrees = (180 * (decimalSides - 2)) / decimalSides; + var interiorAngle = Math.PI - Math.PI * interiorAngleDegrees / 180; // convert to radians + c.save(); + c.beginPath(); + c.translate(startX, startY); + c.moveTo(0, 0); + for (var i = 0; i < sideCount; i++) { + c.lineTo(sideLength, 0); + c.translate(sideLength, 0); + c.rotate(interiorAngle); + } + //c.stroke(); + c.fill(); + c.restore(); + + }; + + pJS.fn.vendors.exportImg = function() { + window.open(pJS.canvas.el.toDataURL('image/png'), '_blank'); + }; + + + pJS.fn.vendors.loadImg = function(type) { + + pJS.tmp.img_error = undefined; + + if (pJS.particles.shape.image.src != '') { + + if (type == 'svg') { + + var xhr = new XMLHttpRequest(); + xhr.open('GET', pJS.particles.shape.image.src); + xhr.onreadystatechange = function(data) { + if (xhr.readyState == 4) { + if (xhr.status == 200) { + pJS.tmp.source_svg = data.currentTarget.response; + pJS.fn.vendors.checkBeforeDraw(); + } else { + console.log('Error pJS - Image not found'); + pJS.tmp.img_error = true; + } + } + } + xhr.send(); + + } else { + + var img = new Image(); + img.addEventListener('load', function() { + pJS.tmp.img_obj = img; + pJS.fn.vendors.checkBeforeDraw(); + }); + img.src = pJS.particles.shape.image.src; + + } + + } else { + console.log('Error pJS - No image.src'); + pJS.tmp.img_error = true; + } + + }; + + + pJS.fn.vendors.draw = function() { + + if (pJS.particles.shape.type == 'image') { + + if (pJS.tmp.img_type == 'svg') { + + if (pJS.tmp.count_svg >= pJS.particles.number.value) { + pJS.fn.particlesDraw(); + if (!pJS.particles.move.enable) cancelRequestAnimFrame(pJS.fn.drawAnimFrame); + else pJS.fn.drawAnimFrame = requestAnimFrame(pJS.fn.vendors.draw); + } else { + //console.log('still loading...'); + if (!pJS.tmp.img_error) pJS.fn.drawAnimFrame = requestAnimFrame(pJS.fn.vendors.draw); + } + + } else { + + if (pJS.tmp.img_obj != undefined) { + pJS.fn.particlesDraw(); + if (!pJS.particles.move.enable) cancelRequestAnimFrame(pJS.fn.drawAnimFrame); + else pJS.fn.drawAnimFrame = requestAnimFrame(pJS.fn.vendors.draw); + } else { + if (!pJS.tmp.img_error) pJS.fn.drawAnimFrame = requestAnimFrame(pJS.fn.vendors.draw); + } + + } + + } else { + pJS.fn.particlesDraw(); + if (!pJS.particles.move.enable) cancelRequestAnimFrame(pJS.fn.drawAnimFrame); + else pJS.fn.drawAnimFrame = requestAnimFrame(pJS.fn.vendors.draw); + } + + }; + + + pJS.fn.vendors.checkBeforeDraw = function() { + + // if shape is image + if (pJS.particles.shape.type == 'image') { + + if (pJS.tmp.img_type == 'svg' && pJS.tmp.source_svg == undefined) { + pJS.tmp.checkAnimFrame = requestAnimFrame(check); + } else { + //console.log('images loaded! cancel check'); + cancelRequestAnimFrame(pJS.tmp.checkAnimFrame); + if (!pJS.tmp.img_error) { + pJS.fn.vendors.init(); + pJS.fn.vendors.draw(); + } + + } + + } else { + pJS.fn.vendors.init(); + pJS.fn.vendors.draw(); + } + + }; + + + pJS.fn.vendors.init = function() { + + /* init canvas + particles */ + pJS.fn.retinaInit(); + pJS.fn.canvasInit(); + pJS.fn.canvasSize(); + pJS.fn.canvasPaint(); + pJS.fn.particlesCreate(); + pJS.fn.vendors.densityAutoParticles(); + + /* particles.line_linked - convert hex colors to rgb */ + pJS.particles.line_linked.color_rgb_line = hexToRgb(pJS.particles.line_linked.color); + + }; + + + pJS.fn.vendors.start = function() { + + if (isInArray('image', pJS.particles.shape.type)) { + pJS.tmp.img_type = pJS.particles.shape.image.src.substr(pJS.particles.shape.image.src.length - 3); + pJS.fn.vendors.loadImg(pJS.tmp.img_type); + } else { + pJS.fn.vendors.checkBeforeDraw(); + } + + }; + + + + + /* ---------- pJS - start ------------ */ + + + pJS.fn.vendors.eventsListeners(); + + pJS.fn.vendors.start(); + + + +}; + +/* ---------- global functions - vendors ------------ */ + +Object.deepExtend = function(destination, source) { + for (var property in source) { + if (source[property] && source[property].constructor && + source[property].constructor === Object) { + destination[property] = destination[property] || {}; + arguments.callee(destination[property], source[property]); + } else { + destination[property] = source[property]; + } + } + return destination; +}; + +window.requestAnimFrame = (function() { + return window.requestAnimationFrame || + window.webkitRequestAnimationFrame || + window.mozRequestAnimationFrame || + window.oRequestAnimationFrame || + window.msRequestAnimationFrame || + function(callback) { + window.setTimeout(callback, 1000 / 60); + }; +})(); + +window.cancelRequestAnimFrame = (function() { + return window.cancelAnimationFrame || + window.webkitCancelRequestAnimationFrame || + window.mozCancelRequestAnimationFrame || + window.oCancelRequestAnimationFrame || + window.msCancelRequestAnimationFrame || + clearTimeout +})(); + +function hexToRgb(hex) { + // By Tim Down - http://stackoverflow.com/a/5624139/3493650 + // Expand shorthand form (e.g. "03F") to full form (e.g. "0033FF") + var shorthandRegex = /^#?([a-f\d])([a-f\d])([a-f\d])$/i; + hex = hex.replace(shorthandRegex, function(m, r, g, b) { + return r + r + g + g + b + b; + }); + var result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex); + return result ? { + r: parseInt(result[1], 16), + g: parseInt(result[2], 16), + b: parseInt(result[3], 16) + } : null; +}; + +function clamp(number, min, max) { + return Math.min(Math.max(number, min), max); +}; + +function isInArray(value, array) { + return array.indexOf(value) > -1; +} + + +/* ---------- particles.js functions - start ------------ */ + +window.pJSDom = []; + +window.particlesJS = function(tag_id, params) { + + //console.log(params); + + /* no string id? so it's object params, and set the id with default id */ + if (typeof(tag_id) != 'string') { + params = tag_id; + tag_id = 'particles-js'; + } + + /* no id? set the id to default id */ + if (!tag_id) { + tag_id = 'particles-js'; + } + + /* pJS elements */ + var pJS_tag = document.getElementById(tag_id), + pJS_canvas_class = 'particles-js-canvas-el', + exist_canvas = pJS_tag.getElementsByClassName(pJS_canvas_class); + + /* remove canvas if exists into the pJS target tag */ + if (exist_canvas.length) { + while (exist_canvas.length > 0) { + pJS_tag.removeChild(exist_canvas[0]); + } + } + + /* create canvas element */ + var canvas_el = document.createElement('canvas'); + canvas_el.className = pJS_canvas_class; + + /* set size canvas */ + canvas_el.style.width = "100%"; + canvas_el.style.height = "100%"; + + /* append canvas */ + var canvas = document.getElementById(tag_id).appendChild(canvas_el); + + /* launch particle.js */ + if (canvas != null) { + pJSDom.push(new pJS(tag_id, params)); + } + +}; + +window.particlesJS.load = function(tag_id, path_config_json, callback) { + + /* load json config */ + var xhr = new XMLHttpRequest(); + xhr.open('GET', path_config_json); + xhr.onreadystatechange = function(data) { + if (xhr.readyState == 4) { + if (xhr.status == 200) { + var params = JSON.parse(data.currentTarget.response); + window.particlesJS(tag_id, params); + if (callback) callback(); + } else { + console.log('Error pJS - XMLHttpRequest status: ' + xhr.status); + console.log('Error pJS - File config not found'); + } + } + }; + xhr.send(); + +}; \ No newline at end of file diff --git a/popup.js b/popup.js new file mode 100644 index 0000000..ab18831 --- /dev/null +++ b/popup.js @@ -0,0 +1,158 @@ +// Event listener for the popup closure + +document.addEventListener('onPopupClose', function(e) { + console.log('Creativa Popup closed ID: ' + e.detail); +}); + +function popup1() { + CreativaPopup.create('Feel free to DM me ! zOrangee#6593 ❤', 'Discord'); +} + +function popup2() { + CreativaPopup.create('This is the text of the popup.', 'Title', 'info'); +} + +function popup3() { + CreativaPopup.create('This is the text of the popup.', 'Title', 'fruit.png'); +} + +function popup4() { + CreativaPopup.create('This is the text of the popup.', 'Title', 'success', { + image: 'image.jpg' + }); +} + +function popup5() { + CreativaPopup.create('You can\'t close this popup.', 'Title', '', { + isBlocked: true + }); +} + +function popup6() { + CreativaPopup.create('', '', '', { + content: 'This is HTML custom content.' + }); +} + +function popup7() { + CreativaPopup.create('', '', '', { + content: 'another-page.html', + isPage: true + }); +} + +function popup8() { + CreativaPopup.create('This is the text of the popup.', 'Title', 'info', { + width: '400px', + height: '400px' + }); +} + +function popup9() { + CreativaPopup.create('This is the text of the popup.', 'Title', 'info', { + openAnimation: 'card-left', + closeAnimation: 'card-right' + }); +} + +function popup10() { + CreativaPopup.create('This is the text of the popup.', 'Title', '', { + position: 'top', + openAnimation: 'bubble', + closeAnimation: 'bubble' + }); +} + +function popup11() { + CreativaPopup.create('First popup.', 'Title', '', { + closeAnimation: 'bubble' + }); + CreativaPopup.create('Second popup.', 'Title', '', { + closeAnimation: 'card-left' + }); + CreativaPopup.create('Third popup.', 'Title', '', { + closeAnimation: 'card-right' + }); +} + +function popup12() { + CreativaPopup.create('This popup has a different background color.', 'Title', '', { + bgColor: '#ff0000' + }); +} + +function popup13() { + CreativaPopup.create('Feel free to DM me ! zOrangee#6593 ❤
or join my discord server https://discord.gg/sNeEW2j8 ', 'Discord', '', { + titleColor: '#6ffcff', + textColor: '#b0b0b0' + }); + +} + +function allahm109kd() { + navigator.clipboard.writeText("! zOrangee#6593"); + setTimeout(function() { + alert("Discord username was copied to the clipboard"); + }, 50); +} + +function allahm109kd1() { + navigator.clipboard.writeText("! zOrangee#6593"); + setTimeout(function() { + alert("Discord username was copied to the clipboard"); + }, 50); +} + +function popup132() { + CreativaPopup.create('Close me :)', '', '', { + titleColor: '#b0b0b0', + textColor: '#b0b0b0', + }); +} + +function popup14() { + CreativaPopup.create('This popup has a custom border radius.', 'Title', '', { + borderRadius: '2px' + }); +} + +function popup15() { + CreativaPopup.create('This popup has a custom font.', 'Title', '', { + fontFamily: 'Times New Roman' + }); +} + +function popup16() { + CreativaPopup.create('This popup has no close button.', 'Title', '', { + closeButton: false + }); +} + +function popup17() { + CreativaPopup.create('This popup has no background.', 'Title', '', { + background: false + }); +} + +function popup18() { + CreativaPopup.create('This popup will close after 3 seconds.', 'Title', '', { + timer: 3, + closeAnimation: 'card-right' + }); +} + +function popup19() { + CreativaPopup.create('This popup has a custom speed animation.', 'Title', '', { + openAnimation: 'card-top', + closeAnimation: 'card-bottom', + animationSpeed: 400 + }); +} + +function popup20() { + CreativaPopup.create('This is a popup without the box.', 'Title', '', { + box: false, + titleColor: '#fff', + textColor: '#fff' + }); +} \ No newline at end of file diff --git a/title.js b/title.js new file mode 100644 index 0000000..d7227fb --- /dev/null +++ b/title.js @@ -0,0 +1,25 @@ +if (document.addEventListener) { + document.addEventListener("DOMContentLoaded", function() { + loaded(); + }); +} else if (document.attachEvent) { + document.attachEvent("onreadystatechange", function() { + loaded(); + }); +} + +function loaded() { + + setInterval(loop, 585); + +} + +var x = 0; + +var titleText = ["ORANGE", "WARE" , "ON", "TOP"]; + +function loop() { + + document.getElementsByTagName("title")[0].innerHTML = titleText[x++ % titleText.length]; + +} \ No newline at end of file diff --git a/typed.js b/typed.js new file mode 100644 index 0000000..e0d5151 --- /dev/null +++ b/typed.js @@ -0,0 +1,1150 @@ +/*! + * + * typed.js - A JavaScript Typing Animation Library + * Author: Matt Boldt + * Version: v2.0.12 + * Url: https://github.com/mattboldt/typed.js + * License(s): MIT + * + */ +(function webpackUniversalModuleDefinition(root, factory) { + if (typeof exports === 'object' && typeof module === 'object') + module.exports = factory(); + else if (typeof define === 'function' && define.amd) + define([], factory); + else if (typeof exports === 'object') + exports["Typed"] = factory(); + else + root["Typed"] = factory(); +})(this, function() { + return /******/ (function(modules) { // webpackBootstrap + /******/ // The module cache + /******/ + var installedModules = {}; + /******/ + /******/ // The require function + /******/ + function __webpack_require__(moduleId) { + /******/ + /******/ // Check if module is in cache + /******/ + if (installedModules[moduleId]) + /******/ + return installedModules[moduleId].exports; + /******/ + /******/ // Create a new module (and put it into the cache) + /******/ + var module = installedModules[moduleId] = { + /******/ + exports: {}, + /******/ + id: moduleId, + /******/ + loaded: false + /******/ + }; + /******/ + /******/ // Execute the module function + /******/ + modules[moduleId].call(module.exports, module, module.exports, __webpack_require__); + /******/ + /******/ // Flag the module as loaded + /******/ + module.loaded = true; + /******/ + /******/ // Return the exports of the module + /******/ + return module.exports; + /******/ + } + /******/ + /******/ + /******/ // expose the modules object (__webpack_modules__) + /******/ + __webpack_require__.m = modules; + /******/ + /******/ // expose the module cache + /******/ + __webpack_require__.c = installedModules; + /******/ + /******/ // __webpack_public_path__ + /******/ + __webpack_require__.p = ""; + /******/ + /******/ // Load entry module and return exports + /******/ + return __webpack_require__(0); + /******/ + }) + /************************************************************************/ + /******/ + ([ + /* 0 */ + /***/ + (function(module, exports, __webpack_require__) { + + 'use strict'; + + Object.defineProperty(exports, '__esModule', { + value: true + }); + + var _createClass = (function() { + function defineProperties(target, props) { + for (var i = 0; i < props.length; i++) { + var descriptor = props[i]; + descriptor.enumerable = descriptor.enumerable || false; + descriptor.configurable = true; + if ('value' in descriptor) descriptor.writable = true; + Object.defineProperty(target, descriptor.key, descriptor); + } + } + return function(Constructor, protoProps, staticProps) { + if (protoProps) defineProperties(Constructor.prototype, protoProps); + if (staticProps) defineProperties(Constructor, staticProps); + return Constructor; + }; + })(); + + function _classCallCheck(instance, Constructor) { + if (!(instance instanceof Constructor)) { + throw new TypeError('Cannot call a class as a function'); + } + } + + var _initializerJs = __webpack_require__(1); + + var _htmlParserJs = __webpack_require__(3); + + /** + * Welcome to Typed.js! + * @param {string} elementId HTML element ID _OR_ HTML element + * @param {object} options options object + * @returns {object} a new Typed object + */ + + var Typed = (function() { + function Typed(elementId, options) { + _classCallCheck(this, Typed); + + // Initialize it up + _initializerJs.initializer.load(this, options, elementId); + // All systems go! + this.begin(); + } + + /** + * Toggle start() and stop() of the Typed instance + * @public + */ + + _createClass(Typed, [{ + key: 'toggle', + value: function toggle() { + this.pause.status ? this.start() : this.stop(); + } + + /** + * Stop typing / backspacing and enable cursor blinking + * @public + */ + }, { + key: 'stop', + value: function stop() { + if (this.typingComplete) return; + if (this.pause.status) return; + this.toggleBlinking(true); + this.pause.status = true; + this.options.onStop(this.arrayPos, this); + } + + /** + * Start typing / backspacing after being stopped + * @public + */ + }, { + key: 'start', + value: function start() { + if (this.typingComplete) return; + if (!this.pause.status) return; + this.pause.status = false; + if (this.pause.typewrite) { + this.typewrite(this.pause.curString, this.pause.curStrPos); + } else { + this.backspace(this.pause.curString, this.pause.curStrPos); + } + this.options.onStart(this.arrayPos, this); + } + + /** + * Destroy this instance of Typed + * @public + */ + }, { + key: 'destroy', + value: function destroy() { + this.reset(false); + this.options.onDestroy(this); + } + + /** + * Reset Typed and optionally restarts + * @param {boolean} restart + * @public + */ + }, { + key: 'reset', + value: function reset() { + var restart = arguments.length <= 0 || arguments[0] === undefined ? true : arguments[0]; + + clearInterval(this.timeout); + this.replaceText(''); + if (this.cursor && this.cursor.parentNode) { + this.cursor.parentNode.removeChild(this.cursor); + this.cursor = null; + } + this.strPos = 0; + this.arrayPos = 0; + this.curLoop = 0; + if (restart) { + this.insertCursor(); + this.options.onReset(this); + this.begin(); + } + } + + /** + * Begins the typing animation + * @private + */ + }, { + key: 'begin', + value: function begin() { + var _this = this; + + this.options.onBegin(this); + this.typingComplete = false; + this.shuffleStringsIfNeeded(this); + this.insertCursor(); + if (this.bindInputFocusEvents) this.bindFocusEvents(); + this.timeout = setTimeout(function() { + // Check if there is some text in the element, if yes start by backspacing the default message + if (!_this.currentElContent || _this.currentElContent.length === 0) { + _this.typewrite(_this.strings[_this.sequence[_this.arrayPos]], _this.strPos); + } else { + // Start typing + _this.backspace(_this.currentElContent, _this.currentElContent.length); + } + }, this.startDelay); + } + + /** + * Called for each character typed + * @param {string} curString the current string in the strings array + * @param {number} curStrPos the current position in the curString + * @private + */ + }, { + key: 'typewrite', + value: function typewrite(curString, curStrPos) { + var _this2 = this; + + if (this.fadeOut && this.el.classList.contains(this.fadeOutClass)) { + this.el.classList.remove(this.fadeOutClass); + if (this.cursor) this.cursor.classList.remove(this.fadeOutClass); + } + + var humanize = this.humanizer(this.typeSpeed); + var numChars = 1; + + if (this.pause.status === true) { + this.setPauseStatus(curString, curStrPos, true); + return; + } + + // contain typing function in a timeout humanize'd delay + this.timeout = setTimeout(function() { + // skip over any HTML chars + curStrPos = _htmlParserJs.htmlParser.typeHtmlChars(curString, curStrPos, _this2); + + var pauseTime = 0; + var substr = curString.substr(curStrPos); + // check for an escape character before a pause value + // format: \^\d+ .. eg: ^1000 .. should be able to print the ^ too using ^^ + // single ^ are removed from string + if (substr.charAt(0) === '^') { + if (/^\^\d+/.test(substr)) { + var skip = 1; // skip at least 1 + substr = /\d+/.exec(substr)[0]; + skip += substr.length; + pauseTime = parseInt(substr); + _this2.temporaryPause = true; + _this2.options.onTypingPaused(_this2.arrayPos, _this2); + // strip out the escape character and pause value so they're not printed + curString = curString.substring(0, curStrPos) + curString.substring(curStrPos + skip); + _this2.toggleBlinking(true); + } + } + + // check for skip characters formatted as + // "this is a `string to print NOW` ..." + if (substr.charAt(0) === '`') { + while (curString.substr(curStrPos + numChars).charAt(0) !== '`') { + numChars++; + if (curStrPos + numChars > curString.length) break; + } + // strip out the escape characters and append all the string in between + var stringBeforeSkip = curString.substring(0, curStrPos); + var stringSkipped = curString.substring(stringBeforeSkip.length + 1, curStrPos + numChars); + var stringAfterSkip = curString.substring(curStrPos + numChars + 1); + curString = stringBeforeSkip + stringSkipped + stringAfterSkip; + numChars--; + } + + // timeout for any pause after a character + _this2.timeout = setTimeout(function() { + // Accounts for blinking while paused + _this2.toggleBlinking(false); + + // We're done with this sentence! + if (curStrPos >= curString.length) { + _this2.doneTyping(curString, curStrPos); + } else { + _this2.keepTyping(curString, curStrPos, numChars); + } + // end of character pause + if (_this2.temporaryPause) { + _this2.temporaryPause = false; + _this2.options.onTypingResumed(_this2.arrayPos, _this2); + } + }, pauseTime); + + // humanized value for typing + }, humanize); + } + + /** + * Continue to the next string & begin typing + * @param {string} curString the current string in the strings array + * @param {number} curStrPos the current position in the curString + * @private + */ + }, { + key: 'keepTyping', + value: function keepTyping(curString, curStrPos, numChars) { + // call before functions if applicable + if (curStrPos === 0) { + this.toggleBlinking(false); + this.options.preStringTyped(this.arrayPos, this); + } + // start typing each new char into existing string + // curString: arg, this.el.html: original text inside element + curStrPos += numChars; + var nextString = curString.substr(0, curStrPos); + this.replaceText(nextString); + // loop the function + this.typewrite(curString, curStrPos); + } + + /** + * We're done typing the current string + * @param {string} curString the current string in the strings array + * @param {number} curStrPos the current position in the curString + * @private + */ + }, { + key: 'doneTyping', + value: function doneTyping(curString, curStrPos) { + var _this3 = this; + + // fires callback function + this.options.onStringTyped(this.arrayPos, this); + this.toggleBlinking(true); + // is this the final string + if (this.arrayPos === this.strings.length - 1) { + // callback that occurs on the last typed string + this.complete(); + // quit if we wont loop back + if (this.loop === false || this.curLoop === this.loopCount) { + return; + } + } + this.timeout = setTimeout(function() { + _this3.backspace(curString, curStrPos); + }, this.backDelay); + } + + /** + * Backspaces 1 character at a time + * @param {string} curString the current string in the strings array + * @param {number} curStrPos the current position in the curString + * @private + */ + }, { + key: 'backspace', + value: function backspace(curString, curStrPos) { + var _this4 = this; + + if (this.pause.status === true) { + this.setPauseStatus(curString, curStrPos, false); + return; + } + if (this.fadeOut) return this.initFadeOut(); + + this.toggleBlinking(false); + var humanize = this.humanizer(this.backSpeed); + + this.timeout = setTimeout(function() { + curStrPos = _htmlParserJs.htmlParser.backSpaceHtmlChars(curString, curStrPos, _this4); + // replace text with base text + typed characters + var curStringAtPosition = curString.substr(0, curStrPos); + _this4.replaceText(curStringAtPosition); + + // if smartBack is enabled + if (_this4.smartBackspace) { + // the remaining part of the current string is equal of the same part of the new string + var nextString = _this4.strings[_this4.arrayPos + 1]; + if (nextString && curStringAtPosition === nextString.substr(0, curStrPos)) { + _this4.stopNum = curStrPos; + } else { + _this4.stopNum = 0; + } + } + + // if the number (id of character in current string) is + // less than the stop number, keep going + if (curStrPos > _this4.stopNum) { + // subtract characters one by one + curStrPos--; + // loop the function + _this4.backspace(curString, curStrPos); + } else if (curStrPos <= _this4.stopNum) { + // if the stop number has been reached, increase + // array position to next string + _this4.arrayPos++; + // When looping, begin at the beginning after backspace complete + if (_this4.arrayPos === _this4.strings.length) { + _this4.arrayPos = 0; + _this4.options.onLastStringBackspaced(); + _this4.shuffleStringsIfNeeded(); + _this4.begin(); + } else { + _this4.typewrite(_this4.strings[_this4.sequence[_this4.arrayPos]], curStrPos); + } + } + // humanized value for typing + }, humanize); + } + + /** + * Full animation is complete + * @private + */ + }, { + key: 'complete', + value: function complete() { + this.options.onComplete(this); + if (this.loop) { + this.curLoop++; + } else { + this.typingComplete = true; + } + } + + /** + * Has the typing been stopped + * @param {string} curString the current string in the strings array + * @param {number} curStrPos the current position in the curString + * @param {boolean} isTyping + * @private + */ + }, { + key: 'setPauseStatus', + value: function setPauseStatus(curString, curStrPos, isTyping) { + this.pause.typewrite = isTyping; + this.pause.curString = curString; + this.pause.curStrPos = curStrPos; + } + + /** + * Toggle the blinking cursor + * @param {boolean} isBlinking + * @private + */ + }, { + key: 'toggleBlinking', + value: function toggleBlinking(isBlinking) { + if (!this.cursor) return; + // if in paused state, don't toggle blinking a 2nd time + if (this.pause.status) return; + if (this.cursorBlinking === isBlinking) return; + this.cursorBlinking = isBlinking; + if (isBlinking) { + this.cursor.classList.add('typed-cursor--blink'); + } else { + this.cursor.classList.remove('typed-cursor--blink'); + } + } + + /** + * Speed in MS to type + * @param {number} speed + * @private + */ + }, { + key: 'humanizer', + value: function humanizer(speed) { + return Math.round(Math.random() * speed / 2) + speed; + } + + /** + * Shuffle the sequence of the strings array + * @private + */ + }, { + key: 'shuffleStringsIfNeeded', + value: function shuffleStringsIfNeeded() { + if (!this.shuffle) return; + this.sequence = this.sequence.sort(function() { + return Math.random() - 0.5; + }); + } + + /** + * Adds a CSS class to fade out current string + * @private + */ + }, { + key: 'initFadeOut', + value: function initFadeOut() { + var _this5 = this; + + this.el.className += ' ' + this.fadeOutClass; + if (this.cursor) this.cursor.className += ' ' + this.fadeOutClass; + return setTimeout(function() { + _this5.arrayPos++; + _this5.replaceText(''); + + // Resets current string if end of loop reached + if (_this5.strings.length > _this5.arrayPos) { + _this5.typewrite(_this5.strings[_this5.sequence[_this5.arrayPos]], 0); + } else { + _this5.typewrite(_this5.strings[0], 0); + _this5.arrayPos = 0; + } + }, this.fadeOutDelay); + } + + /** + * Replaces current text in the HTML element + * depending on element type + * @param {string} str + * @private + */ + }, { + key: 'replaceText', + value: function replaceText(str) { + if (this.attr) { + this.el.setAttribute(this.attr, str); + } else { + if (this.isInput) { + this.el.value = str; + } else if (this.contentType === 'html') { + this.el.innerHTML = str; + } else { + this.el.textContent = str; + } + } + } + + /** + * If using input elements, bind focus in order to + * start and stop the animation + * @private + */ + }, { + key: 'bindFocusEvents', + value: function bindFocusEvents() { + var _this6 = this; + + if (!this.isInput) return; + this.el.addEventListener('focus', function(e) { + _this6.stop(); + }); + this.el.addEventListener('blur', function(e) { + if (_this6.el.value && _this6.el.value.length !== 0) { + return; + } + _this6.start(); + }); + } + + /** + * On init, insert the cursor element + * @private + */ + }, { + key: 'insertCursor', + value: function insertCursor() { + if (!this.showCursor) return; + if (this.cursor) return; + this.cursor = document.createElement('span'); + this.cursor.className = 'typed-cursor'; + this.cursor.setAttribute('aria-hidden', true); + this.cursor.innerHTML = this.cursorChar; + this.el.parentNode && this.el.parentNode.insertBefore(this.cursor, this.el.nextSibling); + } + }]); + + return Typed; + })(); + + exports['default'] = Typed; + module.exports = exports['default']; + + /***/ + }), + /* 1 */ + /***/ + (function(module, exports, __webpack_require__) { + + 'use strict'; + + Object.defineProperty(exports, '__esModule', { + value: true + }); + + var _extends = Object.assign || function(target) { + for (var i = 1; i < arguments.length; i++) { + var source = arguments[i]; + for (var key in source) { + if (Object.prototype.hasOwnProperty.call(source, key)) { + target[key] = source[key]; + } + } + } + return target; + }; + + var _createClass = (function() { + function defineProperties(target, props) { + for (var i = 0; i < props.length; i++) { + var descriptor = props[i]; + descriptor.enumerable = descriptor.enumerable || false; + descriptor.configurable = true; + if ('value' in descriptor) descriptor.writable = true; + Object.defineProperty(target, descriptor.key, descriptor); + } + } + return function(Constructor, protoProps, staticProps) { + if (protoProps) defineProperties(Constructor.prototype, protoProps); + if (staticProps) defineProperties(Constructor, staticProps); + return Constructor; + }; + })(); + + function _interopRequireDefault(obj) { + return obj && obj.__esModule ? obj : { + 'default': obj + }; + } + + function _classCallCheck(instance, Constructor) { + if (!(instance instanceof Constructor)) { + throw new TypeError('Cannot call a class as a function'); + } + } + + var _defaultsJs = __webpack_require__(2); + + var _defaultsJs2 = _interopRequireDefault(_defaultsJs); + + /** + * Initialize the Typed object + */ + + var Initializer = (function() { + function Initializer() { + _classCallCheck(this, Initializer); + } + + _createClass(Initializer, [{ + key: 'load', + + /** + * Load up defaults & options on the Typed instance + * @param {Typed} self instance of Typed + * @param {object} options options object + * @param {string} elementId HTML element ID _OR_ instance of HTML element + * @private + */ + + value: function load(self, options, elementId) { + // chosen element to manipulate text + if (typeof elementId === 'string') { + self.el = document.querySelector(elementId); + } else { + self.el = elementId; + } + + self.options = _extends({}, _defaultsJs2['default'], options); + + // attribute to type into + self.isInput = self.el.tagName.toLowerCase() === 'input'; + self.attr = self.options.attr; + self.bindInputFocusEvents = self.options.bindInputFocusEvents; + + // show cursor + self.showCursor = self.isInput ? false : self.options.showCursor; + + // custom cursor + self.cursorChar = self.options.cursorChar; + + // Is the cursor blinking + self.cursorBlinking = true; + + // text content of element + self.elContent = self.attr ? self.el.getAttribute(self.attr) : self.el.textContent; + + // html or plain text + self.contentType = self.options.contentType; + + // typing speed + self.typeSpeed = self.options.typeSpeed; + + // add a delay before typing starts + self.startDelay = self.options.startDelay; + + // backspacing speed + self.backSpeed = self.options.backSpeed; + + // only backspace what doesn't match the previous string + self.smartBackspace = self.options.smartBackspace; + + // amount of time to wait before backspacing + self.backDelay = self.options.backDelay; + + // Fade out instead of backspace + self.fadeOut = self.options.fadeOut; + self.fadeOutClass = self.options.fadeOutClass; + self.fadeOutDelay = self.options.fadeOutDelay; + + // variable to check whether typing is currently paused + self.isPaused = false; + + // input strings of text + self.strings = self.options.strings.map(function(s) { + return s.trim(); + }); + + // div containing strings + if (typeof self.options.stringsElement === 'string') { + self.stringsElement = document.querySelector(self.options.stringsElement); + } else { + self.stringsElement = self.options.stringsElement; + } + + if (self.stringsElement) { + self.strings = []; + self.stringsElement.style.display = 'none'; + var strings = Array.prototype.slice.apply(self.stringsElement.children); + var stringsLength = strings.length; + + if (stringsLength) { + for (var i = 0; i < stringsLength; i += 1) { + var stringEl = strings[i]; + self.strings.push(stringEl.innerHTML.trim()); + } + } + } + + // character number position of current string + self.strPos = 0; + + // current array position + self.arrayPos = 0; + + // index of string to stop backspacing on + self.stopNum = 0; + + // Looping logic + self.loop = self.options.loop; + self.loopCount = self.options.loopCount; + self.curLoop = 0; + + // shuffle the strings + self.shuffle = self.options.shuffle; + // the order of strings + self.sequence = []; + + self.pause = { + status: false, + typewrite: true, + curString: '', + curStrPos: 0 + }; + + // When the typing is complete (when not looped) + self.typingComplete = false; + + // Set the order in which the strings are typed + for (var i in self.strings) { + self.sequence[i] = i; + } + + // If there is some text in the element + self.currentElContent = this.getCurrentElContent(self); + + self.autoInsertCss = self.options.autoInsertCss; + + this.appendAnimationCss(self); + } + }, { + key: 'getCurrentElContent', + value: function getCurrentElContent(self) { + var elContent = ''; + if (self.attr) { + elContent = self.el.getAttribute(self.attr); + } else if (self.isInput) { + elContent = self.el.value; + } else if (self.contentType === 'html') { + elContent = self.el.innerHTML; + } else { + elContent = self.el.textContent; + } + return elContent; + } + }, { + key: 'appendAnimationCss', + value: function appendAnimationCss(self) { + var cssDataName = 'data-typed-js-css'; + if (!self.autoInsertCss) { + return; + } + if (!self.showCursor && !self.fadeOut) { + return; + } + if (document.querySelector('[' + cssDataName + ']')) { + return; + } + + var css = document.createElement('style'); + css.type = 'text/css'; + css.setAttribute(cssDataName, true); + + var innerCss = ''; + if (self.showCursor) { + innerCss += '\n .typed-cursor{\n opacity: 1;\n }\n .typed-cursor.typed-cursor--blink{\n animation: typedjsBlink 0.7s infinite;\n -webkit-animation: typedjsBlink 0.7s infinite;\n animation: typedjsBlink 0.7s infinite;\n }\n @keyframes typedjsBlink{\n 50% { opacity: 0.0; }\n }\n @-webkit-keyframes typedjsBlink{\n 0% { opacity: 1; }\n 50% { opacity: 0.0; }\n 100% { opacity: 1; }\n }\n '; + } + if (self.fadeOut) { + innerCss += '\n .typed-fade-out{\n opacity: 0;\n transition: opacity .25s;\n }\n .typed-cursor.typed-cursor--blink.typed-fade-out{\n -webkit-animation: 0;\n animation: 0;\n }\n '; + } + if (css.length === 0) { + return; + } + css.innerHTML = innerCss; + document.body.appendChild(css); + } + }]); + + return Initializer; + })(); + + exports['default'] = Initializer; + var initializer = new Initializer(); + exports.initializer = initializer; + + /***/ + }), + /* 2 */ + /***/ + (function(module, exports) { + + /** + * Defaults & options + * @returns {object} Typed defaults & options + * @public + */ + + 'use strict'; + + Object.defineProperty(exports, '__esModule', { + value: true + }); + var defaults = { + /** + * @property {array} strings strings to be typed + * @property {string} stringsElement ID of element containing string children + */ + strings: ['These are the default values...', 'You know what you should do?', 'Use your own!', 'Have a great day!'], + stringsElement: null, + + /** + * @property {number} typeSpeed type speed in milliseconds + */ + typeSpeed: 0, + + /** + * @property {number} startDelay time before typing starts in milliseconds + */ + startDelay: 0, + + /** + * @property {number} backSpeed backspacing speed in milliseconds + */ + backSpeed: 0, + + /** + * @property {boolean} smartBackspace only backspace what doesn't match the previous string + */ + smartBackspace: true, + + /** + * @property {boolean} shuffle shuffle the strings + */ + shuffle: false, + + /** + * @property {number} backDelay time before backspacing in milliseconds + */ + backDelay: 700, + + /** + * @property {boolean} fadeOut Fade out instead of backspace + * @property {string} fadeOutClass css class for fade animation + * @property {boolean} fadeOutDelay Fade out delay in milliseconds + */ + fadeOut: false, + fadeOutClass: 'typed-fade-out', + fadeOutDelay: 500, + + /** + * @property {boolean} loop loop strings + * @property {number} loopCount amount of loops + */ + loop: false, + loopCount: Infinity, + + /** + * @property {boolean} showCursor show cursor + * @property {string} cursorChar character for cursor + * @property {boolean} autoInsertCss insert CSS for cursor and fadeOut into HTML + */ + showCursor: true, + cursorChar: '|', + autoInsertCss: true, + + /** + * @property {string} attr attribute for typing + * Ex: input placeholder, value, or just HTML text + */ + attr: null, + + /** + * @property {boolean} bindInputFocusEvents bind to focus and blur if el is text input + */ + bindInputFocusEvents: false, + + /** + * @property {string} contentType 'html' or 'null' for plaintext + */ + contentType: 'html', + + /** + * Before it begins typing + * @param {Typed} self + */ + onBegin: function onBegin(self) {}, + + /** + * All typing is complete + * @param {Typed} self + */ + onComplete: function onComplete(self) {}, + + /** + * Before each string is typed + * @param {number} arrayPos + * @param {Typed} self + */ + preStringTyped: function preStringTyped(arrayPos, self) {}, + + /** + * After each string is typed + * @param {number} arrayPos + * @param {Typed} self + */ + onStringTyped: function onStringTyped(arrayPos, self) {}, + + /** + * During looping, after last string is typed + * @param {Typed} self + */ + onLastStringBackspaced: function onLastStringBackspaced(self) {}, + + /** + * Typing has been stopped + * @param {number} arrayPos + * @param {Typed} self + */ + onTypingPaused: function onTypingPaused(arrayPos, self) {}, + + /** + * Typing has been started after being stopped + * @param {number} arrayPos + * @param {Typed} self + */ + onTypingResumed: function onTypingResumed(arrayPos, self) {}, + + /** + * After reset + * @param {Typed} self + */ + onReset: function onReset(self) {}, + + /** + * After stop + * @param {number} arrayPos + * @param {Typed} self + */ + onStop: function onStop(arrayPos, self) {}, + + /** + * After start + * @param {number} arrayPos + * @param {Typed} self + */ + onStart: function onStart(arrayPos, self) {}, + + /** + * After destroy + * @param {Typed} self + */ + onDestroy: function onDestroy(self) {} + }; + + exports['default'] = defaults; + module.exports = exports['default']; + + /***/ + }), + /* 3 */ + /***/ + (function(module, exports) { + + /** + * TODO: These methods can probably be combined somehow + * Parse HTML tags & HTML Characters + */ + + 'use strict'; + + Object.defineProperty(exports, '__esModule', { + value: true + }); + + var _createClass = (function() { + function defineProperties(target, props) { + for (var i = 0; i < props.length; i++) { + var descriptor = props[i]; + descriptor.enumerable = descriptor.enumerable || false; + descriptor.configurable = true; + if ('value' in descriptor) descriptor.writable = true; + Object.defineProperty(target, descriptor.key, descriptor); + } + } + return function(Constructor, protoProps, staticProps) { + if (protoProps) defineProperties(Constructor.prototype, protoProps); + if (staticProps) defineProperties(Constructor, staticProps); + return Constructor; + }; + })(); + + function _classCallCheck(instance, Constructor) { + if (!(instance instanceof Constructor)) { + throw new TypeError('Cannot call a class as a function'); + } + } + + var HTMLParser = (function() { + function HTMLParser() { + _classCallCheck(this, HTMLParser); + } + + _createClass(HTMLParser, [{ + key: 'typeHtmlChars', + + /** + * Type HTML tags & HTML Characters + * @param {string} curString Current string + * @param {number} curStrPos Position in current string + * @param {Typed} self instance of Typed + * @returns {number} a new string position + * @private + */ + + value: function typeHtmlChars(curString, curStrPos, self) { + if (self.contentType !== 'html') return curStrPos; + var curChar = curString.substr(curStrPos).charAt(0); + if (curChar === '<' || curChar === '&') { + var endTag = ''; + if (curChar === '<') { + endTag = '>'; + } else { + endTag = ';'; + } + while (curString.substr(curStrPos + 1).charAt(0) !== endTag) { + curStrPos++; + if (curStrPos + 1 > curString.length) { + break; + } + } + curStrPos++; + } + return curStrPos; + } + + /** + * Backspace HTML tags and HTML Characters + * @param {string} curString Current string + * @param {number} curStrPos Position in current string + * @param {Typed} self instance of Typed + * @returns {number} a new string position + * @private + */ + }, { + key: 'backSpaceHtmlChars', + value: function backSpaceHtmlChars(curString, curStrPos, self) { + if (self.contentType !== 'html') return curStrPos; + var curChar = curString.substr(curStrPos).charAt(0); + if (curChar === '>' || curChar === ';') { + var endTag = ''; + if (curChar === '>') { + endTag = '<'; + } else { + endTag = '&'; + } + while (curString.substr(curStrPos - 1).charAt(0) !== endTag) { + curStrPos--; + if (curStrPos < 0) { + break; + } + } + curStrPos--; + } + return curStrPos; + } + }]); + + return HTMLParser; + })(); + + exports['default'] = HTMLParser; + var htmlParser = new HTMLParser(); + exports.htmlParser = htmlParser; + + /***/ + }) + /******/ + ]) +});; \ No newline at end of file