<div class="panel_center" data-bind="initDom: domPreviewPane">
	<div class="message_header" data-bind="initDom: domMessageHeader">
		<div class="notice" data-bind="visible: visiblePicturesControl">
			<span class="item">
				<span data-i18n="MESSAGE/INFO_MESSAGE_BLOCKED" data-bind="i18n: 'text'"></span>
				<span class="link" data-i18n="MESSAGE/ACTION_SHOW_PICTURES" 
				   data-bind="i18n: 'text', click: showPictures, visible: visibleShowPicturesLink"></span>
			</span>
			<span class="item">
				<span class="link" data-i18n="MESSAGE/ACTION_ALWAYS_SHOW_PICTURE_THIS_SENDER" 
				   data-bind="i18n: 'text', click: alwaysShowPictures"></span>
			</span>
		</div>

		<div class="notice" data-bind="visible: visibleConfirmationControl">
			<span data-i18n="MESSAGE/INFO_SENDER_ASKED_NOTIFY" data-bind="i18n: 'text'"></span>
			<span class="link" data-i18n="MESSAGE/ACTION_NOTIFY_SENDER" data-bind="i18n: 'text', click: notifySender"></span>
		</div>

		<div class="notice" data-bind="visible: sesitivityText() !== ''">
			<span data-bind="text: sesitivityText"></span>
		</div>

		<div class="header_content clearfix">
			<div class="header_row" data-bind="visible: isCurrentMessage">
				<div class="toolbar">
					<span class="content">
						<a class="item new_window" href="javascript: void(0);" 
						   data-bind="click: openInNewWindow, visible: !singleMode()">
							<span class="icon" data-bind="i18n: 'title'" data-i18n="MESSAGE/ACTION_OPEN_IN_NEW_WINDOW"></span>
							<span class="text" data-bind="i18n: 'text'" data-i18n="MESSAGE/ACTION_OPEN_IN_NEW_WINDOW"></span>
						</a>
						<!--<span class="item" data-bind="command: prevMessageCommand, visible: singleMode">
							<span class="icon" data-bind="i18n: 'title'" data-i18n="MAILBOX/TOOL_PREV_MESSAGE"></span>
							<span class="text" data-bind="i18n: 'text'" data-i18n="MAILBOX/TOOL_PREV_MESSAGE"></span>
						</span>
						<span class="item" data-bind="command: nextMessageCommand, visible: singleMode">
							<span class="icon" data-bind="i18n: 'title'" data-i18n="MAILBOX/TOOL_NEXT_MESSAGE"></span>
							<span class="text" data-bind="i18n: 'text'" data-i18n="MAILBOX/TOOL_NEXT_MESSAGE"></span>
						</span>-->
						<span class="item reply" data-bind="command: replyCommand, visible: isVisibleReplyTool">
							<span class="icon" data-bind="i18n: 'title'" data-i18n="MAILBOX/TOOL_REPLY"></span>
							<span class="text" data-bind="i18n: 'text'" data-i18n="MAILBOX/TOOL_REPLY"></span>
						</span>
						<span class="item replyall" data-bind="command: replyAllCommand, visible: isVisibleReplyTool">
							<span class="icon" data-bind="i18n: 'title'" data-i18n="MAILBOX/TOOL_REPLY_TO_ALL"></span>
							<span class="text" data-bind="i18n: 'text'" data-i18n="MAILBOX/TOOL_REPLY_TO_ALL"></span>
						</span>
						<span class="item forward" data-bind="command: forwardCommand, visible: isVisibleForwardTool">
							<span class="icon" data-bind="i18n: 'title'" data-i18n="MAILBOX/TOOL_FORWARD"></span>
							<span class="text" data-bind="i18n: 'text'" data-i18n="MAILBOX/TOOL_FORWARD"></span>
						</span>
						<span class="item print" data-bind="command: printCommand">
							<span class="icon" data-bind="i18n: 'title'" data-i18n="MAILBOX/TOOL_PRINT"></span>
							<span class="text" data-bind="i18n: 'text'" data-i18n="MAILBOX/TOOL_PRINT"></span>
						</span>
						<span class="item save" data-bind="command: saveCommand">
							<span class="icon" data-bind="i18n: 'title'" data-i18n="MAILBOX/TOOL_SAVE"></span>
							<span class="text" data-bind="i18n: 'text'" data-i18n="MAILBOX/TOOL_SAVE"></span>
						</span>
						<!--<span class="item save control" data-bind="css: {'expand': visibleAddMenu()}, click: changeAddMenuVisibility">
							<span class="arrow"></span>
							<span class="dropdown">
								<span class="dropdown_helper">
									<span class="arrow"><span></span></span>
									<span class="dropdown_content">
										<span class="item" data-bind="i18n: 'text', command: saveCommand" data-i18n="MAILBOX/TOOL_SAVE"></span>
									</span>
								</span>
							</span>
						</span>-->
					</span>
				</div>
				
				<span class="link details_show" data-i18n="MESSAGE/ACTION_SHOW_DETAILS" 
					data-bind="i18n: 'title', click: showDetails, visible: !detailsVisible()"></span>
				<span class="link details_hide" data-i18n="MESSAGE/ACTION_HIDE_DETAILS"
					data-bind="i18n: 'title', click: hideDetails, visible: detailsVisible()"></span>
				
				<div class="message_info" data-bind="contactcard: {}, visible: !detailsVisible()">
					<div class="message_info_line">
						<span class="from control" data-bind="text: shortFromToDisplay, css: {'founded': hasFromContact}"></span>
						<span class="add_contact" data-i18n="MESSAGE/ACTION_ADD_TO_CONTACTS" 
							  data-bind="i18n: 'title', click: addToContacts, visible: visibleAddToContacts"></span>
						<span data-i18n="MESSAGE/HEADER_TO" data-bind="i18n: 'text', visible: allRecipients() !== ''"></span>
						<span data-bind="text: allRecipients"></span>
					</div>
					<span class="dropdown control contact_card" data-bind="visible: hasFromContact">
						<span class="dropdown_helper">
							<span class="dropdown_arrow"><span></span></span>
							<span class="dropdown_content" data-bind="template: {name: 'Mail_ContactCard', data: fromContact}">
							</span>
						</span>
					</span>
				</div>
				
				<div class="message_info message_detail_info" data-bind="contactcard: {}, visible: detailsVisible()">
					<div class="message_info_line">
						<span class="title" data-i18n="MESSAGE/HEADER_FROM" data-bind="i18n: 'text'"></span>: 
						<span class="from control" data-bind="text: fullFrom, css: {'founded': hasFromContact}"></span>
						<span class="add_contact" data-i18n="MESSAGE/ACTION_ADD_TO_CONTACTS" 
							  data-bind="i18n: 'title', click: addToContacts, visible: visibleAddToContacts"></span>
					</div>
					<div style="position: relative;">
						<span class="dropdown control contact_card" data-bind="visible: hasFromContact">
							<span class="dropdown_helper">
								<span class="dropdown_arrow"><span></span></span>
								<span class="dropdown_content" data-bind="template: {name: 'Mail_ContactCard', data: fromContact}">
								</span>
							</span>
						</span>
					</div>
				
					<div class="message_info_line" data-bind="visible: to().length > 0">
						<span class="title" data-i18n="MESSAGE/HEADER_TO" data-bind="i18n: 'text'"></span>: 
						<span data-bind="text: to"></span>
					</div>
					<div class="message_info_line" data-bind="visible: cc().length > 0">
						<span class="title" data-i18n="MESSAGE/HEADER_CC" data-bind="i18n: 'text'"></span>: 
						<span data-bind="text: cc"></span>
					</div>
					<div class="message_info_line" data-bind="visible: bcc().length > 0">
						<span class="title" data-i18n="MESSAGE/HEADER_BCC" data-bind="i18n: 'text'"></span>: 
						<span data-bind="text: bcc"></span>
					</div>
					<div class="message_info_line">
						<span class="title" data-i18n="MESSAGE/HEADER_DATE" data-bind="i18n: 'text'"></span>: 
						<span data-bind="text: fullDate"></span>
					</div>
				</div>
			</div>

			<div class="header_row" data-bind="visible: isCurrentMessage">
				<span class="date" data-bind="text: midDate, visible: !detailsVisible()"></span>
				<span class="wm_importance_img"></span>
				<h2 class="subject" data-bind="text: subject"></h2>
			</div>
		</div>
	</div>
	
	<div class="message" data-bind="customScrollbar: {'reset': currentMessage()}, css: {'has_bodytext': hasBodyText, 'has_attachments': hasNotInlineAttachments}">
		<div class="message_content scroll-inner">
			
			<!-- ko if: visibleAppointmentInfo -->
				<div class="appointment" data-bind="template: {name: 'Mail_AppointmentViewModel', data: ical}"></div>
			<!-- /ko -->
			
			<!-- ko if: visibleVcardInfo -->
				<div class="appointment" data-bind="template: {name: 'Mail_VcardAttachmentViewModel', data: vcard}"></div>
			<!-- /ko -->
			
			<div class="message_body_info" data-bind="visible: visibleNoMessageSelectedText">
				<div data-i18n="MESSAGE/INFO_NO_MESSAGE_SELECTED" 
					 data-bind="i18n: 'text'"></div>
				<div class="message_body_secondary_info" data-i18n="MESSAGE/INFO_SINGLE_DOUBLE_CLICK" 
					 data-bind="i18n: 'text'"></div>
			</div>
			<div class="message_body_info" data-i18n="MESSAGE/INFO_LOADING" 
				 data-bind="visible: isLoading, i18n: 'text'"></div>
			<div class="message_body html" data-bind="initDom: domTextBody"></div>
			
			<div class="bodyparts_separator"></div>
			
			<div class="attachments" data-bind="visible: hasNotInlineAttachments">
				<a class="download_all" href="javascript: void(0)">
					<span class="icon"></span>
					<span class="text">Download all attachments</span>
				</a>
				<div data-bind="foreach: notInlineAttachments">
					<div class="attachment">
						<span class="icon" data-bind="attr: {'title': downloadTitle()}, click: downloadAttachment, css: extension().toLowerCase()"></span>
						<span class="attachment_content">
							<span class="file">
								<span class="name" data-bind="text: fileName()"></span>
								<span class="size" data-bind="text: friendlySize()"></span>
							</span>
							<br />
							<span class="buttons">
								<a class="button view" href="javascript: void(0)" 
								   data-bind="visible: visibleViewLink(), i18n: 'text', click: viewAttachment" 
								   data-i18n="MESSAGE/ATTACHMENT_VIEW"></a>
								<a class="button download" href="javascript: void(0)" data-bind="attr: {'title': downloadTitle()}, click: downloadAttachment">Download</a>
							</span>
						</span>
					</div>
					<!-- ko if: isMessageType() && messagePart() -->
						<!-- ko template: {name: 'Mail_PrintMessageViewModel', data: messagePart} --><!-- /ko -->
					<!-- /ko -->
				</div>
			</div>
		</div>
	</div>
	
	<div class="quick_reply fields" data-bind="initDom: domQuickReply, 
		quickReplyAnim: {
			'sendAction': replySendingStarted(), 
			'saveAction': replySavingStarted(), 
			'activeAction': isQuickReplyActive()
		},
		visible: replyPaneVisible() && isVisibleReplyTool()">
		<div class="status">
			<div class="text" data-bind="text: replyLoadingText"></div>
		</div>
		<div class="row" data-bind="css: {'focused': replyTextFocus(), 
			 'filled': replyText().length > 0}">
			<label for="reply_text" class="title placeholder" 
				   data-i18n="COMPOSE/QUICK_REPLY_PLACEHOLDER" data-bind="i18n: 'text'"></label>
			<textarea id="reply_text" class="input" data-bind="value: replyText, 
				hasfocus: replyTextFocus, onCtrlEnter: sendReplyMessage, valueUpdate: 'afterkeydown'"></textarea>
		</div>
		<div class="buttons">
			<span class="button send" data-bind="i18n: 'text', click: sendReplyMessage" data-i18n="COMPOSE/TOOL_SEND"></span>
			<span class="button save" data-bind="i18n: 'text', click: saveReplyMessage" data-i18n="COMPOSE/TOOL_SAVE"></span>
			<span class="text send_hotkey" data-i18n="COMPOSE/QUICK_REPLY_HOTKEY" data-bind="i18n: 'text'"></span>
			<a class="link full_form" href="javascript: void(0);" 
			   data-bind="i18n: 'text', command: replyAllCommand" 
			   data-i18n="COMPOSE/QUICK_REPLY_OPEN_FULL"></a>
		</div>
	</div>
</div>

<!-- ko template: {name: 'Mail_PrintMessageViewModel'} --><!-- /ko -->
