Skip to content

Commit

Permalink
add more contacts for merchants
Browse files Browse the repository at this point in the history
  • Loading branch information
@secondl1ght
secondl1ght committed May 22, 2023
1 parent b164f79 commit 28db63f
Show file tree
Hide file tree
Showing 3 changed files with 101 additions and 15 deletions.
66 changes: 54 additions & 12 deletions src/lib/map/setup.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -548,6 +548,13 @@ export const generateMarker = (
element.tags && element.tags.description ? element.tags.description : undefined;
const note = element.tags && element.tags.note ? element.tags.note : undefined;

const phone = element.tags?.phone || element.tags?.['contact:phone'] || '';
const website = element.tags?.website || element.tags?.['contact:website'] || '';
const email = element.tags?.email || element.tags?.['contact:email'] || '';
const twitter = element.tags?.twitter || element.tags?.['contact:twitter'] || '';
const instagram = element.tags?.instagram || element.tags?.['contact:instagram'] || '';
const facebook = element.tags?.facebook || element.tags?.['contact:facebook'] || '';

let verified = verifiedArr(element);

const paymentMethod =
Expand Down Expand Up @@ -638,8 +645,8 @@ export const generateMarker = (
}
${
element.tags && element.tags.phone
? `<a href='tel:${element.tags.phone}' class='flex items-center !text-primary dark:!text-white hover:!text-link dark:hover:!text-link text-xs transition-colors'>
phone
? `<a href='tel:${phone}' class='flex items-center !text-primary dark:!text-white hover:!text-link dark:hover:!text-link text-xs transition-colors'>
<svg width='24px' height='24px' class='mr-2'>
<use width='24px' height='24px' href="/icons/popup/spritesheet.svg#phone"></use>
</svg>
Expand All @@ -649,12 +656,21 @@ export const generateMarker = (
}
${
element.tags && element.tags.website
email
? `<a href='mailto:${email}' class='flex items-center !text-primary dark:!text-white hover:!text-link dark:hover:!text-link text-xs transition-colors'>
<svg width='24px' height='24px' class='mr-2'>
<use width='24px' height='24px' href="/icons/popup/spritesheet.svg#email"></use>
</svg>
Email
</a>`
: ''
}
${
website
? `<a href=${
element.tags.website.startsWith('http')
? element.tags.website
: `https://${element.tags.website}`
} target="_blank" rel="noreferrer" class='flex items-center !text-primary dark:!text-white hover:!text-link dark:hover:!text-link text-xs transition-colors'>
website.startsWith('http') ? website : `https://${website}`
} target="_blank" rel="noreferrer" class='flex items-center !text-primary dark:!text-white hover:!text-link dark:hover:!text-link text-xs transition-colors'>
<svg width='24px' height='24px' class='mr-2'>
<use width='24px' height='24px' href="/icons/popup/spritesheet.svg#globe"></use>
</svg>
Expand All @@ -664,12 +680,10 @@ export const generateMarker = (
}
${
element.tags && element.tags['contact:twitter']
twitter
? `<a href=${
element.tags['contact:twitter'].startsWith('http')
? element.tags['contact:twitter']
: `https://twitter.com/${element.tags['contact:twitter']}`
} target="_blank" rel="noreferrer" class='flex items-center !text-primary dark:!text-white hover:!text-link dark:hover:!text-link text-xs transition-colors'>
twitter.startsWith('http') ? twitter : `https://twitter.com/${twitter}`
} target="_blank" rel="noreferrer" class='flex items-center !text-primary dark:!text-white hover:!text-link dark:hover:!text-link text-xs transition-colors'>
<svg width='24px' height='24px' class='mr-2'>
<use width='24px' height='24px' href="/icons/popup/spritesheet.svg#twitter"></use>
</svg>
Expand All @@ -678,6 +692,34 @@ export const generateMarker = (
: ''
}
${
instagram
? `<a href=${
instagram.startsWith('http')
? instagram
: `https://instagram.com/${instagram}`
} target="_blank" rel="noreferrer" class='flex items-center !text-primary dark:!text-white hover:!text-link dark:hover:!text-link text-xs transition-colors'>
<svg width='24px' height='24px' class='mr-2'>
<use width='24px' height='24px' href="/icons/popup/spritesheet.svg#instagram"></use>
</svg>
Instagram
</a>`
: ''
}
${
facebook
? `<a href=${
facebook.startsWith('http') ? facebook : `https://facebook.com/${facebook}`
} target="_blank" rel="noreferrer" class='flex items-center !text-primary dark:!text-white hover:!text-link dark:hover:!text-link text-xs transition-colors'>
<svg width='24px' height='24px' class='mr-2'>
<use width='24px' height='24px' href="/icons/popup/spritesheet.svg#facebook"></use>
</svg>
Facebook
</a>`
: ''
}
${
element.tags && location.pathname === '/map'
? `<button
Expand Down
34 changes: 31 additions & 3 deletions src/routes/merchant/[id]/+page.svelte
View file
Original file line number Diff line number Diff line change
Expand Up @@ -78,9 +78,17 @@
: undefined;
const verified = verifiedArr(merchant.osm_json);
const verifiedDate = calcVerifiedDate();
const phone = merchant.osm_json.tags?.phone || '';
const website = merchant.osm_json.tags?.website || '';
const twitter = merchant.osm_json.tags?.['contact:twitter'] || '';
const phone = merchant.osm_json.tags?.phone || merchant.osm_json.tags?.['contact:phone'] || '';
const website =
merchant.osm_json.tags?.website || merchant.osm_json.tags?.['contact:website'] || '';
const email = merchant.osm_json.tags?.email || merchant.osm_json.tags?.['contact:email'] || '';
const twitter =
merchant.osm_json.tags?.twitter || merchant.osm_json.tags?.['contact:twitter'] || '';
const instagram =
merchant.osm_json.tags?.instagram || merchant.osm_json.tags?.['contact:instagram'] || '';
const facebook =
merchant.osm_json.tags?.facebook || merchant.osm_json.tags?.['contact:facebook'] || '';
const paymentMethod =
merchant.osm_json.tags &&
(merchant.osm_json.tags['payment:onchain'] ||
Expand Down Expand Up @@ -385,6 +393,10 @@
<MerchantLink link={`tel:${phone}`} icon="phone" text="Call" />
{/if}
{#if email}
<MerchantLink link={`mailto:${email}`} icon="email" text="Email" />
{/if}
{#if website}
<MerchantLink
link={website.startsWith('http') ? website : `https://${website}`}
Expand All @@ -401,6 +413,22 @@
/>
{/if}
{#if instagram}
<MerchantLink
link={instagram.startsWith('http') ? instagram : `https://instagram.com/${instagram}`}
icon="instagram"
text="Instagram"
/>
{/if}
{#if facebook}
<MerchantLink
link={facebook.startsWith('http') ? facebook : `https://facebook.com/${facebook}`}
icon="facebook"
text="Facebook"
/>
{/if}
<span id="show-tags">
<MerchantButton
click={() => ($showTags = merchant.osm_json.tags || {})}
Expand Down
16 changes: 16 additions & 0 deletions static/icons/popup/spritesheet.svg
View file
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.

0 comments on commit 28db63f

Please sign in to comment.