
<script type="text/javascript">
	var chatLanguage = new ilChatLanguage();

	chatLanguage.addTxt("show", '{CHAT_SHOW}');
	chatLanguage.addTxt("hide", '{CHAT_HIDE}');
	chatLanguage.addTxt("open", '{CHAT_OPEN}');
	chatLanguage.addTxt("empty_message", '{CHAT_EMPTY_MESSAGE}');
	chatLanguage.addTxt("recording", '{CHAT_RECORDING_RUNNING}');
	chatLanguage.addTxt("recording_stopped", '{CHAT_RECORDING_STOPPED}');
	chatLanguage.addTxt("chat_recording_already__running", '{CHAT_RECORDING_ALREADY_RUNNING}');
	chatLanguage.addTxt("chat_recording_running", '{CHAT_RECORDING_RUNNING}');
	chatLanguage.addTxt("confirm_invite_user", '{CHAT_CONFIRM_USER_INVITE}');
	chatLanguage.addTxt("confirm_kick_user", '{CHAT_CONFIRM_KICK_USER}');
	chatLanguage.addTxt("confirm_delete_private_room", '{CHAT_CONFIRM_DELETE_PRIVATE_ROOM}');
	chatLanguage.addTxt("address", '{CHAT_ADDRESS}');
	chatLanguage.addTxt("whisper", '{CHAT_WHISPER}');
	chatLanguage.addTxt("kick", '{CHAT_KICK}');
	chatLanguage.addTxt("unkick", '{CHAT_UNKICK}');
	chatLanguage.addTxt("profile", '{CHAT_PROFILE}');
	chatLanguage.addTxt("cancel", '{CANCEL}');
	chatLanguage.addTxt("no_title_given", '{CHAT_NO_TITLE_GIVEN}');
	
	chatLanguage.addTxt('online_users_title', '{ONLINE_USERS_TITLE}');
	chatLanguage.addTxt('active_users_title', '{ACTIVE_USERS_TITLE}');
	chatLanguage.addTxt('rooms_list_title', '{ROOM_LIST_TITLE}');
	
	chatLanguage.addTxt('add_to_bookmark', '{ADD_TO_BOOKMARK}');
	chatLanguage.addTxt('add_to_addressbook', '{ADD_TO_ADDRESSBOOK}');
	chatLanguage.addTxt('empty', '{EMPTY_ROOM}');
	chatLanguage.addTxt('delete', '{DELETE}');
	chatLanguage.addTxt('confirm_delete_private_room', '{CONFIRM_DELETE_PRIVATE_ROOM}');
	chatLanguage.addTxt('invite', '{INVITE}');
	chatLanguage.addTxt('disinvite', '{DISINVITE}');
	
	chatLanguage.addTxt('hidden', '{CHAT_USER_HIDDEN}');
	chatLanguage.addTxt('visible', '{CHAT_USER_VISIBLE}');

	var ilRooms = new ilRoomTable();
	var ilActiveUsersRoom = new ilChatActiveUsersRoom();
	var ilOnlineUsers = new ilChatOnlineUsers();

	ilAddOnLoad(
		function ()
		{
			ilRooms.render(document.getElementById('left_col'));
			ilActiveUsersRoom.render(document.getElementById('left_col'));
			ilOnlineUsers.render(document.getElementById('left_col'));
			return;
		}
	);
	
	var chatOnlineUsers = new ilChatUserList('online_users', 'userlist', 'online_users_list');
	var chatActiveUsers = new ilChatUserList('active_users', 'userlist', 'active_users_list');
	var chatRoomList = new ilChatUserList('room_list', 'roomlist', 'rooms_list');
	var il_chat_async_handler = new ilChatController('{ONLINE_USERS_REFRESH_LINK}','{ACTIVE_USERS_REFRESH_LINK}', '{CURRENT_ROOM_REFRESH_LINK}');
	var il_chat_message_handler = false;

	il_chat_async_handler.setBaseUrl('{CHAT_BASE_URL_TEMPLATE}');
	il_chat_async_handler.baseRefId = '{BASE_REF_ID}';
	il_chat_async_handler.baseRoomId = '{BASE_ROOM_ID}';
	
	il_chat_async_handler.setBaseChatserverAddress('{CHATSERVER_ADDRESS}');

</script>
<!-- END js_chat_init -->

