if (!global.p5UI__MenuStore) throw 'Missing global.p5UI__MenuStore'
var DBG = DBG || 0

function renderLabel(item) {
	return (item.short_label !== item.desc)
		? item.short_label + ' <em>' + item.desc + '</em>'
		: item.short_label
	;
}
function renderTitle(item) {
	return (item.label !== item.desc)
		? item.label + ' (' + item.desc + ')'
		: item.label
	;
}
function renderStar(id, idsBookmarks) {
	return (-1 !== idsBookmarks.indexOf(id))
		? '<i class=\"bookmark-item-rem glyphicon glyphicon-star\" title=\"Usuń z ulubionych\" onClick=\"return p5BookmarksRemove(event, ' + id + ')\"></i>'
		: '<i class=\"bookmark-item-add glyphicon glyphicon-star-empty\" title=\"Dodaj do ulubionych\" onClick=\"return p5BookmarksAdd(event, ' + id + ')\"></i>'
	;
}

function renderP5MainMenuDropdown(data, idSubMenu) {
	DBG && console.log('DBG:renderP5MainMenuDropdown data.objects', data.objects)
	var grouped = data.objects.reduce(function (ret, item, idx) {
		ret.mapNsToIdx[ item.namespace ] = idx
		var nsParts = item.namespace.split('/')
		var baseNs = nsParts.slice(0, 2).join('/')
		DBG && console.log('DBG:renderP5MainMenuDropdown >> reduce loop ', { nsParts, baseNs });
		if (!ret.menuTreeNs[baseNs]) ret.menuTreeNs[baseNs] = []
		ret.menuTreeNs[baseNs].push(item.namespace)
		return ret;
	}, { mapNsToIdx: {}, menuTreeNs: {} })
	DBG && console.log('DBG:renderP5MainMenuDropdown grouped', grouped)

	var jqDropdownMenu = jQuery('#' + idSubMenu)
	jqDropdownMenu.empty()
	liNodes = Object.keys(grouped.menuTreeNs).map(function (baseNs) {
		var item = (baseNs in grouped.mapNsToIdx)
			?	data.objects[ grouped.mapNsToIdx[baseNs] ]
			:	data.objects[ grouped.mapNsToIdx[ grouped.menuTreeNs[baseNs][0] ] ]
		;
		DBG && console.log('DBG:renderP5MainMenuDropdown >> render loop', { baseNs, isInMap: (baseNs in grouped.mapNsToIdx), item, idx: [ grouped.mapNsToIdx[baseNs], grouped.menuTreeNs[baseNs][0] ] });

		return (grouped.menuTreeNs[baseNs].length > 1)
			?	'<li class="dropdown-submenu">' +
					'<a href=\"index.php?_route=ViewTableAjax&namespace=' + item.namespace + '\" title="' + renderTitle(item) + '">' +
						renderStar(item.id, data.idsBookmarks) +
						' ' + renderLabel(item) +
					'</a>' + "\n" +
					'<ul class="dropdown-menu">' +
						grouped.menuTreeNs[baseNs].map(function (subItemNs) {
							var subItem = data.objects[ grouped.mapNsToIdx[subItemNs] ]
							return '<li>' +
									'<a href=\"index.php?_route=ViewTableAjax&namespace=' + subItem.namespace + '\" title="' + renderTitle(subItem) + '">' +
										renderStar(subItem.id, data.idsBookmarks) +
										' ' + renderLabel(subItem) +
									'</a>' +
								'</li>'
							;
						}).join("\n") +
					'</ul>' +
				'</li>' + "\n"
			:	'<li>' +
					'<a href=\"index.php?_route=ViewTableAjax&namespace=' + item.namespace + '\" title="' + renderTitle(item) + '">' +
						renderStar(item.id, data.idsBookmarks) +
						' ' + renderLabel(item) +
					'</a>' +
				'</li>' + "\n"
		;
	})
	jqDropdownMenu.append(liNodes);
}

function initP5MainMenuDropdown( btnNode, idSubMenu ) {
	DBG && console.log('DBG:initP5MainMenuDropdown({idSubMenu: '+idSubMenu+'})');
	if (!btnNode._initialized) {
		var jqDropdownTrigger = jQuery(btnNode)
		var jqDropdownMenu = jQuery('#' + idSubMenu)
		var jqDropdownParent = jqDropdownMenu.parent()
		var rerenderDropdown = (function (global, idSubMenu) {
			return function (data) {
				console.log('DBG renderP5MainMenuDropdown', {data, idSubMenu});
				renderP5MainMenuDropdown(data, idSubMenu);
			}
		})(global, idSubMenu);

		global.p5UI__MenuStore.subscribe(rerenderDropdown)

		jqDropdownTrigger.attr('data-toggle', 'dropdown') // is required by bootstrap dorpdown.js evenf if is called via js

		global.p5UI__MenuStore.forceUpdate()

		jQuery(btnNode).dropdown()
	}
	// btnNode._initialized = true // TODO: DBG TEST
	return true;
}

global.initP5MainMenuDropdown = initP5MainMenuDropdown