[GitHub/WoltLab/WCF.git] / com.woltlab.wcf / templates / pageHeaderUser.tpl

<nav id="topMenu" class="userPanel{if $__wcf->user->userID} userPanelLoggedIn{/if}">
	{if $__wcf->user->userID}
		<span class="userPanelAvatar">{@$__wcf->getUserProfileHandler()->getAvatar()->getImageTag(32)}</span>
	{else}
		<a href="{link controller='Login'}{/link}" class="userPanelLoginLink jsTooltip" title="{lang}wcf.user.loginOrRegister{/lang}">
			<span class="icon icon32 fa-sign-in"></span>
		</a>
	{/if}
	
	<ul class="userPanelItems">
		{if $__wcf->user->userID}
			<!-- user menu -->
			<li id="userMenu">
				<a
					class="jsTooltip"
					href="{$__wcf->user->getLink()}"
					title="{lang}wcf.user.controlPanel{/lang}"
					role="button"
					tabindex="0"
					aria-haspopup="true"
					aria-expanded="false"
				>
					{@$__wcf->getUserProfileHandler()->getAvatar()->getImageTag(32)} <span>{lang}wcf.user.userNote{/lang}</span>
				</a>
				<div class="userMenu userMenuControlPanel" data-origin="userMenu" tabindex="-1" hidden>
					<div class="userMenuHeader">
						<div class="userMenuTitle">{lang}wcf.user.controlPanel{/lang}</div>
					</div>
					<div class="userMenuContent">
						<div class="userMenuItem">
							<div class="userMenuItemImage">
								{@$__wcf->getUserProfileHandler()->getUserProfile()->getAvatar()->getImageTag(48)}
							</div>
							<div class="userMenuItemContent">
								{* This is the unformatted username, custom styles might not work nicely here and
								   the consistent styling is used to provide visual anchors to identify links. *}
								<a href="{$__wcf->user->getLink()}" class="userMenuItemLink">{$__wcf->user->username}</a>
								
								{if MODULE_USER_RANK}
									{if $__wcf->getUserProfileHandler()->getUserTitle()}
										<span class="badge userTitleBadge{if $__wcf->getUserProfileHandler()->getRank() && $__wcf->getUserProfileHandler()->getRank()->cssClassName} {@$__wcf->getUserProfileHandler()->getRank()->cssClassName}{/if}">{$__wcf->getUserProfileHandler()->getUserTitle()}</span>
									{/if}
									{if $__wcf->getUserProfileHandler()->getRank() && $__wcf->getUserProfileHandler()->getRank()->rankImage}
										<span class="userRankImage">{@$__wcf->getUserProfileHandler()->getRank()->getImage()}</span>
									{/if}
								{/if}
							</div>
							<div class="userMenuItemMeta">
								{lang}wcf.user.myProfile{/lang}
							</div>
						</div>
					</div>
					<div class="userMenuContentDivider"></div>
					{if $__wcf->session->getPermission('admin.general.canUseAcp')}
					<div class="userMenuContent">
						<div class="userMenuItem userMenuItemNarrow userMenuItemSingleLine">
							<div class="userMenuItemImage">
								<span class="icon icon32 fa-wrench"></span>
							</div>
							<div class="userMenuItemContent">
								<a href="{link isACP=true}{/link}" class="userMenuItemLink">{lang}wcf.global.acp{/lang}</a>
							</div>
						</div>
					</div>
					<div class="userMenuContentDivider"></div>
					{/if}
					<div class="userMenuContent userMenuContentScrollable">
						{foreach from=$__wcf->getUserMenu()->getUserMenuItems() item=menuItem}
						<div class="userMenuItem userMenuItemNarrow" data-category="{$menuItem[category]->menuItem}">
							<div class="userMenuItemImage">
								<span class="icon icon32 {$menuItem[category]->getIconClassName()}"></span>
							</div>
							<div class="userMenuItemContent">
								<a href="{$menuItem[link]}" class="userMenuItemLink">
									{$menuItem[category]->getTitle()}
								</a>
							</div>
							<div class="userMenuItemMeta">
								{implode from=$menuItem[items] item=title glue=' · '}{$title}{/implode}
							</div>
						</div>
						{/foreach}
					</div>
					<div class="userMenuFooter">
						<form method="post" action="{link controller='Logout'}{/link}">
							<a href="#" class="userMenuFooterLink" role="button">{lang}wcf.user.logout{/lang}</a>
							{csrfToken}
						</form>
					</div>
				</div>
				<script data-relocate="true">
					require(["WoltLabSuite/Core/Ui/User/Menu/ControlPanel"], ({ setup }) => setup());
				</script>
			</li>
			
			<!-- user notifications -->
			{if !$__hideUserMenu|isset}
				<li id="userNotifications" data-count="{#$__wcf->getUserNotificationHandler()->getNotificationCount()}" data-title="Benachrichtigungen">
					<a
						class="jsTooltip"
						href="{link controller='NotificationList'}{/link}"
						title="{lang}wcf.user.notification.notifications{/lang}"
						role="button"
						tabindex="0"
						aria-haspopup="true"
						aria-expanded="false"
					>
						<span class="icon icon32 fa-bell-o"></span> <span>{lang}wcf.user.notification.notifications{/lang}</span>{if $__wcf->getUserNotificationHandler()->getNotificationCount()} <span class="badge badgeUpdate">{#$__wcf->getUserNotificationHandler()->getNotificationCount()}</span>{/if}
					</a>
					{if !OFFLINE || $__wcf->session->getPermission('admin.general.canViewPageDuringOfflineMode')}
						<script data-relocate="true">
							require(["WoltLabSuite/Core/Ui/User/Menu/Data/Notification"], ({ setup }) => {
								setup({
									noItems: '{jslang}wcf.user.notification.noMoreNotifications{/jslang}',
									settingsLink: '{link controller='NotificationSettings' encode=false}{/link}',
									settingsTitle: '{jslang}wcf.user.notification.settings{/jslang}',
									showAllLink: '{link controller='NotificationList' encode=false}{/link}',
									showAllTitle: '{jslang}wcf.user.notification.showAll{/jslang}',
									title: '{jslang}wcf.user.notification.notifications{/jslang}',
								});
							});
						</script>
					{/if}
				</li>
			{/if}
		{else}
			{if $__wcf->getLanguage()->getLanguages()|count > 1}
				<li id="pageLanguageContainer">
					<script data-relocate="true">
						require(['WoltLabSuite/Core/Language/Chooser'], function(LanguageChooser) {
							var languages = {
								{implode from=$__wcf->getLanguage()->getLanguages() item=_language}
									'{@$_language->languageID}': {
										iconPath: '{@$_language->getIconPath()|encodeJS}',
										languageName: '{@$_language|encodeJS}',
										languageCode: '{@$_language->languageCode|encodeJS}'
									}
								{/implode}
							};
								
							var callback = function(listItem) {
								var location;
								var languageCode = elData(listItem, 'language-code');
								var link = elBySel('link[hreflang="' + languageCode + '"]');
								if (link !== null) {
									location = link.href;
								}
								else {
									location = window.location.toString().replace(/#.*/, '').replace(/(\?|&)l=[0-9]+/g, '');
								}
								
								var delimiter = (location.indexOf('?') == -1) ? '?' : '&';
								window.location = location + delimiter + 'l=' + elData(listItem, 'language-id') + window.location.hash;
							};
							
							LanguageChooser.init('pageLanguageContainer', 'pageLanguageID', {@$__wcf->getLanguage()->languageID}, languages, callback);
						});
					</script>
				</li>
			{/if}
			<li id="userLogin">
				<a class="loginLink" href="{link controller='Login'}{/link}">{lang}wcf.user.loginOrRegister{/lang}</a>
			</a>
		{/if}
		
		{if !$__hideUserMenu|isset}
			{if $__wcf->user->userID && $__wcf->session->getPermission('mod.general.canUseModeration')}
				<li id="outstandingModeration" data-count="{#$__wcf->getModerationQueueManager()->getUnreadModerationCount()}">
					<a
						class="jsTooltip"
						href="{link controller='ModerationList'}{/link}"
						title="{lang}wcf.moderation.moderation{/lang}"
						role="button"
						tabindex="0"
						aria-haspopup="true"
						aria-expanded="false"
					>
						<span class="icon icon32 fa-exclamation-triangle"></span>
						<span>{lang}wcf.moderation.moderation{/lang}</span>
						{if $__wcf->getModerationQueueManager()->getUnreadModerationCount()}<span class="badge badgeUpdate">{#$__wcf->getModerationQueueManager()->getUnreadModerationCount()}</span>{/if}
					</a>
					{if !OFFLINE || $__wcf->session->getPermission('admin.general.canViewPageDuringOfflineMode')}
						<script data-relocate="true">
							require(["WoltLabSuite/Core/Ui/User/Menu/Data/ModerationQueue"], ({ setup }) => {
								setup({
									deletedContent: '{jslang}wcf.moderation.showDeletedContent{/jslang}',
									deletedContentLink: '{link controller='DeletedContentList' encode=false}{/link}',
									noItems: '{jslang}wcf.moderation.noMoreItems{/jslang}',
									showAllLink: '{link controller='ModerationList' encode=false}{/link}',
									showAllTitle: '{jslang}wcf.moderation.showAll{/jslang}',
									title: '{jslang}wcf.moderation.moderation{/jslang}'
								});
							});
						</script>
					{/if}
				</li>
			{/if}
			
			{event name='menuItems'}
		{/if}
		
		<!-- page search -->
		{if !SEARCH_USE_CAPTCHA || $__wcf->user->userID}
			<li class="jsOnly">
				<a href="#" id="userPanelSearchButton" class="jsTooltip" title="{lang}wcf.global.search{/lang}"><span class="icon icon32 fa-search"></span> <span>{lang}wcf.global.search{/lang}</span></a>
			</li>
		{else}
			<li>
				<a href="{link controller='Search'}{/link}" class="jsTooltip" title="{lang}wcf.global.search{/lang}"><span class="icon icon32 fa-search"></span> <span>{lang}wcf.global.search{/lang}</span></a>
				<span id="userPanelSearchButton" style="display: none"></span>
			</li>
		{/if}
	</ul>
</nav>
Commit	Line	Data
0a6f84dc MW	1	<nav id="topMenu" class="userPanel{if $__wcf->user->userID} userPanelLoggedIn{/if}">
	2	{if $__wcf->user->userID}
	3	<span class="userPanelAvatar">{@$__wcf->getUserProfileHandler()->getAvatar()->getImageTag(32)}</span>
6e5b3652 AE	4	{else}
	5	<a href="{link controller='Login'}{/link}" class="userPanelLoginLink jsTooltip" title="{lang}wcf.user.loginOrRegister{/lang}">
	6	<span class="icon icon32 fa-sign-in"></span>
	7	</a>
0a6f84dc MW	8	{/if}
0a6f84dc MW	9
b8eab696 AE	10	<ul class="userPanelItems">
	11	{if $__wcf->user->userID}
	12	<!-- user menu -->
	13	<li id="userMenu">
677bdb69 AE	14	<a
	15	class="jsTooltip"
	16	href="{$__wcf->user->getLink()}"
	17	title="{lang}wcf.user.controlPanel{/lang}"
	18	role="button"
	19	tabindex="0"
	20	aria-haspopup="true"
	21	aria-expanded="false"
	22	>
	23	{@$__wcf->getUserProfileHandler()->getAvatar()->getImageTag(32)} <span>{lang}wcf.user.userNote{/lang}</span>
	24	</a>
	25	<div class="userMenu userMenuControlPanel" data-origin="userMenu" tabindex="-1" hidden>
	26	<div class="userMenuHeader">
	27	<div class="userMenuTitle">{lang}wcf.user.controlPanel{/lang}</div>
b8eab696	28	</div>
677bdb69 AE	29	<div class="userMenuContent">
	30	<div class="userMenuItem">
	31	<div class="userMenuItemImage">
	32	{@$__wcf->getUserProfileHandler()->getUserProfile()->getAvatar()->getImageTag(48)}
	33	</div>
	34	<div class="userMenuItemContent">
	35	{* This is the unformatted username, custom styles might not work nicely here and
	36	the consistent styling is used to provide visual anchors to identify links. *}
	37	<a href="{$__wcf->user->getLink()}" class="userMenuItemLink">{$__wcf->user->username}</a>
	38
	39	{if MODULE_USER_RANK}
	40	{if $__wcf->getUserProfileHandler()->getUserTitle()}
	41	<span class="badge userTitleBadge{if $__wcf->getUserProfileHandler()->getRank() && $__wcf->getUserProfileHandler()->getRank()->cssClassName} {@$__wcf->getUserProfileHandler()->getRank()->cssClassName}{/if}">{$__wcf->getUserProfileHandler()->getUserTitle()}</span>
	42	{/if}
	43	{if $__wcf->getUserProfileHandler()->getRank() && $__wcf->getUserProfileHandler()->getRank()->rankImage}
	44	<span class="userRankImage">{@$__wcf->getUserProfileHandler()->getRank()->getImage()}</span>
	45	{/if}
	46	{/if}
	47	</div>
	48	<div class="userMenuItemMeta">
	49	{lang}wcf.user.myProfile{/lang}
	50	</div>
	51	</div>
	52	</div>
	53	<div class="userMenuContentDivider"></div>
	54	{if $__wcf->session->getPermission('admin.general.canUseAcp')}
	55	<div class="userMenuContent">
	56	<div class="userMenuItem userMenuItemNarrow userMenuItemSingleLine">
	57	<div class="userMenuItemImage">
	58	<span class="icon icon32 fa-wrench"></span>
	59	</div>
	60	<div class="userMenuItemContent">
	61	<a href="{link isACP=true}{/link}" class="userMenuItemLink">{lang}wcf.global.acp{/lang}</a>
	62	</div>
	63	</div>
	64	</div>
	65	<div class="userMenuContentDivider"></div>
	66	{/if}
4996d792	67	<div class="userMenuContent userMenuContentScrollable">
677bdb69 AE	68	{foreach from=$__wcf->getUserMenu()->getUserMenuItems() item=menuItem}
	69	<div class="userMenuItem userMenuItemNarrow" data-category="{$menuItem[category]->menuItem}">
	70	<div class="userMenuItemImage">
	71	<span class="icon icon32 {$menuItem[category]->getIconClassName()}"></span>
	72	</div>
	73	<div class="userMenuItemContent">
	74	<a href="{$menuItem[link]}" class="userMenuItemLink">
	75	{$menuItem[category]->getTitle()}
	76	</a>
	77	</div>
	78	<div class="userMenuItemMeta">
	79	{implode from=$menuItem[items] item=title glue=' · '}{$title}{/implode}
	80	</div>
	81	</div>
	82	{/foreach}
	83	</div>
	84	<div class="userMenuFooter">
372f863c AE	85	<form method="post" action="{link controller='Logout'}{/link}">
	86	<a href="#" class="userMenuFooterLink" role="button">{lang}wcf.user.logout{/lang}</a>
	87	{csrfToken}
	88	</form>
b8eab696	89	</div>
b8eab696	90	</div>
51547f2c	91	<script data-relocate="true">
677bdb69	92	require(["WoltLabSuite/Core/Ui/User/Menu/ControlPanel"], ({ setup }) => setup());
51547f2c	93	</script>
b8eab696 AE	94	</li>
b8eab696 AE	95
b8eab696 AE	96	<!-- user notifications -->
b8eab696 AE	97	{if !$__hideUserMenu\|isset}
f030cb76	98	<li id="userNotifications" data-count="{#$__wcf->getUserNotificationHandler()->getNotificationCount()}" data-title="Benachrichtigungen">
ea0c0ef6 AE	99	<a
	100	class="jsTooltip"
	101	href="{link controller='NotificationList'}{/link}"
	102	title="{lang}wcf.user.notification.notifications{/lang}"
	103	role="button"
	104	tabindex="0"
	105	aria-haspopup="true"
	106	aria-expanded="false"
	107	>
	108	<span class="icon icon32 fa-bell-o"></span> <span>{lang}wcf.user.notification.notifications{/lang}</span>{if $__wcf->getUserNotificationHandler()->getNotificationCount()} <span class="badge badgeUpdate">{#$__wcf->getUserNotificationHandler()->getNotificationCount()}</span>{/if}
	109	</a>
b8eab696 AE	110	{if !OFFLINE \|\| $__wcf->session->getPermission('admin.general.canViewPageDuringOfflineMode')}
b8eab696 AE	111	<script data-relocate="true">
8eaab6e0 AE	112	require(["WoltLabSuite/Core/Ui/User/Menu/Data/Notification"], ({ setup }) => {
8eaab6e0 AE	113	setup({
9f663473	114	noItems: '{jslang}wcf.user.notification.noMoreNotifications{/jslang}',
b8eab696	115	settingsLink: '{link controller='NotificationSettings' encode=false}{/link}',
8eaab6e0	116	settingsTitle: '{jslang}wcf.user.notification.settings{/jslang}',
b8eab696	117	showAllLink: '{link controller='NotificationList' encode=false}{/link}',
8eaab6e0 AE	118	showAllTitle: '{jslang}wcf.user.notification.showAll{/jslang}',
8eaab6e0 AE	119	title: '{jslang}wcf.user.notification.notifications{/jslang}',
677bdb69	120	});
b8eab696	121	});
b8eab696	122	</script>
320f4a6d	123	{/if}
b8eab696 AE	124	</li>
	125	{/if}
	126	{else}
d4e8bc05 AE	127	{if $__wcf->getLanguage()->getLanguages()\|count > 1}
	128	<li id="pageLanguageContainer">
	129	<script data-relocate="true">
6e5b3652	130	require(['WoltLabSuite/Core/Language/Chooser'], function(LanguageChooser) {
d4e8bc05	131	var languages = {
fb062f13 MS	132	{implode from=$__wcf->getLanguage()->getLanguages() item=_language}
	133	'{@$_language->languageID}': {
	134	iconPath: '{@$_language->getIconPath()\|encodeJS}',
	135	languageName: '{@$_language\|encodeJS}',
	136	languageCode: '{@$_language->languageCode\|encodeJS}'
d4e8bc05 AE	137	}
	138	{/implode}
	139	};
ff110591	140
d4e8bc05	141	var callback = function(listItem) {
ff110591 MW	142	var location;
	143	var languageCode = elData(listItem, 'language-code');
	144	var link = elBySel('link[hreflang="' + languageCode + '"]');
	145	if (link !== null) {
	146	location = link.href;
	147	}
	148	else {
	149	location = window.location.toString().replace(/#.*/, '').replace(/(\?\|&)l=[0-9]+/g, '');
	150	}
d4e8bc05	151
ff110591	152	var delimiter = (location.indexOf('?') == -1) ? '?' : '&';
d4e8bc05 AE	153	window.location = location + delimiter + 'l=' + elData(listItem, 'language-id') + window.location.hash;
	154	};
	155
51ab1086	156	LanguageChooser.init('pageLanguageContainer', 'pageLanguageID', {@$__wcf->getLanguage()->languageID}, languages, callback);
b2e0e0cd	157	});
b8eab696 AE	158	</script>
	159	</li>
	160	{/if}
6e5b3652 AE	161	<li id="userLogin">
	162	<a class="loginLink" href="{link controller='Login'}{/link}">{lang}wcf.user.loginOrRegister{/lang}</a>
	163	</a>
b8eab696 AE	164	{/if}
	165
	166	{if !$__hideUserMenu\|isset}
	167	{if $__wcf->user->userID && $__wcf->session->getPermission('mod.general.canUseModeration')}
0882d872	168	<li id="outstandingModeration" data-count="{#$__wcf->getModerationQueueManager()->getUnreadModerationCount()}">
ea0c0ef6 AE	169	<a
	170	class="jsTooltip"
	171	href="{link controller='ModerationList'}{/link}"
	172	title="{lang}wcf.moderation.moderation{/lang}"
	173	role="button"
	174	tabindex="0"
	175	aria-haspopup="true"
	176	aria-expanded="false"
	177	>
e2368a74	178	<span class="icon icon32 fa-exclamation-triangle"></span>
b8eab696	179	<span>{lang}wcf.moderation.moderation{/lang}</span>
e2368a74	180	{if $__wcf->getModerationQueueManager()->getUnreadModerationCount()}<span class="badge badgeUpdate">{#$__wcf->getModerationQueueManager()->getUnreadModerationCount()}</span>{/if}
b8eab696 AE	181	</a>
	182	{if !OFFLINE \|\| $__wcf->session->getPermission('admin.general.canViewPageDuringOfflineMode')}
	183	<script data-relocate="true">
cf9e11c3 AE	184	require(["WoltLabSuite/Core/Ui/User/Menu/Data/ModerationQueue"], ({ setup }) => {
cf9e11c3 AE	185	setup({
9f663473	186	deletedContent: '{jslang}wcf.moderation.showDeletedContent{/jslang}',
b8eab696	187	deletedContentLink: '{link controller='DeletedContentList' encode=false}{/link}',
9f663473	188	noItems: '{jslang}wcf.moderation.noMoreItems{/jslang}',
b8eab696	189	showAllLink: '{link controller='ModerationList' encode=false}{/link}',
cf9e11c3	190	showAllTitle: '{jslang}wcf.moderation.showAll{/jslang}',
9f663473	191	title: '{jslang}wcf.moderation.moderation{/jslang}'
677bdb69	192	});
b8eab696	193	});
b8eab696 AE	194	</script>
	195	{/if}
	196	</li>
51547f2c	197	{/if}
b8eab696 AE	198
	199	{event name='menuItems'}
	200	{/if}
74029e21 AE	201
74029e21 AE	202	<!-- page search -->
d53b1144 MW	203	{if !SEARCH_USE_CAPTCHA \|\| $__wcf->user->userID}
	204	<li class="jsOnly">
	205	<a href="#" id="userPanelSearchButton" class="jsTooltip" title="{lang}wcf.global.search{/lang}"><span class="icon icon32 fa-search"></span> <span>{lang}wcf.global.search{/lang}</span></a>
	206	</li>
	207	{else}
	208	<li>
	209	<a href="{link controller='Search'}{/link}" class="jsTooltip" title="{lang}wcf.global.search{/lang}"><span class="icon icon32 fa-search"></span> <span>{lang}wcf.global.search{/lang}</span></a>
258f69d4	210	<span id="userPanelSearchButton" style="display: none"></span>
d53b1144 MW	211	</li>
d53b1144 MW	212	{/if}
b8eab696	213	</ul>
bf1461c2	214	</nav>