Skip to content

Master #2

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.

Sign up for GitHub

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

Open
leejan16 wants to merge 6 commits into
base: master
Choose a base branch
from
Open

Master #2

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
b18ecb2
Started the Assignment - Small changes
Nov 1, 2016
8870727
Test 1
Nov 1, 2016
526cca9
Revert "Test 1"
Nov 1, 2016
080bf75
Progress
Nov 1, 2016
f371c9e
Almost there...
Nov 6, 2016
602e668
Think I'm Done...
Nov 7, 2016
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
Empty file modified README.md
100644 → 100755
View file
Open in desktop
Empty file.
27 changes: 11 additions & 16 deletions index.html
100644 → 100755
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
<html>

<head>
<title>Brief Toronto Tour</title>
<title>Assignment Three: HIS495Y</title>
<meta name="description" content="a strapdown-based mapping exercise." />
<!-- these script tags load important javascript "libraries"
that our own little scripts depend on. These are complex
Expand All @@ -25,16 +25,18 @@
<body onload="initialize();">
<textarea theme="united" style="display:none;">

# This Map will eventually Become some kind of tour of Toronto.
### Strategic Commerce, Diplomacy, and Warfare in the Lake Ontario Region

Your first task will be to locate some real places. You can get the precise locations at various services, e.g [latlong.net](http://www.latlong.net/].
The Great Lakes region has always been a contested territory, control over which meant access to transportation, sustenance, and trade. Before the arrival of the French, British, and eventually, the Americans, the Iroquois, Huron, and Algonquin tribes competed for the rich resources which the Lake and its surrounding regions offered. Once the Europeans arrived it became evident that mutual accommodation over the Great Lakes became necessary, as the space became what Richard White calls the “Middle Ground” for both formal and informal interactions between the Native Americans and the settlers [(Beatty-Medina and Rinehart, 2012: xiv)]( https://www.amazon.ca/Contested-Territories-Americans-Non-Natives-1700-1850/dp/1611860458). The opinion of “to whom” the Lakes belonged seemed to irrevocably diverge between the two groups. Despite their differences, the agreed mutual use of the regions of Lake Ontario demonstrated, as trader and interpreter John Long wrote, the “necessity, of a strict alliance with them [Native Americans]”, for as long as the British were to, “retain any possessions in Canada" [(Long,1791:Preface)](https://archive.org/details/voyagestravelsof00long).

Then add those places to the marker array in [script.js](./script.js) (see instructions there).
Several key forts in the Lake Ontario region played to the strategical advantage of different actors. It is crucial to recognize that throughout the 18th century, negotiations with Native American groups was key for any consolidated settlements. For example, the British Fort Niagara, which acted as a gateway for supplies going to all western posts was in part possible due to the 1763-1764 peace conference wherein the Senecas, who controlled the Niagara corridor at the time, ceded it to the British. Acknowledging the fact that the British could neither be defeated or driven away, the Senecas, like most other indigenous groups, agreed to mutually beneficial conditions through which the control over the Lake and its waterways could be shared.

replace this text and the text with your essay. But be sure not to eliminate the html elements that
are contained inside this textarea, or your map won't work at all!
In another incident, pitting the Iroquois against the French, the British would frequently warn that the construction of Fort Detroit (and previously Fort Frontenac) would lead to the annihilation of the Iroquois hunting grounds and even the eventual enslavement of the Iroquois people. Iroquois met with their rivals during 1700 and 1701 in order to discuss a settlement of peace. It was here that the Iroquois expressed their cultural and historical affinity to the northern part of the Great Lakes, and especially the hunting grounds surrounding Fort Frontenac which they claimed to have hunted and fished freely, “since the beginning of the world"[(Brandao and Starna, 1996:212)]( http://www.jstor.org.myaccess.library.utoronto.ca/stable/483396).

It makes sense to put an introductory paragraph here, above the map and buttons. To change the bootswatch thenme, change "united" to one of the other theme names listed at [strapdownjs.com](http://strapdownjs.com/).
In this turn-of-the-century agreement, after decades of bloodshed which led to the annihilation of 50% of the Iroquois warrior population, the French assured the Iroquois that Fort Detroit would serve as a deterrent for future hunting conflicts north of Lake Ontario and Erie [(Brandao and Starna, 1996:231)](http://www.jstor.org.myaccess.library.utoronto.ca/stable/483396). Such a peace would be beneficial for French trade and for the Native Americans it would allow fur trade with Albany, a major trading post east of the Great Lakes. The forts demonstrated the importance of appeasement, acquiescence, and collaboration in creating conditions for the peaceful sharing of the lake.

<h4> Note: </h4> <li>Blue Markers: Forts</li>
<li>Red Markers: Towns, Territories, Others</li>

<div class="">
<!-- these buttons hide/show all the markers -->
Expand All @@ -46,17 +48,10 @@
<div id="mapcontainer">
<div id="map_canvas"></div>
</div>
<div id="map_legend"></div>
<div id="map_legend" ></div>
</div>

# Next Section

The rest of your essay should go under the map, probably.

## in sections like this
also _italics_ and __bold__ which can also be written *like this* or **like this**
etc. Be sure to [make use of links](http://digital.hackinghistory.ca) -- that's one of the reasons we write on the Web, and I've asked you to use links for all yor footnotes/references as well.
</textarea>
</textarea>



Expand Down
55 changes: 37 additions & 18 deletions script.js
100644 → 100755
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
// whenever we need to -- they have 'global scope'
var my_map; // this will hold the map
var my_map_options; // this will hold the options we'll use to create the map
var my_center = new google.maps.LatLng(41.9000,12.5000); // center of map
var my_center = new google.maps.LatLng(43.349243, -78.365479); // center of map
var my_markers = []; // we use this in the main loop below to hold the markers
// this one is strange. In google maps, there is usually only one
// infowindow -- its content and position change when you click on a
Expand All @@ -24,7 +24,7 @@ var blue_markers = [];
function initialize() {
my_map_options = {
center: my_center, // to change this value, change my_center above
zoom: 13, // higher is closer-up
zoom: 7, // higher is closer-up
mapTypeId: google.maps.MapTypeId.HYBRID // you can also use TERRAIN, STREETMAP, SATELLITE
};

Expand All @@ -33,25 +33,44 @@ function initialize() {
my_map_options);
// this is an *array* that holds all the marker info
var all_my_markers =
[{position: new google.maps.LatLng(41.9000,12.5000),
[{position: new google.maps.LatLng(44.232701, -76.478391),
map: my_map,
icon: blueURL, // this sets the image that represents the marker in the map to the one
// located at the URL which is given by the variable blueURL, see above
title: "first Marker",
window_content: "<h1>Marker1</h1><p> and this would be the extended description</p>"
title: " FortFrontenac",
window_content: "<h3>Fort Frontenac</h3><p> Also called Fort Oswego by 18th century trader John Long- he describes this fort as being the key to the United States as it facilitated passageway to the North and to the Hudson River.</p>"
},
{position: new google.maps.LatLng(41.8902,12.4923),
{position: new google.maps.LatLng(42.299369, -83.096096),
map: my_map,
icon: blueURL, // this sets the image that represents the marker in the map
title: "second Marker",
window_content: "<h1>Marker2</h1><p> and this would be the extended description</p>"
title: " FortDetroit",
window_content: "<h3> Fort Detroit</h3><p> An initially highly contentious fort, through agreements between the French and the Iroquois the fort was finally built. The French claimed that the fort would act as a place of arbitration for the hunting grounds surrounding it as well as provide the Iroquois with arms and provisions.</p>"
},
{position: new google.maps.LatLng(41.8986,12.4768),
{position: new google.maps.LatLng(43.262389, -79.063116),
map: my_map,
icon: redURL, // this sets the image that represents the marker in the map
title: "third Marker",
window_content: "<h1>Marker3</h1><p> and this would be the extended description</p>"
}
icon: blueURL, // this sets the image that represents the marker in the map
title: " FortNiagara",
window_content: "<h3> Fort Niagara</h3><p> An important fort which would later come into British posession thanks to negotiations with the Seneca Native Indians. This fort was also the strategical supply point for the British and key for being able to quickly transport troops west in case of rebellion or war.</p>"

},
{position: new google.maps.LatLng(42.652579, -73.756232),
map: my_map,
icon: redURL, // this sets the image that represents the marker in the map
title: " Albany",
window_content: "<h3> Albany</h3><p>Albany was a major trade hub where many Native groups such as the Iroquois and the western tribes often sold their pelts. The merchants at this post would often send agents to other forts such as Fort Frontenac in order to procure goods. </p>"
},
{position: new google.maps.LatLng(41.866748, -77.838135),
map: my_map,
icon: redURL, // this sets the image that represents the marker in the map
title: "NativeTerritory",
window_content: "<h3> Native Territories</h3><p>According to 18th century trader John Long, all land beneath Lake Ontario, Lake Erie, and the St. Lawrence River was claimed by the Five Nations Natives.</p>"
},
{position: new google.maps.LatLng(43.654460, -77.893066),
map: my_map,
icon: redURL, // this sets the image that represents the marker in the map
title: "War on the Lake",
window_content: "<h3>War on the Lake</h3><p>In one of his accounts John Long writes that women and children sometimes sang war songs while rowing their canoes across Lake Ontario. </p>"
}
];

for (j = 0; j < all_my_markers.length; j++) {
Expand All @@ -63,8 +82,8 @@ function initialize() {
window_content: all_my_markers[j].window_content});

// this next line is ugly, and you should change it to be prettier.
// be careful not to introduce syntax errors though.
legendHTML += "<div class=\"pointer\" onclick=\"locateMarker(my_markers[" + j + "])\"> <h3>" + marker.title + "</h3><div>" + marker.window_content + "</div></div>";
// be careful not to introduce syntax errors though.
legendHTML += "<div class=\"pointer\" onclick=\"locateMarker(my_markers[" + j + "])\"> <div>" + marker.window_content + "</div></div>";
marker.info = new google.maps.InfoWindow({content: marker.window_content});
var listener = google.maps.event.addListener(marker, 'click', function() {
// if you want to allow multiple info windows, uncomment the next line
Expand All @@ -79,10 +98,10 @@ function initialize() {
} else if (all_my_markers[j].icon == redURL ) {
red_markers.push({marker:marker, listener:listener});
}

}
document.getElementById("map_legend").innerHTML = legendHTML;

}

// this hides all markers in the array
Expand All @@ -102,7 +121,7 @@ function showMarkers (marker_array, map) {
}

// I added this for fun. It allows you to trigger the infowindow
// form outside the map.
// form outside the map.
function locateMarker (marker) {
console.log(marker);
my_map.panTo(marker.marker.position);
Expand Down
19 changes: 12 additions & 7 deletions style.css
100644 → 100755
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,9 @@
/* This is a very simple CSS setup that shows the size of the relevant divs and -- important! -- sets the size of the map container */

/* add any styling for the central column here */
p {
text-indent: 50px !important;
}
div.container {
}

Expand All @@ -22,13 +25,13 @@ div#map_canvas {
/* this is the legend div. Can you make it into a right sidebar? you may
have to add some extra css to the mapcontainer div */
div#map_legend {

border:10px
}

/* if you want, you can make the text in the legend less ugly by adding
extra css classes */
div#map_legend h1, div#map_legend h3 {

div#map_legend h3, div#map_legend h4 {
background-color:E3E3E3 !important;
}

// make it obvious that the legend text is clickable
Expand All @@ -48,10 +51,10 @@ button.rounded {
border: 1px black solid;
}
button#hide {
background:orange;
background:red;
}
button#show {
background:green;
background:orange;
}

/* use these last three to style the text inside the
Expand All @@ -60,15 +63,17 @@ button#show {

*/

div#map_canvas h1 {
div#map_canvas h1 {font-size:14;

}

#map_legend h2 {
font-size: 12px;
}
div.address {

}

div.description {

}