all repos — gears @ 967824f82ca8755ec97df199f8485b424fd31ad6

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

cal/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
57
58
59
60
61
62
63
64
65
66
 
<!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 - Calendar</title>
    <link rel="shortcut icon" href="../favicon.ico">
    <link rel="stylesheet" type="text/css" href="../style.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="../node_modules/moment-timezone/builds/moment-timezone-with-data.min.js" type="application/javascript"></script>
    <script src="../setOption.js" type="application/javascript"></script>
    <script src="../cal.js" type="application/javascript"></script>
  </head>
  <body>
    <div id="header">
      <h1>Planetary Gears</h1>
      <h2>a lightweight world clock webapp</h2>
    </div>
    <div id="shroud"></div>

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

    <div id="calendarSpacer"></div>


    <div id="bigWrapper">

      <div id="controls">
        <div id="calendarSelector">
          <input type="button" id="monthly" name="monthly" value="Monthly" class="activeButton">
          <input type="button" id="yearly" name="yearly" value="Yearly">
        </div>
        <div id="monthSelector">
          <select id="monthSelect">
            <option value="1">January</option>
            <option value="2">February</option>
            <option value="3">March</option>
            <option value="4">April</option>
            <option value="5">May</option>
            <option value="6">June</option>
            <option value="7">July</option>
            <option value="8">August</option>
            <option value="9">September</option>
            <option value="10">October</option>
            <option value="11">November</option>
            <option value="12">December</option>
          </select>

          <input type="number" id="yearSelect" name="yearSelect" min="1970" max="2070">
        </div>
        <div id="yearSelector">
          <input type="number" id="wholeYearSelect" name="wholeYearSelect min="1970" max="2070">
        </div>
      </div>

      <div id="calendarWrapper">
      </div>
    </div>      
  </body>
</html>