avanti con mailgo
This commit is contained in:
Matteo Manzinello
parent
42f9d99adc
commit
f3a2196973
|
|
@ -52,11 +52,13 @@ let styles = `
|
|||
.mailgo-modal-content a {
|
||||
display: block;
|
||||
color: #4a4a4a;
|
||||
padding: 10px;
|
||||
border-radius: 4px;
|
||||
text-decoration: none;
|
||||
}
|
||||
.mailgo-modal-content a:hover {
|
||||
.mailgo-modal-content a {
|
||||
padding: 10px;
|
||||
}
|
||||
.mailgo-modal-content a.mailgo-open:hover, .mailgo-modal-content a.mailgo-copy:hover {
|
||||
background-color: rgba(0, 0, 0, 0.08);
|
||||
}
|
||||
.mailgo-modal-content a.outlook {
|
||||
|
|
@ -78,12 +80,8 @@ let styles = `
|
|||
.mailgo-by {
|
||||
display: block;
|
||||
font-size: 8px;
|
||||
padding: 5px;
|
||||
margin-top: 0.75rem;
|
||||
}
|
||||
.mailgo-by:hover {
|
||||
background-color: none;
|
||||
}
|
||||
`;
|
||||
|
||||
// CSS
|
||||
|
|
@ -141,8 +139,11 @@ mailgos.forEach((mailgo, index) => {
|
|||
gmail.href = "https://mail.google.com/mail?extsrc=mailto&url=" + mailgo.href;
|
||||
gmail.classList.add("mailgo-open");
|
||||
gmail.classList.add("gmail");
|
||||
let gmailContent = document.createTextNode("open in Gmail");
|
||||
let gmailContent = document.createTextNode("open in ");
|
||||
let gmailSpan = document.createElement("span");
|
||||
gmailSpan.className = "mailgo-weight-500";
|
||||
gmail.appendChild(gmailContent);
|
||||
gmailSpan.parentNode.insertBefore(gmailContent);
|
||||
modalContent.appendChild(gmail);
|
||||
|
||||
// Outlook
|
||||
|
|
@ -183,6 +184,7 @@ mailgos.forEach((mailgo, index) => {
|
|||
let by = document.createElement("a");
|
||||
by.href = "https://mailgo.js.org";
|
||||
by.className = "mailgo-by";
|
||||
by.target = "_blank";
|
||||
|
||||
let textBy = document.createTextNode("mailgo.js.org");
|
||||
by.appendChild(textBy);
|
||||
|
|
|
|||
|
|
@ -1 +1 @@
|
|||
let mailgos=document.querySelectorAll('a[href^="mailto:"]:not(.no-mailgo)'),styles='\n\n .mailgo-modal {\n all: initial;\n * {\n all: unset;\n }\n }\n\n .mailgo-title {\n display: block;\n margin-bottom: 16px;\n }\n\n .mailgo-modal-background {\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n background-color: rgba(10,10,10,.86);\n opacity: 0.8;\n }\n .mailgo-modal {\n position: fixed;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n display: none;\n font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";\n }\n .mailgo-modal.is-active {\n display: flex;\n justify-content: center;\n align-items: center;\n }\n .mailgo-modal-content {\n z-index: 1000;\n text-align: center;\n width: 200px;\n background-color: #fff;\n border-radius: 6px;\n box-shadow: 0 2px 3px rgba(10,10,10,.1), 0 0 0 1px rgba(10,10,10,.1);\n color: #4a4a4a;\n display: block;\n padding: 1.25rem;\n }\n .mailgo-modal-content a {\n display: block;\n color: #4a4a4a;\n padding: 10px;\n border-radius: 4px;\n text-decoration: none;\n }\n .mailgo-modal-content a:hover {\n background-color: rgba(0, 0, 0, 0.08);\n }\n .mailgo-modal-content a.outlook {\n color: #0072C6;\n }\n .mailgo-modal-content a.gmail {\n color: #D44638;\n }\n .mailgo-modal-content a.outlook:hover {\n background-color: rgba(0, 114, 198, 0.08);\n }\n .mailgo-modal-content a.gmail:hover {\n background-color: rgba(212, 70, 56, 0.08);\n }\n a.mailgo-copy {\n margin-top: 10px;\n padding: 16px 10px;\n }\n .mailgo-by {\n display: block;\n font-size: 8px;\n padding: 5px;\n margin-top: 0.75rem;\n }\n .mailgo-by:hover {\n background-color: none;\n }\n',styleSheet=document.createElement("style");function validateEmail(e){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(e)}function copyToClipboard(e){const n=document.createElement("textarea");n.value=e,n.setAttribute("readonly",""),n.style.position="absolute",n.style.left="-9999px",document.body.appendChild(n);const t=document.getSelection().rangeCount>0&&document.getSelection().getRangeAt(0);n.select(),document.execCommand("copy"),document.body.removeChild(n),t&&(document.getSelection().removeAllRanges(),document.getSelection().addRange(t))}styleSheet.type="text/css",styleSheet.innerText=styles,document.head.appendChild(styleSheet),console.log("mailgo is WIP!"),mailgos.forEach((e,n)=>{let t=e.href.split("?")[0].split("mailto:")[1].trim();if(!validateEmail(t))return;let o=new URL(e.href),a=new URLSearchParams(o.search),l=(a.get("subject"),a.get("body"),a.get("cc"),a.get("bcc"),document.createElement("div"));l.className="mailgo-modal",l.setAttribute("data-index",n);let i=document.createElement("div");i.className="mailgo-modal-background",l.appendChild(i);let d=document.createElement("div");d.className="mailgo-modal-content",l.appendChild(d);let c=document.createElement("strong");c.className="mailgo-title";let m=document.createTextNode(t);c.appendChild(m),d.appendChild(c);let r=document.createElement("div");r.className="mailgo-details",d.appendChild(r);let s=document.createElement("a");s.href="https://mail.google.com/mail?extsrc=mailto&url="+e.href,s.classList.add("mailgo-open"),s.classList.add("gmail");let p=document.createTextNode("open in Gmail");s.appendChild(p),d.appendChild(s);let g=document.createElement("a");g.href="https://outlook.office.com/owa/?rru=compose&to="+t+o.search,g.classList.add("mailgo-open"),g.classList.add("outlook");let u=document.createTextNode("open in Outlook");g.appendChild(u),d.appendChild(g);let h=document.createElement("a");h.href=e.href,h.className="mailgo-open";let b=document.createTextNode("open");h.appendChild(b),d.appendChild(h);let y=document.createElement("a");y.href="#mailgo-copy",y.className="mailgo-copy";let x=document.createTextNode("copy");y.appendChild(x),y.addEventListener("click",e=>{copyToClipboard(t),y.innerHTML="copied!"},!1),d.appendChild(y);let f=document.createElement("a");f.href="https://mailgo.js.org",f.className="mailgo-by";let C=document.createTextNode("mailgo.js.org");f.appendChild(C),d.appendChild(f),e.parentNode.insertBefore(l,e.nextSibling),e.addEventListener("click",n=>{n.preventDefault(),e.nextElementSibling.classList.add("is-active")},!1),i.addEventListener("click",n=>{e.nextElementSibling.classList.remove("is-active")},!1)});
|
||||
let mailgos=document.querySelectorAll('a[href^="mailto:"]:not(.no-mailgo)'),styles='\n\n .mailgo-modal {\n all: initial;\n * {\n all: unset;\n }\n }\n\n .mailgo-title {\n display: block;\n margin-bottom: 16px;\n }\n\n .mailgo-modal-background {\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n background-color: rgba(10,10,10,.86);\n opacity: 0.8;\n }\n .mailgo-modal {\n position: fixed;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n display: none;\n font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";\n }\n .mailgo-modal.is-active {\n display: flex;\n justify-content: center;\n align-items: center;\n }\n .mailgo-modal-content {\n z-index: 1000;\n text-align: center;\n width: 200px;\n background-color: #fff;\n border-radius: 6px;\n box-shadow: 0 2px 3px rgba(10,10,10,.1), 0 0 0 1px rgba(10,10,10,.1);\n color: #4a4a4a;\n display: block;\n padding: 1.25rem;\n }\n .mailgo-modal-content a {\n display: block;\n color: #4a4a4a;\n border-radius: 4px;\n text-decoration: none;\n }\n .mailgo-modal-content a {\n padding: 10px;\n }\n .mailgo-modal-content a.mailgo-open:hover, .mailgo-modal-content a.mailgo-copy:hover {\n background-color: rgba(0, 0, 0, 0.08);\n }\n .mailgo-modal-content a.outlook {\n color: #0072C6;\n }\n .mailgo-modal-content a.gmail {\n color: #D44638;\n }\n .mailgo-modal-content a.outlook:hover {\n background-color: rgba(0, 114, 198, 0.08);\n }\n .mailgo-modal-content a.gmail:hover {\n background-color: rgba(212, 70, 56, 0.08);\n }\n a.mailgo-copy {\n margin-top: 10px;\n padding: 16px 10px;\n }\n .mailgo-by {\n display: block;\n font-size: 8px;\n margin-top: 0.75rem;\n }\n',styleSheet=document.createElement("style");function validateEmail(e){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(e)}function copyToClipboard(e){const t=document.createElement("textarea");t.value=e,t.setAttribute("readonly",""),t.style.position="absolute",t.style.left="-9999px",document.body.appendChild(t);const n=document.getSelection().rangeCount>0&&document.getSelection().getRangeAt(0);t.select(),document.execCommand("copy"),document.body.removeChild(t),n&&(document.getSelection().removeAllRanges(),document.getSelection().addRange(n))}styleSheet.type="text/css",styleSheet.innerText=styles,document.head.appendChild(styleSheet),console.log("mailgo is WIP!"),mailgos.forEach((e,t)=>{let n=e.href.split("?")[0].split("mailto:")[1].trim();if(!validateEmail(n))return;let o=new URL(e.href),a=new URLSearchParams(o.search),l=(a.get("subject"),a.get("body"),a.get("cc"),a.get("bcc"),document.createElement("div"));l.className="mailgo-modal",l.setAttribute("data-index",t);let i=document.createElement("div");i.className="mailgo-modal-background",l.appendChild(i);let d=document.createElement("div");d.className="mailgo-modal-content",l.appendChild(d);let c=document.createElement("strong");c.className="mailgo-title";let m=document.createTextNode(n);c.appendChild(m),d.appendChild(c);let r=document.createElement("div");r.className="mailgo-details",d.appendChild(r);let s=document.createElement("a");s.href="https://mail.google.com/mail?extsrc=mailto&url="+e.href,s.classList.add("mailgo-open"),s.classList.add("gmail");let p=document.createTextNode("open in "),g=document.createElement("span");g.className="mailgo-weight-500",s.appendChild(p),g.parentNode.insertBefore(p),d.appendChild(s);let u=document.createElement("a");u.href="https://outlook.office.com/owa/?rru=compose&to="+n+o.search,u.classList.add("mailgo-open"),u.classList.add("outlook");let h=document.createTextNode("open in Outlook");u.appendChild(h),d.appendChild(u);let b=document.createElement("a");b.href=e.href,b.className="mailgo-open";let y=document.createTextNode("open");b.appendChild(y),d.appendChild(b);let x=document.createElement("a");x.href="#mailgo-copy",x.className="mailgo-copy";let f=document.createTextNode("copy");x.appendChild(f),x.addEventListener("click",e=>{copyToClipboard(n),x.innerHTML="copied!"},!1),d.appendChild(x);let C=document.createElement("a");C.href="https://mailgo.js.org",C.className="mailgo-by",C.target="_blank";let E=document.createTextNode("mailgo.js.org");C.appendChild(E),d.appendChild(C),e.parentNode.insertBefore(l,e.nextSibling),e.addEventListener("click",t=>{t.preventDefault(),e.nextElementSibling.classList.add("is-active")},!1),i.addEventListener("click",t=>{e.nextElementSibling.classList.remove("is-active")},!1)});
|
||||
|
|
@ -52,11 +52,13 @@ let styles = `
|
|||
.mailgo-modal-content a {
|
||||
display: block;
|
||||
color: #4a4a4a;
|
||||
padding: 10px;
|
||||
border-radius: 4px;
|
||||
text-decoration: none;
|
||||
}
|
||||
.mailgo-modal-content a:hover {
|
||||
.mailgo-modal-content a {
|
||||
padding: 10px;
|
||||
}
|
||||
.mailgo-modal-content a.mailgo-open:hover, .mailgo-modal-content a.mailgo-copy:hover {
|
||||
background-color: rgba(0, 0, 0, 0.08);
|
||||
}
|
||||
.mailgo-modal-content a.outlook {
|
||||
|
|
@ -78,12 +80,8 @@ let styles = `
|
|||
.mailgo-by {
|
||||
display: block;
|
||||
font-size: 8px;
|
||||
padding: 5px;
|
||||
margin-top: 0.75rem;
|
||||
}
|
||||
.mailgo-by:hover {
|
||||
background-color: none;
|
||||
}
|
||||
`;
|
||||
|
||||
// CSS
|
||||
|
|
@ -141,8 +139,11 @@ mailgos.forEach((mailgo, index) => {
|
|||
gmail.href = "https://mail.google.com/mail?extsrc=mailto&url=" + mailgo.href;
|
||||
gmail.classList.add("mailgo-open");
|
||||
gmail.classList.add("gmail");
|
||||
let gmailContent = document.createTextNode("open in Gmail");
|
||||
let gmailContent = document.createTextNode("open in ");
|
||||
let gmailSpan = document.createElement("span");
|
||||
gmailSpan.className = "mailgo-weight-500";
|
||||
gmail.appendChild(gmailContent);
|
||||
gmailSpan.parentNode.insertBefore(gmailContent);
|
||||
modalContent.appendChild(gmail);
|
||||
|
||||
// Outlook
|
||||
|
|
@ -183,6 +184,7 @@ mailgos.forEach((mailgo, index) => {
|
|||
let by = document.createElement("a");
|
||||
by.href = "https://mailgo.js.org";
|
||||
by.className = "mailgo-by";
|
||||
by.target = "_blank";
|
||||
|
||||
let textBy = document.createTextNode("mailgo.js.org");
|
||||
by.appendChild(textBy);
|
||||
|
|
|
|||
Loading…
Reference in New Issue