rss-to-activitypub/public/convert/index.html

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Convert an RSS feed to ActivityPub</title>
  <style>
    body {font-family: sans-serif;display: flex;flex-direction: column;min-height: 100vh;max-width: 70%;min-width: 500px;margin: 0 auto;color: #9baec8;background: #313543;text-align: center}
    header {margin-top:10px}
    .box {background-color: #282c37; border-radius:4px;margin-bottom:10px}
    header h1 {color:white}
    footer {padding: 10px 0}
    a {color: #d9e1e8}
    fieldset {border: none;margin: 2.5em 0}
    img {max-width: 100px}
    li {margin-bottom: 0.2em}
    input, button {width: 300px;font-size: 1.2em}
    .hint {font-size: 0.8em}
    input {box-sizing: border-box;font-size: 1em;color: #ffffff;font-family: inherit;background: #131419;border: 1px solid #0a0b0e;border-radius: 4px;padding: 10px}
    input:focus, input:active {border-color: #79bd9a}
    button {border: 0;border-radius: 4px;background: #2b90d9;color: #ffffff;text-transform: uppercase;text-align: center;cursor: pointer;padding: 10px 0;font-weight: bold}
    #out {border-top: 1px solid #393f4f;color:white}
  </style>
</head>
<body>
  <header class=box>
    <h1>🐘 Convert an RSS feed to ActivityPub</h1>  
    <p>Put the full RSS feed URL in here, and pick a username for the account that will track the feed.</p>
  </header>
  <article class=box>
    <fieldset>
      <p>
        <input id="feed" type="text" placeholder="https://example.com/feed.xml" required/>
      </p>
      <p>
        <input id="username" type="text" placeholder="username" required/><br><span class="hint">only letters, digits, and underscore (_) allowed</span>
      </p>
      <button onclick="submit()">Submit</button>
    </fieldset>
    <div id="out">
    </div>
  </article>
  <footer class=box>
    Created by <a href="https://github.com/dariusk">Darius Kazemi</a>  under mit license, see on <a href="https://github.com/dariusk/activtypub-to-rss">GitHub</a>
  </footer>

<script>
// https://bots.tinysubversions.com/api/convert/?feed=https://toomuchnotenough.site/feed.xml&username=tmne
function submit() {
let feed = document.querySelector('#feed').value;
let username = document.querySelector('#username').value;
let out = document.querySelector('#out');
fetch(`/api/convert/?feed=${feed}&username=${username}`)
  .then(function(response) {
    if (response.status !== 200) {
      out.innerHTML = `<p>Error: ${JSON.stringify(response.statusText)}</p>`;
      return {};
    }
    return response.json();
  })
  .then(function(myJson) {
    console.log((myJson));
    // a feed exists in the database
    if (myJson.content) {
      // was it a match on feed
      if (myJson.feed === feed) {
        console.log('feed match!');
        out.innerHTML = `<p>This feed already exists! Follow @${myJson.username}@bots.tinysubversions.com.</p>`;
        window.location = `/u/${myJson.username}`;
      }
      // was it a match on username
      else if (myJson.username === username) {
        console.log('username match!');
        out.innerHTML = `<p>This username is already taken for <a href="${myJson.feed}">this feed</a>.</p>`;
      }
    }
    else if (myJson.title) {
      out.innerHTML = `<p>Okay! There is now an ActivityPub actor for ${myJson.title}. You should be able to search for it from your ActivityPub client (Mastodon, Pleroma, etc) using this identifier: @${username}@bots.tinysubversions.com. You won't see anything there until the next time the RSS feed updates. You can check out the profile page for this feed at <a href="https://bots.tinysubversions.com/u/${username}/">https://bots.tinysubversions.com/u/${username}</a> too!</p>`;
    }

  })
  .catch(error => {
    console.log('!!!',error);
    out.innerHTML = `<p>Error: ${error}</p>`;
  });
}
</script>  
</body>
</html>
First 2018-10-15 07:18:10 +03:00			`<!DOCTYPE html>`
			`<html lang="en">`
			`<head>`
			`<meta charset="UTF-8">`
			`<meta name="viewport" content="width=device-width, initial-scale=1">`
			`<title>Convert an RSS feed to ActivityPub</title>`
			`<style>`
add style 2018-10-15 19:57:37 +03:00			`body {font-family: sans-serif;display: flex;flex-direction: column;min-height: 100vh;max-width: 70%;min-width: 500px;margin: 0 auto;color: #9baec8;background: #313543;text-align: center}`
			`header {margin-top:10px}`
			`.box {background-color: #282c37; border-radius:4px;margin-bottom:10px}`
			`header h1 {color:white}`
			`footer {padding: 10px 0}`
			`a {color: #d9e1e8}`
			`fieldset {border: none;margin: 2.5em 0}`
			`img {max-width: 100px}`
			`li {margin-bottom: 0.2em}`
			`input, button {width: 300px;font-size: 1.2em}`
			`.hint {font-size: 0.8em}`
			`input {box-sizing: border-box;font-size: 1em;color: #ffffff;font-family: inherit;background: #131419;border: 1px solid #0a0b0e;border-radius: 4px;padding: 10px}`
			`input:focus, input:active {border-color: #79bd9a}`
			`button {border: 0;border-radius: 4px;background: #2b90d9;color: #ffffff;text-transform: uppercase;text-align: center;cursor: pointer;padding: 10px 0;font-weight: bold}`
			`#out {border-top: 1px solid #393f4f;color:white}`
First 2018-10-15 07:18:10 +03:00			`</style>`
			`</head>`
			`<body>`
add style 2018-10-15 19:57:37 +03:00			`<header class=box>`
			`<h1>🐘 Convert an RSS feed to ActivityPub</h1>`
			`<p>Put the full RSS feed URL in here, and pick a username for the account that will track the feed.</p>`
			`</header>`
			`<article class=box>`
			`<fieldset>`
			`<p>`
			`<input id="feed" type="text" placeholder="https://example.com/feed.xml" required/>`
			`</p>`
			`<p>`
			`<input id="username" type="text" placeholder="username" required/><br><span class="hint">only letters, digits, and underscore (_) allowed</span>`
			`</p>`
			`<button onclick="submit()">Submit</button>`
			`</fieldset>`
			`<div id="out">`
			`</div>`
			`</article>`
			`<footer class=box>`
			`Created by <a href="https://github.com/dariusk">Darius Kazemi</a> under mit license, see on <a href="https://github.com/dariusk/activtypub-to-rss">GitHub</a>`
			`</footer>`
First 2018-10-15 07:18:10 +03:00
			`<script>`
			`// https://bots.tinysubversions.com/api/convert/?feed=https://toomuchnotenough.site/feed.xml&username=tmne`
			`function submit() {`
			`let feed = document.querySelector('#feed').value;`
			`let username = document.querySelector('#username').value;`
			`let out = document.querySelector('#out');`
			fetch(`/api/convert/?feed=${feed}&username=${username}`)
			`.then(function(response) {`
			`if (response.status !== 200) {`
			out.innerHTML = `<p>Error: ${JSON.stringify(response.statusText)}</p>`;
			`return {};`
			`}`
			`return response.json();`
			`})`
			`.then(function(myJson) {`
			`console.log((myJson));`
			`// a feed exists in the database`
			`if (myJson.content) {`
			`// was it a match on feed`
			`if (myJson.feed === feed) {`
			`console.log('feed match!');`
			out.innerHTML = `<p>This feed already exists! Follow @${myJson.username}@bots.tinysubversions.com.</p>`;
			window.location = `/u/${myJson.username}`;
			`}`
			`// was it a match on username`
			`else if (myJson.username === username) {`
			`console.log('username match!');`
			out.innerHTML = `<p>This username is already taken for <a href="${myJson.feed}">this feed</a>.</p>`;
			`}`
			`}`
			`else if (myJson.title) {`
			out.innerHTML = `<p>Okay! There is now an ActivityPub actor for ${myJson.title}. You should be able to search for it from your ActivityPub client (Mastodon, Pleroma, etc) using this identifier: @${username}@bots.tinysubversions.com. You won't see anything there until the next time the RSS feed updates. You can check out the profile page for this feed at <a href="https://bots.tinysubversions.com/u/${username}/">https://bots.tinysubversions.com/u/${username}</a> too!</p>`;
			`}`

			`})`
			`.catch(error => {`
			`console.log('!!!',error);`
			out.innerHTML = `<p>Error: ${error}</p>`;
			`});`
			`}`
			`</script>`
			`</body>`
			`</html>`