Unreviewed, revert r284181
[WebKit-https.git] / Websites / webkit.org / demos / calendar / Calendar.html
1 <!doctype HTML>
2 <!-- Application Cache Manifest -->
3 <html manifest="Calendar.manifest">
4
5 <head>
6
7 <!-- Application Name -->
8 <meta name="application-name" content="Offline Calendar">
9
10 <!-- Application Icon -->
11 <link rel="icon" href="surfin-safari.icns" sizes="32x32 128x128 512x512">
12
13 <!-- Normal favicon -->
14 <link rel="icon" href="favicon.ico" sizes="16x16">
15
16 <title>Calendar</title>
17 <link rel="stylesheet" type="text/css" href="Calendar.css">
18 <script type="text/javascript" src="LocationImage.js"></script>
19 <script type="text/javascript" src="Utilities.js"></script>
20 <script type="text/javascript" src="Calendar.js"></script>
21 </head>
22
23 <body onload="pageLoaded()">
24
25 <div id="sidePanel">
26     <h3>CALENDARS</h3>
27     <ul id="calendarList">
28         <li class="selected" onclick="calendarSelected(event)">
29             <span class="colorIndicator home"></span><input type="checkbox" id="home" onchange="calendarClicked(event)">Home
30         </li>
31         <li onclick="calendarSelected(event)">
32             <span class="colorIndicator work"></span><input type="checkbox" id="work" onchange="calendarClicked(event)">Work
33         </li>
34     </ul>
35     
36     <div id="dividerBar"></div>
37     
38     <div id="searchArea">
39         <input type="search" id="searchField" results="0" incremental="1" placeholder="" value="" onsearch="searchForEvent(this.value)">
40         <ul id="searchResults">
41         </ul>
42     </div>
43 </div>
44
45 <div id="eventOverlay">
46     <div id="details">
47         <div id="eventTitle" contenteditable="true"></div>
48         <dl>
49             <dt>location</dt>
50             <dd>
51                 <span id="eventDisclosureArrow" onclick="toggleArrow()"></span>
52                 <div id="eventLocation" contentEditable="true" onfocus="hideMapDisclosureArrow()" onblur="requestMapImage()"></div>
53                 <div id="map"></div>
54             </dd>
55             <dt>from</dt>
56             <dd id="eventFrom">
57                 <span id="eventFromDate"></span>
58                 <span id="eventFromHours" class="time" contentEditable="true">00</span>:<span id="eventFromMinutes" class="time" contentEditable="true">00</span>
59             </dd>
60             <dt>to</dt>
61             <dd id="eventTo">
62                 <span id="eventToDate"></span>
63                 <span id="eventToHours" class="time" contentEditable="true">00</span>:<span id="eventToMinutes" class="time" contentEditable="true">00</span>
64             </dd>
65             <dt style="line-height: 23px;">calendar</dt>
66             <dd>
67                 <select id="eventCalendarType">
68                     <option value="home">Home</option>
69                     <option value="work">Work</option>
70                 </select>
71             </dd>
72             <dt>details</dt>
73             <dd id="eventDetails" contentEditable="true"></dd>
74         </dl>
75         <input type="button" value="Done" onclick="eventDetailsDismissed()">
76     </div>
77 </div>
78
79 <div id="gridView">
80
81     <h2>
82         <span id="monthTitle"></span>
83         <span id="onlineStatusIcon"></span>
84     </h2>
85     
86     <div class="navButtonGroup">
87         <input class="navButton" type="button" onclick="previousMonth()" value="&lt;">
88         <input class="navButton" type="button" onclick="nextMonth()" value="&gt;">    
89     </div>
90     
91     <div id="daysHeader">
92         <span class="day title">Sunday</span>
93         <span class="day title">Monday</span>
94         <span class="day title">Tuesday</span>
95         <span class="day title">Wednesday</span>
96         <span class="day title">Thursday</span>
97         <span class="day title">Friday</span>
98         <span class="day title">Saturday</span>
99     </div>
100     
101     <div id="daysGrid">
102     </div>
103
104 </div>
105
106 </body>
107 </html>