login, register, user reactive, creating user
This commit is contained in:
parent
377d16af13
commit
d098e21b4b
|
@ -64,13 +64,18 @@
|
|||
path: '/register/failed',
|
||||
component: () => import('$routes/register/registerFailed.svelte'),
|
||||
},
|
||||
|
||||
{
|
||||
path: '/register/emailverification/:erantId',
|
||||
component: () => import('$routes/register/emailVerification.svelte'),
|
||||
},
|
||||
{
|
||||
path: '/create/account/:erantId/',
|
||||
component: () => import('$routes/register/createAccount.svelte'),
|
||||
},
|
||||
{
|
||||
path: '/:gameurl',
|
||||
component: () => import('$routes/game/game.svelte'),
|
||||
},
|
||||
{
|
||||
path: '/create/account',
|
||||
component: () => import('$routes/game/game.svelte'),
|
||||
},
|
||||
]}
|
||||
/>
|
||||
|
|
|
@ -13,7 +13,7 @@
|
|||
$: console.log($user)
|
||||
|
||||
const emailLogin = async () => {
|
||||
await account.createEmailSession(email, password)
|
||||
await user.createEmailSession(email, password)
|
||||
//if (navigation.canGoBack) navigation.back()
|
||||
navigate('/')
|
||||
}
|
||||
|
|
|
@ -1,4 +1,23 @@
|
|||
<script>
|
||||
<script lang="ts">
|
||||
import { user } from '$lib/appwrite'
|
||||
import collections from '$lib/collections'
|
||||
import Loading from '$lib/components/Common/Loading.svelte'
|
||||
import { navigate } from '$lib/router'
|
||||
import { Permission, Role } from 'appwrite'
|
||||
export let params
|
||||
;(async () => {
|
||||
await collections.users.createDocument(
|
||||
{
|
||||
erantId: params.erantId,
|
||||
userName: $user.name,
|
||||
userId: $user.$id,
|
||||
},
|
||||
[Permission.delete(Role.user($user.$id)), Permission.update(Role.user($user.$id))],
|
||||
)
|
||||
navigate('/')
|
||||
})()
|
||||
</script>
|
||||
|
||||
<div />
|
||||
<div class="w-full h-full flex items-center justify-center">
|
||||
<Loading />
|
||||
</div>
|
||||
|
|
|
@ -1,14 +1,24 @@
|
|||
<script>
|
||||
<script lang="ts">
|
||||
import { user } from '$lib/appwrite'
|
||||
import Loading from '$lib/components/Common/Loading.svelte'
|
||||
import { navigate } from '$lib/router'
|
||||
|
||||
export let params
|
||||
|
||||
//register email verification
|
||||
const urlParams = new URLSearchParams(location.search)
|
||||
const userId = urlParams.get('userId')
|
||||
const secret = urlParams.get('secret')
|
||||
;(async () => {
|
||||
try {
|
||||
await account.updateVerification(userId, secret)
|
||||
navigate('/')
|
||||
await user.updateVerification(userId, secret)
|
||||
navigate(`/create/account/${params.erantId}`)
|
||||
} catch (err) {
|
||||
console.log(err)
|
||||
}
|
||||
})()
|
||||
</script>
|
||||
|
||||
<div class="w-full h-full flex items-center justify-center">
|
||||
<Loading />
|
||||
</div>
|
||||
|
|
|
@ -1,5 +1,7 @@
|
|||
<script>
|
||||
<script lang="ts">
|
||||
import { account, user } from '$lib/appwrite'
|
||||
import Loading from '$lib/components/Common/Loading.svelte'
|
||||
import { navigate } from '$lib/router'
|
||||
import Error from '$root/src/__error.svelte'
|
||||
import { ID } from 'appwrite'
|
||||
import HiddenInput from '../../lib/components/Inputs/Hidden_Input.svelte'
|
||||
|
@ -10,51 +12,65 @@
|
|||
let password = 'aaaaaaaa'
|
||||
let repeatPassword = 'aaaaaaaa'
|
||||
let name = 'test'
|
||||
let erantId = '@otik'
|
||||
|
||||
let state: 'email-sent' | 'register' | 'loading' = 'register'
|
||||
|
||||
const register = async () => {
|
||||
//if (password === repeatPassword || name.length < 8 || email.length < 8) throw new Error('conditions are not fine')
|
||||
try {
|
||||
state = 'loading'
|
||||
await account.create(ID.unique(), email, password, name)
|
||||
await account.createEmailSession(email, password)
|
||||
await account.createVerification(`${location.origin}/`)
|
||||
await account.createVerification(`${location.origin}/register/emailverification/${erantId}`)
|
||||
state = 'email-sent'
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
state = 'register'
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="main">
|
||||
<div class="top-image">
|
||||
<TopImage />
|
||||
{#if state === 'register'}
|
||||
<div class="main">
|
||||
<div class="top-image">
|
||||
<TopImage />
|
||||
</div>
|
||||
|
||||
<h1 class="headline">Register</h1>
|
||||
|
||||
<div class="form">
|
||||
<form>
|
||||
<input bind:value={name} type="text" placeholder="Name" autocomplete="full-name" required />
|
||||
<input bind:value={email} type="text" placeholder="E-mail" autocomplete="email" required />
|
||||
<input bind:value={erantId} type="text" placeholder="E-mail" autocomplete="email" required />
|
||||
<HiddenInput bind:value={password} placeholder="Password" />
|
||||
<HiddenInput bind:value={repeatPassword} placeholder="Re-type password" />
|
||||
<input class="cursor-pointer" on:click={() => register()} type="button" value="Sign up" />
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<div class="continue_with">
|
||||
<button on:click={() => account.createOAuth2Session('google', location.origin, `${location.origin}/register/failed`)}>
|
||||
<GoogleLogo />
|
||||
<p>Continue with Google</p>
|
||||
</button>
|
||||
|
||||
<button on:click={() => account.createOAuth2Session('facebook', `${location.origin}/`, `${location.origin}/register/failed`)}>
|
||||
<p>Continue with Facebook</p>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="LR_switch">
|
||||
<p>Already have an account? <a href="/login">Log In</a></p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h1 class="headline">Register</h1>
|
||||
|
||||
<div class="form">
|
||||
<form>
|
||||
<input bind:value={name} type="text" placeholder="Name" autocomplete="full-name" required />
|
||||
<input bind:value={email} type="text" placeholder="E-mail" autocomplete="email" required />
|
||||
<HiddenInput bind:value={password} placeholder="Password" />
|
||||
<HiddenInput bind:value={repeatPassword} placeholder="Re-type password" />
|
||||
<input class="cursor-pointer" on:click={() => register()} type="button" value="Sign up" />
|
||||
</form>
|
||||
{:else if state === 'email-sent'}
|
||||
<div class="w-full h-full flex justify-center items-center">email has been sent</div>
|
||||
{:else if state === 'loading'}
|
||||
<div class="w-full h-full flex items-center justify-center">
|
||||
<Loading />
|
||||
</div>
|
||||
|
||||
<div class="continue_with">
|
||||
<button on:click={() => account.createOAuth2Session('google', location.origin, `${location.origin}/register/failed`)}>
|
||||
<GoogleLogo />
|
||||
<p>Continue with Google</p>
|
||||
</button>
|
||||
|
||||
<button on:click={() => account.createOAuth2Session('facebook', location.origin, `${location.origin}/register/failed`)}>
|
||||
<p>Continue with Facebook</p>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="LR_switch">
|
||||
<p>Already have an account? <a href="/login">Log In</a></p>
|
||||
</div>
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
<style lang="scss">
|
||||
$gap: 20px;
|
||||
|
|
Loading…
Reference in New Issue