<html>
<head>
<title>Web Share API Usage - RJM Programming - July, 2022 ... thanks to https://developer.mozilla.org/en-US/docs/Web/API/Navigator/share</title>
<script type='text/javascript'>
var twos=[], itwos=-1;

function eatatjoes() {
if (itwos == 0) {
if (document.getElementById('shareurl').value == '') {
document.getElementById('shareurl').placeholder=document.getElementById('shareurl').placeholder.replace(twos[0], twos[1]).replace(' PDF#', ' PDF Book#');
document.getElementById('sbut').value=document.getElementById('sbut').value.replace('Share URL Link', 'Share PDF Book Link');
}
itwos=1;
} else if (itwos == 1) {
if (document.getElementById('shareurl').value == '') {
document.getElementById('shareurl').placeholder=document.getElementById('shareurl').placeholder.replace(twos[1], twos[0]).replace(' PDF Book#', ' PDF#');
document.getElementById('sbut').value=document.getElementById('sbut').value.replace('Share PDF Book Link', 'Share URL Link');
}
itwos=0;
}
}

function setupanimate(wsug, wsugzero, wsugthree) {
twos.push(wsugzero);
itwos=0;
twos.push(wsugthree);
setInterval(eatatjoes, 5000);
return wsug.replace('#' + wsugthree, '');
}
</script>
</head>
<body onload="var suggestion=location.search.split('suggestion=')[1] ? decodeURIComponent(location.search.split('suggestion=')[1].split('&')[0]).replace(/\+/g,' ') : ''; if (suggestion != '') { var sugs=suggestion.split('#'); if (sugs.length >= 4) { suggestion=setupanimate(suggestion, sugs[0], sugs[3]); } document.getElementById('shareurl').placeholder=suggestion; document.getElementById('sbut').value+=' to content as below'; document.body.innerHTML+='<br><br><iframe style=width:100%;height:900px; src=/pdfimageplustext.php?pdffile=' + encodeURIComponent(suggestion.split('#')[0]) + '></iframe>'; }">
<style>
input { background-color: yellow; }
input[type=button] { background-color: orange; }
button { background-color: lightgreen; }
</style>
<h2>Web Share API Usage</h2>
<h3>RJM Programming - July, 2022</h3>
<h4>Thanks to <a target=_blank title='https://developer.mozilla.org/en-US/docs/Web/API/Navigator/share' href='//developer.mozilla.org/en-US/docs/Web/API/Navigator/share'>https://developer.mozilla.org/en-US/docs/Web/API/Navigator/share</a></h4><br>
<!--p><button>Share MDN!</button></p>
<p class="result"></p>
<script type='text/javascript'>

const shareData = {
title: 'MDN',
text: 'Learn web development on MDN!',
url: 'https://developer.mozilla.org'
}

const btn = document.querySelector('button');
const resultPara = document.querySelector('.result');

// Share must be triggered by "user activation"
btn.addEventListener('click', async () => {
try {
await navigator.share(shareData)
resultPara.textContent = 'MDN shared successfully'
} catch(err) {
resultPara.textContent = 'Error: ' + err
}
});
</script-->

<div>
<label for="shareurl"><input type=button onclick='shareurl();' id='sbut' value="Share URL Link"></input>: </label>
<input title='Suffix by hashtag 1 is text and hashtag 2 is title' style='width:45%;' type=url value='' placeholder='https://www.rjmprogramming.com.au/ITblog/#RJM Programming Blog#IT Blog' id=shareurl ondblclick="this.value=this.placeholder;"></input><br><br><span> ... and/or ... </span><br><br>
<label for="files"><input type=button onclick="document.getElementById('share').click();" value="Share media or document files"></input>: </label>
<input id="files" type="file" accept="image/*,video/*,audio/*,application/*,text/*" multiple>
</div><br><br>
<button id="share" type="button">Share your media or documents or link!</button>
<output id="output"></output>
<script type='text/javascript' src='/web_share_api_test.js' defer></script>
</body>
</html>