diff --git a/assets/styles/app.scss b/assets/styles/app.scss
index 6e348e4..6e6b351 100644
--- a/assets/styles/app.scss
+++ b/assets/styles/app.scss
@@ -184,6 +184,10 @@
.status-message {
color: $primary;
text-align: center;
+
+ &.is-danger {
+ color: $danger;
+ }
}
}
diff --git a/pages/index.vue b/pages/index.vue
index 284ab19..2ec9322 100644
--- a/pages/index.vue
+++ b/pages/index.vue
@@ -34,9 +34,9 @@
-
-
{{ status }}
-
+
@@ -48,7 +48,11 @@
>
Make the contribution
-
+
Tweet about your contribution
@@ -67,8 +71,10 @@ export default {
data() {
return {
isContributeBtnDisabled: false,
- isContibutionCompleted: false,
- status: '',
+ status: {
+ type: '',
+ msg: ''
+ },
isLoggedIn: false
}
},
@@ -77,18 +83,19 @@ export default {
try {
this.isContributeBtnDisabled = true
- this.status = 'Downloading last contribution'
+ this.status.msg = 'Downloading last contribution'
+ this.status.type = ''
let data = await fetch('api/challenge')
data = new Uint8Array(await data.arrayBuffer())
- this.status = 'Generating random contribution'
+ this.status.msg = 'Generating random contribution'
await timeout(100) // allow UI to update before freezing in wasm
console.log('Source params', data)
const contribute = await this.$contribute()
const result = contribute(data)
console.log('Updated params', result)
- this.status = 'Uploading and verifying your contribution'
+ this.status.msg = 'Uploading and verifying your contribution'
const formData = new FormData()
formData.append('response', new Blob([result], { type: 'application/octet-stream' }))
formData.append('name', 'William') // TODO put real name here
@@ -99,19 +106,26 @@ export default {
})
if (resp.ok) {
- this.status = 'Your contribution is verified and recorded. THX BYE.'
- this.isContibutionCompleted = true
+ this.status.msg = 'Your contribution is verified and recorded. THX BYE.'
+ this.status.type = 'is-success'
} else if (resp.status === 422) {
if (retry < 3) {
console.log(`Looks like someone else uploaded contribution ahead of us, retrying`)
await this.makeContribution({ retry: retry++ })
} else {
- this.status = `Failed to upload your contribution after ${retry} attempts`
+ this.status.msg = `Failed to upload your contribution after ${retry} attempts`
+ this.status.type = 'is-danger'
+ this.isContributeBtnDisabled = false
}
} else {
- this.status = 'Error uploading your contribution'
+ this.status.msg = 'Error uploading your contribution'
+ this.status.type = 'is-danger'
+ this.isContributeBtnDisabled = false
}
- } finally {
+ } catch (e) {
+ console.error(e.message)
+ this.status.msg = e.message
+ this.status.type = 'is-danger'
this.isContributeBtnDisabled = false
}
}