hansejc.github.io/intervals.html at master · HansEJC/hansejc.github.io · GitHub

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
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
<!DOCTYPE HTML>
<!-- Google Tag Manager -->
<script>(function (w, d, s, l, i) {
    w[l] = w[l] || []; w[l].push({
      'gtm.start':
        new Date().getTime(), event: 'gtm.js'
    }); var f = d.getElementsByTagName(s)[0],
      j = d.createElement(s), dl = l != 'dataLayer' ? '&l=' + l : ''; j.async = true; j.src =
        'https://www.googletagmanager.com/gtm.js?id=' + i + dl; f.parentNode.insertBefore(j, f);
  })(window, document, 'script', 'dataLayer', 'GTM-5QF2LGP');</script>
<!-- End Google Tag Manager -->
<html>

<head>
  <title>Intervals</title>
  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
  <meta name="description" content="Simple Intervals App." />
  <meta name="keywords" content="Intervals" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
  <link rel="stylesheet" href="css/main-style.css" />
  <script defer src="js/init.js"></script>
  <script defer src="js/intervals.js"></script>
</head>

<body class="left-sidebar">
  <!-- Google Tag Manager (noscript) -->
  <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-5QF2LGP" height="0" width="0"
      style="display:none;visibility:hidden"></iframe></noscript>
  <!-- End Google Tag Manager (noscript) -->
  <!-- Header -->
  <div id="header">
    <div class="topnav" id="myTopnav"></div>
    <!-- Logo -->
    <div id="logo">
      <h1><a href="#">Intervals</a></h1><br>
    </div>
  </div>
  <!-- Main -->
  <div id="main" class="container">
    <div class="row">
      <div>
        <!-- Content -->
        <div id="content">
          <div id="InputSelection">
            <div class="row">
              <section>
                <form onsubmit="return false;">
                  <label for="NumIntervals">Number of Intervals:<input type="number" id="NumIntervals" min=1
                      max=10></label>
                </form>
              </section>
            </div>
            <div class="row">
              <section>
                <label>Interval Times:</label>
                <form id="IntervalTimers" onsubmit="return false;">
                </form>
              </section>
              <section>
                <label>Interval Labels:</label>
                <form id="IntervalLabels" onsubmit="return false;">
                </form>
              </section>
            </div>
            <div class="timerlabel">
              <section>
                <form onsubmit="return false;">
                  <button id="Save" class="button">Save</button>
                </form>
              </section>
            </div>
            <div class="timerlabel">
              <section>
                <form onsubmit="return false;">
                  <button id="Share" class="button">Share</button>
                </form>
              </section>
            </div>
          </div>
          <div id="Intervals" style="display: none;">
            <div class="timerlabel">
              <section>
                <form onsubmit="return false;">
                  <button id="Start" class="button">Start</button>
                  <button id="Pause" class="button" style="display: none;">Pause</button>
                </form>
              </section>
              <section>
                <form">
                  <button id="Reset" class="button">Reset</button>
                  </form>
              </section>
            </div>
            <div class="timerlabel">
              <section>
                <form>
                  <label id="IntervalLabel">Press Start</label>
                </form>
              </section>
            </div>
            <div class="timerlabel">
              <section>
                <form onsubmit="return false;">
                  <span id="Timer" class="interval">0</span>
                </form>
              </section>
            </div>
            <div class="timerlabel">
              <progress class="prog"></progress>
            </div>
            <div class="timerlabel">
              <section>
                <form onsubmit="return false;">
                  <button id="Edit" class="button">Edit</button>
                </form>
              </section>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
  <div id="copyright">
    <ul>
      <li>&copy; Hans Juneby</li>
    </ul>
  </div>
</body>

</html>