213 lines
		
	
	
		
			6.9 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
			
		
		
	
	
			213 lines
		
	
	
		
			6.9 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
<!DOCTYPE html>
 | 
						|
<html>
 | 
						|
  <head>
 | 
						|
    <title>Telebit™ Cloud</title>
 | 
						|
    <meta charset="UTF-8">
 | 
						|
    <style>
 | 
						|
      /* http://www.karlgroves.com/2013/12/17/quick-tip-text-characters-as-visual-separators/ */
 | 
						|
      pre {
 | 
						|
        margin-left: 2em;
 | 
						|
        background-color: #EFEFFF;
 | 
						|
        padding: 1em;
 | 
						|
      }
 | 
						|
      footer li{
 | 
						|
          list-style-type: none;
 | 
						|
          display: inline;
 | 
						|
          margin-right: .3 em;
 | 
						|
      }
 | 
						|
      footer li:not(:last-of-type):after{
 | 
						|
          content: ' | ';
 | 
						|
      }
 | 
						|
    </style>
 | 
						|
  </head>
 | 
						|
  <body>
 | 
						|
    <script>document.body.hidden = true;</script>
 | 
						|
 | 
						|
    <center>
 | 
						|
      <h1>Telebit Cloud</h1>
 | 
						|
      <p>Because friends don't let friends localhost.</p>
 | 
						|
      <p>Friends enable friends to share anything, access anywhere, connect anytime.</p>
 | 
						|
    </center>
 | 
						|
 | 
						|
    <div style="width: 800px; margin: auto;">
 | 
						|
      <div>
 | 
						|
        <h2>Share and Test over HTTPS</h2>
 | 
						|
        <p>End-to-End Encryption with Free (or custom) Domains</p>
 | 
						|
        <pre><code>$ telebit http 3000</code></pre>
 | 
						|
 | 
						|
<pre><code>> Serving localhost:3000 as https://lucky-duck-42.telebit.cloud
 | 
						|
> Go forth and share!
 | 
						|
> ex: curl https://lucky-duck-42.telebit.cloud</code></pre>
 | 
						|
      </div>
 | 
						|
      <div>
 | 
						|
        <h2>Remote and Pair over SSH</h2>
 | 
						|
        <p>Securely As Needed or Conveniently Always On</p>
 | 
						|
        <pre><code>$ telebit ssh 22</code></pre>
 | 
						|
 | 
						|
<pre><code>> Serving ssh at lucky-duck-42.telebit.cloud on port 5050
 | 
						|
> ex: ssh lucky-duck-42.telebit.cloud -p 5050
 | 
						|
> ex: ssh lucky-duck-42.telebit.cloud -o \
 | 
						|
   ProxyCommand='openssl s_client -connect %h:443 -servername %h -quiet'</code></pre>
 | 
						|
      </div>
 | 
						|
    </div>
 | 
						|
 | 
						|
    <div style="width: 500px; margin: auto;">
 | 
						|
 | 
						|
      <h2>1. Install Telebit</h2>
 | 
						|
      <p>We have a simple command line installer for Mac and Linux:</p>
 | 
						|
      <pre><code>curl -fsSL https://get.telebit.cloud/ | bash</code></pre>
 | 
						|
      <p>Windows requires <a href="https://git.coolaj86.com/coolaj86/telebit.js" target="_blank">manual installation</a>, but it's not too hard.</p>
 | 
						|
 | 
						|
      <h2>2. Claim your device via Email</h2>
 | 
						|
      <p>You'll get an email that looks like this:</p>
 | 
						|
      <pre><code>You've installed Telebit on 'Jon's Macbook Pro'.
 | 
						|
 | 
						|
Authenticate your account and claim your device:
 | 
						|
 | 
						|
    https://www.telebit.cloud/login/?magic=xxxxxxxxxxxxxx
 | 
						|
</code></pre>
 | 
						|
 | 
						|
      <h2>3. Enjoy Anytime, Anywhere Access</h2>
 | 
						|
      <p>With a free account you'll get a random name and port number, such as "lucky-duck-42" and "22222".</p>
 | 
						|
      <pre><code>HTTPS
 | 
						|
 | 
						|
  https://lucky-duck-42.telebit.cloud
 | 
						|
 | 
						|
SSH
 | 
						|
 | 
						|
  ssh ssh.telebit.cloud -p 22222
 | 
						|
 | 
						|
TCP
 | 
						|
 | 
						|
  netcat tcp.telebit.cloud 22222</code></pre>
 | 
						|
 | 
						|
