@@ -26,8 +28,8 @@ class Homepage extends Component {
@@ -39,9 +41,9 @@ class Homepage extends Component {
@@ -49,9 +51,9 @@ class Homepage extends Component {
@@ -59,9 +61,9 @@ class Homepage extends Component {
@@ -69,9 +71,9 @@ class Homepage extends Component {
@@ -80,13 +82,13 @@ class Homepage extends Component {
@@ -98,4 +100,4 @@ class Homepage extends Component {
}
}
-export default Homepage;
+export default withTranslation()(Homepage);
diff --git a/src/images/bg1.jpg b/src/images/bg1.jpg
new file mode 100644
index 0000000..9caa986
Binary files /dev/null and b/src/images/bg1.jpg differ
diff --git a/src/images/fbg1.png b/src/images/fbg1.png
new file mode 100644
index 0000000..1e09172
Binary files /dev/null and b/src/images/fbg1.png differ
diff --git a/src/images/fbg2.png b/src/images/fbg2.png
new file mode 100644
index 0000000..fe37465
Binary files /dev/null and b/src/images/fbg2.png differ
diff --git a/src/images/fbg3.png b/src/images/fbg3.png
new file mode 100644
index 0000000..8b8019e
Binary files /dev/null and b/src/images/fbg3.png differ
diff --git a/src/listings-page/ListingsPage.css b/src/listings-page/ListingsPage.css
index 80ebdc9..706b707 100644
--- a/src/listings-page/ListingsPage.css
+++ b/src/listings-page/ListingsPage.css
@@ -1,3 +1,9 @@
+body{
+ /*background-image: url("../images/bg1.jpg");
+ background-position: 0px 60px;
+ */
+}
+
.booking_button{
text-align: right;
}
@@ -6,4 +12,33 @@
font-size: 40px;
font-weight:bolder;
padding-right: 5%;
-};
\ No newline at end of file
+}
+
+.search{
+ display:inline-block;
+ margin:3% 0%;
+}
+
+.compass{
+ height:25px;
+ width:25px;
+}
+.buttonImg{
+ background-color: transparent;
+ border: none !important;
+
+}
+
+.main_borders{
+ padding:0% 10% 4% 10%;
+
+}
+
+.map_style{
+ text-align: center;
+}
+
+.filters{
+ margin: 2% 0%
+}
+
diff --git a/src/listings-page/ListingsPage.js b/src/listings-page/ListingsPage.js
index 4d17a58..c9bbe8c 100644
--- a/src/listings-page/ListingsPage.js
+++ b/src/listings-page/ListingsPage.js
@@ -2,198 +2,354 @@
import React, { useState, useEffect, Component } from "react";
import {
GoogleMap,
- withScriptjs,
- withGoogleMap,
+ useLoadScript,
Marker,
- InfoWindow
-} from "react-google-maps";
-import * as listingData from "./data/property-data.json";
+ InfoWindow,
+} from "@react-google-maps/api";
+import usePlacesAutocomplete, {
+ getGeocode,
+ getLatLng,
+} from "use-places-autocomplete";
+import {
+ Combobox,
+ ComboboxInput,
+ ComboboxPopover,
+ ComboboxList,
+ ComboboxOption,
+} from "@reach/combobox";
+import { formatRelative } from "date-fns";
+import Select from "react-select";
+
+import "@reach/combobox/styles.css";
import mapStyles from "./mapStyles";
+import * as listingData from "./data/property-data.json";
import "./ListingsPage.css";
-function Map() {
+import compassImg from "./compass.svg";
- const [selectedProperty, setSelectedProperty] = useState(null);
+const libraries = ["places"];
+const mapContainerStyle = {
+ height: "700px",
+ width: "100vm",
+};
+const options = {
+ styles: mapStyles,
+ disableDefaultUI: true,
+ zoomControl: true,
+};
+const center = {
+ lat: 45.4231,
+ lng: -75.6931,
+};
+
+export default function ListingsPage() {
+ const price_filter = [
+ {
+ value: null,
+ label: "Any",
+ },
+ {
+ value: 100000,
+ label: "$100000",
+ },
+ {
+ value: 200000,
+ label: "$200000",
+ },
+ {
+ value: 300000,
+ label: "$300000",
+ },
+ {
+ value: 400000,
+ label: "$400000",
+ }
+ ];
+
+ const bed_filter = [
+ {
+ value: null,
+ label: "Any",
+ },
+ {
+ value: 1,
+ label: "One Bed",
+ },
+ {
+ value: 2,
+ label: "Two Beds",
+ },
+ {
+ value: 3,
+ label: "Three Beds",
+ }
+
+ ];
+
+ const bath_filter = [
+ {
+ value: null,
+ label: "Any",
+ },
+ {
+ value: 1,
+ label: "One Bath",
+ },
+ {
+ value: 2,
+ label: "Two Baths",
+ },
+ {
+ value: 3,
+ label: "Three Baths",
+ }
+ ];
+
+ //console.log(data1[0]);
+
+ const { isLoaded, loadError } = useLoadScript({
+ googleMapsApiKey: `https://maps.googleapis.com/maps/api/js?v=3.exp&libraries=geometry,drawing,places&key=
+ AIzaSyC5TiZoTEwEcB_HUZRhe_rXrcSWW1Z5x8I`,
+ libraries,
+ });
+
+ const [selectedBudget, setSelectedBudget] = useState(null);
+ const [selectedBeds, setSelectedBeds] = useState(null);
+ const [selectedBaths, setSelectedBaths] = useState(null);
+
+ const [markers, setMarkers] = React.useState([]);
+ const [selected, setSelected] = React.useState(null);
+
+ const [budget, setBudget] = useState(null);
+ const [bed, setBed] = useState(null);
+ const [bath, setBath] = useState(null);
+
+ const mapRef = React.useRef();
+ const onMapLoad = React.useCallback((map) => {
+ mapRef.current = map;
+ //console.log(current);
+ }, []);
+
+ const panTo = React.useCallback(({ lat, lng }) => {
+ mapRef.current.panTo({ lat, lng });
+ mapRef.current.setZoom(10);
+ }, []);
+
+ if (loadError) return "Error";
+ if (!isLoaded) return "Loading...";
+
+ // handle onChange event of the dropdown
+ const handleBudgetChange = (e) => {
+ setSelectedBudget(e);
+ setBudget(e.value);
+
+ //https://stackoverflow.com/questions/54150783/react-hooks-usestate-with-object
+ //https://stackoverflow.com/questions/57341541/removing-object-from-array-using-hooks-usestate/57341724
+ };
+ const handleBedChange = (e) => {
+ setSelectedBeds(e);
+ setBed(e.value);
+ };
+ const handleBathChange = (e) => {
+ setSelectedBaths(e);
+ setBath(e.value);
+ };
return (
-
-
- {listingData.Properties.map(house => (
-
- {
- setSelectedProperty(house)
- }}
-
- icon={{
- url: "homes-3.svg",
- scaledSize: new window.google.maps.Size(50, 50)
- }}
+
-
YOU ARE NOT BUYING A HOUSE,
-YOU ARE BUYING A LIFESTYLE.
+{t("Slogan_1")}
+{t("Slogan_2")}
100 Charlie Rogers, Kanata, ON K2V 1A7
-1 Bedroom, 2 Bathroom
+{t("Rooms")}
-
+
1490 Youville Drive, Orléans, ON K1C 2X8
-1 Bedroom, 2 Bathroom
+{t("Rooms")}
-
+
8720 Russell Road, Navan, ON K4B 1J1
-1 Bedroom, 2 Bathroom
+{t("Rooms")}
-
+
2785 8th Line Road, Metcalfe, ON K0A 2P0
-1 Bedroom, 2 Bathroom
+{t("Rooms")}
-
+
-
Description
- Welcome to Kene's Cribs. Kene's Cribs is a real estator company which provides the clients with the houses.
- The houses limited to the clients are only limited to the clients' dreams. In order to further navigate the
- website, use the navigation bar to switch between pages. Listings page is for browsing houses, Agents page
- is for browsing the estators, the Contact Us page is for the contacting us and the login page is for our
- members who want to benefit from our deals. Above are some houses which can interest you. Feel free to
- click the buttons above to explore the houses you want.
{t("Desc")}
+{t("Home1")}
+ {t("Home2")}
+ {t("Home3")}
+ {t("Home4")}
+ {t("Home5")}
+ {t("Home6")}
+
this.setState({ alertBad: false })} dismissible>
- Message could not send.
+ {t("Danger1")}
this.setState({ alertSucess: false })} dismissible>
- The message is successfully sent.
+ {t("Success1")}
@@ -115,31 +125,34 @@ class ContactUs extends Component {
- value.length === 0}>{t("Contact-Error2")}
+ !/\S+@\S+/.test(value)}>{t("Contact-Error3")}
@@ -203,12 +216,12 @@ class ContactUs extends Component {
}
- alertSuccess(){
+ alertSuccess() {
this.setState({ alertBad: false, alertSucess: true })
}
- alertBad(){
- this.setState({ alertSucess: false, alertBad: true })
+ alertBad() {
+ this.setState({ alertSucess: false, alertBad: true })
}
resetForm() {
@@ -217,4 +230,4 @@ class ContactUs extends Component {
}
-export default ContactUs;
+export default withTranslation()(ContactUs);
diff --git a/src/shared-components/footer-component/Footer.css b/src/shared-components/footer-component/Footer.css
index 1118310..fc1d112 100644
--- a/src/shared-components/footer-component/Footer.css
+++ b/src/shared-components/footer-component/Footer.css
@@ -1,6 +1,8 @@
+
#footer{
text-align: center;
padding: 5% 7%;
+ background-color: white ;
}
.social-icon{
+ {
- setSelectedProperty(null);
- }}
- >
-
-
- )}
-
-
-
-
-
-
-
-
- );
-
-}
-
-const MapWrapped = withScriptjs(withGoogleMap(Map))
-
-
-class ListingsPage extends Component {
- render() {
- return (
-
-
+ );
}
-export default ListingsPage;
+function Locate({ panTo }) {
+ return (
+
+ );
+}
+
+function Search({ panTo }) {
+ const {
+ ready,
+ value,
+ suggestions: { status, data },
+ setValue,
+ clearSuggestions,
+ } = usePlacesAutocomplete({
+ requestOptions: {
+ location: { lat: () => 43.6532, lng: () => -79.3832 },
+ radius: 100 * 1000,
+ },
+ });
+
+ // https://developers.google.com/maps/documentation/javascript/reference/places-autocomplete-service#AutocompletionRequest
+
+ const handleInput = (e) => {
+ setValue(e.target.value);
+ };
+
+ const handleSelect = async (address) => {
+ setValue(address, false);
+ clearSuggestions();
+
+ try {
+ const results = await getGeocode({ address });
+ const { lat, lng } = await getLatLng(results[0]);
+ panTo({ lat, lng });
+ } catch (error) {
+ console.log("😱 Error: ", error);
+ }
+ };
+
+ return (
+
-
- {selectedProperty.ADDRESS}
-{selectedProperty.DESC}
-
-
-
-
-
-
-
-
-
-
- 1
- 2
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- {/*
-
-
-
-
-
-
+
- );
- }
+
-
-
-
- */}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- Map
-
-
-
-
-
-
-
+
+ {listingData.Properties.map((house) =>
+ (budget >= house.PRICE || !budget) &&
+ (bed == house.BEDS || !bed) &&
+ (bath == house.BATHS || !bath) ? (
+ {
+ setSelected(house);
+ }}
+ icon={{
+ url: "homes-3.svg",
+ scaledSize: new window.google.maps.Size(50, 50),
+ }}
+ visible={true}
+ />
+ ) : (
+ {
+ setSelected(house);
+ }}
+ icon={{
+ url: "homes-3.svg",
+ scaledSize: new window.google.maps.Size(50, 50),
+ }}
+ visible={false}
+ />
+ )
+ )}
+
+ {selected ? (
+ {
+ setSelected(null);
+ }}
+ >
+
+ ) : null}
+
+
+
+
+ {selected.ADDRESS}
+{selected.DESC}
+
+
+
+
+
+ {" "}
+ {selected.BEDS}
+ {" "}
+ {selected.BATHS}
+
+
+
+
+
+
+
+
+
+ {status === "OK" &&
+ data.map(({ id, description }) => (
+
+
+
+
+ );
+}
diff --git a/src/listings-page/compass.svg b/src/listings-page/compass.svg
new file mode 100644
index 0000000..e63f36e
--- /dev/null
+++ b/src/listings-page/compass.svg
@@ -0,0 +1,78 @@
+
+
+
diff --git a/src/listings-page/data/property-data.json b/src/listings-page/data/property-data.json
index 7e695db..40b2281 100644
--- a/src/listings-page/data/property-data.json
+++ b/src/listings-page/data/property-data.json
@@ -5,7 +5,9 @@
{
"LISTING_ID": 1,
"ADDRESS": "8720 Russell Road",
- "PRICE": "$500000",
+ "PRICE": 400000,
+ "BEDS":3,
+ "BATHS":3,
"IMAGES":[
],
@@ -26,7 +28,9 @@
"LISTING_ID": 2,
"ADDRESS": "1490 Youville Drive",
- "PRICE": "$500000",
+ "PRICE": 100000,
+ "BEDS":1,
+ "BATHS":1,
"IMAGES":[
],
@@ -49,7 +53,9 @@
"LISTING_ID": 3,
"ADDRESS": "100 Charlie Rogers Place",
- "PRICE": "$500000",
+ "PRICE": 200000,
+ "BEDS":2,
+ "BATHS":3,
"IMAGES":[
],
@@ -72,7 +78,9 @@
"LISTING_ID": 4,
"ADDRESS": "2785 8th Line Road",
- "PRICE": "$500000",
+ "PRICE": 300000,
+ "BEDS":3,
+ "BATHS":3,
"IMAGES":[
],
diff --git a/src/listings-page/data/testing_stuff.json b/src/listings-page/data/testing_stuff.json
deleted file mode 100644
index c38853d..0000000
--- a/src/listings-page/data/testing_stuff.json
+++ /dev/null
@@ -1,789 +0,0 @@
-{
- "type": "FeatureCollection",
- "crs": {
- "type": "name",
- "properties": {"name": "urn: ogc: def: crs: OGC: 1.3: CRS84"}
- },
- "features": [
- {
- "type": "Feature",
- "properties": {
- "PARK_ID": 960,
- "FACILITYID": 28014,
- "NAME": "Bearbrook Skateboard Park",
- "NAME_FR": "Bearbrook skate park",
- "ADDRESS": "8720 Russell Road",
- "ADDRESS_FR": "8720, chemin Russell",
- "FACILITY_T": "flat",
- "FACILITY_1": "flat",
- "ACCESSCTRL": "no / non",
- "ACCESSIBLE": "no / non",
- "OPEN": null,
- "NOTES": "Outdoor",
- "MODIFIED_D": "2018/01/18",
- "CREATED_DA": null,
- "FACILITY": "Neighborhood: smaller size facility to service population of 10,000 or less",
- "FACILITY_F": "Neighborhood: small facility providing services to 10,000 residents or less.",
- "DESCRIPTIO": "Flat asphalt surface, 5 components",
- "DESCRIPT_1": "Flat asphalt surface, 5 modules",
- "PICTURE_LI": null,
- "PICTURE_DE": null,
- "PICTURE__1": null
- },
- "geometry": {
- "type": "Point",
- "coordinates": [-75.3372987731628, 45.383321536272049]
- }
- },
- {
- "type": "Feature",
- "properties": {
- "PARK_ID": 1219,
- "FACILITYID": 28001,
- "NAME": "Bob MacQuarrie Skateboard Park (SK8 Extreme Park)",
- "NAME_FR": "Bob-MacQuarrie Skate Park (SK8 Extreme Park)",
- "ADDRESS": "1490 Youville Drive",
- "ADDRESS_FR": "1490, promenade Youville",
- "FACILITY_T": "other",
- "FACILITY_1": "other",
- "ACCESSCTRL": "no / non",
- "ACCESSIBLE": "no / non",
- "OPEN": null,
- "NOTES": "Outdoor",
- "MODIFIED_D": "2018/01/18",
- "CREATED_DA": null,
- "FACILITY": "Community: mid size facility to service population of 40,000 plus",
- "FACILITY_F": "Community: medium-sized facility providing services to 40,000 residents or more.",
- "DESCRIPTIO": "Flat asphalt surface, 10 components, City run learn to skateboard programs, City run skateboard camps in summer",
- "DESCRIPT_1": "Flat asphalt surface, 10 modules, programs and summer skateboard camps managed by the City",
- "PICTURE_LI": null,
- "PICTURE_DE": null,
- "PICTURE__1": null
- },
- "geometry": {
- "type": "Point",
- "coordinates": [-75.546518086577947, 45.467134581917357]
- }
- },
- {
- "type": "Feature",
- "properties": {
- "PARK_ID": 1157,
- "FACILITYID": 28002,
- "NAME": "Walter Baker Skateboard Park",
- "NAME_FR": "Walter-Baker skate park",
- "ADDRESS": "100 Charlie Rogers Place",
- "ADDRESS_FR": "100, place Charlie Rogers",
- "FACILITY_T": "bowl",
- "FACILITY_1": "bowl",
- "ACCESSCTRL": "no / non",
- "ACCESSIBLE": "no / non",
- "OPEN": null,
- "NOTES": "Outdoor",
- "MODIFIED_D": "2018/01/18",
- "CREATED_DA": null,
- "FACILITY": "Community: mid size facility to service population of 40,000 plus",
- "FACILITY_F": "Community: medium-sized facility providing services to 40,000 residents or more.",
- "DESCRIPTIO": "Concrete bowl, 7,000 sq ft",
- "DESCRIPT_1": "Concrete bowl, 7,000 sq. Ft.",
- "PICTURE_LI": null,
- "PICTURE_DE": null,
- "PICTURE__1": null
- },
- "geometry": {
- "type": "Point",
- "coordinates": [-75.898610599532319, 45.295014379864874]
- }
- },
- {
- "type": "Feature",
- "properties": {
- "PARK_ID": 9,
- "FACILITYID": 28006,
- "NAME": "Roving Skateboard Park Location",
- "NAME_FR": "Location of an itinerant skate park",
- "ADDRESS": "2785 8th Line Road",
- "ADDRESS_FR": "2785, chemin 8th Line",
- "FACILITY_T": "other",
- "FACILITY_1": "other",
- "ACCESSCTRL": "no / non",
- "ACCESSIBLE": "no / non",
- "OPEN": null,
- "NOTES": "Outdoor - Mobile",
- "MODIFIED_D": "2018/01/18",
- "CREATED_DA": null,
- "FACILITY": "Metcalfe Community Center - Roving Skateboard Park Location",
- "FACILITY_F": "Metcalfe Community Center - Itinerant skate park site",
- "DESCRIPTIO": "Flat surface, 5 components",
- "DESCRIPT_1": "Flat surface, 5 modules",
- "PICTURE_LI": null,
- "PICTURE_DE": null,
- "PICTURE__1": null
- },
- "geometry": {
- "type": "Point",
- "coordinates": [-75.468561642270757, 45.23032561834377]
- }
- },
- {
- "type": "Feature",
- "properties": {
- "PARK_ID": 1160,
- "FACILITYID": 28007,
- "NAME": "Roving Skateboard Park Location",
- "NAME_FR": "Location of an itinerant skate park",
- "ADDRESS": "10 Warner Colpitts Lane",
- "ADDRESS_FR": "10, ruelle Warner Colpitts",
- "FACILITY_T": "flat",
- "FACILITY_1": "flat",
- "ACCESSCTRL": "yes / oui",
- "ACCESSIBLE": "no / non",
- "OPEN": null,
- "NOTES": "Indoor - Summer",
- "MODIFIED_D": "2018/03/07",
- "CREATED_DA": null,
- "FACILITY": "Johnny Leroux Stittsville Community Arena - Roving Skateboard Park Location",
- "FACILITY_F": "Stittsville Johnny-Leroux community arena - Itinerant skate park site",
- "DESCRIPTIO": "Flat surface, 5 components",
- "DESCRIPT_1": "Flat surface, 5 modules",
- "PICTURE_LI": null,
- "PICTURE_DE": null,
- "PICTURE__1": null
- },
- "geometry": {
- "type": "Point",
- "coordinates": [-75.926651366520872, 45.260659774950561]
- }
- },
- {
- "type": "Feature",
- "properties": {
- "PARK_ID": 1693,
- "FACILITYID": 28016,
- "NAME": "Legacy Skateboard Park",
- "NAME_FR": "Skatepark Legacy",
- "ADDRESS": "101 Centrepointe Drive",
- "ADDRESS_FR": "101, promenade Centrepointe",
- "FACILITY_T": "bowl",
- "FACILITY_1": "bowl",
- "ACCESSCTRL": "no / non",
- "ACCESSIBLE": "no / non",
- "OPEN": null,
- "NOTES": "Outdoor",
- "MODIFIED_D": "2018/01/18",
- "CREATED_DA": null,
- "FACILITY": "District: larger facility to service population of 100,000 plus",
- "FACILITY_F": "District: large facility providing services to 100,000 or more residents.",
- "DESCRIPTIO": "Large concrete bowl, many street and vertical components, 17,000 sq ft",
- "DESCRIPT_1": "Large concrete bowl, street modules and vertical modules, 17,000 ft2",
- "PICTURE_LI": null,
- "PICTURE_DE": null,
- "PICTURE__1": null
- },
- "geometry": {
- "type": "Point",
- "coordinates": [-75.760933332842754, 45.345566668964558]
- }
- },
- {
- "type": "Feature",
- "properties": {
- "PARK_ID": 1717,
- "FACILITYID": 28018,
- "NAME": "Greenboro Skateboard Park",
- "NAME_FR": "Greenboro skate park",
- "ADDRESS": "3142 Conroy Road",
- "ADDRESS_FR": "3142, chemin Conroy",
- "FACILITY_T": "flat",
- "FACILITY_1": "flat",
- "ACCESSCTRL": "no / non",
- "ACCESSIBLE": "no / non",
- "OPEN": null,
- "NOTES": "Outdoor",
- "MODIFIED_D": "2018/01/18",
- "CREATED_DA": null,
- "FACILITY": "Neighborhood: smaller size facility to service population of 10,000 or less",
- "FACILITY_F": "Neighborhood: small facility providing services to 10,000 residents or less.",
- "DESCRIPTIO": "Flat asphalt surface, 5 components",
- "DESCRIPT_1": "Flat asphalt surface, 5 modules",
- "PICTURE_LI": null,
- "PICTURE_DE": null,
- "PICTURE__1": null
- },
- "geometry": {
- "type": "Point",
- "coordinates": [-75.625996131485707, 45.375401587496128]
- }
- },
- {
- "type": "Feature",
- "properties": {
- "PARK_ID": 137,
- "FACILITYID": 28019,
- "NAME": "Bridlewood Skateboard Park",
- "NAME_FR": "Bridlewood skate park",
- "ADDRESS": "65 Stonehaven Drive",
- "ADDRESS_FR": "65 Stonehaven Drive",
- "FACILITY_T": "flat",
- "FACILITY_1": "flat",
- "ACCESSCTRL": "no / non",
- "ACCESSIBLE": "no / non",
- "OPEN": null,
- "NOTES": "Outdoor",
- "MODIFIED_D": "2018/01/18",
- "CREATED_DA": null,
- "FACILITY": "Neighborhood: smaller size facility to service population of 10,000 or less",
- "FACILITY_F": "Neighborhood: small facility providing services to 10,000 residents or less.",
- "DESCRIPTIO": "Flat asphalt surface, 5 components",
- "DESCRIPT_1": "Flat asphalt surface, 5 modules",
- "PICTURE_LI": null,
- "PICTURE_DE": null,
- "PICTURE__1": null
- },
- "geometry": {
- "type": "Point",
- "coordinates": [-75.857009812435976, 45.290758029776626]
- }
- },
- {
- "type": "Feature",
- "properties": {
- "PARK_ID": 1133,
- "FACILITYID": 28020,
- "NAME": "Roving Skateboard Park Location",
- "NAME_FR": "Location of an itinerant skate park",
- "ADDRESS": "100 Clifford Campbell Street",
- "ADDRESS_FR": "100, rue Clifford-Campbell",
- "FACILITY_T": "flat",
- "FACILITY_1": "flat",
- "ACCESSCTRL": "no / non",
- "ACCESSIBLE": "no / non",
- "OPEN": null,
- "NOTES": "Outdoor",
- "MODIFIED_D": "2018/01/18",
- "CREATED_DA": null,
- "FACILITY": "Fitzroy Harbor Community Center - Roving Skateboard Park Location",
- "FACILITY_F": "Fitzroy Harbor Community Center - Itinerant skate park site",
- "DESCRIPTIO": "Flat surface, 5 components",
- "DESCRIPT_1": "Flat surface, 5 modules",
- "PICTURE_LI": null,
- "PICTURE_DE": null,
- "PICTURE__1": null
- },
- "geometry": {
- "type": "Point",
- "coordinates": [-76.206087708136721, 45.470459866077654]
- }
- },
- {
- "type": "Feature",
- "properties": {
- "PARK_ID": 657,
- "FACILITYID": 28000,
- "NAME": "Roving Skateboard Park Location",
- "NAME_FR": "Location of an itinerant skate park",
- "ADDRESS": "110 Malvern Drive",
- "ADDRESS_FR": "110, promenade Malvern",
- "FACILITY_T": "flat",
- "FACILITY_1": "flat",
- "ACCESSCTRL": "no / non",
- "ACCESSIBLE": "no / non",
- "OPEN": null,
- "NOTES": "Outdoor",
- "MODIFIED_D": "2018/01/18",
- "CREATED_DA": null,
- "FACILITY": "Walter Baker Sports Center - Roving Skateboard Park Location",
- "FACILITY_F": "Walter-Baker Sports Center - Itinerant skate park site",
- "DESCRIPTIO": "Flat surface, 5 components",
- "DESCRIPT_1": "Flat surface, 5 modules",
- "PICTURE_LI": null,
- "PICTURE_DE": null,
- "PICTURE__1": null
- },
- "geometry": {
- "type": "Point",
- "coordinates": [-75.760235255689508, 45.280622216516925]
- }
- },
- {
- "type": "Feature",
- "properties": {
- "PARK_ID": 653,
- "FACILITYID": 28008,
- "NAME": "Roving Skateboard Park Location",
- "NAME_FR": "Location of an itinerant skate park",
- "ADDRESS": "5660 Osgoode Main Street",
- "ADDRESS_FR": "5660, rue Osgoode Main",
- "FACILITY_T": "other",
- "FACILITY_1": "other",
- "ACCESSCTRL": "no / non",
- "ACCESSIBLE": "no / non",
- "OPEN": null,
- "NOTES": "Outdoor - Mobile",
- "MODIFIED_D": "2018/01/18",
- "CREATED_DA": null,
- "FACILITY": "Osgoode Community Center - Roving Skateboard Park Location",
- "FACILITY_F": "Osgoode Community Center - Itinerant skate park site",
- "DESCRIPTIO": "Flat surface, 5 components",
- "DESCRIPT_1": "Flat surface, 5 modules",
- "PICTURE_LI": null,
- "PICTURE_DE": null,
- "PICTURE__1": null
- },
- "geometry": {
- "type": "Point",
- "coordinates": [-75.60118478829267, 45.147641950106689]
- }
- },
- {
- "type": "Feature",
- "properties": {
- "PARK_ID": 812,
- "FACILITYID": 35050,
- "NAME": "Charlie Bowins Skateboard Park",
- "NAME_FR": "Charlie-Bowins skate park",
- "ADDRESS": "435 Bronson Avenue",
- "ADDRESS_FR": "435, avenue Bronson",
- "FACILITY_T": "bowl",
- "FACILITY_1": "bowl",
- "ACCESSCTRL": "no / non",
- "ACCESSIBLE": "no / non",
- "OPEN": null,
- "NOTES": "Outdoor (Commemoratively named Charlie Bowins Skateboard Park on June 10, 2015)",
- "MODIFIED_D": "2018/01/18",
- "CREATED_DA": "2015/05/20",
- "FACILITY": "District: larger facility to service population of 100,000 plus",
- "FACILITY_F": "District: large facility providing services to 100,000 or more residents.",
- "DESCRIPTIO": "Flat concrete surface, 10 plus components (large half pipe), City run learn to skateboard programs, City run skateboard camps in summer",
- "DESCRIPT_1": "Flat concrete surface, 10 or more modules (large halfpipe), summer skateboard programs and camps managed by the City",
- "PICTURE_LI": null,
- "PICTURE_DE": null,
- "PICTURE__1": null
- },
- "geometry": {
- "type": "Point",
- "coordinates": [-75.703622500360268, 45.408488357092367]
- }
- },
- {
- "type": "Feature",
- "properties": {
- "PARK_ID": 2457,
- "FACILITYID": 35637,
- "NAME": "Diamond Jubilee Skateboard Park",
- "NAME_FR": "Diamond Jubilee Skate Park",
- "ADDRESS": "2810 Findlay Creek Drive",
- "ADDRESS_FR": "2810 Findlay Creek Drive",
- "FACILITY_T": "flat",
- "FACILITY_1": "flat",
- "ACCESSCTRL": "no / non",
- "ACCESSIBLE": "yes / oui",
- "OPEN": null,
- "NOTES": "Outdoor",
- "MODIFIED_D": "2017/07/11",
- "CREATED_DA": "2016/06/22",
- "FACILITY": "Neighborhood: smaller size facility to service population of 10,000 or less",
- "FACILITY_F": "Neighborhood: small facility providing services to 10,000 residents or less.",
- "DESCRIPTIO": "Flat asphalt surface, 5 components",
- "DESCRIPT_1": "Flat asphalt surface, 5 modules",
- "PICTURE_LI": null,
- "PICTURE_DE": null,
- "PICTURE__1": null
- },
- "geometry": {
- "type": "Point",
- "coordinates": [-75.609516309730921, 45.314086718258636]
- }
- },
- {
- "type": "Feature",
- "properties": {
- "PARK_ID": 430,
- "FACILITYID": 28005,
- "NAME": "Blackburn Skateboard Park",
- "NAME_FR": "Blackburn skate park",
- "ADDRESS": "190 Glen Park Drive",
- "ADDRESS_FR": "190 Glen Park Drive",
- "FACILITY_T": "flat",
- "FACILITY_1": "flat",
- "ACCESSCTRL": "no / non",
- "ACCESSIBLE": "no / non",
- "OPEN": null,
- "NOTES": "Outdoor",
- "MODIFIED_D": "2018/01/18",
- "CREATED_DA": null,
- "FACILITY": "Neighborhood: smaller size facility to service population of 10,000 or less",
- "FACILITY_F": "Neighborhood: small facility providing services to 10,000 residents or less.",
- "DESCRIPTIO": "Flat asphalt surface, 5 components",
- "DESCRIPT_1": "Flat asphalt surface, 5 modules",
- "PICTURE_LI": null,
- "PICTURE_DE": null,
- "PICTURE__1": null
- },
- "geometry": {
- "type": "Point",
- "coordinates": [-75.562796920677627, 45.429643413219814]
- }
- },
- {
- "type": "Feature",
- "properties": {
- "PARK_ID": 989,
- "FACILITYID": 28017,
- "NAME": "Goulbourn Skateboard Park",
- "NAME_FR": "Planchodrome Goulbourn",
- "ADDRESS": "1500 Shea Road",
- "ADDRESS_FR": "1500, chemin Shea",
- "FACILITY_T": "flat",
- "FACILITY_1": "flat",
- "ACCESSCTRL": "no / non",
- "ACCESSIBLE": "no / non",
- "OPEN": null,
- "NOTES": "Outdoor",
- "MODIFIED_D": "2018/01/18",
- "CREATED_DA": null,
- "FACILITY": "Neighborhood: smaller size facility to service population of 10,000 or less",
- "FACILITY_F": "Neighborhood: small facility providing services to 10,000 residents or less.",
- "DESCRIPTIO": "Flat asphalt surface, 6 components",
- "DESCRIPT_1": "Flat asphalt surface, 6 modules",
- "PICTURE_LI": null,
- "PICTURE_DE": null,
- "PICTURE__1": null
- },
- "geometry": {
- "type": "Point",
- "coordinates": [-75.907108695123526, 45.26222860981953]
- }
- },
- {
- "type": "Feature",
- "properties": {
- "PARK_ID": 1334,
- "FACILITYID": 28011,
- "NAME": "Constance Bay Skateboard Park",
- "NAME_FR": "Constance Bay skate park",
- "ADDRESS": "262 Len Purcell Drive",
- "ADDRESS_FR": "262, Len-Purcell promenade",
- "FACILITY_T": "other",
- "FACILITY_1": "other",
- "ACCESSCTRL": "no / non",
- "ACCESSIBLE": "no / non",
- "OPEN": null,
- "NOTES": "Outdoor",
- "MODIFIED_D": "2018/01/18",
- "CREATED_DA": null,
- "FACILITY": "Neighborhood: smaller size facility to service population of 10,000 or less",
- "FACILITY_F": "Neighborhood: small facility providing services to 10,000 residents or less.",
- "DESCRIPTIO": "Flat asphalt surface, 5 components",
- "DESCRIPT_1": "Flat asphalt surface, 5 modules",
- "PICTURE_LI": null,
- "PICTURE_DE": null,
- "PICTURE__1": null
- },
- "geometry": {
- "type": "Point",
- "coordinates": [-76.09244957349965, 45.499050061534312]
- }
- },
- {
- "type": "Feature",
- "properties": {
- "PARK_ID": 923,
- "FACILITYID": 28013,
- "NAME": "Roving Skateboard Park Location",
- "NAME_FR": "Location of an itinerant skate park",
- "ADDRESS": "334 River Road",
- "ADDRESS_FR": "334, chemin River",
- "FACILITY_T": "flat",
- "FACILITY_1": "flat",
- "ACCESSCTRL": "no / non",
- "ACCESSIBLE": "no / non",
- "OPEN": null,
- "NOTES": "Outdoor",
- "MODIFIED_D": "2018/01/18",
- "CREATED_DA": null,
- "FACILITY": "Eccolands Park - Roving Skateboard Park Location",
- "FACILITY_F": "Parc Eccolands - Location of an itinerant skate park",
- "DESCRIPTIO": "Flat surface, 5 components",
- "DESCRIPT_1": "Flat surface, 5 modules",
- "PICTURE_LI": null,
- "PICTURE_DE": null,
- "PICTURE__1": null
- },
- "geometry": {
- "type": "Point",
- "coordinates": [-75.695392300925718, 45.315355581248873]
- }
- },
- {
- "type": "Feature",
- "properties": {
- "PARK_ID": 762,
- "FACILITYID": 28004,
- "NAME": "Trillium Park Skateboard Park",
- "NAME_FR": "Park Trillium skate park",
- "ADDRESS": "2030 Ogilvie Road",
- "ADDRESS_FR": "2030, chemin Ogilvie",
- "FACILITY_T": "flat",
- "FACILITY_1": "flat",
- "ACCESSCTRL": "no / non",
- "ACCESSIBLE": "no / non",
- "OPEN": null,
- "NOTES": "Outdoor",
- "MODIFIED_D": "2018/01/18",
- "CREATED_DA": null,
- "FACILITY": "Neighborhood: smaller size facility to service population of 10,000 or less",
- "FACILITY_F": "Neighborhood: small facility providing services to 10,000 residents or less.",
- "DESCRIPTIO": "Flat asphalt surface, 5 components",
- "DESCRIPT_1": "Flat asphalt surface, 5 modules",
- "PICTURE_LI": null,
- "PICTURE_DE": null,
- "PICTURE__1": null
- },
- "geometry": {
- "type": "Point",
- "coordinates": [-75.601158413850058, 45.436441777242031]
- }
- },
- {
- "type": "Feature",
- "properties": {
- "PARK_ID": 52,
- "FACILITYID": 35120,
- "NAME": "Lansdowne Skateboard Park",
- "NAME_FR": "Lansdowne Skate Park",
- "ADDRESS": "450 Queen Elizabeth Driveway",
- "ADDRESS_FR": "450 Queen Elizabeth Drive",
- "FACILITY_T": "flat",
- "FACILITY_1": "flat",
- "ACCESSCTRL": "no / non",
- "ACCESSIBLE": "yes / oui",
- "OPEN": null,
- "NOTES": "Outdoor",
- "MODIFIED_D": "2017/07/11",
- "CREATED_DA": "2015/09/23",
- "FACILITY": "A series of skateboard ramps ideally suited to beginners.",
- "FACILITY_F": "A series of ramps suitable for beginners.",
- "DESCRIPTIO": "Flat asphalt surface",
- "DESCRIPT_1": "Flat asphalt surface",
- "PICTURE_LI": null,
- "PICTURE_DE": null,
- "PICTURE__1": null
- },
- "geometry": {
- "type": "Point",
- "coordinates": [-75.681193500335723, 45.400372622455215]
- }
- },
- {
- "type": "Feature",
- "properties": {
- "PARK_ID": 2488,
- "FACILITYID": 35815,
- "NAME": "Greely Village Skateboard Park",
- "NAME_FR": "Planchodrome Greely Village",
- "ADDRESS": "7292 Parkway Road",
- "ADDRESS_FR": "7292, chemin Parkway",
- "FACILITY_T": "other",
- "FACILITY_1": "other",
- "ACCESSCTRL": "no / non",
- "ACCESSIBLE": "yes / oui",
- "OPEN": null,
- "NOTES": "Outdoor",
- "MODIFIED_D": "2018/01/04",
- "CREATED_DA": "2017/04/28",
- "FACILITY": "Neighborhood: smaller size facility to service population of 10,000 or less",
- "FACILITY_F": "Neighborhood: small facility providing services to 10,000 residents or less.",
- "DESCRIPTIO": "Flat concrete surface, 5 components",
- "DESCRIPT_1": "Flat concrete surface, 5 modules",
- "PICTURE_LI": null,
- "PICTURE_DE": null,
- "PICTURE__1": null
- },
- "geometry": {
- "type": "Point",
- "coordinates": [-75.553065849890629, 45.265433081236672]
- }
- },
- {
- "type": "Feature",
- "properties": {
- "PARK_ID": 330,
- "FACILITYID": 28003,
- "NAME": "Manotick Skateboard Park",
- "NAME_FR": "Planchodrome Manotick",
- "ADDRESS": "5572 Doctor Leach Drive",
- "ADDRESS_FR": "5572, Doctor-Leach promenade",
- "FACILITY_T": "flat",
- "FACILITY_1": "flat",
- "ACCESSCTRL": "yes / oui",
- "ACCESSIBLE": "no / non",
- "OPEN": null,
- "NOTES": "Outdoor - Joined with basketball",
- "MODIFIED_D": "2018/01/18",
- "CREATED_DA": null,
- "FACILITY": "Community: mid size facility to service population of 40,000 plus",
- "FACILITY_F": "Community: medium-sized facility providing services to 40,000 residents or more.",
- "DESCRIPTIO": "Flat asphalt surface, 8 components",
- "DESCRIPT_1": "Flat asphalt surface, 8 modules",
- "PICTURE_LI": null,
- "PICTURE_DE": null,
- "PICTURE__1": null
- },
- "geometry": {
- "type": "Point",
- "coordinates": [-75.686746214582783, 45.22266136322127]
- }
- },
- {
- "type": "Feature",
- "properties": {
- "PARK_ID": 693,
- "FACILITYID": 28010,
- "NAME": "Roving Skateboard Park Location",
- "NAME_FR": "Location of an itinerant skate park",
- "ADDRESS": "1448 Meadow Drive",
- "ADDRESS_FR": "1448 Meadow Drive",
- "FACILITY_T": "other",
- "FACILITY_1": "other",
- "ACCESSCTRL": "no / non",
- "ACCESSIBLE": "no / non",
- "OPEN": null,
- "NOTES": "Outdoor - Mobile",
- "MODIFIED_D": "2018/01/18",
- "CREATED_DA": null,
- "FACILITY": "Andy Shields Park - Roving Skateboard Park Location",
- "FACILITY_F": "Andy-Shields Park - Location of an itinerant skate park",
- "DESCRIPTIO": "Flat surface, 5 components",
- "DESCRIPT_1": "Flat surface, 5 modules",
- "PICTURE_LI": null,
- "PICTURE_DE": null,
- "PICTURE__1": null
- },
- "geometry": {
- "type": "Point",
- "coordinates": [-75.556978502821494, 45.261353985880973]
- }
- },
- {
- "type": "Feature",
- "properties": {
- "PARK_ID": 2544,
- "FACILITYID": 35667,
- "NAME": "Berrigan Skateboard Park",
- "NAME_FR": "Planchodrome Berrigan",
- "ADDRESS": "51 Berrigan Drive",
- "ADDRESS_FR": "51, promenade Berrigan",
- "FACILITY_T": "flat",
- "FACILITY_1": "flat",
- "ACCESSCTRL": "no / non",
- "ACCESSIBLE": "no / non",
- "OPEN": null,
- "NOTES": "Outdoor",
- "MODIFIED_D": "2018/02/27",
- "CREATED_DA": "2016/06/27",
- "FACILITY": "Community: mid size facility to service population of 40,000 plus",
- "FACILITY_F": "Community: medium-sized facility providing services to 40,000 residents or more.",
- "DESCRIPTIO": "Flat concrete surface, 10 plus components",
- "DESCRIPT_1": "Flat concrete surface, 10 or more modules",
- "PICTURE_LI": null,
- "PICTURE_DE": null,
- "PICTURE__1": null
- },
- "geometry": {
- "type": "Point",
- "coordinates": [-75.747348794023239, 45.275696004260205]
- }
- },
- {
- "type": "Feature",
- "properties": {
- "PARK_ID": 2599,
- "FACILITYID": 49251,
- "NAME": "Eugène Martineau Skateboard Park",
- "NAME_FR": "Planchodrome Eugène-Martineau",
- "ADDRESS": "710 Mikinak Road",
- "ADDRESS_FR": "710, chemin Mikinak",
- "FACILITY_T": "flat",
- "FACILITY_1": "flat",
- "ACCESSCTRL": "no / non",
- "ACCESSIBLE": "yes / oui",
- "OPEN": null,
- "NOTES": "Outdoor",
- "MODIFIED_D": "2018/11/29",
- "CREATED_DA": "2018/11/29",
- "FACILITY": "Neighborhood: smaller size facility to service population of 10,000 or less",
- "FACILITY_F": "Neighborhood: small facility providing services to 10,000 residents or less.",
- "DESCRIPTIO": "Flat surface, 5 components",
- "DESCRIPT_1": "Flat surface, 5 modules",
- "PICTURE_LI": null,
- "PICTURE_DE": null,
- "PICTURE__1": null
- },
- "geometry": {
- "type": "Point",
- "coordinates": [-75.632030968141081, 45.450696284941976]
- }
- },
- {
- "type": "Feature",
- "properties": {
- "PARK_ID": 2278,
- "FACILITYID": 49211,
- "NAME": "Vista Skateboard Park",
- "NAME_FR": "Planchodrome Vista",
- "ADDRESS": "720 Vistapark Drive",
- "ADDRESS_FR": "720, Vistapark promenade",
- "FACILITY_T": "flat",
- "FACILITY_1": "flat",
- "ACCESSCTRL": "no / non",
- "ACCESSIBLE": "yes / oui",
- "OPEN": null,
- "NOTES": "Outdoor",
- "MODIFIED_D": "2018/11/29",
- "CREATED_DA": "2018/06/22",
- "FACILITY": "Neighborhood: smaller size facility to service population of 10,000 or less",
- "FACILITY_F": "Neighborhood: small facility providing services to 10,000 residents or less.",
- "DESCRIPTIO": "Flat surface, 5 components",
- "DESCRIPT_1": "Flat surface, 5 modules",
- "PICTURE_LI": null,
- "PICTURE_DE": null,
- "PICTURE__1": null
- },
- "geometry": {
- "type": "Point",
- "coordinates": [-75.471003922143311, 45.450391044010431]
- }
- },
- {
- "type": "Feature",
- "properties": {
- "PARK_ID": 2113,
- "FACILITYID": 35299,
- "NAME": "Innovation Skateboard Park",
- "NAME_FR": "Planchomdrome Innovation",
- "ADDRESS": "4101 Innovation Drive",
- "ADDRESS_FR": "4101, promenade Innovation",
- "FACILITY_T": "bowl",
- "FACILITY_1": "bowl",
- "ACCESSCTRL": "no / non",
- "ACCESSIBLE": "yes / oui",
- "OPEN": null,
- "NOTES": "Outdoor",
- "MODIFIED_D": "2017/07/11",
- "CREATED_DA": "2016/02/08",
- "FACILITY": "District: larger facility to service population of 100,000 plus",
- "FACILITY_F": "District: large facility providing services to 100,000 or more residents.",
- "DESCRIPTIO": "Large concrete bowl, 10 plus components, many street and vertical components",
- "DESCRIPT_1": "Large concrete bowl, 10 or more modules, street modules and vertical modules",
- "PICTURE_LI": null,
- "PICTURE_DE": null,
- "PICTURE__1": null
- },
- "geometry": {
- "type": "Point",
- "coordinates": [-75.931122879767898, 45.34125624499935]
- }
- }
- ]
- }
\ No newline at end of file
diff --git a/src/shared-components/contact-us/Contact-us.css b/src/shared-components/contact-us/Contact-us.css
index ffd848f..14fae23 100644
--- a/src/shared-components/contact-us/Contact-us.css
+++ b/src/shared-components/contact-us/Contact-us.css
@@ -19,7 +19,7 @@
}
.heading-1{
- padding-left: 38%;
+ padding-left: 36%;
padding-top: 10px;
padding-bottom: 20%;
font-size: 40px;
diff --git a/src/shared-components/contact-us/contact-us.js b/src/shared-components/contact-us/contact-us.js
index 7030362..577181c 100644
--- a/src/shared-components/contact-us/contact-us.js
+++ b/src/shared-components/contact-us/contact-us.js
@@ -7,6 +7,7 @@ import {
FormWithConstraints
} from 'react-form-with-constraints';
import Alert from 'react-bootstrap/Alert';
+import { withTranslation } from "react-i18next";
@@ -28,25 +29,26 @@ class ContactUs extends Component {
render() {
+ const { t } = this.props;
return (
- There are some errors in your contact form. -
+ {t("Danger2")} +- You contact form will be delivered to our support team. -
+ {t("Success2")} +
- this.form = form}
id="contact-form"
onSubmit={this.handleSubmit.bind(this)}
@@ -57,30 +59,34 @@ class ContactUs extends Component {
-
+ {t("Contact-Error1")}
+
@@ -90,24 +96,28 @@ class ContactUs extends Component {
-
-
+
+ {t("Contact-Error2")}
+
Contact Us
+{t("Contact-Title")}
-
-
+
+ {t("Contact-Error1")}
+
-
-
+
+ {t("Contact-Error2")}
+
-
-
+
+ {t("Contact-Error1")}
+
+ {t("Contact-Submit")}
+