Skip to content

Attempt 3 #5

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
KevinhqNguyen wants to merge 4 commits into
base: master
Choose a base branch
from
Open

Attempt 3 #5

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
d0ac16d
Title Change
KevinhqNguyen Nov 1, 2016
4750e97
Revert "Title Change"
KevinhqNguyen Nov 1, 2016
e317a7a
Revert "Revert "Title Change""
KevinhqNguyen Nov 1, 2016
a7dcb90
Changes
KevinhqNguyen Nov 14, 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
31 changes: 15 additions & 16 deletions index.html
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>Space and Place: Toronto War Memorials</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,8 @@
<body onload="initialize();">
<textarea theme="united" style="display:none;">

# This Map will eventually Become some kind of tour of Toronto.

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/].

Then add those places to the marker array in [script.js](./script.js) (see instructions there).

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!

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/).
# Space and Place: Toronto War Monuments
The war memorials found across Toronto represent a union of “time” and “space.” Memorials are the physical structures that “house memories in a durable fashion, anchoring the transient variable of memory itself.” (Szpunar 3) In being vessels for memory, memorials shape the spaces in which they inhabit. In Yi-Fu Tuan’s argument of “place” and “space,” he argues that “place” is created through the tapering of “space.”(Szpunar 4) That space only becomes a place when we culturally define it. Memorials act as a cultural definer of space. Infusing space it inhabits with a singular sense of culture and history. The memorials found across Toronto represent this formation of place out of the urban space of Toronto.

<div class="">
<!-- these buttons hide/show all the markers -->
Expand All @@ -48,14 +40,21 @@
</div>
<div id="map_legend"></div>
</div>
Some of the memorials found throughout the city of Toronto are the Soldier’s Tower, 48th Highland Memorial, The Old City Hall Cenotaph, Ontario War Veterans Memorial, and Per Ardua Ad Astra. These memorials are physical land markers in the spaces in which they inhabit. They enforce the Canadian collective memory of the World Wars. The memorials emphasise both the victories and the sacrifices of the Canadian soldiers.

Memorials act as heritage markers, symbols of a shared past and history. The memorials found in Toronto are dedicated to the sacrifices made by the Canadian soldiers overseas. The Soldier’s Tower commemorates the sacrifices of University of Toronto students; the 48th Highland Memorial highlights the sacrifices of the 48th Highland regiment. The memorials found throughout Toronto all find a theme in sacrifice. Many historians such as Marvin and Ingle argue that the birth of Canada as a nation came through a “blood sacrifice” during the World Wars. (Szpunar 5) The memorials throughout Toronto highlight the theme of sacrifice, some memorials highlight the sacrifice of a specific group either University of Toronto students or a specific military group such as the air force. The memorials selectively remind the viewers of the sacrifices made and unite them in empathy for those lost.

The memorials found in Toronto physically mark up the land with historical and cultural meaning. Memorials manipulate space in both their cultural and physical context. As Yi-Fu Tuan argues space is this abstract freedom, free from any specific connotation or meaning. Place is the construction of meaning within space.(Szpunar 3) In viewing the satellite map, the cultural impact of memorials are not inherently seen, but it is the memorials that ultimately give meaning and cultural definition to space. Memorials by their very definition are the symbolic structures representative of memory. The memorials found in Toronto, therefore, are creating a cultural and historic narrative that, through the theme of sacrifice, work to build a collective memory of past events in Canada. The memorials found in Toronto work to create a sense of sameness through a shared history of events. The Great Wars are seen as the stepping stones to nationhood in Canada insomuch as the memorials represent sacrifices they also act as a symbol of Canadian nationalism. The memorials found in Toronto, and all across Canada work to instill Canadian culture in the space it manipulates using the theme of sacrifice to unite Canadians past and present, across space and time.


# Work Cited

