Build a timer.newhaven.io app

[sukima]

This issue is here to track the creation of a timer app and deploy it to timer.newhaven.io.

Requirements

• Fullscreen mode (or full browser window)
• Show time elapsed in large font
• Allow a setting screen to adjust times
• Have three states: green, yellow, and red
• Green is when the timer is below the yellow threshold
• Yellow is when the timer has reached or passed the yellow threshold but below the end time
• Red is when the timer has ended
• In the red state the clock continues to count upwards
• When the clock changes state the background should flash for a second
• Have a reset timer button
• Have a pause/resume button

[danbernier]

Suggestion: rather than a modal, or at least in addition to it, support a URL parameter. And, the yellow should probably start when the speaker has gone through, say, 85 or 90% of the time, and the red when they've gone through 95%. Meaning, it should be proportional to the time requested. ~ This message was made with 100% thumbs.

…

On Wed, Apr 25, 2018, 19:45 Devin Weaver ***@***.***> wrote: This issue is here to track the creation of a timer app and deploy it to timer.newhaven.io. Requirements - Fullscreen mode (or full browser window) - Show time left in large font - Auto start with default timing - Allow a setting modal to adjust times - Have three states: green, yellow, and red - Green is when the timer is above the yellow threshold - Yellow is when the timer is less then the yellow threshold but above the end time - Red is when the timer has ended - In the red state the clock counts upwards instead of counting down - When the clock changes state the background should flash for a second — You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub <#63>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AAAzFRlLLAjc1zUr6irF1e1JLWeM49YOks5tsQqUgaJpZM4TkULR> .

[sukima]

Yup. Agreed. I have some prototype code already. I also have a crude looking examole to work off of:

https://mach-25.com/~mheney/speechtimer.html

Need another day and I’ll have something to show.

[sukima]

Just for clarity the motivation for this feature when we discussed the idea of time keeping during speeches and lightning-talks. One of the road blocks was that having a dedicated time keeper (like ToastMasters does) was added overhead and the event coordinator already has way too many hats to wear. The compromise was to have a laptop pointing at the speaker with a timer on it.

This expanded to two key goals:

• Not only display the time but also highlight when a time limit is approaching (maybe by way of flashing the screen a different color)
• Ease of access so that the event coordinator only needs to go to one website and it is done

The solutions I've proposed was based on using the ToastMasters timer process but in an app that is automated since ToastMasters already has a battle tested process that fist the exact needs we have.

I also propose running the app on our website domain (i.e. timer.newhaven.io) so that the event coordinators never have to really think about it as it is a tool built into the organization's own utility belt.

I took a few hours last night and spiked on a SPA (yes Ember 😛 ) that fits these requirements and am pleased with the result. I plan on making the MVP production ready in the next day (or two). Will post a demo then.

[jhirbour]

Could we just use a pomodoro timer? (in the interest of not writing/maintain more code)
IE: https://tomato-timer.com/ or something similar?

For reference: last night I mentioned that TED has one. It turns out it's purposefully accessible to the public (so speakers can practice with it). I've asked around at TED and it's fine for us to use it if we want.

• https://countdown.ted.com/

[danbernier]

Ooh, the TED one is pretty nice - it has great design, colors and fonts and so on; it's the one that's used on the TED stage when they give their talks. That'd be pretty swanky for us to use.

[sukima]

An event coordinator can do what ever they wish. I am curious however, the concern over having hacks contributed and collected. The nature of this group is to encourage contributions and new ideas. Some might be more interested in a timer written in python others might like Backbone.js. In any case the actual result is easy to change. Maybe the URL redirects to another timer later. Or people like the current one and start copying it for their own websites. In any case the cost seems minimal to me.

Part of the reason things happen is volunteers are motivated to try things on their own. But having non-invasive ideas squashed demotivates contributors. I can speak to my feelings that if linking a sub-domain to a SPA I wrote in Ember is too much for this group or that other people do it better then I would rather write my own and not give back to NewHaven.io.

In a business I can understand the need to really thing about the impacts but having a community project that we want people to feel free to experiment with does require more ship-it then it does bike-shedding or monday-night-quarterbacking.

That my opinion anyway.

[jhirbour]

@sukima my concerns were more about adding more infrastructure. DNS/host names/heroku apps etc. I'll about everyone contributing, I was suggesting that we don't reinvent the wheel and/or setup something we'll need to maintain when there's already alternatives on the internet.

[jnimety]

@sukima I understand your response but I think it's a bit misplaced. @danbernier and @jhirbour were just throwing out alternatives as part of a discussion.

[ZachBeta]

I tried to state my perspective in the slack conversation about this...

Ultimately if it's not a big person-hours opportunity cost, doesn't complicate our infrastructure, and it brings joy to make it, go for it! 👍

There are alternatives that could work, and we can have a home rolled one too that's got some fun flavor. I'm decidedly in favor of fun flavor.

guy_fieri_flavor_town.gif

[sukima]

http://countdown.ted.com/ is public. I personally not a huge fan as I like the ToastMaster system better but this one is complete and satisfies all the requirements. (I'll continue to play with mine for personal reasons).

To move this ticket into prod we can use http://countdown.ted.com/ by means of a DNS entry or a simple redirect (the later is likely easier to maintain).

I suggest adding this page to the website (timer.html):

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Timer</title>
  <meta http-equiv="refresh" content="0;url=http://countdown.ted.com/">
</head>
<body>
  <p><a href="http://countdown.ted.com/">Redirect</a></p>
</body>
</html>

[sukima]

I have built a timer app that functions like a full screen timer but uses the Toastmasters timing process. It is query-params driven.

• Source: https://github.com/sukima/timer-app
• Production: https://timer.tritarget.org

We are left with two questions for this ticket:

1. Which timer does the NH.io community wish to use?
2. Will the timer be a DNS entry or an http-equiv redirect?

[treznick]

@sukima why don't we put that first question to a vote in the slack?
as for the second question. DNS or redirecting seem a bit much. It's an awkward experience to get redirected, and I don't think we want to host a timer here. Let's instead just put a link on the new site under a speaker resources section