working on typescript
This commit is contained in:
Matteo Manzinello committed
1 parent
1606a2b30a
commit
5058578a7a
9 files changed
+1642
-20
No files matched your search
Vendored
+1
-1
@@ -1 +1 @@
|
||||
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.mailgo=t():e.mailgo=t()}(window,(function(){return function(e){var t={};function o(a){if(t[a])return t[a].exports;var n=t[a]={i:a,l:!1,exports:{}};return e[a].call(n.exports,n,n.exports,o),n.l=!0,n.exports}return o.m=e,o.c=t,o.d=function(e,t,a){o.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:a})},o.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},o.t=function(e,t){if(1&t&&(e=o(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var a=Object.create(null);if(o.r(a),Object.defineProperty(a,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var n in e)o.d(a,n,function(t){return e[t]}.bind(null,n));return a},o.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return o.d(t,"a",t),t},o.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},o.p="",o(o.s=0)}([function(e,t,o){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=void 0;var a=function(){function e(){var e=Y();e.style.display="none",e.id="mailgo",e.classList.add("m-modal");var t=Y();t.className="m-modal-back",e.appendChild(t);var o=Y();o.className="m-modal-content",e.appendChild(o),(i=Y("strong")).id="m-title",i.className="m-title",o.appendChild(i);var a=Y();a.id="m-details",a.className="m-details",(l=Y("p")).id="m-cc";var n=Y(S);n.className="w-500",n.appendChild(ee("cc ")),(m=Y(S)).id="m-cc-value",l.appendChild(n),l.appendChild(m),a.appendChild(l),(r=Y("p")).id="m-bcc";var L=Y(S);L.className="w-500",L.appendChild(ee("bcc ")),(p=Y(S)).id="m-bcc-value",r.appendChild(L),r.appendChild(p),a.appendChild(r),(c=Y("p")).id="m-subject";var z=Y(S);z.className="w-500",z.appendChild(ee("subject ")),(u=Y(S)).id="m-subject-value",c.appendChild(z),c.appendChild(u),a.appendChild(c),(s=Y("p")).id="m-body";var j=Y(S);j.className="w-500",j.appendChild(ee("body ")),(b=Y(S)).id="m-body-value",s.appendChild(j),s.appendChild(b),a.appendChild(s),o.appendChild(a),(f=Y("a")).id="m-gmail",f.href=N,f.classList.add("m-open"),f.classList.add("m-gmail"),f.appendChild(ee("open in "));var A=Y(S);A.className="w-500",A.appendChild(ee("Gmail")),f.appendChild(A),o.appendChild(f),(h=Y("a")).id="m-outlook",h.href=N,h.classList.add("m-open"),h.classList.add("m-outlook"),h.appendChild(ee("open in "));var E=Y(S);E.className="w-500",E.appendChild(ee("Outlook")),h.appendChild(E),o.appendChild(h),(g=Y("a")).id="m-open",g.href=N,g.classList.add("m-open"),g.classList.add("m-default");var R=Y(S);R.className="w-500",R.appendChild(ee("open")),g.appendChild(R),g.appendChild(ee(" default")),o.appendChild(g),(C=Y("a")).id="m-copy",C.href=N,C.classList.add("m-copy"),C.classList.add("w-500"),C.appendChild(ee("copy")),o.appendChild(C),o.appendChild(X()),document.body.appendChild(e),t.addEventListener("click",Q);var _=Y();_.style.display="none",_.id="mailgo-tel",_.classList.add("m-modal");var M=Y();M.className="m-modal-back",_.appendChild(M);var U=Y();U.className="m-modal-content",_.appendChild(U),(d=Y("strong")).id="m-tel-title",d.className="m-title",U.appendChild(d),(x=Y("a")).id="m-tg",x.href=N,x.classList.add("m-open"),x.classList.add("m-tg"),x.style.display="none",x.appendChild(ee("open in "));var I=Y(S);I.className="w-500",I.appendChild(ee("Telegram")),x.appendChild(I),U.appendChild(x),(v=Y("a")).id="m-wa",v.href=N,v.classList.add("m-open"),v.classList.add("m-wa"),v.appendChild(ee("open in "));var T=Y(S);T.className="w-500",T.appendChild(ee("WhatsApp")),v.appendChild(T),U.appendChild(v),(w=Y("a")).id="m-skype",w.href=N,w.classList.add("m-open"),w.classList.add("m-skype"),w.appendChild(ee("open in "));var O=Y(S);O.className="w-500",O.appendChild(ee("Skype")),w.appendChild(O),U.appendChild(w),(y=Y("a")).id="m-call",y.href=N,y.classList.add("m-open"),y.classList.add("m-default");var P=Y(S);P.className="w-500",P.appendChild(ee("call")),y.appendChild(P),y.appendChild(ee(" as default")),U.appendChild(y),(k=Y("a")).id="m-tel-copy",k.href=N,k.classList.add("m-copy"),k.classList.add("w-500"),k.appendChild(ee("copy")),U.appendChild(k),U.appendChild(X()),document.body.appendChild(_),M.addEventListener("click",Q)}function t(e,t){var o=0<arguments.length&&void 0!==e?e:A,a=1<arguments.length?t:void 0;if(o===A){if(a.href&&a.href.toLowerCase().startsWith(L)){R=decodeURIComponent(a.href.split("?")[0].split(L)[1].trim());var n=new URL(a.href).searchParams;M=n.get("cc"),U=n.get("bcc"),I=n.get("subject"),T=n.get("body")}else R=a.getAttribute("data-address")+"@"+a.getAttribute("data-domain"),new URL(L+encodeURIComponent(R)),M=a.getAttribute("data-cc-address")+"@"+a.getAttribute("data-cc-domain"),U=a.getAttribute("data-bcc-address")+"@"+a.getAttribute("data-bcc-domain"),I=a.getAttribute("data-subject"),T=a.getAttribute("data-body");if(!Line truncated
|
||||
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var mailgoVersion="0.9.0",mailgo=function(){function t(){var e=ee();e.style.display="none",e.id="mailgo",e.classList.add("m-modal");var t=ee();t.className="m-modal-back",e.appendChild(t);var a=ee();a.className="m-modal-content",e.appendChild(a),(w=ee("strong")).id="m-title",w.className="m-title",a.appendChild(w);var o=ee();o.id="m-details",o.className="m-details",(v=ee("p")).id="m-cc";var n=ee(H);n.className="w-500",n.appendChild(te("cc ")),(L=ee(H)).id="m-cc-value",v.appendChild(n),v.appendChild(L),o.appendChild(v),(y=ee("p")).id="m-bcc";var i=ee(H);i.className="w-500",i.appendChild(te("bcc ")),(z=ee(H)).id="m-bcc-value",y.appendChild(i),y.appendChild(z),o.appendChild(y),(C=ee("p")).id="m-subject";var d=ee(H);d.className="w-500",d.appendChild(te("subject ")),(A=ee(H)).id="m-subject-value",C.appendChild(d),C.appendChild(A),o.appendChild(C),(k=ee("p")).id="m-body";var l=ee(H);l.className="w-500",l.appendChild(te("body ")),(E=ee(H)).id="m-body-value",k.appendChild(l),k.appendChild(E),o.appendChild(k),a.appendChild(o),(N=ee("a")).id="m-gmail",N.href=W,N.classList.add("m-open"),N.classList.add("m-gmail"),N.appendChild(te("open in "));var s=ee(H);s.className="w-500",s.appendChild(te("Gmail")),N.appendChild(s),a.appendChild(N),(j=ee("a")).id="m-outlook",j.href=W,j.classList.add("m-open"),j.classList.add("m-outlook"),j.appendChild(te("open in "));var c=ee(H);c.className="w-500",c.appendChild(te("Outlook")),j.appendChild(c),a.appendChild(j),(R=ee("a")).id="m-open",R.href=W,R.classList.add("m-open"),R.classList.add("m-default");var r=ee(H);r.className="w-500",r.appendChild(te("open")),R.appendChild(r),R.appendChild(te(" default")),a.appendChild(R),(M=ee("a")).id="m-copy",M.href=W,M.classList.add("m-copy"),M.classList.add("w-500"),M.appendChild(te("copy")),a.appendChild(M),a.appendChild(Y()),document.body.appendChild(e),t.addEventListener("click",Q);var m=ee();m.style.display="none",m.id="mailgo-tel",m.classList.add("m-modal");var p=ee();p.className="m-modal-back",m.appendChild(p);var b=ee();b.className="m-modal-content",m.appendChild(b),(x=ee("strong")).id="m-tel-title",x.className="m-title",b.appendChild(x),(U=ee("a")).id="m-tg",U.href=W,U.classList.add("m-open"),U.classList.add("m-tg"),U.style.display="none",U.appendChild(te("open in "));var u=ee(H);u.className="w-500",u.appendChild(te("Telegram")),U.appendChild(u),b.appendChild(U),(I=ee("a")).id="m-wa",I.href=W,I.classList.add("m-open"),I.classList.add("m-wa"),I.appendChild(te("open in "));var h=ee(H);h.className="w-500",h.appendChild(te("WhatsApp")),I.appendChild(h),b.appendChild(I),(S=ee("a")).id="m-skype",S.href=W,S.classList.add("m-open"),S.classList.add("m-skype"),S.appendChild(te("open in "));var f=ee(H);f.className="w-500",f.appendChild(te("Skype")),S.appendChild(f),b.appendChild(S),(_=ee("a")).id="m-call",_.href=W,_.classList.add("m-open"),_.classList.add("m-default");var g=ee(H);g.className="w-500",g.appendChild(te("call")),_.appendChild(g),_.appendChild(te(" as default")),b.appendChild(_),(T=ee("a")).id="m-tel-copy",T.href=W,T.classList.add("m-copy"),T.classList.add("w-500"),T.appendChild(te("copy")),b.appendChild(T),b.appendChild(Y()),document.body.appendChild(m),p.addEventListener("click",Q)}function a(e,t){var a=0<arguments.length&&void 0!==e?e:c,o=1<arguments.length?t:void 0;if(a===c){if(o.href&&o.href.toLowerCase().startsWith(d)){m=decodeURIComponent(o.href.split("?")[0].split(d)[1].trim());var n=new URL(o.href).searchParams;b=n.get("cc"),u=n.get("bcc"),h=n.get("subject"),f=n.get("body")}else m=o.getAttribute("data-address")+"@"+o.getAttribute("data-domain"),new URL(d+encodeURIComponent(m)),b=o.getAttribute("data-cc-address")+"@"+o.getAttribute("data-cc-domain"),u=o.getAttribute("data-bcc-address")+"@"+o.getAttribute("data-bcc-domain"),h=o.getAttribute("data-subject"),f=o.getAttribute("data-body");if(!le(m.split(",")))return;b&&!le(b.split(","))&&(b=""),u&&!le(u.split(","))&&(u=""),w.innerHTML=m.split(",").join("<br/>"),b?(v.style.display="block",L.innerHTML=b.split(",").join("<br/>")):v.style.display="none",u?(y.style.display="block",z.innerHTML=u.split(",").join("<br/>")):y.style.display="none",h?(C.style.display="block",A.textContent=h):C.style.display="none",f?(k.style.display="block",E.textContent=f):k.style.display="none",N.addEventListener("click",O),j.addEventListener("click",B),p=ae(m),R.addEventListener("click",Z),M.addEventListener("click",function(){return q(m)})}a===r&&(o.href&&o.href.toLowerCase().startsWith(l)?g=decodeURIComponent(o.href.split("?")[0].split(l)[1].trim()):o.href&&o.href.toLowerCase().startsWith(s)?g=decodeURIComponent(o.href.split("?")[0].split(s)[1].trim()):o.hasAttribute("data-tel")&&(g=o.getAttribute("data-tel"),o.getAttribute("data-msg")),o.hasAttribute("data-telegram")&&(D=o.getAttribute("data-telegram")),o.hasAttribute("data-skype")&&(P=o.getAttribute("data-skype")),x.innerHTML=g,I.addEventListener("click",V),D&&(ie("m-tgLine truncated
|
||||
+16
-1
@@ -47,7 +47,22 @@ function js() {
|
||||
.pipe(dest("dist"));
|
||||
}
|
||||
|
||||
function jsUmd() {
|
||||
let cssMinContent = fs.readFileSync("dist/mailgo.min.css", "utf8");
|
||||
return (
|
||||
src("src/*.ts")
|
||||
.pipe(replace("MAILGO_VERSION", version))
|
||||
.pipe(replace("MAILGO_STYLE", cssMinContent))
|
||||
// .pipe(tsProject())
|
||||
// .pipe(babel())
|
||||
// .pipe(uglify())
|
||||
.pipe(dest("./"))
|
||||
);
|
||||
}
|
||||
|
||||
exports.js = js;
|
||||
exports.jsUmd = jsUmd;
|
||||
|
||||
exports.style = style;
|
||||
|
||||
exports.default = series(style, js);
|
||||
exports.default = series(style, js, jsUmd);
|
||||
Vendored
+9
@@ -0,0 +1,9 @@
|
||||
// Type definitions for mailgo
|
||||
// Project: mailgo
|
||||
// Definitions by: Matteo Manzinello <https://matteomanzinello.com>
|
||||
|
||||
export as namespace Mailgo;
|
||||
|
||||
/*~ If this module has methods, declare them as functions like so.
|
||||
*/
|
||||
export function mailgo(mailgoConfig: any): void;
|
||||
Vendored
-1
@@ -1 +0,0 @@
|
||||
declare module "mailgo" {}
|
||||
@@ -1 +1,751 @@
|
||||
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.mailgo=t():e.mailgo=t()}(window,(function(){return function(e){var t={};function o(a){if(t[a])return t[a].exports;var n=t[a]={i:a,l:!1,exports:{}};return e[a].call(n.exports,n,n.exports,o),n.l=!0,n.exports}return o.m=e,o.c=t,o.d=function(e,t,a){o.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:a})},o.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},o.t=function(e,t){if(1&t&&(e=o(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var a=Object.create(null);if(o.r(a),Object.defineProperty(a,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var n in e)o.d(a,n,function(t){return e[t]}.bind(null,n));return a},o.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return o.d(t,"a",t),t},o.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},o.p="",o(o.s=0)}([function(e,t,o){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=void 0;var a=function(){function e(){var e=Y();e.style.display="none",e.id="mailgo",e.classList.add("m-modal");var t=Y();t.className="m-modal-back",e.appendChild(t);var o=Y();o.className="m-modal-content",e.appendChild(o),(i=Y("strong")).id="m-title",i.className="m-title",o.appendChild(i);var a=Y();a.id="m-details",a.className="m-details",(l=Y("p")).id="m-cc";var n=Y(S);n.className="w-500",n.appendChild(ee("cc ")),(m=Y(S)).id="m-cc-value",l.appendChild(n),l.appendChild(m),a.appendChild(l),(r=Y("p")).id="m-bcc";var L=Y(S);L.className="w-500",L.appendChild(ee("bcc ")),(p=Y(S)).id="m-bcc-value",r.appendChild(L),r.appendChild(p),a.appendChild(r),(c=Y("p")).id="m-subject";var z=Y(S);z.className="w-500",z.appendChild(ee("subject ")),(u=Y(S)).id="m-subject-value",c.appendChild(z),c.appendChild(u),a.appendChild(c),(s=Y("p")).id="m-body";var j=Y(S);j.className="w-500",j.appendChild(ee("body ")),(b=Y(S)).id="m-body-value",s.appendChild(j),s.appendChild(b),a.appendChild(s),o.appendChild(a),(f=Y("a")).id="m-gmail",f.href=N,f.classList.add("m-open"),f.classList.add("m-gmail"),f.appendChild(ee("open in "));var A=Y(S);A.className="w-500",A.appendChild(ee("Gmail")),f.appendChild(A),o.appendChild(f),(h=Y("a")).id="m-outlook",h.href=N,h.classList.add("m-open"),h.classList.add("m-outlook"),h.appendChild(ee("open in "));var E=Y(S);E.className="w-500",E.appendChild(ee("Outlook")),h.appendChild(E),o.appendChild(h),(g=Y("a")).id="m-open",g.href=N,g.classList.add("m-open"),g.classList.add("m-default");var R=Y(S);R.className="w-500",R.appendChild(ee("open")),g.appendChild(R),g.appendChild(ee(" default")),o.appendChild(g),(C=Y("a")).id="m-copy",C.href=N,C.classList.add("m-copy"),C.classList.add("w-500"),C.appendChild(ee("copy")),o.appendChild(C),o.appendChild(X()),document.body.appendChild(e),t.addEventListener("click",Q);var _=Y();_.style.display="none",_.id="mailgo-tel",_.classList.add("m-modal");var M=Y();M.className="m-modal-back",_.appendChild(M);var U=Y();U.className="m-modal-content",_.appendChild(U),(d=Y("strong")).id="m-tel-title",d.className="m-title",U.appendChild(d),(x=Y("a")).id="m-tg",x.href=N,x.classList.add("m-open"),x.classList.add("m-tg"),x.style.display="none",x.appendChild(ee("open in "));var I=Y(S);I.className="w-500",I.appendChild(ee("Telegram")),x.appendChild(I),U.appendChild(x),(v=Y("a")).id="m-wa",v.href=N,v.classList.add("m-open"),v.classList.add("m-wa"),v.appendChild(ee("open in "));var T=Y(S);T.className="w-500",T.appendChild(ee("WhatsApp")),v.appendChild(T),U.appendChild(v),(w=Y("a")).id="m-skype",w.href=N,w.classList.add("m-open"),w.classList.add("m-skype"),w.appendChild(ee("open in "));var O=Y(S);O.className="w-500",O.appendChild(ee("Skype")),w.appendChild(O),U.appendChild(w),(y=Y("a")).id="m-call",y.href=N,y.classList.add("m-open"),y.classList.add("m-default");var P=Y(S);P.className="w-500",P.appendChild(ee("call")),y.appendChild(P),y.appendChild(ee(" as default")),U.appendChild(y),(k=Y("a")).id="m-tel-copy",k.href=N,k.classList.add("m-copy"),k.classList.add("w-500"),k.appendChild(ee("copy")),U.appendChild(k),U.appendChild(X()),document.body.appendChild(_),M.addEventListener("click",Q)}function t(e,t){var o=0<arguments.length&&void 0!==e?e:A,a=1<arguments.length?t:void 0;if(o===A){if(a.href&&a.href.toLowerCase().startsWith(L)){R=decodeURIComponent(a.href.split("?")[0].split(L)[1].trim());var n=new URL(a.href).searchParams;M=n.get("cc"),U=n.get("bcc"),I=n.get("subject"),T=n.get("body")}else R=a.getAttribute("data-address")+"@"+a.getAttribute("data-domain"),new URL(L+encodeURIComponent(R)),M=a.getAttribute("data-cc-address")+"@"+a.getAttribute("data-cc-domain"),U=a.getAttribute("data-bcc-address")+"@"+a.getAttribute("data-bcc-domain"),I=a.getAttribute("data-subject"),T=a.getAttribute("data-body");if(!Line truncated
|
||||
"use strict";
|
||||
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports["default"] = void 0;
|
||||
var mailgoVersion = "0.9.0";
|
||||
|
||||
var mailgo = function mailgo(config) {
|
||||
// links
|
||||
var MAILTO = "mailto:";
|
||||
var TEL = "tel:";
|
||||
var CALLTO = "callto:"; // mailgo types
|
||||
|
||||
var MAIL_TYPE = "mail";
|
||||
var TEL_TYPE = "tel"; // default href for links
|
||||
|
||||
var DEFAULT_BTN_HREF = "javascript:void(0);"; // html tags
|
||||
|
||||
var span = "span"; // mailgo variables
|
||||
|
||||
var url,
|
||||
mail = "",
|
||||
encEmail = "",
|
||||
cc = "",
|
||||
bcc = "",
|
||||
subject = "",
|
||||
bodyMail = ""; // mailgo tel variables
|
||||
|
||||
var tel = "",
|
||||
msg = "",
|
||||
telegramUsername = "",
|
||||
skypeUsername = ""; // the DOM elements
|
||||
|
||||
var title, titleTel, detailCc, detailBcc, detailSubject, detailBody, ccValue, bccValue, subjectValue, bodyValue; // mailgo buttons (actions)
|
||||
|
||||
var gmail, outlook, open, telegram, wa, skype, call, copyMail, copyTel;
|
||||
/**
|
||||
* mailgoInit
|
||||
* the function that creates the mailgo elements in DOM
|
||||
*/
|
||||
|
||||
var mailgoInit = function mailgoInit() {
|
||||
// mailgo mail
|
||||
{
|
||||
// modal
|
||||
var modal = createElement();
|
||||
modal.style.display = "none";
|
||||
modal.id = "mailgo";
|
||||
modal.classList.add("m-modal"); // background
|
||||
|
||||
var modalBackground = createElement();
|
||||
modalBackground.className = "m-modal-back";
|
||||
modal.appendChild(modalBackground); // modal content
|
||||
|
||||
var modalContent = createElement();
|
||||
modalContent.className = "m-modal-content";
|
||||
modal.appendChild(modalContent); // title (email address)
|
||||
|
||||
title = createElement("strong");
|
||||
title.id = "m-title";
|
||||
title.className = "m-title";
|
||||
modalContent.appendChild(title); // details
|
||||
|
||||
var details = createElement();
|
||||
details.id = "m-details";
|
||||
details.className = "m-details";
|
||||
detailCc = createElement("p");
|
||||
detailCc.id = "m-cc";
|
||||
var ccSpan = createElement(span);
|
||||
ccSpan.className = "w-500";
|
||||
ccSpan.appendChild(createTextNode("cc "));
|
||||
ccValue = createElement(span);
|
||||
ccValue.id = "m-cc-value";
|
||||
detailCc.appendChild(ccSpan);
|
||||
detailCc.appendChild(ccValue);
|
||||
details.appendChild(detailCc);
|
||||
detailBcc = createElement("p");
|
||||
detailBcc.id = "m-bcc";
|
||||
var bccSpan = createElement(span);
|
||||
bccSpan.className = "w-500";
|
||||
bccSpan.appendChild(createTextNode("bcc "));
|
||||
bccValue = createElement(span);
|
||||
bccValue.id = "m-bcc-value";
|
||||
detailBcc.appendChild(bccSpan);
|
||||
detailBcc.appendChild(bccValue);
|
||||
details.appendChild(detailBcc);
|
||||
detailSubject = createElement("p");
|
||||
detailSubject.id = "m-subject";
|
||||
var subjectSpan = createElement(span);
|
||||
subjectSpan.className = "w-500";
|
||||
subjectSpan.appendChild(createTextNode("subject "));
|
||||
subjectValue = createElement(span);
|
||||
subjectValue.id = "m-subject-value";
|
||||
detailSubject.appendChild(subjectSpan);
|
||||
detailSubject.appendChild(subjectValue);
|
||||
details.appendChild(detailSubject);
|
||||
detailBody = createElement("p");
|
||||
detailBody.id = "m-body";
|
||||
var bodySpan = createElement(span);
|
||||
bodySpan.className = "w-500";
|
||||
bodySpan.appendChild(createTextNode("body "));
|
||||
bodyValue = createElement(span);
|
||||
bodyValue.id = "m-body-value";
|
||||
detailBody.appendChild(bodySpan);
|
||||
detailBody.appendChild(bodyValue);
|
||||
details.appendChild(detailBody);
|
||||
modalContent.appendChild(details); // Gmail
|
||||
|
||||
gmail = createElement("a");
|
||||
gmail.id = "m-gmail";
|
||||
gmail.href = DEFAULT_BTN_HREF;
|
||||
gmail.classList.add("m-open");
|
||||
gmail.classList.add("m-gmail");
|
||||
gmail.appendChild(createTextNode("open in "));
|
||||
var gmailSpan = createElement(span);
|
||||
gmailSpan.className = "w-500";
|
||||
gmailSpan.appendChild(createTextNode("Gmail"));
|
||||
gmail.appendChild(gmailSpan);
|
||||
modalContent.appendChild(gmail); // Outlook
|
||||
|
||||
outlook = createElement("a");
|
||||
outlook.id = "m-outlook";
|
||||
outlook.href = DEFAULT_BTN_HREF;
|
||||
outlook.classList.add("m-open");
|
||||
outlook.classList.add("m-outlook");
|
||||
outlook.appendChild(createTextNode("open in "));
|
||||
var outlookSpan = createElement(span);
|
||||
outlookSpan.className = "w-500";
|
||||
outlookSpan.appendChild(createTextNode("Outlook"));
|
||||
outlook.appendChild(outlookSpan);
|
||||
modalContent.appendChild(outlook); // open default
|
||||
|
||||
open = createElement("a");
|
||||
open.id = "m-open";
|
||||
open.href = DEFAULT_BTN_HREF;
|
||||
open.classList.add("m-open");
|
||||
open.classList.add("m-default");
|
||||
var openSpan = createElement(span);
|
||||
openSpan.className = "w-500";
|
||||
openSpan.appendChild(createTextNode("open"));
|
||||
open.appendChild(openSpan);
|
||||
open.appendChild(createTextNode(" default"));
|
||||
modalContent.appendChild(open); // copy
|
||||
|
||||
copyMail = createElement("a");
|
||||
copyMail.id = "m-copy";
|
||||
copyMail.href = DEFAULT_BTN_HREF;
|
||||
copyMail.classList.add("m-copy");
|
||||
copyMail.classList.add("w-500");
|
||||
copyMail.appendChild(createTextNode("copy"));
|
||||
modalContent.appendChild(copyMail);
|
||||
modalContent.appendChild(byElement()); // add the modal at the end of the body
|
||||
|
||||
document.body.appendChild(modal); // every click outside the modal will hide the modal
|
||||
|
||||
modalBackground.addEventListener("click", hideMailgo);
|
||||
} // mailgo tel
|
||||
|
||||
{
|
||||
// modal
|
||||
var _modal = createElement();
|
||||
|
||||
_modal.style.display = "none";
|
||||
_modal.id = "mailgo-tel";
|
||||
|
||||
_modal.classList.add("m-modal"); // background
|
||||
|
||||
|
||||
var _modalBackground = createElement();
|
||||
|
||||
_modalBackground.className = "m-modal-back";
|
||||
|
||||
_modal.appendChild(_modalBackground); // modal content
|
||||
|
||||
|
||||
var _modalContent = createElement();
|
||||
|
||||
_modalContent.className = "m-modal-content";
|
||||
|
||||
_modal.appendChild(_modalContent); // title (telephone number)
|
||||
|
||||
|
||||
titleTel = createElement("strong");
|
||||
titleTel.id = "m-tel-title";
|
||||
titleTel.className = "m-title";
|
||||
|
||||
_modalContent.appendChild(titleTel); // Telegram
|
||||
|
||||
|
||||
telegram = createElement("a");
|
||||
telegram.id = "m-tg";
|
||||
telegram.href = DEFAULT_BTN_HREF;
|
||||
telegram.classList.add("m-open");
|
||||
telegram.classList.add("m-tg"); // by default not display
|
||||
|
||||
telegram.style.display = "none";
|
||||
telegram.appendChild(createTextNode("open in "));
|
||||
var telegramSpan = createElement(span);
|
||||
telegramSpan.className = "w-500";
|
||||
telegramSpan.appendChild(createTextNode("Telegram"));
|
||||
telegram.appendChild(telegramSpan);
|
||||
|
||||
_modalContent.appendChild(telegram); // WhatsApp
|
||||
|
||||
|
||||
wa = createElement("a");
|
||||
wa.id = "m-wa";
|
||||
wa.href = DEFAULT_BTN_HREF;
|
||||
wa.classList.add("m-open");
|
||||
wa.classList.add("m-wa");
|
||||
wa.appendChild(createTextNode("open in "));
|
||||
var waSpan = createElement(span);
|
||||
waSpan.className = "w-500";
|
||||
waSpan.appendChild(createTextNode("WhatsApp"));
|
||||
wa.appendChild(waSpan);
|
||||
|
||||
_modalContent.appendChild(wa); // Skype
|
||||
|
||||
|
||||
skype = createElement("a");
|
||||
skype.id = "m-skype";
|
||||
skype.href = DEFAULT_BTN_HREF;
|
||||
skype.classList.add("m-open");
|
||||
skype.classList.add("m-skype");
|
||||
skype.appendChild(createTextNode("open in "));
|
||||
var skypeSpan = createElement(span);
|
||||
skypeSpan.className = "w-500";
|
||||
skypeSpan.appendChild(createTextNode("Skype"));
|
||||
skype.appendChild(skypeSpan);
|
||||
|
||||
_modalContent.appendChild(skype); // call default
|
||||
|
||||
|
||||
call = createElement("a");
|
||||
call.id = "m-call";
|
||||
call.href = DEFAULT_BTN_HREF;
|
||||
call.classList.add("m-open");
|
||||
call.classList.add("m-default");
|
||||
var callSpan = createElement(span);
|
||||
callSpan.className = "w-500";
|
||||
callSpan.appendChild(createTextNode("call"));
|
||||
call.appendChild(callSpan);
|
||||
call.appendChild(createTextNode(" as default"));
|
||||
|
||||
_modalContent.appendChild(call); // copy
|
||||
|
||||
|
||||
copyTel = createElement("a");
|
||||
copyTel.id = "m-tel-copy";
|
||||
copyTel.href = DEFAULT_BTN_HREF;
|
||||
copyTel.classList.add("m-copy");
|
||||
copyTel.classList.add("w-500");
|
||||
copyTel.appendChild(createTextNode("copy"));
|
||||
|
||||
_modalContent.appendChild(copyTel);
|
||||
|
||||
_modalContent.appendChild(byElement()); // add the modal at the end of the body
|
||||
|
||||
|
||||
document.body.appendChild(_modal); // every click outside the modal will hide the modal
|
||||
|
||||
_modalBackground.addEventListener("click", hideMailgo);
|
||||
}
|
||||
};
|
||||
/**
|
||||
* mailgoRender
|
||||
* function to render a mailgo (mail or tel)
|
||||
*/
|
||||
|
||||
|
||||
var mailgoRender = function mailgoRender() {
|
||||
var type = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : MAIL_TYPE;
|
||||
var mailgo = arguments.length > 1 ? arguments[1] : undefined;
|
||||
|
||||
// mailgo mail
|
||||
if (type === MAIL_TYPE) {
|
||||
// if the element href=^"mailto:"
|
||||
if (mailgo.href && mailgo.href.toLowerCase().startsWith(MAILTO)) {
|
||||
mail = decodeURIComponent(mailgo.href.split("?")[0].split(MAILTO)[1].trim());
|
||||
url = new URL(mailgo.href);
|
||||
var urlParams = url.searchParams; // optional parameters for the email
|
||||
|
||||
cc = urlParams.get("cc");
|
||||
bcc = urlParams.get("bcc");
|
||||
subject = urlParams.get("subject");
|
||||
bodyMail = urlParams.get("body");
|
||||
} else {
|
||||
// if the element href="#mailgo" or class="mailgo"
|
||||
// mail = data-address + @ + data-domain
|
||||
mail = mailgo.getAttribute("data-address") + "@" + mailgo.getAttribute("data-domain");
|
||||
url = new URL(MAILTO + encodeURIComponent(mail)); // cc = data-cc-address + @ + data-cc-domain
|
||||
|
||||
cc = mailgo.getAttribute("data-cc-address") + "@" + mailgo.getAttribute("data-cc-domain"); // bcc = data-bcc-address + @ + data-bcc-domain
|
||||
|
||||
bcc = mailgo.getAttribute("data-bcc-address") + "@" + mailgo.getAttribute("data-bcc-domain"); // subject = data-subject
|
||||
|
||||
subject = mailgo.getAttribute("data-subject"); // body = data-body
|
||||
|
||||
bodyMail = mailgo.getAttribute("data-body");
|
||||
} // validate the email address
|
||||
|
||||
|
||||
if (!validateEmails(mail.split(","))) return; // if cc, bcc is not valid cc, bcc = ""
|
||||
|
||||
if (cc && !validateEmails(cc.split(","))) cc = "";
|
||||
if (bcc && !validateEmails(bcc.split(","))) bcc = ""; // the title of the modal (email address)
|
||||
|
||||
title.innerHTML = mail.split(",").join("<br/>"); // add the details if provided
|
||||
|
||||
cc ? (detailCc.style.display = "block", ccValue.innerHTML = cc.split(",").join("<br/>")) : detailCc.style.display = "none";
|
||||
bcc ? (detailBcc.style.display = "block", bccValue.innerHTML = bcc.split(",").join("<br/>")) : detailBcc.style.display = "none";
|
||||
subject ? (detailSubject.style.display = "block", subjectValue.textContent = subject) : detailSubject.style.display = "none";
|
||||
bodyMail ? (detailBody.style.display = "block", bodyValue.textContent = bodyMail) : detailBody.style.display = "none"; // add the actions
|
||||
|
||||
gmail.addEventListener("click", openGmail);
|
||||
outlook.addEventListener("click", openOutlook);
|
||||
encEmail = encodeEmail(mail);
|
||||
open.addEventListener("click", openDefault);
|
||||
copyMail.addEventListener("click", function () {
|
||||
return copy(mail);
|
||||
});
|
||||
} // mailgo tel
|
||||
|
||||
|
||||
if (type === TEL_TYPE) {
|
||||
if (mailgo.href && mailgo.href.toLowerCase().startsWith(TEL)) {
|
||||
tel = decodeURIComponent(mailgo.href.split("?")[0].split(TEL)[1].trim());
|
||||
} else if (mailgo.href && mailgo.href.toLowerCase().startsWith(CALLTO)) {
|
||||
tel = decodeURIComponent(mailgo.href.split("?")[0].split(CALLTO)[1].trim());
|
||||
} else if (mailgo.hasAttribute("data-tel")) {
|
||||
tel = mailgo.getAttribute("data-tel");
|
||||
msg = mailgo.getAttribute("data-msg");
|
||||
} // information
|
||||
// let titleEl = getE("m-tel-title");
|
||||
// Telegram username
|
||||
|
||||
|
||||
if (mailgo.hasAttribute("data-telegram")) {
|
||||
telegramUsername = mailgo.getAttribute("data-telegram");
|
||||
} // Telegram username
|
||||
|
||||
|
||||
if (mailgo.hasAttribute("data-skype")) {
|
||||
skypeUsername = mailgo.getAttribute("data-skype");
|
||||
} // the title of the modal (tel)
|
||||
|
||||
|
||||
titleTel.innerHTML = tel; // add the actions to buttons
|
||||
|
||||
wa.addEventListener("click", openWhatsApp);
|
||||
|
||||
if (telegramUsername) {
|
||||
setDisplay("m-tg", "block");
|
||||
telegram.addEventListener("click", openTelegram);
|
||||
}
|
||||
|
||||
skype.addEventListener("click", openSkype);
|
||||
call.addEventListener("click", callDefault);
|
||||
copyTel.addEventListener("click", function () {
|
||||
return copy(tel);
|
||||
});
|
||||
} // show the mailgo
|
||||
|
||||
|
||||
showMailgo(type); // add listener keyDown
|
||||
|
||||
document.addEventListener("keydown", mailgoKeydown);
|
||||
}; // actions
|
||||
|
||||
|
||||
var openGmail = function openGmail() {
|
||||
// Gmail url
|
||||
var gmailUrl = "https://mail.google.com/mail/u/0/?view=cm&source=mailto&to=" + encodeURIComponent(mail); // the details if provided
|
||||
|
||||
if (cc) gmailUrl = gmailUrl.concat("&cc=" + encodeURIComponent(cc));
|
||||
if (bcc) gmailUrl = gmailUrl.concat("&bcc=" + encodeURIComponent(bcc));
|
||||
if (subject) gmailUrl = gmailUrl.concat("&subject=" + subject);
|
||||
if (bodyMail) gmailUrl = gmailUrl.concat("&body=" + bodyMail); // open the link
|
||||
|
||||
window.open(gmailUrl, "_blank"); // hide the modal
|
||||
|
||||
hideMailgo();
|
||||
};
|
||||
|
||||
var openOutlook = function openOutlook() {
|
||||
// Outlook url
|
||||
var outlookUrl = "https://outlook.live.com/owa/?path=/mail/action/compose&to=" + encodeURIComponent(mail); // the details if provided
|
||||
|
||||
if (subject) outlookUrl = outlookUrl.concat("&subject=" + subject);
|
||||
if (bodyMail) outlookUrl = outlookUrl.concat("&body=" + bodyMail); // open the link
|
||||
|
||||
window.open(outlookUrl, "_blank"); // hide the modal
|
||||
|
||||
hideMailgo();
|
||||
};
|
||||
|
||||
var openDefault = function openDefault() {
|
||||
mailToEncoded(encEmail);
|
||||
hideMailgo();
|
||||
};
|
||||
|
||||
var openTelegram = function openTelegram() {
|
||||
// Telegram url
|
||||
var tgUrl = "https://t.me/" + telegramUsername; // open the url
|
||||
|
||||
window.open(tgUrl, "_blank"); // hide the modal
|
||||
|
||||
hideMailgo();
|
||||
};
|
||||
|
||||
var openSkype = function openSkype() {
|
||||
var skype = skypeUsername !== "" ? skypeUsername : tel; // Telegram url
|
||||
|
||||
var skypeUrl = "skype:" + skype; // open the url
|
||||
|
||||
window.open(skypeUrl, "_blank"); // hide the modal
|
||||
|
||||
hideMailgo();
|
||||
};
|
||||
|
||||
var openWhatsApp = function openWhatsApp() {
|
||||
// WhatsApp url
|
||||
var waUrl = "https://wa.me/" + tel; // the details if provided
|
||||
|
||||
if (msg) waUrl + "?text=" + msg; // open the url
|
||||
|
||||
window.open(waUrl, "_blank"); // hide the modal
|
||||
|
||||
hideMailgo();
|
||||
};
|
||||
|
||||
var callDefault = function callDefault() {
|
||||
var callUrl = "tel:" + tel;
|
||||
window.open(callUrl);
|
||||
hideMailgo();
|
||||
};
|
||||
|
||||
var copy = function copy(content) {
|
||||
copyToClipboard(content);
|
||||
var activeCopy; // the correct copyButton (mail or tel)
|
||||
|
||||
mailgoIsShowing(MAIL_TYPE) ? activeCopy = copyMail : activeCopy = copyTel;
|
||||
activeCopy.textContent = "copied";
|
||||
setTimeout(function () {
|
||||
activeCopy.textContent = "copy"; // hide after the timeout
|
||||
|
||||
hideMailgo();
|
||||
}, 999);
|
||||
}; // function that returns if an element is a mailgo
|
||||
|
||||
|
||||
var isMailgo = function isMailgo(element) {
|
||||
var type = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : MAIL_TYPE;
|
||||
var href = element.href; // mailgo type mail
|
||||
|
||||
if (type === MAIL_TYPE) {
|
||||
return (// first case: it is an <a> element with "mailto:..." in href and no no-mailgo in classList
|
||||
href && href.toLowerCase().startsWith(MAILTO) && !element.classList.contains("no-mailgo") || element.hasAttribute("data-address") && ( // second case: the href=#mailgo
|
||||
href && element.getAttribute("href").toLowerCase() === "#mailgo" || // third case: the classList contains mailgo
|
||||
element.classList && element.classList.contains("mailgo"))
|
||||
);
|
||||
} // mailgo type tel
|
||||
|
||||
|
||||
if (type === TEL_TYPE) {
|
||||
return (// first case: it is an <a> element with "tel:..." or "callto:..." in href and no no-mailgo in classList
|
||||
href && (href.toLowerCase().startsWith(TEL) || href.toLowerCase().startsWith(CALLTO)) && !element.classList.contains("no-mailgo") || element.hasAttribute("data-tel") && // second case: the href=#mailgo
|
||||
href && element.getAttribute("href").toLowerCase() === "#mailgo" || // third case: the classList contains mailgo
|
||||
element.classList && element.classList.contains("mailgo")
|
||||
);
|
||||
}
|
||||
|
||||
return false;
|
||||
};
|
||||
/**
|
||||
* mailgoCheckRender
|
||||
* function to check if an element is mailgo-enabled or not referencing to
|
||||
* mail:
|
||||
* document.querySelectorAll(
|
||||
* 'a[href^="mailto:" i]:not(.no-mailgo), a[href="#mailgo"], a.mailgo'
|
||||
* );
|
||||
* tel:
|
||||
* document.querySelectorAll(
|
||||
* 'a[href^="tel:" i]:not(.no-mailgo), a[href="#mailgo"], a.mailgo'
|
||||
* );
|
||||
* or
|
||||
* document.querySelectorAll(
|
||||
* 'a[href^="callto:" i]:not(.no-mailgo), a[href="#mailgo"], a.mailgo'
|
||||
* );
|
||||
*/
|
||||
|
||||
|
||||
var mailgoCheckRender = function mailgoCheckRender(event) {
|
||||
// check if the id=mailgo exists in the body
|
||||
if (!document.contains(getE("mailgo")) || !document.contains(getE("mailgo-tel"))) return; // if a mailgo is already showing do nothing
|
||||
|
||||
if (mailgoIsShowing(MAIL_TYPE) || mailgoIsShowing(TEL_TYPE)) return; // the path of the event
|
||||
|
||||
var path = event.composedPath && event.composedPath() || composedPath(event.target);
|
||||
|
||||
if (path) {
|
||||
path.forEach(function (element) {
|
||||
if (element instanceof HTMLDocument || element instanceof Window) return; // go in the event.path to find if the user has clicked on a mailgo element
|
||||
|
||||
if (isMailgo(element, MAIL_TYPE)) {
|
||||
// stop the normal execution of the element click
|
||||
event.preventDefault(); // render mailgo
|
||||
|
||||
mailgoRender(MAIL_TYPE, element);
|
||||
return;
|
||||
}
|
||||
|
||||
if (isMailgo(element, TEL_TYPE)) {
|
||||
// stop the normal execution of the element click
|
||||
event.preventDefault(); // render mailgo
|
||||
|
||||
mailgoRender(TEL_TYPE, element);
|
||||
return;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
return;
|
||||
};
|
||||
/**
|
||||
* mailgoKeydown
|
||||
* function to manage the keydown event when the modal is showing
|
||||
*/
|
||||
|
||||
|
||||
var mailgoKeydown = function mailgoKeydown(event) {
|
||||
// if mailgo is showing
|
||||
if (mailgoIsShowing(MAIL_TYPE)) {
|
||||
switch (event.keyCode) {
|
||||
case 27:
|
||||
// Escape
|
||||
hideMailgo();
|
||||
break;
|
||||
|
||||
case 71:
|
||||
// g -> open GMail
|
||||
openGmail();
|
||||
break;
|
||||
|
||||
case 79:
|
||||
// o -> open Outlook
|
||||
openOutlook();
|
||||
break;
|
||||
|
||||
case 32:
|
||||
case 13:
|
||||
// spacebar or enter -> open default
|
||||
openDefault();
|
||||
break;
|
||||
|
||||
case 67:
|
||||
// c -> copy
|
||||
copy(mail);
|
||||
break;
|
||||
|
||||
default:
|
||||
return;
|
||||
}
|
||||
} else if (mailgoIsShowing(TEL_TYPE)) {
|
||||
switch (event.keyCode) {
|
||||
case 27:
|
||||
// Escape
|
||||
hideMailgo();
|
||||
break;
|
||||
|
||||
case 84:
|
||||
// t -> open Telegram
|
||||
openTelegram();
|
||||
break;
|
||||
|
||||
case 87:
|
||||
// w -> open WhatsApp
|
||||
openWhatsApp();
|
||||
break;
|
||||
|
||||
case 32:
|
||||
case 13:
|
||||
// spacebar or enter -> call default
|
||||
callDefault();
|
||||
break;
|
||||
|
||||
case 67:
|
||||
// c -> copy
|
||||
copy(tel);
|
||||
break;
|
||||
|
||||
default:
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
return;
|
||||
}; // show the modal
|
||||
|
||||
|
||||
var showMailgo = function showMailgo() {
|
||||
var type = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : MAIL_TYPE;
|
||||
|
||||
// show mailgo type mail
|
||||
if (type === MAIL_TYPE) {
|
||||
setDisplay("mailgo", "flex");
|
||||
return;
|
||||
} // show mailgo type tel
|
||||
|
||||
|
||||
if (type === TEL_TYPE) {
|
||||
setDisplay("mailgo-tel", "flex");
|
||||
return;
|
||||
}
|
||||
}; // hide the modal
|
||||
|
||||
|
||||
var hideMailgo = function hideMailgo() {
|
||||
setDisplay("mailgo", "none");
|
||||
setDisplay("mailgo-tel", "none"); // remove listener keyDown
|
||||
|
||||
document.removeEventListener("keydown", mailgoKeydown);
|
||||
}; // is the mailgo modal hidden?
|
||||
|
||||
|
||||
var mailgoIsShowing = function mailgoIsShowing() {
|
||||
var type = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : MAIL_TYPE;
|
||||
return type === MAIL_TYPE ? getDisplay("mailgo") === "flex" : type === TEL_TYPE ? getDisplay("mailgo-tel") === "flex" : false;
|
||||
};
|
||||
|
||||
var byElement = function byElement() {
|
||||
// by
|
||||
var by = createElement("a");
|
||||
by.href = "https://mailgo.js.org?ref=mailgo-modal";
|
||||
by.className = "m-by";
|
||||
by.target = "_blank";
|
||||
by.rel = "noopener noreferrer";
|
||||
by.appendChild(createTextNode("mailgo.js.org"));
|
||||
return by;
|
||||
}; // create element
|
||||
|
||||
|
||||
var createElement = function createElement() {
|
||||
var element = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : "div";
|
||||
return document.createElement(element);
|
||||
}; // create text node
|
||||
|
||||
|
||||
var createTextNode = function createTextNode(element) {
|
||||
return document.createTextNode(element);
|
||||
}; // decrypt email
|
||||
|
||||
|
||||
var mailToEncoded = function mailToEncoded(encoded) {
|
||||
return window.location.href = MAILTO + atob(encoded);
|
||||
}; // encode email
|
||||
|
||||
|
||||
var encodeEmail = function encodeEmail(email) {
|
||||
return btoa(email);
|
||||
}; // getE shorthand
|
||||
|
||||
|
||||
var getE = function getE(id) {
|
||||
return document.getElementById(id);
|
||||
}; // get display value
|
||||
|
||||
|
||||
var getDisplay = function getDisplay(id) {
|
||||
return getE(id).style.display;
|
||||
}; // get display value
|
||||
|
||||
|
||||
var setDisplay = function setDisplay(id, value) {
|
||||
return getE(id).style.display = value;
|
||||
}; // custom composedPath if path or event.composedPath() are not defined
|
||||
|
||||
|
||||
var composedPath = function composedPath(el) {
|
||||
var path = [];
|
||||
|
||||
while (el) {
|
||||
path.push(el);
|
||||
|
||||
if (el.tagName === "HTML") {
|
||||
path.push(document);
|
||||
path.push(window);
|
||||
return path;
|
||||
}
|
||||
|
||||
el = el.parentElement;
|
||||
}
|
||||
}; // validate a single email with regex
|
||||
|
||||
|
||||
var validateEmail = function validateEmail(email) {
|
||||
return /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/.test(email);
|
||||
}; // validate an array of emails
|
||||
|
||||
|
||||
var validateEmails = function validateEmails(arr) {
|
||||
return arr.every(validateEmail);
|
||||
}; // copy of a string
|
||||
|
||||
|
||||
var copyToClipboard = function copyToClipboard(str) {
|
||||
var el = createElement("textarea");
|
||||
el.value = str;
|
||||
el.setAttribute("readonly", "");
|
||||
el.style.position = "absolute";
|
||||
el.style.left = "-9999px";
|
||||
document.body.appendChild(el);
|
||||
var selected = document.getSelection().rangeCount > 0 ? document.getSelection().getRangeAt(0) : false;
|
||||
el.select();
|
||||
document.execCommand("copy");
|
||||
document.body.removeChild(el);
|
||||
|
||||
if (selected) {
|
||||
document.getSelection().removeAllRanges();
|
||||
document.getSelection().addRange(selected);
|
||||
}
|
||||
}; // start mailgo
|
||||
|
||||
|
||||
(function () {
|
||||
// if the window is defined...
|
||||
if (window && typeof window !== "undefined") {
|
||||
// if the window object exists...
|
||||
// mailgo style (gulp)
|
||||
var mailgoCSS = createElement("style");
|
||||
mailgoCSS.id = "mailgo-style";
|
||||
mailgoCSS.type = "text/css";
|
||||
mailgoCSS.appendChild(createTextNode(".m-modal{position:fixed;top:0;right:0;bottom:0;left:0;-webkit-box-pack:center;-webkit-justify-content:center;-moz-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-webkit-align-items:center;-moz-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;-moz-box-orient:vertical;-moz-box-direction:normal;-ms-flex-direction:column;flex-direction:column;overflow:hidden;font-size:15px;z-index:10000}.m-modal a,.m-modal p,.m-modal span,.m-modal strong{margin:0;padding:0;font-size:100%;line-height:1;font-family:-apple-system,BlinkMacSystemFont,\"Segoe UI\",Roboto,Helvetica,Arial,sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\",\"Segoe UI Symbol\";text-rendering:optimizeLegibility}.m-modal strong{font-weight:700}.m-modal .m-modal-back{position:absolute;z-index:10001;top:0;right:0;bottom:0;left:0;background-color:rgba(32,35,42,.75);opacity:.8}.m-modal .m-modal-content{position:relative;z-index:10002;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;text-align:center;min-width:200px;max-width:240px;background-color:#fff;opacity:.97;-webkit-border-radius:8px;-moz-border-radius:8px;border-radius:8px;-webkit-box-shadow:0 3px 20px rgba(32,35,42,.5);-moz-box-shadow:0 3px 20px rgba(32,35,42,.5);box-shadow:0 3px 20px rgba(32,35,42,.5);color:#4a4a4a;display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;-moz-box-orient:vertical;-moz-box-direction:normal;-ms-flex-direction:column;flex-direction:column;overflow:auto;padding:20px;-webkit-transition:.5s -webkit-box-shadow;transition:.5s -webkit-box-shadow;-o-transition:.5s box-shadow;-moz-transition:.5s box-shadow,.5s -moz-box-shadow;transition:.5s box-shadow;transition:.5s box-shadow,.5s -webkit-box-shadow,.5s -moz-box-shadow}.m-modal .m-modal-content:hover{opacity:1;-webkit-box-shadow:0 7px 20px rgba(32,35,42,.85);-moz-box-shadow:0 7px 20px rgba(32,35,42,.85);box-shadow:0 7px 20px rgba(32,35,42,.85)}.m-modal .m-modal-content .m-title{margin-bottom:8px;overflow:hidden;white-space:nowrap;-o-text-overflow:ellipsis;text-overflow:ellipsis}.m-modal .m-modal-content .m-details{margin-bottom:10px}.m-modal .m-modal-content .m-details p{font-size:12px;margin-top:3px;margin-bottom:3px}.m-modal .m-modal-content a{padding:10px;color:#4a4a4a;-webkit-border-radius:8px;-moz-border-radius:8px;border-radius:8px;text-decoration:none}.m-modal .m-modal-content a.m-gmail{color:#d44638}.m-modal .m-modal-content a.m-gmail:hover{background-color:rgba(212,70,56,.08);color:#d44638}.m-modal .m-modal-content a.m-outlook{color:#0072c6}.m-modal .m-modal-content a.m-outlook:hover{background-color:rgba(0,114,198,.08);color:#0072c6}.m-modal .m-modal-content a.m-tg{color:#08c}.m-modal .m-modal-content a.m-tg:hover{background-color:rgba(0,114,198,.08);color:#08c}.m-modal .m-modal-content a.m-wa{color:#00bfa5}.m-modal .m-modal-content a.m-wa:hover{background-color:rgba(0,191,165,.08);color:#00bfa5}.m-modal .m-modal-content a.m-skype{color:#00aff0}.m-modal .m-modal-content a.m-skype:hover{background-color:rgba(0,175,240,.08);color:#00aff0}.m-modal .m-modal-content a.m-copy{padding:16px 10px;font-size:16px}.m-modal .m-modal-content a.m-copy:hover,.m-modal .m-modal-content a.m-default:hover{background-color:rgba(0,0,0,.08);color:#4a4a4a}.m-modal .m-modal-content a.m-by{font-size:8px;margin-top:.8rem;padding:5px;color:#4a4a4a;opacity:.5}.m-modal .m-modal-content a.m-by:hover{opacity:1}.m-modal .m-modal-content .w-500{font-weight:500}"));
|
||||
document.head.appendChild(mailgoCSS); // DOMContentLoaded -> mailgoInit (creates the modals)
|
||||
|
||||
document.addEventListener("DOMContentLoaded", mailgoInit); // event listener on body, if the element is mailgo-compatible the mailgo modal will be rendered
|
||||
|
||||
document.addEventListener("click", mailgoCheckRender);
|
||||
}
|
||||
})();
|
||||
}; // if mailgo is included as a script
|
||||
|
||||
|
||||
if (window && typeof window !== "undefined") {
|
||||
mailgo();
|
||||
} // export mailgo
|
||||
|
||||
|
||||
var _default = mailgo;
|
||||
exports["default"] = _default;
|
||||
@@ -0,0 +1,859 @@
|
||||
const mailgoVersion: string = "0.9.0";
|
||||
|
||||
type MailgoConfig = {};
|
||||
|
||||
const mailgo = (config?: MailgoConfig): void => {
|
||||
// links
|
||||
const MAILTO: string = "mailto:";
|
||||
const TEL: string = "tel:";
|
||||
const CALLTO: string = "callto:";
|
||||
|
||||
// mailgo types
|
||||
const MAIL_TYPE: string = "mail";
|
||||
const TEL_TYPE: string = "tel";
|
||||
|
||||
// default href for links
|
||||
const DEFAULT_BTN_HREF: string = "javascript:void(0);";
|
||||
|
||||
// html tags
|
||||
const span: string = "span";
|
||||
|
||||
// mailgo variables
|
||||
let url: URL,
|
||||
mail: string = "",
|
||||
encEmail: string = "",
|
||||
cc: string = "",
|
||||
bcc: string = "",
|
||||
subject: string = "",
|
||||
bodyMail: string = "";
|
||||
|
||||
// mailgo tel variables
|
||||
let tel: string = "",
|
||||
msg: string = "",
|
||||
telegramUsername: string = "",
|
||||
skypeUsername: string = "";
|
||||
|
||||
// the DOM elements
|
||||
let title: HTMLElement,
|
||||
titleTel: HTMLElement,
|
||||
detailCc: HTMLElement,
|
||||
detailBcc: HTMLElement,
|
||||
detailSubject: HTMLElement,
|
||||
detailBody: HTMLElement,
|
||||
ccValue: HTMLElement,
|
||||
bccValue: HTMLElement,
|
||||
subjectValue: HTMLElement,
|
||||
bodyValue: HTMLElement;
|
||||
|
||||
// mailgo buttons (actions)
|
||||
let gmail: HTMLLinkElement,
|
||||
outlook: HTMLLinkElement,
|
||||
open: HTMLLinkElement,
|
||||
telegram: HTMLLinkElement,
|
||||
wa: HTMLLinkElement,
|
||||
skype: HTMLLinkElement,
|
||||
call: HTMLLinkElement,
|
||||
copyMail: HTMLLinkElement,
|
||||
copyTel: HTMLLinkElement;
|
||||
|
||||
/**
|
||||
* mailgoInit
|
||||
* the function that creates the mailgo elements in DOM
|
||||
*/
|
||||
const mailgoInit = (): void => {
|
||||
// mailgo mail
|
||||
{
|
||||
// modal
|
||||
let modal = createElement();
|
||||
modal.style.display = "none";
|
||||
modal.id = "mailgo";
|
||||
modal.classList.add("m-modal");
|
||||
|
||||
// background
|
||||
let modalBackground = createElement();
|
||||
modalBackground.className = "m-modal-back";
|
||||
modal.appendChild(modalBackground);
|
||||
|
||||
// modal content
|
||||
let modalContent = createElement();
|
||||
modalContent.className = "m-modal-content";
|
||||
modal.appendChild(modalContent);
|
||||
|
||||
// title (email address)
|
||||
title = createElement("strong");
|
||||
title.id = "m-title";
|
||||
title.className = "m-title";
|
||||
modalContent.appendChild(title);
|
||||
|
||||
// details
|
||||
let details = createElement();
|
||||
details.id = "m-details";
|
||||
details.className = "m-details";
|
||||
|
||||
detailCc = createElement("p");
|
||||
detailCc.id = "m-cc";
|
||||
let ccSpan = createElement(span);
|
||||
ccSpan.className = "w-500";
|
||||
ccSpan.appendChild(createTextNode("cc "));
|
||||
ccValue = createElement(span);
|
||||
ccValue.id = "m-cc-value";
|
||||
detailCc.appendChild(ccSpan);
|
||||
detailCc.appendChild(ccValue);
|
||||
details.appendChild(detailCc);
|
||||
|
||||
detailBcc = createElement("p");
|
||||
detailBcc.id = "m-bcc";
|
||||
let bccSpan = createElement(span);
|
||||
bccSpan.className = "w-500";
|
||||
bccSpan.appendChild(createTextNode("bcc "));
|
||||
bccValue = createElement(span);
|
||||
bccValue.id = "m-bcc-value";
|
||||
detailBcc.appendChild(bccSpan);
|
||||
detailBcc.appendChild(bccValue);
|
||||
details.appendChild(detailBcc);
|
||||
|
||||
detailSubject = createElement("p");
|
||||
detailSubject.id = "m-subject";
|
||||
let subjectSpan = createElement(span);
|
||||
subjectSpan.className = "w-500";
|
||||
subjectSpan.appendChild(createTextNode("subject "));
|
||||
subjectValue = createElement(span);
|
||||
subjectValue.id = "m-subject-value";
|
||||
detailSubject.appendChild(subjectSpan);
|
||||
detailSubject.appendChild(subjectValue);
|
||||
details.appendChild(detailSubject);
|
||||
|
||||
detailBody = createElement("p");
|
||||
detailBody.id = "m-body";
|
||||
let bodySpan = createElement(span);
|
||||
bodySpan.className = "w-500";
|
||||
bodySpan.appendChild(createTextNode("body "));
|
||||
bodyValue = createElement(span);
|
||||
bodyValue.id = "m-body-value";
|
||||
detailBody.appendChild(bodySpan);
|
||||
detailBody.appendChild(bodyValue);
|
||||
details.appendChild(detailBody);
|
||||
|
||||
modalContent.appendChild(details);
|
||||
|
||||
// Gmail
|
||||
gmail = <HTMLLinkElement>createElement("a");
|
||||
gmail.id = "m-gmail";
|
||||
gmail.href = DEFAULT_BTN_HREF;
|
||||
gmail.classList.add("m-open");
|
||||
gmail.classList.add("m-gmail");
|
||||
gmail.appendChild(createTextNode("open in "));
|
||||
let gmailSpan = createElement(span);
|
||||
gmailSpan.className = "w-500";
|
||||
gmailSpan.appendChild(createTextNode("Gmail"));
|
||||
gmail.appendChild(gmailSpan);
|
||||
|
||||
modalContent.appendChild(gmail);
|
||||
|
||||
// Outlook
|
||||
outlook = <HTMLLinkElement>createElement("a");
|
||||
outlook.id = "m-outlook";
|
||||
outlook.href = DEFAULT_BTN_HREF;
|
||||
outlook.classList.add("m-open");
|
||||
outlook.classList.add("m-outlook");
|
||||
outlook.appendChild(createTextNode("open in "));
|
||||
let outlookSpan = createElement(span);
|
||||
outlookSpan.className = "w-500";
|
||||
outlookSpan.appendChild(createTextNode("Outlook"));
|
||||
outlook.appendChild(outlookSpan);
|
||||
|
||||
modalContent.appendChild(outlook);
|
||||
|
||||
// open default
|
||||
open = <HTMLLinkElement>createElement("a");
|
||||
open.id = "m-open";
|
||||
open.href = DEFAULT_BTN_HREF;
|
||||
open.classList.add("m-open");
|
||||
open.classList.add("m-default");
|
||||
let openSpan = createElement(span);
|
||||
openSpan.className = "w-500";
|
||||
openSpan.appendChild(createTextNode("open"));
|
||||
open.appendChild(openSpan);
|
||||
open.appendChild(createTextNode(" default"));
|
||||
|
||||
modalContent.appendChild(open);
|
||||
|
||||
// copy
|
||||
copyMail = <HTMLLinkElement>createElement("a");
|
||||
copyMail.id = "m-copy";
|
||||
copyMail.href = DEFAULT_BTN_HREF;
|
||||
copyMail.classList.add("m-copy");
|
||||
copyMail.classList.add("w-500");
|
||||
copyMail.appendChild(createTextNode("copy"));
|
||||
|
||||
modalContent.appendChild(copyMail);
|
||||
|
||||
modalContent.appendChild(byElement());
|
||||
|
||||
// add the modal at the end of the body
|
||||
document.body.appendChild(modal);
|
||||
|
||||
// every click outside the modal will hide the modal
|
||||
modalBackground.addEventListener("click", hideMailgo);
|
||||
}
|
||||
// mailgo tel
|
||||
{
|
||||
// modal
|
||||
let modal = createElement();
|
||||
modal.style.display = "none";
|
||||
modal.id = "mailgo-tel";
|
||||
modal.classList.add("m-modal");
|
||||
|
||||
// background
|
||||
let modalBackground = createElement();
|
||||
modalBackground.className = "m-modal-back";
|
||||
modal.appendChild(modalBackground);
|
||||
|
||||
// modal content
|
||||
let modalContent = createElement();
|
||||
modalContent.className = "m-modal-content";
|
||||
modal.appendChild(modalContent);
|
||||
|
||||
// title (telephone number)
|
||||
titleTel = createElement("strong");
|
||||
titleTel.id = "m-tel-title";
|
||||
titleTel.className = "m-title";
|
||||
modalContent.appendChild(titleTel);
|
||||
|
||||
// Telegram
|
||||
telegram = <HTMLLinkElement>createElement("a");
|
||||
telegram.id = "m-tg";
|
||||
telegram.href = DEFAULT_BTN_HREF;
|
||||
telegram.classList.add("m-open");
|
||||
telegram.classList.add("m-tg");
|
||||
|
||||
// by default not display
|
||||
telegram.style.display = "none";
|
||||
|
||||
telegram.appendChild(createTextNode("open in "));
|
||||
let telegramSpan = createElement(span);
|
||||
telegramSpan.className = "w-500";
|
||||
telegramSpan.appendChild(createTextNode("Telegram"));
|
||||
telegram.appendChild(telegramSpan);
|
||||
|
||||
modalContent.appendChild(telegram);
|
||||
|
||||
// WhatsApp
|
||||
wa = <HTMLLinkElement>createElement("a");
|
||||
wa.id = "m-wa";
|
||||
wa.href = DEFAULT_BTN_HREF;
|
||||
wa.classList.add("m-open");
|
||||
wa.classList.add("m-wa");
|
||||
wa.appendChild(createTextNode("open in "));
|
||||
let waSpan = createElement(span);
|
||||
waSpan.className = "w-500";
|
||||
waSpan.appendChild(createTextNode("WhatsApp"));
|
||||
wa.appendChild(waSpan);
|
||||
|
||||
modalContent.appendChild(wa);
|
||||
|
||||
// Skype
|
||||
skype = <HTMLLinkElement>createElement("a");
|
||||
skype.id = "m-skype";
|
||||
skype.href = DEFAULT_BTN_HREF;
|
||||
skype.classList.add("m-open");
|
||||
skype.classList.add("m-skype");
|
||||
skype.appendChild(createTextNode("open in "));
|
||||
let skypeSpan = createElement(span);
|
||||
skypeSpan.className = "w-500";
|
||||
skypeSpan.appendChild(createTextNode("Skype"));
|
||||
skype.appendChild(skypeSpan);
|
||||
|
||||
modalContent.appendChild(skype);
|
||||
|
||||
// call default
|
||||
call = <HTMLLinkElement>createElement("a");
|
||||
call.id = "m-call";
|
||||
call.href = DEFAULT_BTN_HREF;
|
||||
call.classList.add("m-open");
|
||||
call.classList.add("m-default");
|
||||
let callSpan = createElement(span);
|
||||
callSpan.className = "w-500";
|
||||
callSpan.appendChild(createTextNode("call"));
|
||||
call.appendChild(callSpan);
|
||||
call.appendChild(createTextNode(" as default"));
|
||||
|
||||
modalContent.appendChild(call);
|
||||
|
||||
// copy
|
||||
copyTel = <HTMLLinkElement>createElement("a");
|
||||
copyTel.id = "m-tel-copy";
|
||||
copyTel.href = DEFAULT_BTN_HREF;
|
||||
copyTel.classList.add("m-copy");
|
||||
copyTel.classList.add("w-500");
|
||||
copyTel.appendChild(createTextNode("copy"));
|
||||
|
||||
modalContent.appendChild(copyTel);
|
||||
|
||||
modalContent.appendChild(byElement());
|
||||
|
||||
// add the modal at the end of the body
|
||||
document.body.appendChild(modal);
|
||||
|
||||
// every click outside the modal will hide the modal
|
||||
modalBackground.addEventListener("click", hideMailgo);
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* mailgoRender
|
||||
* function to render a mailgo (mail or tel)
|
||||
*/
|
||||
const mailgoRender = (type = MAIL_TYPE, mailgo: any) => {
|
||||
// mailgo mail
|
||||
if (type === MAIL_TYPE) {
|
||||
// if the element href=^"mailto:"
|
||||
if (mailgo.href && mailgo.href.toLowerCase().startsWith(MAILTO)) {
|
||||
mail = decodeURIComponent(
|
||||
mailgo.href.split("?")[0].split(MAILTO)[1].trim()
|
||||
);
|
||||
|
||||
url = new URL(mailgo.href);
|
||||
let urlParams: URLSearchParams = url.searchParams;
|
||||
|
||||
// optional parameters for the email
|
||||
cc = urlParams.get("cc");
|
||||
bcc = urlParams.get("bcc");
|
||||
subject = urlParams.get("subject");
|
||||
bodyMail = urlParams.get("body");
|
||||
} else {
|
||||
// if the element href="#mailgo" or class="mailgo"
|
||||
// mail = data-address + @ + data-domain
|
||||
mail =
|
||||
mailgo.getAttribute("data-address") +
|
||||
"@" +
|
||||
mailgo.getAttribute("data-domain");
|
||||
|
||||
url = new URL(MAILTO + encodeURIComponent(mail));
|
||||
|
||||
// cc = data-cc-address + @ + data-cc-domain
|
||||
cc =
|
||||
mailgo.getAttribute("data-cc-address") +
|
||||
"@" +
|
||||
mailgo.getAttribute("data-cc-domain");
|
||||
|
||||
// bcc = data-bcc-address + @ + data-bcc-domain
|
||||
bcc =
|
||||
mailgo.getAttribute("data-bcc-address") +
|
||||
"@" +
|
||||
mailgo.getAttribute("data-bcc-domain");
|
||||
|
||||
// subject = data-subject
|
||||
subject = mailgo.getAttribute("data-subject");
|
||||
|
||||
// body = data-body
|
||||
bodyMail = mailgo.getAttribute("data-body");
|
||||
}
|
||||
|
||||
// validate the email address
|
||||
if (!validateEmails(mail.split(","))) return;
|
||||
|
||||
// if cc, bcc is not valid cc, bcc = ""
|
||||
if (cc && !validateEmails(cc.split(","))) cc = "";
|
||||
if (bcc && !validateEmails(bcc.split(","))) bcc = "";
|
||||
|
||||
// the title of the modal (email address)
|
||||
title.innerHTML = mail.split(",").join("<br/>");
|
||||
|
||||
// add the details if provided
|
||||
cc
|
||||
? ((detailCc.style.display = "block"),
|
||||
(ccValue.innerHTML = cc.split(",").join("<br/>")))
|
||||
: (detailCc.style.display = "none");
|
||||
|
||||
bcc
|
||||
? ((detailBcc.style.display = "block"),
|
||||
(bccValue.innerHTML = bcc.split(",").join("<br/>")))
|
||||
: (detailBcc.style.display = "none");
|
||||
|
||||
subject
|
||||
? ((detailSubject.style.display = "block"),
|
||||
(subjectValue.textContent = subject))
|
||||
: (detailSubject.style.display = "none");
|
||||
|
||||
bodyMail
|
||||
? ((detailBody.style.display = "block"),
|
||||
(bodyValue.textContent = bodyMail))
|
||||
: (detailBody.style.display = "none");
|
||||
|
||||
// add the actions
|
||||
gmail.addEventListener("click", openGmail);
|
||||
|
||||
outlook.addEventListener("click", openOutlook);
|
||||
|
||||
encEmail = encodeEmail(mail);
|
||||
open.addEventListener("click", openDefault);
|
||||
|
||||
copyMail.addEventListener("click", () => copy(mail));
|
||||
}
|
||||
// mailgo tel
|
||||
if (type === TEL_TYPE) {
|
||||
if (mailgo.href && mailgo.href.toLowerCase().startsWith(TEL)) {
|
||||
tel = decodeURIComponent(
|
||||
mailgo.href.split("?")[0].split(TEL)[1].trim()
|
||||
);
|
||||
} else if (mailgo.href && mailgo.href.toLowerCase().startsWith(CALLTO)) {
|
||||
tel = decodeURIComponent(
|
||||
mailgo.href.split("?")[0].split(CALLTO)[1].trim()
|
||||
);
|
||||
} else if (mailgo.hasAttribute("data-tel")) {
|
||||
tel = mailgo.getAttribute("data-tel");
|
||||
msg = mailgo.getAttribute("data-msg");
|
||||
}
|
||||
|
||||
// information
|
||||
// let titleEl = getE("m-tel-title");
|
||||
|
||||
// Telegram username
|
||||
if (mailgo.hasAttribute("data-telegram")) {
|
||||
telegramUsername = mailgo.getAttribute("data-telegram");
|
||||
}
|
||||
|
||||
// Telegram username
|
||||
if (mailgo.hasAttribute("data-skype")) {
|
||||
skypeUsername = mailgo.getAttribute("data-skype");
|
||||
}
|
||||
|
||||
// the title of the modal (tel)
|
||||
titleTel.innerHTML = tel;
|
||||
|
||||
// add the actions to buttons
|
||||
wa.addEventListener("click", openWhatsApp);
|
||||
|
||||
if (telegramUsername) {
|
||||
setDisplay("m-tg", "block");
|
||||
telegram.addEventListener("click", openTelegram);
|
||||
}
|
||||
|
||||
skype.addEventListener("click", openSkype);
|
||||
|
||||
call.addEventListener("click", callDefault);
|
||||
|
||||
copyTel.addEventListener("click", () => copy(tel));
|
||||
}
|
||||
|
||||
// show the mailgo
|
||||
showMailgo(type);
|
||||
|
||||
// add listener keyDown
|
||||
document.addEventListener("keydown", mailgoKeydown);
|
||||
};
|
||||
|
||||
// actions
|
||||
const openGmail = () => {
|
||||
// Gmail url
|
||||
let gmailUrl =
|
||||
"https://mail.google.com/mail/u/0/?view=cm&source=mailto&to=" +
|
||||
encodeURIComponent(mail);
|
||||
|
||||
// the details if provided
|
||||
if (cc) gmailUrl = gmailUrl.concat("&cc=" + encodeURIComponent(cc));
|
||||
if (bcc) gmailUrl = gmailUrl.concat("&bcc=" + encodeURIComponent(bcc));
|
||||
if (subject) gmailUrl = gmailUrl.concat("&subject=" + subject);
|
||||
if (bodyMail) gmailUrl = gmailUrl.concat("&body=" + bodyMail);
|
||||
|
||||
// open the link
|
||||
window.open(gmailUrl, "_blank");
|
||||
|
||||
// hide the modal
|
||||
hideMailgo();
|
||||
};
|
||||
|
||||
const openOutlook = () => {
|
||||
// Outlook url
|
||||
let outlookUrl =
|
||||
"https://outlook.live.com/owa/?path=/mail/action/compose&to=" +
|
||||
encodeURIComponent(mail);
|
||||
|
||||
// the details if provided
|
||||
if (subject) outlookUrl = outlookUrl.concat("&subject=" + subject);
|
||||
if (bodyMail) outlookUrl = outlookUrl.concat("&body=" + bodyMail);
|
||||
|
||||
// open the link
|
||||
window.open(outlookUrl, "_blank");
|
||||
|
||||
// hide the modal
|
||||
hideMailgo();
|
||||
};
|
||||
|
||||
const openDefault = () => {
|
||||
mailToEncoded(encEmail);
|
||||
hideMailgo();
|
||||
};
|
||||
|
||||
const openTelegram = () => {
|
||||
// Telegram url
|
||||
let tgUrl = "https://t.me/" + telegramUsername;
|
||||
|
||||
// open the url
|
||||
window.open(tgUrl, "_blank");
|
||||
|
||||
// hide the modal
|
||||
hideMailgo();
|
||||
};
|
||||
|
||||
const openSkype = () => {
|
||||
let skype = skypeUsername !== "" ? skypeUsername : tel;
|
||||
|
||||
// Telegram url
|
||||
let skypeUrl = "skype:" + skype;
|
||||
|
||||
// open the url
|
||||
window.open(skypeUrl, "_blank");
|
||||
|
||||
// hide the modal
|
||||
hideMailgo();
|
||||
};
|
||||
|
||||
const openWhatsApp = () => {
|
||||
// WhatsApp url
|
||||
let waUrl = "https://wa.me/" + tel;
|
||||
|
||||
// the details if provided
|
||||
if (msg) waUrl + "?text=" + msg;
|
||||
|
||||
// open the url
|
||||
window.open(waUrl, "_blank");
|
||||
|
||||
// hide the modal
|
||||
hideMailgo();
|
||||
};
|
||||
|
||||
const callDefault = () => {
|
||||
let callUrl = "tel:" + tel;
|
||||
window.open(callUrl);
|
||||
hideMailgo();
|
||||
};
|
||||
|
||||
const copy = (content: string) => {
|
||||
copyToClipboard(content);
|
||||
let activeCopy: HTMLElement;
|
||||
// the correct copyButton (mail or tel)
|
||||
mailgoIsShowing(MAIL_TYPE)
|
||||
? (activeCopy = copyMail)
|
||||
: (activeCopy = copyTel);
|
||||
activeCopy.textContent = "copied";
|
||||
setTimeout(() => {
|
||||
activeCopy.textContent = "copy";
|
||||
// hide after the timeout
|
||||
hideMailgo();
|
||||
}, 999);
|
||||
};
|
||||
|
||||
// function that returns if an element is a mailgo
|
||||
const isMailgo = (element: HTMLElement, type: string = MAIL_TYPE) => {
|
||||
let href: string = (element as HTMLLinkElement).href;
|
||||
|
||||
// mailgo type mail
|
||||
if (type === MAIL_TYPE) {
|
||||
return (
|
||||
// first case: it is an <a> element with "mailto:..." in href and no no-mailgo in classList
|
||||
(href &&
|
||||
href.toLowerCase().startsWith(MAILTO) &&
|
||||
!element.classList.contains("no-mailgo")) ||
|
||||
(element.hasAttribute("data-address") &&
|
||||
// second case: the href=#mailgo
|
||||
((href && element.getAttribute("href").toLowerCase() === "#mailgo") ||
|
||||
// third case: the classList contains mailgo
|
||||
(element.classList && element.classList.contains("mailgo"))))
|
||||
);
|
||||
}
|
||||
|
||||
// mailgo type tel
|
||||
if (type === TEL_TYPE) {
|
||||
return (
|
||||
// first case: it is an <a> element with "tel:..." or "callto:..." in href and no no-mailgo in classList
|
||||
(href &&
|
||||
(href.toLowerCase().startsWith(TEL) ||
|
||||
href.toLowerCase().startsWith(CALLTO)) &&
|
||||
!element.classList.contains("no-mailgo")) ||
|
||||
(element.hasAttribute("data-tel") &&
|
||||
// second case: the href=#mailgo
|
||||
href &&
|
||||
element.getAttribute("href").toLowerCase() === "#mailgo") ||
|
||||
// third case: the classList contains mailgo
|
||||
(element.classList && element.classList.contains("mailgo"))
|
||||
);
|
||||
}
|
||||
|
||||
return false;
|
||||
};
|
||||
|
||||
/**
|
||||
* mailgoCheckRender
|
||||
* function to check if an element is mailgo-enabled or not referencing to
|
||||
* mail:
|
||||
* document.querySelectorAll(
|
||||
* 'a[href^="mailto:" i]:not(.no-mailgo), a[href="#mailgo"], a.mailgo'
|
||||
* );
|
||||
* tel:
|
||||
* document.querySelectorAll(
|
||||
* 'a[href^="tel:" i]:not(.no-mailgo), a[href="#mailgo"], a.mailgo'
|
||||
* );
|
||||
* or
|
||||
* document.querySelectorAll(
|
||||
* 'a[href^="callto:" i]:not(.no-mailgo), a[href="#mailgo"], a.mailgo'
|
||||
* );
|
||||
*/
|
||||
const mailgoCheckRender = (event: Event) => {
|
||||
// check if the id=mailgo exists in the body
|
||||
if (
|
||||
!document.contains(getE("mailgo")) ||
|
||||
!document.contains(getE("mailgo-tel"))
|
||||
)
|
||||
return;
|
||||
|
||||
// if a mailgo is already showing do nothing
|
||||
if (mailgoIsShowing(MAIL_TYPE) || mailgoIsShowing(TEL_TYPE)) return;
|
||||
|
||||
// the path of the event
|
||||
let path =
|
||||
(event.composedPath && event.composedPath()) ||
|
||||
composedPath(event.target as HTMLElement);
|
||||
|
||||
if (path) {
|
||||
path.forEach((element: HTMLElement) => {
|
||||
if (element instanceof HTMLDocument || element instanceof Window)
|
||||
return;
|
||||
|
||||
// go in the event.path to find if the user has clicked on a mailgo element
|
||||
if (isMailgo(element, MAIL_TYPE)) {
|
||||
// stop the normal execution of the element click
|
||||
event.preventDefault();
|
||||
|
||||
// render mailgo
|
||||
mailgoRender(MAIL_TYPE, element);
|
||||
|
||||
return;
|
||||
}
|
||||
if (isMailgo(element, TEL_TYPE)) {
|
||||
// stop the normal execution of the element click
|
||||
event.preventDefault();
|
||||
|
||||
// render mailgo
|
||||
mailgoRender(TEL_TYPE, element);
|
||||
|
||||
return;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
return;
|
||||
};
|
||||
|
||||
/**
|
||||
* mailgoKeydown
|
||||
* function to manage the keydown event when the modal is showing
|
||||
*/
|
||||
const mailgoKeydown = (event: KeyboardEvent) => {
|
||||
// if mailgo is showing
|
||||
if (mailgoIsShowing(MAIL_TYPE)) {
|
||||
switch (event.keyCode) {
|
||||
case 27:
|
||||
// Escape
|
||||
hideMailgo();
|
||||
break;
|
||||
case 71:
|
||||
// g -> open GMail
|
||||
openGmail();
|
||||
break;
|
||||
case 79:
|
||||
// o -> open Outlook
|
||||
openOutlook();
|
||||
break;
|
||||
case 32:
|
||||
case 13:
|
||||
// spacebar or enter -> open default
|
||||
openDefault();
|
||||
break;
|
||||
case 67:
|
||||
// c -> copy
|
||||
copy(mail);
|
||||
break;
|
||||
default:
|
||||
return;
|
||||
}
|
||||
} else if (mailgoIsShowing(TEL_TYPE)) {
|
||||
switch (event.keyCode) {
|
||||
case 27:
|
||||
// Escape
|
||||
hideMailgo();
|
||||
break;
|
||||
case 84:
|
||||
// t -> open Telegram
|
||||
openTelegram();
|
||||
break;
|
||||
case 87:
|
||||
// w -> open WhatsApp
|
||||
openWhatsApp();
|
||||
break;
|
||||
case 32:
|
||||
case 13:
|
||||
// spacebar or enter -> call default
|
||||
callDefault();
|
||||
break;
|
||||
case 67:
|
||||
// c -> copy
|
||||
copy(tel);
|
||||
break;
|
||||
default:
|
||||
return;
|
||||
}
|
||||
}
|
||||
return;
|
||||
};
|
||||
|
||||
// show the modal
|
||||
const showMailgo = (type = MAIL_TYPE) => {
|
||||
// show mailgo type mail
|
||||
if (type === MAIL_TYPE) {
|
||||
setDisplay("mailgo", "flex");
|
||||
return;
|
||||
}
|
||||
// show mailgo type tel
|
||||
if (type === TEL_TYPE) {
|
||||
setDisplay("mailgo-tel", "flex");
|
||||
return;
|
||||
}
|
||||
};
|
||||
|
||||
// hide the modal
|
||||
const hideMailgo = () => {
|
||||
setDisplay("mailgo", "none");
|
||||
setDisplay("mailgo-tel", "none");
|
||||
|
||||
// remove listener keyDown
|
||||
document.removeEventListener("keydown", mailgoKeydown);
|
||||
};
|
||||
|
||||
// is the mailgo modal hidden?
|
||||
const mailgoIsShowing = (type = MAIL_TYPE) => {
|
||||
return type === MAIL_TYPE
|
||||
? getDisplay("mailgo") === "flex"
|
||||
: type === TEL_TYPE
|
||||
? getDisplay("mailgo-tel") === "flex"
|
||||
: false;
|
||||
};
|
||||
|
||||
const byElement = () => {
|
||||
// by
|
||||
let by: HTMLLinkElement = <HTMLLinkElement>createElement("a");
|
||||
by.href = "https://mailgo.js.org?ref=mailgo-modal";
|
||||
by.className = "m-by";
|
||||
by.target = "_blank";
|
||||
by.rel = "noopener noreferrer";
|
||||
by.appendChild(createTextNode("mailgo.js.org"));
|
||||
|
||||
return by;
|
||||
};
|
||||
|
||||
// create element
|
||||
const createElement = (element: string = "div") =>
|
||||
document.createElement(element);
|
||||
|
||||
// create text node
|
||||
const createTextNode = (element: string) => document.createTextNode(element);
|
||||
|
||||
// decrypt email
|
||||
const mailToEncoded = (encoded: string) =>
|
||||
(window.location.href = MAILTO + atob(encoded));
|
||||
|
||||
// encode email
|
||||
const encodeEmail = (email: string) => btoa(email);
|
||||
|
||||
// getE shorthand
|
||||
const getE = (id: string) => document.getElementById(id);
|
||||
|
||||
// get display value
|
||||
const getDisplay = (id: string) => getE(id).style.display;
|
||||
|
||||
// get display value
|
||||
const setDisplay = (id: string, value: string) =>
|
||||
(getE(id).style.display = value);
|
||||
|
||||
// custom composedPath if path or event.composedPath() are not defined
|
||||
const composedPath = (el: HTMLElement) => {
|
||||
let path = [];
|
||||
|
||||
while (el) {
|
||||
path.push(el);
|
||||
|
||||
if (el.tagName === "HTML") {
|
||||
path.push(document);
|
||||
path.push(window);
|
||||
return path;
|
||||
}
|
||||
|
||||
el = el.parentElement;
|
||||
}
|
||||
};
|
||||
|
||||
// validate a single email with regex
|
||||
const validateEmail = (email: string) =>
|
||||
/^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/.test(
|
||||
email
|
||||
);
|
||||
|
||||
// validate an array of emails
|
||||
const validateEmails = (arr: string[]) => arr.every(validateEmail);
|
||||
|
||||
// copy of a string
|
||||
const copyToClipboard = (str: string) => {
|
||||
let el: HTMLInputElement = <HTMLInputElement>createElement("textarea");
|
||||
el.value = str;
|
||||
el.setAttribute("readonly", "");
|
||||
el.style.position = "absolute";
|
||||
el.style.left = "-9999px";
|
||||
document.body.appendChild(el);
|
||||
let selected =
|
||||
document.getSelection().rangeCount > 0
|
||||
? document.getSelection().getRangeAt(0)
|
||||
: false;
|
||||
el.select();
|
||||
document.execCommand("copy");
|
||||
document.body.removeChild(el);
|
||||
if (selected) {
|
||||
document.getSelection().removeAllRanges();
|
||||
document.getSelection().addRange(selected);
|
||||
}
|
||||
};
|
||||
|
||||
// start mailgo
|
||||
(() => {
|
||||
// if the window is defined...
|
||||
if (window && typeof window !== "undefined") {
|
||||
// if the window object exists...
|
||||
// mailgo style (gulp)
|
||||
let mailgoCSS: HTMLStyleElement = <HTMLStyleElement>(
|
||||
createElement("style")
|
||||
);
|
||||
mailgoCSS.id = "mailgo-style";
|
||||
mailgoCSS.type = "text/css";
|
||||
mailgoCSS.appendChild(
|
||||
createTextNode(
|
||||
`.m-modal{position:fixed;top:0;right:0;bottom:0;left:0;-webkit-box-pack:center;-webkit-justify-content:center;-moz-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-webkit-align-items:center;-moz-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;-moz-box-orient:vertical;-moz-box-direction:normal;-ms-flex-direction:column;flex-direction:column;overflow:hidden;font-size:15px;z-index:10000}.m-modal a,.m-modal p,.m-modal span,.m-modal strong{margin:0;padding:0;font-size:100%;line-height:1;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";text-rendering:optimizeLegibility}.m-modal strong{font-weight:700}.m-modal .m-modal-back{position:absolute;z-index:10001;top:0;right:0;bottom:0;left:0;background-color:rgba(32,35,42,.75);opacity:.8}.m-modal .m-modal-content{position:relative;z-index:10002;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;text-align:center;min-width:200px;max-width:240px;background-color:#fff;opacity:.97;-webkit-border-radius:8px;-moz-border-radius:8px;border-radius:8px;-webkit-box-shadow:0 3px 20px rgba(32,35,42,.5);-moz-box-shadow:0 3px 20px rgba(32,35,42,.5);box-shadow:0 3px 20px rgba(32,35,42,.5);color:#4a4a4a;display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;-moz-box-orient:vertical;-moz-box-direction:normal;-ms-flex-direction:column;flex-direction:column;overflow:auto;padding:20px;-webkit-transition:.5s -webkit-box-shadow;transition:.5s -webkit-box-shadow;-o-transition:.5s box-shadow;-moz-transition:.5s box-shadow,.5s -moz-box-shadow;transition:.5s box-shadow;transition:.5s box-shadow,.5s -webkit-box-shadow,.5s -moz-box-shadow}.m-modal .m-modal-content:hover{opacity:1;-webkit-box-shadow:0 7px 20px rgba(32,35,42,.85);-moz-box-shadow:0 7px 20px rgba(32,35,42,.85);box-shadow:0 7px 20px rgba(32,35,42,.85)}.m-modal .m-modal-content .m-title{margin-bottom:8px;overflow:hidden;white-space:nowrap;-o-text-overflow:ellipsis;text-overflow:ellipsis}.m-modal .m-modal-content .m-details{margin-bottom:10px}.m-modal .m-modal-content .m-details p{font-size:12px;margin-top:3px;margin-bottom:3px}.m-modal .m-modal-content a{padding:10px;color:#4a4a4a;-webkit-border-radius:8px;-moz-border-radius:8px;border-radius:8px;text-decoration:none}.m-modal .m-modal-content a.m-gmail{color:#d44638}.m-modal .m-modal-content a.m-gmail:hover{background-color:rgba(212,70,56,.08);color:#d44638}.m-modal .m-modal-content a.m-outlook{color:#0072c6}.m-modal .m-modal-content a.m-outlook:hover{background-color:rgba(0,114,198,.08);color:#0072c6}.m-modal .m-modal-content a.m-tg{color:#08c}.m-modal .m-modal-content a.m-tg:hover{background-color:rgba(0,114,198,.08);color:#08c}.m-modal .m-modal-content a.m-wa{color:#00bfa5}.m-modal .m-modal-content a.m-wa:hover{background-color:rgba(0,191,165,.08);color:#00bfa5}.m-modal .m-modal-content a.m-skype{color:#00aff0}.m-modal .m-modal-content a.m-skype:hover{background-color:rgba(0,175,240,.08);color:#00aff0}.m-modal .m-modal-content a.m-copy{padding:16px 10px;font-size:16px}.m-modal .m-modal-content a.m-copy:hover,.m-modal .m-modal-content a.m-default:hover{background-color:rgba(0,0,0,.08);color:#4a4a4a}.m-modal .m-modal-content a.m-by{font-size:8px;margin-top:.8rem;padding:5px;color:#4a4a4a;opacity:.5}.m-modal .m-modal-content a.m-by:hover{opacity:1}.m-modal .m-modal-content .w-500{font-weight:500}`
|
||||
)
|
||||
);
|
||||
document.head.appendChild(mailgoCSS);
|
||||
|
||||
// DOMContentLoaded -> mailgoInit (creates the modals)
|
||||
document.addEventListener("DOMContentLoaded", mailgoInit);
|
||||
|
||||
// event listener on body, if the element is mailgo-compatible the mailgo modal will be rendered
|
||||
document.addEventListener("click", mailgoCheckRender);
|
||||
}
|
||||
})();
|
||||
};
|
||||
|
||||
// if mailgo is included as a script
|
||||
if (window && typeof window !== "undefined") {
|
||||
mailgo();
|
||||
}
|
||||
|
||||
// export mailgo
|
||||
export default mailgo;
|
||||
+3
-3
@@ -1,8 +1,8 @@
|
||||
type MailgoConfig = {};
|
||||
|
||||
const mailgoVersion: string = "MAILGO_VERSION";
|
||||
|
||||
const mailgo = (config?: MailgoConfig) => {
|
||||
type MailgoConfig = {};
|
||||
|
||||
const mailgo = (config?: MailgoConfig): void => {
|
||||
// links
|
||||
const MAILTO: string = "mailto:";
|
||||
const TEL: string = "tel:";
|
||||
|
||||
@@ -11,14 +11,4 @@ module.exports = [
|
||||
libraryTarget: "umd",
|
||||
},
|
||||
},
|
||||
{
|
||||
mode: "production",
|
||||
entry: "./dist/mailgo.min.js",
|
||||
output: {
|
||||
filename: "./dist/mailgo.min.js",
|
||||
path: path.resolve(__dirname),
|
||||
library: "mailgo",
|
||||
libraryTarget: "umd",
|
||||
},
|
||||
},
|
||||
];
|
||||
@@ -6831,9 +6831,9 @@ terser-webpack-plugin@^1.4.3:
|
||||
worker-farm "^1.7.0"
|
||||
|
||||
terser@^4.0.0, terser@^4.1.2:
|
||||
version "4.6.11"
|
||||
resolved "https://registry.yarnpkg.com/terser/-/terser-4.6.11.tgz#12ff99fdd62a26de2a82f508515407eb6ccd8a9f"
|
||||
integrity sha512-76Ynm7OXUG5xhOpblhytE7X58oeNSmC8xnNhjWVo8CksHit0U0kO4hfNbPrrYwowLWFgM2n9L176VNx2QaHmtA==
|
||||
version "4.6.12"
|
||||
resolved "https://registry.yarnpkg.com/terser/-/terser-4.6.12.tgz#44b98aef8703fdb09a3491bf79b43faffc5b4fee"
|
||||
integrity sha512-fnIwuaKjFPANG6MAixC/k1TDtnl1YlPLUlLVIxxGZUn1gfUx2+l3/zGNB72wya+lgsb50QBi2tUV75RiODwnww==
|
||||
dependencies:
|
||||
commander "^2.20.0"
|
||||
source-map "~0.6.1"
|
||||
|
||||
Reference in new issue
Block a user