From c542fcb91e278d230e0444c06c91ce1e436d60c2 Mon Sep 17 00:00:00 2001 From: andree1985 <30987911+andree1985@users.noreply.github.com> Date: Tue, 26 Mar 2019 15:09:21 +0200 Subject: [PATCH 01/11] fix: Rebrand NCCIS to NDAO - Change all relevant text references to NCCIS/CCIS to NDAO Fixes #63 --- NDAO_Client_React/app/data/footerConfig.js | 2 +- NDAO_Client_React/app/index.ejs | 2 +- NDAO_Client_React/app/js/components/navigation/Header.jsx | 4 ++-- NDAO_Client_React/app/js/components/pages/Home/AME_Banner.jsx | 2 +- NDAO_Client_React/app/js/components/pages/Home/Home.jsx | 2 +- NDAO_Client_React/app/js/globalFunctions.js | 4 ++-- 6 files changed, 8 insertions(+), 8 deletions(-) diff --git a/NDAO_Client_React/app/data/footerConfig.js b/NDAO_Client_React/app/data/footerConfig.js index 5e20bc0..0e9cef8 100644 --- a/NDAO_Client_React/app/data/footerConfig.js +++ b/NDAO_Client_React/app/data/footerConfig.js @@ -5,7 +5,7 @@ export const footerContent = { { text: "Technology", links: [ - { text: "DEA NCCIS uses open source, government funded facilities provided by SAEON. The DST and NRF funds the SAEON Open Data Platform (ODP) and associated portals. Developed by SAEON on behalf of DST, DEA, DRDLR, and other stakeholders." }, + { text: "DEA NDAO uses open source, government funded facilities provided by SAEON. The DST and NRF funds the SAEON Open Data Platform (ODP) and associated portals. Developed by SAEON on behalf of DST, DEA, DRDLR, and other stakeholders." }, ] }, { diff --git a/NDAO_Client_React/app/index.ejs b/NDAO_Client_React/app/index.ejs index b6fb53c..4b7f956 100644 --- a/NDAO_Client_React/app/index.ejs +++ b/NDAO_Client_React/app/index.ejs @@ -4,7 +4,7 @@ - NCCIS - National Climate Change Information System + NDAO - National Desired Adaptation Outcomes diff --git a/NDAO_Client_React/app/js/components/navigation/Header.jsx b/NDAO_Client_React/app/js/components/navigation/Header.jsx index b8beb61..4723010 100644 --- a/NDAO_Client_React/app/js/components/navigation/Header.jsx +++ b/NDAO_Client_React/app/js/components/navigation/Header.jsx @@ -32,7 +32,7 @@ class Header extends React.Component {

