all repos — gears @ 61e0bde68844def30d816f7294f0f8fa004a6b71

lightweight world clock webapp with jquery, moment-timezone, and fuse.js

timer/index.html (raw)

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="description" content="Planetary Gears is a lightweight world clock web application in jQuery, fuse.js, and moment-timezone" />
    <meta name="HandheldFriendly" content="True" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Planetary Gears - Timer/Stopwatch</title>
    <link rel="shortcut icon" href="/favicon.ico">
    <link rel="stylesheet" type="text/css" href="/min.css">
    <script src="/node_modules/jquery/dist/jquery.min.js" type="application/javascript"></script>
    <script src="/node_modules/moment/min/moment.min.js" type="application/javascript"></script>
    <script src="/setOption.js" type="application/javascript"></script>
    <script src="/timer.js" type="application/javascript"></script>

  </head>
  <body>
    <div id="header">
      <h1>Planetary Gears</h1>
      <h2>a lightweight world clock webapp</h2>
    </div>

    <nav>
        <a href="/">world clock</a><a class="activeButton" href="/timer/">timer/stopwatch</a><a href="/cal/">calendar</a>
    </nav>

    <div id="timerContainer">
      <div id="controls">
        <form id="timerType">
          <input type="button" id="timerMode" name="timerMode" value="Timer" class="activeButton">
          <input type="button" id="stopwatchMode" name="stopwatchMode" value="Stopwatch">
        </form>
      </div>
      <h3><time>00:00:00</time></h3>
      <div id="timerControls">
        <div id="timerSetup">
           <label for="timerHours">set&rarr; </label><input type="number" id="timerHours" name="timerHours" min="0" max="23" placeholder="00">:<input type="number" id="timerMinutes" name="timerMinutes" min="0" max="59" placeholder="00">:<input type="number" id="timerSeconds" name="timerSeconds" min="0" max="59" placeholder="00"><br/>
          <input type="checkbox" id="chimeBool" name="chimeBool" checked>
          <label for="chimeBool">Play chime when time up</label>
        </div>
        <div id="lapContainer">
          <input type="button" id="addLap" name="lapButton" value="Lap">
          <label for="addLap">0</label>
        </div>
        <input type="button" id="startStop" name="startStop" value="Start">
        <input type="button" id="timerPause" name="timerPause" value="Pause" disabled>
      </div>
    </div>
    <audio id="chime">
      <source src="/chime.ogg" type="audio/ogg" preload="auto"/>
      <source src="/chime.mp3" type="audio.mpeg" preload="auto/>
    </audio>

  </body>
</html>