webshare api

This commit is contained in:
Dimitrios Douros 2023-07-14 23:40:00 +02:00 committed by Nikita Karamov
parent e97fc400a2
commit de29ba84b8
No known key found for this signature in database
GPG Key ID: 41D6F71EE78E77CD
3 changed files with 31 additions and 0 deletions

View File

@ -44,6 +44,7 @@
<a class="vkontakte"></a> <a class="vkontakte"></a>
<a class="whatsapp"></a> <a class="whatsapp"></a>
<a class="copy-url"></a> <a class="copy-url"></a>
<a class="web-share"></a>
</div> </div>
</section> </section>
<section> <section>
@ -64,6 +65,7 @@
<button class="vkontakte"></button> <button class="vkontakte"></button>
<button class="whatsapp"></button> <button class="whatsapp"></button>
<button class="copy-url"></button> <button class="copy-url"></button>
<button class="web-share"></button>
</div> </div>
</section> </section>
<section> <section>
@ -89,6 +91,7 @@
<a class="vkontakte"></a> <a class="vkontakte"></a>
<a class="whatsapp"></a> <a class="whatsapp"></a>
<a class="copy-url"></a> <a class="copy-url"></a>
<a class="web-share"></a>
</div> </div>
</section> </section>
<section> <section>
@ -110,6 +113,7 @@
<a class="vkontakte">Отправить</a> <a class="vkontakte">Отправить</a>
<a class="whatsapp"></a> <a class="whatsapp"></a>
<a class="copy-url">Copy URL</a> <a class="copy-url">Copy URL</a>
<a class="web-share"></a>
</div> </div>
</section> </section>
</main> </main>

View File

@ -175,6 +175,10 @@
background-image: url("data:image/svg+xml,%3Csvg fill='%23fff' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4.199 4.841H.11c.194 9.312 4.85 14.907 13.012 14.907h.462v-5.327c3 .299 5.268 2.492 6.178 5.327H24c-1.164-4.237-4.223-6.58-6.133-7.475 1.91-1.105 4.596-3.79 5.238-7.432h-3.85c-.836 2.955-3.313 5.641-5.67 5.895V4.84h-3.85v10.326C7.347 14.57 4.333 11.675 4.199 4.84Z'/%3E%3C/svg%3E"); background-image: url("data:image/svg+xml,%3Csvg fill='%23fff' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4.199 4.841H.11c.194 9.312 4.85 14.907 13.012 14.907h.462v-5.327c3 .299 5.268 2.492 6.178 5.327H24c-1.164-4.237-4.223-6.58-6.133-7.475 1.91-1.105 4.596-3.79 5.238-7.432h-3.85c-.836 2.955-3.313 5.641-5.67 5.895V4.84h-3.85v10.326C7.347 14.57 4.333 11.675 4.199 4.84Z'/%3E%3C/svg%3E");
} }
.shareon > .web-share:before {
background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%23fff' stroke-width='2'%3E%3Ccircle cx='18' cy='5' r='3'/%3E%3Ccircle cx='6' cy='12' r='3'/%3E%3Ccircle cx='18' cy='19' r='3'/%3E%3Cpath d='m8.59 13.51l6.83 3.98m-.01-10.98l-6.82 3.98'/%3E%3C/g%3E%3C/svg%3E");
}
.shareon > .whatsapp { .shareon > .whatsapp {
background-color: #25d366; background-color: #25d366;
} }

View File

@ -66,6 +66,29 @@ const init = () => {
}); });
} }
// if it's "Web Share"
if (cls === "web-share") {
const data = {
title:
child.dataset.title ||
container.dataset.title ||
document.title,
text: child.dataset.text || container.dataset.text || "",
url:
child.dataset.url ||
container.dataset.url ||
window.location.href,
};
if (navigator.canShare && navigator.canShare(data)) {
child.addEventListener("click", () => {
navigator.share(data);
});
} else {
child.style.display = "none";
}
}
// if it's one of the networks // if it's one of the networks
if (Object.prototype.hasOwnProperty.call(urlBuilderMap, cls)) { if (Object.prototype.hasOwnProperty.call(urlBuilderMap, cls)) {
const preset = { const preset = {