From 3640a8e05d86c13f55dddc8d35ae77072dfbcf72 Mon Sep 17 00:00:00 2001
From: Nikita Karamov <me@kytta.dev>
Date: Thu, 7 Dec 2023 16:44:54 +0100
Subject: [PATCH] Add 'Print' button

---
 index.html          |  2 ++
 src/icons/print.svg |  1 +
 src/shareon.css     |  4 ++++
 src/shareon.js      | 13 ++++++++++---
 4 files changed, 17 insertions(+), 3 deletions(-)
 create mode 100644 src/icons/print.svg

diff --git a/index.html b/index.html
index 67907ed..45935fd 100644
--- a/index.html
+++ b/index.html
@@ -46,6 +46,7 @@
           <a class="whatsapp"></a>
           <a class="copy-url"></a>
           <a class="email"></a>
+          <a class="print"></a>
           <a class="web-share"></a>
         </div>
       </section>
@@ -69,6 +70,7 @@
           <button class="whatsapp"></button>
           <button class="copy-url"></button>
           <button class="email"></button>
+          <button class="print"></button>
           <button class="web-share"></button>
         </div>
       </section>
diff --git a/src/icons/print.svg b/src/icons/print.svg
new file mode 100644
index 0000000..400e24a
--- /dev/null
+++ b/src/icons/print.svg
@@ -0,0 +1 @@
+<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path fill="none" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 9V2h12v7M6 18H4a2 2 0 0 1-2-2v-5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v5a2 2 0 0 1-2 2h-2M6 14h12v8H6z"/></svg>
\ No newline at end of file
diff --git a/src/shareon.css b/src/shareon.css
index c5024d5..1964807 100644
--- a/src/shareon.css
+++ b/src/shareon.css
@@ -137,6 +137,10 @@
   background-image: url("icons/pocket.svg");
 }
 
+.shareon > .print:before {
+  background-image: url("icons/print.svg");
+}
+
 .shareon > .reddit {
   background-color: #ff4500;
 }
diff --git a/src/shareon.js b/src/shareon.js
index c8cfc50..63d75c5 100644
--- a/src/shareon.js
+++ b/src/shareon.js
@@ -17,7 +17,7 @@ import "./shareon.css";
  * }) => string}}
  */
 const urlBuilderMap = {
-  facebook: (d) => `https://www.facebook.com/sharer/sharer.php?u=${d.url}${d.hashtags? `&hashtag=%23${d.hashtags.split('%2C')[0]}` : ''}`,
+  facebook: (d) => `https://www.facebook.com/sharer/sharer.php?u=${d.url}${d.hashtags ? `&hashtag=%23${d.hashtags.split('%2C')[0]}` : ''}`,
   email: (d) => `mailto:?subject=${d.title}&body=${d.url}`,
   linkedin: (d) => `https://www.linkedin.com/sharing/share-offsite/?url=${d.url}`,
   mastodon: (d) => `https://toot.kytta.dev/?text=${d.title}%0D%0A${d.url}${d.text ? `%0D%0A%0D%0A${d.text}` : ''}${d.via ? `%0D%0A%0D%0A${d.via}` : ''}`,
@@ -28,8 +28,8 @@ const urlBuilderMap = {
   reddit: (d) => `https://www.reddit.com/submit?title=${d.title}&url=${d.url}`,
   teams: (d) => `https://teams.microsoft.com/share?href=${d.url}${d.text ? `&msgText=${d.text}` : ''}`,
   telegram: (d) => `https://telegram.me/share/url?url=${d.url}${d.text ? `&text=${d.text}` : ''}`,
-  tumblr: (d) => `https://www.tumblr.com/widgets/share/tool?posttype=link${d.hashtags? `&tags=${d.hashtags}` : ''}&title=${d.title}&content=${d.url}&canonicalUrl=${d.url}${d.text? `&caption=${d.text}`:''}${d.via? `&show-via=${d.via}`:''}`,
-  twitter: (d) => `https://twitter.com/intent/tweet?url=${d.url}&text=${d.title}${d.via ? `&via=${d.via}` : ''}${d.hashtags? `&hashtags=${d.hashtags}` : ''}`,
+  tumblr: (d) => `https://www.tumblr.com/widgets/share/tool?posttype=link${d.hashtags ? `&tags=${d.hashtags}` : ''}&title=${d.title}&content=${d.url}&canonicalUrl=${d.url}${d.text ? `&caption=${d.text}` : ''}${d.via ? `&show-via=${d.via}` : ''}`,
+  twitter: (d) => `https://twitter.com/intent/tweet?url=${d.url}&text=${d.title}${d.via ? `&via=${d.via}` : ''}${d.hashtags ? `&hashtags=${d.hashtags}` : ''}`,
   viber: (d) => `viber://forward?text=${d.title}%0D%0A${d.url}${d.text ? `%0D%0A%0D%0A${d.text}` : ''}`,
   vkontakte: (d) => `https://vk.com/share.php?url=${d.url}&title=${d.title}${d.media ? `&image=${d.media}` : ''}`,
   whatsapp: (d) => `https://wa.me/?text=${d.title}%0D%0A${d.url}${d.text ? `%0D%0A%0D%0A${d.text}` : ''}`,
@@ -68,6 +68,13 @@ const init = () => {
             });
           }
 
+          // if it's "Print"
+          if (cls === "print") {
+            child.addEventListener("click", () => {
+              window.print();
+            });
+          }
+
           // if it's "Web Share"
           if (cls === "web-share") {
             const data = {