vlw/victorwesterlund.com
1
0
Fork 0
mirror of https://codeberg.org/vlw/victorwesterlund.com.git synced 2025-09-14 11:33:41 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

v9.0-pre-c

Browse source 
Finalized default interaction "copyText()"
This commit is contained in:
Victor Westerlund 2021-09-18 13:45:48 +02:00
parent 2a500d8e11
commit 3005b28d8c
3 changed files with 21 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

26
public/assets/js/script.js
View file

@ -32,9 +32,11 @@ const interactions = {
// Remove transition CSS when finished. Wonky resize effects otherwise // Remove transition CSS when finished. Wonky resize effects otherwise
setTimeout(() => menu.style.removeProperty("transition"),transition + 1); setTimeout(() => menu.style.removeProperty("transition"),transition + 1);
}, },
// Open page defined with data-value as a card
newCard: (event) => { newCard: (event) => {
const module = import("./modules/Modals.mjs"); const module = import("./modules/Modals.mjs");
const interactions = { const interactions = {
// Like newCard() except it closes the previous card
getContact: (event) => { getContact: (event) => {
const service = event.target.dataset.value; const service = event.target.dataset.value;
module.then(modals => { module.then(modals => {
@ -43,19 +45,25 @@ const interactions = {
card.openPage(service); card.openPage(service);
}); });
}, },
// Copy text defined in data-value to clipboard and play animation
copyText: (event) => { copyText: (event) => {
event.target.classList.add("copied"); const copy = navigator.clipboard.writeText(event.target.dataset.value);
const copied = document.createElement("p"); copy.then(() => {
copied.innerText = "copied!"; event.target.classList.add("copied");
event.target.appendChild(copied); const copied = document.createElement("p");
copied.innerText = "copied!";
event.target.appendChild(copied);
setTimeout(() => { // Reset button state
event.target.classList.remove("copied"); setTimeout(() => {
destroy(copied); event.target.classList.remove("copied");
},1000); destroy(copied);
},1000);
});
} }
}; };
// Create card and open the specified page asynchronously
module.then(modals => { module.then(modals => {
const card = new modals.Card(interactions); const card = new modals.Card(interactions);
card.openPage(event.target.dataset.value); card.openPage(event.target.dataset.value);
@ -67,5 +75,5 @@ const interactions = {
const theme = window.matchMedia("(prefers-color-scheme: dark)"); const theme = window.matchMedia("(prefers-color-scheme: dark)");
theme.addEventListener("change",updateTheme); theme.addEventListener("change",updateTheme);
new Interaction(interactions,document.body); new Interaction(interactions,document.body); // Initialize default interactions
updateTheme(); updateTheme();

2
public/assets/pages/contact_email.html
View file

@ -59,7 +59,7 @@
<h1>hello@victorwesterlund.com</h1> <h1>hello@victorwesterlund.com</h1>
<p>You can also <a class="button" href="mailto:hello@victorwesterlund.com?subject=Hello Victor!">here</a> to send a mail directly from your mail app</p> <p>You can also <a class="button" href="mailto:hello@victorwesterlund.com?subject=Hello Victor!">here</a> to send a mail directly from your mail app</p>
<p></p> <p></p>
<div class="button solid" data-action="copyText"> <div class="button solid" data-action="copyText" data-value="hello@victorwesterlund.com">
<svg xmlns="http://www.w3.org/2000/svg" height="24" width="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M18 2H9c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h9c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm0 14H9V4h9v12zM3 15v-2h2v2H3zm0-5.5h2v2H3v-2zM10 20h2v2h-2v-2zm-7-1.5v-2h2v2H3zM5 22c-1.1 0-2-.9-2-2h2v2zm3.5 0h-2v-2h2v2zm5 0v-2h2c0 1.1-.9 2-2 2zM5 6v2H3c0-1.1.9-2 2-2z"/></svg> <svg xmlns="http://www.w3.org/2000/svg" height="24" width="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M18 2H9c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h9c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm0 14H9V4h9v12zM3 15v-2h2v2H3zm0-5.5h2v2H3v-2zM10 20h2v2h-2v-2zm-7-1.5v-2h2v2H3zM5 22c-1.1 0-2-.9-2-2h2v2zm3.5 0h-2v-2h2v2zm5 0v-2h2c0 1.1-.9 2-2 2zM5 6v2H3c0-1.1.9-2 2-2z"/></svg>
<p>copy email</p> <p>copy email</p>
</div> </div>

4
public/assets/pages/contact_signal.html
View file

@ -68,9 +68,9 @@
} }
</style> </style>
<img id="logo_signal" src="assets/img/icons/signal.svg"/> <img id="logo_signal" src="assets/img/icons/signal.svg"/>
<h1 id="number">+4670-2452459</h1> <h1 id="number">+4670-245-2459</h1>
<p>Signal is a free and encrypted message platform with apps for all major platforms.</p> <p>Signal is a free and encrypted message platform with apps for all major platforms.</p>
<div class="button solid" data-action="copyText"> <div class="button solid" data-action="copyText" data-value="+46702452459">
<svg xmlns="http://www.w3.org/2000/svg" height="24" width="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M18 2H9c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h9c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm0 14H9V4h9v12zM3 15v-2h2v2H3zm0-5.5h2v2H3v-2zM10 20h2v2h-2v-2zm-7-1.5v-2h2v2H3zM5 22c-1.1 0-2-.9-2-2h2v2zm3.5 0h-2v-2h2v2zm5 0v-2h2c0 1.1-.9 2-2 2zM5 6v2H3c0-1.1.9-2 2-2z"/></svg> <svg xmlns="http://www.w3.org/2000/svg" height="24" width="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M18 2H9c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h9c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm0 14H9V4h9v12zM3 15v-2h2v2H3zm0-5.5h2v2H3v-2zM10 20h2v2h-2v-2zm-7-1.5v-2h2v2H3zM5 22c-1.1 0-2-.9-2-2h2v2zm3.5 0h-2v-2h2v2zm5 0v-2h2c0 1.1-.9 2-2 2zM5 6v2H3c0-1.1.9-2 2-2z"/></svg>
<p>copy number</p> <p>copy number</p>
</div> </div>