ITSSTOOLS/modules/itop-welcome-itil/welcome_menu.html

<style>
.main_container {
	width: 100%;
	border: 0;
	overflow-y: hidden;
	overflow-x: hidden;
	margin-bottom: 5px;
	margin-top: 5px;
	border-bottom: #ccc 1px solid;
	border-top: #ccc 1px solid;
}
.main_header {
	width:100%;
	height: 60px;
	cursor: move;
	background-color: #F1F1F6;
}
.main_header h1 {
	color: #1C94C4;
	margin-top:0;
	margin-bottom:0;
	padding-top: 10px;
	padding-bottom: 10px;p
	font-size: 16px;
	line-height: 16px;
}
.main_header img {
	margin-top: 10px;
	margin-right: 10px;
	float:left;
}
.item {
	overflow-y: auto;
	overflow-x: hidden;
	background-color: #fff;
	padding: 5px;
	height: auto;
}
.main_menu {
	overflow-y: auto;
	overflow-x: hidden;
	height: auto;
	background-color: #eee;
	width: 100%;
}
.element {
	display: inline-block;
}
.element a {
	font-size: 10px;
}
.element a.actions {
	font-size: 16px;
	text-decoration: none;
	background: transparent;
	color: #666;
}
.element a img {
	border: 0;
}
.summary-details {
	float:right;
	margin-top: 5px;
}

.summary-details td {
	text-align: center;
	background: transparent;
	padding: 5px;
}
.summary-details th {
	text-align: center;
	background: #CCC;
	padding: 5px;
	color: #eee;
}
a.summary {
	text-decoration: none;
	background: transparent;
	color: #666;
}
a.summary:hover {
	text-decoration: underline;
}
</style>
<script>
var sSerialized = '';
function DumpPositions()
{
	sSerialized = $('.sortable').sortable('serialize', {key: 'menu'});
	alert(sSerialized);
}

function RestorePositions()
{	height: auto;
    var arr = $('#main_menu .main_container').get();    
    arr.reverse();

	var sTemp = sSerialized.replace(/menu=/g, '');
	alert(sTemp);
	var aSerialized = sTemp.split('&');
	console.log(aSerialized);
    $.each(aSerialized, function(i,v) {
      console.log(i+' => '+v);
      var $menu = $('#menu_'+v);
      if ($menu.length >  0) // Check that the menu exists
      {
      	$('#main_menu').append($menu);
      }
    });
}
</script>
<div id="main_menu" class="sortable persistent">

<div id="menu_1" class="main_container v-resizable">

<div class="main_header drag_handle" id="main_cfg">

<img src="../modules/itop-config-mgmt-1.0.0/images/database.png"/>
<itopblock BlockClass="DisplayBlock" type="summary" asynchronous="false" encoding="text/oql" parameters="title[block]:Menu_ConfigManagement;context_filter:1;label[block]:UI_WelcomeMenu_AllConfigItems;status[block]:status;status_codes[block]:implementation,production,obsolete">SELECT FunctionalCI</itopblock>

</div>

<div class="item">

<div class="element">
<itopcheck class="BusinessProcess">
<itopblock BlockClass="DisplayBlock" type="actions" asynchronous="false" encoding="text/oql" parameters="context_filter:1">SELECT BusinessProcess</itopblock>
</itopcheck>
</div>

<div class="element">
<itopcheck class="Contact">
<itopblock BlockClass="DisplayBlock" type="actions" asynchronous="false" encoding="text/oql" parameters="context_filter:1">SELECT Contact</itopblock>
</itopcheck>
</div>

<div class="element">
<itopcheck class="Location">
<itopblock BlockClass="DisplayBlock" type="actions" asynchronous="false" encoding="text/oql" parameters="context_filter:1">SELECT Location</itopblock>
</itopcheck>
</div>

<div class="element">
<itopcheck class="Server">
<itopblock BlockClass="DisplayBlock" type="actions" asynchronous="false" encoding="text/oql" parameters="context_filter:1">SELECT Server</itopblock>
</itopcheck>
</div>

<div class="element">
<itopcheck class="DatabaseInstance">
<itopblock BlockClass="DisplayBlock" type="actions" asynchronous="false" encoding="text/oql" parameters="context_filter:1">SELECT DatabaseInstance</itopblock>
</itopcheck>
</div>

<div class="element">
<itopcheck class="NetworkDevice">
<itopblock BlockClass="DisplayBlock" type="actions" asynchronous="false" encoding="text/oql" parameters="context_filter:1">SELECT NetworkDevice</itopblock>
</itopcheck>
</div>

</div>
</div>

<itopcheck class="UserRequest">

<div id="menu_2" class="main_container v-resizable">

<div class="main_header drag_handle" id="main_helpdesk">
<img src="../modules/itop-request-mgmt-1.0.0/images/user-request-deadline.png"/>
<itopblock BlockClass="DisplayBlock" type="summary" asynchronous="false" encoding="text/oql" parameters="title[block]:Menu_RequestManagement;context_filter:1;label[block]:UI_WelcomeMenu_AllOpenRequests;status[block]:status;status_codes[block]:new,assigned,escalated_tto,escalated_ttr,resolved">SELECT UserRequest WHERE status != "closed"</itopblock>
</div>

<div class="item">
<p style="text-align:left; font-family:Verdana, Arial, sans-serif; font-size:14px;"><itopstring>UI:WelcomeMenu:MyCalls</itopstring></p>
<itopblock BlockClass="DisplayBlock" type="list" asynchronous="false" encoding="text/oql" parameters="menu:1">SELECT UserRequest AS i WHERE i.caller_id = :current_contact_id AND status NOT IN ("closed", "resolved")</itopblock>
</div>

</div>

</itopcheck>

<itopcheck class="Incident">

<div id="menu_3" class="main_container v-resizable">

<div class="main_header drag_handle" id="main_incident">
<img src="../modules/itop-incident-mgmt-1.0.0/images/incident-escalated.png"/>
<itopblock BlockClass="DisplayBlock" type="summary" asynchronous="false" encoding="text/oql" parameters="title[block]:Menu_IncidentManagement;context_filter:1;label[block]:UI_WelcomeMenu_OpenIncidents;status[block]:status;status_codes[block]:new,assigned,escalated_tto,escalated_ttr,resolved">SELECT Incident WHERE status != "closed"</itopblock>
</div>

<div class="item">
<p style="text-align:left; font-family:Verdana, Arial, sans-serif; font-size:14px;"><itopstring>UI:WelcomeMenu:MyIncidents</itopstring></p>
<itopblock BlockClass="DisplayBlock" type="list" asynchronous="false" encoding="text/oql" parameters="menu:1">SELECT Incident AS i WHERE i.agent_id = :current_contact_id AND status NOT IN ("closed", "resolved")</itopblock>
</div>

</itopcheck>

</div>

</div>