I made a custom dashboard for my goals

I’ve made my own auto-refreshing dashboard. I slightly tweaked the buffer colors to make slightly more sense to me. I’m happy to answer any questions about it!

Sign in:

The dashboard proper:

15 Likes

It looks amazing. How much time did you spend on it?

2 Likes

Thanks!

Woof. Not sure. Maybe 10 hours so far? I’m not a software developer so it’s slow going at times.

3 Likes

This looks gorgeous! Thanks so much for making it and showing it off. Are you ready to share the link to it?

3 Likes

Thank you!

Pretty soon! But not quite yet. I want to clean up some funkiness in the code before I make it more public. But I’ll post here when I do.

3 Likes

Alright. Here you go. There’s a link to the source at the bottom of the sign-in page.

8 Likes

I did a “character pass” on the dashboard, trying to make it a little less austere. Soon the emoji will be changeable and persistent, but right now they’re just random.

7 Likes

Currently experimenting with this sort of timeline/kanban view. I’m trying to get out of the habit of line-riding and want to better see what I should prioritize at any given moment.

6 Likes

Nice! What did you use to create it?

1 Like

It’s built in Svelte/Sveltekit. You can see the source code here.

2 Likes

I found this view really interesting! Thanks for sharing your work-in-progress app with us :slight_smile:

I wanted to give it a shot but can’t submit my token :thinking:

Here’s what I’m doing:

Nothing happens. Including no network requests to Beeminder API.

I thought maybe input doesn’t handle the paste well, and needs an input event. So I deleted the last character of my token and entered it again.

It looks like I’m getting this error when I type something into the token input:

image

I use Arc. I tried with a vanilla Chrome too. In that case I didn’t see the error. The button click still didn’t lead to anything.

4 Likes

Sorry about that. Are you putting in the whole bracketed JSON object that comes back from https://www.beeminder.com/api/v1/auth_token.json (including the username)? This is a usability problem that’s been on my radar since the beginning that I’ve never come back and addressed, but I know it’s difficult to know what exactly goes in that text field.

As far as the error goes, I’m not sure what’s going on with that! I haven’t been able to reproduce it in Arc, but I’ll keep looking.

And I apologize but I also haven’t released this timeline-centric view yet. I just whipped it up quickly this weekend, and the code is not good and it’s almost certainly buggy. :grimacing:

3 Likes

Ah that explains it, thanks! I now see the hint in the placeholder text :slight_smile:

Before reading your reply, I’ve been pasting only the token and not the whole object.

Looking forward to the release of the new view :rocket:

2 Likes

I haven’t had a ton of time to make more progress on the emoji and timeline view, so I figured I’d just put them out as they are and folks can use them if they want.

The features are simply enabled via URL params, so you can access them using this: Beeminder Dashboard

Emoji can be set by clicking the placeholder, then inputting an emoji character. It’s stored locally and gets forgotten if you sign out. No emoji picker yet, sorry!

The timeline view can be toggled in the settings menu:

Everything else should continue working as it has. And you can always turn off these features by just deleting ?emoji&timeline from the end of the URL.

Let me know if you run into any issues!

8 Likes

(As I took those screenshots I just realized that the popups are now too close to their triggering buttons and there’s some irregular padding… Whoops. Nothing like sharing screenshots to find problems in your work! But I just pushed a fix.)

3 Likes

Heya, just stopping by to say that this dashboard is great and I really like the styling.

I got tripped up by needing to paste the whole JSON blob too, which as a developer I found kind of unexpected compared to just needing the API token itself.

Perhaps you could check if the first character is an open bracket { and nudge the user in that case?

I read the “API Token” placeholder and my brain ignored the “JSON” bit so I was scratching my head when I saw no network calls in the browser dev tools haha

4 Likes

I love this dashboard, and use it heavily alongside the dashboard at Beeminder UI.

Question: As of a few days ago I can’t get the emojis to display in the top right corner. Was this a permanent design decision?

Edit: Never mind - I didn’t notice that the emoji were enabled by adding the URL parameter “emoji”.

3 Likes

very cool ! thanks for building (and sharing!)

2 Likes

I’m sorry about the confusion there!

I’m currently deep in a heavier update to the dashboard that will (hopefully) add some more functionality and will remove some of these outstanding paper cuts.

1 Like

Elegant design!

2 Likes