Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

update dinner.js and css #21

Merged
merged 1 commit into from
Mar 25, 2017
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 0 additions & 1 deletion _config.yml

This file was deleted.

34 changes: 34 additions & 0 deletions assets/css/style.css
Original file line number Diff line number Diff line change
Expand Up @@ -8,4 +8,38 @@ body {
}
.secondaryColor{
color: #FF0000;
}

.movie {
background-color: skyblue;
text-align: center;
font-family: Bangers;
padding: 20px;
font-size: 20px;
border-radius: 12px;
}

.movieButton {
background-color: skyblue;
border-radius: 25px;
border-color: #f00000;
border-width: 5px;
color: #f00000;
}

.titleButton {
background-color: #f0f0f0;
border-radius: 25px;
border-color: goldenrod;
font-family: Aldrich;
font-weight: 800;
border-width: 5px;
color: #f00000;
font-size: 20px;
padding: 20px;
margin: 20px;
}

#map {
height: 100%;
}
41 changes: 0 additions & 41 deletions assets/js/dessert.js

This file was deleted.

119 changes: 50 additions & 69 deletions assets/js/dinner.js
Original file line number Diff line number Diff line change
@@ -1,72 +1,53 @@
<!DOCTYPE html>
<html>
<head>
<title>Dinner Search</title>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">
<style>
/* Always set the map height explicitly to define the size of the div
* element that contains the map. */
#map {
height: 100%;
}
/* Optional: Makes the sample page fill the window. */
html, body {
height: 100%;
margin: 0;
padding: 0;
}
#floating-panel {
position: absolute;
top: 10px;
left: 25%;
z-index: 5;
background-color: #fff;
padding: 5px;
border: 1px solid #999;
text-align: center;
font-family: 'Roboto','sans-serif';
line-height: 30px;
padding-left: 10px;
}
</style>
</head>
<body>
<div id="floating-panel">
<input id="address" type="textbox" value="Zipcode">
<input id="submit" type="button" value="Submit">
</div>
<div id="map"></div>
<script>
function initMap() {
var map = new google.maps.Map(document.getElementById('map'), {
center: {lat: 34.0620, lng: -118.4455},
zoom: 18
});
var geocoder = new google.maps.Geocoder();
var lat = '';
var lng = '';
var address = {zipcode};
geocoder.geocode( { 'address': address}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
lat = results[0].geometry.location.lat();
lng = results[0].geometry.location.lng();
};
} else {
alert("Geocode was not successful for the following reason: " + status);
}
});

document.getElementById('submit').addEventListener('click', function() {
geocodeAddress(geocoder, map);
});
}
var map;
var infoWindow;

