Skip to content

Commit

Permalink
Populate clients menus from menus models (#284)
Browse files Browse the repository at this point in the history
  • Loading branch information
allyoucanmap authored Jun 29, 2021
1 parent 5dd41db commit 0d2db76
Show file tree
Hide file tree
Showing 7 changed files with 91 additions and 31 deletions.
2 changes: 1 addition & 1 deletion geonode_mapstore_client/client/js/api/geonode/v2/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -340,7 +340,7 @@ export const getConfiguration = (configUrl = '/static/mapstore/configs/localConf
geoNodePageConfig.localConfig || {},
(objValue, srcValue) => {
if (isArray(objValue)) {
return srcValue;
return [...objValue, ...srcValue];
}
return undefined; // eslint-disable-line consistent-return
});
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -85,6 +85,7 @@ const RightContentMenu = ({ items, formatHref, query, parentRef, cfg }) => {
formatHref={formatHref}
query={query}
variant="primary"
alignRight
/>

}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -19,14 +19,14 @@ import {
isValidBadgeValue
} from '@js/utils/MenuUtils';

const itemElement = ({ labelId, href, badge }) => (
const itemElement = ({ labelId, href, badge, target }) => (
<>
<NavLink href={href}>{labelId && <Message msgId={labelId} />}
<NavLink href={href} target={target}>{labelId && <Message msgId={labelId} />}
{ isValidBadgeValue(badge) && <Badge>{badge}</Badge>}
</NavLink>
</>);

const itemsList = (items) => ( items && items.map(({ labelId, href, badge }) => itemElement({ labelId, href, badge })));
const itemsList = (items) => ( items && items.map(({ labelId, href, badge, target }) => itemElement({ labelId, href, badge, target })));

/**
* DropdownList component
Expand Down Expand Up @@ -92,6 +92,7 @@ const DropdownList = ({
href={itm.href}
style={itm.style}
as={itm?.items ? 'span' : 'a' }
target={itm.target}
>
{itm.labelId && <Message msgId={itm.labelId} /> || itm.label}
{isValidBadgeValue(itm.badge) && <Badge>{itm.badge}</Badge>}
Expand Down
19 changes: 2 additions & 17 deletions geonode_mapstore_client/client/js/components/Menu/MenuItem.js
Original file line number Diff line number Diff line change
Expand Up @@ -43,7 +43,7 @@ import {
const MenuItem = ({ item, menuItemsProps, containerNode, tabIndex, draggable, classItem, size, alignRight, variant }) => {

const { formatHref, query } = menuItemsProps;
const { id, type, label, labelId = '', items = [], href, style, badge = '', image, subType, Component } = item;
const { id, type, label, labelId = '', items = [], href, style, badge = '', image, Component, target } = item;

const badgeValue = badge;
if (type === 'dropdown') {
Expand All @@ -69,23 +69,8 @@ const MenuItem = ({ item, menuItemsProps, containerNode, tabIndex, draggable, cl
}

if (type === 'link') {
if (subType === 'tag') {
return (
<Tag
tabIndex={tabIndex}
draggable={draggable}
href={href}
style={style}
variant={variant}
>
{labelId && <Message msgId={labelId} /> || label}
{isValidBadgeValue(badgeValue) && <Badge>{badgeValue}</Badge>}
</Tag>
);
}

return (
<NavLink href={href} className={variant ? `btn btn-${variant}` : ''}>{labelId && <Message msgId={labelId} /> || label}</NavLink>
<NavLink href={href} target={target} className={variant ? `btn btn-${variant}` : ''}>{labelId && <Message msgId={labelId} /> || label}</NavLink>
);

}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -84,17 +84,21 @@
display: flex;
flex: 1;
flex-direction: row-reverse;
ul:not(.dropdown-menu) {
> ul:not(.dropdown-menu) {
display: flex;
flex: 1;
flex-direction: row-reverse;
li{
> li{
display: flex;

}
> li + li {
margin-right: 0.4rem;
}
}
}

.gn-action-navbar-content-tools {
margin-left: 0.4rem;
}
}
.gn-action-navbar-tools > * {
margin: 0 0.8rem;
Expand Down
Original file line number Diff line number Diff line change
@@ -1,18 +1,45 @@
{% load client_lib_tags %}
{% load base_tags %}
{% load get_menu_json %}
{% comment %}
app and map configuration need to be normalized
{% endcomment %}

{% comment %} setting.py variables {% endcomment %}
{{ MAP_BASELAYERS|json_script:"settings-MAP_BASELAYERS" }}
{{ CATALOGUE_SERVICES|json_script:"settings-CATALOGUE_SERVICES" }}
{{ CATALOGUE_SELECTED_SERVICE|json_script:"settings-CATALOGUE_SELECTED_SERVICE" }}

{% comment %} menu items {% endcomment %}

{% get_menu_json 'TOPBAR_MENU' as TOPBAR_MENU %}
{{ TOPBAR_MENU|json_script:"menu-TOPBAR_MENU" }}
{% get_menu_json 'TOP_MENUBAR_LEFT' as TOP_MENUBAR_LEFT %}
{{ TOP_MENUBAR_LEFT|json_script:"menu-TOP_MENUBAR_LEFT" }}
{% get_menu_json 'TOP_MENUBAR_RIGHT' as TOP_MENUBAR_RIGHT %}
{{ TOP_MENUBAR_RIGHT|json_script:"menu-TOP_MENUBAR_RIGHT" }}
{% get_menu_json 'CARDS_MENU' as CARDS_MENU %}
{{ CARDS_MENU|json_script:"menu-CARDS_MENU" }}

<script>
{% autoescape off %}
(function(){

function getJSONScriptVariable(id, fallback) {
const node = document.getElementById(id);
return node && JSON.parse(node.textContent) || fallback;
}

localStorage.setItem('showPopoverSync', false);

const username = '{{ user|default:"" }}' || null;
const token = '{{ access_token|default:"" }}' || '{{ ACCESS_TOKEN|default:"" }}' || null;

const topBarMenuItems = getJSONScriptVariable('menu-TOPBAR_MENU', []);
const topMenubarLeftItems = getJSONScriptVariable('menu-TOP_MENUBAR_LEFT', []);
const topMenubarRightItems = getJSONScriptVariable('menu-TOP_MENUBAR_RIGHT', []);
const cardsMenuItems = getJSONScriptVariable('menu-CARDS_MENU', []);

window.__GEONODE_CONFIG__ = {
languageCode: '{{ LANGUAGE_CODE }}',
resourceId: {{ appId|default:'null' }},
Expand Down Expand Up @@ -47,15 +74,21 @@
printUrl: '{{ GEOSERVER_PUBLIC_LOCATION }}pdf/info.json',
bingApiKey: '{% bing_api_key %}',
siteName: '{{ SITE_NAME|default:"Geonode" }}',
geoNodeConfiguration: {
menu: {
items: [...topBarMenuItems, ...topMenubarLeftItems],
rightItems: topMenubarRightItems
},
cardsMenu: {
items: cardsMenuItems
}
}
},
};

const baseLayerNode = document.getElementById('settings-MAP_BASELAYERS');
const baseLayers = baseLayerNode && JSON.parse(baseLayerNode.textContent) || [];
const catalogueServicesNode = document.getElementById('settings-CATALOGUE_SERVICES');
const catalogueServices = catalogueServicesNode && JSON.parse(catalogueServicesNode.textContent) || {};
const catalogueSelectedServiceNode = document.getElementById('settings-CATALOGUE_SELECTED_SERVICE');
const catalogueSelectedService = catalogueSelectedServiceNode && JSON.parse(catalogueSelectedServiceNode.textContent) || {};
const baseLayers = getJSONScriptVariable('settings-MAP_BASELAYERS', []);
const catalogueServices = getJSONScriptVariable('settings-CATALOGUE_SERVICES', {});
const catalogueSelectedService = getJSONScriptVariable('settings-CATALOGUE_SELECTED_SERVICE', '');

// override maps configuration with properties from setting.py
window.overrideNewMapConfig = function(config) {
Expand Down
36 changes: 36 additions & 0 deletions geonode_mapstore_client/templatetags/get_menu_json.py
Original file line number Diff line number Diff line change
@@ -0,0 +1,36 @@
from django import template
from geonode.base.models import Menu, MenuItem

register = template.Library()

def _handle_single_item(menu_item):
m_item = {}
m_item['type'] = 'link'
m_item['href'] = menu_item.url
m_item['label'] = menu_item.title
if menu_item.blank_target:
m_item['target'] = '_blank'
return m_item

@register.simple_tag
def get_menu_json(placeholder_name):
menus = {
m: MenuItem.objects.filter(menu=m).order_by('order')
for m in Menu.objects.filter(placeholder__name=placeholder_name)
}
ms = []
for menu, menu_items in menus.items():
if len(menu_items) > 1:
m = {}
m['label'] = menu.title
m['type'] = 'dropdown'
m['items'] = []
for menu_item in menu_items:
m_item = _handle_single_item(menu_item)
m['items'].append(m_item)

ms.append(m)
if len(menu_items) == 1:
m = _handle_single_item(menu_items.first())
ms.append(m)
return ms

0 comments on commit 0d2db76

Please sign in to comment.