forked from cybrespace/pinafore
		
	
		
			
				
	
	
		
			94 lines
		
	
	
		
			No EOL
		
	
	
		
			2.6 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
			
		
		
	
	
			94 lines
		
	
	
		
			No EOL
		
	
	
		
			2.6 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
<:Head>
 | 
						|
  <title>Instance Wizard</title>
 | 
						|
</:Head>
 | 
						|
 | 
						|
<Layout page='settings'>
 | 
						|
  <h1>Add an instance</h1>
 | 
						|
 | 
						|
  <p>Log in to your instance to use Pinafore.</p>
 | 
						|
 | 
						|
  <form on:submit='handleSubmit(event)'>
 | 
						|
    <label for="instanceInput">Instance name:</label>
 | 
						|
    <input type="text" id="instanceInput" bind:value='instanceName' placeholder=''>
 | 
						|
    <button class="primary" type="submit" id="submitButton">Add instance</button>
 | 
						|
  </form>
 | 
						|
 | 
						|
  <p>Don't have an instance? <a href="https://joinmastodon.org">Join Mastodon!</a></p>
 | 
						|
</Layout>
 | 
						|
<style>
 | 
						|
  @media (max-width: 767px) {
 | 
						|
    input {
 | 
						|
      width: 90%;
 | 
						|
    }
 | 
						|
  }
 | 
						|
 | 
						|
  input {
 | 
						|
    width: 250px;
 | 
						|
  }
 | 
						|
 | 
						|
  form {
 | 
						|
    background: #fafafa;
 | 
						|
    padding: 5px 10px 15px;
 | 
						|
    border: 1px solid #ccc;
 | 
						|
    margin: 0 auto;
 | 
						|
  }
 | 
						|
 | 
						|
  form label, form input, form button {
 | 
						|
    display: block;
 | 
						|
    margin: 20px 5px;
 | 
						|
  }
 | 
						|
 | 
						|
 | 
						|
 | 
						|
</style>
 | 
						|
<script>
 | 
						|
  import Layout from '../_components/Layout.html';
 | 
						|
  import { registerApplication, generateAuthLink, getAccessTokenFromAuthCode } from '../_utils/mastodon'
 | 
						|
  import { databasePromise } from '../_utils/database'
 | 
						|
  import { goto } from 'sapper/runtime.js'
 | 
						|
 | 
						|
  export default {
 | 
						|
    oncreate: function () {
 | 
						|
      if (process.browser) {
 | 
						|
        (async () => {
 | 
						|
          let params = new URLSearchParams(location.search)
 | 
						|
          if (params.has('code')) {
 | 
						|
            let db = await databasePromise
 | 
						|
            let instanceData = await db.get('instance')
 | 
						|
            this.set({instanceName: instanceData.instanceName})
 | 
						|
            let code = params.get('code')
 | 
						|
            instanceData.code = code
 | 
						|
            let response = await (await getAccessTokenFromAuthCode(
 | 
						|
              instanceData.instanceName,
 | 
						|
              instanceData.client_id,
 | 
						|
              instanceData.client_secret,
 | 
						|
              instanceData.code
 | 
						|
            )).json()
 | 
						|
            instanceData = Object.assign(instanceData, response)
 | 
						|
            await db.set(`instance`, instanceData)
 | 
						|
            goto('/')
 | 
						|
          }
 | 
						|
        })()
 | 
						|
      }
 | 
						|
    },
 | 
						|
    components: {
 | 
						|
      Layout
 | 
						|
    },
 | 
						|
    data: () => ({
 | 
						|
      instanceName: ''
 | 
						|
    }),
 | 
						|
    methods: {
 | 
						|
      handleSubmit: async function(event) {
 | 
						|
        event.preventDefault()
 | 
						|
        let instanceName = this.get('instanceName')
 | 
						|
        instanceName = instanceName.replace(/^https?:\/\//, '').replace('/$', '')
 | 
						|
        let data = await (await registerApplication(instanceName)).json()
 | 
						|
        let db = await databasePromise
 | 
						|
        data.instanceName = instanceName
 | 
						|
        await db.set(`instance`, data)
 | 
						|
        let oauthUrl = generateAuthLink(instanceName, data.client_id)
 | 
						|
        document.location.href = oauthUrl
 | 
						|
      },
 | 
						|
    }
 | 
						|
  }
 | 
						|
</script> |