DEV Community


My Virtual Challenge Percentage Bookmarklet

Dominic Myers
Front-end developer, Archer, Writer and Educator
Originally published at on ・2 min read

I did 1000 miles of exercise at the beginning of the year (I'm only £20 off my target if you want to follow that link and donate?) using My Virtual Mission and found myself at a loose end when I finished the challenge... so I signed up for a new one. This one is a lot longer (2,485.5 miles), and I've been assiduously adding my steps and cycle rides every morning since I started - but I don't know what percentage I've completed. So I wrote some code in a Snippet and converted it, once it was doing what I needed, into a Bookmarklet: Get Percentage. I've found it works well so feel free to copy it to your bookmarks should you also want to see your millage converted to a percentage.

Should you want to check the code, this is it:

const container = document.querySelector('.mission-container')
const target = container.querySelector('.mission-target')
const current = target.querySelector('#goal-mine .progress-bar-current')
const missionTarget = Number(target.querySelector('.totals .total-value').innerHTML.split(' ')[0].replace(/,/g, ''))
const current_text = current.innerHTML
const current_miles = Number(current_text.split(' ')[0].replace(/,/g, ''))
current.innerHTML = `${current_text} (${((current_miles / missionTarget) \* 100).toFixed(2)}%)`

Enter fullscreen mode Exit fullscreen mode

Discussion (0)