edit

Dazzel-18 · Apr 28, 2018 · 1231434 · 1231434
1 parent e3a88e9
commit 1231434
Show file tree

Hide file tree

Showing 6 changed files with 61 additions and 144 deletions.
diff --git a/database-mongo/index.js b/database-mongo/index.js
@@ -4,6 +4,7 @@ var mongoose = require('mongoose');
 //set mongoose connection
  //mongoose.connect('mongodb://localhost/doctors');
 mongoose.connect('mongodb://dazzel:[email protected]:55329/doctorsdb');
+
 var db = mongoose.connection;
 
 db.on('error', function() {

diff --git a/react-client/src/components/Home.jsx b/react-client/src/components/Home.jsx
@@ -2,25 +2,21 @@ import React,{Component} from 'react';
 import { Navbar,Nav,NavItem,Carousel} from 'react-bootstrap';
  import Specialties from './Specialties.jsx'
 import { SocialIcon } from 'react-social-icons';
-
 /*
 * This is  an react-bootstrap component Design .
 */
-export default class Home extends Component{
-
+export default class Home extends Component{	
 	render(){
 
 		return (
 			<div>
 				<Navbar className='divNav'> 
-
 				<Navbar.Header>
     				<Navbar.Brand >
      					 <a  className='header'href="#home"><strong>Doctory</strong></a>
     				</Navbar.Brand>
-  				</Navbar.Header>
-
-	 				<Nav pullRight className='nav' >
+  				</Navbar.Header>  					
+ 				    <Nav pullRight className='nav' >
 	    				<NavItem className='  nav' eventKey='home' href='#home'>
 	      					<p>Home</p>
 	    				</NavItem>
@@ -38,27 +34,21 @@ export default class Home extends Component{
 					    <img  className="img" alt="900x500" src="../photos/md_experienceddoctors.jpg"/>
 					  </Carousel.Item>
 					  <Carousel.Item className="img">
-					    <img className="img" alt="900x500" src="../photos/dr-toddler-ear-exam-500px.jpg" />
-
+					    <img className="img" alt="900x500" src="../photos/dr-toddler-ear-exam-500px.jpg" />					   
 					  </Carousel.Item>
 					</Carousel>
 				</div>
 					<div>
 				<Specialties/>
 				</div>
-
 				<footer className="navbar-fixed-bottom footer">
 					<div className="container">
 						<div className="row">
-							 <h4> Contact Us :</h4>
-
+							 <h4> Contact Us :</h4>  
                     <SocialIcon url='http://twitter.com'  />
                     <SocialIcon url='http://facebook.com' />
                     <SocialIcon url='http://slack.com'/> 
                     <SocialIcon url='http://github.com'  />
-
-
-
 						</div>
 					</div>
 				</footer>

diff --git a/react-client/src/components/Map.jsx b/react-client/src/components/Map.jsx
@@ -4,7 +4,6 @@ import { InfoWindow, withGoogleMap, withScriptjs, GoogleMap, Marker } from 'reac
 import $ from 'jquery';
 import ReactDOM from 'react-dom'
 import Nearest from './Nearest.jsx'
-
 const Map = compose(
     withStateHandlers(() => ({
         isMarkerShown: false,
@@ -13,63 +12,44 @@ const Map = compose(
         onMapClick: ({ isMarkerShown }) => (e) => ({
             markerPosition: e.latLng,
             isMarkerShown:true,
-
         })
-
       }
       ),
-
-
     withScriptjs,
     withGoogleMap
     )
 (props =>
-  <div >
-
-
+  <div >                
         <GoogleMap
             defaultZoom={8}
             defaultCenter={{ lat: 31.9454, lng: 35.9284 }}
             onClick={props.onMapClick} >
             {props.isMarkerShown && <Marker position={props.markerPosition}/> }
             {props.isMarkerShown && <Nearest specialty={props.specialty}  lat={props.markerPosition.lat()} lng={props.markerPosition.lng()}/>}
          </GoogleMap>
-
          </div>
-
-
     )
 export default class MapContainer extends React.Component {
-
-    constructor(props) {
+      constructor(props) {
         super(props)
   }
-
 /*
 * Ajax request fetch the nearest three Doctors from  the data base  
-*/
-
-
-
-
-    render() {
-        return (
-          <div>
-          <div className="map" >
-
-
-                <Map 
-                    googleMapURL="https://maps.googleapis.com/maps/api/js?key=AIzaSyA_s8BRe0493QchXWEDa_WkF8tzDLLWeLE"
-                    loadingElement={<div style={{ height: `50%` }} />}
-                    containerElement={<div style={{ height: `400px` }} />}
-                    mapElement={<div style={{ height: `50%` }} />}
-                    specialty={this.props.specialty}
-                />
-
-
-             </div>
-             </div>
-        )
-    }
+*/ 
+render() {
+    return (
+      <div>
+      <div className="map" >                      
+          <Map 
+              googleMapURL="https://maps.googleapis.com/maps/api/js?key=AIzaSyA_s8BRe0493QchXWEDa_WkF8tzDLLWeLE"
+              loadingElement={<div style={{ height: `50%` }} />}
+              containerElement={<div style={{ height: `400px` }} />}
+              mapElement={<div style={{ height: `50%` }} />}
+              specialty={this.props.specialty}
+          />        
+         </div>
+         </div>
+          )
+}
 }
 
diff --git a/react-client/src/components/Nearest.jsx b/react-client/src/components/Nearest.jsx
@@ -1,29 +1,21 @@
-  import React from 'react';
-import GoogleMapReact from 'google-map-react';
-import { Marker } from 'react-google-maps';
+import React from 'react';
 import $ from 'jquery';
-
 /*
 * This is  an react component shows the react-google-maps
 */
 const AnyReactComponent = ({ text }) => <div>{text}</div>;
-
 class Map extends React.Component {
   constructor(props){
     super(props)
       this.state={
         specialties:[]
       }
-
     this.showNearest=this.showNearest.bind(this);
   }
-
 /*
 * Ajax request fetch the nearest three Doctors from  the data base  
 */
  showNearest(){
-   console.log(this.props.lat,this.props.lng)
-
       var that=this
       $.ajax({
         url:'/docNearst/'+that.props.specialty,
@@ -44,36 +36,21 @@ class Map extends React.Component {
           }
           arr.sort(function(a, b){return a.des - b.des});
           arr.splice(3,arr.length-1)
-
-
           that.setState({
             specialties:arr
           }) 
         }
       })
-
-  }
-/*
-* function gives the lat and lng when the user click on his location 
-*/
-  onMapClick(e){
-    this.setState({
-      markerPosition: {lat:e.lat,lng:e.lng},
-      isMarkerShown:true
+   }
 
-    })
-  }
   /*
   * rendering the nearest three doctors after determing the user loction 
   */
-  render() {
-
+  render() {  
     return (
       <div>
-
         <button  onClick ={this.showNearest} type="button" className='btn btn-info btn-transparent homebtn'  >Nearest</button>
-          <br/>
-
+          <br/> 
           <br/>
           <br/>
         {this.state.specialties.map(function(spe,index){
@@ -85,7 +62,6 @@ class Map extends React.Component {
                     <h2 className="DocName">Dr.{spe.name}</h2>
                     <h3 className="cardText ">distance: {spe.des} km</h3>
                     <h3 className="cardText">Tel: {spe.tel}</h3>
-
                   </div>
                 </div>
             </div>
@@ -95,5 +71,4 @@ class Map extends React.Component {
     );
   }
 }
-
 export default Map
diff --git a/react-client/src/components/Rate.jsx b/react-client/src/components/Rate.jsx
@@ -7,19 +7,11 @@ import Map from './Map.jsx'
 class Rate extends React.Component{
 	constructor(props){
 		super(props)
-
-		this.state={
-			specialties:[]
-
+			this.state={
+			specialties:[]      
         }
-
-		this.showRate = this.showRate.bind(this);
-
+		this.showRate = this.showRate.bind(this);		
 	}
-
-
-
-
 /*
 * Ajax request fetch  the highet rate for  Doctors from  the data base  
 */		
@@ -37,19 +29,15 @@ class Rate extends React.Component{
 				},
 			error:function(err){
 				console.log(err)
-
 				}
 			})
 	    }
-	}
-
-
+	}				 
 /*
 * Render the highest Doctor rate and call Map file
 */	
 	render(){
 		return(
-
 		<div>
 			<div className="row">
 				<div className="col-sm-6">
@@ -72,9 +60,7 @@ class Rate extends React.Component{
 				    })}
 		        </div>
 				<div className="col-sm-6">
-
-				    <Map specialty={this.props.specialty}/> 
-
+				    <Map specialty={this.props.specialty}/> 				 
 				</div>
 			</div>
  		</div>

diff --git a/react-client/src/components/Specialties.jsx b/react-client/src/components/Specialties.jsx
@@ -1,9 +1,6 @@
 import React,{Component} from 'react';
 import {MenuItem,ButtonToolbar,DropdownButton} from 'react-bootstrap';
 import Rate from './Rate.jsx'
-
-
-
 /*
 * This is  an react component renders  the specialies using the DropdownButton and onSelect
 */
@@ -15,53 +12,41 @@ export default class Specialties extends Component{
 		}
 		this.onSelect=this.onSelect.bind(this)
 	}
-
 	onSelect(e){
 		this.setState({
 			specialty:e
 		})
 	}
-
 	render(){
-
 		return (
-			<div>
-
-
-				<div id="home" className=" container spbutton">
-					<div className='row'>
-						<div className='col-sm-4'>
-							<ButtonToolbar >
-
-								<DropdownButton className="btn btn-info  homebtn"  onSelect={this.onSelect} title ='choose specialty'
-									noCaret
-									id='dropdown-no-caret'>
-										<MenuItem eventKey='otolaryngologists(ear,nose,throat)'>otolaryngologists(ear,nose,throat)</MenuItem>
-										<MenuItem eventKey='cardiology(heart)'>cardiology(heart)</MenuItem>
-										<MenuItem eventKey='neurologists(brain and nervus system)'>neurologists(brain and nervus system)</MenuItem>
-										<MenuItem eventKey='opthalmologist(eye)'>opthalmologist(eye)</MenuItem>
-										<MenuItem eventKey='Pulmonolgy (respiratory)'>Pulmonolgy (respiratory)</MenuItem>
-										<MenuItem eventKey='general'>general </MenuItem>
-										<MenuItem eventKey='dermatology(skin)'>dermatology(skin) </MenuItem>
-										<MenuItem eventKey='Pediatric(children)'>Pediatric(children) </MenuItem>
-										<MenuItem eventKey='allergologist'>allergologist </MenuItem>
-
-								</DropdownButton>
-							</ButtonToolbar>
-							<br/> <br/>
-
-							<div style={{fontSize:16}} > {this.state.specialty}</div>
-
-						</div>
-
-					<div className='col-sm-8'>
-						<Rate specialty={this.state.specialty}/>
-					</div>
-
-					</div>
-				</div>
-
-			</div>
+<div>
+<div id="home" className=" container spbutton">
+<div className='row'>
+   <div className='col-sm-4'>
+	<ButtonToolbar >
+		<DropdownButton className="btn btn-info  homebtn"  onSelect={this.onSelect} title ='choose specialty'
+			noCaret
+			id='dropdown-no-caret'>
+				<MenuItem eventKey='otolaryngologists(ear,nose,throat)'>otolaryngologists(ear,nose,throat)</MenuItem>
+				<MenuItem eventKey='cardiology(heart)'>cardiology(heart)</MenuItem>
+				<MenuItem eventKey='neurologists(brain and nervus system)'>neurologists(brain and nervus system)</MenuItem>
+				<MenuItem eventKey='opthalmologist(eye)'>opthalmologist(eye)</MenuItem>
+				<MenuItem eventKey='Pulmonolgy (respiratory)'>Pulmonolgy (respiratory)</MenuItem>
+				<MenuItem eventKey='general'>general </MenuItem>
+				<MenuItem eventKey='dermatology(skin)'>dermatology(skin) </MenuItem>
+				<MenuItem eventKey='Pediatric(children)'>Pediatric(children) </MenuItem>
+				<MenuItem eventKey='allergologist'>allergologist </MenuItem>									
+		</DropdownButton>
+	</ButtonToolbar>
+		<br/> <br/>
+		<div style={{fontSize:16}} > {this.state.specialty}</div>
+   </div>
+<div className='col-sm-8'>
+	<Rate specialty={this.state.specialty}/>
+</div>
+</div>
+</div>		
+</div>
 		)
 	}
 }