@ -212,23 +212,26 @@ All of the code in the file is wrapped in an event
listener.
listener.
```js
```js
document.addEventListener("DOMContentLoaded", function(event) {
document.addEventListener("DOMContentLoaded", event => {
})
})
```
```
This listener that waits until the DOM content is loaded. Then, it creates an auth request and redirects the user to sign in:
This listener that waits until the DOM content is loaded. Then, it creates an auth request and redirects the user to sign in:
```js
```js
document.getElementById('signin-button').addEventListener('click', function() {
document.getElementById('signin-button').addEventListener('click', event => {
blockstack.redirectUserToSignIn()
event.preventDefault()
userSession.redirectToSignIn()
})
})
```
```
You can find the `redirectUser ToSignIn()` function is part of the [Blockstack Javascript documentation ](https://blockstack.github.io/blockstack.js/ ). There is also a sign out button handler. This handler deletes the local user data and signs the user out:
You can find the `redirectToSignIn()` function is part of the [Blockstack Javascript documentation ](https://blockstack.github.io/blockstack.js/ ). There is also a sign out button handler. This handler deletes the local user data and signs the user out:
```js
```js
document.getElementById('signout-button').addEventListener('click', function() {
document.getElementById('signout-button').addEventListener('click', event => {
blockstack.signUserOut(window.location.origin)
event.preventDefault()
userSession.signUserOut()
window.location = window.location.origin
})
})
```
```
@ -236,7 +239,7 @@ The handlers are followed by a `showProfile()` function for showing the user's p
```js
```js
function showProfile(profile) {
function showProfile(profile) {
var person = new blockstack.Person(profile)
let person = new blockstack.Person(profile)
document.getElementById('heading-name').innerHTML = person.name() ? person.name() : "Nameless Person"
document.getElementById('heading-name').innerHTML = person.name() ? person.name() : "Nameless Person"
if(person.avatarUrl()) {
if(person.avatarUrl()) {
document.getElementById('avatar-image').setAttribute('src', person.avatarUrl())
document.getElementById('avatar-image').setAttribute('src', person.avatarUrl())
@ -259,12 +262,14 @@ several states the user can be in:
The application handles these situations as followed:
The application handles these situations as followed:
```js
```js
var userSession = new UserSession()
const appConfig = new blockstack.AppConfig()
const userSession = new blockstack.UserSession({ appConfig: appConfig })
if (userSession.isUserSignedIn()) {
if (userSession.isUserSignedIn()) {
var profile = userSession.loadUserData().profile
const { profile } = userSession.loadUserData()
showProfile(profile)
showProfile(profile)
} else if (userSession.isSignInPending()) {
} else if (userSession.isSignInPending()) {
userSession.handlePendingSignIn().then(function(userData) {
userSession.handlePendingSignIn().then(userData => {
window.location = window.location.origin
window.location = window.location.origin
})
})
}
}