drop.chapril.org-firefoxsend/app/ui/shareDialog.js

60 lines
1.7 KiB
JavaScript
Raw Normal View History

2019-03-10 02:59:06 +01:00
const html = require('choo/html');
module.exports = function(name, url) {
2019-04-26 22:30:33 +02:00
const dialog = function(state, emit, close) {
2019-03-10 02:59:06 +01:00
return html`
<send-share-dialog
class="flex flex-col items-center text-center p-4 max-w-sm m-auto"
>
2019-06-14 20:30:43 +02:00
<h1 class="text-3xl font-bold my-4">
2019-03-10 02:59:06 +01:00
${state.translate('notifyUploadEncryptDone')}
</h1>
<p class="font-normal leading-normal text-grey-80 dark:text-grey-40">
2019-04-26 22:30:33 +02:00
${state.translate('shareLinkDescription')}<br />
<span class="word-break-all">${name}</span>
2019-03-10 02:59:06 +01:00
</p>
<input
type="text"
id="share-url"
2019-09-09 19:34:55 +02:00
class="w-full my-4 border rounded-lg leading-loose h-12 px-2 py-1 dark:bg-grey-80"
2019-03-10 02:59:06 +01:00
value="${url}"
readonly="true"
/>
<button
2019-06-14 20:30:43 +02:00
class="btn rounded-lg w-full flex-shrink-0 focus:outline"
2019-03-10 02:59:06 +01:00
onclick="${share}"
2019-04-26 22:30:33 +02:00
title="${state.translate('shareLinkButton')}"
2019-03-10 02:59:06 +01:00
>
2019-04-26 22:30:33 +02:00
${state.translate('shareLinkButton')}
2019-03-10 02:59:06 +01:00
</button>
<button
2019-09-09 19:34:55 +02:00
class="link-blue my-4 font-medium cursor-pointer focus:outline"
2019-03-10 02:59:06 +01:00
onclick="${close}"
title="${state.translate('okButton')}"
>
${state.translate('okButton')}
</button>
</send-share-dialog>
`;
async function share(event) {
event.stopPropagation();
try {
await navigator.share({
title: state.translate('-send-brand'),
2019-04-26 22:30:33 +02:00
text: state.translate('shareMessage', { name }),
2019-03-10 02:59:06 +01:00
url
});
} catch (e) {
2019-03-10 05:40:06 +01:00
if (e.code === e.ABORT_ERR) {
return;
}
2019-03-10 02:59:06 +01:00
console.error(e);
}
2019-03-10 05:40:06 +01:00
close();
2019-03-10 02:59:06 +01:00
}
};
2019-04-26 22:30:33 +02:00
dialog.type = 'share';
return dialog;
2019-03-10 02:59:06 +01:00
};