[Monuments, Mundanity and Memory: Altering 'Place' and 'Space' at the National War Memorial](http://journals1.scholarsportal.info.myaccess.library.utoronto.ca/pdf/17506980/v03i0004/379_mmamaaatnwm.xml)

# Next Section
[Canadian War Memorials](https://en.wikipedia.org/wiki/Canadian_war_memorials)

The rest of your essay should go under the map, probably.
[Space and Place](http://apcg.uoregon.edu/amarcus/geog620/Readings/Tuan_1979_space-place.pdf)

## 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>


Expand Down
48 changes: 30 additions & 18 deletions script.js
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.659598,-79.394792); // 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 @@ -25,33 +25,45 @@ function initialize() {
my_map_options = {
center: my_center, // to change this value, change my_center above
zoom: 13, // higher is closer-up
mapTypeId: google.maps.MapTypeId.HYBRID // you can also use TERRAIN, STREETMAP, SATELLITE
mapTypeId: google.maps.MapTypeId.SATELLITE // you can also use TERRAIN, STREETMAP, SATELLITE
};

// this one line creates the actual map
my_map = new google.maps.Map(document.getElementById("map_canvas"),
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(43.66355,-79.395144),
map: my_map,
icon: blueURL, // this sets the image that represents the marker in the map to the one
icon: redURL, // 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: "Soldiers' Tower",
window_content: "<h1>Soldiers' Tower</h1><p> Commemorates members of the University of Toronto who served in the World Wars.</p>"
},
{position: new google.maps.LatLng(41.8902,12.4923),
{position: new google.maps.LatLng(43.665833,-79.392989),
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>"
icon: redURL, // this sets the image that represents the marker in the map
title: "48th Highlander Memorial",
window_content: "<h1>48th Highlander Memorial</h1><p>Dedicated to those who served with the Canadian forces, erected by the 48th Highlanders of Canada.</p>"
},
{position: new google.maps.LatLng(41.8986,12.4768),
{position: new google.maps.LatLng(43.652139,-79.381725),
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>"
}
title: "Old City Hall Cinetaph",
window_content: "<h1>Old City Hall Cinetaph</h1><p>Dedicated to Torontonians who lost their lives during the First World War, Second World War and the Korean War.</p>"
},
{position: new google.maps.LatLng(43.661286,-79.391122),
map: my_map,
icon: redURL, // this sets the image that represents the marker in the map
title: "Ontario Veterans Memorial",
window_content: "<h1>Ontario Veterans Memorial</h1><p>Dedicated to the Canadian military who served from the Fenian raids to the Campaign Against Terror.</p>"
},
{position: new google.maps.LatLng(43.6546,-79.388222),
map: my_map,
icon: redURL, // this sets the image that represents the marker in the map
title: "Per Ardua ad Astra",
window_content: "<h1>Per Ardua ad Astra</h1><p>Dedicated to Canadian airmen who fought.</p>"
},
];

for (j = 0; j < all_my_markers.length; j++) {
Expand All @@ -63,7 +75,7 @@ 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.
// 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>";
marker.info = new google.maps.InfoWindow({content: marker.window_content});
var listener = google.maps.event.addListener(marker, 'click', function() {
Expand All @@ -79,10 +91,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 +114,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
21 changes: 15 additions & 6 deletions style.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,8 @@ div.container {
div#mapcontainer {
font-family:Arial, sans-serif;
font-size:11px;
border:6px double #5E5C63;
border:4px solid black;
padding: 2em;
}

/* you can change the size of the map here if you want
Expand All @@ -22,13 +23,18 @@ 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 {

float: right;
width: 30%;
padding-bottom: 10px;
border:2px dotted black;
}

/* 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 {

font-family:Arial, sans-serif;
font-size: 14px;
line-height: 40%
}

// make it obvious that the legend text is clickable
Expand Down Expand Up @@ -60,15 +66,18 @@ button#show {

*/

div#map_canvas h1 {
div#map_canvas h1 { font-family:Arial, sans-serif;
font-size:14x;
border:6px;
padding: 1m;

}

div.address {

}

div.description {
div.description { font-family:Arial, sans-serif;
font-size:11px;

}