function geocodeAddress(geocoder, resultsMap) {
var address = document.getElementById('address').value;
geocoder.geocode({'address': address}, function(results, status) {
if (status === 'OK') {
resultsMap.setCenter(results[0].geometry.location);
var marker = new google.maps.Marker({
map: resultsMap,
position: results[0].geometry.location
});
} else {
alert('Geocode was not successful for the following reason: ' + status);
function initMap() {
var mapLocation = {lat: 34.0635, lng: -118.4453};

map = new google.maps.Map(document.getElementById('map'), {
center: mapLocation,
zoom: 17
});

infoWindow = new google.maps.infoWindow();
var service = new google.maps.places.PlacesService(map);
service.nearbySearch({
location: mapLocation,
radius: 500,
type: ['restaurant']
}, callback);
}

function callback(results, status) {
if (status === google.maps.places.PlacesServiceStatus.OK) {
for (var i = 0; i < results.length; i++) {
createMarker(results[i]);
}
}
});
}
</script>
<script async defer
src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBOvLvUWU-_rQ1MpLYVQCcZ1byL-Prp1po&callback=initMap">
</script>
</body>
</html>
}

function createMarker(place) {
var placeLoc = place.geometry.location;
var marker = new google.maps.Marker({
map: map,
position: place.geometry.location,
});

google.maps.event.addListener(marker, 'click', function() {
infoWindow.setContent(place.name);
infoWindow.open(map, this);
});

11 changes: 8 additions & 3 deletions assets/js/dmd.js
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@

$("#userName");
$("#zipCode");
// Store input in Firebase
// $("#userName");
// $("#zipCode");

// Initialize Firebase
var config = {
Expand All @@ -11,3 +11,8 @@ $("#zipCode");
messagingSenderId: "303213824340"
};
firebase.initializeApp(config);

$("#submitModal").on("click", function() {
$("#movieGen").html("<center><button>Click this to spin</button></center>");
initMap();
})
38 changes: 2 additions & 36 deletions assets/js/movie.js
Original file line number Diff line number Diff line change
@@ -1,35 +1,9 @@
<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="utf-8">
<title>Favorite Movies</title>
<style type="text/css">
button,
div,
form,
input {
margin: 10px;
}
</style>
</head>

<body>

<div class="container">
<h1>Movie Search</h1>

<button id="movieGen">Click this to spin</button>

<div id="movies-view"></div>

<script src="http://code.jquery.com/jquery-2.1.3.min.js"></script>
<script type="text/javascript">

var count = 0;
// array of movies
var movies = ["Moonlight", "La La Land", "Arrival", "Fences", "Hacksaw Ridge", "Hell or High Water", "Hidden Figures", "Lion", "Manchester by the Sea", "Logan", "Kong Skull Island", "John Wick Chapter 2", "xXx Return of Xander Cage", "A Dog’s Purpose", "T2 Trainspotting", " The Lego Batman Movie", "Rings", "Fifty Shades Darker", "Bitter Harvest", "In Dubious Battle"];


$("#movieGen").on("click", function() {

if(count === movies.length - 1) {
Expand Down Expand Up @@ -92,12 +66,4 @@
});

});
// if count === movies.lenth {
// count = 0;
// };

</script>
</div>
</body>

</html>

92 changes: 92 additions & 0 deletions googleMapResturant.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,92 @@
<html>

<head>
<title>Geocoding service</title>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">
<style>
/* Always set the map height explicitly to define the size of the div
* element that contains the map. */

#map {
height: 100%;
}
/* Optional: Makes the sample page fill the window. */

html,
body {
height: 100%;
margin: 0;
padding: 0;
}

#floating-panel {
position: absolute;
top: 10px;
left: 25%;
z-index: 5;
background-color: #fff;
padding: 5px;
border: 1px solid #999;
text-align: center;
font-family: 'Roboto', 'sans-serif';
line-height: 30px;
padding-left: 10px;
}
</style>
</head>

<body>
<div id="floating-panel">
<input id="address" type="textbox" placeholder="Input Location Here">
<input id="submit" type="button" value="Geocode">
</div>
<div id="map"></div>
<script>
function initMap() {
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 17,
center: {
lat: 10,
lng: 10
}
});
var geocoder = new google.maps.Geocoder();

document.getElementById('submit').addEventListener('click', function() {
geocodeAddress(geocoder, map);
});
}

function geocodeAddress(geocoder, resultsLocation) {
var address = document.getElementById('address').value;
geocoder.geocode({
'address': address
}, function(results, status) {
if (status === 'OK') {
resultsLocation.setCenter(results[0].geometry.location);
console.log(results[0].geometry.location.lat());
var locationObj = {
lat: locService.lat(),
lng: locService.lng()
};
if (status == google.maps.GeocoderStatus.OK) {
map.setCenter(results[0].geometry.location);
// search within radius of zip and return to map
var request = {
location: locationObj,
radius: 500,
query: "restaurant"
};
} else {
alert('Geocode was not successful for the following reason: ' + status);
}
};
}
}
</script>
<script async defer src="https://maps.googleapis.com/maps/api/js?key=AIzaSyA0WfD7ctP__ppnoohyb9ITJUL2-4KIyik&libraries=places&callback=initMap">
</script>
</body>

</html>
Loading