<pre><code>SSH over HTTPS (not blocked by firewalls)
 | 
						|
 | 
						|
  # Add the following to ~/.ssh/config: 
 | 
						|
  Host lucky-duck-42.telebit.cloud
 | 
						|
    ProxyCommand openssl s_client -quiet -connect %h:443
 | 
						|
 | 
						|
  # Run ssh with (your domain, no port):
 | 
						|
  ssh lucky-duck-42.telebit.cloud</code></pre>
 | 
						|
 | 
						|
      <p><footer>
 | 
						|
        <h3>
 | 
						|
          <li><a href="https://git.coolaj86.com/coolaj86/telebit.js" target="_blank">Read the Telebit docs</a></li>
 | 
						|
          <li><a href="https://git.coolaj86.com/coolaj86/telebitd.js" target="_blank">Host your own Telebit Relay</a></li>
 | 
						|
        </h3>
 | 
						|
 | 
						|
 | 
						|
				<div class="alert alert-info js-list-thanks hidden" hidden>Thanks! We'll be in touch.</div>
 | 
						|
				<div id="next">
 | 
						|
					<br>
 | 
						|
					<br>
 | 
						|
				</div>
 | 
						|
				<form class="js-list-form">
 | 
						|
					<div class="alert alert-info">
 | 
						|
						<h2>Want to follow our progress?</h2>
 | 
						|
						<div class="form-group">
 | 
						|
							<label>Your name</label>
 | 
						|
							<input class="js-list-comment form-control" placeholder="ex: John Doe" />
 | 
						|
              <br>
 | 
						|
							<small class="form-text text-muted">(optional, so we know what to call you other than <em>rubybelle99@gmail.com</em> or whatever...)</small>
 | 
						|
						</div>
 | 
						|
            <br>
 | 
						|
						<div class="form-group">
 | 
						|
							<label>Your email</label>
 | 
						|
							<input class="js-list-address form-control" type="email" placeholder="ex: john@email.com" />
 | 
						|
              <br>
 | 
						|
							<small class="form-text text-muted">(non-optional, otherwise this doesn't even make any sense)</small>
 | 
						|
						</div>
 | 
						|
            <br>
 | 
						|
						<div class="form-group">
 | 
						|
							<button class="js-list-submit btn btn-primary form-control" type="button">Join us!</button>
 | 
						|
						</div>
 | 
						|
					</div>
 | 
						|
				</form>
 | 
						|
 | 
						|
				<br>
 | 
						|
				<br>
 | 
						|
 | 
						|
				<center>
 | 
						|
					<li>©2018 AJ ONeal</li>
 | 
						|
					<li><a href="https://git.coolaj86.com/coolaj86/telebit.js" target="_blank">git</a></li>
 | 
						|
					<li><a href="/legal/" target="_blank">License</a></li>
 | 
						|
					<li><a href="/legal/" target="_blank">Terms</a></li>
 | 
						|
					<li><a href="/legal/" target="_blank">Privacy</a></li>
 | 
						|
				</center>
 | 
						|
      </footer></p>
 | 
						|
 | 
						|
    </div>
 | 
						|
 | 
						|
    <form class="js-auth-form">
 | 
						|
      <input class="js-auth-subject" type="email"/>
 | 
						|
      <button class="js-auth-submit" type="submit">Login</button>
 | 
						|
    </form>
 | 
						|
    <script src="assets/oauth3.org/oauth3.core.js"></script>
 | 
						|
    <script>
 | 
						|
      (function () {
 | 
						|
        'use strict';
 | 
						|
        var OAUTH3 = window.OAUTH3;
 | 
						|
        var oauth3 = OAUTH3.create(window.location);
 | 
						|
        var $ = function () { return document.querySelector.apply(document, arguments); }
 | 
						|
 | 
						|
				function onChangeProvider(providerUri) {
 | 
						|
					// example https://oauth3.org
 | 
						|
					return oauth3.setIdentityProvider(providerUri);
 | 
						|
				}
 | 
						|
 | 
						|
				// This opens up the login window for the specified provider
 | 
						|
				//
 | 
						|
				function onClickLogin(ev) {
 | 
						|
          ev.preventDefault();
 | 
						|
          ev.stopPropagation();
 | 
						|
 | 
						|
          // TODO check subject for provider viability
 | 
						|
          return oauth3.authenticate({
 | 
						|
            subject: $('.js-auth-subject').value
 | 
						|
          }).then(function (session) {
 | 
						|
 | 
						|
						console.info('Authentication was Successful:');
 | 
						|
						console.log(session);
 | 
						|
 | 
						|
						// You can use the PPID (or preferably a hash of it) as the login for your app
 | 
						|
						// (it securely functions as both username and password which is known only by your app)
 | 
						|
						// If you use a hash of it as an ID, you can also use the PPID itself as a decryption key
 | 
						|
						//
 | 
						|
						console.info('Secure PPID (aka subject):', session.token.sub);
 | 
						|
 | 
						|
						return oauth3.request({
 | 
						|
							url: 'https://api.oauth3.org/api/issuer@oauth3.org/jwks/:sub/:kid.json'
 | 
						|
                .replace(/:sub/g, session.token.sub)
 | 
						|
                .replace(/:kid/g, session.token.iss)
 | 
						|
						, session: session
 | 
						|
						}).then(function (resp) {
 | 
						|
              console.info("Public Key:");
 | 
						|
              console.log(resp.data);
 | 
						|
 | 
						|
              return oauth3.request({
 | 
						|
                url: 'https://api.oauth3.org/api/issuer@oauth3.org/acl/profile'
 | 
						|
              , session: session
 | 
						|
              }).then(function (resp) {
 | 
						|
 | 
						|
                console.info("Inspect Token:");
 | 
						|
                console.log(resp.data);
 | 
						|
 | 
						|
              });
 | 
						|
 | 
						|
						});
 | 
						|
 | 
						|
					}, function (err) {
 | 
						|
						console.error('Authentication Failed:');
 | 
						|
						console.log(err);
 | 
						|
					});
 | 
						|
 | 
						|
				}
 | 
						|
        $('body form.js-auth-form').addEventListener('submit', onClickLogin);
 | 
						|
        onChangeProvider('oauth3.org');
 | 
						|
      }());
 | 
						|
    </script>
 | 
						|
    <script src="js/app.js"></script>
 | 
						|
  </body>
 | 
						|
</html>
 |