<div class="navbar">
	<div class="navbar-inner">
		<div class="left">
			<a href="javascript:void(0)" class="link icon-only back" data-bind="click: function () { $root.executeCancel(); }">
				<i class="icon icon-back"></i>
				<!--_i18n: {'key': 'COREWEBCLIENT/ACTION_CANCEL'}-->
			</a>
		</div>

		<!-- We need cool sliding animation on title element, so we have additional "sliding" class -->
		<!--<div class="center sliding" data-bind="visible: isNew(), i18n: {'key': '%MODULENAME%/HEADING_NEW_GROUP'}"></div>-->
		<!--<div class="center sliding" data-bind="visible: !isNew(), i18n: {'key': '%MODULENAME%/HEADING_EDIT_GROUP'}"></div>-->

		<div class="right">
			<a href="javascript:void(0)" class="link icon-only aurora-icons send_files" data-bind="visible: allowSendThisContact () && $root.bAllowComposeMessageToAddresses && hasEmails(), click: sendThisContact">
				<i class="icon"></i>
			</a>
			<a href="javascript:void(0)" class="link icon-only aurora-icons new_message" data-bind="makeLinkComposeMailTo: getFullEmail()" style="display: none;">
				<i class="icon"></i>
			</a>

			<a href="javascript:void(0)" class="link icon-only aurora-icons edit" data-bind="visible: !readOnly(), click: function () { edited(true); }">
				<i class="icon"></i>
			</a>
			<!--i18n: {'key': '%MODULENAME%/ACTION_EDIT_CONTACT'}-->
		</div>
	</div>
</div>

