From abe6d71ba76cc6e04acfce859be7548f3465d1ab Mon Sep 17 00:00:00 2001 From: sjumba <46775605+sjumba@users.noreply.github.com> Date: Mon, 11 Feb 2019 14:40:46 +0200 Subject: [PATCH 1/4] I have linked the Menu button with its respective menu page and included other links to other pages too etc Book, Collection, Donation, Countries, Volunteer. --- package-lock.json | 5 -- package.json | 1 - src/App.js | 12 +++- src/js/components/Books/Book.sass | 7 ++ src/js/components/Books/Bookcard/Bookcard.js | 69 +++++++++++++------ .../components/CollectionsPage/Collection.js | 35 ++++++++++ src/js/components/DonationPage/Donation.js | 35 ++++++++++ src/js/components/Navbar/Navbar.js | 12 ++-- src/js/components/StorePage/Store.js | 20 ++++++ src/js/components/VolunteerPage/Volunteer.js | 20 ++++++ 10 files changed, 179 insertions(+), 37 deletions(-) create mode 100644 src/js/components/Books/Book.sass create mode 100644 src/js/components/CollectionsPage/Collection.js create mode 100644 src/js/components/DonationPage/Donation.js create mode 100644 src/js/components/StorePage/Store.js create mode 100644 src/js/components/VolunteerPage/Volunteer.js diff --git a/package-lock.json b/package-lock.json index a2c9e83..a4a125c 100644 --- a/package-lock.json +++ b/package-lock.json @@ -15653,11 +15653,6 @@ "prop-types": "^15.5.8" } }, - "react-geocode": { - "version": "0.1.2", - "resolved": "https://registry.npmjs.org/react-geocode/-/react-geocode-0.1.2.tgz", - "integrity": "sha512-XEJkEPmwufeGykul/eqJyA1WduXa3IGxJam5BA0jzYfs/KMjCrtQjJl1FcH9Cybn05oQnRVUsRW8OGwEmTER5g==" - }, "react-is": { "version": "16.7.0", "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.7.0.tgz", diff --git a/package.json b/package.json index 64454e5..cd117f5 100644 --- a/package.json +++ b/package.json @@ -10,7 +10,6 @@ "react": "^16.7.0", "react-dom": "^16.7.0", "react-flags-select": "^1.1.10", - "react-geocode": "^0.1.2", "react-motion": "^0.5.2", "react-redux": "^6.0.0", "react-router-dom": "^4.3.1", diff --git a/src/App.js b/src/App.js index d1e050e..75352d7 100644 --- a/src/App.js +++ b/src/App.js @@ -1,16 +1,22 @@ import React, { Component } from "react"; +import logo from "./logo.svg"; import "./App.scss"; -import {BrowserRouter, Route, Switch } from "react-router-dom"; +import {BrowserRouter, Route, Switch, NavLink } from "react-router-dom"; import "./App.sass"; +import Dummy from "./js/components/Dummy"; import Home from "./js/components/Home/Home"; +import Navbar from "./js/components/Navbar/Navbar"; +import { Provider } from "react-redux"; import Books from "./js/components/Books/Books"; import Login from "./js/components/LoginPage/Login"; import SignUp from "./js/components/RegisterPage/SignUp"; import ForgotSignIn from "./js/components/ForgotSignIn/ForgotSignIn"; class App extends Component { - render() { + var loc_navBarTitle = "KnowYourNation"; + var loc_navbarItems = [false, true, true, true]; + return (
@@ -29,4 +35,4 @@ class App extends Component { } } -export default App; \ No newline at end of file +export default App; diff --git a/src/js/components/Books/Book.sass b/src/js/components/Books/Book.sass new file mode 100644 index 0000000..66a2463 --- /dev/null +++ b/src/js/components/Books/Book.sass @@ -0,0 +1,7 @@ +.bookCardFrame + min-height: 150px +.minHeight150 + min-height: 150px +.noPaddMar + padding: 3px !important; + margin: 0 !important; \ No newline at end of file diff --git a/src/js/components/Books/Bookcard/Bookcard.js b/src/js/components/Books/Bookcard/Bookcard.js index b1e794d..58df83c 100644 --- a/src/js/components/Books/Bookcard/Bookcard.js +++ b/src/js/components/Books/Bookcard/Bookcard.js @@ -1,36 +1,61 @@ import React, { Component } from 'react'; -import './Bookcard.scss'; +import './Bookcard.sass'; class Bookcard extends Component { render() { return ( -
-
-

Book Name

+
+
+ Book Name
-
-
- -
-
- Book Name -
-
- - - - - -
+
+
+
+ Book Name +
+
+ +
+
+ + + + +
-
- -
-
+ //
+ //
+ //
+ // sdfsf + //
+ //
+ //
+ //
+ // Book Name + //
+ //
+ //
+ //
+ // + // + // + // + // + //
+ //
+ // + //
+ //
+ //
+ + //
+ //
+ //
+ //
); } } diff --git a/src/js/components/CollectionsPage/Collection.js b/src/js/components/CollectionsPage/Collection.js new file mode 100644 index 0000000..403c044 --- /dev/null +++ b/src/js/components/CollectionsPage/Collection.js @@ -0,0 +1,35 @@ + +import React, { Component } from "react"; +import { BrowserRouter, Route, Switch, NavLink } from "react-router-dom"; + +class collection extends Component { + + + render() { + return ( +
+

Menu

+ +
+ ); + } +} + +export default collection; diff --git a/src/js/components/DonationPage/Donation.js b/src/js/components/DonationPage/Donation.js new file mode 100644 index 0000000..7846aa6 --- /dev/null +++ b/src/js/components/DonationPage/Donation.js @@ -0,0 +1,35 @@ + +import React, { Component } from "react"; +import Button from 'react-bootstrap/Button'; +import { BrowserRouter, Route, Switch, NavLink } from "react-router-dom"; + +class donation extends Component { + + + render() { + return ( +
+

Donation

+
+
+ Amount :
+ Organisation :
+ Organisation :
+
+ +
+ + + + + +
+ + +
+
+ ); + } +} + +export default donation; diff --git a/src/js/components/Navbar/Navbar.js b/src/js/components/Navbar/Navbar.js index abb5e4f..a67d285 100644 --- a/src/js/components/Navbar/Navbar.js +++ b/src/js/components/Navbar/Navbar.js @@ -1,7 +1,7 @@ import React, { Component } from 'react'; import { BrowserRouter, Route, Switch, NavLink } from "react-router-dom"; -import "./Navbar.scss"; +import "./Navbar.sass"; /* loc_navBarTitle: String passed to object for the title @@ -11,13 +11,13 @@ class Navbar extends Component { render() { return ( diff --git a/src/js/components/StorePage/Store.js b/src/js/components/StorePage/Store.js new file mode 100644 index 0000000..334c822 --- /dev/null +++ b/src/js/components/StorePage/Store.js @@ -0,0 +1,20 @@ + +import React, { Component } from "react"; +import { BrowserRouter, Route, Switch, NavLink } from "react-router-dom"; + +class volunteer extends Component { + + + render() { + return ( +
+

store page

+ +
+ ); + } +} + +export default volunteer; diff --git a/src/js/components/VolunteerPage/Volunteer.js b/src/js/components/VolunteerPage/Volunteer.js new file mode 100644 index 0000000..2bfabb5 --- /dev/null +++ b/src/js/components/VolunteerPage/Volunteer.js @@ -0,0 +1,20 @@ + +import React, { Component } from "react"; +import { BrowserRouter, Route, Switch, NavLink } from "react-router-dom"; + +class volunteer extends Component { + + + render() { + return ( +
+

Store

+ +
+ ); + } +} + +export default volunteer; From a8359b661edc2e0d25222d390a763225d7d1e462 Mon Sep 17 00:00:00 2001 From: sjumba <46775605+sjumba@users.noreply.github.com> Date: Mon, 18 Feb 2019 08:24:14 +0200 Subject: [PATCH 2/4] Unstyled pages for Donation related pages for FE --- src/js/components/DonationPage/Donation.js | 170 +++++++++++++++--- .../DonationPage/DonationSuccess.js | 47 +++++ src/js/components/DonationPage/paypal.html | 29 +++ 3 files changed, 226 insertions(+), 20 deletions(-) create mode 100644 src/js/components/DonationPage/DonationSuccess.js create mode 100644 src/js/components/DonationPage/paypal.html diff --git a/src/js/components/DonationPage/Donation.js b/src/js/components/DonationPage/Donation.js index 7846aa6..610561c 100644 --- a/src/js/components/DonationPage/Donation.js +++ b/src/js/components/DonationPage/Donation.js @@ -1,35 +1,165 @@ import React, { Component } from "react"; -import Button from 'react-bootstrap/Button'; +import renderHTML from 'react-render-html'; +import { Container, Col,FormGroup, Label, Input, Button, Form} from 'reactstrap'; + +//import { validatePassword, validateEmail, validateUsername } from './Validators.js'; import { BrowserRouter, Route, Switch, NavLink } from "react-router-dom"; +/*
+Amount :
+Organisation :
+Organisation :
+
+
+ + + + + +
+*/ class donation extends Component { - + constructor(props){ + super(props); + this.state ={ + "cardNumber": "", + "nameonCard": "", + "expirationDate": "", + "cvc": "", + "country": "", + "state": "", + "city": "", + "postal": "", + "email": "", + } + + // this.onChange=this.onChange.bind(this); + //this.onSubmit=this.onSubmit.bind(this); + } + + Payment(){ + + const RequestObject = { + "cardNumber": this.state.cardNumber, + "nameonCard": this.state.nameonCard, + "expirationDate": this.state.expirationDate, + "cvc": this.state.cvc, + "country": this.state.country, + "state": this.state.state, + "city": this.state.city, + "postal": this.state.emailValue, + "email": this.state.email, + } + fetch("https://localhost:44311/api/PayPal", { + method: 'post', + headers: { + 'Accept': 'application/json', + 'Content-Type': 'application/json' + }, + body: JSON.stringify(RequestObject) + }).then(function(response) { + return response.json(); + }).catch(function(data) { + }); + + } render() { return ( -
-

Donation

-
-
- Amount :
- Organisation :
- Organisation :
-
- -
- - - - - -
+ +
+
+ +
+ Donation details
+ Amount  
+ + +

Organisation
Please choose your organisation of choice

+ +
+ Organisation Name    + + +

+ Organisation Name    + + + +
+ + +
+ Payments
+ Credit card number 

+ Expiration date 

+ Security code 

+ + +
+ -
-
+
+
+ + + ); } } export default donation; +{/*
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
*/} diff --git a/src/js/components/DonationPage/DonationSuccess.js b/src/js/components/DonationPage/DonationSuccess.js new file mode 100644 index 0000000..a992067 --- /dev/null +++ b/src/js/components/DonationPage/DonationSuccess.js @@ -0,0 +1,47 @@ + +import React, { Component } from "react"; + +import renderHTML from 'react-render-html'; +import { Container, Col,FormGroup, Label, Input, Button, Form} from 'reactstrap'; +//import { validatePassword, validateEmail, validateUsername } from './Validators.js'; +import { BrowserRouter, Route, Switch, NavLink } from "react-router-dom"; +/*
+Amount :
+Organisation :
+Organisation :
+
+ +
+ + + + + +
+*/ +class donationSuccess extends Component { + + + render() { + return ( + +
+
+ + + Thank you
+ + + +
+ +
+
+ + + + ); + } +} + +export default donationSuccess; \ No newline at end of file diff --git a/src/js/components/DonationPage/paypal.html b/src/js/components/DonationPage/paypal.html new file mode 100644 index 0000000..33e38b7 --- /dev/null +++ b/src/js/components/DonationPage/paypal.html @@ -0,0 +1,29 @@ + + + + + + + + + +
+
+
+
+ +
+
+
+
+ + + + + + + + + + + From 7d8065be38a8f26e3f5068a33fe5242ed7cb3b32 Mon Sep 17 00:00:00 2001 From: sjumba <46775605+sjumba@users.noreply.github.com> Date: Mon, 18 Feb 2019 08:25:01 +0200 Subject: [PATCH 3/4] Updated routes in App.js --- src/App.js | 38 -------------------------------------- 1 file changed, 38 deletions(-) delete mode 100644 src/App.js diff --git a/src/App.js b/src/App.js deleted file mode 100644 index 75352d7..0000000 --- a/src/App.js +++ /dev/null @@ -1,38 +0,0 @@ -import React, { Component } from "react"; -import logo from "./logo.svg"; -import "./App.scss"; -import {BrowserRouter, Route, Switch, NavLink } from "react-router-dom"; -import "./App.sass"; -import Dummy from "./js/components/Dummy"; -import Home from "./js/components/Home/Home"; -import Navbar from "./js/components/Navbar/Navbar"; -import { Provider } from "react-redux"; -import Books from "./js/components/Books/Books"; -import Login from "./js/components/LoginPage/Login"; -import SignUp from "./js/components/RegisterPage/SignUp"; -import ForgotSignIn from "./js/components/ForgotSignIn/ForgotSignIn"; - -class App extends Component { - render() { - var loc_navBarTitle = "KnowYourNation"; - var loc_navbarItems = [false, true, true, true]; - - return ( -
- -
- - - - - - - -
- -
- ); - } -} - -export default App; From 6dc19cc38c258df65d6891ce038487122bef3f83 Mon Sep 17 00:00:00 2001 From: sjumba <46775605+sjumba@users.noreply.github.com> Date: Mon, 18 Feb 2019 08:28:42 +0200 Subject: [PATCH 4/4] Unstyled DonationPages in place, I will style them later on. --- src/js/components/DonationPage/Donation.js | 10 ++-------- src/js/components/DonationPage/DonationSuccess.js | 14 ++------------ 2 files changed, 4 insertions(+), 20 deletions(-) diff --git a/src/js/components/DonationPage/Donation.js b/src/js/components/DonationPage/Donation.js index 610561c..2b576c8 100644 --- a/src/js/components/DonationPage/Donation.js +++ b/src/js/components/DonationPage/Donation.js @@ -97,19 +97,13 @@ class donation extends Component { Security code 

- - -
-
- - - +
); } } diff --git a/src/js/components/DonationPage/DonationSuccess.js b/src/js/components/DonationPage/DonationSuccess.js index a992067..509e1e4 100644 --- a/src/js/components/DonationPage/DonationSuccess.js +++ b/src/js/components/DonationPage/DonationSuccess.js @@ -27,21 +27,11 @@ class donationSuccess extends Component {
- - Thank you
- - -
-
-
- - - +
); } } - -export default donationSuccess; \ No newline at end of file +export default donationSuccess;