-
Notifications
You must be signed in to change notification settings - Fork 58
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
fix: adapt for async hoodie.ready usage
- Loading branch information
Showing
3 changed files
with
297 additions
and
293 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,206 +1,207 @@ | ||
var originalDocumentTitle = document.title | ||
var locationHash = window.location.hash.replace('#', '') | ||
|
||
/** | ||
* Find all elements with a data-show attribute and apply a click handler | ||
* in which we check if an element with a data-action attribute was clicked. | ||
* If yes, then set the data-show attribute of the container element to what | ||
* is in the data-action of the clicked attribute (after the show- prefix) | ||
*/ | ||
;[].forEach.call(document.querySelectorAll('[data-show]'), function (el) { | ||
el.addEventListener('click', function (event) { | ||
var action = event.target.dataset.action | ||
var $formsContainer = event.currentTarget | ||
|
||
if (!action) { | ||
return | ||
hoodie.ready.then(function () { | ||
var originalDocumentTitle = document.title | ||
var locationHash = window.location.hash.replace('#', '') | ||
|
||
/** | ||
* Find all elements with a data-show attribute and apply a click handler | ||
* in which we check if an element with a data-action attribute was clicked. | ||
* If yes, then set the data-show attribute of the container element to what | ||
* is in the data-action of the clicked attribute (after the show- prefix) | ||
*/ | ||
;[].forEach.call(document.querySelectorAll('[data-show]'), function (el) { | ||
el.addEventListener('click', function (event) { | ||
var action = event.target.dataset.action | ||
var $formsContainer = event.currentTarget | ||
|
||
if (!action) { | ||
return | ||
} | ||
|
||
event.preventDefault() | ||
var showTarget = action.substr('show-'.length) | ||
$formsContainer.setAttribute('data-show', showTarget) | ||
setHashState(showTarget) | ||
}) | ||
if (locationHash) { | ||
el.setAttribute('data-show', locationHash) | ||
setHashState(locationHash) | ||
} | ||
|
||
event.preventDefault() | ||
var showTarget = action.substr('show-'.length) | ||
$formsContainer.setAttribute('data-show', showTarget) | ||
setHashState(showTarget) | ||
}) | ||
if (locationHash) { | ||
el.setAttribute('data-show', locationHash) | ||
setHashState(locationHash) | ||
} | ||
}) | ||
|
||
/** | ||
* Handle signup form submit | ||
*/ | ||
document.querySelector('form.signup').addEventListener('submit', function (event) { | ||
event.preventDefault() | ||
|
||
var email = this.querySelector('[name=email]').value | ||
var password = this.querySelector('[name=password]').value | ||
/** | ||
* Handle signup form submit | ||
*/ | ||
document.querySelector('form.signup').addEventListener('submit', function (event) { | ||
event.preventDefault() | ||
|
||
hoodie.account.signUp({ | ||
username: email, | ||
password: password | ||
}) | ||
var email = this.querySelector('[name=email]').value | ||
var password = this.querySelector('[name=password]').value | ||
|
||
.then(function () { | ||
return hoodie.account.signIn({ | ||
hoodie.account.signUp({ | ||
username: email, | ||
password: password | ||
}) | ||
}) | ||
|
||
.then(function () { | ||
location.href = 'index.html' | ||
.then(function () { | ||
return hoodie.account.signIn({ | ||
username: email, | ||
password: password | ||
}) | ||
}) | ||
|
||
.then(function () { | ||
window.location.href = 'index.html' | ||
}) | ||
|
||
.catch(handleError) | ||
}) | ||
|
||
.catch(handleError) | ||
}) | ||
/** | ||
* Handle signin form submit | ||
*/ | ||
document.querySelector('form.signin').addEventListener('submit', function (event) { | ||
event.preventDefault() | ||
|
||
/** | ||
* Handle signin form submit | ||
*/ | ||
document.querySelector('form.signin').addEventListener('submit', function (event) { | ||
event.preventDefault() | ||
var email = this.querySelector('[name=email]').value | ||
var password = this.querySelector('[name=password]').value | ||
|
||
var email = this.querySelector('[name=email]').value | ||
var password = this.querySelector('[name=password]').value | ||
hoodie.account.signIn({ | ||
username: email, | ||
password: password | ||
}) | ||
|
||
hoodie.account.signIn({ | ||
username: email, | ||
password: password | ||
}) | ||
.then(function () { | ||
window.location.href = 'index.html' | ||
}) | ||
|
||
.then(function () { | ||
location.href = 'index.html' | ||
.catch(handleError) | ||
}) | ||
|
||
.catch(handleError) | ||
}) | ||
/** | ||
* Handle change email form submit | ||
*/ | ||
document.querySelector('form.change-email').addEventListener('submit', function (event) { | ||
event.preventDefault() | ||
|
||
/** | ||
* Handle change email form submit | ||
*/ | ||
document.querySelector('form.change-email').addEventListener('submit', function (event) { | ||
event.preventDefault() | ||
var email = this.querySelector('[name=email]').value | ||
|
||
var email = this.querySelector('[name=email]').value | ||
hoodie.account.update({ | ||
username: email | ||
}) | ||
|
||
hoodie.account.update({ | ||
username: email | ||
}) | ||
.then(function () { | ||
alert('email updated') | ||
showOptions() | ||
}) | ||
|
||
.then(function () { | ||
alert('email updated') | ||
showOptions() | ||
.catch(handleError) | ||
}) | ||
|
||
.catch(handleError) | ||
}) | ||
/** | ||
* Handle password reset form submit | ||
*/ | ||
document.querySelector('form.password-reset').addEventListener('submit', function (event) { | ||
event.preventDefault() | ||
|
||
/** | ||
* Handle password reset form submit | ||
*/ | ||
document.querySelector('form.password-reset').addEventListener('submit', function (event) { | ||
event.preventDefault() | ||
var email = this.querySelector('[name=email]').value | ||
|
||
var email = this.querySelector('[name=email]').value | ||
hoodie.account.request({ | ||
type: 'passwordreset', | ||
username: email | ||
}) | ||
|
||
hoodie.account.request({ | ||
type: 'passwordreset', | ||
username: email | ||
}) | ||
.then(function () { | ||
alert('Email sent to ' + email) | ||
document.querySelector('[data-show="password-reset"]').setAttribute('data-show', 'signin') | ||
setHashState('signin') | ||
}) | ||
|
||
.then(function () { | ||
alert('Email sent to ' + email) | ||
document.querySelector('[data-show="password-reset"]').setAttribute('data-show', 'signin') | ||
setHashState('signin') | ||
.catch(handleError) | ||
}) | ||
|
||
.catch(handleError) | ||
}) | ||
/** | ||
* Handle change password form submit | ||
*/ | ||
document.querySelector('form.change-password').addEventListener('submit', function (event) { | ||
event.preventDefault() | ||
|
||
var $passwordInput = this.querySelector('[name=password]') | ||
var password = $passwordInput.value | ||
|
||
/** | ||
* Handle change password form submit | ||
*/ | ||
document.querySelector('form.change-password').addEventListener('submit', function (event) { | ||
event.preventDefault() | ||
hoodie.account.update({ | ||
password: password | ||
}) | ||
|
||
var $passwordInput = this.querySelector('[name=password]') | ||
var password = $passwordInput.value | ||
.then(function () { | ||
$passwordInput.value = '' | ||
alert('password updated') | ||
showOptions() | ||
}) | ||
|
||
hoodie.account.update({ | ||
password: password | ||
.catch(handleError) | ||
}) | ||
|
||
.then(function () { | ||
$passwordInput.value = '' | ||
alert('password updated') | ||
showOptions() | ||
/** | ||
* When clicking on "change username" button, set the input to current username | ||
*/ | ||
document.querySelector('[data-action="show-change-email"]').addEventListener('click', function (event) { | ||
event.preventDefault() | ||
document.querySelector('#input-change-email').value = hoodie.account.username | ||
}) | ||
|
||
.catch(handleError) | ||
}) | ||
|
||
/** | ||
* When clicking on "change username" button, set the input to current username | ||
*/ | ||
document.querySelector('[data-action="show-change-email"]').addEventListener('click', function (event) { | ||
event.preventDefault() | ||
document.querySelector('#input-change-email').value = hoodie.account.username | ||
}) | ||
/** | ||
* When clicking on "forgot password?" link, preset the email input with what is | ||
* entered in the sign in username input. | ||
*/ | ||
document.querySelector('[data-action="show-password-reset"]').addEventListener('click', function (event) { | ||
event.preventDefault() | ||
document.querySelector('#input-email-reset').value = document.querySelector('#input-signin-email').value | ||
}) | ||
|
||
/** | ||
* When clicking on "forgot password?" link, preset the email input with what is | ||
* entered in the sign in username input. | ||
*/ | ||
document.querySelector('[data-action="show-password-reset"]').addEventListener('click', function (event) { | ||
event.preventDefault() | ||
document.querySelector('#input-email-reset').value = document.querySelector('#input-signin-email').value | ||
}) | ||
/** | ||
* handle signout click. This will trigger a "signout" event which is handled | ||
* in common.js | ||
*/ | ||
document.querySelector('[data-action=signout]').addEventListener('click', function (event) { | ||
event.preventDefault() | ||
hoodie.account.signOut() | ||
|
||
/** | ||
* handle signout click. This will trigger a "signout" event which is handled | ||
* in common.js | ||
*/ | ||
document.querySelector('[data-action=signout]').addEventListener('click', function (event) { | ||
event.preventDefault() | ||
hoodie.account.signOut() | ||
.then(setHashState) | ||
}) | ||
|
||
.then(setHashState) | ||
}) | ||
/** | ||
* handle account destroy click. This will also trigger a "signout" event which | ||
* is handled in common.js | ||
*/ | ||
document.querySelector('[data-action="delete-account"]').addEventListener('click', function (event) { | ||
event.preventDefault() | ||
hoodie.account.destroy() | ||
}) | ||
|
||
/** | ||
* handle account destroy click. This will also trigger a "signout" event which | ||
* is handled in common.js | ||
*/ | ||
document.querySelector('[data-action="delete-account"]').addEventListener('click', function (event) { | ||
event.preventDefault() | ||
hoodie.account.destroy() | ||
}) | ||
function showOptions () { | ||
document.querySelector('.options').closest('[data-show]').setAttribute('data-show', 'options') | ||
} | ||
|
||
function showOptions () { | ||
document.querySelector('.options').closest('[data-show]').setAttribute('data-show', 'options') | ||
} | ||
|
||
function handleError (error) { | ||
alert(error) | ||
} | ||
|
||
function setHashState (hash) { | ||
var url = window.location.origin + window.location.pathname | ||
var title = originalDocumentTitle | ||
if (typeof hash === 'string') { | ||
url += '#' + hash | ||
var formattedHash = hash | ||
.split('-') | ||
.map(function (string) { | ||
return string.charAt(0).toUpperCase() + string.slice(1) | ||
}) | ||
.join(' ') | ||
title += ' | ' + formattedHash | ||
function handleError (error) { | ||
alert(error) | ||
} | ||
document.title = title | ||
window.history.replaceState(null, null, url) | ||
window.announce(document.title + ': Page loaded', 'assertive') | ||
} | ||
|
||
function setHashState (hash) { | ||
var url = window.location.origin + window.location.pathname | ||
var title = originalDocumentTitle | ||
if (typeof hash === 'string') { | ||
url += '#' + hash | ||
var formattedHash = hash | ||
.split('-') | ||
.map(function (string) { | ||
return string.charAt(0).toUpperCase() + string.slice(1) | ||
}) | ||
.join(' ') | ||
title += ' | ' + formattedHash | ||
} | ||
document.title = title | ||
window.history.replaceState(null, null, url) | ||
window.announce(document.title + ': Page loaded', 'assertive') | ||
} | ||
}) | ||
/* global hoodie, alert */ |
Oops, something went wrong.