|
3
|
1 <roundcube:object name="doctype" value="html5" />
|
|
|
2 <html>
|
|
|
3 <head>
|
|
|
4 <title><roundcube:object name="pagetitle" /></title>
|
|
|
5 <roundcube:include file="/includes/links.html" />
|
|
|
6 <!--[if lte IE 7]><link rel="stylesheet" type="text/css" href="/this/iehacks.css" /><![endif]-->
|
|
|
7 </head>
|
|
|
8 <roundcube:if condition="env:extwin" /><body class="calendarmain extwin"><roundcube:else /><body class="calendarmain"><roundcube:endif />
|
|
|
9
|
|
|
10 <roundcube:include file="/includes/header.html" />
|
|
|
11
|
|
|
12 <h1 class="voice"><roundcube:label name="calendar.calendar" /></h1>
|
|
|
13
|
|
|
14 <div id="mainscreen">
|
|
|
15 <div id="calendarsidebar">
|
|
|
16 <h2 id="aria-label-toolbar" class="voice"><roundcube:label name="arialabeltoolbar" /></h2>
|
|
|
17 <div id="calendartoolbar" class="toolbar" role="toolbar" aria-labelledby="aria-label-toolbar">
|
|
|
18 <roundcube:button command="addevent" type="link" class="button addevent disabled" classAct="button addevent" classSel="button addevent pressed" label="calendar.new_event" title="calendar.new_event" />
|
|
|
19 <roundcube:button command="print" type="link" class="button print disabled" classAct="button print" classSel="button print pressed" label="calendar.print" title="calendar.printtitle" />
|
|
|
20 <roundcube:button command="events-import" type="link" class="button import disabled" classAct="button import" classSel="button import pressed" label="import" title="calendar.importevents" />
|
|
|
21 <roundcube:button command="export" type="link" class="button export disabled" classAct="button export" classSel="button export pressed" label="calendar.export" title="calendar.exporttitle" />
|
|
|
22 <roundcube:container name="toolbar" id="calendartoolbar" />
|
|
|
23 </div>
|
|
|
24
|
|
|
25 <h2 id="aria-label-minical" class="voice"><roundcube:label name="calendar.arialabelminical" /></h2>
|
|
|
26 <div id="datepicker" class="uibox" role="presentation"></div>
|
|
|
27
|
|
|
28 <div id="calendars" class="uibox listbox" style="visibility:hidden" role="navigation" aria-labelledby="aria-label-calendarlist">
|
|
|
29 <h2 class="boxtitle" id="aria-label-calendarlist"><roundcube:label name="calendar.calendars" />
|
|
|
30 <a href="#calendars" class="iconbutton search" title="<roundcube:label name='calendar.findcalendars' />" tabindex="0"><roundcube:label name='calendar.findcalendars' /></a>
|
|
|
31 </h2>
|
|
|
32 <div class="listsearchbox">
|
|
|
33 <div class="searchbox" role="search" aria-labelledby="aria-label-calsearchform" aria-controls="calendarslist">
|
|
|
34 <h3 id="aria-label-calsearchform" class="voice"><roundcube:label name="calendar.arialabelcalsearchform" /></h3>
|
|
|
35 <label for="calendarlistsearch" class="voice"><roundcube:label name="calendar.searchterms" /></label>
|
|
|
36 <input type="text" name="q" id="calendarlistsearch" placeholder="<roundcube:label name='calendar.findcalendars' />" />
|
|
|
37 <a class="iconbutton searchicon"></a>
|
|
|
38 <roundcube:button type="link" command="reset-listsearch" id="calendarlistsearch-reset" class="iconbutton reset" title="resetsearch" label="resetsearch" />
|
|
|
39 </div>
|
|
|
40 </div>
|
|
|
41 <div class="scroller withfooter">
|
|
|
42 <roundcube:object name="plugin.calendar_list" id="calendarslist" class="treelist listing" />
|
|
|
43 </div>
|
|
|
44 <div class="boxfooter">
|
|
|
45 <roundcube:button command="calendar-create" type="link" title="calendar.createcalendar" class="listbutton add disabled" classAct="listbutton add" innerClass="inner" content="+" /><roundcube:button name="calendaroptionslink" id="calendaroptionsmenulink" type="link" title="moreactions" class="listbutton groupactions" onclick="return UI.toggle_popup('calendaroptionsmenu', event, { above:true })" innerClass="inner" label="calendar.calendaractions" aria-haspopup="true" aria-expanded="false" aria-owns="calendaroptionsmenu-menu" />
|
|
|
46 </div>
|
|
|
47 </div>
|
|
|
48 </div>
|
|
|
49
|
|
|
50 <div id="quicksearchbar" class="searchbox" role="search" aria-labelledby="aria-label-searchform">
|
|
|
51 <h2 id="aria-label-searchform" class="voice"><roundcube:label name="calendar.arialabelsearchform" /></h2>
|
|
|
52 <label for="quicksearchbox" class="voice"><roundcube:label name="calendar.arialabelquicksearchbox" /></label>
|
|
|
53 <roundcube:object name="plugin.searchform" id="quicksearchbox" />
|
|
|
54 <a id="searchmenulink" class="iconbutton searchoptions" tabindex="-1"> </a>
|
|
|
55 <roundcube:button type="link" command="reset-search" id="searchreset" class="iconbutton reset" title="resetsearch" label="resetsearch" />
|
|
|
56 </div>
|
|
|
57
|
|
|
58 <h2 id="aria-label-calendarview" class="voice"><roundcube:label name="calendar.arialabelcalendarview" /></h2>
|
|
|
59 <div id="calendar" role="main" aria-labelledby="aria-label-calendarview">
|
|
|
60 <roundcube:object name="plugin.angenda_options" class="boxfooter" id="agendaoptions" />
|
|
|
61 </div>
|
|
|
62 </div>
|
|
|
63
|
|
|
64 <div id="timezonedisplay"><roundcube:var name="env:timezone" /></div>
|
|
|
65
|
|
|
66 <roundcube:object name="message" id="messagestack" />
|
|
|
67
|
|
|
68 <div id="calendaroptionsmenu" class="popupmenu" aria-hidden="true">
|
|
|
69 <h3 id="aria-label-calendaroptions" class="voice"><roundcube:label name="calendar.calendaractions" /></h3>
|
|
|
70 <ul id="calendaroptionsmenu-menu" class="toolbarmenu" role="menu" aria-labelledby="aria-label-calendaroptions">
|
|
|
71 <li role="menuitem"><roundcube:button type="link" command="calendar-edit" label="calendar.edit" classAct="active" /></li>
|
|
|
72 <li role="menuitem"><roundcube:button type="link" command="calendar-delete" label="delete" classAct="active" /></li>
|
|
|
73 <roundcube:if condition="env:calendar_driver == 'kolab'" />
|
|
|
74 <li role="menuitem"><roundcube:button type="link" command="calendar-remove" label="calendar.removelist" classAct="active" /></li>
|
|
|
75 <roundcube:endif />
|
|
|
76 <li role="menuitem"><roundcube:button type="link" command="calendar-showurl" label="calendar.showurl" classAct="active" /></li>
|
|
|
77 <roundcube:if condition="env:calendar_driver == 'kolab'" />
|
|
|
78 <li role="menuitem"><roundcube:button type="link" command="folders" task="settings" label="managefolders" classAct="active" /></li>
|
|
|
79 <roundcube:endif />
|
|
|
80 </ul>
|
|
|
81 </div>
|
|
|
82
|
|
|
83 <div id="eventshow" class="uidialog eventdialog" aria-hidden="true">
|
|
|
84 <h1 id="event-title">Event Title</h1>
|
|
|
85 <div id="event-status-badge"><span></span></div>
|
|
|
86 <div class="event-section" id="event-location">Location</div>
|
|
|
87 <div class="event-section" id="event-date">From-To</div>
|
|
|
88 <div class="event-section" id="event-description">
|
|
|
89 <div class="event-text"></div>
|
|
|
90 </div>
|
|
|
91 <div class="event-section event-attendees" id="event-attendees">
|
|
|
92 <div class="event-text"></div>
|
|
|
93 </div>
|
|
|
94 <div class="spacer"> </div>
|
|
|
95 <div class="event-line" id="event-url">
|
|
|
96 <label><roundcube:label name="calendar.url" /></label>
|
|
|
97 <span class="event-text"></span>
|
|
|
98 </div>
|
|
|
99 <div class="event-line" id="event-repeat">
|
|
|
100 <label><roundcube:label name="calendar.repeat" /></label>
|
|
|
101 <span class="event-text"></span>
|
|
|
102 </div>
|
|
|
103 <div class="event-line" id="event-alarm">
|
|
|
104 <label><roundcube:label name="calendar.alarms" /></label>
|
|
|
105 <span class="event-text"></span>
|
|
|
106 </div>
|
|
|
107 <div class="event-line" id="event-partstat">
|
|
|
108 <label><roundcube:label name="calendar.mystatus" /></label>
|
|
|
109 <span class="changersvp" role="button" tabindex="0" title="<roundcube:label name='calendar.changepartstat' />">
|
|
|
110 <span class="event-text"></span>
|
|
|
111 <a class="iconbutton edit"><roundcube:label name='calendar.changepartstat' /></a>
|
|
|
112 </span>
|
|
|
113 </div>
|
|
|
114 <div class="event-line" id="event-calendar">
|
|
|
115 <label><roundcube:label name="calendar.calendar" /></label>
|
|
|
116 <span class="event-text">Default</span>
|
|
|
117 </div>
|
|
|
118 <div class="event-line" id="event-category">
|
|
|
119 <label><roundcube:label name="calendar.category" /></label>
|
|
|
120 <span class="event-text"></span>
|
|
|
121 </div>
|
|
|
122 <div class="event-line" id="event-status">
|
|
|
123 <label><roundcube:label name="calendar.status" /></label>
|
|
|
124 <span class="event-text"></span>
|
|
|
125 </div>
|
|
|
126 <div class="event-line" id="event-free-busy">
|
|
|
127 <label><roundcube:label name="calendar.freebusy" /></label>
|
|
|
128 <span class="event-text"></span>
|
|
|
129 </div>
|
|
|
130 <div class="event-line" id="event-priority">
|
|
|
131 <label><roundcube:label name="calendar.priority" /></label>
|
|
|
132 <span class="event-text"></span>
|
|
|
133 </div>
|
|
|
134 <!--
|
|
|
135 <div class="event-line" id="event-sensitivity">
|
|
|
136 <label><roundcube:label name="calendar.sensitivity" /></label>
|
|
|
137 <span class="event-text"></span>
|
|
|
138 </div>
|
|
|
139 -->
|
|
|
140 <div class="event-line" id="event-created-changed">
|
|
|
141 <label><roundcube:label name="calendar.created" /></label>
|
|
|
142 <span class="event-text event-created"></span>
|
|
|
143 <label><roundcube:label name="calendar.changed" /></label>
|
|
|
144 <span class="event-text event-changed"></span>
|
|
|
145 </div>
|
|
|
146 <div class="event-line" id="event-rsvp-comment">
|
|
|
147 <label><roundcube:label name="calendar.rsvpcomment" /></label>
|
|
|
148 <span class="event-text"></span>
|
|
|
149 </div>
|
|
|
150 <div class="event-section" id="event-links">
|
|
|
151 <label><roundcube:label name="calendar.links" /></label>
|
|
|
152 <span class="event-text"></span>
|
|
|
153 </div>
|
|
|
154 <div class="event-section" id="event-attachments">
|
|
|
155 <div class="event-text"></div>
|
|
|
156 </div>
|
|
|
157
|
|
|
158 <roundcube:object name="plugin.event_rsvp_buttons" id="event-rsvp" class="event-dialog-message" style="display:none" />
|
|
|
159 </div>
|
|
|
160
|
|
|
161 <div id="eventoptionsmenu" class="popupmenu" aria-hidden="true">
|
|
|
162 <h3 id="aria-label-eventoptions" class="voice"><roundcube:label name="calendar.eventoptions" /></h3>
|
|
|
163 <ul id="eventoptionsmenu-menu" class="toolbarmenu" role="menu" aria-labelledby="aria-label-eventoptions">
|
|
|
164 <li role="menuitem"><roundcube:button type="link" command="event-download" label="download" classAct="active" /></li>
|
|
|
165 <li role="menuitem"><roundcube:button type="link" command="event-sendbymail" label="send" classAct="active" /></li>
|
|
|
166 <li role="menuitem"><roundcube:button type="link" command="event-copy" label="copy" classAct="active" /></li>
|
|
|
167 <roundcube:if condition="env:calendar_driver == 'kolab' && config:kolab_bonnie_api" />
|
|
|
168 <li role="menuitem"><roundcube:button type="link" command="event-history" label="calendar.eventhistory" classAct="active" /></li>
|
|
|
169 <roundcube:endif />
|
|
|
170 </ul>
|
|
|
171 </div>
|
|
|
172
|
|
|
173 <div id="eventdiff" class="uidialog eventdialog" aria-hidden="true">
|
|
|
174 <h1 class="event-title">Event Title</h1>
|
|
|
175 <h1 class="event-title-new event-text-new"></h1>
|
|
|
176 <div class="event-section event-date"></div>
|
|
|
177 <div class="event-section event-location">
|
|
|
178 <h5 class="label"><roundcube:label name="calendar.location" /></h5>
|
|
|
179 <div class="event-text-old"></div>
|
|
|
180 <div class="event-text-new"></div>
|
|
|
181 </div>
|
|
|
182 <div class="event-section event-description">
|
|
|
183 <h5 class="label"><roundcube:label name="calendar.description" /></h5>
|
|
|
184 <div class="event-text-diff" style="white-space:pre-wrap"></div>
|
|
|
185 <div class="event-text-old"></div>
|
|
|
186 <div class="event-text-new"></div>
|
|
|
187 </div>
|
|
|
188 <div class="event-section event-url">
|
|
|
189 <h5 class="label"><roundcube:label name="calendar.url" /></h5>
|
|
|
190 <div class="event-text-old"></div>
|
|
|
191 <div class="event-text-new"></div>
|
|
|
192 </div>
|
|
|
193 <div class="event-section event-recurrence">
|
|
|
194 <h5 class="label"><roundcube:label name="calendar.repeat" /></h5>
|
|
|
195 <div class="event-text-old"></div>
|
|
|
196 <div class="event-text-new"></div>
|
|
|
197 </div>
|
|
|
198 <div class="event-section event-alarms">
|
|
|
199 <h5 class="label"><roundcube:label name="calendar.alarms" /><span class="index"></span></h5>
|
|
|
200 <div class="event-text-old"></div>
|
|
|
201 <div class="event-text-new"></div>
|
|
|
202 </div>
|
|
|
203 <div class="event-line event-start">
|
|
|
204 <label><roundcube:label name="calendar.start" /></label>
|
|
|
205 <span class="event-text-old"></span> ⇢
|
|
|
206 <span class="event-text-new"></span>
|
|
|
207 </div>
|
|
|
208 <div class="event-line event-end">
|
|
|
209 <label><roundcube:label name="calendar.end" /></label>
|
|
|
210 <span class="event-text-old"></span> ⇢
|
|
|
211 <span class="event-text-new"></span>
|
|
|
212 </div>
|
|
|
213 <div class="event-line event-attendees">
|
|
|
214 <label><roundcube:label name="calendar.tabattendees" /><span class="index"></span></label>
|
|
|
215 <span class="event-text-old"></span> ⇢
|
|
|
216 <span class="event-text-new"></span>
|
|
|
217 </div>
|
|
|
218 <div class="event-line event-calendar">
|
|
|
219 <label><roundcube:label name="calendar.calendar" /></label>
|
|
|
220 <span class="event-text-old"></span> ⇢
|
|
|
221 <span class="event-text-new"></span>
|
|
|
222 </div>
|
|
|
223 <div class="event-line event-categories">
|
|
|
224 <label><roundcube:label name="calendar.category" /></label>
|
|
|
225 <span class="event-text-old"></span> ⇢
|
|
|
226 <span class="event-text-new"></span>
|
|
|
227 </div>
|
|
|
228 <div class="event-line event-status">
|
|
|
229 <label><roundcube:label name="calendar.status" /></label>
|
|
|
230 <span class="event-text-old"></span> ⇢
|
|
|
231 <span class="event-text-new"></span>
|
|
|
232 </div>
|
|
|
233 <div class="event-line event-free_busy">
|
|
|
234 <label><roundcube:label name="calendar.freebusy" /></label>
|
|
|
235 <span class="event-text-old"></span> ⇢
|
|
|
236 <span class="event-text-new"></span>
|
|
|
237 </div>
|
|
|
238 <div class="event-line event-priority">
|
|
|
239 <label><roundcube:label name="calendar.priority" /></label>
|
|
|
240 <span class="event-text-old"></span> ⇢
|
|
|
241 <span class="event-text-new"></span>
|
|
|
242 </div>
|
|
|
243 <div class="event-line event-sensitivity">
|
|
|
244 <label><roundcube:label name="calendar.sensitivity" /></label>
|
|
|
245 <span class="event-text-old"></span> ⇢
|
|
|
246 <span class="event-text-new"></span>
|
|
|
247 </div>
|
|
|
248 <div class="event-section event-attachments">
|
|
|
249 <label><roundcube:label name="attachments" /><span class="index"></span></label>
|
|
|
250 <div class="event-text-old"></div>
|
|
|
251 <div class="event-text-new"></div>
|
|
|
252 </div>
|
|
|
253 </div>
|
|
|
254
|
|
|
255 <roundcube:include file="/templates/eventedit.html" />
|
|
|
256
|
|
|
257 <div id="eventresourcesdialog" class="uidialog" aria-hidden="true">
|
|
|
258 <div id="resource-dialog-left">
|
|
|
259 <div id="resource-selection" class="uibox listbox" role="navigation" aria-labelledby="aria-label-resourceselection">
|
|
|
260 <h2 class="voice" id="aria-label-resourceselection"><roundcube:label name="calendar.arialabelresourceselection" /></h2>
|
|
|
261 <div id="resourcequicksearch">
|
|
|
262 <div class="searchbox" role="search" aria-labelledby="aria-label-resourcesearchform" aria-controls="resources-list">
|
|
|
263 <h3 id="aria-label-resourcesearchform" class="voice"><roundcube:label name="calendar.arialabelresourcesearchform" /></h3>
|
|
|
264 <label for="resourcesearchbox" class="voice"><roundcube:label name="calendar.searchterms" /></label>
|
|
|
265 <roundcube:object name="plugin.resources_searchform" id="resourcesearchbox" />
|
|
|
266 <a id="resourcesearchmenulink" class="iconbutton searchoptions"> </a>
|
|
|
267 <roundcube:button type="link" command="reset-resource-search" id="resourcesearchreset" class="iconbutton reset" title="resetsearch" label="resetsearch" />
|
|
|
268 </div>
|
|
|
269 </div>
|
|
|
270 <div class="scroller">
|
|
|
271 <roundcube:object name="plugin.resources_list" id="resources-list" class="listing treelist" />
|
|
|
272 </div>
|
|
|
273 </div>
|
|
|
274 </div>
|
|
|
275
|
|
|
276 <div id="resource-dialog-right">
|
|
|
277 <div id="resource-info" class="uibox contentbox" role="region" aria-labelledby="aria-label-resourcedetails">
|
|
|
278 <h2 class="boxtitle" id="aria-label-resourcedetails"><roundcube:label name="calendar.resourcedetails" /></h2>
|
|
|
279 <div class="scroller">
|
|
|
280 <roundcube:object name="plugin.resource_info" id="resource-details" class="propform" aria-live="polite" aria-relevant="text" aria-atomic="true" />
|
|
|
281 </div>
|
|
|
282 </div>
|
|
|
283
|
|
|
284 <div id="resource-availability" class="uibox contentbox" role="region" aria-labelledby="aria-label-resourceavailability">
|
|
|
285 <h2 class="boxtitle" id="aria-label-resourceavailability"><roundcube:label name="calendar.resourceavailability" /></h2>
|
|
|
286 <roundcube:object name="plugin.resource_calendar" id="resource-freebusy-calendar" />
|
|
|
287 <div class="boxpagenav">
|
|
|
288 <roundcube:button name="resource-cal-prev" id="resource-calendar-prev" type="link" class="icon prevpage" title="calendar.prevslot" label="calendar.prevweek" />
|
|
|
289 <roundcube:button name="resource-cal-next" id="resource-calendar-next" type="link" class="icon nextpage" title="calendar.nextslot" label="calendar.nextweek" />
|
|
|
290 </div>
|
|
|
291 </div>
|
|
|
292 </div>
|
|
|
293 </div>
|
|
|
294
|
|
|
295 <div id="eventfreebusy" class="uidialog" aria-hidden="true">
|
|
|
296 <roundcube:object name="plugin.attendees_freebusy_table" id="attendees-freebusy-table" cellpadding="0" />
|
|
|
297
|
|
|
298 <div class="schedule-options">
|
|
|
299
|
|
|
300 <div class="schedule-buttons">
|
|
|
301 <button id="shedule-freebusy-prev" title="<roundcube:label name='previouspage' />">◄</button><button id="shedule-freebusy-next" title="<roundcube:label name='nextpage' />">►</button>
|
|
|
302 </div>
|
|
|
303 </div>
|
|
|
304
|
|
|
305 <div style="float:left; width:28em">
|
|
|
306 <div class="form-section">
|
|
|
307 <label for="schedule-startdate"><roundcube:label name="calendar.start" /></label>
|
|
|
308 <input type="text" name="startdate" size="11" id="schedule-startdate" disabled="true" />
|
|
|
309 <input type="text" name="starttime" size="6" id="schedule-starttime" disabled="true" />
|
|
|
310 </div>
|
|
|
311 <div class="form-section">
|
|
|
312 <label for="schedule-enddate"><roundcube:label name="calendar.end" /></label>
|
|
|
313 <input type="text" name="enddate" size="11" id="schedule-enddate" disabled="true" />
|
|
|
314 <input type="text" name="endtime" size="6" id="schedule-endtime" disabled="true" />
|
|
|
315 </div>
|
|
|
316 </div>
|
|
|
317 <div style="float:left">
|
|
|
318 <div class="schedule-find-buttons">
|
|
|
319 <button id="shedule-find-prev">◄ <roundcube:label name="calendar.prevslot" /></button>
|
|
|
320 <button id="shedule-find-next"><roundcube:label name="calendar.nextslot" /> ►</button>
|
|
|
321 </div>
|
|
|
322 <div class="schedule-options">
|
|
|
323 <label><input type="checkbox" id="schedule-freebusy-workinghours" value="1" /><roundcube:label name="calendar.onlyworkinghours" /></label>
|
|
|
324 </div>
|
|
|
325 </div>
|
|
|
326 <br style="clear:both;" />
|
|
|
327
|
|
|
328 <roundcube:include file="/templates/freebusylegend.html" />
|
|
|
329 <div class="attendees-list">
|
|
|
330 <span class="attendee organizer"><roundcube:label name="calendar.roleorganizer" /></span>
|
|
|
331 <span class="attendee req-participant"><roundcube:label name="calendar.rolerequired" /></span>
|
|
|
332 <span class="attendee opt-participant"><roundcube:label name="calendar.roleoptional" /></span>
|
|
|
333 <span class="attendee non-participant"><roundcube:label name="calendar.rolenonparticipant" /></span>
|
|
|
334 <span class="attendee chair"><roundcube:label name="calendar.rolechair" /></span>
|
|
|
335 </div>
|
|
|
336 </div>
|
|
|
337
|
|
|
338 <div id="eventhistory" class="uidialog" aria-hidden="true">
|
|
|
339 <roundcube:object name="plugin.object_changelog_table" id="event-changelog-table" class="records-table changelog-table" />
|
|
|
340 <div class="compare-button"><input type="button" class="button" value="↳ <roundcube:label name='libkolab.compare' />" /></div>
|
|
|
341 </div>
|
|
|
342
|
|
|
343 <div id="calendarform" class="uidialog" aria-hidden="true">
|
|
|
344 <roundcube:label name="loading" />
|
|
|
345 </div>
|
|
|
346
|
|
|
347 <div id="eventsimport" class="uidialog">
|
|
|
348 <roundcube:object name="plugin.events_import_form" id="events-import-form" uploadFieldSize="30" />
|
|
|
349 </div>
|
|
|
350
|
|
|
351 <div id="eventsexport" class="uidialog">
|
|
|
352 <roundcube:object name="plugin.events_export_form" id="events-export-form" />
|
|
|
353 </div>
|
|
|
354
|
|
|
355 <div id="calendarurlbox" class="uidialog">
|
|
|
356 <p><roundcube:label name="calendar.showurldescription" /></p>
|
|
|
357 <textarea id="calfeedurl" rows="2" readonly="readonly"></textarea>
|
|
|
358 <div id="calendarcaldavurl" style="display:none">
|
|
|
359 <p><roundcube:label name="calendar.caldavurldescription" html="yes" /></p>
|
|
|
360 <textarea id="caldavurl" rows="2" readonly="readonly"></textarea>
|
|
|
361 </div>
|
|
|
362 </div>
|
|
|
363
|
|
|
364 <roundcube:object name="plugin.calendar_css" />
|
|
|
365
|
|
|
366 <script type="text/javascript">
|
|
|
367
|
|
|
368 // UI startup
|
|
|
369 var UI = new rcube_mail_ui();
|
|
|
370
|
|
|
371 $(document).ready(function(e){
|
|
|
372 new calendarview_splitter({ id:'calsidebarsplitter', p1:'#calendarsidebar', p2:'#calendar',
|
|
|
373 orientation:'v', relative:true, start:280, min:260, size:12, offset:0 });
|
|
|
374
|
|
|
375 new rcube_splitter({ id:'calresourceviewsplitter', p1:'#resource-dialog-left', p2:'#resource-dialog-right',
|
|
|
376 orientation:'v', relative:true, start:380, min:220, size:10, offset:-3 }).init();
|
|
|
377
|
|
|
378 // animation to unfold list search box
|
|
|
379 $('#calendars .boxtitle a.search').click(function(e){
|
|
|
380 var title = $('#calendars .boxtitle'),
|
|
|
381 box = $('#calendars .listsearchbox'),
|
|
|
382 dir = box.is(':visible') ? -1 : 1;
|
|
|
383
|
|
|
384 if (!rcube_event.is_keyboard(e))
|
|
|
385 $(this).blur();
|
|
|
386
|
|
|
387 box.slideToggle({
|
|
|
388 duration: 160,
|
|
|
389 progress: function(animation, progress) {
|
|
|
390 if (dir < 0) progress = 1 - progress;
|
|
|
391 $('#calendars .scroller').css('top', (title.outerHeight() + 34 * progress) + 'px');
|
|
|
392 },
|
|
|
393 complete: function() {
|
|
|
394 box.toggleClass('expanded');
|
|
|
395 if (box.is(':visible')) {
|
|
|
396 box.find('input[type=text]').focus();
|
|
|
397 }
|
|
|
398 else {
|
|
|
399 $('#calendarlistsearch-reset').click();
|
|
|
400 }
|
|
|
401 // TODO: save state in localStorage
|
|
|
402 }
|
|
|
403 });
|
|
|
404
|
|
|
405 return false;
|
|
|
406 });
|
|
|
407
|
|
|
408 });
|
|
|
409
|
|
|
410
|
|
|
411 /**
|
|
|
412 * Extended rcube_splitter class that entirely collapses the calendar sidebar
|
|
|
413 */
|
|
|
414 function calendarview_splitter(p)
|
|
|
415 {
|
|
|
416 this.collapsed = false;
|
|
|
417 this.dragging = false;
|
|
|
418 this.threshold = 80;
|
|
|
419 this.lastpos = -1;
|
|
|
420 this._lastpos = -1;
|
|
|
421 this._min = p.min;
|
|
|
422
|
|
|
423 var me = this;
|
|
|
424 p.callback = function(e){
|
|
|
425 if (me.lastpos != me._lastpos) {
|
|
|
426 me.dragging = true;
|
|
|
427 setTimeout(function(){ me.dragging = false; }, 50);
|
|
|
428 me._lastpos = me.lastpos;
|
|
|
429 }
|
|
|
430 };
|
|
|
431
|
|
|
432 // extend base class
|
|
|
433 p.min = 20;
|
|
|
434 rcube_splitter.call(this, p);
|
|
|
435
|
|
|
436 // @override
|
|
|
437 this.resize = function()
|
|
|
438 {
|
|
|
439 if (this.pos < this.threshold) {
|
|
|
440 if (!this.collapsed)
|
|
|
441 this.collapse();
|
|
|
442 }
|
|
|
443 else if (this.pos < this._min && this.pos > this._min / 2) {
|
|
|
444 if (this.collapsed)
|
|
|
445 this.expand();
|
|
|
446 }
|
|
|
447 else if (this.pos >= this._min) {
|
|
|
448 this.p1.css('width', Math.floor(this.pos - this.p1pos.left - this.halfsize) + 'px');
|
|
|
449 this.p2.css('left', Math.ceil(this.pos + this.halfsize) + 'px');
|
|
|
450 this.handle.css('left', Math.round(this.pos - this.halfsize + this.offset + 3)+'px');
|
|
|
451 if (bw.ie) {
|
|
|
452 var new_width = parseInt(this.parent.outerWidth(), 10) - parseInt(this.p2.css('left'), 10) ;
|
|
|
453 this.p2.css('width', (new_width > 0 ? new_width : 0) + 'px');
|
|
|
454 }
|
|
|
455
|
|
|
456 this.p2.resize();
|
|
|
457 this.p1.resize();
|
|
|
458 this.lastpos = this.pos;
|
|
|
459
|
|
|
460 if (this._lastpos == -1)
|
|
|
461 this._lastpos = this.pos;
|
|
|
462
|
|
|
463 // also resize iframe covers
|
|
|
464 if (this.drag_active) {
|
|
|
465 $('iframe').each(function(i, elem) {
|
|
|
466 var pos = $(this).offset();
|
|
|
467 $('#iframe-splitter-fix-'+i).css({ top: pos.top+'px', left: pos.left+'px', width:elem.offsetWidth+'px', height: elem.offsetHeight+'px' });
|
|
|
468 });
|
|
|
469 }
|
|
|
470
|
|
|
471 if (typeof this.render == 'function')
|
|
|
472 this.render(this);
|
|
|
473 }
|
|
|
474 }
|
|
|
475
|
|
|
476 this.collapse = function(animated)
|
|
|
477 {
|
|
|
478 var me = this, time = 250;
|
|
|
479 if (animated) {
|
|
|
480 this.p1.animate({ left:'0px' }, time, function(){ $(this).hide(); });
|
|
|
481 this.p2.animate({ left:this.p.size + 'px' }, time, function(){ $(this).resize(); });
|
|
|
482 this.handle.animate({ left:'3px'}, time, function(){ $(this).addClass('sidebarclosed') });
|
|
|
483 }
|
|
|
484 else {
|
|
|
485 this.p1.css('left', 0).hide();
|
|
|
486 this.p2.css('left', this.p.size + 'px');
|
|
|
487 this.handle.css('left', '3px').addClass('sidebarclosed');
|
|
|
488 this.p2.resize();
|
|
|
489 }
|
|
|
490
|
|
|
491 // stop dragging
|
|
|
492 if (this.drag_active) {
|
|
|
493 this.drag_active = false;
|
|
|
494 $(document).unbind('.'+this.id);
|
|
|
495 $('div.iframe-splitter-fix').remove();
|
|
|
496 }
|
|
|
497
|
|
|
498 this.pos = 10;
|
|
|
499 this.collapsed = true;
|
|
|
500 this.set_cookie();
|
|
|
501 }
|
|
|
502
|
|
|
503 this.expand = function()
|
|
|
504 {
|
|
|
505 var me = this, time = 250;
|
|
|
506 this.handle.removeClass('sidebarclosed');
|
|
|
507 this.pos = this.lastpos > 0 ? this.lastpos : this._min;
|
|
|
508 this.p1pos.left = 10;
|
|
|
509 this.p1.show().animate({ left:'10px', width:(this.pos - this.p1pos.left - this.halfsize) + 'px' }, time);
|
|
|
510 this.p2.animate({ left:(this.pos + this.halfsize) + 'px' }, time, function(){ me.resize(); });
|
|
|
511 this.handle.animate({ left:(this.pos - this.halfsize + this.offset + 3) + 'px' }, time);
|
|
|
512
|
|
|
513 this.collapsed = false;
|
|
|
514 this.set_cookie();
|
|
|
515 }
|
|
|
516
|
|
|
517 this.init();
|
|
|
518
|
|
|
519 var me = this;
|
|
|
520 this.handle.bind('click', function(e){
|
|
|
521 if (!me.collapsed && !me.dragging)
|
|
|
522 me.collapse(true);
|
|
|
523 else if (!me.dragging)
|
|
|
524 me.expand();
|
|
|
525 });
|
|
|
526 }
|
|
|
527
|
|
|
528 </script>
|
|
|
529
|
|
|
530 </body>
|
|
|
531 </html>
|
