03-04-2020 05:04 - edited 03-04-2020 13:45
03-04-2020 05:04 - edited 03-04-2020 13:45
I currently have a battery progress bar across the top of one of my clock faces and was wondering if someone could help me make it work for steps. In index.js I have
const batstat = document.getElementById("batstat");
batstat.width = battery.chargeLevel*3;
And in index.gui I have <rect width="150" height="25" id="batstat" fill="white"/>
I don't know how to retrieve the user's goal and I know the math would be something like (screen width / step goal) * step number. I need someone to help make this work, and also stop at full width because if I remember correctly there is an error if something exceeds the dimensions of the screen. Please be as detailed as possible, I am fairly new to this. Thanks!
Answered! Go to the Best Answer.
03-05-2020 16:33
03-05-2020 16:33
import { me as device } from "device";
import document from "document";
import { today, goals } from "user-activity";
const deviceWidth = device.screen.width;
const stepGoalPercentage = (userActivity.today.adjusted["steps"] || 0) * 100 / goals.steps;
const barWidth = (stepGoalPercentage / 100) * deviceWidth;
const myStepBar = document.getElementById("mystepbar");
myStepBar.width = barWidth;
Thanks, Had to change stepGoalPercentage to get info from a valid source, but it works great now! What would the code be for calories or floors? Would I just have to change it to goal.calories or goal. elevationGain? If you could list the names of the other stats so I could retrieve them properly, that would be great! Thanks Again!
03-05-2020 06:53
03-05-2020 06:53
Something like this, but it's untested:
import { me as device } from "device";
import document from "document";
import { today, goals } from "user-activity";
const deviceWidth = device.screen.width;
const stepGoalPercentage = (today.adjusted.steps || 0) * 100 / goal.steps;
const barWidth = (stepGoalPercentage / 100) * deviceWidth;
const myStepBar = document.getElementById("mystepbar");
myStepBar.width = barWidth;
03-05-2020 16:33
03-05-2020 16:33
import { me as device } from "device";
import document from "document";
import { today, goals } from "user-activity";
const deviceWidth = device.screen.width;
const stepGoalPercentage = (userActivity.today.adjusted["steps"] || 0) * 100 / goals.steps;
const barWidth = (stepGoalPercentage / 100) * deviceWidth;
const myStepBar = document.getElementById("mystepbar");
myStepBar.width = barWidth;
Thanks, Had to change stepGoalPercentage to get info from a valid source, but it works great now! What would the code be for calories or floors? Would I just have to change it to goal.calories or goal. elevationGain? If you could list the names of the other stats so I could retrieve them properly, that would be great! Thanks Again!
03-05-2020 16:37
03-05-2020 16:37
See the documentation.
03-05-2020 18:54
03-05-2020 18:54
Thanks, I was looking for something like this with all the documentation. This answers my questions.
03-06-2020 00:08
03-06-2020 00:08
@Momentric wrote:Thanks, Had to change stepGoalPercentage to get info from a valid source
I guess it depends how you've imported it, but make sure you aren't importing user-activity twice. I included it in my sample.