<div class="page-content">

	<div class="content-block-title" data-bind="visible: displayName, text: displayName"></div>
	<div class="content-block-title" data-bind="text: email()"></div>
	<div class="list-block" data-bind="visible: firstName() || lastName() || skype() || facebook()">
		<ul>
			<!-- Text inputs -->
			<li data-bind="visible: firstName()">
				<div class="item-content">
					<div class="item-media"><i class="icon">person</i></div>
					<div class="item-inner">
						<div class="item-title label" data-bind="i18n: {'key': '%MODULENAME%/LABEL_FIRST_NAME'}">Name</div>
						<div class="item-after" data-bind="text: firstName">
							<input type="text" placeholder="Your name">
						</div>
					</div>
				</div>
			</li>

			<li data-bind="visible: lastName()">
				<div class="item-content">
					<div class="item-media"><i class="icon">person</i></div>
					<div class="item-inner">
						<div class="item-title label" data-bind="i18n: {'key': '%MODULENAME%/LABEL_LAST_NAME'}">Name</div>
						<div class="item-after" data-bind="text: lastName">
						</div>
					</div>
				</div>
			</li>

			<li data-bind="visible: skype()">
				<div class="item-content">
					<div class="item-media"><i class="icon">person</i></div>
					<div class="item-inner">
						<div class="item-title label" data-bind="i18n: {'key': '%MODULENAME%/LABEL_SKYPE'}">Name</div>
						<a href="javascript: void(0)" class="item-after" data-bind="attr: {href: 'skype:' + skype()}">
							<span class="value" data-bind="text: skype"></span>
						</a>
					</div>
				</div>
			</li>

			<li data-bind="visible: facebook()">
				<div class="item-content">
					<div class="item-media"><i class="icon">person</i></div>
					<div class="item-inner">
						<div class="item-title label" data-bind="i18n: {'key': '%MODULENAME%/LABEL_FACEBOOK'}">Name</div>
						<a href="javascript: void(0)" target="_blank" class="item-input" data-bind="visible: isStrLink(facebook()), attr: {href: facebook}">
							<span class="value" data-bind="text: facebook"></span>
						</a>
						<div class="item-after" data-bind="visible: !isStrLink(facebook()), text: facebook"></div>
					</div>
				</div>
			</li>
		</ul>
	</div>


	<div class="content-block-title" data-bind="i18n: {'key': '%MODULENAME%/HEADING_BASIC_INFO'}, visible: !personalIsEmpty()"></div>
	<div class="list-block" data-bind="visible: !personalIsEmpty()">
		<ul>
			<li data-bind="visible: '' !== personalEmail()">
				<div class="item-content">
					<div class="item-media"><i class="icon"></i></div>
					<div class="item-inner">
						<div class="item-title label" data-bind="i18n: {'key': '%MODULENAME%/LABEL_PERSONAL_EMAIL'}"></div>
						<div class="item-after" data-bind="text: personalEmail"></div>
					</div>
				</div>
			</li>
			
			<li data-bind="visible: '' !== personalWeb()">
				<div class="item-content">
					<div class="item-media"><i class="icon"></i></div>
					<div class="item-inner">
						<div class="item-title label" data-bind="i18n: {'key': '%MODULENAME%/LABEL_WEB_PAGE'}"></div>
						<div class="item-after" data-bind="text: personalWeb"></div>
					</div>
				</div>
			</li>
			<li data-bind="visible: '' !== personalFax()">
				<div class="item-content">
					<div class="item-media"><i class="icon"></i></div>
					<div class="item-inner">
						<div class="item-title label" data-bind="i18n: {'key': '%MODULENAME%/LABEL_FAX'}"></div>
						<div class="item-after" data-bind="text: personalFax"></div>
					</div>
				</div>
			</li>
			
			<li data-bind="visible: '' !== personalPhone()">
				<div class="item-content">
					<div class="item-media"><i class="icon"></i></div>
					<div class="item-inner">
						<div class="item-title label" data-bind="i18n: {'key': '%MODULENAME%/LABEL_PHONE'}"></div>
						<div class="item-after" data-bind="text: personalPhone"></div>
					</div>
				</div>
			</li>
			
			<li data-bind="visible: '' !== personalMobile()">
				<div class="item-content">
					<div class="item-media"><i class="icon"></i></div>
					<div class="item-inner">
						<div class="item-title label" data-bind="i18n: {'key': '%MODULENAME%/LABEL_MOBILE'}"></div>
						<div class="item-after" data-bind="text: personalMobile"></div>
					</div>
				</div>
			</li>
		</ul>
	</div>

	<div class="content-block-title" data-bind="i18n: {'key': '%MODULENAME%/LABEL_ADDRESS'}, visible: personalStreetAddress() || personalCity() || personalState() || personalCountry() || personalZipCode()"></div>
	<div class="list-block" data-bind="visible: personalStreetAddress() || personalCity() || personalState() || personalCountry() || personalZipCode()">
		<ul>
			<li data-bind="visible: '' !== personalStreetAddress()">
				<div class="item-content">
					<div class="item-media"><i class="icon"></i></div>
					<div class="item-inner">
						<div class="item-title label" data-bind="i18n: {'key': '%MODULENAME%/LABEL_STREET_ADDRESS'}">Name</div>
						<div class="item-after" data-bind="text: personalStreetAddress"></div>
					</div>
				</div>
			</li>

			<li data-bind="visible: '' !== personalCity()">
				<div class="item-content">
					<div class="item-media"><i class="icon"></i></div>
					<div class="item-inner">
						<div class="item-title label" data-bind="i18n: {'key': '%MODULENAME%/LABEL_CITY'}">Name</div>
						<div class="item-after" data-bind="text: personalCity"></div>
					</div>
				</div>
			</li>

			<li data-bind="visible: '' !== personalState()">
				<div class="item-content">
					<div class="item-media"><i class="icon"></i></div>
					<div class="item-inner">
						<div class="item-title label" data-bind="i18n: {'key': '%MODULENAME%/LABEL_STATE_PROVINCE'}">Name</div>
						<div class="item-after" data-bind="text: personalState"></div>
					</div>
				</div>
			</li>

			<li data-bind="visible: '' !== personalCountry()">
				<div class="item-content">
					<div class="item-media"><i class="icon"></i></div>
					<div class="item-inner">
						<div class="item-title label" data-bind="i18n: {'key': '%MODULENAME%/LABEL_COUNTRY_REGION'}">Name</div>
						<div class="item-after" data-bind="text: personalCountry"></div>
					</div>
				</div>
			</li>

			<li data-bind="visible: '' !== personalZipCode()">
				<div class="item-content">
					<div class="item-media"><i class="icon"></i></div>
					<div class="item-inner">
						<div class="item-title label" data-bind="i18n: {'key': '%MODULENAME%/LABEL_ZIP_CODE'}">Name</div>
						<div class="item-after" data-bind="text: personalZipCode"></div>
					</div>
				</div>
			</li>
		</ul>
	</div>

	<div class="content-block-title" data-bind="i18n: {'key': '%MODULENAME%/HEADING_BUSINESS_INFO'}, visible: !businessIsEmpty()"></div>
	<div class="list-block" data-bind="visible: !businessIsEmpty()">
		<ul>
			<li data-bind="visible: '' !== businessEmail()">
				<div class="item-content">
					<div class="item-inner">
						<div class="item-title label" data-bind="i18n: {'key': '%MODULENAME%/LABEL_BUSINESS_EMAIL'}"></div>
						<div class="item-after" data-bind="text: businessEmail"></div>
					</div>
				</div>
			</li>
			
			<li data-bind="visible: '' !== businessCompany()">
				<div class="item-content">
					<div class="item-inner">
						<div class="item-title label" data-bind="i18n: {'key': '%MODULENAME%/LABEL_COMPANY'}"></div>
						<div class="item-after" data-bind="text: businessCompany"></div>
					</div>
				</div>
			</li>
			
			<li data-bind="visible: '' !== businessDepartment()">
				<div class="item-content">
					<div class="item-inner">
						<div class="item-title label" data-bind="i18n: {'key': '%MODULENAME%/LABEL_DEPARTMENT'}"></div>
						<div class="item-after" data-bind="text: businessDepartment"></div>
					</div>
				</div>
			</li>
			
			<li data-bind="visible: '' !== businessJob()">
				<div class="item-content">
					<div class="item-inner">
						<div class="item-title label" data-bind="i18n: {'key': '%MODULENAME%/LABEL_JOB_TITLE'}"></div>
						<div class="item-after" data-bind="text: businessJob"></div>
					</div>
				</div>
			</li>
			
			<li data-bind="visible: '' !== businessOffice()">
				<div class="item-content">
					<div class="item-inner">
						<div class="item-title label" data-bind="i18n: {'key': '%MODULENAME%/LABEL_OFFICE'}"></div>
						<div class="item-after" data-bind="text: businessOffice"></div>
					</div>
				</div>
			</li>
			
			<li data-bind="visible: '' !== businessStreetAddress()">
				<div class="item-content">
					<div class="item-inner">
						<div class="item-title label" data-bind="i18n: {'key': '%MODULENAME%/LABEL_STREET_ADDRESS'}"></div>
						<div class="item-after" data-bind="text: businessStreetAddress"></div>
					</div>
				</div>
			</li>

			<li data-bind="visible: '' !== businessCity()">
				<div class="item-content">
					<div class="item-inner">
						<div class="item-title label" data-bind="i18n: {'key': '%MODULENAME%/LABEL_CITY'}"></div>
						<div class="item-after" data-bind="text: businessCity"></div>
					</div>
				</div>
			</li>
			
			<li data-bind="visible: '' !== businessState()">
				<div class="item-content">
					<div class="item-inner">
						<div class="item-title label" data-bind="i18n: {'key': '%MODULENAME%/LABEL_STATE_PROVINCE'}"></div>
						<div class="item-after" data-bind="text: businessState"></div>
					</div>
				</div>
			</li>
			
			<li data-bind="visible: '' !== businessZipCode()">
				<div class="item-content">
					<div class="item-inner">
						<div class="item-title label" data-bind="i18n: {'key': '%MODULENAME%/LABEL_ZIP_CODE'}"></div>
						<div class="item-after" data-bind="text: businessZipCode"></div>
					</div>
				</div>
			</li>
			
			<li data-bind="visible: '' !== businessCountry()">
				<div class="item-content">
					<div class="item-inner">
						<div class="item-title label" data-bind="i18n: {'key': '%MODULENAME%/LABEL_COUNTRY_REGION'}"></div>
						<div class="item-after" data-bind="text: businessCountry"></div>
					</div>
				</div>
			</li>
			
			<li data-bind="visible: '' !== businessWeb()">
				<div class="item-content">
					<div class="item-inner">
						<div class="item-title label" data-bind="i18n: {'key': '%MODULENAME%/LABEL_WEB_PAGE'}"></div>
						<div class="item-after" data-bind="text: businessWeb"></div>
					</div>
				</div>
			</li>
			
			<li data-bind="visible: '' !== businessFax()">
				<div class="item-content">
					<div class="item-inner">
						<div class="item-title label" data-bind="i18n: {'key': '%MODULENAME%/LABEL_FAX'}"></div>
						<div class="item-after" data-bind="text: businessFax"></div>
					</div>
				</div>
			</li>
			
			<li data-bind="visible: '' !== businessPhone()">
				<div class="item-content">
					<div class="item-inner">
						<div class="item-title label" data-bind="i18n: {'key': '%MODULENAME%/LABEL_PHONE'}"></div>
						<div class="item-after" data-bind="text: businessPhone"></div>
					</div>
				</div>
			</li>
		</ul>
	</div>
	
	<div class="content-block-title" data-bind="i18n: {'key': '%MODULENAME%/HEADING_OTHER_INFO'}, visible: !otherIsEmpty()"></div>
	<div class="list-block" data-bind="visible: !otherIsEmpty()">
		<ul>
			<li data-bind="visible: !birthdayIsEmpty()">
				<div class="item-content">
					<div class="item-inner">
						<div class="item-title label" data-bind="i18n: {'key': '%MODULENAME%/LABEL_BIRTHDAY'}"></div>
						<div class="item-after" data-bind="text: otherBirthday"></div>
					</div>
				</div>
			</li>
			
			<li data-bind="visible: otherEmail()">
				<div class="item-content">
					<div class="item-inner">
						<div class="item-title label" data-bind="i18n: {'key': '%MODULENAME%/LABEL_OTHER_EMAIL'}"></div>
						<div class="item-after" data-bind="text: otherEmail"></div>
					</div>
				</div>
			</li>
			
			<li data-bind="visible: otherNotes()">
				<div class="item-content">
					<div class="item-inner">
						<div class="item-title label" data-bind="i18n: {'key': '%MODULENAME%/LABEL_NOTES'}"></div>
						<div class="item-after" data-bind="text: otherNotes"></div>
					</div>
				</div>
			</li>
		</ul>
	</div>
	
	
	<div class="content-block-title" data-bind="i18n: {'key': '%MODULENAME%/HEADING_GROUPS'}, visible: !team() && 0 < $root.groupsInContactView($data).length"></div>
	<div class="list-block">
		<ul data-bind="foreach: $root.groupsInContactView($data)">
			<li>
				<div class="item-content">
					<div class="item-inner">
						<div class="item-title" data-bind="text: Name(), click: function () { $root.onViewGroupClick($data); }"></div>
					</div>
				</div>
			</li>
		</ul>
	</div>

	<span class="button" data-bind="i18n: {'key': '%MODULENAME%/ACTION_SEE_EMAILS_WITH_CONTACT'}, click: function () {$root.searchMessagesInInbox('email:' + getEmailsString());}, visible: $root.bAllowSearchMessagesInInbox && hasEmails()"></span>
</div>

• [F] ContactsScreenView.html
  Delete
• [F] ContactsView.html
  Delete
• [F] ContactView.html
  Delete
• [F] EditContactView.html
  Delete
• [F] EditGroupView.html
  Delete
• [F] GroupsView.html
  Delete
• [F] GroupView.html
  Delete
• [F] ToolbarContactsView.html
  Delete
• [F] ToolbarContactView.html
  Delete