<div class="ilFrame">
	<div class="ilFrameH">
		<div class="ilFrameTL">
			<div class="ilFrameTR">
				{MAINMENU}<!-- BEGIN sr_focus -->
					<script type="text/javascript">ilAddOnLoad(ilScreenReaderFocus); var il_sr_opt = true;</script>
					<!-- END sr_focus -->
					<div class="ilBelowMainMenu">
							<!-- BEGIN tree_mode -->
							<a {TREE_ACC_KEY} class="ilTreeView" href="{LINK_MODE}" target="{TARGET_TREE}" id="imgtree"><img src="{IMG_TREE}" alt="{ALT_TREE}" title="{ALT_TREE}" border="0" /></a>
							<!-- END tree_mode -->
					</div>
			</div>
		</div>
	</div>
	<div class="ilFrameBL">
		<div class="ilFrameBR">
			<div style="padding-left:2px;">{STATUSLINE}</div>

			<div class="il_HeaderOuter">
				<div class="il_Header">
					<div class="il_HeaderInner">
						<h1 class="il_Header" style="font-size: 140%"><img id="headerimage" border="0" src="./templates/default/images/icon_chat_b.gif" title="Icon Chat" alt="Icon Chat" style="vertical-align: middle;"/>&nbsp;
						<a class="ilAccAnchor" name="il_mhead_t_focus" id="ilChatTitle">{TITLE}</a></h1>
						<!-- BEGIN h_description --><div class="il_Description">{H_DESCRIPTION}</div><!-- END h_description -->
					</div>
					<!-- BEGIN tree_icons -->
					<div class="il_TreeIcons" style="float:right;">
						<!-- BEGIN top -->
						<a style="display:none;" class="{CLASS_TOP}" href="{LINK_TOP}" <!-- BEGIN target_top -->target="{TARGET_TOP}"<!-- END target_top -->
							id="imgtop"><img src="{IMG_TOP}" border="0" <!-- BEGIN alt_top --> alt="{ALT_TOP}" title="{ALT_TOP}" <!-- END alt_top --> /></a>
						<!-- END top -->
						<!-- BEGIN mount_webfolder -->
						<!-- always show actions on item level -->
						<!-- <a class="{CLASS_MOUNT_WEBFOLDER}" href="{LINK_MOUNT_WEBFOLDER}" folder="{FOLDER_MOUNT_WEBFOLDER}" target="{TARGET_MOUNT_WEBFOLDER}"><img src="{IMG_MOUNT_WEBFOLDER}" title="{ALT_MOUNT_WEBFOLDER}" alt="{ALT_MOUNT_WEBFOLDER}" border="0"></a> -->
						<!-- END mount_webfolder -->
					</div>
					<!-- END tree_icons -->
					<div style="clear:both;"><!-- BEGIN stop_floating -->&nbsp;<!-- END stop_floating --></div>
					{TABS}
				</div>
			</div>

			<!-- BEGIN tabs_outer_start --><table class="ilTabContentOuter"><tr><td><!-- END tabs_outer_start -->
			<div style="clear:both;">{SUB_TABS}</div><span class="ilAccHidden"><a id="after_sub_tabs" name="after_sub_tabs"></a></span>
			<table class="il_ColumnLayout{COL_LAY_SKIN}" style="clear:both;">
				<tr>
					<!-- BEGIN left_columnt -->
					<td></td>
					<!-- END left_columnt -->
					<td>{MESSAGE}
						<!-- BEGIN add_commands -->
						<div style="text-align: right; padding-right:19px; margin-bottom: 5px;">{SELECT_OBJTYPE_REPOS}</div>
						<!-- END add_commands -->
						<!-- BEGIN adm_view_components -->
						<div style="margin: 10px 0px 20px 0px;">{ADM_PANEL1}</div>
						<!-- END adm_view_components -->
					</td>
					<!-- BEGIN right_columnt -->
					<td></td>
					<!-- END right_columnt -->
				</tr>
				<tr>
					<!-- BEGIN left_column -->
					<td class="il_LeftColumn" id="il_left_col_td"><div id="il_left_col">{LEFT_CONTENT}</div></td>
					<!-- END left_column -->
					<td class="il_CenterColumn" id="il_CenterColumn">
					<!-- BEGIN adv_layout_init -->
						<div id="il_adv_center_col" style="width:800px; height:450px;"></div>
						<style type="text/css">
						<!--
						.yui-skin-sam .yui-layout .yui-layout-unit div.yui-layout-bd {
						    border: 1px solid #FFFFFF;
						    background-color: #FFFFFF;
						}
						-->
						</style>
						<script type="text/javascript">
						//Element Based Layout
						ilAddOnLoad(function() {
						var ltd = document.getElementById('il_left_col_td');
						ltd.style.width = 0;
						var layoutEl = new YAHOO.widget.Layout('il_adv_center_col', { units: [
								{ position: 'right', width: 200, scroll: false }, //Width required here
							{ position: 'left', width: 300, body: 'il_left_col', scroll: true }, //Width required here
							{ position: 'center', body: 'il_center_col', scroll: true }
						    ]
						});
						layoutEl.render();
						});
						</script>
						<!-- END adv_layout_init -->

						<div id="il_center_col">
							<table class="ilTabContentOuter">
								<tr>
									<td>

										<div id="left_col" style="width: 30%; float: left;">
											<!-- BEGIN add_chatroom -->
											<form action="#" method="post" target="_top" onsubmit="il_chat_async_handler.addPrivateRoom(); return false;">
												<p class="small" style="margin-left: 4px;">{TXT_ADD_PRIVATE_CHATROOM}:<br>
													<input id="il_chat_txt_add_private_room" class="small" type="text" name="room_name" value="{ROOM_NAME}" />
													<input class="submit" type="submit" name="cmd[addPrivateRoom]" value="{TXT_ADD}" />
												</p>
											</form>
											<!-- END add_chatroom -->
										</div><!-- end left col -->
										<div id="bottom_row" style="width: 65%; float: right;">
											<div id="il_message_container"></div>
											<iframe src="" id="server_iframe" name="server" style="width: 99%; height: 350px;"></iframe>
											<input class="submit" style="float: right; margin-right: 1%" type="button" value="{TXT_REFRESH}" onclick="document.getElementById('server_iframe').src = il_chat_async_handler.serverTarget"/>
											<p id="il_chat_notification">{MESSAGE}</p>

											  <table class="fullwidth_invisible" border="0">
											  <!-- BEGIN visible_chat_box -->
												  <tr>
													<td class="ilInvisibleBorder" valign="top">
														<form action="" target="_blank" name="txt_input" method="post" onsubmit="il_chat_async_handler.postMessage(); return false;" accept-charset="utf-8">

															<table class="std" border="0">
																<tr class="tblheader">
																	<th class="std chatlist_header" style="height: 20px" align="left" nowrap="nowrap" colspan="3">
																	{TXT_NEW_MESSAGE}
																	</th>
																</tr>
																<tr>
																	<td class="option_value" colspan="3" style="text-align:center">
																		<p style="display: none; text-align: center;" id="recipient_message"></p>
																		<input type="text" name="message" id="chat_post_message" size="50" maxlength="1800" />
																		<script language="JavaScript">
																		//<!--
																			if(document.txt_input.message.value!="") document.txt_input.message.focus();
																			else document.txt_input.message.focus();
																		//-->
																		</script>
																		<!-- BEGIN smilies_selector -->
																		<div style="width: 350px; text-align: center; display: none; margin: auto;" id="smiley_selector">
																			<!-- BEGIN smilies_element -->
																				<img style="padding: 10px " src="{SMILEY_SRC}" alt="{SMILEY_ALT}" onclick="insertSmiley('{SMILEY_CONTENT}', document.getElementById('chat_post_message'))"/>
																			<!-- END smilies_element -->
																		</div>
																		<!-- END smilies_selector -->
		
																		<div style="width: 380px; display: none; text-align: center; margin: auto; margin-top: 2px;" id="textformat_selector">
																			<table class="std" border="0">
																				<tr class="tblheader">
																					<th class="std chatlist_header" align="left" nowrap="nowrap" colspan="3">{TXT_TEXTFORMAT}</th>
																				</tr>
																				<tr>
																					<td class="option">{TXT_COLOR}</td>
																					<td class="option_value" colspan="2">{SELECT_COLOR}</td>
																				</tr>
																				<tr>
																					<td class="option">{TXT_TYPE}</td>
																					<td class="option_value" colspan="2"><!-- BEGIN FONT_TYPES --><input type="radio" name="type" value="{FONT_TYPE}" {TYPE_CHECKED} />&nbsp;{BL_TXT_TYPE}&nbsp;&nbsp;<!-- END FONT_TYPES --></td>
																				</tr>
																				<tr>
																					<td class="option">{TXT_FACE}</td>
																					<td class="option_value" colspan="2"><!-- BEGIN FONT_FACES --><input type="checkbox" name="face[]" value="{FONT_FACE}" {FACE_CHECKED} />&nbsp;{BL_TXT_FACE}&nbsp;&nbsp;<!-- END FONT_FACES --></td>
																				</tr>
																			</table>
																		</div>				
																	  </td>
																</tr>
																<tr class="tblfooter">
																	<td class="std" colspan="3" nowrap="nowrap">
																		<input style="float: left; margin: 2px;" class="submit" type="submit" name="cmd[input]" value="{TXT_SUBMIT_OK}" onclick="il_chat_async_handler.postMessage(); return false;"/>
																		<!-- BEGIN textformat_selector_button -->
																		<input type="button" class="submit" id="show_textformat_button" style="float: left; margin: 2px;" onclick="ilShowTextformatSelector(); return false;" value="{TXT_SHOW_TEXTFORMAT}"/>
																		<input type="button" class="submit" id="hide_textformat_button" style="float: left; display: none; margin: 2px;" onclick="ilHideTextformatSelector(); return false;" value="{TXT_HIDE_TEXTFORMAT}"/>
																		<!-- END textformat_selector_button -->
																		<!-- toggle hide/show smiley selector -->
																		<!-- BEGIN smilies_selector_button -->
																		<input type="button" class="submit" id="show_smilies_button" style="float: left; margin: 2px;" onclick="ilShowSmileySelector(); return false;" value="{TXT_SHOW_SMILIES}" />
																		<input type="button" class="submit" id="hide_smilies_button" style="float: left; display: none; margin: 2px;" onclick="ilHideSmileySelector(); return false;" style="width: auto;  display:none;" value="{TXT_HIDE_SMILIES}"/>
																		<!-- END smilies_selector_button -->
																		<!-- BEGIN chat_export -->
																		<input style="float: left; margin: 2px;" class="submit" type="button" onclick="ilExportChat()" name="cmd[export]" value="{TXT_HTML_EXPORT}" />
																		<!-- END chat_export -->
																	</td>
																</tr>
															</table>
														</form>
													</td>
													<!-- BEGIN moderator -->
													<td class="ilInvisibleBorder" valign="top">
														<form action="{MODERATOR_FORMACTION}" name="mod_input" method="post" target="{MODERATOR_TARGET}">
														<table class="std" border="0">
														  <tr class="tblheader">
															  <th class="std chatlist_header" align="left" nowrap="nowrap" colspan="2">
																{TXT_RECORDINGS}
															  </th>
															</tr>
															<tr id="start_record_1">
																<td class="option" style="font-size: 12px">{TXT_TITLE_START_RECORDING}</td>
																<td class="option_value"><input type="text" name="title" value="" /></td>
															</tr>
															<tr id="start_record_2" class="tblfooter">
																<td class="std" colspan="2">
																	<input class="submit" type="submit" name="cmd[startRecording]"  onclick="il_chat_async_handler.startRecording(); return false;" value="{TXT_SUBMIT_START_RECORDING}" />
																</td>
															</tr>
															<tr id="stop_record_1">
																<td class="option">{TXT_TITLE_STOP_RECORDING}</td>
																<td class="option_value">{VAL_TITLE_STOP_RECORDING}</td>
															</tr>
															<tr id="stop_record_2" class="tblfooter">
																<td class="std" colspan="2">
																	<input class="submit" type="submit" name="cmd[stopRecording]" value="{TXT_SUBMIT_STOP_RECORDING}" onclick="il_chat_async_handler.stopRecording();return false;"/>
																</td>
															</tr>
														</table>
														</form>
													</td>
													<!-- END moderator -->
					 							</tr>
												<!-- END visible_chat_box -->
												<tr>
													<td class="ilInvisibleBorder" valign="top" colspan="2"></td>
												</tr>
											</table>
										</div><!-- end bottom row -->

										<!-- BEGIN adm_view_components2 -->
										<div style="margin-bottom:10px;">{ADM_PANEL2}</div>
										<!-- END adm_view_components2 -->
									</td>
									<!-- BEGIN right_column -->
									<td class="il_RightColumn">{RIGHT_CONTENT}</td>
									<!-- END right_column -->
								</tr>
							</table>
						</div>
					</td>
				</tr>
			</table>

			<div class="ilPermaLink">{PRMLINK}</div>

			{FOOTER}
		</div>
	</div>
</div>

<div style="position: absolute; display: none;" id="il_chat_context">
	<div id="il_chat_context_userimage" style="display: none;"></div>
	<div id="il_chat_context_menu">
		<div id="il_chat_context_title_container">
			<div id="il_chat_context_title"></div>
			<div id="il_chat_context_close"><img src="./templates/default/images/cancel.gif" onclick="contextMenu.hide();"/></div>
			<br style="clear: both;"/>
		</div>
		
		<div id="il_chat_context_menuitems"></div>	
	</div>
</div>
