odit/mailymaily
4
0
Fork 0
Code Issues Pull Requests Projects Releases 2 Wiki Activity

new build

Browse Source
This commit is contained in:
Matteo Manzinello 2020-04-25 14:38:57 +02:00
parent 43a6ccc91f
commit 1379cd7114
3 changed files with 54 additions and 44 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
dist/mailgo.min.js vendored
View File

File diff suppressed because one or more lines are too long

17
mailgo.js
View File

@ -474,32 +474,32 @@ const mailgoCheckRender = (event) => {
return; return;
// if a mailgo is already showing do nothing // if a mailgo is already showing do nothing
if (mailgoIsShowing(MAIL_TYPE) || mailgoIsShowing(TEL_TYPE)) if (mailgoIsShowing(MAIL_TYPE) || mailgoIsShowing(TEL_TYPE))
return; return false;
// the path of the event // the path of the event
let path = (event.composedPath && event.composedPath()) || let path = (event.composedPath && event.composedPath()) ||
composedPath(event.target); composedPath(event.target);
if (path) { if (path) {
path.forEach((element) => { path.forEach((element) => {
if (element instanceof HTMLDocument || element instanceof Window) if (element instanceof HTMLDocument || element instanceof Window)
return; return false;
// go in the event.path to find if the user has clicked on a mailgo element // go in the event.path to find if the user has clicked on a mailgo element
if (isMailgo(element, MAIL_TYPE)) { if (isMailgo(element, MAIL_TYPE)) {
// stop the normal execution of the element click // stop the normal execution of the element click
event.preventDefault(); event.preventDefault();
// render mailgo // render mailgo
mailgoRender(MAIL_TYPE, element); mailgoRender(MAIL_TYPE, element);
return; return true;
} }
if (isMailgo(element, TEL_TYPE)) { if (isMailgo(element, TEL_TYPE)) {
// stop the normal execution of the element click // stop the normal execution of the element click
event.preventDefault(); event.preventDefault();
// render mailgo // render mailgo
mailgoRender(TEL_TYPE, element); mailgoRender(TEL_TYPE, element);
return; return true;
} }
}); });
} }
return; return false;
}; };
/** /**
* mailgoKeydown * mailgoKeydown
@ -568,13 +568,14 @@ const showMailgo = (type = MAIL_TYPE) => {
// show mailgo type mail // show mailgo type mail
if (type === MAIL_TYPE) { if (type === MAIL_TYPE) {
setDisplay("mailgo", "flex"); setDisplay("mailgo", "flex");
return; return true;
} }
// show mailgo type tel // show mailgo type tel
if (type === TEL_TYPE) { if (type === TEL_TYPE) {
setDisplay("mailgo-tel", "flex"); setDisplay("mailgo-tel", "flex");
return; return true;
} }
return false;
}; };
// hide the modal // hide the modal
const hideMailgo = () => { const hideMailgo = () => {
@ -649,7 +650,9 @@ const copyToClipboard = (str) => {
if (selected) { if (selected) {
document.getSelection().removeAllRanges(); document.getSelection().removeAllRanges();
document.getSelection().addRange(selected); document.getSelection().addRange(selected);
return true;
} }
return false;
}; };
const mailgoStyle = () => { const mailgoStyle = () => {
// mailgo style // mailgo style

79
mailgo.ts
View File

@ -299,7 +299,7 @@ const mailgoInit = (): void => {
* mailgoRender * mailgoRender
* function to render a mailgo (mail or tel) * function to render a mailgo (mail or tel)
*/ */
const mailgoRender = (type = MAIL_TYPE, mailgo: any) => { const mailgoRender = (type = MAIL_TYPE, mailgo: any): void => {
// mailgo mail // mailgo mail
if (type === MAIL_TYPE) { if (type === MAIL_TYPE) {
// if the element href=^"mailto:" // if the element href=^"mailto:"
@ -438,7 +438,7 @@ const mailgoRender = (type = MAIL_TYPE, mailgo: any) => {
}; };
// actions // actions
const openGmail = () => { const openGmail = (): void => {
// Gmail url // Gmail url
let gmailUrl = let gmailUrl =
"https://mail.google.com/mail/u/0/?view=cm&source=mailto&to=" + "https://mail.google.com/mail/u/0/?view=cm&source=mailto&to=" +
@ -457,7 +457,7 @@ const openGmail = () => {
hideMailgo(); hideMailgo();
}; };
const openOutlook = () => { const openOutlook = (): void => {
// Outlook url // Outlook url
let outlookUrl = let outlookUrl =
"https://outlook.live.com/owa/?path=/mail/action/compose&to=" + "https://outlook.live.com/owa/?path=/mail/action/compose&to=" +
@ -474,12 +474,12 @@ const openOutlook = () => {
hideMailgo(); hideMailgo();
}; };
const openDefault = () => { const openDefault = (): void => {
mailToEncoded(encEmail); mailToEncoded(encEmail);
hideMailgo(); hideMailgo();
}; };
const openTelegram = () => { const openTelegram = (): void => {
// Telegram url // Telegram url
let tgUrl = "https://t.me/" + telegramUsername; let tgUrl = "https://t.me/" + telegramUsername;
@ -490,7 +490,7 @@ const openTelegram = () => {
hideMailgo(); hideMailgo();
}; };
const openSkype = () => { const openSkype = (): void => {
let skype = skypeUsername !== "" ? skypeUsername : tel; let skype = skypeUsername !== "" ? skypeUsername : tel;
// Telegram url // Telegram url
@ -503,7 +503,7 @@ const openSkype = () => {
hideMailgo(); hideMailgo();
}; };
const openWhatsApp = () => { const openWhatsApp = (): void => {
// WhatsApp url // WhatsApp url
let waUrl = "https://wa.me/" + tel; let waUrl = "https://wa.me/" + tel;
@ -517,13 +517,13 @@ const openWhatsApp = () => {
hideMailgo(); hideMailgo();
}; };
const callDefault = () => { const callDefault = (): void => {
let callUrl = "tel:" + tel; let callUrl = "tel:" + tel;
window.open(callUrl); window.open(callUrl);
hideMailgo(); hideMailgo();
}; };
const copy = (content: string) => { const copy = (content: string): void => {
copyToClipboard(content); copyToClipboard(content);
let activeCopy: HTMLElement; let activeCopy: HTMLElement;
// the correct copyButton (mail or tel) // the correct copyButton (mail or tel)
@ -537,7 +537,7 @@ const copy = (content: string) => {
}; };
// function that returns if an element is a mailgo // function that returns if an element is a mailgo
const isMailgo = (element: HTMLElement, type: string = MAIL_TYPE) => { const isMailgo = (element: HTMLElement, type: string = MAIL_TYPE): boolean => {
let href: string = (element as HTMLLinkElement).href; let href: string = (element as HTMLLinkElement).href;
// mailgo type mail // mailgo type mail
@ -591,7 +591,7 @@ const isMailgo = (element: HTMLElement, type: string = MAIL_TYPE) => {
* 'a[href^="callto:" i]:not(.no-mailgo), a[href="#mailgo"], a.mailgo' * 'a[href^="callto:" i]:not(.no-mailgo), a[href="#mailgo"], a.mailgo'
* ); * );
*/ */
const mailgoCheckRender = (event: Event) => { const mailgoCheckRender = (event: Event): boolean => {
// check if the id=mailgo exists in the body // check if the id=mailgo exists in the body
if ( if (
!document.contains(getE("mailgo")) || !document.contains(getE("mailgo")) ||
@ -600,7 +600,7 @@ const mailgoCheckRender = (event: Event) => {
return; return;
// if a mailgo is already showing do nothing // if a mailgo is already showing do nothing
if (mailgoIsShowing(MAIL_TYPE) || mailgoIsShowing(TEL_TYPE)) return; if (mailgoIsShowing(MAIL_TYPE) || mailgoIsShowing(TEL_TYPE)) return false;
// the path of the event // the path of the event
let path = let path =
@ -609,7 +609,8 @@ const mailgoCheckRender = (event: Event) => {
if (path) { if (path) {
path.forEach((element: HTMLElement) => { path.forEach((element: HTMLElement) => {
if (element instanceof HTMLDocument || element instanceof Window) return; if (element instanceof HTMLDocument || element instanceof Window)
return false;
// go in the event.path to find if the user has clicked on a mailgo element // go in the event.path to find if the user has clicked on a mailgo element
if (isMailgo(element, MAIL_TYPE)) { if (isMailgo(element, MAIL_TYPE)) {
@ -619,7 +620,7 @@ const mailgoCheckRender = (event: Event) => {
// render mailgo // render mailgo
mailgoRender(MAIL_TYPE, element); mailgoRender(MAIL_TYPE, element);
return; return true;
} }
if (isMailgo(element, TEL_TYPE)) { if (isMailgo(element, TEL_TYPE)) {
// stop the normal execution of the element click // stop the normal execution of the element click
@ -628,19 +629,19 @@ const mailgoCheckRender = (event: Event) => {
// render mailgo // render mailgo
mailgoRender(TEL_TYPE, element); mailgoRender(TEL_TYPE, element);
return; return true;
} }
}); });
} }
return; return false;
}; };
/** /**
* mailgoKeydown * mailgoKeydown
* function to manage the keydown event when the modal is showing * function to manage the keydown event when the modal is showing
*/ */
const mailgoKeydown = (event: KeyboardEvent) => { const mailgoKeydown = (event: KeyboardEvent): void => {
// if mailgo is showing // if mailgo is showing
if (mailgoIsShowing(MAIL_TYPE)) { if (mailgoIsShowing(MAIL_TYPE)) {
switch (event.keyCode) { switch (event.keyCode) {
@ -699,21 +700,22 @@ const mailgoKeydown = (event: KeyboardEvent) => {
}; };
// show the modal // show the modal
const showMailgo = (type = MAIL_TYPE) => { const showMailgo = (type = MAIL_TYPE): boolean => {
// show mailgo type mail // show mailgo type mail
if (type === MAIL_TYPE) { if (type === MAIL_TYPE) {
setDisplay("mailgo", "flex"); setDisplay("mailgo", "flex");
return; return true;
} }
// show mailgo type tel // show mailgo type tel
if (type === TEL_TYPE) { if (type === TEL_TYPE) {
setDisplay("mailgo-tel", "flex"); setDisplay("mailgo-tel", "flex");
return; return true;
} }
return false;
}; };
// hide the modal // hide the modal
const hideMailgo = () => { const hideMailgo = (): void => {
setDisplay("mailgo", "none"); setDisplay("mailgo", "none");
setDisplay("mailgo-tel", "none"); setDisplay("mailgo-tel", "none");
@ -722,7 +724,7 @@ const hideMailgo = () => {
}; };
// is the mailgo modal hidden? // is the mailgo modal hidden?
const mailgoIsShowing = (type = MAIL_TYPE) => { const mailgoIsShowing = (type = MAIL_TYPE): boolean => {
return type === MAIL_TYPE return type === MAIL_TYPE
? getDisplay("mailgo") === "flex" ? getDisplay("mailgo") === "flex"
: type === TEL_TYPE : type === TEL_TYPE
@ -730,7 +732,7 @@ const mailgoIsShowing = (type = MAIL_TYPE) => {
: false; : false;
}; };
const byElement = () => { const byElement = (): HTMLLinkElement => {
// by // by
let by: HTMLLinkElement = <HTMLLinkElement>createElement("a"); let by: HTMLLinkElement = <HTMLLinkElement>createElement("a");
by.href = "https://mailgo.js.org?ref=mailgo-modal"; by.href = "https://mailgo.js.org?ref=mailgo-modal";
@ -743,31 +745,34 @@ const byElement = () => {
}; };
// create element // create element
const createElement = (element: string = "div") => const createElement = (element: string = "div"): HTMLElement =>
document.createElement(element); document.createElement(element);
// create text node // create text node
const createTextNode = (element: string) => document.createTextNode(element); const createTextNode = (element: string): Text =>
document.createTextNode(element);
// decrypt email // decrypt email
const mailToEncoded = (encoded: string) => const mailToEncoded = (encoded: string): string =>
(window.location.href = MAILTO + atob(encoded)); (window.location.href = MAILTO + atob(encoded));
// encode email // encode email
const encodeEmail = (email: string) => btoa(email); const encodeEmail = (email: string): string => btoa(email);
// getE shorthand // getE shorthand
const getE = (id: string) => document.getElementById(id); const getE = (id: string): HTMLElement => document.getElementById(id);
// get display value // get display value
const getDisplay = (id: string) => getE(id).style.display; const getDisplay = (id: string): string => getE(id).style.display;
// get display value // get display value
const setDisplay = (id: string, value: string) => const setDisplay = (id: string, value: string): string =>
(getE(id).style.display = value); (getE(id).style.display = value);
// custom composedPath if path or event.composedPath() are not defined // custom composedPath if path or event.composedPath() are not defined
const composedPath = (el: HTMLElement) => { const composedPath = (
el: HTMLElement
): (HTMLElement | Document | (Window & typeof globalThis))[] => {
let path = []; let path = [];
while (el) { while (el) {
@ -784,16 +789,16 @@ const composedPath = (el: HTMLElement) => {
}; };
// validate a single email with regex // validate a single email with regex
const validateEmail = (email: string) => const validateEmail = (email: string): boolean =>
/^(([^<>()[\]\\.,;:\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( /^(([^<>()[\]\\.,;:\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 email
); );
// validate an array of emails // validate an array of emails
const validateEmails = (arr: string[]) => arr.every(validateEmail); const validateEmails = (arr: string[]): boolean => arr.every(validateEmail);
// copy of a string // copy of a string
const copyToClipboard = (str: string) => { const copyToClipboard = (str: string): boolean => {
let el: HTMLInputElement = <HTMLInputElement>createElement("textarea"); let el: HTMLInputElement = <HTMLInputElement>createElement("textarea");
el.value = str; el.value = str;
el.setAttribute("readonly", ""); el.setAttribute("readonly", "");
@ -810,10 +815,12 @@ const copyToClipboard = (str: string) => {
if (selected) { if (selected) {
document.getSelection().removeAllRanges(); document.getSelection().removeAllRanges();
document.getSelection().addRange(selected); document.getSelection().addRange(selected);
return true;
} }
return false;
}; };
const mailgoStyle = () => { const mailgoStyle = (): void => {
// mailgo style // mailgo style
let mailgoCSS: HTMLStyleElement = <HTMLStyleElement>createElement("style"); let mailgoCSS: HTMLStyleElement = <HTMLStyleElement>createElement("style");
mailgoCSS.id = "mailgo-style"; mailgoCSS.id = "mailgo-style";
@ -823,7 +830,7 @@ const mailgoStyle = () => {
}; };
// mailgo // mailgo
const mailgo = (mailgoConfig?: any) => { const mailgo = (mailgoConfig?: any): void => {
// if the window is defined... // if the window is defined...
if (window && typeof window !== "undefined") { if (window && typeof window !== "undefined") {
// add the style for mailgo // add the style for mailgo