diff --git a/src/About.js b/src/About.js
index 28ed5eebd33e536ce71e67ba459061144a38f12b..f00b38272aaccbcedb60b0ad2797764319726182 100644
--- a/src/About.js
+++ b/src/About.js
@@ -22,28 +22,17 @@ along with Portal-SMPPIR-React. If not, see <https://www.gnu.org/licenses/>.
import React, { Component } from 'react';
import NavigationBar from './Components/NavigationBar'
-import AppFooter from './Components/AppFooter'
import { Tabs, Card, Row, Col} from 'react-materialize'
-import Cookies from 'universal-cookie';
-import ContrastBar from './Components/ContrastBar'
-
+import { Store } from './Store'
import './Styles/About.css'
-var contrastCK = new Cookies();
-var cookieStatus = contrastCK.get('contrast');
-
class About extends Component {
render() {
- var contrastString = '';
- if(cookieStatus === 'true'){
- contrastString = 'Contrast'
- }
+ var contrastString = this.context.state.contrast;
return (
<div id={`${contrastString}mainPage`}>
- <ContrastBar/>
<NavigationBar/>
-
<div id='contentTabsDiv'>
<Tabs className={`tab-demo z-depth-1 ${contrastString}mainPageTealBlue`}></Tabs>
<Row>
@@ -56,10 +45,10 @@ class About extends Component {
</Col>
</Row>
</div>
- <AppFooter/>
</div>
);
}
}
+About.contextType = Store;
export default About;
diff --git a/src/AfricanOrigin.js b/src/AfricanOrigin.js
index 1e8da6cef9747e97adfa07bc5597e4cc373e2d93..81686001a6c23346c32c598c0db700b8ce4b1218 100644
--- a/src/AfricanOrigin.js
+++ b/src/AfricanOrigin.js
@@ -20,83 +20,57 @@ along with Portal-SMPPIR-React. If not, see <https://www.gnu.org/licenses/>.
-import React, { Component } from 'react';
+import React from 'react';
import NavigationBar from './Components/NavigationBar';
import AfricanCulture from './SubPages/AfricanCulture';
import AfricanSustainability from './SubPages/AfricanSustainability';
import AfricanRights from './SubPages/AfricanRights';
-import AppFooter from './Components/AppFooter';
-import Cookies from 'universal-cookie';
import { Tab, Tabs } from 'react-materialize';
-import { sleep, homeURL } from './enviroment';
-import ContrastBar from './Components/ContrastBar'
+import { Store } from './Store';
import './Styles/AfricanOrigin.css'
-var ck = new Cookies();
-var contrastCK = new Cookies();
-var cookieStatus = contrastCK.get('contrast');
+function AfricanOrigin() {
-class AfricanOrigin extends Component {
- constructor(props) {
- super(props);
- this.whereIAm = this.whereIAm.bind(this);
+ // Get information about which page was accessed
+ const { state, dispatch } = React.useContext(Store);
+ var states = {"DIREITOS": false, "CULTURA": false, "SUSTENTABILIDADE":false}
+ if (state.page in states) {
+ states[state.page] = true
}
- componentDidMount() {
- this.whereIAm()
+ else {
+ states["DIREITOS"] = true
}
- render() {
- var contrastString = '';
- if(cookieStatus === 'true'){
- contrastString = 'Contrast'
- }
- const cookie = new Cookies();
-
- var clicked = cookie.get('mainPageClicked')
- var states = {"DIREITOS": true, "CULTURA": false, "SUSTENTABILIDADE":false}
- if (clicked !== undefined){
- if (clicked in states){
- states["DIREITOS"] = false;
- states[clicked] = true;
- }
- else{
- states = {"DIREITOS": true, "CULTURA": false, "SUSTENTABILIDADE":false}
- ck.set('mainPageClicked', 'DIREITOS');
- }
- }
- else{
- // Redirect user to the main page if he/she do not have a cookie
- window.location.href = homeURL()
- }
- return (
- <div id={`${contrastString}mainPage`}>
- <ContrastBar/>
- <NavigationBar/>
-
- <div id='contentTabsDiv'>
- <Tabs className={`tab-demo z-depth-1 ${contrastString}mainPageDarkBlueTab`} onChange={this.whereIAm}>
- <Tab title="Direitos" active={states["DIREITOS"]}> <AfricanRights key={clicked} /> </Tab>
- <Tab title="Cultura" active={states["CULTURA"]}> <AfricanCulture key={clicked} /> </Tab>
- <Tab title="Sustentabilidade" active={states["SUSTENTABILIDADE"]}> <AfricanSustainability key={clicked} /> </Tab>
- </Tabs>
- </div>
- <AppFooter/>
- </div>
- );
+ // Hook to set page context
+ const setPageAction = (newPage) => {
+ return dispatch({
+ type: 'SET_PAGE',
+ payload: newPage
+ })
}
+ React.useEffect(() => { });
- whereIAm(e, ev){
- if(ev){
- ck.set('mainPageClicked', ev.target.innerText);
- this.setState({visited:ev.target.innerText});
- }
- sleep(1).then(() => {
- if(document.getElementsByClassName('clearmapbtn')[0])
- document.getElementsByClassName('clearmapbtn')[0].click()
- });
+ const whereIAm = (e, ev) => {
+ if (ev)
+ setPageAction(ev.target.innerText)
}
+
+ var contrastString = state.contrast
+
+ return (
+ <div id={`${contrastString}mainPage`}>
+ <NavigationBar/>
+ <div id='contentTabsDiv'>
+ <Tabs className={`tab-demo z-depth-1 ${contrastString}mainPageDarkBlueTab`} onChange={whereIAm}>
+ <Tab title="Direitos" active={states["DIREITOS"]}> {states["DIREITOS"] ? <AfricanRights /> : <div />} </Tab>
+ <Tab title="Cultura" active={states["CULTURA"]}> {states["CULTURA"] ? <AfricanCulture /> : <div />} </Tab>
+ <Tab title="Sustentabilidade" active={states["SUSTENTABILIDADE"]}> {states["SUSTENTABILIDADE"] ? <AfricanSustainability /> : <div />} </Tab>
+ </Tabs>
+ </div>
+ </div>
+ );
}
export default AfricanOrigin;
\ No newline at end of file
diff --git a/src/App.js b/src/App.js
index c95cace2ccbef853cbf3e4f2420b9f78179d4240..b55ddc1ac48d09f2ba9b1f61c8aa6dedbc4a71a6 100644
--- a/src/App.js
+++ b/src/App.js
@@ -19,8 +19,7 @@ along with Portal-SMPPIR-React. If not, see <https://www.gnu.org/licenses/>.
*/
-
-import React, { Component } from 'react';
+import React from 'react';
import { BrowserRouter as Router, Route } from 'react-router-dom'
import './App.css';
import MainPage from './MainPage.js'
@@ -31,25 +30,60 @@ import Youth from './Youth'
import Maps from './Maps'
import AfricanOrigin from './AfricanOrigin'
import Quilombola from './Quilombola'
+import { Store } from './Store';
+import AppFooter from './Components/AppFooter'
+import ContrastBar from './Components/ContrastBar'
+import BarraBrasil from './Components/BarraBrasil'
+
+function App() {
-class App extends Component {
- render() {
- return (
- <Router>
- <div>
- <Route exact={true} path="/" component={MainPage} />
- <Route exact={true} path="/cotas" component={RacialQuotas} />
- <Route exact={true} path="/quilombola" component={Quilombola} />
- <Route exact={true} path="/sobre" component={About} />
- <Route exact={true} path="/quilombolas" component={Quilombolas} />
- <Route exact={true} path="/juventude" component={Youth} />
- <Route exact={true} path="/mapas" component={Maps} />
- <Route exact={true} path="/matrizAfricana" component={AfricanOrigin} />
- </div>
- </Router>
- );
+ // Hook to set contrast and page context
+ const { state, dispatch } = React.useContext(Store);
+ const setContrastAction = (newContrast) => {
+ return dispatch({
+ type: 'SET_CONTRAST',
+ payload: newContrast
+ })
+ }
+ const setPageAction = (newPage) => {
+ return dispatch({
+ type: 'SET_PAGE',
+ payload: newPage
+ })
}
+
+ // Get session information when the component did mount
+ React.useEffect(() => {
+ const contrast = sessionStorage.getItem('contrast');
+ if (contrast) setContrastAction(contrast);
+ const page = sessionStorage.getItem('page');
+ if (page) setPageAction(page);
+ }, []);
+
+ var contrastString = state.contrast
+
+ return (
+ <React.Fragment>
+ <div id={`${contrastString}mainPage`}>
+ <ContrastBar />
+ <BarraBrasil />
+ <Router>
+ <div>
+ <Route exact={true} path="/" component={MainPage} />
+ <Route exact={true} path="/cotas" component={RacialQuotas} />
+ <Route exact={true} path="/quilombola" component={Quilombola} />
+ <Route exact={true} path="/sobre" component={About} />
+ <Route exact={true} path="/quilombolas" component={Quilombolas} />
+ <Route exact={true} path="/juventude" component={Youth} />
+ <Route exact={true} path="/mapas" component={Maps} />
+ <Route exact={true} path="/matrizAfricana" component={AfricanOrigin} />
+ </div>
+ </Router>
+ <AppFooter />
+ </div>
+ </React.Fragment>
+ );
}
export default App;
\ No newline at end of file
diff --git a/src/Charts/BuildMixedBar.js b/src/Charts/BuildMixedBar.js
index da0d57e810155fe835c150ec51da530c5a417845..8a23c7f3465c39175b89d69a3c4a16fc49b37733 100644
--- a/src/Charts/BuildMixedBar.js
+++ b/src/Charts/BuildMixedBar.js
@@ -58,25 +58,25 @@ const renderTooltipContent = (o) => {
);
};
-const renderCustomizedLabel = (props) => {
- const { x, y, width, height, value } = props;
- const radius = 10;
-
- return (
- <g>
- <circle cx={x + width / 2} cy={y - radius} r={radius} fill="#000" />
- <text x={x + width / 2} y={y - radius} fill="#fff" textAnchor="middle" dominantBaseline="middle">
- {value}
- </text>
- </g>
- );
-};
+// const renderCustomizedLabel = (props) => {
+// const { x, y, width, height, value } = props;
+// const radius = 10;
+
+// return (
+// <g>
+// <circle cx={x + width / 2} cy={y - radius} r={radius} fill="#000" />
+// <text x={x + width / 2} y={y - radius} fill="#fff" textAnchor="middle" dominantBaseline="middle">
+// {value}
+// </text>
+// </g>
+// );
+// };
function verifyKeyBar(bar, keysBars) {
let verifiedKey = 'a'
- if (keysBars != undefined) {
+ if (keysBars !== undefined) {
for (let key in keysBars) {
- if (bar == key) verifiedKey = keysBars[key]
+ if (bar === key) verifiedKey = keysBars[key]
}
}
return verifiedKey
@@ -113,7 +113,6 @@ class BuildStackedBar extends Component {
}
var dataKey = this.props.dataKey
var label = this.props.label
- var bKeys = this.props.bKeys
var keysBars = this.props.keysBars
if (this.state.data !== null && this.state.data !== undefined && this.state.data.length > 0)
@@ -129,7 +128,7 @@ class BuildStackedBar extends Component {
{Object.keys(newData[0]).map(function (bar, index) {
if (bar !== dataKey) {
if (bar !== label) {
- if (label == undefined)
+ if (label === undefined)
return (
<Bar
isAnimationActive = {false}
diff --git a/src/Charts/BuildStackedBar.js b/src/Charts/BuildStackedBar.js
index 1e3c656320893e9f2bda9778d115ac10c3cc9c43..a32e7bfea6df0a7bec5890a716ed3906770a8185 100644
--- a/src/Charts/BuildStackedBar.js
+++ b/src/Charts/BuildStackedBar.js
@@ -60,19 +60,19 @@ const renderTooltipContent = (o) => {
);
};
-const renderCustomizedLabel = (props) => {
- const { x, y, width, height, value } = props;
- const radius = 10;
-
- return (
- <g>
- <circle cx={x + width / 2} cy={y - radius} r={radius} fill="#000" />
- <text x={x + width / 2} y={y - radius} fill="#fff" textAnchor="middle" dominantBaseline="middle">
- {value}
- </text>
- </g>
- );
-};
+// const renderCustomizedLabel = (props) => {
+// const { x, y, width, height, value } = props;
+// const radius = 10;
+
+// return (
+// <g>
+// <circle cx={x + width / 2} cy={y - radius} r={radius} fill="#000" />
+// <text x={x + width / 2} y={y - radius} fill="#fff" textAnchor="middle" dominantBaseline="middle">
+// {value}
+// </text>
+// </g>
+// );
+// };
class BuildStackedBar extends Component {
constructor(props) {
@@ -118,7 +118,7 @@ class BuildStackedBar extends Component {
<Legend />
{ Object.keys(newData[0]).map(function(bar, index) {
if(bar !== dataKey) {
- if(label == undefined) {
+ if(label === undefined) {
return <Bar isAnimationActive={false} key={Math.random()} dataKey={bar} stackId="a" fill={COLORS[index]} />
}
else if(bar !== label) {
diff --git a/src/Components/AppFooter.js b/src/Components/AppFooter.js
index 8dcb4b58e6c62cc948b60c89c0ce20773866b923..6cee263e2dc7e10a80d69243ffb4165d81db9978 100644
--- a/src/Components/AppFooter.js
+++ b/src/Components/AppFooter.js
@@ -19,47 +19,41 @@ along with Portal-SMPPIR-React. If not, see <https://www.gnu.org/licenses/>.
*/
-
-import React, { Component } from 'react';
+import React from 'react';
import { Footer } from 'react-materialize'
import ColorfulBar from './ColorfulBar'
import ContactForm from './ContactForm'
import Partner from './Partner'
-import Cookies from 'universal-cookie';
-
import '../Styles/AppFooter.css'
+import { Store } from '../Store'
-var contrastCK = new Cookies();
-var cookieStatus = contrastCK.get('contrast');
+function AppFooter() {
+
+ const { state } = React.useContext(Store);
-class AppFooter extends Component {
- render() {
- // var contrastString = '';
- var dynamicClassName = 'smppir-blue';
- var dynamicBackgroundColor = 'white';
- if(cookieStatus === 'true'){
- // contrastString = 'Contrast'
- dynamicClassName = 'smppir-white';
- dynamicBackgroundColor = 'black'
- }
- return (
- <div>
- <ColorfulBar/>
- <Footer className={dynamicBackgroundColor}
- links={
- <div>
- <ContactForm />
- </div>
- }
- >
- <h4 className={dynamicClassName}>PARCEIROS</h4>
- <Partner />
-
- </Footer>
- </div>
- );
+ var dynamicClassName = 'smppir-blue';
+ var dynamicBackgroundColor = 'white';
+ if (state.contrast === 'Contrast'){
+ dynamicClassName = 'smppir-white';
+ dynamicBackgroundColor = 'black'
}
+ return (
+ <div>
+ <ColorfulBar/>
+ <Footer className={dynamicBackgroundColor}
+ links={
+ <div>
+ <ContactForm />
+ </div>
+ }
+ >
+ <h4 className={dynamicClassName}>PARCEIROS</h4>
+ <Partner />
+
+ </Footer>
+ </div>
+ );
}
export default AppFooter;
\ No newline at end of file
diff --git a/src/Components/BarraBrasil.js b/src/Components/BarraBrasil.js
index 8cbaafe467365d549c1d65eefba688896779c04c..210cb5f0fcf2ff9b54e66e5b02135ea27646d526 100644
--- a/src/Components/BarraBrasil.js
+++ b/src/Components/BarraBrasil.js
@@ -19,40 +19,38 @@ along with Portal-SMPPIR-React. If not, see <https://www.gnu.org/licenses/>.
*/
-
-import React, { Component } from 'react';
+import React from 'react';
import '../Styles/BarraBrasil.css'
-import Cookies from 'universal-cookie';
-
-var contrastCK = new Cookies();
-var cookieStatus = contrastCK.get('contrast');
-
-
-class NavigationBar extends Component {
- render() {
- var body = document.getElementsByTagName("body")[0];
- if(cookieStatus === 'true'){
- body.classList.add("contraste");
- }
- return (
- <div id={"nav-brasil"}>
- <div id={"barra-brasil"}>
- <ul id={"menu-barra-temp"}>
- <li id={"barra-brasil-li"}>
- <a href={"http://brasil.gov.br"} id={"barra-brasil-link1"}>
- Portal do Governo Brasileiro
- </a>
- </li>
- <li>
- <a id={"barra-brasil-link1"} href={"http://epwg.governoeletronico.gov.br/barra/atualize.html"}>
- Atualize sua Barra de Governo
- </a>
- </li>
- </ul>
- </div>
- </div>
- );
+import { Store } from '../Store'
+
+
+function NavigationBar() {
+ var body = document.getElementsByTagName("body")[0];
+ const { state } = React.useContext(Store);
+
+ if(state.contrast === 'Contrast'){
+ body.classList.add("contraste");
+ } else {
+ body.classList.remove("contraste");
}
+ return (
+ <div id={"nav-brasil"}>
+ <div id={"barra-brasil"}>
+ <ul id={"menu-barra-temp"}>
+ <li id={"barra-brasil-li"}>
+ <a href={"http://brasil.gov.br"} id={"barra-brasil-link1"}>
+ Portal do Governo Brasileiro
+ </a>
+ </li>
+ <li>
+ <a id={"barra-brasil-link1"} href={"http://epwg.governoeletronico.gov.br/barra/atualize.html"}>
+ Atualize sua Barra de Governo
+ </a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ );
}
export default NavigationBar;
\ No newline at end of file
diff --git a/src/Components/ContactForm.js b/src/Components/ContactForm.js
index 0cbb5cfba2d476b8d682c00fbdbe5ecd4e466479..388755d35bf76a0ce0e4734a7263fd6a56dd8eeb 100644
--- a/src/Components/ContactForm.js
+++ b/src/Components/ContactForm.js
@@ -19,31 +19,25 @@ along with Portal-SMPPIR-React. If not, see <https://www.gnu.org/licenses/>.
*/
-
import React, { Component } from 'react';
import { Row, Input, Icon, Button } from 'react-materialize'
import '../Styles/ContactForm.css'
-import Cookies from 'universal-cookie';
-
-var contrastCK = new Cookies();
-var cookieStatus = contrastCK.get('contrast');
+import { Store } from '../Store'
-// /{`${contrastString}mainPage`}
function validEmailSyntax(email) {
let regex = /^(([^<>()[].,;:s@"]+(.[^<>()[].,;:s@"]+)*)|(".+"))@(([^<>()[].,;:s@"]+.)+[^<>()[].,;:s@"]{2,})$/i;
return regex.test(email);
}
-
class ContactForm extends Component {
render() {
- var contrastString = '';
+
+ var contrastString = this.context.state.contrast;
var dynamicClassName = 'smppir-blue';
var dynamicEmailClassName = 'smppir-blue emailForm';
var dynamicTextClassname = 'smppir-blue-text';
- if(cookieStatus === 'true'){
- contrastString = 'Contrast';
+ if (contrastString === 'Contrast'){
dynamicClassName = 'smppir-white';
dynamicEmailClassName = 'smppir-white emailForm';
dynamicTextClassname = 'smppir-white-text';
@@ -113,5 +107,6 @@ class ContactForm extends Component {
}
}
+ContactForm.contextType = Store;
export default ContactForm;
diff --git a/src/Components/ContrastBar.js b/src/Components/ContrastBar.js
index 790deecdc5cf5e5f0f79abd71fa68a2d8a4e3c34..2d879bca326a9fa42407c628ea85fe4b4875ecde 100644
--- a/src/Components/ContrastBar.js
+++ b/src/Components/ContrastBar.js
@@ -19,58 +19,41 @@ along with Portal-SMPPIR-React. If not, see <https://www.gnu.org/licenses/>.
*/
-
-import React, { Component } from 'react';
+import React from 'react';
import '../Styles/ContrastBar.css'
-import Cookies from 'universal-cookie';
import ContrastImageOn from '../Images/OnContrastIcon.png'
import ContrastImageOff from'../Images/OffContrastIcon.png'
+import { Store } from '../Store'
-var contrastCK = new Cookies();
-var cookieStatus = contrastCK.get('contrast');
-
-class ContrastBar extends Component {
-
- constructor(props){
- super(props);
- this.toggleContrast = this.toggleContrast.bind(this);
+function ContrastBar() {
+
+ // Hook to set contrast context
+ const { state, dispatch } = React.useContext(Store);
+ const setContrastAction = (newContrast) => {
+ return dispatch({
+ type: 'SET_CONTRAST',
+ payload: newContrast
+ })
}
+ React.useEffect(() => { });
- componentWillMount(){
- let ck = contrastCK.get('contrast');
- if(!ck){
- contrastCK.set('contrast', 'false');
- }
+ const toggleContrast = () => {
+ var status = (state.contrast === '' ? 'Contrast' : '')
+ setContrastAction(status)
}
- render() {
- var contrastString = '';
- var contrastIcon = ContrastImageOff;
- if(cookieStatus === 'true'){
- contrastString = 'Contrast';
- contrastIcon = ContrastImageOn
- }
- return (
- <div className={`${contrastString}bar`}>
- <div className={`${contrastString}text`} onClick={this.toggleContrast}>
- <img src={contrastIcon} style={{marginRight: 5}} alt="ContrastIcon" width="11" height="11"/>
- Alto Contraste
- </div>
- </div>
- );
- }
+ var contrastString = state.contrast;
+ var contrastIcon = (contrastString === '' ? ContrastImageOff : ContrastImageOn)
+
+ return (
+ <div className={`${contrastString}bar`}>
+ <div className={`${contrastString}text`} onClick={toggleContrast}>
+ <img src={contrastIcon} style={{marginRight: 5}} alt="ContrastIcon" width="11" height="11"/>
+ Alto Contraste
+ </div>
+ </div>
+ );
- toggleContrast(){
- var status = contrastCK.get('contrast');
- if(status === 'false'){
- status = true;
- }
- else{
- status = false;
- }
- contrastCK.set('contrast', status);
- window.location.reload();
- }
}
export default ContrastBar;
\ No newline at end of file
diff --git a/src/Components/DropdownControl.js b/src/Components/DropdownControl.js
index c0c3e3d5cb500b213c5cf7760d69a2795b3314e2..ccc70dd0f211eb68550c06a323a94bb7328eaf3b 100644
--- a/src/Components/DropdownControl.js
+++ b/src/Components/DropdownControl.js
@@ -24,15 +24,12 @@ import React, { Component } from 'react';
import { Row, Input, Button, Icon } from 'react-materialize';
import axios from 'axios';
import { getDDValue, getServerURL, getStateRegion } from '../enviroment';
-import Cookies from 'universal-cookie';
+import { Store } from '../Store'
import '../Styles/DropdownControl.css';
const serverURL = getServerURL();
-var contrastCK = new Cookies();
-var cookieStatus = contrastCK.get('contrast');
-var contrastString = '';
export default class DropdownControl extends Component {
constructor(props) {
@@ -62,10 +59,9 @@ export default class DropdownControl extends Component {
}
render() {
- if(cookieStatus === 'true'){
- contrastString = 'Contrast'
- }
- return (
+
+ var contrastString = this.context.state.contrast;
+ return (
<Row>
<Row>
<Row>
@@ -83,6 +79,7 @@ export default class DropdownControl extends Component {
)
}
clearFields() {
+ var contrastString = this.context.state.contrast;
this.setState(
{
region:'Todas as regiões',
@@ -107,10 +104,7 @@ export default class DropdownControl extends Component {
const listItems = regions.map((region) =>
<option key={Math.random()} value={region} > { region } </option>
);
- var contrastString = '';
- if(cookieStatus === 'true'){
- contrastString = 'Contrast'
- }
+ var contrastString = this.context.state.contrast;
return (
<Input s={12} className={`${contrastString}inputRegiao`} id={"regiao" + this.props.location} type='select' label="Região" value={this.state.region} onChange={(event)=>{ this.changeRegion(event); this.handleSelect(event) }} >
{ listItems }
@@ -125,8 +119,9 @@ export default class DropdownControl extends Component {
{ state.state }
</option>
);
+ var contrastString = this.context.state.contrast;
return (
- <Input s={12} id={"estado" + this.props.location} type='select' label="Estado" value={this.state.clickedState} onChange={(event)=>{ this.changeState(event); this.handleSelect(event) }}>
+ <Input s={12} className={`${contrastString}inputRegiao`} id={"estado" + this.props.location} type='select' label="Estado" value={this.state.clickedState} onChange={(event)=>{ this.changeState(event); this.handleSelect(event) }}>
{ listItems }
</Input>
);
@@ -172,6 +167,7 @@ export default class DropdownControl extends Component {
}
}
+DropdownControl.contextType = Store;
function search(nameKey, myArray) {
var returnItems = [];
diff --git a/src/Components/MainBanner.js b/src/Components/MainBanner.js
index 045a3131362171fddd676e6be2fe4842c656608b..025392c46529b400806e397041ea97cdc9ba1cd2 100644
--- a/src/Components/MainBanner.js
+++ b/src/Components/MainBanner.js
@@ -20,48 +20,42 @@ along with Portal-SMPPIR-React. If not, see <https://www.gnu.org/licenses/>.
-import React, { Component } from 'react';
+import React from 'react';
import logo from '../Images/SMPPIRBanner.png';
import contrastLogo from '../Images/SMPPIRBannerContrast.png'
-import BarraBrasil from './BarraBrasil'
import { Card, Row, Col } from 'react-materialize'
-import Cookies from 'universal-cookie';
-
import '../Styles/MainBanner.css'
+import { Store } from '../Store'
-var contrastCK = new Cookies();
-var cookieStatus = contrastCK.get('contrast');
var img = logo;
-//{`${contrastString}mainPage`}
-
-class MainBanner extends Component {
- render() {
- var contrastString = '';
- if(cookieStatus === 'true'){
- contrastString = 'Contrast'
- img = contrastLogo;
- }
- return (
- <div>
- <BarraBrasil />
- <Card id={`${contrastString}mainBannerCard`}>
- <Row>
- <Col s={12} m={6}>
- <img alt='Logo do SMPPIR com descrição' id={'bannerLogo'} src={img} style={{width: 250}}/>
- </Col>
- <Col s={12} m={4} offset={'m1'}>
- <h5 id={`${contrastString}bannerTitle`}>Monitorar é preciso</h5>
- <p id={`${contrastString}bannerText`}>
- O objetivo do sistema de monitoramento é dar visibilidade à s demandas sociais e à atuação do Estado, de maneira a promover um melhor diálogo social e aprimorar a eficiência e eficácia das polÃticas públicas.
- </p>
- <a id={`${contrastString}mainBannerLink`} href='/'>SAIBA MAIS</a>
- </Col>
- </Row>
- </Card>
- </div>
- );
- }
+function MainBanner() {
+
+ const { state } = React.useContext(Store);
+ var contrastString = state.contrast;
+ if(contrastString === '')
+ img = logo;
+ else
+ img = contrastLogo;
+
+ return (
+ <div>
+ <Card id={`${contrastString}mainBannerCard`}>
+ <Row>
+ <Col s={12} m={6}>
+ <img alt='Logo do SMPPIR com descrição' id={'bannerLogo'} src={img} style={{width: 250}}/>
+ </Col>
+ <Col s={12} m={4} offset={'m1'}>
+ <h5 id={`${contrastString}bannerTitle`}>Monitorar é preciso</h5>
+ <p id={`${contrastString}bannerText`}>
+ O objetivo do sistema de monitoramento é dar visibilidade à s demandas sociais e à atuação do Estado, de maneira a promover um melhor diálogo social e aprimorar a eficiência e eficácia das polÃticas públicas.
+ </p>
+ <a id={`${contrastString}mainBannerLink`} href='/'>SAIBA MAIS</a>
+ </Col>
+ </Row>
+ </Card>
+ </div>
+ );
}
export default MainBanner;
\ No newline at end of file
diff --git a/src/Components/MainCard.js b/src/Components/MainCard.js
index feea7f9a115d01bec3742ae13a58ebc6e6e5ef5e..665e8145c9c28eb2f06a7bc21cf861f49d1f61dc 100644
--- a/src/Components/MainCard.js
+++ b/src/Components/MainCard.js
@@ -19,55 +19,54 @@ along with Portal-SMPPIR-React. If not, see <https://www.gnu.org/licenses/>.
*/
-
-import React, { Component } from 'react';
+import React from 'react';
+import { Link } from 'react-router-dom'
import { Card, CardTitle } from 'react-materialize'
-import Cookies from 'universal-cookie';
import '../Styles/MainCard.css'
+import { Store } from '../Store';
-var ck = new Cookies();
-var contrastCK = new Cookies();
-var cookieStatus = contrastCK.get('contrast');
-class MainCard extends Component {
-
- constructor(props) {
- super(props);
- this.setCookie = this.setCookie.bind(this);
- }
+function createRoutes(subpages, color) {
- setCookie(e) {
- ck.set('mainPageClicked',e.target.text);
+ // Hook to set page context
+ const { dispatch } = React.useContext(Store);
+ const setPageAction = (newPage) => {
+ window.scrollTo(0, 0)
+ return dispatch({
+ type: 'SET_PAGE',
+ payload: newPage
+ })
}
- render() {
+ React.useEffect(()=>{});
- var { color, title, subpages, text, image } = this.props;
- var contrastString = '';
- if(cookieStatus === 'true'){
- contrastString = 'Contrast';
- color = 'mainPageContrast'
- }
- return (
- <div>
- <Card className={`${contrastString}card-MainPage`} header={<CardTitle reveal image={require('../Images/'+image)} waves='light'/>}
- title={title}
- reveal={<div>{text}</div>}>
- {this.createRoutes(subpages, color)}
- </Card>
- </div>
- );
- }
-//
- createRoutes(subpages, color) {
- const listItems = subpages['links'].map((subp, i) =>
- <a onClick={this.setCookie} key={subp} className={color+' waves-effect waves spacingInCard'} href={subpages['route']} >
- {subp}
- </a>
- );
- return (
- <div className={'listMainPage'}>{listItems}</div>
- );
- }
+ const listItems = subpages['links'].map((subp, i) =>
+ <Link onClick={() => { setPageAction(subp) }} key={subp} className={color + ' waves-effect waves spacingInCard'} to={subpages['route']} >
+ {subp}
+ </Link>
+ );
+ return (
+ <div className={'listMainPage'}>{listItems}</div>
+ );
+}
+
+function MainCard(props){
+
+ const { state } = React.useContext(Store);
+ var { color, title, subpages, text, image } = props;
+ var contrastString = state.contrast;
+
+ if (contrastString === "Contrast")
+ color = 'mainPageContrast'
+
+ return (
+ <div>
+ <Card className={`${contrastString}card-MainPage`} header={<CardTitle reveal image={require('../Images/'+image)} waves='light'/>}
+ title={title}
+ reveal={<div>{text}</div>}>
+ {createRoutes(subpages, color)}
+ </Card>
+ </div>
+ );
}
export default MainCard;
\ No newline at end of file
diff --git a/src/Components/MapPanel.js b/src/Components/MapPanel.js
index 11d9989ceae1cde73478eaa66899bdf4043647c6..ad457159c01d68714cf7772bc8cac4304cc3d022 100644
--- a/src/Components/MapPanel.js
+++ b/src/Components/MapPanel.js
@@ -26,10 +26,8 @@ import DropdownControl from './DropdownControl'
import Map from './Map';
import '../Styles/MapPanel.css';
import { getStateRegion, activateLoadingAnimation } from '../enviroment';
-import Cookies from 'universal-cookie';
+import { Store } from '../Store'
-var contrastCK = new Cookies();
-var cookieStatus = contrastCK.get('contrast');
const title = "Selecione um estado ou região para filtrar os dados";
export default class MapPanel extends Component {
@@ -44,10 +42,7 @@ export default class MapPanel extends Component {
this.getData = this.getData.bind(this);
}
render() {
- var contrastString = '';
- if(cookieStatus === 'true'){
- contrastString = 'Contrast'
- }
+ var contrastString = this.context.state.contrast;
return (
<div className='MapPanel'>
<Row className="mappanel-margin">
@@ -93,3 +88,4 @@ export default class MapPanel extends Component {
activateLoadingAnimation(this.props.location)
}
}
+MapPanel.contextType = Store;
\ No newline at end of file
diff --git a/src/Components/NavigationBar.js b/src/Components/NavigationBar.js
index 0217ef2f602420530c96a12494bace8654c57669..4358cde2a9a5c7e62b5d58aa8ab91cccfe44995a 100644
--- a/src/Components/NavigationBar.js
+++ b/src/Components/NavigationBar.js
@@ -19,47 +19,63 @@ along with Portal-SMPPIR-React. If not, see <https://www.gnu.org/licenses/>.
*/
-
-import React, { Component } from 'react';
+import React from 'react';
import logo from '../Images/PortalLogo.png';
import logoContrast from '../Images/PortalLogoContrast.png'
-import BarraBrasil from './BarraBrasil'
-import { Navbar, NavItem } from 'react-materialize'
-import Cookies from 'universal-cookie';
-
-
+import { SideNav } from 'react-materialize'
import '../Styles/NavigationBar.css'
+import { Store } from '../Store'
+import { Link } from 'react-router-dom'
+
-var contrastCK = new Cookies();
-var cookieStatus = contrastCK.get('contrast');
-class NavigationBar extends Component {
+function NavigationBar() {
- render() {
- var actualPath = window.location.href.split("/")
- actualPath = actualPath[actualPath.length-1]
- var logoSMPPIR = logo;
- var contrastString = '';
- if(cookieStatus === 'true'){
- logoSMPPIR = logoContrast;
- contrastString = 'Contrast'
- }
- return (
- <div>
- <BarraBrasil />
- <Navbar className={`${contrastString}navBackground z-depth-2`} brand={<img alt='Logo do SMPPIR' id={'portal-logo'} src={logoSMPPIR} style={{width: 200, marginLeft: 20, marginTop: 15}}/>} right>
- <NavItem onClick={this.removeCSS} id={`${contrastString}navBarInicio`} className={'z-depth-0 '+actualPath} href='/'>InÃcio</NavItem>
- <NavItem onClick={this.removeCSS} id={`${contrastString}navBarBrasilQ`} className={'z-depth-0 '+actualPath} href='/quilombolas'>Brasil Quilombola</NavItem>
- <NavItem onClick={this.removeCSS} id={`${contrastString}navBarJuventudeV`} className={'z-depth-0 '+actualPath} href='/juventude'>Juventude Viva</NavItem>
- {/* <NavItem onClick={this.removeCSS} id={`${contrastString}navBarMapas`} className={'z-depth-0 '+actualPath} href='/mapas'>Mapas</NavItem> */}
- <NavItem onClick={this.removeCSS} id={`${contrastString}navBarMatrizAficana`} className={'z-depth-0 '+actualPath} href='/matrizAfricana'>Matriz Africana</NavItem>
- <NavItem onClick={this.removeCSS} id={`${contrastString}navBarBrasilQU`} className={'z-depth-0 '+actualPath} href='/quilombola'>Quilombolas</NavItem>
- <NavItem onClick={this.removeCSS} id={`${contrastString}navBarCotasRacias`} className={'z-depth-0 '+actualPath} href='/cotas'>Cotas Raciais</NavItem>
- <NavItem onClick={this.removeCSS} id={`${contrastString}navBarSobre`} className={'z-depth-0 '+actualPath} href='/sobre'>Sobre</NavItem>
- </Navbar>
- </div>
- );
+ var actualPath = window.location.href.split("/")
+ actualPath = actualPath[actualPath.length-1]
+ var logoSMPPIR = logo;
+
+ const { state } = React.useContext(Store);
+ var contrastString = state.contrast;
+ if (contrastString === 'Contrast'){
+ logoSMPPIR = logoContrast;
}
+
+ let links = (
+ <React.Fragment>
+ {/* <li id={`${contrastString}navBarInicio`} className={'z-depth-0 ' + actualPath}><Link to='/'>InÃcio</Link></li> */}
+ <li id={`${contrastString}navBarBrasilQ`} className={'z-depth-0 ' + actualPath}><Link to='/quilombolas'>Brasil Quilombola</Link></li>
+ <li id={`${contrastString}navBarJuventudeV`} className={'z-depth-0 '+actualPath}><Link to='/juventude'>Juventude Viva</Link></li>
+ <li id={`${contrastString}navBarMatrizAficana`} className={'z-depth-0 '+actualPath}><Link to='/matrizAfricana'>Matriz Africana</Link></li>
+ <li id={`${contrastString}navBarBrasilQU`} className={'z-depth-0 '+actualPath}><Link to='/quilombola'>Quilombolas</Link></li>
+ <li id={`${contrastString}navBarCotasRacias`} className={'z-depth-0 '+actualPath}><Link to='/cotas'>Cotas Raciais</Link></li>
+ <li id={`${contrastString}navBarSobre`} className={'z-depth-0 '+actualPath}><Link to='/sobre'>Sobre</Link></li>
+ </React.Fragment>
+ )
+
+ let content = (
+ <nav className={`${contrastString}navBackground z-depth-2`} style={{ height: 65 }}>
+ <div className="nav-wrapper">
+
+ <Link className="brand-logo hide-on-med-and-down" to='/'>
+ <img alt='Logo do SMPPIR' id={'portal-logo'} src={logoSMPPIR} style={{ width: 200, marginLeft: 20, marginTop: 15 }} />
+ </Link>
+ <Link className="brand-logo center hide-on-large-only" to='/'>
+ <img alt='Logo do SMPPIR' id={'portal-logo'} src={logoSMPPIR} style={{ width: 200, marginLeft: 20, marginTop: 15 }} />
+ </Link>
+
+ <ul className="right hide-on-med-and-down">{links}</ul>
+
+ <div className="left hide-on-large-only">
+ <SideNav className={`${contrastString}navBackground`} trigger={<a href=""><i className={`material-icons ${contrastString}navIcon`} style={{ marginLeft: 20 }}>menu</i></a>} options={{closeOnClick:true}}>
+ {links}
+ </SideNav>
+ </div>
+
+ </div>
+ </nav>
+ )
+ return content;
}
export default NavigationBar;
\ No newline at end of file
diff --git a/src/MainPage.js b/src/MainPage.js
index 331d6af4cf18d53bcd9c761de09a8a0794fced02..1ddc27a7552b79e2a1d61fdcfab01cf9eea378eb 100644
--- a/src/MainPage.js
+++ b/src/MainPage.js
@@ -18,60 +18,48 @@ You should have received a copy of the GNU General Public License
along with Portal-SMPPIR-React. If not, see <https://www.gnu.org/licenses/>.
*/
-
-
-import React, { Component } from 'react';
+import React from 'react';
import MainBanner from './Components/MainBanner'
-import AppFooter from './Components/AppFooter'
import MainCard from './Components/MainCard'
import { Col, Row } from 'react-materialize'
-import Cookies from 'universal-cookie';
-import ContrastBar from './Components/ContrastBar'
import './Styles/MainPage.css'
+import { Store } from './Store'
-var contrastCK = new Cookies();
-var cookieStatus = contrastCK.get('contrast');
+function MainPage() {
-class MainPage extends Component {
+ const { state } = React.useContext(Store);
+ var contrastString = state.contrast;
- render() {
- var contrastString = '';
- if(cookieStatus === 'true'){
- contrastString = 'Contrast'
- }
- return (
- <div id={`${contrastString}mainPage`}>
- <ContrastBar/>
- <MainBanner />
- <Row/>
- <Row style={undefined}>
- <Col m={12} l={5} offset={'l1'}>
- <MainCard color='mainPageRed' title='Brasil Quilombola' subpages={subpages1} text={text1} image={'brasil_quilombola.png'}/>
- </Col>
- <Col m={12} l={5} className={'mainPageMargin'}>
- <MainCard color='mainPageTeal' title='Juventude Viva' subpages={subpages2} text={text2} image={'juventude_viva.png'}/>
- </Col>
- </Row>
- <Row>
- {/* <Col m={12} l={5} offset={'l1'}>
- <MainCard color='mainPageOrange' title='Mapas' subpages={subpages3} text={text3} image={'mapas.png'}/>
- </Col> */}
- <Col m={12} l={10} offset={'l1'} className={'mainPageMargin'}>
- <MainCard color='mainPageDarkBlue' title='Matriz Africana' subpages={subpages4} text={text4} image={'matriz_africana4.png'}/>
- </Col>
- </Row>
- <Row>
- <Col m={12} l={5} offset={'l1'} className={'mainPageMargin'} id='soloCard'>
- <MainCard color='mainPageGreen' title='Cotas Raciais' subpages={subpages5} text={text5} image={'cotas_raciais.png'}/>
- </Col>
- <Col m={12} l={5} className={'mainPageMargin'} id='soloCard'>
- <MainCard color='mainPageRed' title='Quilombola' subpages={subpages6} text={text6} image={'brasil_quilombola.png'}/>
- </Col>
- </Row>
- <AppFooter />
- </div>
- );
- }
+ return (
+ <div id={`${contrastString}mainPage`}>
+ <MainBanner />
+ <Row/>
+ <Row style={undefined}>
+ <Col m={12} l={5} offset={'l1'}>
+ <MainCard color='mainPageRed' title='Brasil Quilombola' subpages={subpages1} text={text1} image={'brasil_quilombola.png'}/>
+ </Col>
+ <Col m={12} l={5} className={'mainPageMargin'}>
+ <MainCard color='mainPageTeal' title='Juventude Viva' subpages={subpages2} text={text2} image={'juventude_viva.png'}/>
+ </Col>
+ </Row>
+ <Row>
+ {/* <Col m={12} l={5} offset={'l1'}>
+ <MainCard color='mainPageOrange' title='Mapas' subpages={subpages3} text={text3} image={'mapas.png'}/>
+ </Col> */}
+ <Col m={12} l={10} offset={'l1'} className={'mainPageMargin'}>
+ <MainCard color='mainPageDarkBlue' title='Matriz Africana' subpages={subpages4} text={text4} image={'matriz_africana4.png'}/>
+ </Col>
+ </Row>
+ <Row>
+ <Col m={12} l={5} offset={'l1'} className={'mainPageMargin'} id='soloCard'>
+ <MainCard color='mainPageGreen' title='Cotas Raciais' subpages={subpages5} text={text5} image={'cotas_raciais.png'}/>
+ </Col>
+ <Col m={12} l={5} className={'mainPageMargin'} id='soloCard'>
+ <MainCard color='mainPageRed' title='Quilombola' subpages={subpages6} text={text6} image={'brasil_quilombola.png'}/>
+ </Col>
+ </Row>
+ </div>
+ );
}
const text1 = <div>
<p>Programa Brasil Quilombola (PBQ) reúne ações do Governo Federal para as comunidades quilombolas nas seguintes áreas:</p>
diff --git a/src/Quilombola.js b/src/Quilombola.js
index fa6574aa38ca2dea9c540f6e93f8d840b861b264..908dcbdabe8a3f1f45d675c2549e5655092c8d68 100644
--- a/src/Quilombola.js
+++ b/src/Quilombola.js
@@ -21,80 +21,56 @@ along with Portal-SMPPIR-React. If not, see <https://www.gnu.org/licenses/>.
/* Esse arquivo contém dados historicos sobre quilombolas, como se fosse um "quilombolas 2.0" */
-import React, { Component } from 'react';
+import React from 'react';
import NavigationBar from './Components/NavigationBar'
-import AppFooter from './Components/AppFooter'
import { Tab, Tabs } from 'react-materialize';
import './Styles/Quilombolas.css';
-import Cookies from 'universal-cookie';
-import {sleep, homeURL} from './enviroment'
-import ContrastBar from './Components/ContrastBar'
import QuilombolaIndicator1 from './SubPages/QuilombolaIndicator1'
import QuilombolaIndicator2 from './SubPages/QuilombolaIndicator2'
import QuilombolaIndicator3 from './SubPages/QuilombolaIndicator3'
+import { Store } from './Store';
-var ck = new Cookies();
-var contrastCK = new Cookies();
-var cookieStatus = contrastCK.get('contrast');
-class Quilombola extends Component {
- constructor(props) {
- super(props);
- this.whereIAm = this.whereIAm.bind(this);
- }
+function Quilombola() {
- componentDidMount() {
- this.whereIAm()
+ // Get information about which page was accessed
+ const { state, dispatch } = React.useContext(Store);
+ var states = {"EIXO 2": false,"EIXO 3": false,"EIXO 4": false}
+ if (state.page in states) {
+ states[state.page] = true
+ }
+ else {
+ states["EIXO 2"] = true
}
- render() {
- var contrastString = '';
- if(cookieStatus === 'true'){
- contrastString = 'Contrast'
- }
- const cookie = new Cookies();
- var clicked = cookie.get('mainPageClicked')
- var states = {"EIXO 2": true,"EIXO 3": false,"EIXO 4": false}
- if (clicked !== undefined){
- if (clicked in states){
- states["EIXO 2"] = false;
- states[clicked] = true;
- }
- else{
- states = {"EIXO 2": true}
- ck.set('mainPageClicked', 'EIXO 2');
- }
- }
- else{
- // Redirect user to the main page if he/she do not have a cookie
- window.location.href = homeURL()
- }
- return (
- <div id={`${contrastString}mainPage`}>
- <ContrastBar/>
- <NavigationBar/>
- <div id='contentTabsDiv'>
- <Tabs className={`tab-demo z-depth-1 ${contrastString}mainPageRedTab`} onChange={this.whereIAm}>
- <Tab title="EIXO 2" active={states["EIXO 2"]}> <QuilombolaIndicator1/> </Tab>
- <Tab title="EIXO 3" active={states["EIXO 3"]}> <QuilombolaIndicator2/> </Tab>
- <Tab title="EIXO 4" active={states["EIXO 4"]}> <QuilombolaIndicator3/> </Tab>
- </Tabs>
- </div>
- <AppFooter/>
- </div>
- );
+ // Hook to set page context
+ const setPageAction = (newPage) => {
+ return dispatch({
+ type: 'SET_PAGE',
+ payload: newPage
+ })
}
+ React.useEffect(() => { });
- whereIAm(e, ev){
- if(ev){
- ck.set('mainPageClicked', ev.target.innerText);
- this.setState({visited:ev.target.innerText});
- }
- sleep(1).then(() => {
- if(document.getElementsByClassName('clearmapbtn')[0])
- document.getElementsByClassName('clearmapbtn')[0].click()
- });
+ const whereIAm = (e, ev) => {
+ if (ev)
+ setPageAction(ev.target.innerText)
}
+
+ var contrastString = state.contrast
+
+ return (
+ <div id={`${contrastString}mainPage`}>
+ <NavigationBar/>
+ <div id='contentTabsDiv'>
+ <Tabs className={`tab-demo z-depth-1 ${contrastString}mainPageRedTab`} onChange={whereIAm}>
+ <Tab title="EIXO 2" active={states["EIXO 2"]}> {states["EIXO 2"] ? <QuilombolaIndicator1 /> : <div/>} </Tab>
+ <Tab title="EIXO 3" active={states["EIXO 3"]}> {states["EIXO 3"] ? <QuilombolaIndicator2 /> : <div/>} </Tab>
+ <Tab title="EIXO 4" active={states["EIXO 4"]}> {states["EIXO 4"] ? <QuilombolaIndicator3 /> : <div/>} </Tab>
+ </Tabs>
+ </div>
+ </div>
+ );
}
export default Quilombola;
diff --git a/src/Quilombolas.js b/src/Quilombolas.js
index eb26bc6c2a4cede05d697e24d57d2742e5259c81..ec609858e8f316ea3acf464f83e647d1f4b83930 100644
--- a/src/Quilombolas.js
+++ b/src/Quilombolas.js
@@ -20,7 +20,7 @@ along with Portal-SMPPIR-React. If not, see <https://www.gnu.org/licenses/>.
-import React, { Component } from 'react';
+import React from 'react';
import NavigationBar from './Components/NavigationBar'
import Eixo1 from './SubPages/Eixo1'
import Eixo2 from './SubPages/Eixo2'
@@ -28,79 +28,53 @@ import Eixo3 from './SubPages/Eixo3'
import Eixo4 from './SubPages/Eixo4'
import QuilombolaPresentation from './SubPages/QuilombolaPresentation'
import QuilombolaAbout from './SubPages/QuilombolaAbout'
-import AppFooter from './Components/AppFooter'
import { Tab, Tabs } from 'react-materialize';
import './Styles/Quilombolas.css';
-import Cookies from 'universal-cookie';
-import {sleep, homeURL} from './enviroment'
-import ContrastBar from './Components/ContrastBar'
+import { Store } from './Store'
-var ck = new Cookies();
-var contrastCK = new Cookies();
-var cookieStatus = contrastCK.get('contrast');
+function Quilombolas() {
-
-class Quilombolas extends Component {
- constructor(props) {
- super(props);
- this.whereIAm = this.whereIAm.bind(this);
+ // Get information about which page was accessed
+ const { state, dispatch } = React.useContext(Store);
+ let states = { "APRESENTAÇÃO": false, "EIXO 1": false, "EIXO 2": false, "EIXO 3": false, "EIXO 4": false, "SOBRE": false }
+ if (state.page in states) {
+ states[state.page] = true
+ }
+ else {
+ states["APRESENTAÇÃO"] = true
}
- componentDidMount() {
- this.whereIAm()
+ // Hook to set page context
+ const setPageAction = (newPage) => {
+ return dispatch({
+ type: 'SET_PAGE',
+ payload: newPage
+ })
}
+ React.useEffect(() => { });
- render() {
- var contrastString = '';
- if(cookieStatus === 'true'){
- contrastString = 'Contrast'
- }
- const cookie = new Cookies();
- var clicked = cookie.get('mainPageClicked')
- var states = {"APRESENTAÇÃO": false, "EIXO 1": true, "EIXO 2": false, "EIXO 3": false, "EIXO 4": false,"SOBRE": false}
- if (clicked !== undefined){
- if (clicked in states){
- states["EIXO 1"] = false;
- states[clicked] = true;
- }
- else{
- states = {"APRESENTAÇÃO": true, "EIXO 1": false, "EIXO 2": false, "EIXO 3": false, "EIXO 4": false,"SOBRE": false}
- ck.set('mainPageClicked', 'APRESENTAÇÃO');
- }
- }
- else{
- // Redirect user to the main page if he/she do not have a cookie
- window.location.href = homeURL()
- }
- return (
- <div id={`${contrastString}mainPage`}>
- <ContrastBar/>
- <NavigationBar/>
- <div id='contentTabsDiv'>
- <Tabs className={`tab-demo z-depth-1 ${contrastString}mainPageRedTab`} onChange={this.whereIAm}>
- <Tab title="Apresentação" active={states["APRESENTAÇÃO"]}> <QuilombolaPresentation/> </Tab>
- <Tab title="Eixo 1" active={states["EIXO 1"]}> <Eixo1/> </Tab>
- <Tab title="Eixo 2" active={states["EIXO 2"]}> <Eixo2/> </Tab>
- <Tab title="Eixo 3" active={states["EIXO 3"]}> <Eixo3/> </Tab>
- <Tab title="Eixo 4" active={states["EIXO 4"]}> <Eixo4/> </Tab>
- <Tab title="Sobre" active={states["SOBRE"]}> <QuilombolaAbout/></Tab>
- </Tabs>
- </div>
- <AppFooter/>
- </div>
- );
+ const whereIAm = (e, ev) => {
+ if (ev)
+ setPageAction(ev.target.innerText)
}
- whereIAm(e, ev){
- if(ev){
- ck.set('mainPageClicked', ev.target.innerText);
- this.setState({visited:ev.target.innerText});
- }
- sleep(1).then(() => {
- if(document.getElementsByClassName('clearmapbtn')[0])
- document.getElementsByClassName('clearmapbtn')[0].click()
- });
- }
+ var contrastString = state.contrast
+
+ return (
+ <div id={`${contrastString}mainPage`}>
+ <NavigationBar />
+ <div id='contentTabsDiv'>
+ <Tabs className={`tab-demo z-depth-1 ${contrastString}mainPageRedTab`} onChange={whereIAm} >
+ <Tab title="Apresentação" active={states["APRESENTAÇÃO"]}> {states["APRESENTAÇÃO"] ? <QuilombolaPresentation /> :<div/>} </Tab>
+ <Tab title="Eixo 1" active={states["EIXO 1"]}> {states["EIXO 1"] ? <Eixo1 /> :<div/>} </Tab>
+ <Tab title="Eixo 2" active={states["EIXO 2"]}> {states["EIXO 2"] ? <Eixo2 /> :<div/>} </Tab>
+ <Tab title="Eixo 3" active={states["EIXO 3"]}> {states["EIXO 3"] ? <Eixo3 /> :<div/>} </Tab>
+ <Tab title="Eixo 4" active={states["EIXO 4"]}> {states["EIXO 4"] ? <Eixo4 /> :<div/>} </Tab>
+ <Tab title="Sobre" active={states["SOBRE"]}> {states["SOBRE"] ? <QuilombolaAbout /> :<div/>} </Tab>
+ </Tabs>
+ </div>
+ </div>
+ );
}
export default Quilombolas;
diff --git a/src/RacialQuotas.js b/src/RacialQuotas.js
index 9768de70495f2f7374e73bfbf4af0b8385d7964e..6a4fad445400d76c0f0875a9c3780a0727d39ab4 100644
--- a/src/RacialQuotas.js
+++ b/src/RacialQuotas.js
@@ -20,9 +20,8 @@ along with Portal-SMPPIR-React. If not, see <https://www.gnu.org/licenses/>.
-import React, { Component } from 'react';
+import React from 'react';
import NavigationBar from './Components/NavigationBar';
-import AppFooter from './Components/AppFooter';
import QuotasEvader from './SubPages/QuotasEvader';
import QuotasGraduate from './SubPages/QuotasGraduate';
import QuotasEducation from './SubPages/QuotasEducation';
@@ -34,101 +33,70 @@ import QuotasExtracurricularAct from './SubPages/QuotasExtracurricularAct';
import QuotasSocialSupport from './SubPages/QuotasSocialSupport';
import QuotasOfferVacancies from './SubPages/QuotasOfferVacancies';
import { Tab, Tabs } from 'react-materialize';
-import Cookies from 'universal-cookie';
-import ContrastBar from './Components/ContrastBar'
-import {homeURL} from './enviroment'
+import { Store } from './Store';
import './Styles/RacialQuotas.css'
-var ck = new Cookies();
-var contrastCK = new Cookies();
-var cookieStatus = contrastCK.get('contrast');
-
-class RacialQuotas extends Component {
- constructor(props) {
- super(props);
- this.whereIAm = this.whereIAm.bind(this);
- this.state = {
- visited:'EVASORES'
- }
+function RacialQuotas() {
+
+ // Get information about which page was accessed
+ const { state, dispatch } = React.useContext(Store);
+ var states = {
+ "EVASÃO": false,
+ "CONCLUINTES": false,
+ "ESCOLARIDADE": false,
+ "FIES": false,
+ "PROUNI": false,
+ "FINANCIAMENTO": false,
+ 'ATIVIDADE EXTRACURRICULAR': false,
+ 'INGRESSO': false,
+ 'APOIO SOCIAL': false,
+ 'VAGAS OFERTADAS': false
}
- componentDidMount() {
- this.whereIAm()
+ if (state.page in states) {
+ states[state.page] = true
}
- render() {
- var contrastString = '';
- if(cookieStatus === 'true'){
- contrastString = 'Contrast'
- }
- const cookie = new Cookies();
- var clicked = cookie.get('mainPageClicked')
- var states = {"EVASÃO": true,
- "CONCLUINTES": false,
- "ESCOLARIDADE": false,
- "FIES": false,
- "PROUNI": false,
- "FINANCIAMENTO": false,
- 'ATIVIDADE EXTRACURRICULAR':false,
- 'INGRESSO':false,
- 'APOIO SOCIAL': false,
- 'VAGAS OFERTADAS': false
- }
-
- if (clicked !== undefined){
- if (clicked in states){
- states["EVASÃO"] = false;
- states[clicked] = true;
- }
- else{
- states = {"EVASÃO": true,
- "CONCLUINTES": false,
- "ESCOLARIDADE": false,
- "FIES": false,
- "PROUNI": false,
- "FINANCIAMENTO": false,
- 'ATIVIDADE EXTRACURRICULAR':false,
- 'INGRESSO':false,
- 'APOIO SOCIAL': false,
- 'VAGAS OFERTADAS': false
- }
- ck.set('mainPageClicked', 'EVASÃO');
- }
- }
- else{
- // Redirect user to the main page if he/she do not have a cookie
- window.location.href = homeURL()
- }
+ else {
+ states["EVASÃO"] = true
+ }
+
+ // Hook to set page context
+ const setPageAction = (newPage) => {
+ return dispatch({
+ type: 'SET_PAGE',
+ payload: newPage
+ })
+ }
+ React.useEffect(() => { });
+
+ const whereIAm = (e, ev) => {
+ if (ev)
+ setPageAction(ev.target.innerText)
+ }
+
+ var contrastString = state.contrast
+
return (
<div id={`${contrastString}mainPage`}>
- <ContrastBar/>
<NavigationBar />
<div id='contentTabsDiv'>
- <Tabs className={`tab-demo z-depth-1 ${contrastString}mainPageGreenTab`} onChange={this.whereIAm} >
- <Tab title="Evasores" active={states["EVASÃO"]}> <QuotasEvader visited={this.state.visited}/> </Tab>
- <Tab title="Concluintes" active={states["CONCLUINTES"]}> <QuotasGraduate visited={this.state.visited}/> </Tab>
- <Tab title="Escolaridade" active={states["ESCOLARIDADE"]}> <QuotasEducation visited={this.state.visited}/> </Tab>
- <Tab title="FIES" active={states["FIES"]}> <QuotasFies visited={this.state.visited}/> </Tab>
- <Tab title="PROUNI" active={states["PROUNI"]}> <QuotasPROUNI visited={this.state.visited}/> </Tab>
- <Tab title="Financiamento" active={states["FINANCIAMENTO"]}> <QuotasLoan visited={this.state.visited}/> </Tab>
- <Tab title="Atividade Extracurricular" active={states['ATIVIDADE EXTRACURRICULAR']}> <QuotasExtracurricularAct visited={this.state.visited}/> </Tab>
- <Tab title="Ingresso" active={states["INGRESSO"]}> <QuotasAdmission visited={this.state.visited}/> </Tab>
- <Tab title="Apoio Social" active={states["APOIO SOCIAL"]}> <QuotasSocialSupport visited={this.state.visited}/> </Tab>
- <Tab title="Vagas Ofertadas" active={states["VAGAS OFERTADAS"]}> <QuotasOfferVacancies visited={this.state.visited}/> </Tab>
+ <Tabs className={`tab-demo z-depth-1 ${contrastString}mainPageGreenTab`} onChange={whereIAm} >
+ <Tab title="Evasores" active={states["EVASÃO"]}> {states["EVASÃO"] ? <QuotasEvader /> : <div />} </Tab>
+ <Tab title="Concluintes" active={states["CONCLUINTES"]}> {states["CONCLUINTES"] ? <QuotasGraduate /> : <div />} </Tab>
+ <Tab title="Escolaridade" active={states["ESCOLARIDADE"]}> {states["ESCOLARIDADE"] ? <QuotasEducation /> : <div />} </Tab>
+ <Tab title="FIES" active={states["FIES"]}> {states["FIES"] ? <QuotasFies /> : <div />} </Tab>
+ <Tab title="PROUNI" active={states["PROUNI"]}> {states["PROUNI"] ? <QuotasPROUNI /> : <div />} </Tab>
+ <Tab title="Financiamento" active={states["FINANCIAMENTO"]}> {states["FINANCIAMENTO"] ? <QuotasLoan /> : <div />} </Tab>
+ <Tab title="Atividade Extracurricular" active={states['ATIVIDADE EXTRACURRICULAR']}> {states["ATIVIDADE EXTRACURRICULAR"] ? <QuotasExtracurricularAct /> : <div />} </Tab>
+ <Tab title="Ingresso" active={states["INGRESSO"]}> {states["INGRESSO"] ? <QuotasAdmission /> : <div />} </Tab>
+ <Tab title="Apoio Social" active={states["APOIO SOCIAL"]}> {states["APOIO SOCIAL"] ? <QuotasSocialSupport /> : <div />} </Tab>
+ <Tab title="Vagas Ofertadas" active={states["VAGAS OFERTADAS"]}> {states["VAGAS OFERTADAS"] ? <QuotasOfferVacancies /> : <div />} </Tab>
</Tabs>
</div>
- <AppFooter/>
</div>
);
- }
-
- whereIAm(e, ev) {
- if(ev){
- ck.set('mainPageClicked', ev.target.innerText);
- this.setState({visited:ev.target.innerText});
- }
- }
}
diff --git a/src/Store.js b/src/Store.js
new file mode 100644
index 0000000000000000000000000000000000000000..864b9659a331fd7c9e3d9ad160287a1388320913
--- /dev/null
+++ b/src/Store.js
@@ -0,0 +1,53 @@
+/*
+Copyright (C) 2019 Centro de Computacao Cientifica e Software Livre
+Departamento de Informatica - Universidade Federal do Parana - C3SL/UFPR
+
+This file is part of Portal-SMPPIR-React.
+
+Portal-SMPPIR-React is free software: you can redistribute it and/or modify
+it under the terms of the GNU General Public License as published by
+the Free Software Foundation, either version 3 of the License, or
+(at your option) any later version.
+
+Portal-SMPPIR-React is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU General Public License for more details.
+
+You should have received a copy of the GNU General Public License
+along with Portal-SMPPIR-React. If not, see <https://www.gnu.org/licenses/>.
+*/
+
+import React from 'react'
+
+export const Store = React.createContext();
+
+const initialStore = {
+ page: '',
+ contrast: ''
+}
+
+function reducer(state, action) {
+ switch (action.type) {
+ case 'SET_PAGE':
+ sessionStorage.setItem('page', action.payload);
+ return { ...state, page: action.payload };
+ case 'SET_CONTRAST':
+ sessionStorage.setItem('contrast', action.payload);
+ return { ...state, contrast: action.payload };
+ default:
+ return state;
+ }
+}
+
+export function StoreProvider(props) {
+
+ const [state, dispatch] = React.useReducer(reducer, initialStore);
+ const value = { state, dispatch };
+
+ return (
+ <Store.Provider value={value}>
+ {props.children}
+ </Store.Provider>
+ )
+}
\ No newline at end of file
diff --git a/src/Styles/NavigationBar.css b/src/Styles/NavigationBar.css
index 098c8729e433a743deabe78e6db3081e8824cb26..ad2dccfdd95d91ee0e7acd6174c8edf92b5c0411 100644
--- a/src/Styles/NavigationBar.css
+++ b/src/Styles/NavigationBar.css
@@ -35,6 +35,10 @@ nav a{
background-color: white;
}
+.navLogo:hover{
+ background-color: white;
+}
+
#navBarInicio > a,
#navBarBrasilQ > a,
@@ -97,4 +101,8 @@ nav a{
.ContrastnavBackground ~ #nav-mobile{
background-color: black;
+}
+
+i.ContrastnavIcon {
+ color:white;
}
\ No newline at end of file
diff --git a/src/SubPages/AfricanCulture.js b/src/SubPages/AfricanCulture.js
index a7c3bc09332833e00b9dcf0143ba497debc96acc..bd939ea68f811278d8c176fd7bf6d560c1191e80 100644
--- a/src/SubPages/AfricanCulture.js
+++ b/src/SubPages/AfricanCulture.js
@@ -21,7 +21,6 @@ along with Portal-SMPPIR-React. If not, see <https://www.gnu.org/licenses/>.
import React, { Component } from 'react';
-import Cookies from 'universal-cookie';
import {Collapsible, Row, Col} from 'react-materialize';
import { getServerURL, organizeJson, deactivateLoadingAnimation } from '../enviroment'
import CollapsibleContainer from '../Components/CollapsibleContainer'
@@ -30,13 +29,10 @@ import BuildStackedBar from '../Charts/BuildStackedBar';
import BuildBar from '../Charts/BuildBar';
import AutocompleteApp from '../Components/AutocompleteApp';
import axios from 'axios';
+import { Store } from '../Store'
import './Styles/AfricanRights.css'
-var ck = new Cookies();
-var contrastCK = new Cookies();
-var cookieStatus = contrastCK.get('contrast');
-
const type = "culture"; //Ver se é culture mesmo
const cad_unico = "african_culture"
// const ibge = "ibge_census"
@@ -65,16 +61,9 @@ class AfricanCulture extends Component {
this.getHeader = this.getHeader.bind(this);
this.getDataFromAutocomplete = this.getDataFromAutocomplete.bind(this)
}
- componentDidMount(){
- this.setState({cookie:ck.get('mainPageClicked')})
- }
-
+
render() {
- var contrastString = '';
- if(cookieStatus === 'true'){
- contrastString = 'Contrast'
- }
- if (ck.get('mainPageClicked') === "CULTURA" || this.state.cookie === 'CULTURA')
+ var contrastString = this.context.state.contrast;
return (
<div id={type}>
<Row>
@@ -115,8 +104,6 @@ class AfricanCulture extends Component {
</div>
);
-
- else return <div></div>
}
getDataFromServer(defaultData, chart) {
if(chart !== 'Curso' && chart !== 'Instituição de Ensino'){
@@ -205,7 +192,7 @@ class AfricanCulture extends Component {
}
-
+AfricanCulture.contextType = Store;
export default AfricanCulture;
\ No newline at end of file
diff --git a/src/SubPages/AfricanRights.js b/src/SubPages/AfricanRights.js
index 6d1013b01b016e6b66e7665958429f8e015150b4..1ff7853b9321f1b83c98f86edf4ee69831849c3b 100644
--- a/src/SubPages/AfricanRights.js
+++ b/src/SubPages/AfricanRights.js
@@ -21,7 +21,6 @@ along with Portal-SMPPIR-React. If not, see <https://www.gnu.org/licenses/>.
import React, { Component } from 'react';
-import Cookies from 'universal-cookie';
import {Collapsible, Row, Col} from 'react-materialize';
import CollapsibleContainer from '../Components/CollapsibleContainer'
import Loading from '../Components/Loading'
@@ -29,14 +28,11 @@ import BuildBar from '../Charts/BuildBar'
import axios from 'axios';
import { getServerURL, deactivateLoadingAnimation, searchHash, getEducationLevel} from '../enviroment'
import Table from '../Components/Table';
+import { Store } from '../Store'
import './Styles/AfricanRights.css'
-var ck = new Cookies();
-var contrastCK = new Cookies();
-var cookieStatus = contrastCK.get('contrast');
-
const type = "rights";
const cad_unico = "african_rights"
const serverURL = getServerURL();
@@ -63,16 +59,8 @@ class AfricanRights extends Component {
this.filterJSON = this.filterJSON.bind(this);
}
- componentDidMount(){
- this.setState({cookie:ck.get('mainPageClicked')})
- }
-
render() {
- var contrastString = '';
- if(cookieStatus === 'true'){
- contrastString = 'Contrast'
- }
- if (ck.get('mainPageClicked') === "DIREITOS" || this.state.cookie === 'DIREITOS')
+ var contrastString = this.context.state.contrast;
return (
<div id={type}>
<Row>
@@ -116,7 +104,6 @@ class AfricanRights extends Component {
</Row>
</div>
);
- else return <div></div>
}
filterJSON(data) {
@@ -307,4 +294,6 @@ class AfricanRights extends Component {
}
+AfricanRights.contextType = Store;
+
export default AfricanRights;
diff --git a/src/SubPages/AfricanSustainability.js b/src/SubPages/AfricanSustainability.js
index a0727027b4149e7d60bef719a95ca5d7f4e1d441..ddded63b5e4a37b338ec2a0b9024de28b8746f01 100644
--- a/src/SubPages/AfricanSustainability.js
+++ b/src/SubPages/AfricanSustainability.js
@@ -21,20 +21,16 @@ along with Portal-SMPPIR-React. If not, see <https://www.gnu.org/licenses/>.
import React, { Component } from 'react';
-import Cookies from 'universal-cookie';
import {Collapsible, Row, Col, Collection, CollectionItem} from 'react-materialize';
import CollapsibleContainer from '../Components/CollapsibleContainer'
import Loading from '../Components/Loading'
import BuildStackedBar from '../Charts/BuildStackedBar'
import axios from 'axios';
import { getServerURL, deactivateLoadingAnimation, createIntervals, organizeJson} from '../enviroment'
+import { Store } from '../Store'
import './Styles/AfricanRights.css'
-var ck = new Cookies();
-var contrastCK = new Cookies();
-var cookieStatus = contrastCK.get('contrast');
-
const type = "rights";
const cad_unico = "african_sustentability"
// const ibge = "ibge_census"
@@ -55,16 +51,8 @@ class AfricanSustainability extends Component {
this.getHeader = this.getHeader.bind(this);
}
- componentDidMount(){
- this.setState({cookie:ck.get('mainPageClicked')})
- }
-
render() {
- var contrastString = '';
- if(cookieStatus === 'true'){
- contrastString = 'Contrast'
- }
- if (ck.get('mainPageClicked') === "SUSTENTABILIDADE" || this.state.cookie === 'SUSTENTABILIDADE')
+ var contrastString = this.context.state.contrast;
return (
<div id={type}>
<Row>
@@ -101,7 +89,6 @@ class AfricanSustainability extends Component {
</div>
);
- else return <div></div>
}
getDataFromServer(defaultData, chart) {
@@ -181,7 +168,7 @@ class AfricanSustainability extends Component {
}
-
+AfricanSustainability.contextType = Store;
export default AfricanSustainability;
\ No newline at end of file
diff --git a/src/SubPages/Eixo1.js b/src/SubPages/Eixo1.js
index 306e6a7408078e1e5784abb2aa8b7abf76d6a03f..f2ecbbaf9b4719ed934efc3a6e80ed16cceaf0ee 100644
--- a/src/SubPages/Eixo1.js
+++ b/src/SubPages/Eixo1.js
@@ -26,26 +26,22 @@ import CardFooter from '../Components/CardFooter';
import UfBar from '../Components/UfBar';
import GrayBar from '../Components/GrayBar';
import MapMarker from './icons/map-marker.png';
-//import HeatMap from '../Components/HeatMap';
+// import HeatMap from '../Components/HeatMap';
import { getStateExtendedName } from '../enviroment';
import * as data from '../JsonsAntigos/brasil-quilombola/bqe1'
import BuildLineNotFixed from '../Charts/BuildLineNotFixed'
import BuildPie from '../Charts/BuildPie'
import Table from '../Components/Table'
-import Cookies from 'universal-cookie';
import Map from '../Components/Map';
-//import csv1 from './CSVoriginais/pbq/comunidades_certificadas_por_uf.csv'
+// import csv1 from './CSVoriginais/pbq/comunidades_certificadas_por_uf.csv'
// import csv2 from './CSVoriginais/pbq/comunidades_tituladas_por_uf_ano.csv'
// import csv4 from './CSVoriginais/pbq/COMUNIDADES.csv'
// import csv5 from './CSVoriginais/pbq/comunidades_por_status_por_uf.csv'
import './Styles/Eixo1.css'
-
-var ck = new Cookies();
-var contrastCK = new Cookies();
-var cookieStatus = contrastCK.get('contrast');
+import { Store } from '../Store';
const nullInfo = [{
@@ -62,116 +58,109 @@ const customNames = {"Ano":"Ano",
"Comunidades Certificadas":"Comunidades Certificadas"}
- class Eixo1 extends Component {
- constructor(props) {
- super(props);
- this.state = {
- clickedInMap: null
- };
- this.getMapClick = this.getMapClick.bind(this);
- this.clearMap = this.clearMap.bind(this);
- }
+class Eixo1 extends Component {
+ constructor(props) {
+ super(props);
+ this.state = {
+ clickedInMap: null
+ };
+ this.getMapClick = this.getMapClick.bind(this);
+ this.clearMap = this.clearMap.bind(this);
+ }
componentDidMount(){
- if (ck.get('mainPageClicked') === "EIXO 1")
- this.clearMap()
+ this.clearMap()
}
render() {
- var contrastString = '';
- if(cookieStatus === 'true'){
- contrastString = 'Contrast'
- }
- if (ck.get('mainPageClicked') === "EIXO 1")
- return (
- <div>
- <Row>
- <Col l={3} m={5} s={8}>
- <h4 className={`${contrastString}eixoHeaderQ`}>Eixo 1</h4>
- </Col>
- <Col l={5} m={8} s={8}>
- <p className={`${contrastString}eixoSubHeader`}> Clique sobre qualquer estado em um mapa ou
- tabela para apresentar os dados somente daquele estado. Clique
- novamente para voltar aos dados do Brasil. </p>
- </Col>
- </Row>
-
- <div className="e1pannels">
- <Card id="e1pannel-1" title="Certificações Emitidas">
- <GrayBar text ="por UF"/>
- <Map getMapClick={this.getMapClick} />
-
- <Button className="clearmapbtn" onClick={this.clearMap}> Limpar Mapa </Button>
-
- <p>As comunidades certificadas estão distribuÃdas por todo o Brasil, com
- maior concentração nos estados do Maranhão e da Bahia.</p>
-
- {data.gete1p1()[getStateExtendedName(this.state.clickedInMap).currentState] ? (
- <UfBar img={MapMarker} ufname={getStateExtendedName(this.state.clickedInMap).currentState} val={data.gete1p1()[getStateExtendedName(this.state.clickedInMap).currentState].Certificadas + " comunidades"}/>
- ):(
- <UfBar img={MapMarker} ufname={getStateExtendedName(this.state.clickedInMap).currentState} val="Sem informação"/>
- )}
- <CardFooter fonte="Fundação Cultural Palmares / MinC (Jan, 2016)"/>
- </Card>
-
- <Card id="e1pannel-2" title="Evoluções de Certificações e Regularizações">
- <GrayBar text="Certificações Emitidas e Tituladas por Ano"/>
-
-
- {data.gete1p2()[getStateExtendedName(this.state.clickedInMap).currentState] ? (
- <BuildLineNotFixed data={data.gete1p2()[getStateExtendedName(this.state.clickedInMap).currentState]} customKeys={customNames} dataKey="Ano"/>
- ):(
- <BuildLineNotFixed data={nullInfo} customKeys={nullKeys} dataKey="Ano"/>
- )}
-
- <CardFooter fonte="Comitê Gestor do Programa Brasil Quilombola, Fundação Cultural Palmares e INCRA (Jan, 2016)"/>
- </Card>
-
- <Card id="e1pannel-3" title="Titulações">
- <Table header={["Unidade Federal","Comunidades Tituladas"]} body ={data.gete1p31()} classes="striped smallCells"/>
-
- {data.gete1p32()[getStateExtendedName(this.state.clickedInMap).currentState] ? (
- <UfBar ufname={getStateExtendedName(this.state.clickedInMap).currentState} val={data.gete1p32()[getStateExtendedName(this.state.clickedInMap).currentState] + " comunidades tituladas"}/>
- ):(
- <UfBar ufname={getStateExtendedName(this.state.clickedInMap).currentState} val="Sem informação"/>
- )}
-
- <CardFooter fonte="INCRA (Jan, 2016)"/>
- </Card>
-
- <Card id="e1pannel-4" title="Lista de Comunidades Reconhecidas Oficialmente pelo estado">
- <p>Clique na comunidade para ter acesso ao mapa com informações detalhadas sobre ela</p>
-
- <Table header={["ID","Comunidade","Território","Certificação","Titulação"]} body={this.jsonToArray(data.gete1p4()[getStateExtendedName(this.state.clickedInMap).currentState])} classes="striped smallCells" divClasses="scrolltable"/>
-
- <CardFooter fonte="Comitê Gestor do Programa Brasil Quilombola, Fundação Cultural Palmares / MinC e INCRA (Jan, 2016)"/>
- </Card>
-
- <Card id="e1pannel-5" title="Estágio dos processos">
- <GrayBar text="por Estágio"/>
- {data.gete1p5()[getStateExtendedName(this.state.clickedInMap).currentState] ? (
- <BuildPie data={data.gete1p5()[getStateExtendedName(this.state.clickedInMap).currentState]} dataKey="total" nameKey="estagio" />
- ):(
- <BuildPie data={nullInfo} dataKey="valor" nameKey="tipo" />
- )}
-
- <CardFooter fonte="INCRA (Jan, 2016)"/>
- </Card>
- </div>
+ var contrastString = this.context.state.contrast;
+ return (
+ <div>
+ <Row>
+ <Col l={3} m={5} s={8}>
+ <h4 className={`${contrastString}eixoHeaderQ`}>Eixo 1</h4>
+ </Col>
+ <Col l={5} m={8} s={8}>
+ <p className={`${contrastString}eixoSubHeader`}> Clique sobre qualquer estado em um mapa ou
+ tabela para apresentar os dados somente daquele estado. Clique
+ novamente para voltar aos dados do Brasil. </p>
+ </Col>
+ </Row>
+
+ <div className="e1pannels">
+ <Card id="e1pannel-1" title="Certificações Emitidas">
+ <GrayBar text ="por UF"/>
+ <Map getMapClick={this.getMapClick} />
+
+ <Button className="clearmapbtn" onClick={this.clearMap}> Limpar Mapa </Button>
+
+ <p>As comunidades certificadas estão distribuÃdas por todo o Brasil, com
+ maior concentração nos estados do Maranhão e da Bahia.</p>
+
+ {data.gete1p1()[getStateExtendedName(this.state.clickedInMap).currentState] ? (
+ <UfBar img={MapMarker} ufname={getStateExtendedName(this.state.clickedInMap).currentState} val={data.gete1p1()[getStateExtendedName(this.state.clickedInMap).currentState].Certificadas + " comunidades"}/>
+ ):(
+ <UfBar img={MapMarker} ufname={getStateExtendedName(this.state.clickedInMap).currentState} val="Sem informação"/>
+ )}
+ <CardFooter fonte="Fundação Cultural Palmares / MinC (Jan, 2016)"/>
+ </Card>
+
+ <Card id="e1pannel-2" title="Evoluções de Certificações e Regularizações">
+ <GrayBar text="Certificações Emitidas e Tituladas por Ano"/>
+
+
+ {data.gete1p2()[getStateExtendedName(this.state.clickedInMap).currentState] ? (
+ <BuildLineNotFixed data={data.gete1p2()[getStateExtendedName(this.state.clickedInMap).currentState]} customKeys={customNames} dataKey="Ano"/>
+ ):(
+ <BuildLineNotFixed data={nullInfo} customKeys={nullKeys} dataKey="Ano"/>
+ )}
+
+ <CardFooter fonte="Comitê Gestor do Programa Brasil Quilombola, Fundação Cultural Palmares e INCRA (Jan, 2016)"/>
+ </Card>
+
+ <Card id="e1pannel-3" title="Titulações">
+ <Table header={["Unidade Federal","Comunidades Tituladas"]} body ={data.gete1p31()} classes="striped smallCells"/>
+
+ {data.gete1p32()[getStateExtendedName(this.state.clickedInMap).currentState] ? (
+ <UfBar ufname={getStateExtendedName(this.state.clickedInMap).currentState} val={data.gete1p32()[getStateExtendedName(this.state.clickedInMap).currentState] + " comunidades tituladas"}/>
+ ):(
+ <UfBar ufname={getStateExtendedName(this.state.clickedInMap).currentState} val="Sem informação"/>
+ )}
+
+ <CardFooter fonte="INCRA (Jan, 2016)"/>
+ </Card>
+
+ <Card id="e1pannel-4" title="Lista de Comunidades Reconhecidas Oficialmente pelo estado">
+ <p>Clique na comunidade para ter acesso ao mapa com informações detalhadas sobre ela</p>
+
+ <Table header={["ID","Comunidade","Território","Certificação","Titulação"]} body={this.jsonToArray(data.gete1p4()[getStateExtendedName(this.state.clickedInMap).currentState])} classes="striped smallCells" divClasses="scrolltable"/>
+
+ <CardFooter fonte="Comitê Gestor do Programa Brasil Quilombola, Fundação Cultural Palmares / MinC e INCRA (Jan, 2016)"/>
+ </Card>
+
+ <Card id="e1pannel-5" title="Estágio dos processos">
+ <GrayBar text="por Estágio"/>
+ {data.gete1p5()[getStateExtendedName(this.state.clickedInMap).currentState] ? (
+ <BuildPie data={data.gete1p5()[getStateExtendedName(this.state.clickedInMap).currentState]} dataKey="total" nameKey="estagio" />
+ ):(
+ <BuildPie data={nullInfo} dataKey="valor" nameKey="tipo" />
+ )}
+
+ <CardFooter fonte="INCRA (Jan, 2016)"/>
+ </Card>
</div>
- );
- else return <div></div>
-
- }
+ </div>
+ );
+ }
- getMapClick(clicked) {
- this.setState({clickedInMap: clicked});
- // console.log(JSON.stringify(data.gete1p32()))
- }
+ getMapClick(clicked) {
+ this.setState({clickedInMap: clicked});
+ // console.log(JSON.stringify(data.gete1p32()))
+ }
- clearMap(){
- this.setState({clickedInMap: null});
- }
+ clearMap(){
+ this.setState({clickedInMap: null});
+ }
jsonToArray(jsonData){
var returnArray = []
@@ -188,8 +177,7 @@ const customNames = {"Ano":"Ano",
return(returnArray)
}
}
+}
+Eixo1.contextType = Store;
-
- }
-
- export default Eixo1;
+export default Eixo1;
diff --git a/src/SubPages/Eixo2.js b/src/SubPages/Eixo2.js
index 20e2f66e58f34cb9da503e5cec25794e135800f0..f6375df70f7186e414e38e378a69902d8f8502f0 100644
--- a/src/SubPages/Eixo2.js
+++ b/src/SubPages/Eixo2.js
@@ -32,7 +32,7 @@ import * as data from '../JsonsAntigos/brasil-quilombola/bqe2';
import BuildPie from '../Charts/BuildPie';
import BuildBar from '../Charts/BuildBar';
import HeatMap from '../Components/HeatMap';
-import Cookies from 'universal-cookie';
+import { Store } from '../Store';
import './Styles/Eixo2.css'
@@ -44,36 +44,27 @@ import csv5 from './CSVoriginais/pbq/pbq_luz_para_todos_por_regiao.csv'
import csv6 from './CSVoriginais/pbq/pbq_mcasamvida_unidades_por_uf_ano.csv'
import csv7 from './CSVoriginais/pbq/pbq_obras_saneamento_por_uf_ano.csv'
-var ck = new Cookies();
-var contrastCK = new Cookies();
-var cookieStatus = contrastCK.get('contrast');
-
const customNames = {"Ano":"Ano",
"Unidades Contratadas":"Unidades Contratadas"}
const customNames2 = {"Ano":"Ano",
"Valor Contratado em Milhões":"Valor Contratado em Milhões"}
- class Eixo2 extends Component {
- constructor(props) {
- super(props);
- this.state = {
- clickedInMap: null
- };
- this.getMapClick = this.getMapClick.bind(this);
- this.clearMap = this.clearMap.bind(this);
+class Eixo2 extends Component {
+ constructor(props) {
+ super(props);
+ this.state = {
+ clickedInMap: null
+ };
+ this.getMapClick = this.getMapClick.bind(this);
+ this.clearMap = this.clearMap.bind(this);
}
componentDidMount(){
- if (ck.get('mainPageClicked') === "EIXO 2")
- this.clearMap()
+ this.clearMap()
}
render() {
- var contrastString = '';
- if(cookieStatus === 'true'){
- contrastString = 'Contrast'
- }
- if (ck.get('mainPageClicked') === "EIXO 2")
+ var contrastString = this.context.state.contrast;
return (
<div>
<Row>
@@ -167,7 +158,6 @@ const customNames = {"Ano":"Ano",
</div>
</div>
);
- else return <div></div>
}
getMapClick(clicked) {
this.setState({clickedInMap: clicked});
@@ -210,7 +200,7 @@ const customNames = {"Ano":"Ano",
}
}
}
-
+Eixo2.contextType = Store;
export default Eixo2;
diff --git a/src/SubPages/Eixo3.js b/src/SubPages/Eixo3.js
index 2579c7fa9ccbd1c7d7e8076417d22c06b5e97fe8..e3cf39b32985b3d2194eabce124477677f19a3bb 100644
--- a/src/SubPages/Eixo3.js
+++ b/src/SubPages/Eixo3.js
@@ -32,7 +32,7 @@ import * as data from '../JsonsAntigos/brasil-quilombola/bqe3';
import BuildPie from '../Charts/BuildPie';
import BuildBar from '../Charts/BuildBar';
import HeatMap from '../Components/HeatMap';
-import Cookies from 'universal-cookie';
+import { Store } from '../Store';
import './Styles/Eixo3.css'
@@ -44,11 +44,6 @@ import csv5 from './CSVoriginais/pbq/daps_emitidas_por_ano_por_uf.csv'
import csv6 from './CSVoriginais/pbq/paa_quilombolas_por_ano_por_uf.csv'
-
-var ck = new Cookies();
-var contrastCK = new Cookies();
-var cookieStatus = contrastCK.get('contrast');
-
const nullInfo = [{
"tipo":"Sem informação",
"valor":null
@@ -65,103 +60,99 @@ class Eixo3 extends Component {
this.clearMap = this.clearMap.bind(this);
}
+ componentDidMount() {
+ this.clearMap()
+ }
+
render() {
- var contrastString = '';
- if(cookieStatus === 'true'){
- contrastString = 'Contrast'
- }
- if (ck.get('mainPageClicked') === "EIXO 3"){
- return (
- <div>
- <Row>
- <Col l={3} m={5} s={8}>
- <h4 className={`${contrastString}eixoHeaderQ`}>Eixo 3</h4>
- </Col>
- <Col l={5} m={8} s={8}>
- <p className={`${contrastString}eixoSubHeader`}> Clique sobre qualquer estado em um mapa ou tabela para apresentar os
- dados somente daquele estado. Clique novamente para voltar aos dados do Brasil. </p>
- </Col>
- </Row>
-
- <div className="e3pannels">
- <Card id="e3pannel-1" title="Renda Média por Pessoa das FamÃlias Quilombolas, Segundo CadÚnico (R$)">
- <p className="center">Por UF</p>
- <HeatMap getMapClick={this.getMapClick} datafield="Renda" data={data.gete3p1()} levels={[{"min":0,"max":170,"color":"#c0d1db"},{"min":170,"max":272,"color":"#849eb5"},{"min":272,"max":374,"color":"#476d90"},{"min":377,"max":200000,"color":"#0a3a6a"}]} />
- <Button className="clearmapbtn" onClick={this.clearMap}> Limpar Mapa </Button>
-
- <p>A maior concentração de renda entre as famÃlias quilombolas cadastradas se localiza nas regiões Centro-Oeste, Sudeste e Sul.</p>
- {data.gete3p1()[getStateExtendedName(this.state.clickedInMap).currentState] ? (
- <UfBar img={coins} ufname={getStateExtendedName(this.state.clickedInMap).currentState} val={"R$"+ data.gete3p1()[getStateExtendedName(this.state.clickedInMap).currentState].Renda +" em média"}/>
- ):(
- <UfBar img={coins} ufname={getStateExtendedName(this.state.clickedInMap).currentState} val="Sem informação"/>
+ var contrastString = this.context.state.contrast;
+ return (
+ <div>
+ <Row>
+ <Col l={3} m={5} s={8}>
+ <h4 className={`${contrastString}eixoHeaderQ`}>Eixo 3</h4>
+ </Col>
+ <Col l={5} m={8} s={8}>
+ <p className={`${contrastString}eixoSubHeader`}> Clique sobre qualquer estado em um mapa ou tabela para apresentar os
+ dados somente daquele estado. Clique novamente para voltar aos dados do Brasil. </p>
+ </Col>
+ </Row>
+
+ <div className="e3pannels">
+ <Card id="e3pannel-1" title="Renda Média por Pessoa das FamÃlias Quilombolas, Segundo CadÚnico (R$)">
+ <p className="center">Por UF</p>
+ <HeatMap getMapClick={this.getMapClick} datafield="Renda" data={data.gete3p1()} levels={[{"min":0,"max":170,"color":"#c0d1db"},{"min":170,"max":272,"color":"#849eb5"},{"min":272,"max":374,"color":"#476d90"},{"min":377,"max":200000,"color":"#0a3a6a"}]} />
+ <Button className="clearmapbtn" onClick={this.clearMap}> Limpar Mapa </Button>
+
+ <p>A maior concentração de renda entre as famÃlias quilombolas cadastradas se localiza nas regiões Centro-Oeste, Sudeste e Sul.</p>
+ {data.gete3p1()[getStateExtendedName(this.state.clickedInMap).currentState] ? (
+ <UfBar img={coins} ufname={getStateExtendedName(this.state.clickedInMap).currentState} val={"R$"+ data.gete3p1()[getStateExtendedName(this.state.clickedInMap).currentState].Renda +" em média"}/>
+ ):(
+ <UfBar img={coins} ufname={getStateExtendedName(this.state.clickedInMap).currentState} val="Sem informação"/>
+ )}
+ <CardFooter data={csv1} source="Cadastro Único para Programas Sociais (CadÚnico) Min. do Desenvolvimento Social e Combate à Fome (MDS) (Jan, 2016)"/>
+ </Card>
+
+ <Card id="e3pannel-2" title="FamÃlias Quilombolas Segundo Renda">
+ <GrayBar text="Percentual de FamÃlias por Faixa de Renda"/>
+ <BuildPie data={this.fixdatap2(data.gete3p2()[getStateExtendedName(this.state.clickedInMap).currentState])} dataKey="FamÃlias" nameKey="Faixa de Renda" minHeight={300}/>
+ <GrayBar text="Número de FamÃlias por Faixa de Renda"/>
+ <BuildBar data={data.gete3p2()[getStateExtendedName(this.state.clickedInMap).currentState]} dataKey="Faixa de Renda" customKeys={{"Faixa de Renda":"Faixa de Renda","FamÃlias":"FamÃlias"}}/>
+
+ <CardFooter data={csv2} source="CadÚnico / MDS (Jan, 2016)"/>
+ </Card>
+
+ <Card id="e3pannel-3" title="Extrativismo">
+ <GrayBar text="Percentual"/>
+
+ {data.gete3p3()[getStateExtendedName(this.state.clickedInMap).currentState] ? (<div>
+ <BuildPie data={this.fixDataP3(data.gete3p3()[getStateExtendedName(this.state.clickedInMap).currentState])} dataKey="valor" nameKey="tipo" minHeight={250}/>
+ <ValueBar val={this.calculaPropP3(data.gete3p3()[getStateExtendedName(this.state.clickedInMap).currentState],0)+ "% são extrativistas"}/>
+ </div>
+ ):(<div>
+ <BuildPie data={nullInfo} dataKey="valor" nameKey="tipo" minHeight={250}/>
+ <ValueBar val={"Sem informação"}/>
+ </div>
)}
- <CardFooter data={csv1} source="Cadastro Único para Programas Sociais (CadÚnico) Min. do Desenvolvimento Social e Combate à Fome (MDS) (Jan, 2016)"/>
- </Card>
-
- <Card id="e3pannel-2" title="FamÃlias Quilombolas Segundo Renda">
- <GrayBar text="Percentual de FamÃlias por Faixa de Renda"/>
- <BuildPie data={this.fixdatap2(data.gete3p2()[getStateExtendedName(this.state.clickedInMap).currentState])} dataKey="FamÃlias" nameKey="Faixa de Renda" minHeight={300}/>
- <GrayBar text="Número de FamÃlias por Faixa de Renda"/>
- <BuildBar data={data.gete3p2()[getStateExtendedName(this.state.clickedInMap).currentState]} dataKey="Faixa de Renda" customKeys={{"Faixa de Renda":"Faixa de Renda","FamÃlias":"FamÃlias"}}/>
-
- <CardFooter data={csv2} source="CadÚnico / MDS (Jan, 2016)"/>
- </Card>
-
- <Card id="e3pannel-3" title="Extrativismo">
- <GrayBar text="Percentual"/>
-
- {data.gete3p3()[getStateExtendedName(this.state.clickedInMap).currentState] ? (<div>
- <BuildPie data={this.fixDataP3(data.gete3p3()[getStateExtendedName(this.state.clickedInMap).currentState])} dataKey="valor" nameKey="tipo" minHeight={250}/>
- <ValueBar val={this.calculaPropP3(data.gete3p3()[getStateExtendedName(this.state.clickedInMap).currentState],0)+ "% são extrativistas"}/>
- </div>
- ):(<div>
- <BuildPie data={nullInfo} dataKey="valor" nameKey="tipo" minHeight={250}/>
- <ValueBar val={"Sem informação"}/>
- </div>
- )}
- <p>O extrativismo é a principal atividade de subsistência das famÃlias quilombolas.</p>
+ <p>O extrativismo é a principal atividade de subsistência das famÃlias quilombolas.</p>
- <CardFooter data={csv3} source="CadÚnico / MDS"/>
- </Card>
+ <CardFooter data={csv3} source="CadÚnico / MDS"/>
+ </Card>
- <Card id="e3pannel-4" title="Bolsa FamÃlia">
- <GrayBar text="Percentual de FamÃlias Quilombolas Beneficiárias"/>
+ <Card id="e3pannel-4" title="Bolsa FamÃlia">
+ <GrayBar text="Percentual de FamÃlias Quilombolas Beneficiárias"/>
- <BuildPie data={this.fixDataP4(data.gete3p4()[getStateExtendedName(this.state.clickedInMap).currentState])} dataKey="valor" nameKey="tipo" minHeight={250}/>
- <ValueBar val={this.calculaPropP4(data.gete3p4()[getStateExtendedName(this.state.clickedInMap).currentState],0)+ "% recebem Bolsa FamÃlia"}/>
+ <BuildPie data={this.fixDataP4(data.gete3p4()[getStateExtendedName(this.state.clickedInMap).currentState])} dataKey="valor" nameKey="tipo" minHeight={250}/>
+ <ValueBar val={this.calculaPropP4(data.gete3p4()[getStateExtendedName(this.state.clickedInMap).currentState],0)+ "% recebem Bolsa FamÃlia"}/>
- <p>A transferência de renda por meio da Bolsa FamÃlia tem ampla cobertura sobre as famÃlias quilombolas.</p>
+ <p>A transferência de renda por meio da Bolsa FamÃlia tem ampla cobertura sobre as famÃlias quilombolas.</p>
- <CardFooter data={csv4} source="CadÚnico / MDS"/>
+ <CardFooter data={csv4} source="CadÚnico / MDS"/>
- </Card>
+ </Card>
- <Card id="e3pannel-5" title="Declaração de Aptidão ao Pronaf">
- <GrayBar text="DAPs Emitidas por Ano"/>
- <BuildBar data={data.gete3p51()[getStateExtendedName(this.state.clickedInMap).currentState]} dataKey="Ano" customKeys={{"Ano":"Ano","DAPs Emitidas":"DAPs Emitidas"}}/>
- <p>A DAP (Declaração de Aptidão ao Pronaf) é o documento necessário para obtenção de financiamento do Pronaf (Programa Nacional de Fortalecimento da Agricultura Familiar).</p>
- <ValueBar val={data.gete3p52()[getStateExtendedName(this.state.clickedInMap).currentState] + " DAPs emitidas"}/>
- <CardFooter data={csv5} source="Ministério do Desenvolvimento Agrário"/>
- </Card>
+ <Card id="e3pannel-5" title="Declaração de Aptidão ao Pronaf">
+ <GrayBar text="DAPs Emitidas por Ano"/>
+ <BuildBar data={data.gete3p51()[getStateExtendedName(this.state.clickedInMap).currentState]} dataKey="Ano" customKeys={{"Ano":"Ano","DAPs Emitidas":"DAPs Emitidas"}}/>
+ <p>A DAP (Declaração de Aptidão ao Pronaf) é o documento necessário para obtenção de financiamento do Pronaf (Programa Nacional de Fortalecimento da Agricultura Familiar).</p>
+ <ValueBar val={data.gete3p52()[getStateExtendedName(this.state.clickedInMap).currentState] + " DAPs emitidas"}/>
+ <CardFooter data={csv5} source="Ministério do Desenvolvimento Agrário"/>
+ </Card>
- <Card id="e3pannel-6" title="Programa de Aquisição de Alimentos">
- <GrayBar text="FamÃlias Participando por Ano"/>
- <p>O PAA fomenta a produção agrÃcula familiar ao mesmo tempo em que tenta reduzir a insegurança alimentar.</p>
- <BuildBar data={data.gete3p6()[getStateExtendedName(this.state.clickedInMap).currentState]} dataKey="Ano" customKeys={{"Ano":"Ano","FamÃlias que Vendem para o PAA":"FamÃlias que Vendem para o PAA"}}/>
- <ValueBar val={data.gete3p6()[getStateExtendedName(this.state.clickedInMap).currentState][1]['FamÃlias que Vendem para o PAA'] + " FamÃlias (2013)"}/>
- <CardFooter data={csv6} source="Ministério do Desenvolvimento Agrário"/>
+ <Card id="e3pannel-6" title="Programa de Aquisição de Alimentos">
+ <GrayBar text="FamÃlias Participando por Ano"/>
+ <p>O PAA fomenta a produção agrÃcula familiar ao mesmo tempo em que tenta reduzir a insegurança alimentar.</p>
+ <BuildBar data={data.gete3p6()[getStateExtendedName(this.state.clickedInMap).currentState]} dataKey="Ano" customKeys={{"Ano":"Ano","FamÃlias que Vendem para o PAA":"FamÃlias que Vendem para o PAA"}}/>
+ <ValueBar val={data.gete3p6()[getStateExtendedName(this.state.clickedInMap).currentState][1]['FamÃlias que Vendem para o PAA'] + " FamÃlias (2013)"}/>
+ <CardFooter data={csv6} source="Ministério do Desenvolvimento Agrário"/>
- </Card>
-
- </div>
+ </Card>
</div>
- );
- }
- else {
- return <div></div>
- }
+
+ </div>
+ );
}
getMapClick(clicked) {
this.setState({clickedInMap: clicked});
@@ -180,15 +171,6 @@ class Eixo3 extends Component {
return(returnJson)
}
- // fixdatap2(data){
- // var returnJson = []
- // var i
- // for(i = 0; i < data.length -1; ++i){
- // returnJson.push({"Faixa de Renda":data[i]['Faixa de Renda'],"FamÃlias":data[i]['FamÃlias']})
- // }
- // return(returnJson)
- // }
-
fixDataP3(data){
return([{"tipo":"Extrativistas","valor":data.Extrativistas},{"tipo":"Não Extrativistas","valor":data.declararam - data.Extrativistas}])
@@ -209,8 +191,6 @@ class Eixo3 extends Component {
return(val.toFixed(2))
}
}
-
-
-
+Eixo3.contextType = Store;
export default Eixo3;
diff --git a/src/SubPages/Eixo4.js b/src/SubPages/Eixo4.js
index 4680e7315268513e5d04f76bbdc56d02da95f1eb..ba1472dc70aef945c8cdeec6a49ddb10caca1103 100644
--- a/src/SubPages/Eixo4.js
+++ b/src/SubPages/Eixo4.js
@@ -32,7 +32,7 @@ import * as data from '../JsonsAntigos/brasil-quilombola/bqe4';
import BuildPie from '../Charts/BuildPie';
import BuildBar from '../Charts/BuildBar';
import HeatMap from '../Components/HeatMap';
-import Cookies from 'universal-cookie';
+import { Store } from '../Store';
import './Styles/Eixo4.css'
@@ -47,13 +47,6 @@ import csv7 from './CSVoriginais/pbq/equipes_saude_por_ano_por_uf.csv'
import csv8 from './CSVoriginais/pbq/mais_medicos_por_ano_por_uf.csv'
-
-
-var ck = new Cookies();
-var contrastCK = new Cookies();
-var cookieStatus = contrastCK.get('contrast');
-
-
const customKeysP5 = {
"Ano": "Ano",
"Ensino Infantil":"Ensino Infantil",
@@ -82,12 +75,13 @@ class Eixo4 extends Component {
this.getMapClick = this.getMapClick.bind(this);
this.clearMap = this.clearMap.bind(this);
}
+
+ componentDidMount() {
+ this.clearMap()
+ }
+
render() {
- var contrastString = '';
- if(cookieStatus === 'true'){
- contrastString = 'Contrast'
- }
- if (ck.get('mainPageClicked') === "EIXO 4")
+ var contrastString = this.context.state.contrast;
return (
<div>
<Row>
@@ -201,8 +195,6 @@ class Eixo4 extends Component {
</div>
</div>
);
- else return <div></div>
-
}
getMapClick(clicked) {
this.setState({clickedInMap: clicked});
@@ -261,7 +253,7 @@ fixDataP5(data){
}
}
-
+Eixo4.contextType = Store;
export default Eixo4;
diff --git a/src/SubPages/QuilombolaAbout.js b/src/SubPages/QuilombolaAbout.js
index 0d093e2c5223f2d52b339d440159c463658a6546..bc5db8173789a5769c4b8def46ba454f60181e4b 100644
--- a/src/SubPages/QuilombolaAbout.js
+++ b/src/SubPages/QuilombolaAbout.js
@@ -18,10 +18,7 @@ You should have received a copy of the GNU General Public License
along with Portal-SMPPIR-React. If not, see <https://www.gnu.org/licenses/>.
*/
-
-
import React, { Component } from 'react';
-import Cookies from 'universal-cookie';
import {Card} from 'react-materialize';
import './Styles/QuilombolaAbout.css'
import csv1 from './CSVoriginais/pbq/comunidades_certificadas_por_uf.csv'
@@ -31,113 +28,103 @@ import csv5 from './CSVoriginais/pbq/comunidades_por_status_por_uf.csv'
import csv6 from './CSVoriginais/pbq/cadunico_familias_por_uf.csv'
import csv7 from './CSVoriginais/pbq/cadunico_domicilios_rurais_por_uf.csv'
import csv8 from './CSVoriginais/pbq/cadunico_domicilios_servicos_presentes_por_uf.csv'
-
-
-var ck = new Cookies();
-var contrastCK = new Cookies();
-var cookieStatus = contrastCK.get('contrast');
+import { Store } from '../Store'
class QuilombolaAbout extends Component {
render() {
- var contrastString = '';
- if(cookieStatus === 'true'){
- contrastString = 'Contrast'
- }
- if (ck.get('mainPageClicked') === "SOBRE")
+ var contrastString = this.context.state.contrast;
return (
<div>
- <h4>Catálogo de indicadores disponÃveis no sistema</h4>
+ <h4 className={`${contrastString}eixoHeaderQ`}>Catálogo de indicadores disponÃveis no sistema</h4>
<div className="gridTemplate">
- <Card id={`${contrastString}c1`} title="Certificações Emitidas" >
+ <Card id={`${contrastString}c1`} title="Certificações Emitidas" >
<p>
- Total de certificações emitidas em todos os anos pela Fundação Cultural Palmares, por Estado em que a comunidade se localiza.<br/>
- <b>Fonte:</b> Fundação Cultural Palmares, Ministério da Cultura<br/>
- <b>Data de Referência:</b> 2015<br/>
- <b>Fórmula de Cálculo:</b> Número total de certificações em cada Estado<br/>
- <b><a href={csv1} >Clique aqui para baixar os dados em CSV</a></b>
- </p>
- </Card>
-
- <Card id={`${contrastString}c2`} title="Evolução de Certificações e Regularizações" >
- <p>
- Total de certificações emitidas (pela Fundação Cultural Palmares) e de territórios titulados (pelo INCRA ou Institutos de Terra) em todo o Brasil e nos Estados, a cada ano. Cada certificação se refere a uma comunidade, enquanto a titulação de um território pode englobar diversas comunidades que compartilham o mesmo território.<br/>
- <b>Fonte:</b> Comitê Gestor do Programa Brasil Quilombola, INCRA e Fundação Cultural Palmares, Ministério da Cultura<br/>
- <b>Data de Referência:</b> 2015<br/>
- <b>Fórmula de Cálculo:</b> Número total de certificações em cada ano e número de titulações conferidas em cada ano<br/>
- <b><a href={csv2}>Clique aqui para baixar os dados em CSV</a></b>
- </p>
- </Card>
- <Card id={`${contrastString}c3`} title="Comunidades Tituladas" >
- <p>
- Total de titulações já emitidas em qualquer ano (pelo INCRA ou Institutos de Terra) em todo o Brasil e nos Estados.<br/>
- <b>Fonte:</b> INCRA<br/>
- <b>Data de Referência:</b> 2015<br/>
- <b>Fórmula de Cálculo:</b> Número de titulações conferidas em cada Estado<br/>
- <b><a href={csv2}>Clique aqui para baixar os dados em CSV</a></b>
-
- </p>
- </Card>
- <Card id={`${contrastString}c4`} title="Lista de Comunidades Reconhecidas Oficialmente pelo Estado" >
- <p>
- Comunidades que já foram certificadas ou que estão em processo de titulação são oficialmente reconhecidas pelo Estado. Cada comunidade possui um identificador numérico e um nome pelo qual costuma ser chamada.<br/>
-
- <b>Fonte:</b> Comitê Gestor do Programa Brasil Quilombola, INCRA e Fundação Cultural Palmares, Ministério da Cultura<br/>
- <b>Data de Referência:</b> 2015<br/>
- <b><a href={csv4}>Clique aqui para baixar os dados em CSV</a></b>
-
- </p>
- </Card>
- <Card id={`${contrastString}c5`} title="Estágio dos Processos" >
- <p>
-
- O processo de titulação dos territórios quilombolas onde há comunidades certificadas passa pelas etapas de (1) RTID, (2) Publicação da Portaria, (3) Publicação do Decreto e (4) Titulação.<br/>
- id
- <b>Fonte:</b> INCRA<br/>
- <b>Data de Referência:</b> 2015<br/>
- <b>Fórmula de Cálculo:</b> Percentual de processos em cada estágio com relação ao total de processos em andamento ou concluÃdos<br/>
- <b><a href={csv5}>Clique aqui para baixar os dados em CSV</a></b>
-
- </p>
-</Card >
-<Card id={`${contrastString}c6`} title="FamÃlias no CadÚnico" >
- <p>
- FamÃlias quilombolas cadastradas no CadÚnico podem receber benefÃcios sociais de programas do Governo.<br/>
-
- <b>Fonte:</b> Cadastro Único para Programas Sociais (CadÚnico), Ministério do Desenvolvimento Social e Combate à Fome (MDS)<br/>
- <b>Data de Referência:</b> 2015<br/>
- <b>Fórmula de Cálculo:</b> SOMA do número de famÃlias nos domicÃlios quilombolas cadastradas no CadÚnico em cada Estado<br/>
- <b><a href={csv6}>Clique aqui para baixar os dados em CSV</a></b>
-
-</p>
-</Card>
-<Card id={`${contrastString}c7`} title="Ãrea Rural">
- <p>
- Concentração dos domicÃlios quilombolas em áreas rurais.<br/>
-
- <b>Fonte:</b> Cadastro Único para Programas Sociais (CadÚnico), Ministério do Desenvolvimento Social e Combate à Fome (MDS)<br/>
- <b>Data de Referência:</b> 2015<br/>
- <b>Fórmula de Cálculo:</b> Percentual de famÃlias quilombolas vivendo em áreas rurais<br/>
- <b><a href={csv7}>Clique aqui para baixar os dados em CSV</a></b>
-
-
-</p>
-</Card>
-<Card id={`${contrastString}c8`} title="Serviços Presentes nos DomicÃlios Cadastrados">
- <p>
- <b>Fonte:</b> Cadastro Único para Programas Sociais (CadÚnico), Ministério do Desenvolvimento Social e Combate à Fome (MDS)<br/>
- <b>Data de Referência: 2015</b><br/>
- <b><a href={csv8}>Clique aqui para baixar os dados em CSV</a></b>
-
- </p>
-</Card>
-</div>
-</div>
-);
-else return <div></div>
-}
-}
+ Total de certificações emitidas em todos os anos pela Fundação Cultural Palmares, por Estado em que a comunidade se localiza.<br />
+ <b>Fonte:</b> Fundação Cultural Palmares, Ministério da Cultura<br />
+ <b>Data de Referência:</b> 2015<br />
+ <b>Fórmula de Cálculo:</b> Número total de certificações em cada Estado<br />
+ <b><a href={csv1} >Clique aqui para baixar os dados em CSV</a></b>
+ </p>
+ </Card>
+
+ <Card id={`${contrastString}c2`} title="Evolução de Certificações e Regularizações" >
+ <p>
+ Total de certificações emitidas (pela Fundação Cultural Palmares) e de territórios titulados (pelo INCRA ou Institutos de Terra) em todo o Brasil e nos Estados, a cada ano. Cada certificação se refere a uma comunidade, enquanto a titulação de um território pode englobar diversas comunidades que compartilham o mesmo território.<br />
+ <b>Fonte:</b> Comitê Gestor do Programa Brasil Quilombola, INCRA e Fundação Cultural Palmares, Ministério da Cultura<br />
+ <b>Data de Referência:</b> 2015<br />
+ <b>Fórmula de Cálculo:</b> Número total de certificações em cada ano e número de titulações conferidas em cada ano<br />
+ <b><a href={csv2}>Clique aqui para baixar os dados em CSV</a></b>
+ </p>
+ </Card>
+ <Card id={`${contrastString}c3`} title="Comunidades Tituladas" >
+ <p>
+ Total de titulações já emitidas em qualquer ano (pelo INCRA ou Institutos de Terra) em todo o Brasil e nos Estados.<br />
+ <b>Fonte:</b> INCRA<br />
+ <b>Data de Referência:</b> 2015<br />
+ <b>Fórmula de Cálculo:</b> Número de titulações conferidas em cada Estado<br />
+ <b><a href={csv2}>Clique aqui para baixar os dados em CSV</a></b>
+
+ </p>
+ </Card>
+ <Card id={`${contrastString}c4`} title="Lista de Comunidades Reconhecidas Oficialmente pelo Estado" >
+ <p>
+ Comunidades que já foram certificadas ou que estão em processo de titulação são oficialmente reconhecidas pelo Estado. Cada comunidade possui um identificador numérico e um nome pelo qual costuma ser chamada.<br />
+ <b>Fonte:</b> Comitê Gestor do Programa Brasil Quilombola, INCRA e Fundação Cultural Palmares, Ministério da Cultura<br />
+ <b>Data de Referência:</b> 2015<br />
+ <b><a href={csv4}>Clique aqui para baixar os dados em CSV</a></b>
+
+ </p>
+ </Card>
+ <Card id={`${contrastString}c5`} title="Estágio dos Processos" >
+ <p>
+ O processo de titulação dos territórios quilombolas onde há comunidades certificadas passa pelas etapas de (1) RTID, (2) Publicação da Portaria, (3) Publicação do Decreto e (4) Titulação.<br />
+ id
+ <b>Fonte:</b> INCRA<br />
+ <b>Data de Referência:</b> 2015<br />
+ <b>Fórmula de Cálculo:</b> Percentual de processos em cada estágio com relação ao total de processos em andamento ou concluÃdos<br />
+ <b><a href={csv5}>Clique aqui para baixar os dados em CSV</a></b>
+
+ </p>
+ </Card >
+ <Card id={`${contrastString}c6`} title="FamÃlias no CadÚnico" >
+ <p>
+ FamÃlias quilombolas cadastradas no CadÚnico podem receber benefÃcios sociais de programas do Governo.<br />
+
+ <b>Fonte:</b> Cadastro Único para Programas Sociais (CadÚnico), Ministério do Desenvolvimento Social e Combate à Fome (MDS)<br />
+ <b>Data de Referência:</b> 2015<br />
+ <b>Fórmula de Cálculo:</b> SOMA do número de famÃlias nos domicÃlios quilombolas cadastradas no CadÚnico em cada Estado<br />
+ <b><a href={csv6}>Clique aqui para baixar os dados em CSV</a></b>
+
+ </p>
+ </Card>
+ <Card id={`${contrastString}c7`} title="Ãrea Rural">
+ <p>
+ Concentração dos domicÃlios quilombolas em áreas rurais.<br />
+
+ <b>Fonte:</b> Cadastro Único para Programas Sociais (CadÚnico), Ministério do Desenvolvimento Social e Combate à Fome (MDS)<br />
+ <b>Data de Referência:</b> 2015<br />
+ <b>Fórmula de Cálculo:</b> Percentual de famÃlias quilombolas vivendo em áreas rurais<br />
+ <b><a href={csv7}>Clique aqui para baixar os dados em CSV</a></b>
+
+
+ </p>
+ </Card>
+ <Card id={`${contrastString}c8`} title="Serviços Presentes nos DomicÃlios Cadastrados">
+ <p>
+ <b>Fonte:</b> Cadastro Único para Programas Sociais (CadÚnico), Ministério do Desenvolvimento Social e Combate à Fome (MDS)<br />
+ <b>Data de Referência: 2015</b><br />
+ <b><a href={csv8}>Clique aqui para baixar os dados em CSV</a></b>
+
+ </p>
+ </Card>
+ </div>
+ </div>
+ );
+ }
+}
+QuilombolaAbout.contextType = Store;
export default QuilombolaAbout;
diff --git a/src/SubPages/QuilombolaIndicator1.js b/src/SubPages/QuilombolaIndicator1.js
index c8bafdf3a149f9189757344411de2762e5ed9b43..0229bacadf3002b6380cf73f1a2fb51a1237e3e2 100644
--- a/src/SubPages/QuilombolaIndicator1.js
+++ b/src/SubPages/QuilombolaIndicator1.js
@@ -30,12 +30,9 @@ import axios from 'axios';
import { getServerURL, organizeJson, getRegionState, deactivateLoadingAnimation, getStateName, searchHash } from '../enviroment'
import BuildStackedBar from '../Charts/BuildStackedBar';
import Loading from '../Components/Loading';
-import Cookies from 'universal-cookie';
+import { Store } from '../Store'
-var ck = new Cookies();
-var contrastCK = new Cookies();
-var cookieStatus = contrastCK.get('contrast');
const serverURL = getServerURL();
const type = "eixo_2";
const homeTypelocation = {
@@ -112,11 +109,7 @@ class QuilombolaIndicator1 extends Component {
}
render() {
- var contrastString = '';
- if(cookieStatus === 'true'){
- contrastString = 'Contrast'
- }
- if (ck.get('mainPageClicked') === "EIXO 2")
+ var contrastString = this.context.state.contrast;
return (
<div id={type}>
<Row>
@@ -223,7 +216,6 @@ class QuilombolaIndicator1 extends Component {
</Row>
</div>
);
- else return <div></div>
}
getDataFromAutocomplete(data) {
@@ -469,5 +461,6 @@ getCampiFromServer(id){
}
}
+QuilombolaIndicator1.contextType = Store;
export default QuilombolaIndicator1;
\ No newline at end of file
diff --git a/src/SubPages/QuilombolaIndicator2.js b/src/SubPages/QuilombolaIndicator2.js
index 2b35c967988a44dc527de00102eed8a7a585813a..1780fa1ce0a8debe572c7a27018b688194d6f574 100644
--- a/src/SubPages/QuilombolaIndicator2.js
+++ b/src/SubPages/QuilombolaIndicator2.js
@@ -31,12 +31,9 @@ import { getServerURL, organizeJson, getRegionState, deactivateLoadingAnimation,
import BuildStackedBar from '../Charts/BuildStackedBar';
//import BuildBar from '../Charts/BuildBar';
import Loading from '../Components/Loading';
-import Cookies from 'universal-cookie';
+import { Store } from '../Store'
-var ck = new Cookies();
-var contrastCK = new Cookies();
-var cookieStatus = contrastCK.get('contrast');
const serverURL = getServerURL();
const type = "eixo_3";
const extrativismo = {
@@ -99,11 +96,7 @@ class QuilombolaIndicator2 extends Component {
render() {
- var contrastString = '';
- if(cookieStatus === 'true'){
- contrastString = 'Contrast'
- }
- if (ck.get('mainPageClicked') === "EIXO 3")
+ var contrastString = this.context.state.contrast;
return (
<div id={type}>
<Row>
@@ -207,7 +200,6 @@ class QuilombolaIndicator2 extends Component {
</Row>
</div>
);
- else return <div></div>
}
updatePercent(e) {
var state = this.state;
@@ -271,7 +263,6 @@ class QuilombolaIndicator2 extends Component {
deactivateLoadingAnimation(chart, type);
}
})
-
.catch(error => {
console.log(error)
var node = document.createElement("P");
@@ -298,6 +289,7 @@ class QuilombolaIndicator2 extends Component {
break;
case 'Renda média per capita':
route = type+"?dims=year,per_capita_income";
+ break;
case 'Distribuição de renda':
route = type+"?dims=year,per_capita_income";
break;
@@ -456,5 +448,6 @@ getCampiFromServer(id){
}
}
+QuilombolaIndicator2.contextType = Store;
export default QuilombolaIndicator2;
\ No newline at end of file
diff --git a/src/SubPages/QuilombolaIndicator3.js b/src/SubPages/QuilombolaIndicator3.js
index bdfe97a4a741350f0c7cb144e3dc41657782cd06..2dc0bc6412beb125f8b9d031ac24d9a95b857685 100644
--- a/src/SubPages/QuilombolaIndicator3.js
+++ b/src/SubPages/QuilombolaIndicator3.js
@@ -32,19 +32,15 @@ import BuildStackedBar from '../Charts/BuildStackedBar';
import BuildMixedBar from '../Charts/BuildMixedBar';
import BuildBar from '../Charts/BuildBar';
import Loading from '../Components/Loading';
-import Cookies from 'universal-cookie';
+import { Store } from '../Store'
-
-var ck = new Cookies();
-var contrastCK = new Cookies();
-var cookieStatus = contrastCK.get('contrast');
const serverURL = getServerURL();
const type = "eixo_4";
-const AnoLabel = {
- '0': 'Não',
- '1': 'Sim',
- 'null': 'Indefinido',
-}
+// const AnoLabel = {
+// '0': 'Não',
+// '1': 'Sim',
+// 'null': 'Indefinido',
+// }
const Education = {
'null': 'Sem informações',
'1': 'Creche',
@@ -95,11 +91,7 @@ class QuilombolaIndicator3 extends Component {
}
render() {
- var contrastString = '';
- if(cookieStatus === 'true'){
- contrastString = 'Contrast'
- }
- if (ck.get('mainPageClicked') === "EIXO 4")
+ var contrastString = this.context.state.contrast;
return (
<div id={type}>
<Row>
@@ -194,7 +186,6 @@ class QuilombolaIndicator3 extends Component {
</Row>
</div>
);
- else return <div></div>
}
getDataFromAutocomplete(data) {
@@ -283,7 +274,7 @@ class QuilombolaIndicator3 extends Component {
workData[2*i] = { 'ano_pesquisa': lowerBound + i, 'genero':'M' }
workData[2*i+1] = { 'ano_pesquisa': lowerBound + i, 'genero': 'F' }
for (let j = 0; j < chartData[2].length; j++) {
- if (chartData[2][j]['ano_pesquisa'] == lowerBound+i) {
+ if (chartData[2][j]['ano_pesquisa'] === lowerBound+i) {
workData[2*i][chartData[2][j]['idade']] = chartData[2][j]['total']
workData[2*i+1][chartData[2][j]['idade']] = chartData[2][j]['total2']
}
@@ -495,5 +486,6 @@ class QuilombolaIndicator3 extends Component {
}
}
+QuilombolaIndicator3.contextType = Store;
export default QuilombolaIndicator3;
\ No newline at end of file
diff --git a/src/SubPages/QuilombolaPresentation.js b/src/SubPages/QuilombolaPresentation.js
index 096efa9627dd455673aa452a2820d85fc495363b..75607ea88d2583b77c19b3f2a2ddd384ffb155b4 100644
--- a/src/SubPages/QuilombolaPresentation.js
+++ b/src/SubPages/QuilombolaPresentation.js
@@ -21,19 +21,13 @@ along with Portal-SMPPIR-React. If not, see <https://www.gnu.org/licenses/>.
import React, { Component } from 'react';
-import Cookies from 'universal-cookie';
-
+import { Store } from '../Store'
import './Styles/QuilombolaPresentation.css'
-var contrastCK = new Cookies();
-var cookieStatus = contrastCK.get('contrast');
class QuilombolaPresentation extends Component {
render() {
- var contrastString = '';
- if(cookieStatus === 'true'){
- contrastString = 'Contrast'
- }
+ var contrastString = this.context.state.contrast;
return (
<div className="container">
<div className={`${contrastString}apresentacao`}>
@@ -59,7 +53,7 @@ class QuilombolaPresentation extends Component {
);
}
}
-
+QuilombolaPresentation.contextType = Store;
export default QuilombolaPresentation;
diff --git a/src/SubPages/QuotasAdmission.js b/src/SubPages/QuotasAdmission.js
index 623cfc36bd6083c8688806ad257b6ba20bafa3fa..af4dcad761316899bc5a9a250bf6e5dbf2162342 100644
--- a/src/SubPages/QuotasAdmission.js
+++ b/src/SubPages/QuotasAdmission.js
@@ -31,12 +31,9 @@ import BuildStackedBar from '../Charts/BuildStackedBar';
import BuildBiaxialBars from '../Charts/BuildBiaxialBars';
import AutocompleteApp from '../Components/AutocompleteApp';
import Loading from '../Components/Loading';
-import Cookies from 'universal-cookie';
+import { Store } from '../Store';
// import DropdownCampi from '../Components/DropdownCampi';
-var ck = new Cookies();
-var contrastCK = new Cookies();
-var cookieStatus = contrastCK.get('contrast');
const serverURL = getServerURL();
const type = "admission";
@@ -78,11 +75,8 @@ class QuotasAdmission extends Component {
}
render() {
- var contrastString = '';
- if(cookieStatus === 'true'){
- contrastString = 'Contrast'
- }
- if (ck.get('mainPageClicked') === "INGRESSO")
+
+ var contrastString = this.context.state.contrast;
return (
<div id={type}>
<Row>
@@ -147,7 +141,6 @@ class QuotasAdmission extends Component {
</Row>
</div>
);
- else return <div></div>
}
getDataFromAutocomplete(data) {
@@ -387,5 +380,5 @@ class QuotasAdmission extends Component {
}
-
+QuotasAdmission.contextType = Store;
export default QuotasAdmission;
\ No newline at end of file
diff --git a/src/SubPages/QuotasEducation.js b/src/SubPages/QuotasEducation.js
index 76b3fc1677537a38c40ab4b6858097a82cc3195d..da9399314967cf17e69015a3d61b831e88124211 100644
--- a/src/SubPages/QuotasEducation.js
+++ b/src/SubPages/QuotasEducation.js
@@ -29,12 +29,9 @@ import axios from 'axios';
import Fraction from '../Components/Fraction';
import BuildBarPNAD from '../Charts/BuildBarPNAD';
import { getServerURL, getRegionState, sleep } from '../enviroment';
-import Cookies from 'universal-cookie';
import './Styles/QuotasEducation.css'
+import { Store } from '../Store';
-var ck = new Cookies();
-var contrastCK = new Cookies();
-var cookieStatus = contrastCK.get('contrast');
const basicFilter = 'type_of_school:"2",type_of_public_school:"6",level_of_education:"5"';
const serverURL = getServerURL();
const type = "education";
@@ -91,11 +88,7 @@ class QuotasEducation extends Component {
}
render() {
- var contrastString = '';
- if(cookieStatus === 'true'){
- contrastString = 'Contrast'
- }
- if (ck.get('mainPageClicked') === "ESCOLARIDADE" && this.state.isDone)
+ var contrastString = this.context.state.contrast;
return (
<Row>
<Col s={12} m={10} l={10} offset={'m1 l1'}>
@@ -138,7 +131,7 @@ class QuotasEducation extends Component {
<div id={'educationChart'}>
<BuildBarPNAD
data={this.state.totalRate}
- visited={ck.get('mainPageClicked')}
+ // visited={ck.get('mainPageClicked')}
customKeys={educationKeys}
dataKey={'nu_ano_referencia'}
/>
@@ -147,7 +140,6 @@ class QuotasEducation extends Component {
</Col>
</Row>
);
- else return <div> </div>
}
calculateRate(ethnic) {
@@ -364,6 +356,7 @@ class QuotasEducation extends Component {
}
}
+QuotasEducation.contextType = Store;
const taxaLiquidaBrancosEq = <Fraction
id={'taxaLiquidaBrancosEq'}
diff --git a/src/SubPages/QuotasEvader.js b/src/SubPages/QuotasEvader.js
index 22b41c8221bb6a35759b884041a9ad8be6b4bf36..a892fea14fa07987387e3d9745230e013a6e68ec 100644
--- a/src/SubPages/QuotasEvader.js
+++ b/src/SubPages/QuotasEvader.js
@@ -32,12 +32,9 @@ import BuildStackedBar from '../Charts/BuildStackedBar';
import BuildBiaxialBars from '../Charts/BuildBiaxialBars';
import Loading from '../Components/Loading';
import AutocompleteApp from '../Components/AutocompleteApp';
+import { Store } from '../Store';
// import DropdownCampi from '../Components/DropdownCampi';
-import Cookies from 'universal-cookie';
-var ck = new Cookies();
-var contrastCK = new Cookies();
-var cookieStatus = contrastCK.get('contrast');
const serverURL = getServerURL();
const type = "evader";
@@ -82,83 +79,96 @@ class QuotasEvader extends Component {
}
render() {
- var contrastString = '';
- if(cookieStatus === 'true'){
- contrastString = 'Contrast'
- }
- if (ck.get('mainPageClicked') === "EVASÃO" || ck.get('mainPageClicked') === "EVASORES")
- return (
- <div id={type}>
- <Row>
- <Col s={12} m={10} l={10} offset={'m1 l1'}>
- <div className="subpage-margin">
- <h5 className={`${contrastString}quota-title`}>Evasores</h5>
- <p className={`${contrastString}quota-subTitle`}>Abaixo encontram-se, separados por categoria, os dados relacionados aos estudantes
- evasores,que ingressaram na universidade através da Lei 12.711/2012(Lei de cotas). </p>
- <p> Para visualizar os dados você precisará clicar na seção que deseja visualizar.</p>
- <MapPanel
- onChange={this.updateCharts}
- getDDValues={this.getDDValues}
- getData={this.getData}
- location={type}
- />
- </div>
- </Col>
+ var contrastString = this.context.state.contrast;
+ return (
+ <div id={type}>
+ <Row>
+ <Col s={12} m={10} l={10} offset={'m1 l1'}>
+ <div className="subpage-margin">
+ <h5 className={`${contrastString}quota-title`}>Evasores</h5>
+ <p className={`${contrastString}quota-subTitle`}>Abaixo encontram-se, separados por categoria, os dados relacionados aos estudantes
+ evasores,que ingressaram na universidade através da Lei 12.711/2012(Lei de cotas). </p>
+ <p> Para visualizar os dados você precisará clicar na seção que deseja visualizar.</p>
+ <MapPanel
+ onChange={this.updateCharts}
+ getDDValues={this.getDDValues}
+ getData={this.getData}
+ location={type}
+ />
+ </div>
+ </Col>
- <Col s={12} m={10} l={10} offset={'m1 l1'}>
- <Collapsible onClick={this.getHeader}>
- <CollapsibleContainer id={`${contrastString}brownCollapsible`} header='Turno'>
- <div id={'Turno'+type}>
- <BuildStackedBar
- dataKey='Ano'
- data={organizeJson(this.state.charts['Turno'], "ds_turno_aluno")}
- customKeys={turnoK}
- />
- </div>
- <Loading/>
- </CollapsibleContainer>
- <CollapsibleContainer id={`${contrastString}brownCollapsible`} header='Gênero'>
- <div id={'Gênero'+type}>
- <BuildStackedBar dataKey='Ano' data={organizeJson(this.state.charts['Gênero'], "ds_sexo_aluno")}/>
- </div>
- <Loading/>
- </CollapsibleContainer>
- <CollapsibleContainer id={`${contrastString}brownCollapsible`} header='Curso' >
- <AutocompleteApp
- whichAutocomplete={'course'}
- mainPage={'evader'}
- chartDiv={'no_curso'}
- saveData={this.getDataFromAutocomplete}
- getTags={this.saveAutocompleteContent}
+ <Col s={12} m={10} l={10} offset={'m1 l1'}>
+ <Collapsible onClick={this.getHeader}>
+ <CollapsibleContainer id={`${contrastString}brownCollapsible`} header='Turno'>
+ <div id={'Turno'+type}>
+ <BuildStackedBar
+ dataKey='Ano'
+ data={organizeJson(this.state.charts['Turno'], "ds_turno_aluno")}
+ customKeys={turnoK}
/>
- <BuildBiaxialBars data={this.state.charts['Curso']} nameKey={'no_curso'} dataKey={'total'} dataKey2={'percentage'} year={'no_ano_pesquisa'}/>
- </CollapsibleContainer>
- <CollapsibleContainer id={`${contrastString}brownCollapsible`} header='Instituição de Ensino'>
- <AutocompleteApp
- whichAutocomplete={'institution'}
- mainPage={'evader'}
- chartDiv={'no_ies'}
- saveData={this.getDataFromAutocomplete}
- getTags={this.saveAutocompleteContent}
- // dropdown={'ddCampiEvader'}
- />
- {/* <div id={"ddCampiEvader"} style={{display:'none'}}>
- <DropdownCampi campi={this.state.campiList} getDDValues={this.campiFilter} location={type} campiNames={this.state.campiNames}/>
- </div> */}
- <BuildBiaxialBars data={this.state.charts['Instituição de Ensino']} nameKey={'no_ies'} dataKey={'total'} dataKey2={'percentage'} year={'no_ano_pesquisa'}/>
- </CollapsibleContainer>
- <CollapsibleContainer id={`${contrastString}brownCollapsible`} header='Raça/Cor'>
- <div id={'Raça/Cor'+type}>
- <BuildStackedBar dataKey='Ano' data={organizeJson(this.state.charts['Raça/Cor'], "ds_cor_raca_aluno")}/>
- </div>
- <Loading/>
- </CollapsibleContainer>
- </Collapsible>
- </Col>
- </Row>
- </div>
- );
- else return <div></div>;
+ </div>
+ <Loading/>
+ </CollapsibleContainer>
+ <CollapsibleContainer id={`${contrastString}brownCollapsible`} header='Gênero'>
+ <div id={'Gênero'+type}>
+ <BuildStackedBar dataKey='Ano' data={organizeJson(this.state.charts['Gênero'], "ds_sexo_aluno")}/>
+ </div>
+ <Loading/>
+ </CollapsibleContainer>
+ <CollapsibleContainer id={`${contrastString}brownCollapsible`} header='Curso' >
+ <div>
+ <AutocompleteApp
+ whichAutocomplete={'course'}
+ mainPage={'evader'}
+ chartDiv={'no_curso'}
+ saveData={this.getDataFromAutocomplete}
+ getTags={this.saveAutocompleteContent}
+ />
+ </div>
+ <Loading/>
+ </CollapsibleContainer>
+ <CollapsibleContainer id={`${contrastString}brownCollapsible`} header='Gênero'>
+ <div id={'Gênero'+type}>
+ <BuildStackedBar dataKey='Ano' data={organizeJson(this.state.charts['Gênero'], "ds_sexo_aluno")}/>
+ </div>
+ <Loading/>
+ </CollapsibleContainer>
+ <CollapsibleContainer id={`${contrastString}brownCollapsible`} header='Curso' >
+ <AutocompleteApp
+ whichAutocomplete={'course'}
+ mainPage={'evader'}
+ chartDiv={'no_curso'}
+ saveData={this.getDataFromAutocomplete}
+ getTags={this.saveAutocompleteContent}
+ />
+ <BuildBiaxialBars data={this.state.charts['Curso']} nameKey={'no_curso'} dataKey={'total'} dataKey2={'percentage'} year={'no_ano_pesquisa'}/>
+ </CollapsibleContainer>
+ <CollapsibleContainer id={`${contrastString}brownCollapsible`} header='Instituição de Ensino'>
+ <AutocompleteApp
+ whichAutocomplete={'institution'}
+ mainPage={'evader'}
+ chartDiv={'no_ies'}
+ saveData={this.getDataFromAutocomplete}
+ getTags={this.saveAutocompleteContent}
+ // dropdown={'ddCampiEvader'}
+ />
+ {/* <div id={"ddCampiEvader"} style={{display:'none'}}>
+ <DropdownCampi campi={this.state.campiList} getDDValues={this.campiFilter} location={type} campiNames={this.state.campiNames}/>
+ </div> */}
+ <BuildBiaxialBars data={this.state.charts['Instituição de Ensino']} nameKey={'no_ies'} dataKey={'total'} dataKey2={'percentage'} year={'no_ano_pesquisa'}/>
+ </CollapsibleContainer>
+ <CollapsibleContainer id={`${contrastString}brownCollapsible`} header='Raça/Cor'>
+ <div id={'Raça/Cor'+type}>
+ <BuildStackedBar dataKey='Ano' data={organizeJson(this.state.charts['Raça/Cor'], "ds_cor_raca_aluno")}/>
+ </div>
+ <Loading/>
+ </CollapsibleContainer>
+ </Collapsible>
+ </Col>
+ </Row>
+ </div>
+ );
}
getDataFromAutocomplete(data) {
@@ -393,5 +403,6 @@ class QuotasEvader extends Component {
// this.setState({charts:currentState})
// }
}
+QuotasEvader.contextType = Store;
export default QuotasEvader;
\ No newline at end of file
diff --git a/src/SubPages/QuotasExtracurricularAct.js b/src/SubPages/QuotasExtracurricularAct.js
index b382188370aba871848f5c800fe2044724cb1c2f..44c8fc7783547ab93c4a65a084732e4e76bf3f03 100644
--- a/src/SubPages/QuotasExtracurricularAct.js
+++ b/src/SubPages/QuotasExtracurricularAct.js
@@ -31,12 +31,9 @@ import BuildStackedBar from '../Charts/BuildStackedBar';
import BuildBiaxialBars from '../Charts/BuildBiaxialBars';
import AutocompleteApp from '../Components/AutocompleteApp';
import Loading from '../Components/Loading';
-import Cookies from 'universal-cookie';
+import { Store } from '../Store';
// import DropdownCampi from '../Components/DropdownCampi';
-var ck = new Cookies();
-var contrastCK = new Cookies();
-var cookieStatus = contrastCK.get('contrast');
const serverURL = getServerURL();
const type = "extracurricular_activities";
@@ -80,11 +77,8 @@ class QuotasExtracurricularAct extends Component {
}
render() {
- var contrastString = '';
- if(cookieStatus === 'true'){
- contrastString = 'Contrast'
- }
- if (ck.get('mainPageClicked') === "ATIVIDADE EXTRACURRICULAR")
+
+ var contrastString = this.context.state.contrast;
return (
<div id={type}>
<Row>
@@ -149,7 +143,6 @@ class QuotasExtracurricularAct extends Component {
</Row>
</div>
);
- else return <div></div>
}
getDataFromAutocomplete(data) {
@@ -388,5 +381,5 @@ class QuotasExtracurricularAct extends Component {
}
-
+QuotasExtracurricularAct.contextType = Store;
export default QuotasExtracurricularAct;
\ No newline at end of file
diff --git a/src/SubPages/QuotasFies.js b/src/SubPages/QuotasFies.js
index d67bc878d1cb107535ea2afb0ab5dd7d4a10323d..9e6aba052c62cbc0beb7c16d0266cdfc03018d04 100644
--- a/src/SubPages/QuotasFies.js
+++ b/src/SubPages/QuotasFies.js
@@ -34,11 +34,8 @@ import BuildBiaxialBars from '../Charts/BuildBiaxialBars';
import AutocompleteApp from '../Components/AutocompleteApp';
import DropdownCampi from '../Components/DropdownCampi';
import Loading from '../Components/Loading';
-import Cookies from 'universal-cookie';
+import { Store } from '../Store'
-var ck = new Cookies();
-var contrastCK = new Cookies();
-var cookieStatus = contrastCK.get('contrast');
const serverURL = getServerURL();
const type = "fies";
@@ -82,11 +79,8 @@ class QuotasFies extends Component {
}
render() {
- var contrastString = '';
- if(cookieStatus === 'true'){
- contrastString = 'Contrast'
- }
- if (ck.get('mainPageClicked') === "FIES")
+
+ var contrastString = this.context.state.contrast;
return (
<div id={type}>
<Row>
@@ -175,7 +169,6 @@ class QuotasFies extends Component {
</Row>
</div>
);
- else return <div></div>
}
updatePercent(e) {
@@ -375,5 +368,6 @@ class QuotasFies extends Component {
}
}
+QuotasFies.contextType = Store;
export default QuotasFies;
\ No newline at end of file
diff --git a/src/SubPages/QuotasGraduate.js b/src/SubPages/QuotasGraduate.js
index 9c074efe9607a44ed2527fe0791add1c06a453be..31cbc0d71542c88622432c1d54f5cf609cd7eab7 100644
--- a/src/SubPages/QuotasGraduate.js
+++ b/src/SubPages/QuotasGraduate.js
@@ -32,13 +32,10 @@ import BuildStackedBar from '../Charts/BuildStackedBar';
import BuildBiaxialBars from '../Charts/BuildBiaxialBars';
import AutocompleteApp from '../Components/AutocompleteApp';
import Loading from '../Components/Loading';
-import Cookies from 'universal-cookie';
+import { Store } from '../Store';
// import DropdownCampi from '../Components/DropdownCampi';
-var ck = new Cookies();
-var contrastCK = new Cookies();
-var cookieStatus = contrastCK.get('contrast');
const serverURL = getServerURL();
const type = "graduate";
@@ -81,11 +78,8 @@ class QuotasGraduate extends Component {
}
render() {
- var contrastString = '';
- if(cookieStatus === 'true'){
- contrastString = 'Contrast'
- }
- if (ck.get('mainPageClicked') === "CONCLUINTES")
+
+ var contrastString = this.context.state.contrast;
return (
<div id={type}>
<Row>
@@ -151,7 +145,6 @@ class QuotasGraduate extends Component {
</Row>
</div>
);
- else return <div></div>
}
getDataFromAutocomplete(data) {
@@ -390,5 +383,6 @@ getCampiFromServer(id){
}
}
+QuotasGraduate.contextType = Store;
export default QuotasGraduate;
\ No newline at end of file
diff --git a/src/SubPages/QuotasLoan.js b/src/SubPages/QuotasLoan.js
index b6c967455616f7a2784a9a213d41dab427168223..5f54c623a1cfdc509995ebb69d4f425d5f10957c 100644
--- a/src/SubPages/QuotasLoan.js
+++ b/src/SubPages/QuotasLoan.js
@@ -33,15 +33,11 @@ import BuildBiaxialBars from '../Charts/BuildBiaxialBars';
import AutocompleteApp from '../Components/AutocompleteApp';
// import DropdownCampi from '../Components/DropdownCampi';
import Loading from '../Components/Loading';
-import Cookies from 'universal-cookie';
-
+import { Store } from '../Store'
/// TODO: Arrumar URL da consulta
/// http://seppirdev.c3sl.ufpr.br:4000/api/v1/student_loans?dims=institution_cod,institution,cod_offer_location,name_offer_location&filter=institution_cod:%22undefined%22,ethnic:[%22Preta%22,%22Parda%22,%22Ind%C3%ADgena%22]
-var ck = new Cookies();
-var contrastCK = new Cookies();
-var cookieStatus = contrastCK.get('contrast');
const serverURL = getServerURL();
const type = "student_loans";
const tableClasses = "bordered striped highlight centered";
@@ -85,11 +81,7 @@ class QuotasLoan extends Component {
}
render() {
- var contrastString = '';
- if(cookieStatus === 'true'){
- contrastString = 'Contrast'
- }
- if (ck.get('mainPageClicked') === "FINANCIAMENTO")
+ var contrastString = this.context.state.contrast;
return (
<div id={type}>
<Row>
@@ -208,7 +200,6 @@ class QuotasLoan extends Component {
</Row>
</div>
);
- else return <div></div>
}
getDataFromAutocomplete(data) {
@@ -485,5 +476,5 @@ bodyStyles[3][6] = '';
bodyStyles[4][6] = '';
bodyStyles[5][6] = '';
-
+QuotasLoan.contextType = Store;
export default QuotasLoan;
\ No newline at end of file
diff --git a/src/SubPages/QuotasOfferVacancies.js b/src/SubPages/QuotasOfferVacancies.js
index ff03bb342279b24bfa7e36031a861632f1c5bc19..7dd1edcf099593ebc53ffa7191f5ecaa4a57734e 100644
--- a/src/SubPages/QuotasOfferVacancies.js
+++ b/src/SubPages/QuotasOfferVacancies.js
@@ -21,7 +21,6 @@ along with Portal-SMPPIR-React. If not, see <https://www.gnu.org/licenses/>.
import React, { Component } from 'react';
-import Cookies from 'universal-cookie';
import {Collapsible, Row, Col} from 'react-materialize';
import MapPanel from '../Components/MapPanel';
import CollapsibleContainer from '../Components/CollapsibleContainer'
@@ -32,13 +31,11 @@ import Table from '../Components/Table';
import AutocompleteApp from '../Components/AutocompleteApp';
import BuildStackedBar from '../Charts/BuildStackedBar';
import DropdownCampi from '../Components/DropdownCampi';
+import { Store } from '../Store';
import './Styles/QuotasOfferVacancies.css'
-var ck = new Cookies();
-var contrastCK = new Cookies();
-var cookieStatus = contrastCK.get('contrast');
const type = "vacancy";
const vacancy = "vacancy"
@@ -69,16 +66,10 @@ class QuotasOfferVacancies extends Component {
this.campiFilter = this.campiFilter.bind(this);
}
- componentDidMount(){
- this.setState({cookie:ck.get('mainPageClicked')})
- }
render() {
- var contrastString = '';
- if(cookieStatus === 'true'){
- contrastString = 'Contrast'
- }
- if (ck.get('mainPageClicked') === "VAGAS OFERTADAS" || this.state.cookie === 'VAGAS OFERTADAS')
+
+ var contrastString = this.context.state.contrast;
return (
<div id={type}>
<Row>
@@ -138,7 +129,6 @@ class QuotasOfferVacancies extends Component {
</Row>
</div>
);
- else return <div></div>
}
organizeDataTable(data){
@@ -373,4 +363,6 @@ const tableHeader = ['Ano', 'Turno', 'PcD', 'Não PcD', 'Étnica PcD', 'Étnica
// headerStyles[3] = 'borderRight';
// headerStyles[4] = 'borderRight';
// headerStyles[5] = 'borderRight';
+
+QuotasOfferVacancies.contextType = Store;
export default QuotasOfferVacancies;
diff --git a/src/SubPages/QuotasPROUNI.js b/src/SubPages/QuotasPROUNI.js
index 82dcfdf5a1a46b5b902a4ba3f2a4565b2081666d..a714c278092395185167c7edf2e7406df148a413 100644
--- a/src/SubPages/QuotasPROUNI.js
+++ b/src/SubPages/QuotasPROUNI.js
@@ -32,11 +32,8 @@ import BuildStackedBar from '../Charts/BuildStackedBar';
import BuildBiaxialBars from '../Charts/BuildBiaxialBars';
import AutocompleteApp from '../Components/AutocompleteApp';
import Loading from '../Components/Loading';
-import Cookies from 'universal-cookie';
+import { Store } from '../Store';
-var ck = new Cookies();
-var contrastCK = new Cookies();
-var cookieStatus = contrastCK.get('contrast');
const serverURL = getServerURL();
const type = "prouni";
@@ -66,11 +63,8 @@ class QuotasPROUNI extends Component {
}
render() {
- var contrastString = '';
- if(cookieStatus === 'true'){
- contrastString = 'Contrast'
- }
- if (ck.get('mainPageClicked') === "PROUNI")
+
+ var contrastString = this.context.state.contrast;
return (
<div id={type}>
<Row>
@@ -127,7 +121,6 @@ class QuotasPROUNI extends Component {
</Row>
</div>
);
- else return <div></div>
}
getDataFromAutocomplete(data) {
@@ -300,5 +293,6 @@ createRoute(header) {
}
}
+QuotasPROUNI.contextType = Store;
export default QuotasPROUNI;
\ No newline at end of file
diff --git a/src/SubPages/QuotasSocialSupport.js b/src/SubPages/QuotasSocialSupport.js
index 09bf7aa7d7c265df788bf0e9459d90ab74a48f1c..07ea6f85909abb7035a60e3897637fe2ac76dd4a 100644
--- a/src/SubPages/QuotasSocialSupport.js
+++ b/src/SubPages/QuotasSocialSupport.js
@@ -32,12 +32,9 @@ import BuildBiaxialBars from '../Charts/BuildBiaxialBars';
import AutocompleteApp from '../Components/AutocompleteApp';
import Loading from '../Components/Loading';
import MultiSelector from '../Components/MultiSelector';
-import Cookies from 'universal-cookie';
+import { Store } from '../Store'
// import DropdownCampi from '../Components/DropdownCampi';
-var ck = new Cookies();
-var contrastCK = new Cookies();
-var cookieStatus = contrastCK.get('contrast');
const serverURL = getServerURL();
const type = "social_support";
@@ -79,11 +76,8 @@ class QuotasSocialSupport extends Component {
}
render() {
- var contrastString = '';
- if(cookieStatus === 'true'){
- contrastString = 'Contrast'
- }
- if (ck.get('mainPageClicked') === "APOIO SOCIAL")
+
+ var contrastString = this.context.state.contrast;
return (
<div id={type}>
<Row>
@@ -160,7 +154,6 @@ class QuotasSocialSupport extends Component {
</Row>
</div>
);
- else return <div></div>
}
getDataFromAutocomplete(data) {
@@ -410,5 +403,5 @@ const multiSelector = {
'Apoio Transporte': 'in_apoio_transporte',
}
-
+QuotasSocialSupport.contextType = Store;
export default QuotasSocialSupport;
\ No newline at end of file
diff --git a/src/SubPages/Styles/QuilombolaIndicator1.css b/src/SubPages/Styles/QuilombolaIndicator1.css
index aaaf34b117ebb3624b15253ee525fc137c231105..ab773fc4ccabf6fef309312a4e91c2f7a929c7ad 100644
--- a/src/SubPages/Styles/QuilombolaIndicator1.css
+++ b/src/SubPages/Styles/QuilombolaIndicator1.css
@@ -62,7 +62,7 @@ along with Portal-SMPPIR-React. If not, see <https://www.gnu.org/licenses/>.
color: white;
}
-#ContrastblueCollapsible > .collapsible-header{
+#ContrastredCollapsible > .collapsible-header{
color: yellow;
background-color: black;
}
diff --git a/src/SubPages/YouthAbout.js b/src/SubPages/YouthAbout.js
index 0429ab8455d220beffb5732a4421af0e2427e30b..77b82f26b3b0d8eb7c102a35b0137d7688c8c67c 100644
--- a/src/SubPages/YouthAbout.js
+++ b/src/SubPages/YouthAbout.js
@@ -21,23 +21,21 @@ along with Portal-SMPPIR-React. If not, see <https://www.gnu.org/licenses/>.
import React, { Component } from 'react';
-import Cookies from 'universal-cookie';
import './Styles/YouthPresentation.css'
+import { Store } from '../Store'
-var ck = new Cookies();
class YouthPresentation extends Component {
render() {
- if (ck.get('mainPageClicked') === "SOBRE")
+ var contrastString = this.context.state.contrast;
return (
<div>
<h1>SOBRE JUVENTUDE</h1>
</div>
);
- else return <div></div>
}
}
-
+YouthPresentation.contextType = Store;
export default YouthPresentation;
diff --git a/src/SubPages/YouthEducation.js b/src/SubPages/YouthEducation.js
index 6a7894e64418a3cd2cadd252f2b53ce82cade53a..0a9e7069faafd65b5ccd9269af9c52df45fc164a 100644
--- a/src/SubPages/YouthEducation.js
+++ b/src/SubPages/YouthEducation.js
@@ -28,10 +28,10 @@ import UfBar from '../Components/UfBar';
import GrayBar from '../Components/GrayBar';
import { getStateExtendedName } from '../enviroment';
import * as data from '../JsonsAntigos/juventude-viva/jved'
-import Cookies from 'universal-cookie';
import HeatMap from '../Components/HeatMap';
import BuildBar from '../Charts/BuildBar'
import BuildPie from '../Charts/BuildPie'
+import { Store } from '../Store'
import './Styles/YouthEducation.css'
@@ -42,11 +42,6 @@ import csv4 from './CSVoriginais/pjv/pnad_frequenta_escola_por_uf.csv'
import csv5 from './CSVoriginais/pjv/pnad_distorcao_por_uf.csv'
-
-var ck = new Cookies();
-var contrastCK = new Cookies();
-var cookieStatus = contrastCK.get('contrast');
-
class YouthEducation extends Component {
constructor(props) {
super(props);
@@ -57,11 +52,7 @@ class YouthEducation extends Component {
this.clearMap = this.clearMap.bind(this);
}
render() {
- var contrastString = '';
- if(cookieStatus === 'true'){
- contrastString = 'Contrast'
- }
- if (ck.get('mainPageClicked') === "EDUCAÇÃO")
+ var contrastString = this.context.state.contrast;
return (
<div>
@@ -142,7 +133,6 @@ class YouthEducation extends Component {
</div>
</div>
);
- else return <div></div>
}
getMapClick(clicked) {
@@ -154,7 +144,7 @@ class YouthEducation extends Component {
this.setState({clickedInMap: null});
}
}
-
+YouthEducation.contextType = Store;
export default YouthEducation;
diff --git a/src/SubPages/YouthJob.js b/src/SubPages/YouthJob.js
index 4382dd1438a3dfa069040b99af10259bc22e1336..6427c3f5281bc0fb9595956d2a49a2bfdb90f662 100644
--- a/src/SubPages/YouthJob.js
+++ b/src/SubPages/YouthJob.js
@@ -28,10 +28,10 @@ import UfBar from '../Components/UfBar';
import GrayBar from '../Components/GrayBar';
import { getStateExtendedName } from '../enviroment';
import * as data from '../JsonsAntigos/juventude-viva/jvtr'
-import Cookies from 'universal-cookie';
import HeatMap from '../Components/HeatMap';
import BuildPie from '../Charts/BuildPie'
import BuildStackedBar from '../Charts/BuildStackedBar'
+import { Store } from '../Store'
import './Styles/YouthJob.css'
@@ -41,10 +41,6 @@ import csv3 from './CSVoriginais/pjv/pnad_carteira_assinada_por_uf.csv'
import csv4 from './CSVoriginais/pjv/pnad_percentis_salario_por_uf.csv'
-var ck = new Cookies();
-var contrastCK = new Cookies();
-var cookieStatus = contrastCK.get('contrast');
-
class YouthJob extends Component {
constructor(props) {
super(props);
@@ -55,11 +51,7 @@ class YouthJob extends Component {
this.clearMap = this.clearMap.bind(this);
}
render() {
- var contrastString = '';
- if(cookieStatus === 'true'){
- contrastString = 'Contrast'
- }
- if (ck.get('mainPageClicked') === "TRABALHO")
+ var contrastString = this.context.state.contrast;
return (
<div>
<Row>
@@ -120,7 +112,6 @@ class YouthJob extends Component {
</div>
</div>
);
- else return <div></div>
}
getMapClick(clicked) {
@@ -132,7 +123,7 @@ class YouthJob extends Component {
this.setState({clickedInMap: null});
}
}
-
+YouthJob.contextType = Store;
diff --git a/src/SubPages/YouthPresentation.js b/src/SubPages/YouthPresentation.js
index cd5d591bec9eb852d3eddaaea7331458bd23f7b8..b02b156c0b70998d89c462454fac2da7771a928d 100644
--- a/src/SubPages/YouthPresentation.js
+++ b/src/SubPages/YouthPresentation.js
@@ -21,20 +21,13 @@ along with Portal-SMPPIR-React. If not, see <https://www.gnu.org/licenses/>.
import React, { Component } from 'react';
-import Cookies from 'universal-cookie';
import './Styles/YouthPresentation.css'
+import { Store } from '../Store'
-var ck = new Cookies();
-var contrastCK = new Cookies();
-var cookieStatus = contrastCK.get('contrast');
class YouthPresentation extends Component {
render() {
- var contrastString = '';
- if(cookieStatus === 'true'){
- contrastString = 'Contrast'
- }
- if (ck.get('mainPageClicked') === "APRESENTAÇÃO")
+ var contrastString = this.context.state.contrast;
return (
<div>
<div className="container">
@@ -61,10 +54,9 @@ class YouthPresentation extends Component {
</div>
</div> </div>
);
- else return <div></div>
}
}
-
+YouthPresentation.contextType = Store;
export default YouthPresentation;
diff --git a/src/SubPages/YouthVulnerabilities.js b/src/SubPages/YouthVulnerabilities.js
index 19cb3ae3d44acf1d1fa97019373ea2f43eec2126..dafddc75793f40f5d8d8ac4d9a00dd1070c9148f 100644
--- a/src/SubPages/YouthVulnerabilities.js
+++ b/src/SubPages/YouthVulnerabilities.js
@@ -34,9 +34,8 @@ import BuildPie from '../Charts/BuildPie'
import Table from '../Components/Table'
import * as data from '../JsonsAntigos/juventude-viva/jvvu'
-import Cookies from 'universal-cookie';
-
import './Styles/YouthVulnerabilities.css'
+import { Store } from '../Store'
import csv1 from './CSVoriginais/pjv/sim_pnad_taxa_homicidios_por_uf.csv'
@@ -49,11 +48,6 @@ import csv7 from './CSVoriginais/pjv/pjv_lista_adesao.csv'
import csv8 from './CSVoriginais/pjv/taxa_homicidios_por_municipio.csv'
-
-var ck = new Cookies();
-var contrastCK = new Cookies();
-var cookieStatus = contrastCK.get('contrast');
-
class YouthVulnerabilities extends Component {
constructor(props) {
super(props);
@@ -65,11 +59,7 @@ class YouthVulnerabilities extends Component {
}
render() {
- var contrastString = '';
- if(cookieStatus === 'true'){
- contrastString = 'Contrast'
- }
- if (ck.get('mainPageClicked') === "VULNERABILIDADES")
+ var contrastString = this.context.state.contrast;
return (
<div>
<Row>
@@ -148,7 +138,6 @@ class YouthVulnerabilities extends Component {
</div>
</div>
);
- else return <div></div>
}
getMapClick(clicked) {
@@ -166,9 +155,8 @@ class YouthVulnerabilities extends Component {
"Brancos, 15 a 29 anos":data['Taxa de HomicÃdios (Brancos, 15 a 29 anos)'],
"Negros, 15 a 29 anos": data['Taxa de HomicÃdios (Negros, 15 a 29 anos)'],
"Total, 15 a 29 anos": data['Taxa de HomicÃdios (Total, 15 a 29 anos)']
- }
- ])
-}
+ }])
+ }
fixDataP7(jsonData){
@@ -234,6 +222,8 @@ fixDataP7(jsonData){
}
+YouthVulnerabilities.contextType = Store;
+
diff --git a/src/Youth.js b/src/Youth.js
index 413e3fe568ad3f4901dad1dd72fb5c246e289fbd..b75bfe3f889eaaed6ba08e45d25403ace0df6b0a 100644
--- a/src/Youth.js
+++ b/src/Youth.js
@@ -20,87 +20,61 @@ along with Portal-SMPPIR-React. If not, see <https://www.gnu.org/licenses/>.
-import React, { Component } from 'react';
+import React from 'react';
import NavigationBar from './Components/NavigationBar'
-import AppFooter from './Components/AppFooter'
import YouthPresentation from './SubPages/YouthPresentation'
import YouthVulnerabilities from './SubPages/YouthVulnerabilities'
import YouthEducation from './SubPages/YouthEducation'
import YouthJob from './SubPages/YouthJob'
import { Tab, Tabs } from 'react-materialize'
-import Cookies from 'universal-cookie';
-import { sleep, homeURL } from './enviroment'
-import ContrastBar from './Components/ContrastBar'
+import { Store } from './Store'
import './Styles/Youth.css'
-var ck = new Cookies();
-var contrastCK = new Cookies();
-var cookieStatus = contrastCK.get('contrast');
+function Youth() {
-class Youth extends Component {
- constructor(props) {
- super(props);
- this.whereIAm = this.whereIAm.bind(this);
+ // Get information about which page was accessed
+ const { state, dispatch } = React.useContext(Store);
+ var states = { "APRESENTAÇÃO": false, "VULNERABILIDADES": false, "EDUCAÇÃO": false, "TRABALHO": false}
+ if (state.page in states) {
+ states[state.page] = true
}
- componentDidMount() {
- this.whereIAm()
+ else {
+ states["APRESENTAÇÃO"] = true
}
- render() {
- const cookie = new Cookies();
-
- var clicked = cookie.get('mainPageClicked')
- var states = {"APRESENTAÇÃO": false, "VULNERABILIDADES": true, "EDUCAÇÃO": false, "TRABALHO": false}
- if (clicked !== undefined){
- if (clicked in states){
- states["VULNERABILIDADES"] = false;
- states[clicked] = true;
- }
- else{
- states = {"APRESENTAÇÃO": true, "VULNERABILIDADES": false, "EDUCAÇÃO": false, "TRABALHO": false}
- ck.set('mainPageClicked', 'APRESENTAÇÃO');
- }
- }
- else{
- // Redirect user to the main page if he/she do not have a cookie
- window.location.href = homeURL()
- }
- var contrastString = '';
- if(cookieStatus === 'true'){
- contrastString = 'Contrast'
- }
- return (
- <div id={`${contrastString}mainPage`}>
- <ContrastBar/>
- <NavigationBar/>
-
- <div id='contentTabsDiv'>
- <Tabs className={`tab-demo z-depth-1 ${contrastString}mainPageTealTab`} onChange={this.whereIAm}>
- <Tab title="Apresentação" active={states["APRESENTAÇÃO"]}> <YouthPresentation/> </Tab>
- <Tab title="Vulnerabilidades" active={states["VULNERABILIDADES"]}> <YouthVulnerabilities/> </Tab>
- <Tab title="Educação" active={states["EDUCAÇÃO"]}> <YouthEducation/> </Tab>
- <Tab title="Trabalho" active={states["TRABALHO"]}> <YouthJob/> </Tab>
- </Tabs>
- </div>
- <AppFooter/>
- </div>
- );
+
+ // Hook to set page context
+ const setPageAction = (newPage) => {
+ return dispatch({
+ type: 'SET_PAGE',
+ payload: newPage
+ })
}
+ React.useEffect(() => { });
- whereIAm(e, ev){
- if(ev){
- ck.set('mainPageClicked', ev.target.innerText);
- this.setState({visited:ev.target.innerText});
- }
- sleep(1).then(() => {
- if(document.getElementsByClassName('clearmapbtn')[0])
- document.getElementsByClassName('clearmapbtn')[0].click()
- });
+ const whereIAm = (e, ev) => {
+ if (ev)
+ setPageAction(ev.target.innerText)
}
-}
+ var contrastString = state.contrast
+ return (
+ <div id={`${contrastString}mainPage`}>
+ <NavigationBar/>
+
+ <div id='contentTabsDiv'>
+ <Tabs className={`tab-demo z-depth-1 ${contrastString}mainPageTealTab`} onChange={whereIAm}>
+ <Tab title="Apresentação" active={states["APRESENTAÇÃO"]}> {states["APRESENTAÇÃO"] ? <YouthPresentation /> : <div/>} </Tab>
+ <Tab title="Vulnerabilidades" active={states["VULNERABILIDADES"]}> {states["VULNERABILIDADES"] ? <YouthVulnerabilities /> : <div/>} </Tab>
+ <Tab title="Educação" active={states["EDUCAÇÃO"]}> {states["EDUCAÇÃO"] ? <YouthEducation /> : <div/>} </Tab>
+ <Tab title="Trabalho" active={states["TRABALHO"]}> {states["TRABALHO"] ? <YouthJob /> : <div />} </Tab>
+ </Tabs>
+ </div>
+ </div>
+ );
+}
export default Youth;
diff --git a/src/enviroment.js b/src/enviroment.js
index 5a1b845924996839003ff37ebcaff43c52e3a482..75f4e65bca263c87f711dbb88c60ff6dadc8236c 100644
--- a/src/enviroment.js
+++ b/src/enviroment.js
@@ -44,7 +44,8 @@ const patterns = {
"cod_curso_frequentou_pessoa_memb": ["1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12", "13", "14", "15","NA","null"],
"idade": [],
"genero": [],
- "vlr_renda_media_fam": range(10, 100),
+ // "vlr_renda_media_fam": range(10, 100),
+ "vlr_renda_media_fam": [],
"nu_percent_solicitado_financ": range(10, 100)
}
export function sleep (time) {
@@ -56,9 +57,10 @@ export function range(start, end) {
export function getServerURL() {
// return "http://smppirhomologa.c3sl.ufpr.br:4545/api/v1/"
- return 'http://localhost:4000/api/v1/'
+ //return 'http://localhost:4000/api/v1/'
//caso for fazer build para homologa, utilizar o return de baixo ao invés do de cima
- //return "http://seppirhomologa.c3sl.ufpr.br/data/api/v1/"
+ return "http://seppirdev.c3sl.ufpr.br/data/api/v1/"
+ // return "http://seppirhomologa.c3sl.ufpr.br/data/api/v1/"
}
export function homeURL() {
// Get the current URL
@@ -148,15 +150,15 @@ export function createIntervals(data, intervalKey, intervalRange, yearKey=undefi
}
// Find lowerBound and upperBound
- let tmp = parseInt(workData[0][0][intervalKey]);
+ let tmp = parseInt(workData[0][0][intervalKey], 10);
for (let i = 0; i < workData.length && !tmp && tmp !== 0; i++) {
- tmp = parseInt(workData[0][i][intervalKey]);
+ tmp = parseInt(workData[0][i][intervalKey], 10);
}
let LowerBound = tmp;
let UpperBound = tmp;
for(let i = 0; i < workData.length; i++) {
for (let j = 0; j < workData[i].length; j++) {
- let tmp = parseInt(workData[i][j][intervalKey]);
+ let tmp = parseInt(workData[i][j][intervalKey], 10);
if(tmp || tmp === 0) {
LowerBound = (tmp < LowerBound ? tmp : LowerBound);
UpperBound = (tmp > UpperBound ? tmp : UpperBound);
@@ -213,14 +215,14 @@ export function createIntervals(data, intervalKey, intervalRange, yearKey=undefi
for(let j = 0; j < workData[i].length; j++) {
// Find index on aux for current data
- let value = parseInt(workData[i][j][intervalKey])
+ let value = parseInt(workData[i][j][intervalKey], 10)
value = (value > limit ? limit+1 : value)
let index = value - LowerBound
index = (index - (index % intervalRange)) / intervalRange
// Update group total (Undefined data is discarted)
if (aux[index])
- aux[index]['total'] += parseInt(workData[i][j]['total'])
+ aux[index]['total'] += parseInt(workData[i][j]['total'], 10)
}
dataPerYear = dataPerYear.concat(aux);
diff --git a/src/index.js b/src/index.js
index b9f19c7a60462350acd686dbb6a415ec3937f75f..f9fdda0d6ee198388f6d5394d18703d798c0ca35 100644
--- a/src/index.js
+++ b/src/index.js
@@ -25,6 +25,12 @@ import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import registerServiceWorker from './registerServiceWorker';
-
-ReactDOM.render(<App />, document.getElementById('root'));
+import { StoreProvider } from './Store';
+
+ReactDOM.render(
+ <StoreProvider>
+ <App />
+ </StoreProvider>,
+ document.getElementById('root')
+);
registerServiceWorker();