r}}" alt="{{name}}" class="rounded img-fluid">
		</div>
		{{/avatar}}
		<div class="{{#avatar}}col-md-9{{/avatar}}{{^avatar}}col{{/avatar}}">
			<div class="card-body{{#hidden}} text-muted{{/hidden}}">
				{{#hidden}}<div class="mb-2 text-danger text-center">Verksamhetsdel är dold - endast synlig för inloggad administratör.</div>{{/hidden}}
				{{{desc}}}
			</div>
		</div>
	</div>
</div>
{{/visible}}
{{/level}}
{{/data}}
EOT;

	$overview_template = <<<EOT
{{#data}}
<div>
	{{{desc}}}	
	{{#edit_url}}
	<div class="text-right">
		<a href="{{edit_url}}"><i class="fa fa-edit fa-fw" aria-hidden="true"></i> Redigera verksamhetstyp</a>
	</div>
	{{/edit_url}}
</div>
<hr />
{{#level}}
{{#visible}}
<div class="card mb-3" style="max-width: 540px;">
	<!--
	<div class="card-header">
		<a id="{{slug}}" class="text-reset text-decoration-none">{{name}}</a>
		
		{{#edit_url}}
		<div class="float-right">
			<a href="{{edit_url}}" title="{{i18n.visible}}" data-toggle="tooltip"><i class="fa {{#hidden}}fa-eye-slash{{/hidden}}{{^hidden}}fa-eye{{/hidden}} fa-fw" aria-hidden="true"></i></a>
			<a href="{{edit_url}}" title="{{i18n.edit}}" data-toggle="tooltip"><i class="fa fa-edit fa-fw" aria-hidden="true"></i></a>
		</div>
		{{/edit_url}}
	</div>
	-->
	
	{{#avatar}}
	<img src="{{avatar}}" alt="{{name}}" class="card-img-top">
	{{/avatar}}

	<div class="card-body{{#hidden}} text-muted{{/hidden}}">
		<h5 class="card-title">
			<a id="{{slug}}" class="text-reset text-decoration-none">{{name}}</a>
			{{#edit_url}}
			<div class="float-right">
				<a href="{{edit_url}}" class="text-reset" title="{{i18n.visible}}" data-toggle="tooltip"><i class="fa {{#hidden}}fa-eye-slash{{/hidden}}{{^hidden}}fa-eye{{/hidden}} fa-fw" aria-hidden="true"></i></a>
				<a href="{{edit_url}}" class="text-reset" title="{{i18n.edit}}" data-toggle="tooltip"><i class="fa fa-edit fa-fw" aria-hidden="true"></i></a>
			</div>
			{{/edit_url}}
		</h5>
		{{#hidden}}<div class="mb-2 text-danger text-center">Verksamhetsdel är dold - endast synlig för inloggad administratör.</div>{{/hidden}}
		{{{desc}}}
	</div>
</div>
{{/visible}}
{{/level}}
{{/data}}
EOT;

	$Content .= $Mustache->render($overview_template, [ 'data' => $data, 'i18n' => [ 'edit' => _('Redigera'), 'visible' => _('Visa/dölj') ] ]);

//	$Content .= sprintf('<pre>%s</pre>', var_export($data, true));

}

/* gruppnavigering
-- ---------------*/
if(
	(
	  false === defined("KANSLIETONLINE_MULTISITE") ||
	  (false !== defined("KANSLIETONLINE_MULTISITE") && KANSLIETONLINE_MULTISITE !== true)
	) || (
  	  !isset($Page['Query']['GroupId']) && 
	  (false !== defined("KANSLIETONLINE_MULTISITE") && KANSLIETONLINE_MULTISITE === true)
	)

){
	$pst = $dbh->prepare("
		SELECT 
		`level_id`, `level_name`, 
		`group_id`, `group_name`, `group_start`, UNIX_TIMESTAMP(`group_start`) AS `MMYY`, DATE_FORMAT(`group_start`, '%Y') AS `group_year`, DATE_FORMAT(`group_start`, '%m') AS `group_month`, `group_max`, `group_active`, `group_props`, 
		`N`.`Ant` `Reserved` 
		FROM `school_level` 
		INNER JOIN `school_group` 
		ON `level_id` = `group_parent` 
		LEFT JOIN (
		 SELECT COUNT(`not_id`) `Ant`, `not_group_id` 
		 FROM `school_notifies` 
		 INNER JOIN `roles` 
		 ON `not_role` = `ID` 
		 WHERE `not_type` = 1  
		 AND `Staff` = 0 
		 AND `not_confirmed` IS NOT NULL 
		 GROUP BY `not_group_id`
		) `N` ON `N`.`not_group_id` = `group_id` 
		WHERE DATE_FORMAT(`group_start`, '%Y-%m-%d 23:59:59') <= '{$__PERIOD_TO}' 
		AND DATE_FORMAT(`group_end`, '%Y-%m-%d 00:00:00') >= '{$__PERIOD_FROM}' 
		AND `level_parent` = ? 
		AND `group_removed` = 1 
		ORDER BY 
		`level_order` ASC, 
		`group_year` ASC, 
		`group_month` ASC, 
		`group_order` ASC
	");
	
	$pst->execute( [ $TypeId ] );
	if($pst->rowCount() !== 0){
		$Data = array();
		$CurrLevel = 0;
		$CurrYear  = 0;
		$CurrMonth = 0;
		$i = 0;
		$j = 0;

		$Tmp = "";
		while($res = $pst->fetch(PDO::FETCH_ASSOC)){
			if(!is_null($res['group_props']) && false !== $P = @unserialize($res['group_props'])){
				if(isset($P['Settings']['HideMenu']) && $P['Settings']['HideMenu'] === 1)
					continue;
			}

	//		$Debug[] = print_r($res, true);
			if($CurrLevel != $res['level_id'] || $CurrYear != $res['group_year'] || $CurrMonth != $res['group_month']){
				if($CurrLevel != $res['level_id']){
					if($CurrLevel != 0) $i++;
					$Data[$i] = array(
						"id" => $res['level_id'],
						"name" => $res['level_name'],
						//"slug" => post_slug($res['level_name']),
					);
				}
	//			if($CurrYear != $res['group_year'] || $CurrMonth != $res['group_month']){
					if($CurrLevel != $res['level_id']) $j = -1;
	//				if($CurrYear != 0) 
					$j++;
					$Data[$i]['period'][$j] = array(
						"name" => strftime(DATE_MONTH_YY, $res['MMYY'])
					);
	//			}

			}
			$Available = intval($res['group_max'] - $res['Reserved']);
			if($Available <= 0) $Available = 0;

			if(isset($__NOTIFICATION_HIDDEN_COLS['SpotsAvailable']) && $__NOTIFICATION_HIDDEN_COLS['SpotsAvailable'] === true) $Available = false;
			
			$Data[$i]['period'][$j]['group'][] = array(
				"id" => $res['group_id'],
				"name" => $res['group_name'],
				"url" => sprintf('%s%s%s/%d-%s/', $__AbsUrl, ltrim($Page['Path'], '/'), post_slug($res['level_name']), $res['group_id'], post_slug($res['group_name'])),
				"start" => $res['group_start'],
				"active" => intval($res['group_active']),
				"available" => $Available,
				"reserved" => intval($res['Reserved']),
			);

			$CurrLevel = $res['level_id'];
			$CurrYear = $res['group_year'];
			$CurrMonth = $res['group_month'];
		}
//		IF(DEBUG === true) $Content .= sprintf('<pre>%s</pre>', print_r($Data, true));

/*		
		for($i = 0; $i < count($Data); $i++){
			for($y = 0; $y < count($Data[$i]['Period']); $y++){
				if(count($Data[$i]['Period'][$y]['Group']) === 0)
					unset($Data[$i]['Period'][$y]);
			}
		}
		for($i = 0; $i < count($Data); $i++){
			for($y = 0; $y < count($Data[$i]['Period']); $y++){
				if(!isset($Data[$i]['Period'][$y]['Group']))
					unset($Data[$i]['Period'][$y]);
			}
			if(count($Data[$i]['Period']) === 0)
				unset($Data[$i]['Period']);
		}
*/
	$groups_nav_template = <<<EOT
<nav class="sidebar-nav">
<ul class="metismenu" id="menu1">
{{#level}}
<li><a class="has-arrow" href="#">{{name}}</a>
<ul>
{{#period}}
<li><a class="has-arrow" href="#">{{name}}</a>
<ul>
{{#group}}
<li><a href="{{url}}">{{name}}{{#available}} <span class="float-right badge badge-primary badge-pill">{{available}}</span>{{/available}}</a></li>
{{/group}}
</ul>
</li>
{{/period}}
</ul>
</li>
{{/level}}
</ul>
</nav>
EOT;

	$onLoadJS[] = <<<EOT
$('#menu1').metisMenu({
	cookieName: "KOGroupTree1"
});

var current = $('#menu1').find("a").filter(function() {
	return location.href.toLowerCase() == this.href.toLowerCase();
});
if(current.length !== 0){
	current.addClass("selected-item");
	current.parents('li').addClass('mm-active');
	current.parents('ul').addClass('mm-collapse mm-show');
}
EOT;

		/* set custom widget for year selector
		--------------------------------------------------*/
//		ko_enqueue_style('metis-menu', sprintf('%sjs/Metis/style.metisMenu.css', $__AbsUrl));
//		ko_enqueue_script('metis-menu', sprintf('%sjs/Metis/jquery.metisMenu.js', $__AbsUrl));
		ko_enqueue_style('metis-menu', sprintf('%sjs/metisMenu/metisMenu.min.css', $__AbsUrl));
		ko_enqueue_style('metis-sidebar', sprintf('%sjs/metisMenu/metis-sidebar.css', $__AbsUrl));
		ko_enqueue_script('metis-menu', sprintf('%sjs/metisMenu/metisMenu.js', $__AbsUrl));

		add_custom_widget(
			(isset($Page['Query']['GroupId']) && (int)$Page['Query']['GroupId'] !== 0 ? 'sidebar-2':'sidebar-1'), 
			'text', 
			[ 
				'title' => $Phrases['LBL_LEVELS_GROUPS'], 
				'text' => $Mustache->render(
					$groups_nav_template, 
					array(
						'level' => $Data,
						'i18n' => array(
//							'regular' => $Phrases['LBL_NOTIFY_REGULAR'],
//							'queue' => $Phrases['LBL_NOTIFY_WAITING_LIST'],
//							'info' => $Phrases['MSG_X_MINUTES_TO_CONFIRM_RESERVATION']
						)
					)
				)
			]
		);

	}
	$pst = null;
}