<!-- 

	All content on this website (including text, images, source
	code and any other original works), unless otherwise noted,
	is licensed under a Creative Commons License.
	
	http://creativecommons.org/licenses/by-nc-sa/2.5/
	
	Copyright (C) Open-Xchange Inc., 2006-2011
	Mail: info@open-xchange.com 
	
	@author Jan Finsel <jan.finsel@open-xchange.com>

 -->

<div xmlns:ox="http://localhost/html/dtd/ox.dtd" id="calendar_new_query" style="width:100%;height:100%">
	<div ox:align="bottom" ox:size="1.6em" id="bottomcontent" style="text-align:center">
		<table cellpadding="0" cellspacing="0" border="0" style="padding-left:20px;width:100%;height:100%" class="cpbottom-color">
            <colgroup width="25%" span="4" align="left"/> 
			<tr>
				<td>
					<table cellpadding="0" cellspacing="0" border="0">
						<tr>
							<td style="width:16px; height:16px;"><div style="width:10px;height:10px" class="cnavailreserved"></div></td>
							<td style="padding7px" ox:i18n="">reserved</td>
						</tr>
					</table>
				</td>
				<td>
					<table cellpadding="0" cellspacing="0" border="0">
						<tr>
							<td style="width:16px; height:16px;"><div style="width:10px;height:10px" class="cnavailoccupied"></div></td>
							<td style="padding7px" ox:i18n="">absent on business</td>
						</tr>
					</table>
				</td>
				<td>
					<table cellpadding="0" cellspacing="0" border="0">
						<tr>
							<td style="width:16px; height:16px;"><div style="width:10px;height:10px" class="cnavailfree"></div></td>
							<td style="padding7px" ox:i18n="">free</td>
						</tr>
					</table>
				</td>
				<td>
					<table cellpadding="0" cellspacing="0" border="0">
						<tr>
							<td style="width:16px; height:16px;"><div style="width:10px;height:10px" class="cnavailtemporary"></div></td>
							<td style="padding7px" ox:i18n="">temporary</td>
						</tr>
					</table>
				</td>
			</tr>
		</table>
	</div>
	<div ox:align="top" ox:size="6.3em" class="ZIndex5">
		<table cellpadding="0" cellspacing="0" border="0" style="height:100%; width:100%; margin-top: 0.2em;">
			<tr>
				<td valign="top">
					<table cellpadding="0" cellspacing="0" border="0" class="inputGridTable" style="width:auto">
						<tr>
							<td ox:i18n="" class="padding7px">Date:</td>
							<td class="padding7px"><div style="overflow:auto"><input type="text" id="calendar_new_availablity_date_input" style="width: 10em;" onchange="cnavail_availability_changed()"/></div></td>
							<td class="padding7px" style="width:25px">
								<img src="themes/default/img/calendar/datepicker.gif" alt="" id="calendar_new_availability_mini_calendar_image" onclick="calendar_new_availability_showMiniStart();" class="datepicker" />
								<div id="calendar_new_availability_mini_start" class="miniCalendar popup-window popupBorder popupBackground" style="display:none">		
									<div class="miniCalendarTop popupHeaderBackground font-style-headline">
										<table cellpadding="0" cellspacing="0" border="0" style="text-align: center;">															
											<tr>
												<td style="text-align: left; width: 5%;cursor:pointer;">
													<img src="themes/default/img/arrows/arrow_darkgrey_left.gif" alt="" onClick="calendar_new_availability_mini_calendar.back()" style="margin-right:5px" />
												</td>																		
												<td style="cursor:pointer; text-align: left; width: 50%;">
													<div id="calendar_new_availability_miniCalendarHeader">
													  	<table cellpadding="0" cellspacing="0" border="0">
															<tr>
													  			<td style="width:8em"><div id="calendar_new_availability_header_month"></div></td>
													  			<td style="width:4em"><div id="calendar_new_availability_header_year"></div></td>
															</tr>
														</table>
													</div>																
														</td>																	
												<td style="text-align: right; width: 5%;cursor:pointer;">
												  <img src="themes/default/img/arrows/arrow_darkgrey_right.gif" alt="" onClick="calendar_new_availability_mini_calendar.next()" style="margin-left:5px"/>
												</td>																
											</tr>
										</table>														
									</div>
									<div id="calendar_new_availability_miniCalendarContent" class="miniCalendarContainer"></div>
									<div class="miniCalendarBottom">
										<ox:button ox:i18n="" class="blueground" onclick="calendar_new_availability_closeMiniCalendar();" style="width:8em">Cancel</ox:button>
									</div>
								</div>
							</td>
							<td class="padding7px" ox:i18n="">From:</td>
							<td class="padding7px" id="calendar_new_availability_fromtime"></td>
							<td class="padding7px" ox:i18n="">Until:</td>
							<td class="padding7px" id="calendar_new_availability_tilltime"></td>
							<td class="padding7px"><ox:button ox:i18n="" class="whiteground" onclick="calendar_new_availability_checkAppointmentTime();" style="float: left;">Check</ox:button></td>
							<td class="padding7px"><ox:button ox:i18n="" class="whiteground" onclick="calendar_new_availability_use_Appointment();" style="float: left;">Use for appointment</ox:button></td>			
						</tr>
					</table>
					<table cellpadding="0" cellspacing="0" border="0" class="inputGridTable" style="width:auto">
						<tr>
							<td class="padding7px" ox:i18n="">Check for:</td>
							<td class="labelleft"><input type="checkbox" class="noborder" id="calendar_new_availablity_showressource" onclick="cnavail_checkClicked('RESSOURCE');" />&#xa0;<span ox:i18n="">Resources</span></td>
							<td class="labelleft"><input type="checkbox" class="noborder" id="calendar_new_availablity_showparticipants" onclick="cnavail_checkClicked('PARTICIPANTS');" />&#xa0;<span ox:i18n="">Participants</span></td>
							<td class="labelleft"><input type="checkbox" class="noborder" id="calendar_new_availablity_resolvegroups" onclick="cnavail_checkClicked('GROUPS');" />&#xa0;<span ox:i18n="">Show Group Members</span></td>	
							<td class="labelleft"><input type="checkbox" class="noborder" id="calendar_new_availablity_showexternal" onclick="cnavail_checkClicked('EXTERNAL');" />&#xa0;<span ox:i18n="">Show External Participants</span></td>	
						</tr>
					</table>
				</td>
			</tr>				
			<tr>
				<td style="width:100%; height:2em; border-top:1px solid" valign="middle" class="border-color-design">
					<table width="100%" cellpadding="0" cellspacing="0" border="0" style="text-align:center; height:2em;">
						<tr>
						    <td style="width:17em; border-right:1px solid" class="border-color-design">
						        <div style="width:17em; position:relative; top:.8em; overflow:hidden">
						            <span class="padding7px" ox:i18n="">Participants</span>
						        </div>
						    </td>
							<td align="center">
								<div width="200px">
									<table cellpadding="0" cellspacing="0" border="0">
										<tr>
											<td style="width:20px;cursor:pointer" onClick="cn_avail_gotoNextDay(-1)"><img src="themes/default/img/arrows/arrow_darkgrey_left.gif" alt=""  style="margin-right:5px"/></td>
											<td style="width:160px" align="center"><div id="calendar_new_availablity_date">&#xa0;</div></td>
											<td style="width:20px;cursor:pointer" onClick="cn_avail_gotoNextDay(1)"><img src="themes/default/img/arrows/arrow_darkgrey_right.gif" alt=""  style="margin-left:5px"/></td>
										</tr>
									</table>
								</div>
							</td>
						</tr>
					</table>
				</td>
			</tr>
		</table>
	</div>
	<div ox:align="top" ox:size="1.6em" ox:border="0px 0px 1px 0px" style="border-bottom: 1px solid" class="border-color-design">
		<div ox:align="left" ox:size="17em" ox:border="1px 1px 0px 0px" style="border-right:1px solid; overflow:hidden" class="border-color-design">&#xa0;</div>	
		<div id="cnavail_timeline_scroller" ox:align="stretch" style="overflow:hidden;">
			<table cellpadding="0" cellspacing="0" border="0">
				<tr>
					<td><div class="cnavailtimeline">0:00</div></td>
					<td><div class="cnavailtimeline">1:00</div></td>
					<td><div class="cnavailtimeline">2:00</div></td>
					<td><div class="cnavailtimeline">3:00</div></td>
					<td><div class="cnavailtimeline">4:00</div></td>
					<td><div class="cnavailtimeline">5:00</div></td>
					<td><div class="cnavailtimeline">6:00</div></td>
					<td><div class="cnavailtimeline">7:00</div></td>
					<td><div class="cnavailtimeline">8:00</div></td>
					<td><div class="cnavailtimeline">9:00</div></td>
					<td><div class="cnavailtimeline">10:00</div></td>
					<td><div class="cnavailtimeline">11:00</div></td>
					<td><div class="cnavailtimeline">12:00</div></td>
					<td><div class="cnavailtimeline">13:00</div></td>
					<td><div class="cnavailtimeline">14:00</div></td>
					<td><div class="cnavailtimeline">15:00</div></td>
					<td><div class="cnavailtimeline">16:00</div></td>
					<td><div class="cnavailtimeline">17:00</div></td>
					<td><div class="cnavailtimeline">18:00</div></td>
					<td><div class="cnavailtimeline">19:00</div></td>
					<td><div class="cnavailtimeline">20:00</div></td>
					<td><div class="cnavailtimeline">21:00</div></td>
					<td><div class="cnavailtimeline">22:00</div></td>
					<td><div class="cnavailtimeline">23:00</div></td>
					<td><div class="cnavailtimeline">0:00</div></td>
					<td><div class="cnavailtimeline" style="width:5000px"></div></td>								
				</tr>	
			</table>
		</div>
	</div>
	<div ox:align="stretch">
		<div ox:align="left" ox:size="17em" ox:border="0px 1px 0px 0px" style="border-right:1px solid; overflow:auto;" class="border-color-design">
			<div style="height:100%;width:100%;overflow:hidden" id="cnavail_participants_scroller">	
				<table cellpadding="0" cellspacing="0" border="0" style="width:100%;">
					<tbody id="cnavail_participants_names">
					</tbody>
				</table>
				<div id="cnavail_participants_names_spacer"></div>
			</div>
		</div>
		<div ox:align="stretch" class="offTimeBackground" style="overflow:auto" onscroll="cnavail_scroll();" id="cnavail_scroller">
			<table cellpadding="0" cellspacing="0" border="0">
				<tbody id="cnavail_freebusy_content">
				</tbody>
			</table>
		</div>
	</div>
	<table style="display:none;">
		<tr id="cnavail_template_name">
			<td valign="middle" style="display:none"><div class="cnavailname border-color-design"><img src="themes/default/img/calendar/user.gif" alt="" align="absmiddle"/></div></td>
			<td valign="middle" style="display:none"><div class="cnavailname border-color-design"><img src="themes/default/img/calendar/group.gif" alt="" align="absmiddle"/></div></td>
			<td valign="middle" style="display:none"><div class="cnavailname border-color-design"><img src="themes/default/img/calendar/ressourcen.gif" alt="" align="absmiddle"/></div></td>
			<td valign="middle" style="display:none"><div class="cnavailname border-color-design" style="padding-left:25px"><img src="themes/default/img/calendar/user.gif" alt="" align="absmiddle"/></div></td>
			<td valign="middle" style="display:none"><div class="cnavailname border-color-design"><img src="themes/default/img/calendar/user_extern.gif" alt="" align="absmiddle"/></div></td>
			<td valign="middle" style="width:100%; white-space:nowrap"><div class="cnavailtext border-color-design">.</div></td>
		</tr>
		<tr>
			<td id="cnavail_template_id">
			     <div class="cnavailchecktime border-color-design availabilityAppointmentBackground"></div>
			</td>
		</tr>
		<tr id="cnavail_template_line">
			<td><div class="cnavailoutofcheck border-color-design offTimeBackground" style="position:relative"></div></td>
			<td><div class="cnavailoutofcheck border-color-design offTimeBackground"></div></td>
			<td><div class="cnavailoutofcheck border-color-design offTimeBackground"></div></td>
			<td><div class="cnavailoutofcheck border-color-design offTimeBackground"></div></td>
			<td><div class="cnavailoutofcheck border-color-design offTimeBackground"></div></td>
			<td><div class="cnavailoutofcheck border-color-design offTimeBackground"></div></td>
			<td><div class="cnavailoutofcheck border-color-design offTimeBackground"></div></td>
			<td><div class="cnavailoutofcheck border-color-design offTimeBackground"></div></td>
			<td><div class="cnavailoutofcheck border-color-design offTimeBackground"></div></td>
			<td><div class="cnavailoutofcheck border-color-design offTimeBackground"></div></td>
			<td><div class="cnavailoutofcheck border-color-design offTimeBackground"></div></td>
			<td><div class="cnavailoutofcheck border-color-design offTimeBackground"></div></td>
			<td><div class="cnavailoutofcheck border-color-design offTimeBackground"></div></td>
			<td><div class="cnavailoutofcheck border-color-design offTimeBackground"></div></td>
			<td><div class="cnavailoutofcheck border-color-design offTimeBackground"></div></td>
			<td><div class="cnavailoutofcheck border-color-design offTimeBackground"></div></td>
			<td><div class="cnavailoutofcheck border-color-design offTimeBackground"></div></td>
			<td><div class="cnavailoutofcheck border-color-design offTimeBackground"></div></td>
			<td><div class="cnavailoutofcheck border-color-design offTimeBackground"></div></td>
			<td><div class="cnavailoutofcheck border-color-design offTimeBackground"></div></td>
			<td><div class="cnavailoutofcheck border-color-design offTimeBackground"></div></td>
			<td><div class="cnavailoutofcheck border-color-design offTimeBackground"></div></td>
			<td><div class="cnavailoutofcheck border-color-design offTimeBackground"></div></td>
			<td><div class="cnavailoutofcheck border-color-design offTimeBackground"></div></td>
		</tr>
		<tr>
			<td>
				<div id="cnavail_freebusy_template" style="position:absolute; top:7px; height:10px;"></div>
				<table cellpadding="0" cellspacing="0" border="0" id="cnavail_checktime_template" style="position:absolute">
				</table>
			</td>
		</tr>				
	</table>
</div>