- NCCIS + NDAO {/* BETA tag */} @@ -42,7 +42,7 @@ class Header extends React.Component {

- National Climate Change Information System + National Desired Adaptation Outcomes
diff --git a/NDAO_Client_React/app/js/components/pages/Home/AME_Banner.jsx b/NDAO_Client_React/app/js/components/pages/Home/AME_Banner.jsx index 5a79506..0a42538 100644 --- a/NDAO_Client_React/app/js/components/pages/Home/AME_Banner.jsx +++ b/NDAO_Client_React/app/js/components/pages/Home/AME_Banner.jsx @@ -27,7 +27,7 @@ class AME_Banner extends React.Component {

- The Department of Environmental Affairs Climate Change Information System (CCIS) was designed to monitor + The Department of Environmental Affairs National Desired Adaptation Outcomes (NDAO) was designed to monitor and track South Africa’s progress on climate change, to that end, nine desired adaptation outcome goals were developed to establish progress across the country.
diff --git a/NDAO_Client_React/app/js/components/pages/Home/Home.jsx b/NDAO_Client_React/app/js/components/pages/Home/Home.jsx index 83cc8a7..694cec4 100644 --- a/NDAO_Client_React/app/js/components/pages/Home/Home.jsx +++ b/NDAO_Client_React/app/js/components/pages/Home/Home.jsx @@ -289,7 +289,7 @@ class Home extends React.Component { { diff --git a/NDAO_Client_React/app/js/globalFunctions.js b/NDAO_Client_React/app/js/globalFunctions.js index 2638062..1511716 100644 --- a/NDAO_Client_React/app/js/globalFunctions.js +++ b/NDAO_Client_React/app/js/globalFunctions.js @@ -73,11 +73,11 @@ export const wait = ms => new Promise((r, j) => setTimeout(r, ms)) //-------------------------// export function SaveCurrentUrl() { - CreateCookie("ccis_last_url", document.URL, 1); + CreateCookie("ndao_last_url", document.URL, 1); } export function ReadLastUrl() { - return ReadCookie("ccis_last_url") + return ReadCookie("ndao_last_url") } export function CreateCookie(name, value, days) { From 5b4b600794161217d4b766900a975853f9e78e98 Mon Sep 17 00:00:00 2001 From: andree1985 <30987911+andree1985@users.noreply.github.com> Date: Tue, 26 Mar 2019 18:37:30 +0200 Subject: [PATCH 02/11] feat(side-nav): Re-designed SideNav Re-designed SideNav with Ant.Design's drawer component Fixes #66 --- .../app/js/components/navigation/SideNav.css | 13 ++ .../app/js/components/navigation/SideNav.jsx | 216 +++++++++++------- .../app/js/config/serviceURLs.js | 2 +- 3 files changed, 144 insertions(+), 87 deletions(-) create mode 100644 NDAO_Client_React/app/js/components/navigation/SideNav.css diff --git a/NDAO_Client_React/app/js/components/navigation/SideNav.css b/NDAO_Client_React/app/js/components/navigation/SideNav.css new file mode 100644 index 0000000..948cad2 --- /dev/null +++ b/NDAO_Client_React/app/js/components/navigation/SideNav.css @@ -0,0 +1,13 @@ +.nav-cat-head { + padding-top: 7px; + font-size: 15px; +} + +.nav-close-handle { + color: black; + box-shadow: none; + margin-right: 2px; + padding: 10px 3px 10px 2px; + border: 1px solid black; + border-radius: 3px; +} \ No newline at end of file diff --git a/NDAO_Client_React/app/js/components/navigation/SideNav.jsx b/NDAO_Client_React/app/js/components/navigation/SideNav.jsx index 5b0d5ac..c04cac7 100644 --- a/NDAO_Client_React/app/js/components/navigation/SideNav.jsx +++ b/NDAO_Client_React/app/js/components/navigation/SideNav.jsx @@ -2,13 +2,13 @@ import React from 'react' import { connect } from 'react-redux'; -import { - SideNav as MSBSideNav, Fa, SideNavItem, SideNavCat, SideNavNav, SideNavLink, Container, Row, Button, - Modal, ModalBody, ModalHeader, ModalFooter -} from 'mdbreact' +import { Fa, Row, Col, Button } from 'mdbreact' +import { Drawer, Collapse } from 'antd' +import { DEAGreen } from '../../config/colours.js' -import '../../../css/mdbreact-sidenav.css' -import loader from '../../../images/Other/loader.gif' +import './SideNav.css' + +const Panel = Collapse.Panel const mapStateToProps = (state, props) => { return {} @@ -49,7 +49,6 @@ class SideNav extends React.Component { } toggleNav(key) { - let { navOpen } = this.state if (navOpen.includes(key)) { @@ -63,49 +62,56 @@ class SideNav extends React.Component { } renderLinks(data, level = 0) { - - let { navOpen } = this.state let links = [] - //let indent = (level > 1 ? 26 * (level - 1) : 0) + "px" data.forEach(x => { if (typeof x.children !== 'undefined') { links.push( - + {x.text} +

+ } + style={{ + border: 0 + }} > {this.renderLinks(x.children, level + 1)} - + ) } else { if (typeof x.link !== 'undefined') { links.push( - { - this.showContent(x.link, x.text, x.window) - }} - > - - {x.text} - +
+ { + this.showContent(x.link, x.text, x.window) + }} + > + + {x.text} + +
) } else { links.push( - - - {x.text} - +
+ { + this.showContent(x.link, x.text, x.window) + }} + > + + {x.text} + +
) } } @@ -115,84 +121,122 @@ class SideNav extends React.Component { } closeModal() { - this.setState({ showContent: false }) - //this.props.toggleSideNav(false) + this.setState({ showContent: false, contentLink: "" }) } showContent(link, title, window) { - - if(window === 'blank'){ + if (window === 'blank') { var win = open(link, '_blank'); win.focus(); } - else{ + else { this.setState({ showContent: true, contentLink: link, contentTitle: title }) } - } render() { let { isOpen, data } = this.props - let { width, height, showContent, contentLink, contentTitle } = this.state + let { width, showContent, contentLink, contentTitle } = this.state - const sideNavWidth = 325 + const sideNavWidth = width < 325 ? "100%" : 325 return ( <> - - - - this.closeModal()} - style={{ width: (width - sideNavWidth - 20) + "px" }} - size="fluid" - fullHeight position="right" - > - this.closeModal()}> - {contentTitle} - - + placement="left" + width={width < 1250 ? "100vw" : "80vw"} + closable={true} + onClose={() => this.closeModal()} + visible={showContent} + bodyStyle={{ padding: 1, overflowX: 'hidden' }} + >