Skip to content

liao961120/draggableTimer

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

26 Commits
 
 
 
 
 
 

Repository files navigation

Interval Training Timer

A draggable interval timer written in vanilla JS, HTML and CSS (watch out for the beeps).

Demo

This project is inspired by intervaltimer.com and HTML5 drag and drop API. Special thanks to WebDevSimplified's YouTube video & code on building sortable drag & drop elements.

Touch Screen Usage

Since HTML5 drag and drop API does not support touch screens, it may be harder to build a timer with such devices. It is recommended to build a timer on the computer and use the app's share URL feature to access the timer you built. Here is an example.

Features

  • Flexible sorting of intervals (Drag and Drop API)
  • Automatically saves your customization (localStorage)
  • Share/re-access particular timers through URLs (URL query string)
  • Works without the internet (Service Worker)

Available Timers

Below are some ready-to-use timers (contributions wellcomed):

  1. Home Hiit workout (YouTube)