A small utility timer widget to be built using JavaScript ES2015 best practices. A simple stopwatch with multiple counters using Redux Architecture.
Sports usage aside, there are many businesses that requires precise measurements of time spent per client (eg: medical clinic, law offices, consultants). Each client require professionals to perform multiple sessions of work:
- A) Time spent WITH the client during visit such as face-to-face consultation, physical diagnosis, or simply gathering requirements.
- B) Time spent AFTER client visit such as paperwork filing, charting, prescription filling, or building cases for business processing.
- C) Coding practice to get better; because I care http://bit.ly/21a1xjO
Single point of entry <script>
implementation:
<script
type="text/javascript"
src="http://cdn.rawgit.com/kingstonfung/js_lap_timer/master/release/js_timer.min.js"
data-source-origin='http://cdn.rawgit.com/kingstonfung/js_lap_timer/master'
data-source-style='/release/js_timer.min.css'
data-toggle-button-selector='#awesomeTimer'
async>
</script>
src
: Direct reference to the min.js file.data-source-origin
: The path to the root directory where other assets are held. Leave blank""
if hosted locally.data-source-style
: Relative path to the stylesheet. This string concatenate itself ontodata-source-origin
to make up the full path.data-toggle-button-selector
: Query selector to the button that would toggle the visibility of this widget.async
: Recommended, so that the loading and execution of this script does not block the rest of your page's rendering.
Simple initialze the timer, and then call Kingular.clientTimer.getStatusJSONString();
to get lap times.
- LocalStorage (lap times) does not expire. If I pull the JSON out of the timer next weekend, I still get the same timer data from the last run.
- Unit tests
- Complete the documentations
Free for all?