Adding weekdate

[sspyli]

Hi, all! I am building a Versa Clockface, I can put month, date and time on it, but still have problem with adding weekdate( Like Mon, Tue.....). Is there anyone can help me with this?Thanks!

[nowo]

Hi sspyli,

you can use getDay():

let weekday = date_var.getDay();
if(weekday === 0) {
console.log("Sun");
} else if(weekday === 1) {
console.log("Mon");
} else if(weekday === 2) {
console.log("Tue");
} else if(weekday === 3) {
console.log("Wed");
} else if(weekday === 4) {
console.log("Thu");
} else if(weekday === 5) {
console.log("Fri");
} else if(weekday === 6) {
console.log("Sat");
} else {
console.log("Err");
}

[sspyli]

Thank you SO much! 

I tried to use those, but  I keep getting an error message which says "date_var is not defined weekday". How would I go about doing that?

[ObSkewer]

date_var is simply the variable name nowo chose to use to make that code snippet (it's not a special keyword, or anything) - you will need to change that to whatever you currently call your date variable.

[sspyli]

Then I changed the name, shows "Expected  a function", looks like still missing some code here.

[ObSkewer]

Post the code you're using - that's the only way we will be able to help more.

[sspyli]

import clock from "clock";
import document from "document";
import { preferences } from "user-settings";
import * as util from "../common/utils";
import { today } from "user-activity";
import { display } from "display";

console.log((today.local.steps || 0) + " steps");

let txtSteps = document.getElementById("txtSteps");

function update() {

steps.text = today.adjusted.steps || 0 + " steps";
}
// Update the clock every minute
clock.granularity = "minutes";

// Get a handle on the <text> element
const myLabel = document.getElementById("myLabel");
const myweekday = document.getElementById("myWeekday");
const myMonth = document.getElementById("myMonth");
const myDay = document.getElementById("myDay");
const txtSeps = document.getElementById("txtSteps");

// inside the clock tick handler
txtSteps.text = today.adjusted.steps || 0 + " steps";

// Update the <text> element every tick with the current time
clock.ontick = (evt) => {
let today = evt.date;
let hours = today.getHours();
let monthnum = today.getMonth();
let day = today.getDate();

var month = new Array();
month[0] = "Jan";
month[1] = "Feb";
month[2] = "Mar";
month[3] = "Apr";
month[4] = "May";
month[5] = "Jun";
month[6] = "Jul";
month[7] = "Aug";
month[8] = "Sep";
month[9] = "Oct";
month[10] = "Nov";
month[11] = "Dec";
let monthname = month[monthnum];

let weekday = date1.getDay();
if(weekday === 0) {
console.log("Sun");
} else if(weekday === 1) {
console.log("Mon");
} else if(weekday === 2) {
console.log("Tue");
} else if(weekday === 3) {
console.log("Wed");
} else if(weekday === 4) {
console.log("Thu");
} else if(weekday === 5) {
console.log("Fri");
} else if(weekday === 6) {
console.log("Sat");
} else {
console.log("Err");
}

display.onchange = function() {
if (display.on) {
console.log("ON");
updateSteps();
}
}



if (preferences.clockDisplay === "12h") {
// 12h format
hours = hours % 12 || 12;
} else {
// 24h format
hours = util.zeroPad(hours);
}
let mins = util.zeroPad(today.getMinutes());
myLabel.text = `${hours}:${mins}`;
myMonth.text = `${monthname}`;
myDay.text = `${day}`;
myWeekday.text = `${weekday}`;

}

[ObSkewer]

Use the same setup as you use already for your month name.

Replace

let weekday = date1.getDay();
if(weekday === 0) {
console.log("Sun");
} else if(weekday === 1) {
console.log("Mon");
} else if(weekday === 2) {
console.log("Tue");
} else if(weekday === 3) {
console.log("Wed");
} else if(weekday === 4) {
console.log("Thu");
} else if(weekday === 5) {
console.log("Fri");
} else if(weekday === 6) {
console.log("Sat");
} else {
console.log("Err");
}

with

var day = new Array();
day[0] = "Mon";
day[1] = "Tue";
day[2] = "Wed";
day[3] = "Thu";
day[4] = "Fri";
day[5] = "Sat";
day[6] = "Sun";
let dayname = day[today.getDate];

then

myWeekday.text = `${weekday}`;

becomes

myWeekday.text = `${dayname}`;

[Gondwana]

Where is date1 declared and initialised?

[sspyli]

I just changed that one, have no clues to declare. 

---

---

[ObSkewer]

EDIT: Ignore. See my suggested fix above.

[sspyli]

Before I added the weekday code,  the clock face I had built like this.

[ObSkewer]

I've edited my answer above. Now that I can see your code, it's easier to replicate the monthname setup you're already using.

In your code above, you don't actually set a name for the day - you're logging the name to the console, but never actually retaining the name, so at best your weekday.text would be "0", "1", ... "6". In my code above, the name is actually set and used.

Note that for me the first day of the week is Monday, so I used that for value 0... If your week starts with Sunday, use that for value 0 (as nowo did in their example).

[sspyli]

I replace all as you posted, but still shows my Weekday is not defined.

[ObSkewer]

Check your code:

const myweekday = document.getElementById("myWeekday");

               ^ note not a capitol W

but later on you call it with a capitol:

myWeekday.text = `${dayname}`;

I suspect that's all you're seeing just now.

[sspyli]

Thank you for that. Then I replaced the "const weekday" to "const Weekday". Then another issue came up, Unhandled TypeError, "can't set property "text"of null my Weekday.at the final line. And also did you see the clock face, all the weekday came out.

[sspyli]

The clockface shows like this

[FlyFrosty]

This is from the original Fitbit sample.  It has been working for me...

//Get the date in the proper order
function formatDate(date) {
   var monthNames = [
    "Jan", "Feb", "Mar", "April", "May", "June", "July", "Aug", "Sep", "Oct", "Nov", "Dec"
  ];
   var dayNames = [
    "Sun", "Mon", "Tues", "Weds", "Thurs", "Fri", "Sat"
  ];  
  var day = date.getDate();
  var monthIndex = date.getMonth();
  var year = date.getFullYear();
  var todayIndex = date.getDay();

  return dayNames[todayIndex] + ', ' + day + ' ' + monthNames[monthIndex];
}

[sspyli]

Thank you! I will try it.

[sspyli]

So I used the code you sent, then my clockface shows like this. Is there any thing I missed?