1 2 3 4 5 6 7 8 9<!DOCTYPE html> 10<html xmlns="http://www.w3.org/1999/xhtml" lang="en"> 11 <head> 12 <title>Tenatch Co-Retailing</title> 13 <meta http-equiv="content-type" content="application/xhtml+xml; charset=UTF-8" /> 14 <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" /> 15 <meta property="og:type" content="website" /> 16 <meta property="og:url" content="https://www.tenatch.com"/> 17 <meta property="og:title" content="Merry Christmas!!🎄🎅🦌"/> 18 <meta property="og:description" content="Tenatch wishes you a Merry Christmas!!!"/> 19 <meta property="og:site_name" content="Tenatch"/> 20 <meta property="og:image" content="http://www.tenatch.com/kiwicat/images/tenatchmas.png"> 21 <meta property="og:image:secure_url" content="https://www.tenatch.com/kiwicat/images/tenatchmas.png"> 22 23 <meta name="twitter:image" content="https://www.tenatch.com/kiwicat/images/tenatchmas.png"> 24 <link rel="icon" href="favicon_christmas.ico" type="image/x-icon"> 25 <link rel="shortcut icon" href="favicon_christmas.ico" type="image/x-icon"> 26 27<!--link rel="stylesheet" href="https://jhammann.github.io/sakura/dist/sakura.min.css"--> 28<link rel="stylesheet" href="js/jquery-sakura.min.css"> 29 30 31 32<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/leaflet.css" />
33<script src="https://unpkg.com/[email protected]/dist/leaflet.js"></script>
33 34 35
35<script src="https://unpkg.com/[email protected]/leaflet.responsive.popup.js"></script>
35 36<link rel="stylesheet" href="https://unpkg.com/[email protected]/leaflet.responsive.popup.css" /> 37 38 <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/leaflet-easybutton@2/src/easy-button.css"> 39
39<script src="https://cdn.jsdelivr.net/npm/leaflet-easybutton@2/src/easy-button.js"></script>
39 40 41<link href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/themes/ui-darkness/jquery-ui.css" rel="stylesheet">
42<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
vendor: 1 bytes, line 42
42
43<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js"></script>
43 44
45<script src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/3/autoresize.jquery.js"></script>
45 46 47<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet"> 48 49 50 51<link rel="stylesheet" href="https://noerw.github.io/leaflet-sidebar-v2/css/leaflet-sidebar.css" />
52<script src="https://noerw.github.io/leaflet-sidebar-v2/js/leaflet-sidebar.js"></script>
52 53
54<script src="https://ewoken.github.io/Leaflet.MovingMarker/MovingMarker.js"></script>
54 55<link rel="stylesheet" href="https://www.zimmi.cz/Leaflet-Coordinates-Control/Control.Coordinates.css" />
56<script src="https://www.zimmi.cz/Leaflet-Coordinates-Control/Control.Coordinates.js"></script>
56 57 58 <style> 59 60#loader { 61 62 63 //-webkit-animation: spin 2s linear infinite; 64 //animation: spin 2s linear infinite; 65} 66 67#loader_logo { 68 position: absolute; 69 left: 44%; 70 //width: 20% 71 margin: -75px 0 0 -75px; 72 z-index: 1000; 73 //-webkit-animation: spin 2s linear infinite; 74 //animation: spin 2s linear infinite; 75} 76 77#loader_spinner { 78 position: absolute; 79 left: 50%; 80 top: 50%; 81 z-index: 1; 82 width: 150px; 83 height: 150px; 84 margin: -75px 0 0 -75px; 85 border: 16px solid #f3f3f3; 86 border-radius: 50%; 87 border-top: 16px solid #3498db; 88 width: 120px; 89 height: 120px; 90 -webkit-animation: spin 2s linear infinite; 91 animation: spin 2s linear infinite; 92} 93 94@-webkit-keyframes spin { 95 0% { -webkit-transform: rotate(0deg); } 96 100% { -webkit-transform: rotate(360deg); } 97} 98 99@keyframes spin { 100 0% { transform: rotate(0deg); } 101 100% { transform: rotate(360deg); } 102} 103 104/* Add animation to "page content" */ 105.animate-bottom { 106 position: relative; 107 -webkit-animation-name: animatebottom; 108 -webkit-animation-duration: 1s; 109 animation-name: animatebottom; 110 animation-duration: 1s 111} 112 113@-webkit-keyframes animatebottom { 114 from { bottom:-100px; opacity:0 } 115 to { bottom:0px; opacity:1 } 116} 117 118@keyframes animatebottom { 119 from{ bottom:-100px; opacity:0 } 120 to{ bottom:0; opacity:1 } 121} 122 123 124 125body { 126 padding: 0; 127 margin: 0; 128} 129html, body, #mapid { 130 height: 100%; 131 width: 100vw; 132} 133.legend { 134 line-height: 18px; 135 color: #555; 136 background: #fff; 137 border: 1px solid #666; 138} 139.legend i { 140 width: 18px; 141 height: 18px; 142 float: left; 143 margin-right: 8px; 144 opacity: 0.7; 145} 146 147.ui-dialog { z-index: 1000 !important ;} 148.view_hidden { display: none; } 149#myTextarea, #event_url, #myImg { width: 100%; } 150 151.expose { 152 position:relative; 153} 154 155#overlay { 156 background:rgba(0,0,0,0.3); 157 display:none; 158 width:100%; height:100%; 159 position:absolute; top:0; left:0; z-index:998; 160} 161 162.vmiddle { 163 display: table-cell; 164 vertical-align: middle; 165 height: 32px; 166 line-height: 32px; 167 border: 2px dashed #f69c55; 168} 169 170.no_undeline { 171 text-decoration: none 172} 173 174.sns_img { 175 width: 384px; 176 height: auto; 177} 178 179.icon_box { 180 border: 0.01em solid; 181} 182 183.bg_white { 184 background: #fff; 185} 186 187.skeleton-sheet { 188 width: 36px; /* Icon width */ 189 height: 48px; /* Icon height */ 190 display: inline-block; /* Display icon as inline block */ 191 background-position: 0 0px; /* Icon background position in sprite */ 192 -webkit-transform: scaleX(-1); 193 transform: scaleX(-1); 194} 195 196.skeleton-sprite { 197 background: url("images/skeleton-36x48.png") no-repeat; 198 width: 36px; /* Icon width */ 199 height: 48px; /* Icon height */ 200 display: inline-block; /* Display icon as inline block */ 201 background-position: 0 0px; /* Icon background position in sprite */ 202 203 204} 205 206.flip-horizontally { 207 208 transform:scaleX(-1); 209 -webkit-transform:scaleX(-1); 210 -moz-transform:scaleX(-1); 211 -ms-transform:scaleX(-1); 212 -o-transform:scaleX(-1); 213} 214 215.sakura { 216 z-index: 1000; 217} 218</style> 219<!-- Global site tag (gtag.js) - Google Analytics -->
vendor: 64 bytes, lines 219-220
219 220<script async src="https://www.googletagmanager.com/gtag/js?id=
220UA-140780598-1
vendor: 12 bytes, line 220
220"></script>
221<script> 222
vendor: 134 bytes, lines 222-226
222window.dataLayer = window.dataLayer || []; 223 function gtag(){dataLayer.push(arguments);} 224 gtag('js', new Date()); 225 226 gtag('config', '
226UA-140780598-1
vendor: 4 bytes, line 226
226');
227</script>
227 228 229<!-- START Load React --> 230
231<script src="https://unpkg.com/react@17/umd/react.development.js" crossorigin></script>
vendor: 1 bytes, line 231
231
232<script src="https://unpkg.com/react-dom@17/umd/react-dom.development.js" crossorigin></script>
vendor: 1 bytes, line 232
232
233<script src="https://unpkg.com/@babel/standalone/babel.min.js"></script>
233 234 235<style> 236.FancyBorder-blue { 237 border-style: solid; 238 border-color: blue; 239} 240.FancyBorder-red { 241 border-style: solid; 242 border-color: red; 243} 244.FancyBorder-green { 245 border-style: solid; 246 border-color: green; 247} 248</style> 249 250<!-- END Load React --> 251 </head> 252<body onload="loadMap();"> 253
254<script src="https://openplans.github.io/Leaflet.AnimatedMarker/src/AnimatedMarker.js"></script>
vendor: 1 bytes, line 254
254
255<script type="text/javascript"> 256 L.LabelOverlay = L.Class.extend({ 257 initialize: function(/*LatLng*/ latLng, /*String*/ label, options) { 258 this._latlng = latLng; 259 this._label = label; 260 L.Util.setOptions(this, options); 261 }, 262 options: { 263 offset: new L.Point(0, 2) 264 }, 265 onAdd: function(map) { 266 this._map = map; 267 if (!this._container) { 268 this._initLayout(); 269 } 270 map.getPanes().overlayPane.appendChild(this._container); 271 this._container.innerHTML = this._label; 272 map.on('viewreset', this._reset, this); 273 this._reset(); 274 }, 275 onRemove: function(map) { 276 map.getPanes().overlayPane.removeChild(this._container); 277 map.off('viewreset', this._reset, this); 278 }, 279 _reset: function() { 280 var pos = this._map.latLngToLayerPoint(this._latlng); 281 var op = new L.Point(pos.x + this.options.offset.x, pos.y - this.options.offset.y); 282 L.DomUtil.setPosition(this._container, op); 283 }, 284 _initLayout: function() { 285 this._container = L.DomUtil.create('div', 'leaflet-label-overlay'); 286 } 287 }); 288 289 function getXHttp() 290 { 291 if(window.XMLHttpRequest) 292 { 293 return new XMLHttpRequest(); 294 } else { 295 return new ActiveXObject("Microsoft.XMLHTTP"); 296 } 297 } 298 299 var mymap = null; 300 var fg_sidebar_added = false; 301 var cn_tower_latlong = [43.642567, -79.387054]; 302 var cn_towerIcon = L.icon({ 303 iconUrl: '/kiwicat/images/cn_tower.svg', 304 //shadowUrl: '/kiwicat/images/cn_tower_shadow.png', 305 iconSize: [124, 93], // size of the icon 306 //iconSize: [38, 95], // size of the icon 307 //shadowSize: [50, 64], // size of the shadow 308 //shadowSize: [38, 95], // size of the shadow 309 iconAnchor: [22, 94], // point of the icon which will correspond to marker's location 310 //shadowAnchor: [4, 62], // the same for the shadow 311 popupAnchor: [-3, -76] // point from which the popup should open relative to the iconAnchor 312 }); 313 314 var uoft_name = 'U of T'; 315 var uoft_latlong = [43.66363, -79.3943]; 316 317 var uoftIcon = L.icon({ 318 iconUrl: 'https://varsityblues.ca/favicon.ico', 319 320 iconSize: [16, 16], // size of the icon 321 iconAnchor: [-8, -8], 322 popupAnchor: [16, 4] 323 }); 324 325 var icube_latlong = [43.5478, -79.6642]; 326 327 var icube_name = 'ICUBE'; 328 var icubeIcon = L.icon({ 329 iconUrl: 'https://icubeutm.ca/wp-content/uploads/2019/10/cropped-icon-270x270.png', 330 //iconUrl: 'images/pumpkin_1.gif', 331 className: "icon_box bg_white", 332 iconSize: [16, 16], // size of the icon 333 iconAnchor: [-8, -8], 334 popupAnchor: [16, 4] 335 }); 336 337 var utsc_latlong = [43.7843,-79.1873]; 338 339 var utscIcon = L.icon({ 340 iconUrl: 'https://www.utsc.utoronto.ca/thehub/sites/all/themes/bootstrapDepartments/favicon.ico', 341 //iconUrl: 'images/pumpkin_2.gif', 342 className: "icon_box bg_white", 343 iconSize: [16, 16], // size of the icon 344 iconAnchor: [-8, -8], 345 popupAnchor: [16, 4] 346 }); 347 348 var ryerson_latlong = [43.657936, -79.38049]; 349 var ryersonIcon = L.icon({ 350 iconUrl: 'https://www.ryerson.ca/favicon.ico', 351 352 iconSize: [16, 16], // size of the icon 353 iconAnchor: [-8, -8], 354 popupAnchor: [16, 4] 355 }); 356 357 var gbc_latlong = [43.676263, -79.410162]; 358 var gbcIcon = L.icon({ 359 //iconUrl: 'https://www.georgebrown.ca/favicon.ico', 360 iconUrl: 'https://www.georgebrown.ca/themes/custom/de_theme/src/img/favicons/favicon.ico', 361 362 iconSize: [16, 16], // size of the icon 363 iconAnchor: [-8, -8], 364 popupAnchor: [16, 4] 365 }); 366 367 var to_city_hall_latlong = [43.65314, -79.383965]; 368 // 43.6536759,-79.386292 369 var to_city_hallIcon = L.icon({ 370 iconUrl: '/kiwicat/images/city_hall.svg', 371 372 iconSize: [63, 47], // size of the icon 373 //iconSize: [30, 45], // size of the icon 374 shadowSize: [50, 64], // size of the shadow
375 iconAnchor: [22, 94], // point of the icon which will correspond to marker's location 376 shadowAnchor: [4, 62], // the same for the shadow 377 popupAnchor: [-3, -76] // point from which the popup should open relative to the iconAnchor 378 }); 379 380 var ca_life_latlong = [43.65125, -79.38755]; 381 var ca_lifeIcon = L.icon({ 382 iconUrl: '/kiwicat/images/ca_life.png', 383 384 iconSize: [40, 45], // size of the icon 385 shadowSize: [50, 64], // size of the shadow 386 iconAnchor: [22, 94], // point of the icon which will correspond to marker's location 387 shadowAnchor: [4, 62], // the same for the shadow 388 popupAnchor: [-3, -76] // point from which the popup should open relative to the iconAnchor 389 }); 390 391 var chinatown_latlong = [43.652650, -79.398025]; 392 var chinatownIcon = L.icon({ 393 iconUrl: '/kiwicat/images/chinatown.png', 394 395 iconSize: [45, 45], // size of the icon 396 shadowSize: [50, 64], // size of the shadow 397 iconAnchor: [22, 94], // point of the icon which will correspond to marker's location 398 shadowAnchor: [4, 62], // the same for the shadow 399 popupAnchor: [-3, -76] // point from which the popup should open relative to the iconAnchor 400 }); 401 402 var bk_10_latlong = [43.664735,-79.403019]; // 📖 403 var bk_10Icon = L.divIcon({ 404 html: "<span style='font-size: 16px; line-height: normal; text-align: center; padding: 70px 0; margin: auto;'>💔</span>" , 405 iconSize: [18, 18], 406 iconAnchor: [-9, -9], 407 popupAnchor: [18, 4] 408 }); 409 410 var eve_1_latlong = [43.767858, -79.412593]; // 📖 411 var eve_1Icon = L.divIcon({ 412 html: "<span style='font-size: 16px; line-height: normal; text-align: center; padding: 70px 0; margin: auto;'>🎈</span>" , 413 className: "dummy", 414 iconSize: [18, 18], 415 iconAnchor: [-9, -9], 416 popupAnchor: [18, 4] 417 }); 418 var eve_1_msg = "🎈<a href='https://acrossuhub.com/events/city-mosaic-2019/' target='_blank'>CITY MOSAIC</a><br>CITY MOSAIC provides an opportunity for youth and young adults to embark on a Global Journey, getting a TASTE OF EVERY CULTURE in the world without ever having to step foot out of Toronto."; 419 420 var eve_2_latlong = [43.648004, -79.395076]; // 📖 421 var eve_2Icon = L.icon({ 422 iconUrl: 'https://www.eventbrite.ca/favicon.ico', 423 424 iconSize: [16, 16], // size of the icon 425 iconAnchor: [-8, -8], 426 popupAnchor: [16, 4] 427 }); 428 var eve_2_msg = "🎈<a href='https://www.eventbrite.ca/e/city-building-and-civics-torontos-asian-heritage-tickets-61468857006' target='_blank'>Toronto's Asian Heritage</a><br>Join us to discuss and celebrate the contribution of Toronto's Asian community through the lens of city building and civic engagement."; 429 430 var eve_3_latlong = [43.657608, -79.381461]; // 📖 431 var eve_3Icon = L.icon({ 432 iconUrl: 'https://www.meetup.com/mu_static/en-US/favicon.a6878039.ico', 433 434 iconSize: [16, 16], // size of the icon 435 iconAnchor: [-8, -8], 436 popupAnchor: [16, 4] 437 }); 438 var eve_3_msg = "🎈<a href='https://www.meetup.com/Ryerson-Tech-Talks/events/260787731/' target='_blank'>DevOps, Amazon Web Services, Google Cloud...</a><br>Helping Enterprise teams navigate Digital Transformation with DevOps."; 439 440 var hamilton_latlong = [43.264, -79.9523]; 441 var hamilton_Icon = L.icon({ 442 iconUrl: 'images/snowman.gif', 443 //iconUrl: 'images/spring_birds.gif', 444 445 iconSize: [60, 80], // size of the icon 446 iconAnchor: [3, -8], 447 popupAnchor: [32, 24] 448 }); 449 var hamilton_msg = 'Welcome to Hamilton!!!'; 450 451 var church_st_latlong = [43.6620, -79.3793]; 452 var church_st_Icon = L.icon({ 453 iconUrl: 'images/black_cat.gif', 454 455 iconSize: [40, 30], // size of the icon 456 iconAnchor: [3, -8], 457 popupAnchor: [16, 4] 458 }); 459 var church_st_msg = 'Happy Halloween!!!'; 460 461// Spadina Ave 43.6496179,-79.398822 462 var labelLocation = new L.LatLng(43.65563942006717, -79.39913749694824); 463 //var labelTitle = new L.LabelOverlay(labelLocation, 'Spadina Ave'); 464 465 var txt_lbl_1_latlong = [43.6496179,-79.398822]; 466 var txt_lbl_1_icon = L.divIcon({ 467 html: "" , 468 className: "dummy" 469 }) 470 471 var xy = function(x, y) { 472 if (L.Util.isArray(x)) { // When doing xy([x, y]); 473 return yx(x[1], x[0]); 474 } 475 return yx(y, x); // When doing xy(x, y); 476 }; 477 478 var lm_layer_grp = L.layerGroup(); 479 var lm_layer_grp_zin = L.layerGroup(); 480 var lm_layer_grp_zin2 = L.layerGroup(); 481 var lm_layer_grp_zout = L.layerGroup(); 482 var lm_layer_grp_zout2 = L.layerGroup(); 483 484 var sakura_layer_group = L.layerGroup(); 485 var shop_layer_group = L.layerGroup(); 486 var bk_layer_group = L.layerGroup(); 487 var college_layer_group = L.layerGroup(); 488 var event_layer_group = L.layerGroup(); 489 var halloween_layer_group = L.layerGroup(); 490 var video_layer_group = L.layerGroup(); 491 492 function loadMap() 493 { 494 //https://tiles.stadiamaps.com/styles/stamen_watercolor 495 //http://c.tile.stamen.com/watercolor/ 496 //https://stamen-tiles-{s}.a.ssl.fastly.net/watercolor/{z}/{x}/{y}.{ext} 497 //https://tiles.stadiamaps.com/styles/stamen_watercolor/{z}/{x}/{y}.jpg 498 //http://c.tile.stamen.com/terrain-labels/16/18314/23914.png 499 //https://stamen-tiles-{s}.a.ssl.fastly.net/terrain-labels/{z}/{x}/{y}{r}.{ext} 500 //http://c.tile.stamen.com/terrain-labels/{z}/{x}/{y}.png 501 //https://tiles.stadiamaps.com/styles/stamen_watercolor 502 //http://c.tile.stamen.com/terrain-labels/ 503 504 //var baseLayer = L.tileLayer('https://stamen-tiles-{s}.a.ssl.fastly.net/watercolor/{z}/{x}/{y}.{ext}', { 505 //https://watercolormaps.collection.cooperhewitt.org/tile/watercolor/12/659/1587.jpg 506 var baseLayer = L.tileLayer('https://watercolormaps.collection.cooperhewitt.org/tile/watercolor/{z}/{x}/{y}.{ext}', { 507 attribution: 'Map data © <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors, <a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery © <a href="https://stamen.com/">Stamen</a>', 508 maxZoom: 18, 509 ext: 'jpg' 510 }); 511 512 baseLayer.setOpacity(0.7); 513 514 //var roadLayer = L.tileLayer('https://stamen-tiles-{s}.a.ssl.fastly.net/terrain-labels/{z}/{x}/{y}{r}.{ext}', {ext: 'png'}); 515 var roadLayer = L.tileLayer('https://{s}.basemaps.cartocdn.com/light_only_labels/{z}/{x}/{y}{r}.{ext}', {ext: 'png'}); 516 // https://{s}.basemaps.cartocdn.com/dark_only_labels/{z}/{x}/{y}{r}.png 517 518 var railLayer = L.tileLayer('https://{s}.tiles.openrailwaymap.org/standard/{z}/{x}/{y}.png', {}); 519 520 var baseLayers = {
521 "Base Map": baseLayer, 522 "Road Map": roadLayer, 523 "Rail Map": railLayer 524 }; 525 526 /* 527 var lm_layer_grp = L.layerGroup(); 528 var lm_layer_grp_zin = L.layerGroup(); 529 var lm_layer_grp_zin2 = L.layerGroup(); 530 var lm_layer_grp_zout = L.layerGroup(); 531 var lm_layer_grp_zout2 = L.layerGroup(); 532 533 var shop_layer_group = L.layerGroup(); 534 var bk_layer_group = L.layerGroup(); 535 var college_layer_group = L.layerGroup(); 536 var event_layer_group = L.layerGroup(); 537 */ 538 539 //document.getElementById("loader_logo").style.display = "none"; 540 //if(!$("#loader").fadeOut) 541 //document.getElementById("loader").style.display = "none"; // to catch older browsers 542 //else 543 window.setTimeout(function(){ 544 545 try 546 { 547 $("#loader_logo").fadeOut("fast", function(){ logo_watermark.addTo(mymap); }); 548 window.setTimeout(function(){ $("#loader").fadeOut("slow"); }, 1000); 549 } 550 catch(err) 551 { 552 //alert(err) 553 document.getElementById("loader").style.display = "none"; // to catch older browsers 554 logo_watermark.addTo(mymap); 555 } 556 557 //window.setTimeout(function(){ 558 //if(document.getElementById("loader").style.display != "none") 559 //document.getElementById("loader").style.display = "none"; // to catch older browsers 560 //}, 3000); 561 562 }, 3000); 563 564 mymap = L.map('mapid', { 565 ////layers: [baseLayer, roadLayer, sakura_layer_group, shop_layer_group, bk_layer_group, college_layer_group, event_layer_group, halloween_layer_group, video_layer_group] 566 layers: [baseLayer, roadLayer, shop_layer_group, bk_layer_group, college_layer_group, event_layer_group, halloween_layer_group, video_layer_group] 567 }).setView([43.653941,-79.425368], 13); // "name": "FAITH / VOID" 568 569 //}
569).setView([43.64715, -79.4039], 13); // var queen_bathurst_latlng = [43.64715, -79.4039]; 570 571 //}).setView(uoft_latlong, 13); 572 573 574 575 //L.control.layers(baseLayers).addTo(mymap); 576 577 //mymap = L.map('mapid').fitWorld(); 578 //mymap = L.map('mapid').setView(uoft_latlong, 13); 579 //, {zoomControl:false} 580 //L.control.zoom({position: 'topright'}).addTo(mymap); 581 582 L.Control.Watermark = L.Control.extend({ 583 onAdd: function(map) { 584 //var a = L.DomUtil.create('a'); 585 var a = document.createElement('a'); 586 var img = L.DomUtil.create('img'); 587 588 img.src = 'images/tenatch_logo_beneath_christmas.png'; 589 img.style.width = '150px'; 590 //img.onclick = 'goHome()'; 591 //img.addEventListener('click', goHome); 592 L.DomUtil.addClass(img, 'leaflet-interactive'); 593 594 a.href = 'https://tenatch.ca'; 595 a.target = '_blank'; 596 a.appendChild(img); 597 598 return a; 599 }, 600 601 onRemove: function(map) { 602 // Nothing to do here 603 } 604 }); 605 606 L.control.watermark = function(opts) { 607 return new L.Control.Watermark(opts); 608 } 609 610 //L.control.watermark({ position: 'bottomright' }).addTo(mymap); 611 var logo_watermark = L.control.watermark(); 612 //logo_watermark.addTo(mymap); 613 614 //https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token={accessToken} 615 //L.tileLayer('https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token={accessToken}', { 616 // attribution: 'Map data © <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors, <a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery © <a href="https://www.mapbox.com/">Mapbox</a>', 617 // maxZoom: 18, 618 // id: 'mapbox.streets', 619 // accessToken: 'pk.eyJ1IjoibWFwYm94IiwiYSI6ImNpejY4NXVycTA2emYycXBndHRqcmZ3N3gifQ.rJcFIG214AriISLbB6B5aw' 620 //}).addTo(mymap); 621 622 //http://c.tile.stamen.com/watercolor/ 623 //L.tileLayer('http://c.tile.stamen.com/watercolor/{z}/{x}/{y}.jpg', { 624 // attribution: 'Map data © <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors, <a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery © <a href="https://www.mapbox.com/">Mapbox</a>', 625 // maxZoom: 18 626 //}).addTo(mymap); 627 628 var snow_bounds = L.latLngBounds([[43.7808, -79.5984], [43.5647, -79.2114]]); 629 L.imageOverlay("images/snow_layer.gif", snow_bounds).addTo(mymap); 630 631 //L.rectangle(snow_bounds).addTo(mymap); 632 633 //mymap.fitBounds(snow_bounds); 634 635 636 college_layer_group.addLayer(L.marker(uoft_latlong, {icon: uoftIcon}).bindPopup("U of T")); 637 college_layer_group.addLayer(L.marker(icube_latlong, {icon: icubeIcon}).bindPopup("<img src='https://icubeutm.ca/wp-content/uploads/2021/05/logo-1.png' width='120'/>")); 638 college_layer_group.addLayer(L.marker(utsc_latlong, {icon: utscIcon}).bindPopup("<img src='https://csec.club/static/770088174dd6a410b3f78eb38273a027/3a985/thehub1.png' width='120'/>")); 639 college_layer_group.addLayer(L.marker(ryerson_latlong, {icon: ryersonIcon}).bindPopup("Ryerson University")); 640 college_layer_group.addLayer(L.marker(gbc_latlong, {icon: gbcIcon}).bindPopup("George Brown University")); 641 642 event_layer_group.addLayer(L.marker(eve_1_latlong, {icon: eve_1Icon}).bindPopup(eve_1_msg)); 643 event_layer_group.addLayer(L.marker(eve_2_latlong, {icon: eve_2Icon}).bindPopup(eve_2_msg)); 644 event_layer_group.addLayer(L.marker(eve_3_latlong, {icon: eve_3Icon}).bindPopup(eve_3_msg)); 645 646 event_layer_group.addLayer(L.marker(hamilton_latlong, {icon: hamilton_Icon}).bindPopup(hamilton_msg)); 647 //event_layer_group.addLayer(L.marker(church_st_latlong, {icon: church_st_Icon}).bindPopup(church_st_msg)); 648 649 //L.marker(cn_tower_latlong, {icon: cn_towerIcon}).addTo(mymap).bindPopup("CN Tower"); 650 //L.marker(to_city_hall_latlong, {icon: to_city_hallIcon}).addTo(mymap).bindPopup("City Hall"); 651 //L.marker(lm_uoft_latlong, {icon: lm_uoftIcon}).addTo(mymap).bindPopup("U of T"); 652 //L.marker(lm_on_parliament_latlong, {icon: lm_on_parliamentIcon}).addTo(mymap).bindPopup("Ontario Provincial Parliament"); 653 //L.marker(lm_rom_latlong, {icon: lm_romIcon}).addTo(mymap).bindPopup("Royal Ontario Museum"); 654 //L.marker(lm_jurassic_park_latlong, {icon: lm_jurassic_parkIcon}).addTo(mymap).bindPopup("Jurassic Park"); 655 656 //L.marker(ca_life_latlong, {icon: ca_lifeIcon}).addTo(mymap); 657 //L.marker(chinatown_latlong, {icon: chinatownIcon}).addTo(mymap); 658 659var lm_icon = ""; 660var lm_marker = null; 661 662lm_icon = {icon: 663L.icon({ 664 iconUrl: '/kiwicat/images/cn_tower.svg', 665 iconSize: [124, 93], 666 iconAnchor: [62, 46.5] 667})} 668 669lm_marker = L.marker([43.6429, -79.387054], lm_icon).bindPopup("CN Tower"); 670lm_layer_grp.addLayer(lm_marker); 671 672 673 674lm_icon = {icon: 675L.icon({ 676 iconUrl: '/kiwicat/images/cn_tower.svg', 677 iconSize: [248, 186], 678 iconAnchor: [124, 93] 679})} 680 681lm_marker = L.marker([43.6429, -79.387054], lm_icon).bindPopup("CN Tower"); 682lm_layer_grp_zin.addLayer(lm_marker); 683 684 685 686lm_icon = {icon: 687L.icon({ 688 iconUrl: '/kiwicat/images/cn_tower.svg', 689 iconSize: [496, 372], 690 iconAnchor: [248, 186] 691})} 692 693lm_marker = L.marker([43.6429, -79.387054], lm_icon).bindPopup("CN Tower"); 694lm_layer_grp_zin2.addLayer(lm_marker); 695 696 697 698lm_icon = {icon: 699L.icon({ 700 iconUrl: '/kiwicat/images/cn_tower.svg', 701 iconSize: [62, 46.5], 702 iconAnchor: [31, 23.25] 703})} 704 705lm_marker = L.marker([43.6429, -79.387054], lm_icon).bindPopup("CN Tower"); 706lm_layer_grp_zout.addLayer(lm_marker); 707 708 709 710lm_icon = {icon: 711L.icon({ 712 iconUrl: '/kiwicat/images/cn_tower.svg', 713 iconSize: [31, 23.25], 714 iconAnchor: [15.5, 11.625] 715})} 716 717lm_marker = L.marker([43.6429, -79.387054], lm_icon).bindPopup("CN Tower"); 718lm_layer_grp_zout2.addLayer(lm_marker); 719 720 721lm_icon = {icon: 722L.icon({ 723 iconUrl: '/kiwicat/images/parliament.svg', 724 iconSize: [63, 47], 725 iconAnchor: [31.5, 23.5] 726})} 727 728lm_marker = L.marker([43.662355, -79.391582], lm_icon).bindPopup("Ontario Parliament"); 729lm_layer_grp.addLayer(lm_marker); 730 731 732 733lm_icon = {icon: 734L.icon({ 735 iconUrl: '/kiwicat/images/parliament.svg', 736 iconSize: [126, 94], 737 iconAnchor: [63, 47] 738})} 739 740lm_marker = L.marker([43.662355, -79.391582], lm_icon).bindPopup("Ontario Parliament"); 741lm_layer_grp_zin.addLayer(lm_marker); 742 743 744 745lm_icon = {icon: 746L.icon({ 747 iconUrl: '/kiwicat/images/parliament.svg', 748 iconSize: [252, 188], 749 iconAnchor: [126, 94] 750})} 751 752lm_marker = L.marker([43.662355, -79.391582], lm_icon).bindPopup("Ontario Parliament"); 753lm_layer_grp_zin2.addLayer(lm_marker); 754 755 756 757lm_icon = {icon: 758L.icon({ 759 iconUrl: '/kiwicat/images/parliament.svg', 760 iconSize: [31.5, 23.5], 761 iconAnchor: [15.75, 11.75] 762})} 763 764lm_marker = L.marker([43.662355, -79.391582], lm_icon).bindPopup("Ontario Parliament"); 765lm_layer_grp_zout.addLayer(lm_marker); 766 767 768 769lm_icon = {icon: 770L.icon({ 771 iconUrl: '/kiwicat/images/parliament.svg', 772 iconSize: [15.75, 11.75], 773 iconAnchor: [7.875, 5.875] 774})} 775 776lm_marker = L.marker([43.662355, -79.391582], lm_icon).bindPopup("Ontario Parliament"); 777lm_layer_grp_zout2.addLayer(lm_marker); 778 779 780lm_icon = {icon: 781L.icon({ 782 iconUrl: '/kiwicat/images/rom.svg', 783 iconSize: [63, 47], 784 iconAnchor: [31.5, 23.5] 785})} 786 787lm_marker = L.marker([43.667621, -79.394576], lm_icon).bindPopup("ROM"); 788lm_layer_grp.addLayer(lm_marker); 789 790 791 792lm_icon = {icon: 793L.icon({ 794 iconUrl: '/kiwicat/images/rom.svg', 795 iconSize: [126, 94], 796 iconAnchor: [63, 47] 797})} 798 799lm_marker = L.marker([43.667621, -79.394576], lm_icon).bindPopup("ROM"); 800lm_layer_grp_zin.addLayer(lm_marker); 801 802 803 804lm_icon = {icon: 805L.icon({ 806 iconUrl: '/kiwicat/images/rom.svg', 807 iconSize: [252, 188], 808 iconAnchor: [126, 94] 809})} 810 811lm_marker = L.marker([43.667621, -79.394576], lm_icon).bindPopup("ROM"); 812lm_layer_grp_zin2.addLayer(lm_marker); 813 814 815 816lm_icon = {icon: 817L.icon({ 818 iconUrl: '/kiwicat/images/rom.svg', 819 iconSize: [31.5, 23.5], 820 iconAnchor: [15.75, 11.75] 821})} 822 823lm_marker = L.marker([43.667621, -79.394576], lm_icon).bindPopup("ROM"); 824lm_layer_grp_zout.addLayer(lm_marker); 825 826 827 828lm_icon = {icon: 829L.icon({ 830 iconUrl: '/kiwicat/images/rom.svg', 831 iconSize: [15.75, 11.75], 832 iconAnchor: [7.875, 5.875] 833})} 834 835lm_marker = L.marker([43.667621, -79.394576], lm_icon).bindPopup("ROM"); 836lm_layer_grp_zout2.addLayer(lm_marker); 837 838 839lm_icon = {icon: 840L.icon({ 841 iconUrl: '/kiwicat/images/acc.svg', 842 iconSize: [63, 47], 843 iconAnchor: [31.5, 23.5] 844})} 845 846lm_marker = L.marker([43.644, -79.379062], lm_icon).bindPopup("Jurassic Park"); 847lm_layer_grp.addLayer(lm_marker); 848 849 850 851lm_icon = {icon: 852L.icon({ 853 iconUrl: '/kiwicat/images/acc.svg', 854 iconSize: [126, 94], 855 iconAnchor: [63, 47] 856})} 857 858lm_marker = L.marker([43.644, -79.379062], lm_icon).bindPopup("Jurassic Park"); 859lm_layer_grp_zin.addLayer(lm_marker); 860 861 862 863lm_icon = {icon: 864L.icon({ 865 iconUrl: '/kiwicat/images/acc.svg', 866 iconSize: [252, 188], 867 iconAnchor: [126, 94] 868})} 869 870lm_marker = L.marker([43.644, -79.379062], lm_icon).bindPopup("Jurassic Park"); 871lm_layer_grp_zin2.addLayer(lm_marker); 872 873 874 875lm_icon = {icon: 876L.icon({ 877 iconUrl: '/kiwicat/images/acc.svg', 878 iconSize: [31.5, 23.5], 879 iconAnchor: [15.75, 11.75] 880})} 881 882lm_marker = L.marker([43.644, -79.379062], lm_icon).bindPopup("Jurassic Park"); 883lm_layer_grp_zout.addLayer(lm_marker); 884 885 886 887lm_icon = {icon: 888L.icon({ 889 iconUrl: '/kiwicat/images/acc.svg', 890 iconSize: [15.75, 11.75], 891 iconAnchor: [7.875, 5.875] 892})} 893 894lm_marker = L.marker([43.644, -79.379062], lm_icon).bindPopup("Jurassic Park"); 895lm_layer_grp_zout2.addLayer(lm_marker); 896 897 898lm_icon = {icon: 899L.icon({ 900 iconUrl: '/kiwicat/images/uoft.svg', 901 iconSize: [63, 47], 902 iconAnchor: [31.5, 23.5] 903})} 904 905lm_marker = L.marker([43.663, -79.396], lm_icon).bindPopup("U of T"); 906lm_layer_grp.addLayer(lm_marker); 907 908 909 910lm_icon = {icon: 911L.icon({ 912 iconUrl: '/kiwicat/images/uoft.svg', 913 iconSize: [126, 94], 914 iconAnchor: [63, 47] 915})} 916 917lm_marker = L.marker([43.663, -79.396], lm_icon).bindPopup("U of T"); 918lm_layer_grp_zin.addLayer(lm_marker); 919 920 921 922lm_icon = {icon: 923L.icon({ 924 iconUrl: '/kiwicat/images/uoft.svg', 925 iconSize: [252, 188], 926 iconAnchor: [126, 94] 927})} 928 929lm_marker = L.marker([43.663, -79.396], lm_icon).bindPopup("U of T"); 930lm_layer_grp_zin2.addLayer(lm_marker); 931 932 933 934lm_icon = {icon: 935L.icon({ 936 iconUrl: '/kiwicat/images/uoft.svg', 937 iconSize: [31.5, 23.5], 938 iconAnchor: [15.75, 11.75] 939})} 940 941lm_marker = L.marker([43.663, -79.396], lm_icon).bindPopup("U of T"); 942lm_layer_grp_zout.addLayer(lm_marker); 943 944 945 946lm_icon = {icon: 947L.icon({ 948 iconUrl: '/kiwicat/images/uoft.svg', 949 iconSize: [15.75, 11.75], 950 iconAnchor: [7.875, 5.875] 951})} 952 953lm_marker = L.marker([43.663, -79.396], lm_icon).bindPopup("U of T"); 954lm_layer_grp_zout2.addLayer(lm_marker); 955 956 957lm_icon = {icon: 958L.icon({ 959 iconUrl: '/kiwicat/images/city_hall.svg', 960 iconSize: [63, 47], 961 iconAnchor: [31.5, 23.5] 962})} 963 964lm_marker = L.marker([43.65314, -79.383965], lm_icon).bindPopup("City Hall"); 965lm_layer_grp.addLayer(lm_marker); 966 967 968 969lm_icon = {icon: 970L.icon({ 971 iconUrl: '/kiwicat/images/city_hall.svg', 972 iconSize: [126, 94], 973 iconAnchor: [63, 47] 974})} 975 976lm_marker = L.marker([43.65314, -79.383965], lm_icon).bindPopup("City Hall"); 977lm_layer_grp_zin.addLayer(lm_marker); 978 979 980 981lm_icon = {icon: 982L.icon({ 983 iconUrl: '/kiwicat/images/city_hall.svg', 984 iconSize: [252, 188], 985 iconAnchor: [126, 94] 986})} 987 988lm_marker = L.marker([43.65314, -79.383965], lm_icon).bindPopup("City Hall"); 989lm_layer_grp_zin2.addLayer(lm_marker); 990 991 992 993lm_icon = {icon: 994L.icon({ 995 iconUrl: '/kiwicat/images/city_hall.svg', 996 iconSize: [31.5, 23.5], 997 iconAnchor: [15.75, 11.75] 998})} 999 1000lm_marker = L.marker([43.65314, -79.383965], lm_icon).bindPopup("City Hall"); 1001lm_layer_grp_zout.addLayer(lm_marker); 1002 1003 1004 1005lm_icon = {icon: 1006L.icon({ 1007 iconUrl: '/kiwicat/images/city_hall.svg', 1008 iconSize: [15.75, 11.75], 1009 iconAnchor: [7.875, 5.875] 1010})} 1011 1012lm_marker = L.marker([43.65314, -79.383965], lm_icon).bindPopup("City Hall"); 1013lm_layer_grp_zout2.addLayer(lm_marker); 1014 1015 1016lm_icon = {icon: 1017L.icon({ 1018 iconUrl: '/kiwicat/images/skydome.svg', 1019 iconSize: [63, 47], 1020 iconAnchor: [31.5, 23.5] 1021})} 1022 1023lm_marker = L.marker([43.641548, -79.388958], lm_icon).bindPopup("Rogers Centre"); 1024lm_layer_grp.addLayer(lm_marker); 1025 1026 1027 1028lm_icon = {icon: 1029L.icon({ 1030 iconUrl: '/kiwicat/images/skydome.svg', 1031 iconSize: [126, 94], 1032 iconAnchor: [63, 47] 1033})} 1034 1035lm_marker = L.marker([43.641548, -79.388958], lm_icon).bindPopup("Rogers Centre"); 1036lm_layer_grp_zin.addLayer(lm_marker); 1037 1038 1039 1040lm_icon = {icon: 1041L.icon({ 1042 iconUrl: '/kiwicat/images/skydome.svg', 1043 iconSize: [252, 188], 1044 iconAnchor: [126, 94] 1045})} 1046 1047lm_marker = L.marker([43.641548, -79.388958], lm_icon).bindPopup("Rogers Centre"); 1048lm_layer_grp_zin2.addLayer(lm_marker); 1049 1050 1051 1052lm_icon = {icon: 1053L.icon({ 1054 iconUrl: '/kiwicat/images/skydome.svg', 1055 iconSize: [31.5, 23.5], 1056 iconAnchor: [15.75, 11.75] 1057})} 1058 1059lm_marker = L.marker([43.641548, -79.388958], lm_icon).bindPopup("Rogers Centre"); 1060lm_layer_grp_zout.addLayer(lm_marker); 1061 1062 1063 1064lm_icon = {icon: 1065L.icon({ 1066 iconUrl: '/kiwicat/images/skydome.svg', 1067 iconSize: [15.75, 11.75], 1068 iconAnchor: [7.875, 5.875] 1069})} 1070 1071lm_marker = L.marker([43.641548, -79.388958], lm_icon).bindPopup("Rogers Centre"); 1072lm_layer_grp_zout2.addLayer(lm_marker); 1073 1074 1075lm_icon = {icon: 1076L.icon({ 1077 iconUrl: '/kiwicat/images/st_lawrence.svg', 1078 iconSize: [63, 47], 1079 iconAnchor: [31.5, 23.5] 1080})} 1081 1082lm_marker = L.marker([43.648759, -79.371632], lm_icon).bindPopup("St. Lawrence Market"); 1083lm_layer_grp.addLayer(lm_marker); 1084 1085 1086 1087lm_icon = {icon: 1088L.icon({ 1089 iconUrl: '/kiwicat/images/st_lawrence.svg', 1090 iconSize: [126, 94], 1091 iconAnchor: [63, 47] 1092})} 1093 1094lm_marker = L.marker([43.648759, -79.371632], lm_icon).bindPopup("St. Lawrence Market"); 1095lm_layer_grp_zin.addLayer(lm_marker); 1096 1097 1098 1099lm_icon = {icon: 1100L.icon({ 1101 iconUrl: '/kiwicat/images/st_lawrence.svg', 1102 iconSize: [252, 188], 1103 iconAnchor: [126, 94] 1104})} 1105 1106lm_marker = L.marker([43.648759, -79.371632], lm_icon).bindPopup("St. Lawrence Market"); 1107lm_layer_grp_zin2.addLayer(lm_marker); 1108 1109 1110 1111lm_icon = {icon: 1112L.icon({ 1113 iconUrl: '/kiwicat/images/st_lawrence.svg', 1114 iconSize: [31.5, 23.5], 1115 iconAnchor: [15.75, 11.75] 1116})} 1117 1118lm_marker = L.marker([43.648759, -79.371632], lm_icon).bindPopup("St. Lawrence Market"); 1119lm_layer_grp_zout.addLayer(lm_marker); 1120 1121 1122 1123lm_icon = {icon: 1124L.icon({ 1125 iconUrl: '/kiwicat/images/st_lawrence.svg', 1126 iconSize: [15.75, 11.75], 1127 iconAnchor: [7.875, 5.875] 1128})} 1129 1130lm_marker = L.marker([43.648759, -79.371632], lm_icon).bindPopup("St. Lawrence Market"); 1131lm_layer_grp_zout2.addLayer(lm_marker); 1132 1133 1134lm_icon = {icon: 1135L.icon({ 1136 iconUrl: '/kiwicat/images/casa_loma.svg', 1137 iconSize: [63, 47], 1138 iconAnchor: [31.5, 23.5] 1139})} 1140 1141lm_marker = L.marker([43.678035, -79.409446], lm_icon).bindPopup("Casa Loma"); 1142lm_layer_grp.addLayer(lm_marker); 1143 1144 1145 1146lm_icon = {icon: 1147L.icon({ 1148 iconUrl: '/kiwicat/images/casa_loma.svg', 1149 iconSize: [126, 94], 1150 iconAnchor: [63, 47] 1151})} 1152 1153lm_marker = L.marker([43.678035, -79.409446], lm_icon).bindPopup("Casa Loma"); 1154lm_layer_grp_zin.addLayer(lm_marker); 1155 1156 1157 1158lm_icon = {icon: 1159L.icon({ 1160 iconUrl: '/kiwicat/images/casa_loma.svg', 1161 iconSize: [252, 188], 1162 iconAnchor: [126, 94] 1163})} 1164 1165lm_marker = L.marker([43.678035, -79.409446], lm_icon).bindPopup("Casa Loma"); 1166lm_layer_grp_zin2.addLayer(lm_marker); 1167 1168 1169 1170lm_icon = {icon: 1171L.icon({ 1172 iconUrl: '/kiwicat/images/casa_loma.svg', 1173 iconSize: [31.5, 23.5], 1174 iconAnchor: [15.75, 11.75] 1175})} 1176 1177lm_marker = L.marker([43.678035, -79.409446], lm_icon).bindPopup("Casa Loma"); 1178lm_layer_grp_zout.addLayer(lm_marker); 1179 1180 1181 1182lm_icon = {icon: 1183L.icon({ 1184 iconUrl: '/kiwicat/images/casa_loma.svg', 1185 iconSize: [15.75, 11.75], 1186 iconAnchor: [7.875, 5.875] 1187})} 1188 1189lm_marker = L.marker([43.678035, -79.409446], lm_icon).bindPopup("Casa Loma"); 1190lm_layer_grp_zout2.addLayer(lm_marker); 1191 1192 1193lm_icon = {icon: 1194L.icon({ 1195 iconUrl: '/kiwicat/images/ontario_place.svg', 1196 iconSize: [63, 47], 1197 iconAnchor: [31.5, 23.5] 1198})} 1199 1200lm_marker = L.marker([43.630417, -79.414186], lm_icon).bindPopup("Ontario Place"); 1201lm_layer_grp.addLayer(lm_marker); 1202 1203 1204 1205lm_icon = {icon: 1206L.icon({ 1207 iconUrl: '/kiwicat/images/ontario_place.svg', 1208 iconSize: [126, 94], 1209 iconAnchor: [63, 47] 1210})} 1211 1212lm_
1212marker = L.marker([43.630417, -79.414186], lm_icon).bindPopup("Ontario Place"); 1213lm_layer_grp_zin.addLayer(lm_marker); 1214 1215 1216 1217lm_icon = {icon: 1218L.icon({ 1219 iconUrl: '/kiwicat/images/ontario_place.svg', 1220 iconSize: [252, 188], 1221 iconAnchor: [126, 94] 1222})} 1223 1224lm_marker = L.marker([43.630417, -79.414186], lm_icon).bindPopup("Ontario Place"); 1225lm_layer_grp_zin2.addLayer(lm_marker); 1226 1227 1228 1229lm_icon = {icon: 1230L.icon({ 1231 iconUrl: '/kiwicat/images/ontario_place.svg', 1232 iconSize: [31.5, 23.5], 1233 iconAnchor: [15.75, 11.75] 1234})} 1235 1236lm_marker = L.marker([43.630417, -79.414186], lm_icon).bindPopup("Ontario Place"); 1237lm_layer_grp_zout.addLayer(lm_marker); 1238 1239 1240 1241lm_icon = {icon: 1242L.icon({ 1243 iconUrl: '/kiwicat/images/ontario_place.svg', 1244 iconSize: [15.75, 11.75], 1245 iconAnchor: [7.875, 5.875] 1246})} 1247 1248lm_marker = L.marker([43.630417, -79.414186], lm_icon).bindPopup("Ontario Place"); 1249lm_layer_grp_zout2.addLayer(lm_marker); 1250 1251 1252 1253mymap.addLayer(lm_layer_grp); 1254var curr_zoom_stage = 3; 1255var curr_zoom_layer = lm_layer_grp; 1256 1257mymap.on("zoomend", function() { 1258 1259 var zoomend_level = mymap.getZoom(); 1260 var zoomend_stage = 3; 1261 1262 if(zoomend_level > 17) 1263 zoomend_stage = 5; 1264 else if(zoomend_level > 15) 1265 zoomend_stage = 4; 1266 else if(zoomend_level < 5) 1267 zoomend_stage = 0; 1268 else if(zoomend_level < 8) 1269 zoomend_stage = 1; 1270 else if(zoomend_level < 11) 1271 zoomend_stage = 2; 1272 1273 if(zoomend_stage != curr_zoom_stage) 1274 { 1275 if(curr_zoom_stage != 0) 1276 mymap.removeLayer(curr_zoom_layer); 1277 1278 if(zoomend_stage == 5) 1279 curr_zoom_layer = lm_layer_grp_zin2; 1280 else if(zoomend_stage == 4) 1281 curr_zoom_layer = lm_layer_grp_zin; 1282 else if(zoomend_stage == 3) 1283 curr_zoom_layer = lm_layer_grp; 1284 else if(zoomend_stage == 2) 1285 curr_zoom_layer = lm_layer_grp_zout; 1286 else if(zoomend_stage == 1) 1287 curr_zoom_layer = lm_layer_grp_zout2; 1288 else 1289 curr_zoom_layer = null; // we don't show it. 1290 1291 if(zoomend_stage != 0) 1292 mymap.addLayer(curr_zoom_layer); 1293 1294 curr_zoom_stage = zoomend_stage; 1295 } 1296 1297}); 1298 1299 1300// Sakura 1301var sakura_icon = ""; 1302var sakura_marker = null; 1303var sakura_video_popup = ""; 1304var sakura_video_embed_code = ""; 1305 1306 1307 1308 sakura_icon = {icon: 1309L.icon({ 1310 iconUrl: 'images/cherry_blossom_tree.gif', 1311 iconSize: [64, 48], // size of the icon 1312 iconAnchor: [16, 12], 1313 popupAnchor: [16, 0] 1314 }) 1315}; 1316 1317 sakura_video_embed_code = '<iframe width="640" height="360" src="https://youtube.be/embed/ZUq9r5sQTuI" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>'; 1318 sakura_video_popup = '<div><font size="4"><a href="https://onesearch.library.utoronto.ca/library-info/ROBARTS" target="_blank">John P. Robarts Research Library</a>🌸</font></div><br />' + sakura_video_embed_code; 1319 1320 sakura_marker = L.marker([43.6643, -79.3995], sakura_icon).bindPopup(sakura_video_popup, {maxWidth : 640}).bindTooltip('John P. Robarts Research Library', {direction: 'right'}); 1321 1322 1323 sakura_layer_group.addLayer(sakura_marker); 1324 1325 1326 sakura_icon = {icon: 1327L.icon({ 1328 iconUrl: 'images/cherry_blossom_tree.gif', 1329 iconSize: [64, 48], // size of the icon 1330 iconAnchor: [16, 12], 1331 popupAnchor: [16, 0] 1332 }) 1333}; 1334 1335 sakura_video_embed_code = '<iframe width="640" height="360" src="https://youtube.be/embed/hcc-nZ7wPeg" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>'; 1336 sakura_video_popup = '<div><font size="4"><a href="https://www.toronto.ca/data/parks/prd/facilities/complex/629/index.html" target="_blank">Cedarvale Park</a>🌸</font></div><br />' + sakura_video_embed_code; 1337 1338 sakura_marker = L.marker([43.6919, -79.4309], sakura_icon).bindPopup(sakura_video_popup, {maxWidth : 640}).bindTooltip('Cedarvale Park', {direction: 'right'}); 1339 1340 1341 sakura_layer_group.addLayer(sakura_marker); 1342 1343 1344 sakura_icon = {icon: 1345L.icon({ 1346 iconUrl: 'images/cherry_blossom_tree.gif', 1347 iconSize: [64, 48], // size of the icon 1348 iconAnchor: [16, 12], 1349 popupAnchor: [16, 0] 1350 }) 1351}; 1352 1353 sakura_video_embed_code = '<iframe width="640" height="360" src="https://youtube.be/embed/88Hgnr7i4zc" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>'; 1354 sakura_video_popup = '<div><font size="4"><a href="https://trinitybellwoods.ca/" target="_blank">Trinity Belllwoods Park</a>🌸</font></div><br />' + sakura_video_embed_code; 1355 1356 sakura_marker = L.marker([43.6474, -79.4139], sakura_icon).bindPopup(sakura_video_popup, {maxWidth : 640}).bindTooltip('Trinity Belllwoods Park', {direction: 'right'}); 1357 1358 1359 sakura_layer_group.addLayer(sakura_marker); 1360 1361 1362 sakura_icon = {icon: 1363L.icon({ 1364 iconUrl: 'images/cherry_blossom_tree.gif', 1365 iconSize: [64, 48], // size of the icon 1366 iconAnchor: [16, 12], 1367 popupAnchor: [16, 0] 1368 }) 1369}; 1370 1371 sakura_video_embed_code = '<iframe width="640" height="360" src="https://youtube.be/embed/FBd_o6G_ii8" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>'; 1372 sakura_video_popup = '<div><font size="4"><a href="https://www.alltrails.com/trail/canada/ontario/birkdale-ravine" target="_blank">Birkdale Ravine</a>🌸</font></div><br />' + sakura_video_embed_code; 1373 1374 sakura_marker = L.marker([43.7646, -79.2655], sakura_icon).bindPopup(sakura_video_popup, {maxWidth : 640}).bindTooltip('Birkdale Ravine', {direction: 'right'}); 1375 1376 1377 sakura_layer_group.addLayer(sakura_marker); 1378 1379 1380 sakura_icon = {icon: 1381L.icon({ 1382 iconUrl: 'images/cherry_blossom_tree.gif', 1383 iconSize: [64, 48], // size of the icon 1384 iconAnchor: [16, 12], 1385 popupAnchor: [16, 0] 1386 }) 1387}; 1388 1389 sakura_video_embed_code = '<iframe width="640" height="360" src="https://youtube.be/embed/El-eGtD5VA8" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>'; 1390 sakura_video_popup = '<div><font size="4"><a href="https://www.toronto.ca/data/parks/prd/facilities/complex/798/index.html" target="_blank">Centennial Park</a>🌸</font></div><br />' + sakura_video_embed_code; 1391 1392 sakura_marker = L.marker([43.6547, -79.5887], sakura_icon).bindPopup(sakura_video_popup, {maxWidth : 640}).bindTooltip('Centennial Park', {direction: 'right'}); 1393 1394 1395 sakura_layer_group.addLayer(sakura_marker); 1396 1397 1398 sakura_icon = {icon: 1399L.icon({ 1400 iconUrl: 'images/cherry_blossom_tree.gif', 1401 iconSize: [64, 48], // size of the icon 1402 iconAnchor: [16, 12], 1403 popupAnchor: [16, 0] 1404 }) 1405}; 1406 1407 sakura_video_embed_code = '<iframe width="640" height="360" src="https://youtube.be/embed/-1_H60x2KAo" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>'; 1408 sakura_video_popup = '<div><font size="4"><a href="https://www.mississauga.ca/events-and-attractions/parks/kariya-park/" target="_blank">Kariya Park</a>🌸</font></div><br />' + sakura_video_embed_code; 1409 1410 sakura_marker = L.marker([43.5899, -79.6363], sakura_icon).bindPopup(sakura_video_popup, {maxWidth : 640}).bindTooltip('Kariya Park', {direction: 'right'}); 1411 1412 1413 sakura_layer_group.addLayer(sakura_marker); 1414 1415 1416 sakura_icon = {icon: 1417L.icon({ 1418 iconUrl: 'images/cherry_blossom_tree.gif', 1419 iconSize: [64, 48], // size of the icon 1420 iconAnchor: [16, 12], 1421 popupAnchor: [16, 0] 1422 }) 1423}; 1424 1425 sakura_video_embed_code = '<iframe width="640" height="360" src="https://youtube.be/embed/Er9w6Wnk13k" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>'; 1426 sakura_video_popup = '<div><font size="4"><a href="https://utsc.utoronto.ca/news-events/news/buds-bloom-take-look-sakura-trees-u-t-scarborough" target="_blank">Sakura Grove</a>🌸</font></div><br />' + sakura_video_embed_code; 1427 1428 sakura_marker = L.marker([43.7848, -79.1919], sakura_icon).bindPopup(sakura_video_popup, {maxWidth : 640}).bindTooltip('Sakura Grove', {direction: 'right'}); 1429 1430 1431 sakura_layer_group.addLayer(sakura_marker); 1432 1433 1434 sakura_icon = {icon: 1435L.icon({ 1436 iconUrl: 'images/cherry_blossom_tree.gif', 1437 iconSize: [64, 48], // size of the icon 1438 iconAnchor: [16, 12], 1439 popupAnchor: [16, 0] 1440 }) 1441}; 1442 1443 sakura_video_embed_code = '<iframe width="640" height="360" src="https://youtube.be/embed/IstE12rKpSI" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>'; 1444 sakura_video_popup = '<div><font size="4"><a href="https://yfile.news.yorku.ca/2019/05/07/sakura-cherry-trees-on-the-keele-campus-are-poised-to-bloom/" target="_blank">York U Sakura</a>🌸</font></div><br />' + sakura_video_embed_code; 1445 1446 sakura_marker = L.marker([43.7688, -79.5067], sakura_icon).bindPopup(sakura_video_popup, {maxWidth : 640}).bindTooltip('York U Sakura', {direction: 'right'}); 1447 1448 1449 sakura_layer_group.addLayer(sakura_marker); 1450 1451 1452 sakura_icon = {icon: 1453L.icon({ 1454 iconUrl: 'images/cherry_blossom_tree.gif', 1455 iconSize: [64, 48], // size of the icon 1456 iconAnchor: [16, 12], 1457 popupAnchor: [16, 0] 1458 }) 1459}; 1460 1461 sakura_video_embed_code = '<iframe width="640" height="360" src="https://youtube.be/embed/Fo_lD1Zou6E" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>'; 1462 sakura_video_popup = '<div><font size="4"><a href="https://bartman905.wordpress.com/2011/05/13/cherry-blossoms-jccc/" target="_blank">JCCC Sakura</a>🌸</font></div><br />' + sakura_video_embed_code; 1463 1464 sakura_marker = L.marker([43.7258, -79.335], sakura_icon).bindPopup(sakura_video_popup, {maxWidth : 640}).bindTooltip('JCCC Sakura', {direction: 'right'}); 1465 1466 1467 sakura_layer_group.addLayer(sakura_marker); 1468 1469 1470 1471// BookStores: 1472var bk_icon = ""; 1473var bk_marker = null; 1474 1475 1476 1477 bk_icon = {icon: 1478L. 1479 1480icon 1481 1482({ 1483 1484 1485 iconUrl: 'http://www.acadiabooks.com/favicon.ico', 1486 iconSize: [16, 16], 1487 iconAnchor: [-8, -8], 1488 popupAnchor: [16, 4] 1489 1490 }) 1491} 1492 // .addTo(mymap) 1493 bk_marker = L.marker([43.6545, -79.3685], bk_icon).bindPopup( 1494 1495 1496 '<img width="16" src="http://www.acadiabooks.com/favicon.ico">' 1497 1498 + " <a target='_blank' rel='nofollow' href='http://www.acadiabooks.com'>Arcadia Bookstore</a><br>A selection of art books, including monographs, photography, architecture and original graphics. Specializes in out-of-print and antiquarian books." 1499 ); 1500 1501 bk_layer_group.addLayer(bk_marker); 1502 1503 1504 bk_icon = {icon: 1505L. 1506 1507icon 1508 1509({ 1510 1511 1512 iconUrl: 'https://www.anotherstory.ca/i/1157949/favicon.jpg', 1513 iconSize: [16, 16], 1514 iconAnchor: [-8, -8], 1515 popupAnchor: [16, 4] 1516 1517 }) 1518} 1519 // .addTo(mymap) 1520 bk_marker = L.marker([43.648175, -79.44967], bk_icon).bindPopup( 1521 1522 1523 '<img width="16" src="https://www.anotherstory.ca/i/1157949/favicon.jpg">' 1524 1525 + " <a target='_blank' rel='nofollow' href='http://www.anotherstory.ca'>Another Story Bookshop</a><br>Selling books for children and adults with an emphasis on social justice, equity and diversity." 1526 ); 1527 1528 bk_layer_group.addLayer(bk_marker); 1529 1530 1531 bk_icon = {icon: 1532L. 1533 1534divIcon 1535 1536({ 1537 1538 1539 html: "<span style='font-size: 16px; line-height: normal; text-align: center; padding: 70px 0; margin: auto;'>📖</span>" , 1540 className: "dummy", 1541 iconSize: [18, 18], 1542 iconAnchor: [-9, -9], 1543 popupAnchor: [18, 4] 1544 1545 }) 1546} 1547 // .addTo(mymap) 1548 bk_marker = L.marker([43.718166, -79.391038], bk_icon).bindPopup( 1549 1550 1551 '📖' 1552 1553 + " <a target='_blank' rel='nofollow' href='http://www.atticus-books.com'>Atticus Books</a><br>Selling books for children and adults with an emphasis on social justice, equity and diversity." 1554 ); 1555 1556 bk_layer_group.addLayer(bk_marker); 1557 1558 1559 bk_icon = {icon: 1560L. 1561 1562icon 1563 1564({ 1565 1566 1567 iconUrl: 'https://bakkaphoenixbooks.com/i/1684035/favicon.png', 1568 iconSize: [16, 16], 1569 iconAnchor: [-8, -8], 1570 popupAnchor: [16, 4] 1571 1572 }) 1573} 1574 // .addTo(mymap) 1575 bk_marker = L.marker([43.662937, -79.403347], bk_icon).bindPopup( 1576 1577 1578 '<img width="16" src="https://bakkaphoenixbooks.com/i/1684035/favicon.png">' 1579 1580 + " <a target='_blank' rel='nofollow' href='https://bakkaphoenixbooks.com/'>Bakka-Phoenix</a><br>Science fiction specialty bookstore. Includes new releases, staff information, hours of operation and contact details, reviews, news, and location." 1581 ); 1582 1583 bk_layer_group.addLayer(bk_marker); 1584 1585 1586 bk_icon = {icon: 1587L. 1588 1589divIcon 1590 1591({ 1592 1593 1594 html: "<span style='font-size: 16px; line-height: normal; text-align: center; padding: 70px 0; margin: auto;'>📖</span>" , 1595 className: "dummy", 1596 iconSize: [18, 18], 1597 iconAnchor: [-9, -9], 1598 popupAnchor: [18, 4] 1599 1600 }) 1601} 1602 // .addTo(mymap) 1603 bk_marker = L.marker([43.65646, -79.40876], bk_icon).bindPopup( 1604 1605 1606 '📖' 1607 1608 + " <a target='_blank' rel='nofollow' href='http://balfourbooks.squarespace.com/'>Balfour Books</a><br>Second-hand bookstore for art, history, photography, design, cooking, children's books, philosophy and fiction." 1609 ); 1610 1611 bk_layer_group.addLayer(bk_marker); 1612 1613 1614 bk_icon = {icon: 1615L. 1616 1617divIcon 1618 1619({ 1620 1621 1622 html: "<span style='font-size: 16px; line-height: normal; text-align: center; padding: 70px 0; margin: auto;'>📖</span>" , 1623 className: "dummy", 1624 iconSize: [18, 18], 1625 iconAnchor: [-9, -9], 1626 popupAnchor: [18, 4] 1627 1628 }) 1629} 1630 // .addTo(mymap) 1631 bk_marker = L.marker([43.66582, -79.4068], bk_icon).bindPopup( 1632 1633 1634 '📖' 1635 1636 + " <a target='_blank' rel='nofollow' href='http://www.bmvbooks.com/'>BMV Books</a><br>Offers a variety of used and new books, CD, DVD, vinyl records at affordable prices." 1637 ); 1638 1639 bk_layer_group.addLayer(bk_marker); 1640 1641 1642 bk_icon = {icon: 1643L. 1644 1645divIcon 1646 1647({ 1648 1649 1650 html: "<span style='font-size: 16px; line-height: normal; text-align: center; padding: 70px 0; margin: auto;'>📖</span>" , 1651 className: "dummy", 1652 iconSize: [18, 18], 1653 iconAnchor: [-9, -9], 1654 popupAnchor: [18, 4] 1655 1656 }) 1657} 1658 // .addTo(mymap) 1659 bk_marker = L.marker([43.668696, -79.395017], bk_icon).bindPopup( 1660 1661 1662 '📖' 1663 1664 + " <a target='_blank' rel='nofollow' href='http://bobmillerbookroom.com/'>Bob Miller Book Room</a><br>Toronto's centrally located Academic Book Store specializing in the Humanities & Social Sciences. Serving the Academic Community for over 35 years." 1665 ); 1666 1667 bk_layer_group.addLayer(bk_marker); 1668 1669 1670 bk_icon = {icon: 1671L. 1672 1673divIcon 1674 1675({ 1676 1677 1678 html: "<span style='font-size: 16px; line-height: normal; text-align: center; padding: 70px 0; margin: auto;'>📖</span>" , 1679 className: "dummy", 1680 iconSize: [18, 18], 1681 iconAnchor: [-9, -9], 1682 popupAnchor: [18, 4] 1683 1684 }) 1685} 1686 // .addTo(mymap) 1687 bk_marker = L.marker([43.65741, -79.402], bk_icon).bindPopup( 1688 1689 1690 '📖' 1691 1692 + " <a target='_blank' rel='nofollow' href='http://www.beguilingbooksandart.com/'>The Beguiling</a><br>Retailing comics and related culture. Showcasing alternative, underground and avant-garde graphic story telling." 1693 ); 1694 1695 bk_layer_group.addLayer(bk_marker); 1696 1697 1698 bk_icon = {icon: 1699L. 1700 1701icon 1702 1703({ 1704 1705 1706 iconUrl: 'https://benmcnallybooks.com/wp-content/uploads/2017/01/cropped-Faviconben-32x32.png', 1707 iconSize: [16, 16], 1708 iconAnchor: [-8, -8], 1709 popupAnchor: [16, 4] 1710 1711 }) 1712} 1713 // .addTo(mymap) 1714 bk_marker = L.marker([43.650816, -79.381326], bk_icon).bindPopup( 1715 1716 1717 '<img width="16" src="https://benmcnallybooks.com/wp-content/uploads/2017/01/cropped-Faviconben-32x32.png">' 1718 1719 + " <a target='_blank' rel='nofollow' href='https://benmcnallybooks.com/'>Ben McNally Books</a><br>A spacious bookstore in downtown Toronto. Has regular events and book reviews." 1720 ); 1721 1722 bk_layer_group.addLayer(bk_marker); 1723 1724 1725 bk_icon = {icon: 1726L. 1727 1728divIcon 1729 1730({ 1731 1732 1733 html: "<span style='font-size: 16px; line-height: normal; text-align: center; padding: 70px 0; margin: auto;'>📖</span>" , 1734 className: "dummy", 1735 iconSize:
1735 [18, 18], 1736 iconAnchor: [-9, -9], 1737 popupAnchor: [18, 4] 1738 1739 }) 1740} 1741 // .addTo(mymap) 1742 bk_marker = L.marker([43.67775, -79.35288], bk_icon).bindPopup( 1743 1744 1745 '📖' 1746 1747 + " <a target='_blank' rel='nofollow' href='http://www.bookcity.ca/'>Book City</a><br>Independent bookseller with several outlets in Toronto." 1748 ); 1749 1750 bk_layer_group.addLayer(bk_marker); 1751 1752 1753 bk_icon = {icon: 1754L. 1755 1756icon 1757 1758({ 1759 1760 1761 iconUrl: 'http://www.contacteditions.ca/.control/favicon.ico', 1762 iconSize: [16, 16], 1763 iconAnchor: [-8, -8], 1764 popupAnchor: [16, 4] 1765 1766 }) 1767} 1768 // .addTo(mymap) 1769 bk_marker = L.marker([43.677763, -79.406394], bk_icon).bindPopup( 1770 1771 1772 '<img width="16" src="http://www.contacteditions.ca/.control/favicon.ico">' 1773 1774 + " <a target='_blank' rel='nofollow' href='http://www.contacteditions.ca/'>Contact Editions</a><br>Used book store, specializing in rare and used books on art, history, literature, and the humanities." 1775 ); 1776 1777 bk_layer_group.addLayer(bk_marker); 1778 1779 1780 bk_icon = {icon: 1781L. 1782 1783icon 1784 1785({ 1786 1787 1788 iconUrl: 'http://www.davidmasonbooks.com/favicon.ico', 1789 iconSize: [16, 16], 1790 iconAnchor: [-8, -8], 1791 popupAnchor: [16, 4] 1792 1793 }) 1794} 1795 // .addTo(mymap) 1796 bk_marker = L.marker([43.647133, -79.394308], bk_icon).bindPopup( 1797 1798 1799 '<img width="16" src="http://www.davidmasonbooks.com/favicon.ico">' 1800 1801 + " <a target='_blank' rel='nofollow' href='http://www.davidmasonbooks.com/'>David Mason Books</a><br>A vintage bookstore with many rare first edition books." 1802 ); 1803 1804 bk_layer_group.addLayer(bk_marker); 1805 1806 1807 bk_icon = {icon: 1808L. 1809 1810icon 1811 1812({ 1813 1814 1815 iconUrl: 'https://www.adifferentbooklist.com/i/1188585/favicon.jpg', 1816 iconSize: [16, 16], 1817 iconAnchor: [-8, -8], 1818 popupAnchor: [16, 4] 1819 1820 }) 1821} 1822 // .addTo(mymap) 1823 bk_marker = L.marker([43.664478, -79.410787], bk_icon).bindPopup( 1824 1825 1826 '<img width="16" src="https://www.adifferentbooklist.com/i/1188585/favicon.jpg">' 1827 1828 + " <a target='_blank' rel='nofollow' href='https://www.adifferentbooklist.com/'>A Different Booklist</a><br>Bookstore with a focus on African and Caribbean literature." 1829 ); 1830 1831 bk_layer_group.addLayer(bk_marker); 1832 1833 1834 bk_icon = {icon: 1835L. 1836 1837icon 1838 1839({ 1840 1841 1842 iconUrl: 'https://cdn.shopify.com/s/files/1/0999/9684/t/2/assets/favicon.png', 1843 iconSize: [16, 16], 1844 iconAnchor: [-8, -8], 1845 popupAnchor: [16, 4] 1846 1847 }) 1848} 1849 // .addTo(mymap) 1850 bk_marker = L.marker([43.653941, -79.425368], bk_icon).bindPopup( 1851 1852 1853 '<img width="16" src="https://cdn.shopify.com/s/files/1/0999/9684/t/2/assets/favicon.png">' 1854 1855 + " <a target='_blank' rel='nofollow' href='https://faithvoidshop.com/'>FAITH / VOID</a><br>Subculture shop specializing in vinyl records, cassettes, zines, comics, printed matter and soft goods." 1856 ); 1857 1858 bk_layer_group.addLayer(bk_marker); 1859 1860 1861 bk_icon = {icon: 1862L. 1863 1864icon 1865 1866({ 1867 1868 1869 iconUrl: 'https://www.flyingbooks.ca/favicon.ico', 1870 iconSize: [16, 16], 1871 iconAnchor: [-8, -8], 1872 popupAnchor: [16, 4] 1873 1874 }) 1875} 1876 // .addTo(mymap) 1877 bk_marker = L.marker([43.64376, -79.42185], bk_icon).bindPopup( 1878 1879 1880 '<img width="16" src="https://www.flyingbooks.ca/favicon.ico">' 1881 1882 + " <a target='_blank' rel='nofollow' href='https://www.flyingbooks.ca/'>Flying Books</a><br>A small bookstore with a limited selection of specially chosen books. Each book is comes labeled with a helpful staff review." 1883 ); 1884 1885 bk_layer_group.addLayer(bk_marker); 1886 1887 1888 bk_icon = {icon: 1889L. 1890 1891icon 1892 1893({ 1894 1895 1896 iconUrl: 'https://cdn.shopify.com/s/files/1/0220/8638/t/5/assets/logo.png', 1897 iconSize: [16, 16], 1898 iconAnchor: [-8, -8], 1899 popupAnchor: [16, 4] 1900 1901 }) 1902} 1903 // .addTo(mymap) 1904 bk_marker = L.marker([43.665219, -79.380589], bk_icon).bindPopup( 1905 1906 1907 '<img width="16" src="https://cdn.shopify.com/s/files/1/0220/8638/t/5/assets/logo.png">' 1908 1909 + " <a target='_blank' rel='nofollow' href='https://www.gladdaybookshop.com/'>Glad Day Bookshop</a><br>Lesbian, Gay, Bi, Trans and Queer Bookstore." 1910 ); 1911 1912 bk_layer_group.addLayer(bk_marker); 1913 1914 1915 bk_icon = {icon: 1916L. 1917 1918divIcon 1919 1920({ 1921 1922 1923 html: "<span style='font-size: 16px; line-height: normal; text-align: center; padding: 70px 0; margin: auto;'>📖</span>" , 1924 className: "dummy", 1925 iconSize: [18, 18], 1926 iconAnchor: [-9, -9], 1927 popupAnchor: [18, 4] 1928 1929 }) 1930} 1931 // .addTo(mymap) 1932 bk_marker = L.marker([43.67642, -79.408092], bk_icon).bindPopup( 1933 1934 1935 '📖' 1936 1937 + " <a target='_blank' rel='nofollow' href='http://www.ansoncartwright.com/'>Hugh Anson-Cartwright</a><br>Antiquarian bookseller. Books, maps and prints." 1938 ); 1939 1940 bk_layer_group.addLayer(bk_marker); 1941 1942 1943 bk_icon = {icon: 1944L. 1945 1946divIcon 1947 1948({ 1949 1950 1951 html: "<span style='font-size: 16px; line-height: normal; text-align: center; padding: 70px 0; margin: auto;'>📖</span>" , 1952 className: "dummy", 1953 iconSize: [18, 18], 1954 iconAnchor: [-9, -9], 1955 popupAnchor: [18, 4] 1956 1957 }) 1958} 1959 // .addTo(mymap) 1960 bk_marker = L.marker([43.66029, -79.432708], bk_icon).bindPopup( 1961 1962 1963 '📖' 1964 1965 + " <a target='_blank' rel='nofollow' href='http://www.monkeyspaw.com/'>The Monkey's Paw</a><br>Books and curiousities. Secondhand bookshop specializing in uncommon scholarly and out-of-print books, ephemera, manual typewriters, biological specimens." 1966 ); 1967 1968 bk_layer_group.addLayer(bk_marker); 1969 1970 1971 bk_icon = {icon: 1972L. 1973 1974icon 1975 1976({ 1977 1978 1979 iconUrl: 'https://novelspot.ca/i/7604122/favicon.png', 1980 iconSize: [16, 16], 1981 iconAnchor: [-8, -8], 1982 popupAnchor: [16, 4] 1983 1984 }) 1985} 1986 // .addTo(mymap) 1987 bk_marker = L.marker([43.661782, -79.519827], bk_icon).bindPopup( 1988 1989 1990 '<img width="16" src="https://novelspot.ca/i/7604122/favicon.png">' 1991 1992 + " <a target='_blank' rel='nofollow' href='https://novelspot.ca/'>A Novel Spot Bookshop</a><br>Bookshop with a selection of bios, mysteries, classics, cookbooks, history, and children's books." 1993 ); 1994 1995 bk_layer_group.addLayer(bk_marker); 1996 1997 1998 bk_icon = {icon: 1999L. 2000 2001icon 2002 2003({ 2004 2005 2006 iconUrl: 'https://cdn.shopify.com/s/files/1/1127/8710/t/2/assets/favicon.png', 2007 iconSize: [16, 16], 2008 iconAnchor: [-8, -8], 2009 popupAnchor: [16, 4] 2010 2011 }) 2012} 2013 // .addTo(mymap) 2014 bk_marker = L.marker([43.671695, -79.387207], bk_icon).bindPopup( 2015 2016 2017 '<img width="16" src="https://cdn.shopify.com/s/files/1/1127/8710/t/2/assets/favicon.png">' 2018 2019 + " <a target='_blank' rel='nofollow' href='https://page-panel.mysh
2019opify.com/'>Page & Panel</a><br>A comics, graphic novels and original artwork store." 2020 ); 2021 2022 bk_layer_group.addLayer(bk_marker); 2023 2024 2025 bk_icon = {icon: 2026L. 2027 2028divIcon 2029 2030({ 2031 2032 2033 html: "<span style='font-size: 16px; line-height: normal; text-align: center; padding: 70px 0; margin: auto;'>📖</span>" , 2034 className: "dummy", 2035 iconSize: [18, 18], 2036 iconAnchor: [-9, -9], 2037 popupAnchor: [18, 4] 2038 2039 }) 2040} 2041 // .addTo(mymap) 2042 bk_marker = L.marker([43.66566, -79.46694], bk_icon).bindPopup( 2043 2044 2045 '📖' 2046 2047 + " <a target='_blank' rel='nofollow' href='http://pandemonium.ca/blog/about/'>Pandemonium</a><br>Sells used and new books, CD, DVD, vinyl records." 2048 ); 2049 2050 bk_layer_group.addLayer(bk_marker); 2051 2052 2053 bk_icon = {icon: 2054L. 2055 2056icon 2057 2058({ 2059 2060 2061 iconUrl: 'https://cdn.shopify.com/s/files/1/2000/1583/files/logo_32x32.png', 2062 iconSize: [16, 16], 2063 iconAnchor: [-8, -8], 2064 popupAnchor: [16, 4] 2065 2066 }) 2067} 2068 // .addTo(mymap) 2069 bk_marker = L.marker([43.656848, -79.380988], bk_icon).bindPopup( 2070 2071 2072 '<img width="16" src="https://cdn.shopify.com/s/files/1/2000/1583/files/logo_32x32.png">' 2073 2074 + " <a target='_blank' rel='nofollow' href='https://www.silversnail.com/'>Silver Snail Comics</a><br>Comic book and action figure store. Also sells some merchandise online." 2075 ); 2076 2077 bk_layer_group.addLayer(bk_marker); 2078 2079 2080 bk_icon = {icon: 2081L. 2082 2083icon 2084 2085({ 2086 2087 2088 iconUrl: 'https://sleuthofbakerstreet.ca/i/1584200/favicon.png', 2089 iconSize: [16, 16], 2090 iconAnchor: [-8, -8], 2091 popupAnchor: [16, 4] 2092 2093 }) 2094} 2095 // .addTo(mymap) 2096 bk_marker = L.marker([43.702988, -79.363913], bk_icon).bindPopup( 2097 2098 2099 '<img width="16" src="https://sleuthofbakerstreet.ca/i/1584200/favicon.png">' 2100 2101 + " <a target='_blank' rel='nofollow' href='https://sleuthofbakerstreet.ca/'>Sleuth of Baker Street</a><br>Book store offering new and out-of-print, American, British, and Canadian mysteries. Includes bestsellers, newsletter, recommended reading, and dates of author signing events." 2102 ); 2103 2104 bk_layer_group.addLayer(bk_marker); 2105 2106 2107 bk_icon = {icon: 2108L. 2109 2110icon 2111 2112({ 2113 2114 2115 iconUrl: 'https://www.steventemplebooks.com/wp-content/uploads/2017/04/cropped-logo0-32x32.jpg', 2116 iconSize: [16, 16], 2117 iconAnchor: [-8, -8], 2118 popupAnchor: [16, 4] 2119 2120 }) 2121} 2122 // .addTo(mymap) 2123 bk_marker = L.marker([42.98296, -79.23515], bk_icon).bindPopup( 2124 2125 2126 '<img width="16" src="https://www.steventemplebooks.com/wp-content/uploads/2017/04/cropped-logo0-32x32.jpg">' 2127 2128 + " <a target='_blank' rel='nofollow' href='https://www.steventemplebooks.com/'>Steven Temple Books</a><br>Dealing in fine and rare books for collectors and libraries in Canadian literature, mystery, juvenile, non-fiction and antiquarian books in various fields." 2129 ); 2130 2131 bk_layer_group.addLayer(bk_marker); 2132 2133 2134 bk_icon = {icon: 2135L. 2136 2137icon 2138 2139({ 2140 2141 2142 iconUrl: 'http://swipe.com/favicon.ico', 2143 iconSize: [16, 16], 2144 iconAnchor: [-8, -8], 2145 popupAnchor: [16, 4] 2146 2147 }) 2148} 2149 // .addTo(mymap) 2150 bk_marker = L.marker([43.647847, -79.394372], bk_icon).bindPopup( 2151 2152 2153 '<img width="16" src="http://swipe.com/favicon.ico">' 2154 2155 + " <a target='_blank' rel='nofollow' href='http://swipe.com/'>Swipe</a><br>Selling books on advertising and design." 2156 ); 2157 2158 bk_layer_group.addLayer(bk_marker); 2159 2160 2161 bk_icon = {icon: 2162L. 2163 2164divIcon 2165 2166({ 2167 2168 2169 html: "<span style='font-size: 16px; line-height: normal; text-align: center; padding: 70px 0; margin: auto;'>📖</span>" , 2170 className: "dummy", 2171 iconSize: [18, 18], 2172 iconAnchor: [-9, -9], 2173 popupAnchor: [18, 4] 2174 2175 }) 2176} 2177 // .addTo(mymap) 2178 bk_marker = L.marker([43.6455, -79.41155], bk_icon).bindPopup( 2179 2180 2181 '📖' 2182 2183 + " <a target='_blank' rel='nofollow' href='https://typebooks.ca/'>TYPE Books</a><br>Bookstore with a focus on local artists, design, cooking and arts-and-crafts." 2184 ); 2185 2186 bk_layer_group.addLayer(bk_marker); 2187 2188 2189 bk_icon = {icon: 2190L. 2191 2192icon 2193 2194({ 2195 2196 2197 iconUrl: 'http://zoinks.ca/blog/wp-content/uploads/2015/12/cropped-logo_512-32x32.png', 2198 iconSize: [16, 16], 2199 iconAnchor: [-8, -8], 2200 popupAnchor: [16, 4] 2201 2202 }) 2203} 2204 // .addTo(mymap) 2205 bk_marker = L.marker([43.660702, -79.430964], bk_icon).bindPopup( 2206 2207 2208 '<img width="16" src="http://zoinks.ca/blog/wp-content/uploads/2015/12/cropped-logo_512-32x32.png">' 2209 2210 + " <a target='_blank' rel='nofollow' href='http://zoinks.ca/blog/'>Zoinks Music and Books</a><br>Sells used books, CDs, LPs and DVDs." 2211 ); 2212 2213 bk_layer_group.addLayer(bk_marker); 2214 2215 2216 // .addTo(mymap) 2217 bk_marker = L.marker(bk_10_latlong, {icon:bk_10Icon}).bindPopup('💔 <a href="https://thevarsity.ca/2019/01/27/from-ten-editions-to-none-its-a-loss-to-the-city/">Ten Editions</a><br>Ten Editions closed at the end of last year.<br>No thanks to U of T.'); 2218 2219 bk_layer_group.addLayer(bk_marker); 2220 2221 // Shops: 2222 var shop_icon = ""; 2223 var shop_marker = null; 2224 2225 var shop_1_name = 'Mika'; 2226 var shop_1_url = 'https://www.mikafleur.com/'; 2227 2228 var shop_1_latlong = [43.649737,-79.434793]; // 📖 2229 var shop_1Icon = L.icon({
2230 iconUrl: 'https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcT2ywl354CuDdA9L8QIGXGIvK_IFXPdi40z-GgSasU8tF7Ai95a', 2231 className: "icon_box bg_white", 2232 iconSize: [16, 16], // size of the icon 2233 iconAnchor: [-8, -8], 2234 popupAnchor: [16, 4] 2235 }); 2236 2237 shop_marker = L.marker(shop_1_latlong, {icon:shop_1Icon}).bindPopup('<div class="vmiddle"><img src="https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcT2ywl354CuDdA9L8QIGXGIvK_IFXPdi40z-GgSasU8tF7Ai95a" width="32" /> <a href="https://mikafleur.weebly.com/" target="_blank"><font size="5">MIKA</font></a></div>Mika offers her unique design skills in both floristry and pottery<br /><iframe width="640" height="360" src="https://www.youtube.com/embed/UuaM44TpA9o" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>', 2238 {maxWidth : 640}); 2239 2240 shop_layer_group.addLayer(shop_marker); 2241 2242//----------------- 2243// comfeeliving 2244// https://www.comfeeliving.com - interiors - pillows - Grimsby, Ontario, Canada [43.1929, -79.5621] 2245 2246 var shop_2_name = 'Comfee Cushions'; 2247 var shop_2_url = 'https://www.comfeeliving.com/'; 2248 var shop_2_latlong = [43.1929, -79.5621]; // 📖 2249 var shop_2Icon = L.icon({ 2250 iconUrl: 'https://cdn.shopify.com/s/files/1/0272/4053/0033/files/CL_Button_RGB_32x32.jpg', 2251 className: "icon_box", 2252 iconSize: [16, 16], // size of the icon 2253 iconAnchor: [-8, -8], 2254 popupAnchor: [16, 4] 2255 }); 2256 2257 var shop_2_blog_url = 'https://tenatch.ca/2020/04/21/blood-circulation-cushions-promote-health-benefits/'; 2258 var shop_2_meta_json = { site_name: "Tenatch", image: "https://tenatch.ca/wp-content/uploads/2020/07/comfee.jpeg", "image:width": "600", "image:height": "600", description: "Kerri-Lee Benson began her entrepreneurial journey at a garage sale, discovering a mechanism to improve her blood circulation cushions.", type: "article", title: "Blood Circulation Cushions Promote Health Benefits - Tenatch", locale: "en_US", url: "https://tenatch.ca/2020/04/21/blood-circulation-cushions-promote-health-benefits/" }; 2259 var shop_2_description = 'In 2009, Kerri-Lee stumbled across the device now used in comfee cushion. As a creative opportunist, she immediately saw the value in it, and redesigned the application into what is now the Comfee Cushion.' 2260 2261 shop_marker = L.marker(shop_2_latlong, {icon:shop_2Icon}) 2262 .bindPopup('<div><img src="' + shop_2Icon.options.iconUrl + '" height="20" /> <a href="' + shop_2_url + '" target="_blank"><font size="5">' + shop_2_name + '</font></a></div>' + shop_2_description + '<center><a href="' + shop_2_meta_json.url + '" target="_blank"><img src="' + shop_2_meta_json.image + '" class="sns_img" /></a><br />' + shop_2_meta_json.description + ' <a href="' + shop_2_meta_json.url + '" target="_blank">#MORE</a></center>', 2263 {maxWidth : 560}); 2264 2265 shop_layer_group.addLayer(shop_marker); 2266 2267//----------------- 2268// ShawnPaulThompsonArt 2269// https://shawnpaulthompsonart.myshopify.com/ - art - painting - Parkdale [43.6404, -79.4372] 2270 2271 var shop_3_name = 'ShawnPaulThompsonArt'; 2272 var shop_3_url = 'https://shawnpaulthompsonart.myshopify.com/'; 2273 var shop_3_latlong = [43.6677, -79.3554]; // 📖 2274 var shop_3Icon = L.icon({ 2275 iconUrl: 'https://cdn.shopify.com/s/files/1/0413/8064/2969/files/sptlogo_120x.png', 2276 //className: "icon_box", 2277 iconSize: [16, 16], // size of the icon 2278 iconAnchor: [-8, -8], 2279 popupAnchor: [16, 4] 2280 }); 2281 2282 shop_marker = L.marker(shop_3_latlong, {icon:shop_3Icon}).bindPopup('<div><img src="' + shop_3Icon.options.iconUrl + '" width="20" /> <a href="' + shop_3_url + '" target="_blank"><font size="5">' + shop_3_name + '</font></a></div>He is an Abstract Contemporary Painter working in Acrylic and Mixed Mediums. His process begins in layered applications which are peeled back to reveal an abstract story, feeling or world. His palette knife and brush are his preferred tools which allow him to construct, deconstruct, and reveal a hidden narrative.<br />', 2283 {maxWidth : 560}); 2284 2285 shop_layer_group.addLayer(shop_marker); 2286 2287//----------------- 2288// The Chemist Tree 2289// https://chemisttree.com - gifts - t-shirts, cards, tote bags - Milton, Ontario, Canada [43.5130 -79.8826] 2290 2291 var shop_4_name = 'The Chemist Tree'; 2292 var shop_4_url = 'https://chemisttree.com'; 2293 var shop_4_latlong = [43.5130, -79.8826]; // 📖 2294 var shop_4Icon = L.icon({ 2295 iconUrl: 'https://cdn.shopify.com/s/files/1/0746/3217/t/20/assets/favicon.png', 2296 className: "icon_box", 2297 iconSize: [16, 16], // size of the icon 2298 iconAnchor: [-8, -8], 2299 popupAnchor: [16, 4] 2300 }); 2301
2302 var shop_4_blog_url = 'https://tenatch.ca/2020/04/12/chemistry-cards-for-the-science-lover-in-all-of-us/'; 2303 var shop_4_meta_json = { site_name: "Tenatch", image: "https://tenatch.ca/wp-content/uploads/2020/07/chemist.jpeg", "image:width": "600", "image:height": "600", description: "When science and art collaborate, amazing things happen. Rovena studied science, but art is her passion. Learn about her chemistry cards!", type: "article", title: "Chemistry Cards For Any Occasion - Tenatch", locale: "en_US", url: "https://tenatch.ca/2020/04/12/chemistry-cards-for-the-science-lover-in-all-of-us/" }; 2304 var shop_4_description = 'The Chemist Tree is a collection of fun chemistry-inspired handmade goods including greeting cards, posters, pin-back buttons, tote bags and more.' 2305 2306 shop_marker = L.marker(shop_4_latlong, {icon:shop_4Icon}) 2307 .bindPopup('<div><img src="' + shop_4Icon.options.iconUrl + '" height="20" /> <a href="' + shop_4_url + '" target="_blank"><font size="5">' + shop_4_name + '</font></a></div>' + shop_4_description + '<center><a href="' + shop_4_meta_json.url + '" target="_blank"><img src="' + shop_4_meta_json.image + '" class="sns_img" /></a><br />' + shop_4_meta_json.description + ' <a href="' + shop_4_meta_json.url + '" target="_blank">#MORE</a></center>', 2308 {maxWidth : 560}); 2309 2310 shop_layer_group.addLayer(shop_marker); 2311 2312//----------------- 2313// Catalina Sánchez 2314// https://catalinasanchez.ca - stationary - notebooks - Yonge[43.6598, -79.3838] 2315 2316 var shop_5_name = 'Catalina Sanchez'; 2317 var shop_5_url = 'https://catalinasanchez.ca'; 2318 var shop_5_latlong = [43.6437, -79.3746]; // 📖 2319 var shop_5Icon = L.icon({ 2320 iconUrl: 'https://cdn.shopify.com/s/files/1/0259/3836/2467/files/Asset_5_32x32.png', 2321 className: "icon_box", 2322 iconSize: [16, 16], // size of the icon 2323 iconAnchor: [-8, -8], 2324 popupAnchor: [16, 4] 2325 }); 2326 2327 var shop_5_blog_url = 'https://tenatch.ca/2020/06/16/catalina-sanchez-notebooks-are-perfect-for-you/'; 2328 var shop_5_meta_json = { site_name: "Tenatch", image: "https://tenatch.ca/wp-content/uploads/2020/07/notebooks.jpeg", "image:width": "540", "image:height": "540", description: "Catalina Sanchez notebooks fully embrace the fascination with durable, physical storage spaces for our most prized possessions: our words", type: "article", title: "Catalina Sanchez Notebooks Are Perfect For You! - Tenatch", locale: "en_US", url: "https://tenatch.ca/2020/06/16/catalina-sanchez-notebooks-are-perfect-for-you/" }; 2329 var shop_5_description = 'Catalina Sanchez is a brand of handmade notebooks entirely made by hand. Handcrafted in Toronto with locally-sourced materials. We believe that the most fabulou
2329s ideas come from a notebook and a pen and that feeling is also an inspiration for us.' 2330 2331 shop_marker = L.marker(shop_5_latlong, {icon:shop_5Icon}) 2332 .bindPopup('<div><img src="' + shop_5Icon.options.iconUrl + '" height="20" /> <a href="' + shop_5_url + '" target="_blank"><font size="5">' + shop_5_name + '</font></a></div>' + shop_5_description + '<center><a href="' + shop_5_meta_json.url + '" target="_blank"><img src="' + shop_5_meta_json.image + '" class="sns_img" /></a><br />' + shop_5_meta_json.description + ' <a href="' + shop_5_meta_json.url + '" target="_blank">#MORE</a></center>', 2333 {maxWidth : 560}); 2334 2335 shop_layer_group.addLayer(shop_marker); 2336 2337//----------------- 2338// More Than Lips 2339// https://morethanlips.net - skin care - lip balm - Chinatown [43.6526, -79.3979] 2340 2341 var shop_6_name = 'More Than Lips'; 2342 var shop_6_url = 'https://morethanlips.net'; 2343 var shop_6_latlong = [43.6495, -79.395]; // 📖 2344 var shop_6Icon = L.icon({ 2345 iconUrl: 'https://cdn.shopify.com/s/files/1/0278/9372/7303/files/Untitled_design_100x100.png', 2346 className: "icon_box bg_white", 2347 iconSize: [16, 16], // size of the icon 2348 iconAnchor: [-8, -8], 2349 popupAnchor: [16, 4] 2350 }); 2351 2352 // https://cdn.shopify.com/s/files/1/0278/9372/7303/files/MTL_Logo_7_360x.png 2353 2354 var shop_6_blog_url = 'https://tenatch.ca/2020/05/12/this-lip-balm-is-about-more-than-lips/'; 2355 var shop_6_meta_json = { site_name: "Tenatch", image: "https://tenatch.ca/wp-content/uploads/2020/07/lips.jpeg", "image:width": "628", "image:height": "314", description: "Time to open up the kissing booth? If it is, Jessica and her company More Than Lips lip balm will get your lips ready for the big event.", type: "article", title: "This Lip Balm Is About More Than Lips - Tenatch", locale: "en_US", url: "https://tenatch.ca/2020/05/12/this-lip-balm-is-about-more-than-lips/" }; 2356 2357 //.bindPopup('<div><img src="' + shop_6Icon.options.iconUrl + '" height="20" /> <a href="' + shop_6_url + '" target="_blank"><font size="5">' + shop_6_name + '</font></a></div>More Than Lips is dedicated to a simple yet powerful approach, using only ethically sourced and sustainable ingredients with no animal products, by-products, or testing, we can change the way people care for their lips, for themselves and for the planet.<br />', 2358 2359 shop_marker = L.marker(shop_6_latlong, {icon:shop_6Icon}) 2360 .bindPopup('<div><img src="' + shop_6Icon.options.iconUrl + '" height="20" /> <a href="' + shop_6_url + '" target="_blank"><font size="5">' + shop_6_name + '</font></a></div>More Than Lips is dedicated to a simple yet powerful approach, using only ethically sourced and sustainable ingredients with no animal products, by-products, or testing, we can change the way people care for their lips, for themselves and for the planet.<center><a href="' + shop_6_meta_json.url + '" target="_blank"><img src="' + shop_6_meta_json.image + '" class="sns_img" /></a><br />' + shop_6_meta_json.description + ' <a href="' + shop_6_meta_json.url + '" target="_blank">#MORE</a></center>', 2361 {maxWidth : 560}); 2362 2363 shop_layer_group.addLayer(shop_marker); 2364 2365 // videos: 2366 var video_icon = ""; 2367 var video_marker = null; 2368 2369 2370 2371 2372 2373 var cne_latlong = [43.6354, -79.4186]; 2374 var cne_icon = L.icon({ 2375 iconUrl: 'https://theex.com/favicon.ico', 2376 className: "icon_box bg_white", 2377 iconSize: [16, 16], // size of the icon 2378 iconAnchor: [-8, -8], 2379 popupAnchor: [16, 4] 2380 }); 2381 2382 L.marker(cne_latlong, {icon: cne_icon}).addTo(mymap); 2383 2384 var video_name = 'CNE'; 2385 var video_url = 'https://theex.com/'; 2386 var video_latlong = [43.6354, -79.4186]; // 📖 2387 var video_title = 'Canada National Exhibition'; 2388 var video_title_img_src = 'https://ccaa.life/wp-content/uploads/2017/10/CNELogo.gif'; 2389 var video_icon = null; 2390 var video_popup = null; 2391 2392// Start Ms Pumpkin 2393 var ms_pumpkin_icon_s = L.icon({ 2394 iconUrl: 'images/ms_pumpkin.png', 2395 iconSize: [48, 36], // size of the icon 2396 iconAnchor: [6, 8], 2397 popupAnchor: [18, 0] 2398 }); 2399 2400 var ms_pumpkin_icon_m = L.icon({ 2401 iconUrl: 'images/ms_pumpkin.png', 2402 iconSize: [64, 48], // size of the icon 2403 iconAnchor: [16, 12], 2404 popupAnchor: [16, 0] 2405 }); 2406 2407 var ms_pumpkin_icon_l = L.icon({ 2408 iconUrl: 'images/ms_pumpkin.png',
2409 iconSize: [80, 60], // size of the icon 2410 iconAnchor: [22, 22], 2411 popupAnchor: [18, -12] 2412 }); 2413 2414 video_icon = ms_pumpkin_icon_m; 2415 video_latlong = [43.6342, -79.4118]; 2416 //video_embed_code = '<iframe width="640" height="360" src="https://www.youtube.com/embed/IiYDlZvwGug" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>'; 2417 video_embed_code = '<iframe width="640" height="360" scrolling="no" frameborder="0" style="border: none;" src="https://www.bitchute.com/embed/khEYCeiokj9J/"></iframe>'; 2418 video_popup = '<div class="vmiddle"><img src="' + video_title_img_src + '" width="32" /> <a href="' + video_url + '" target="_blank"><font size="5">' + video_name +'</font></a></div>' + video_title + '<br />' + video_embed_code; 2419 2420 video_marker = L.marker(video_latlong, {icon:video_icon}).bindPopup(video_popup, {maxWidth : 640}); 2421 2422 video_layer_group.addLayer(video_marker); 2423 2424// End Ms Pumpkin 2425 2426// Start Neko K 2427 var neko_k_icon_s = L.icon({ 2428 iconUrl: 'images/neko_k.png', 2429 iconSize: [48, 36], // size of the icon 2430 iconAnchor: [6, 8], 2431 popupAnchor: [18, 0] 2432 }); 2433 2434 var neko_k_icon_m = L.icon({ 2435 iconUrl: 'images/neko_k.png', 2436 iconSize: [64, 48], // size of the icon 2437 iconAnchor: [16, 12], 2438 popupAnchor: [16, 0] 2439 }); 2440 2441 var neko_k_icon_l = L.icon({ 2442 iconUrl: 'images/neko_k.png', 2443 iconSize: [80, 60], // size of the icon 2444 iconAnchor: [22, 22], 2445 popupAnchor: [18, -12] 2446 }); 2447 2448 video_icon = neko_k_icon_m; 2449 video_latlong = [43.8157, -79.3469]; 2450 video_url = 'https://jtown.ca/'; 2451 video_title_img_src = 'images/j_town.png'; 2452 2453 video_embed_code = '<iframe width="640" height="360" scrolling="no" frameborder="0" style="border: none;" src="https://www.bitchute.com/embed/9T2opH19xs80/"></iframe>'; 2454 video_popup = '<div><a href="' + video_url + '" class="no_undeline" target="_blank"><img src="' + video_title_img_src + '" height="32" /></a></div><br />' + video_embed_code; 2455 2456 video_marker = L.marker(video_latlong, {icon:video_icon}).bindPopup(video_popup, {maxWidth : 640}); 2457 2458 video_layer_group.addLayer(video_marker); 2459 2460// End Neko K 2461 2462// Start Ice Cream E 2463 var ice_cream_e_icon_s = L.icon({ 2464 iconUrl: 'images/ice_cream_e.png', 2465 iconSize: [48, 36], // size of the icon 2466 iconAnchor: [6, 8], 2467 popupAnchor: [18, 0] 2468 }); 2469 2470 var ice_cream_e_icon_m = L.icon({ 2471 iconUrl: 'images/ice_cream_e.png', 2472 iconSize: [64, 48], // size of the icon 2473 iconAnchor: [16, 12], 2474 popupAnchor: [16, 0] 2475 }); 2476 2477 var ice_cream_e_icon_l = L.icon({ 2478 iconUrl: 'images/ice_cream_e.png', 2479 iconSize: [80, 60], // size of the icon 2480 iconAnchor: [22, 22], 2481 popupAnchor: [18, -12] 2482 }); 2483 2484 video_icon = ice_cream_e_icon_m; 2485 video_latlong = [43.6316, -79.4207]; 2486 video_url = 'https://cynthiasbathlab.square.site/'; 2487 2488 video_title = 'Canada National Exhibition'; 2489 video_title_img_src = 'https://ccaa.life/wp-content/uploads/2017/10/CNELogo.gif'; 2490 2491 video_embed_code = '<iframe width="640" height="360" scrolling="no" frameborder="0" style="border: none;" src="https://www.bitchute.com/embed/lQu58mjUtJVW/"></iframe>'; 2492 video_popup = '<div><a href="' + video_url + '" class="no_undeline" target="_blank"><img src="images/cynthias_bath_lab.png" height="32" /> <img src="' + video_title_img_src + '" width="32" /></a></div><br />' + video_embed_code; 2493 2494 video_marker = L.marker(video_latlong, {icon:video_icon}).bindPopup(video_popup, {maxWidth : 640}); 2495 2496 video_layer_group.addLayer(video_marker); 2497 2498// End Ice Cream E 2499 2500// Start Ricoffee 2501// 2502 2503 var ricoffee_icon_s = L.icon({ 2504 iconUrl: 'images/ricoffee.png', 2505 iconSize: [48, 36], // size of the icon 2506 iconAnchor: [6, 8], 2507 popupAnchor: [18, 0] 2508 }); 2509 2510 var ricoffee_icon_m = L.icon({ 2511 iconUrl: 'images/ricoffee.png', 2512 iconSize: [64, 48], // size of the icon 2513 iconAnchor: [16, 12], 2514 popupAnchor: [16, 0] 2515 }); 2516 2517 var ricoffee_icon_l = L.icon({ 2518 iconUrl: 'images/ricoffee.png',
2519 iconSize: [80, 60], // size of the icon 2520 iconAnchor: [22, 22], 2521 popupAnchor: [18, -12] 2522 }); 2523 2524 video_icon = ricoffee_icon_m; 2525 video_latlong = [43.6702, -79.3919]; 2526 video_url = 'https://omusubibarsuzume.com/'; 2527 video_title_img_src = 'https://img1.wsimg.com/isteam/ip/651c1373-f9af-470a-9f53-4624c7011a4a/suzume-logo-facebook.jpeg'; 2528 2529 var og_url = 'http://tenatch.ca/2019/10/18/i-struck-gold-when-i-found-goldstruck-coffee/'; 2530 var og_title = 'I Struck Gold when I Found GoldStruck Coffee'; 2531 var og_description = 'What I love about Goldstruck Coffee is not only the tasty drinks and chocolate, but also it can be anything depending on the purpose.'; 2532 var og_image = 'https://i0.wp.com/tenatch.ca/wp-content/uploads/2022/06/eb73e-goldstruck_coffee6-scaled-1-e1640467753486.jpg'; 2533 2534 video_embed_code = '<iframe width="640" height="360" scrolling="no" frameborder="0" style="border: none;" src="https://www.bitchute.com/embed/dSc74QJgXSTY/"></iframe>'; 2535 video_popup = '<div><a href="' + og_url + '" target="_blank"><h2>' + og_title + '</h2></a><a href="' + og_url + '" target="_blank"><img src="' + og_image + '" width="480" /></a><br />' + og_description + ' <a href="' + og_url + '" target="_blank">Read Blog</a></div>'; 2536 2537 video_marker = L.marker(video_latlong, {icon:video_icon}).bindPopup(video_popup, {maxWidth : 480}); 2538 2539 video_layer_group.addLayer(video_marker); 2540 2541// End Ricoffee 2542 2543// Start Midorizaurus 2544 var midorizaurus_icon_s = L.icon({ 2545 iconUrl: 'images/midorizaurus.png', 2546 iconSize: [48, 36], // size of the icon 2547 iconAnchor: [6, 8], 2548 popupAnchor: [18, 0] 2549 }); 2550 2551 var midorizaurus_icon_m = L.icon({ 2552 iconUrl: 'images/midorizaurus.png', 2553 iconSize: [64, 48], // size of the icon 2554 iconAnchor: [16, 12], 2555 popupAnchor: [16, 0] 2556 }); 2557 2558 var midorizaurus_icon_l = L.icon({ 2559 iconUrl: 'images/midorizaurus.png', 2560 iconSize: [80, 60], // size of the icon 2561 iconAnchor: [22, 22], 2562 popupAnchor: [18, -12] 2563 }); 2564 2565 video_icon = midorizaurus_icon_m; 2566 video_latlong = [43.6522, -79.405]; 2567 video_url = 'https://omusubibarsuzume.com/'; 2568 video_title_img_src = 'https://img1.wsimg.com/isteam/ip/651c1373-f9af-470a-9f53-4624c7011a4a/suzume-logo-facebook.jpeg'; 2569 2570 video_embed_code = '<iframe width="640" height="360" scrolling="no" frameborder="0" style="border: none;" src="https://www.bitchute.com/embed/dSc74QJgXSTY/"></iframe>'; 2571 video_popup = '<div><a href="' + video_url + '" class="no_undeline" target="_blank"><img src="' + video_title_img_src + '" height="32" /></a></div><br />' + video_embed_code; 2572 2573 video_marker = L.marker(video_latlong, {icon:video_icon}).bindPopup(video_popup, {maxWidth : 640}); 2574 2575 video_layer_group.addLayer(video_marker); 2576 2577// End Midorizaurus 2578 2579// Start Ramen M 2580 var ramen_m_icon_s = L.icon({ 2581 iconUrl: 'images/ramen_m.png', 2582 iconSize: [48, 36], // size of the icon 2583 iconAnchor: [6, 8], 2584 popupAnchor: [18, 0] 2585 }); 2586 2587 var ramen_m_icon_m = L.icon({ 2588 iconUrl: 'images/ramen_m.png', 2589 iconSize: [64, 48], // size of the icon 2590 iconAnchor: [16, 12], 2591 popupAnchor: [16, 0] 2592 }); 2593 2594 var ramen_m_icon_l = L.icon({ 2595 iconUrl: 'images/ramen_m.png', 2596 iconSize: [80, 60], // size of the icon 2597 iconAnchor: [22, 22], 2598 popupAnchor: [18, -12] 2599 }); 2600 2601 video_icon = ramen_m_icon_m; 2602 video_latlong = [43.649737,-79.43465]; 2603 video_url = 'https://www.mikafleur.com/'; 2604 var video_name = 'MIKA'; 2605 video_title_img_src = 'https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcT2ywl354CuDdA9L8QIGXGIvK_IFXPdi40z-GgSasU8tF7Ai95a'; 2606 2607 video_embed_code = '<iframe width="640" height="360" scrolling="no" frameborder="0" style="border: none;" src="https://www.bitchute.com/embed/5V9zF0RmyqF5/"></iframe>'; 2608 video_popup = '<div class="vmiddle"><img src="' + video_title_img_src + '" width="32" /> <a href="' + video_url + '" target="_blank"><font size="5">' + video_name +'</font></a></div><br />' + video_embed_code; 2609 2610 video_marker = L.marker(video_latlong, {icon:video_icon}).bindPopup(video_popup, {maxWidth : 640}); 2611 2612 video_layer_group.addLayer(video_marker); 2613 2614// End Ramen M 2615 2616// Start highpark_sakura 2617 var highpark_sakura_icon_s = L.icon({ 2618 iconUrl: 'images/cherry_blossom_tree.gif', 2619 iconSize: [48, 36], // size of the icon 2620 iconAnchor: [6, 8], 2621 popupAnchor: [18, 0] 2622 }); 2623 2624 var highpark_sakura_icon_m = L.icon({ 2625 iconUrl: 'images/cherry_blossom_tree.gif', 2626 iconSize: [64, 48], // size of the icon 2627 iconAnchor: [16, 12], 2628 popupAnchor: [16, 0] 2629 }); 2630 2631 var highpark_sakura_icon_l = L.icon({ 2632 iconUrl: 'images/cherry_blossom_tree.gif',
2633 iconSize: [80, 60], // size of the icon 2634 iconAnchor: [22, 22], 2635 popupAnchor: [18, -12] 2636 }); 2637 2638 video_icon = highpark_sakura_icon_m; 2639 video_latlong = [43.6472 , -79.4656]; 2640 video_url = 'https://www.highparktoronto.com/cherry-trees.php'; 2641 video_title_img_src = 'https://www.highparktoronto.com/images/logo.jpg'; 2642 2643 video_embed_code = '<iframe width="640" height="360" src="https://www.youtube.com/embed/7ZT0kqx4erw" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>'; 2644 video_popup = '<div><a href="' + video_url + '" class="no_undeline" target="_blank"><img src="' + video_title_img_src + '" height="32" /></a></div><br />' + video_embed_code; 2645 2646 video_marker = L.marker(video_latlong, {icon:video_icon}).bindPopup(video_popup, {maxWidth : 640}).bindTooltip('High Park', {direction: 'right'});; 2647 2648 //video_layer_group.addLayer(video_marker); 2649 sakura_layer_group.addLayer(video_marker); 2650 2651// End Midorizaurus 2652 2653 ////L.control.layers(null, { "🌸 sakura": sakura_layer_group, "🛍 shops": shop_layer_group, "📹 videos": video_layer_group, "📖 bookstores": bk_layer_group, "🏫 colleges": college_layer_group, "🎈 events": event_layer_group}, { "collapsed": false, "position": "bottomright" }).addTo(mymap); 2654 L.control.layers(null, { "🛍 shops": shop_layer_group, "📹 videos": video_layer_group, "📖 bookstores": bk_layer_group, "🏫 colleges": college_layer_group, "🎈 events": event_layer_group}, { "collapsed": false, "position": "bottomright" }).addTo(mymap); 2655 2656 //L.marker(txt_lbl_1_latlong, {icon: txt_lbl_1_icon}).addTo(mymap); 2657 //L.marker(txt_lbl_1_latlong, {icon: txt_lbl_1_icon}).bindTooltip('Spadina Ave').addTo(mymap).openTooltip(); 2658 2659 //mymap.addLayer(labelTitle); 2660 2661 var helloPopup = L.popup().setContent('Hello World!'); 2662 var helloTooltip = L.tooltip().setContent('Hello World!'); 2663 2664 L.easyButton('<div>🌐</div>', function(btn, map){ 2665 //helloPopup.setLatLng(map.getCenter()).openOn(map); 2666 mymap.locate({setView: true, maxZoom: 16}); 2667 mymap.on('locationfound', onLocationFound); 2668 mymap.on('locationerror', onLocationError); 2669 }).addTo(mymap); 2670 //, {position: 'topright'} 2671 2672 //📄 2673 // <i class="fa fa-bars"></i> 2674 L.easyButton('<i class="fa fa-bars"></i>', function(btn, map){ 2675 //helloPopup.setLatLng(map.getCenter()).openOn(map); 2676 2677 var xhttp = getXHttp(); 2678 2679 xhttp.onreadystatechange = function() { 2680 if(this.readyState == 4 && this.status == 200) 2681 { 2682 var helloResponsivePopup = L.responsivePopup({ hasTip: false, keepInView: true }).setContent(xhttp.responseText); 2683 2684 helloResponsivePopup.setLatLng(map.getCenter()).openOn(map); 2685 //alert(xhttp.responseText); 2686 } 2687 }; 2688 2689 //xhttp.open("GET", "home.nsp", true); 2690 //xhttp.send(); 2691 2692 //$( function() { 2693 //$( "#dialog" ).dialog({ width: 600 }); 2694 //} ); 2695 2696 2697 toggleSidebar(); 2698 2699 }).addTo(mymap); 2700 2701 function toggleSidebar() 2702 { 2703 if(fg_sidebar_added) 2704 { 2705 sidebar.addTo(mymap); // strange hack to fix the problem with sidebar not handling remove properly 2706 mymap.removeControl(sidebar); 2707 $("#sidebar").css("display", "none"); 2708 fg_sidebar_added = false; 2709 } 2710 else 2711 { 2712 sidebar.addTo(mymap); 2713 $("#sidebar").css("display", "block"); 2714 fg_sidebar_added = true; 2715 loadReact(); 2716 } 2717 } 2718 2719 //var legend = L.control({position: 'bottomright'}); 2720 2721 //legend.onAdd = function (map) { 2722 2723 //var div = L.DomUtil.create('div', 'info legend'); 2724 2725 //div.innerHTML = 'Legend:<form><br><input name="bookstore" type="checkbox" onclick="handleLegendOnClick(this)" checked> Hello World!!<br><br></form>'; 2726 2727 //return div; 2728 //}; 2729 2730 //legend.addTo(mymap); 2731 2732 // Ugly hack. 2733 //"<div>Points of Interest:</div>" 2734 var label_div = document.createElement("div"); 2735 label_div.className = "expose"; 2736 label_div.innerHTML = "Points of Interest:" 2737 document.getElementsByClassName("leaflet-control-layers-overlays")[0].prepend(label_div); 2738 //document.getElementsByClassName("leaflet-control-layers-overlays")[0].appendHtml("<a href=''>more...</a>"); 2739 2740 // shadowUrl: 'https://leafletjs.com/examples/custom-icons/leaf-shadow.png', 2741 //alert("Loaded"); 2742 2743 2744 2745 //var sidebar = L.control.sidebar({ 2746 //autopan: false, // whether to maintain the centered map point when opening the sidebar 2747 //closeButton: true, // whether t add a close button to the panes 2748 //container: 'sidebar', // the DOM container or #ID of a predefined sidebar container that should be used 2749 //position: 'left', // left or right 2750 //}).addTo(mymap); 2751 2752 var sidebar = L.control.sidebar('sidebar').addTo(mymap); 2753 2754 2755 //L.DomUtil.removeClass(sidebar, 'visible'); 2756 //sidebar.hide(); 2757 //$("#sidebar").css("visibility", "hidden"); 2758 //$("#sidebar").css("position", "static"); 2759 2760 /* add a new panel */ 2761var panelContent = { 2762 id: 'userinfo', // UID, used to access the panel 2763 tab: '<i class="fa fa-gear"></i>', // content can be passed as HTML string,
2764 //pane: someDomNode.innerHTML, // DOM elements can be passed, too 2765 title: 'Your Profile', // an optional pane header 2766 position: 'bottom' // optional vertical alignment, defaults to 'top' 2767}; 2768sidebar.addPanel(panelContent); 2769 2770/* add an external link */ 2771sidebar.addPanel({ 2772 id: 'ghlink', 2773 tab: '<i class="fa fa-github"></i>', 2774 button: 'https://github.com/debisoft/tenatch', 2775}); 2776 2777/* add a button with click listener */ 2778sidebar.addPanel({ 2779 id: 'click', 2780 tab: '<i class="fa fa-info"></i>', 2781 button: function (event) { 2782 //console.log(event); 2783 $( "#dialog" ).dialog(); 2784 } 2785}); 2786 2787/* remove a panel */ 2788sidebar.removePanel('userinfo'); 2789 2790/* en- / disable a panel */ 2791//sidebar.disablePanel('userinfo'); 2792//sidebar.enablePanel('userinfo'); 2793 2794fg_sidebar_added = true; 2795toggleSidebar(); 2796 2797 2798 //mymap.on('click', function(e) 2799 //{ 2800 //alert(e.latlng.lat + ", " + e.latlng.lng); 2801 //}); 2802 2803 //window.setTimeout( 2804 //$( function() { 2805 //$( "#dialog" ).dialog(); 2806 //} ); 2807 //, 5000); 2808 2809 //$('.leaflet-control-layers').click(function(e){ 2810 //$(this).css('z-index','99999'); 2811 //$('#overlay').fadeIn(300); 2812 //}); 2813 2814 //$('.expose').css('z-index','1001'); 2815 $('#overlay').fadeIn(2000); 2816 2817 //$('.expose').css('animation','blinker 1s linear infinite;'); 2818 $('.expose').css('color','#f00'); 2819 2820 for(var i = 0; i < 8; i++) 2821 $('.expose').fadeOut(500, function(){$('.expose').css('background-color','#ff0')}).fadeIn(500, function(){$('.expose').css('background-color','')}); 2822 2823 //$('#overlay').click(function(e){ 2824 $('#overlay').fadeOut(5000, function(){ 2825 //$('.expose').css('z-index','800'); 2826 $('.expose').css('color',''); 2827 }); 2828 //}); 2829 2830//------------------------------------------ 2831// flyPlane 2832/*** 2833window.setTimeout(function(){ flyPlane([[ 2834 43.661662688047954, 2835 -79.24678802490234 2836 ], 2837 [ 2838 43.66364961297997, 2839 -79.61929321289062 2840 ]]) }, 10000); 2841***/ 2842//------------------------------------------- 2843 2844//------------------------------------------- 2845// Santa 2846 2847/* 2848 window.setTimeout(function(){ flySanta([[ 2849 43.661662688047954, 2850 -79.24678802490234 2851 ], 2852 [ 2853 43.66364961297997, 2854 -79.61929321289062 2855 ]]) }, 30000); 2856*/ 2857 var santa_LL = [[43.6722, -79.1886], [43.66364961297997, -79.61929321289062], [42.9906, -80.7179]]; 2858 var santa_TT = [ 120000, 600000]; 2859 var santa_msg = '<font color="red">M</font><font color="green">e</font><font color="red">r</font><font color="green">r</font><font color="red">y</font> <font color="red">C</font><font color="green">h</font><font color="red">r</font><font color="green">i</font><font color="red">s</font><font color="green">t</font><font color="red">m</font><font color="green">a</font><font color="red">s</font><font color="green">!</font><font color="red">!</font><br /><iframe width="640" height="360" src="https://www.youtube.com/embed/taE3PwurhYM" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>'; 2860 2861 window.setTimeout(function(){ 2862 moveSanta( 2863 santa_LL, 2864 santa_TT, 2865 santa_msg 2866 ) }, 3000); 2867 2868//------------------------------------------- 2869 2870 window.setTimeout(function(){ moveDeer( 2871 halloween_route_arr.slice().reverse(), 2872 halloween_time_arr.map(time => time * 0.25).reverse(), 2873 halloween_name_arr.slice().reverse(), 2874 'Merry Christmas!! Going to ', 2875 '...' 2876 ) }, 1000); 2877 2878 window.setTimeout(function(){ moveBunny( 2879 halloween_route_arr.slice().reverse(), 2880 halloween_time_arr.map(time => time * 0.5).reverse(), 2881 halloween_name_arr.slice().reverse(), 2882 'Hopping to ', 2883 '...' 2884 ) }, 1000); 2885 2886 /* 2887 window.setTimeout(function(){ flyGhost([[ 2888 43.661662688047954, 2889 -79.24678802490234 2890 ], 2891 [ 2892 43.66364961297997, 2893 -79.61929321289062 2894 ]]) }, 10000); 2895 */ 2896 2897 2898/*
2899 window.setTimeout(function(){ moveReaper([ 2900 [43.678035, -79.409446], 2901 [38.8895, -77.0352], 2902 [ 51.5134, -0.0889], 2903 [41.9022, 12.4572] 2904 ], 2905 [3600000, 3600000, 3600000], 2906 'Time to pay the Piper...' 2907 ) }, 60000); 2908 2909 window.setTimeout(function(){ flyWitch([[ 2910 43.661662688047954, 2911 -79.24678802490234 2912 ], 2913 [ 2914 43.66364961297997, 2915 -79.61929321289062 2916 ]], 2917 'Trick or Treat!! Heading to YYZ...' 2918 ) }, 10000); 2919 2920 window.setTimeout(function(){ moveDragon( 2921 6, 2922 false, 2923 5, 2924 halloween_route_arr, 2925 halloween_time_arr.map(time => time * 0.1), 2926 halloween_name_arr, 2927 'Trick or Treat!! Flying to ', 2928 '...' 2929 ) }, 6000); 2930 window.setTimeout(function(){ moveCat( 2931 halloween_route_arr.slice().reverse(), 2932 halloween_time_arr.map(time => time * 0.25).reverse(), 2933 halloween_name_arr.slice().reverse(), 2934 'Trick or Treat!! Going to ', 2935 '...' 2936 ) }, 9000); 2937 2938 window.setTimeout(function(){ moveFrank( 2939 halloween_route_arr, 2940 halloween_time_arr.map(time => time * 1.5), 2941 halloween_name_arr, 2942 'Trick or Treat!! Going to ', 2943 '...' 2944 ) }, 20000); 2945 2946 window.setTimeout(function(){ moveWalker( 2947 [church_st_latlong, eve_1_latlong], 2948 [180000], 2949 ['home', 'to the Halloween Party'], 2950 'Trick or Treat!! Going ', 2951 '...' 2952 ) }, 20000); 2953 2954 window.setTimeout(function(){ moveZombie([ 2955 uoft_latlong, 2956 utsc_latlong 2957 ], 2958 [360000], 2959 'Trick or Treat!! Heading to UTSC...' 2960 ) }, 30000); 2961 2962 window.setTimeout(function(){ moveGhost1( 2963 [icube_latlong, uoft_latlong], 2964 [180000], 2965 ['UTM', 'UofT'], 2966 'Trick or Treat!! Going to ', 2967 '...' 2968 ) }, 30000); 2969 2970 window.setTimeout(function(){ moveGhost2( 2971 [utsc_latlong, uoft_latlong], 2972 [180000], 2973 ['UTSC', 'UofT'], 2974 'Trick or Treat!! Going to ', 2975 '...' 2976 ) }, 50000); 2977 2978 window.setTimeout(function(){ moveGhost4( 2979 halloween_route_arr, 2980 halloween_time_arr, 2981 'Trick or Treat!!' 2982 ) }, 3000); 2983 2984 window.setTimeout(function(){ moveGhost5( 2985 halloween_route_arr.slice().reverse(), 2986 halloween_time_arr.slice().reverse(), 2987 'Trick or Treat!!' 2988 ) }, 3000); 2989 2990 window.setTimeout(function(){ 2991 2992 2993 moveGhost3( 2994 halloween_route_arr.slice().sort((a, b) => 0.5 - Math.random()), 2995 halloween_time_arr, 2996 'Trick or Treat!!' 2997 ) }, 3000); 2998 //window.setTimeout(loadAfterMap, 5000); 2999 3000 */ 3001 3002 // Start Shinigami Dee 3003 var popup_content = '<div><video id="shinigamidee_player" width="640" controls poster="https://static-3.bitchute.com/live/cover_images/fdRQEWyBXe7l/u8aJdgLTyHS5_640x360.jpg" ratio="16x9"><source src="https://zn21g5kls-n995.bitchute.com/fdRQEWyBXe7l/u8aJdgLTyHS5.mp4" type="video/mp4" /></video></div>' 3004 3005 var queen_spadina_latlng = [43.6487, -79.3965]; 3006 var queen_bathurst_latlng = [43.64715, -79.4039]; 3007 var spadina_bathurst_LL = [queen_spadina_latlng, queen_bathurst_latlng]; 3008 L.marker(queen_bathurst_latlng).addTo(mymap); 3009 L.polyline(spadina_bathurst_LL).addTo(mymap); 3010 3011 var shinigamidee_icon = L.icon({ 3012 iconUrl: 'images/shinigami_d.png', 3013 iconSize: [36, 48], // size of the icon 3014 iconAnchor: [12, 48], 3015 popupAnchor: [8, -48] 3016 }); 3017 3018 3019 3020 var markerD = L.Marker.movingMarker(spadina_bathurst_LL, [156000], {icon: shinigamidee_icon}).addTo(mymap); 3021 markerD.once('click', function() { 3022 //markerD.start(); 3023 markerD.closePopup(); 3024 markerD.unbindPopup(); 3025 3026 markerD.bindPopup(popup_content, {maxWidth : 640}).openPopup(); 3027 setTimeout(function() { 3028 const video = document.querySelector('video#shinigamidee_player'); 3029 video.addEventListener('playing', e => { 3030 setTimeout(function() { 3031 markerD.start(); 3032 }, 16500); 3033 }); 3034 }, 1000); 3035 3036 3037 /* 3038 markerD.on('click', function() { 3039 if(markerD.isRunning()) { 3040 markerD.pause(); 3041 } // if(markerD.isRunning()) 3042 else { 3043 markerD.start(); 3044 } // else 3045 }); 3046 3047 3048 */ 3049 }); 3050 3051 3052 3053 //markerD.bindPopup('<b>Click me to start!🌸</b>', {closeOnClick: false}); 3054 //markerD.openPopup(); 3055 3056 // End Shinigami Dee 3057 3058 // Start Yokozuna Nick 3059 var video_name = 'City of Crafts'; 3060 var video_url = 'https://www.cityofcraft.com/'; 3061 var video_latlong = [43.6430, -79.4232]; 3062 //var video_title = 'City of Crafts'; 3063 var video_title_img_src = 'images/city_of_craft.png'; 3064 var video_icon = null; 3065 var video_popup = null; 3066 3067 var yokozuna_nick_icon_s = L.icon({ 3068 iconUrl: 'images/yokozuna_nick.png', 3069 iconSize: [48, 36], // size of the icon 3070 iconAnchor: [6, 8], 3071 popupAnchor: [18, 0] 3072 }); 3073 3074 var yokozuna_nick_icon_m = L.icon({ 3075 iconUrl: 'images/yokozuna_nick.png', 3076 iconSize: [64, 48], // size of the icon 3077 iconAnchor: [16, 12], 3078 popupAnchor: [16, 0] 3079 }); 3080 3081 var yokozuna_nick_icon_l = L.icon({ 3082 iconUrl: 'images/yokozuna_nick.png',
3083 iconSize: [80, 60], // size of the icon 3084 iconAnchor: [22, 22], 3085 popupAnchor: [18, -12] 3086 }); 3087 3088 video_icon = yokozuna_nick_icon_l; 3089 video_latlong = [43.6431, -79.4232]; 3090 3091 //video_embed_code = '<iframe width="640" height="360" scrolling="no" frameborder="0" style="border: none;" src="https://www.youtube.com/embed/d0h7zCHy8K0"></iframe>'; 3092 video_embed_code = '<iframe width="640" height="360" scrolling="no" frameborder="0" style="border: none;" src="https://www.bitchute.com/embed/o9QeOq0ncSsu/"></iframe>'; 3093 video_popup = '<div class="vmiddle"><img src="' + video_title_img_src + '" width="32" /> <a href="' + video_url + '" target="_blank"><font size="5">' + video_name +'</font></a></div>' + video_embed_code; 3094 3095 video_marker = L.marker(video_latlong, {icon:video_icon}).bindPopup(video_popup, {maxWidth : 640}); 3096 3097 video_layer_group.addLayer(video_marker); 3098 3099 video_marker.once('click', function() { 3100 video_marker.closePopup(); 3101 video_marker.unbindPopup(); 3102 3103 video_marker.bindPopup(video_popup, {maxWidth : 640}).openPopup(); 3104 }); 3105 3106 video_marker.bindPopup('<b>Click me to start!🎅</b>', {closeOnClick: false}); 3107 video_marker.openPopup(); 3108 3109// End Yokozuna Nick 3110 3111 } // function loadMap() 3112 3113/* 3114 3115{ 3116 "name": "A Novel Spot Bookshop", 3117 "desc": "Bookshop with a selection of bios, mysteries, classics, cookbooks, history, and children's books.", 3118 "web_url": "https://novelspot.ca/", 3119 "icon_url": "https://novelspot.ca/i/7604122/favicon.png", 3120 "lat_lng": [43.661782,-79.519827], 3121 "addr": "270 The Kingsway, Etobicoke ON M9A 3T7" 3122 } 3123 31240. U of T 31251. ShawnPaulThompsonArt - var shop_3_name = 'ShawnPaulThompsonArt'; 31262. Catalina Sanchez - var shop_5_name = 'Catalina Sanchez'; 31273. More Than Lips - var shop_6_name = 'More Than Lips'; 31284. Mika - var shop_1_name = 'Mika'; 31295. A Novel Spot Bookshop 31306. Icube 31317. The Chemist Tree - var shop_4_name = 'The Chemist Tree'; 31328. Hamilton - Hamiltion [43.2645, -79.9523] 31339. Comfee Cushions - var shop_2_name = 'Comfee Cushions'; 3134 3135*/ 3136 3137 // Shops: 3138 var shop_1_name = 'Mika'; 3139 var shop_1_url = 'https://mikafleur.weebly.com/'; 3140 3141 var shop_1_latlong = [43.649737,-79.434793]; // 📖 3142 3143//----------------- 3144// comfeeliving 3145// https://www.comfeeliving.com - interiors - pillows - Grimsby, Ontario, Canada [43.1929, -79.5621] 3146 3147 var shop_2_name = 'Comfee Cushions'; 3148 var shop_2_url = 'https://www.comfeeliving.com/'; 3149 var shop_2_latlong = [43.1929, -79.5621]; // 📖 3150 3151//----------------- 3152// ShawnPaulThompsonArt 3153// https://shawnpaulthompsonart.myshopify.com/ - art - painting - Parkdale [43.6404, -79.4372] 3154 3155 var shop_3_name = 'ShawnPaulThompsonArt'; 3156 var shop_3_url = 'https://shawnpaulthompsonart.myshopify.com/'; 3157 var shop_3_latlong = [43.6677, -79.3554]; // 📖 3158 3159//----------------- 3160// The Chemist Tree 3161// https://chemisttree.com - gifts - t-shirts, cards, tote bags - Milton, Ontario, Canada [43.5130 -79.8826] 3162 3163 var shop_4_name = 'The Chemist Tree'; 3164 var shop_4_url = 'https://chemisttree.com'; 3165 var shop_4_latlong = [43.5130, -79.8826]; // 📖 3166 3167//----------------- 3168// Catalina Sánchez 3169// https://catalinasanchez.ca - stationary - notebooks - Yonge[43.6598, -79.3838] 3170 3171 var shop_5_name = 'Catalina Sanchez'; 3172 var shop_5_url = 'https://catalinasanchez.ca'; 3173 var shop_5_latlong = [43.6437, -79.3746]; // 📖 3174 3175//----------------- 3176// More Than Lips 3177// https://morethanlips.net - skin care - lip balm - Chinatown [43.6526, -79.3979] 3178 3179 var shop_6_name = 'More Than Lips'; 3180 var shop_6_url = 'https://morethanlips.net'; 3181 var shop_6_latlong = [43.6495, -79.395]; // 📖 3182 3183var shop_novel_name = 'A Novel Spot Bookshop'; 3184var shop_novel_latlong = [43.661782,-79.519827]; 3185 3186var hamilton_name = 'Hamilton'; 3187var hamilton_latlong = [43.2645, -79.9523]; 3188 3189halloween_name_arr = [ 3190 uoft_name, 3191 shop_3_name, 3192 shop_5_name, 3193 shop_6_name, 3194 shop_1_name, 3195 shop_novel_name, 3196 icube_name, 3197 shop_4_name, 3198 hamilton_name, 3199 shop_2_name 3200]; 3201 3202var halloween_route_arr = [ 3203 uoft_latlong, 3204 shop_3_latlong, 3205 shop_5_latlong, 3206 shop_6_latlong, 3207 shop_1_latlong, 3208 shop_novel_latlong, 3209 icube_latlong, 3210 shop_4_latlong, 3211 hamilton_latlong, 3212 shop_2_latlong 3213]; 3214 3215var route_s = 30000; 3216var route_m = 60000; 3217var route_l = 120000; 3218 3219var halloween_time_arr = [ 3220 route_m, // 0-1 3221 route_m, // 1-2 3222 route_s, // 2-3 3223 route_s, // 3-4 3224 route_m, // 4-5 3225 route_l, // 5-6 3226 route_l, // 6-7 3227 route_l, // 7-8 3228 route_l // 8-9 3229] 3230 3231 //function handleLegendOnClick(cb) 3232 //{ 3233 3234 //} // function handleLegendOnClick(cb) 3235 3236 //function setLayerVisibility() 3237 //{ 3238 3239 //} // 3240 3241 function goHome() 3242 { 3243 window.open('home.nsp', '_blank'); 3244 } 3245 3246 function onLocationFound(e) { 3247 var radius = e.accuracy / 2; 3248 3249 //alert(cn_tower_latlong); 3250 3251 L.marker(e.latlng).addTo(mymap).bindPopup("You are within " + radiu
3251s + " meters from this point").openPopup(); 3252 3253 L.circle(e.latlng, radius).addTo(mymap); 3254 3255 var travel = L.polyline([e.latlng, cn_tower_latlong]).addTo(mymap); 3256 3257 } 3258 3259 function onLocationError(e) { 3260 alert(e.message); 3261 } 3262 3263 function flySanta(point_arr) 3264 { 3265 var plane_icon = L.icon({ 3266 iconUrl: 'images/e2w/santa2.gif', 3267 iconSize: [192, 64], 3268 }); 3269 3270 var animatedMarker = L.animatedMarker(L.polyline(point_arr).getLatLngs(), { 3271 icon: plane_icon, 3272 autoStart: false, 3273 onEnd: function() { 3274 window.setTimeout(function(){ mymap.removeLayer(animatedMarker); }, 4000); 3275 } 3276 }).bindPopup('Heading to YYZ...'); 3277 3278 console.log("bearings: " + bearing(point_arr[0][0], point_arr[0][1], point_arr[1][0], point_arr[1][1])); 3279 3280 mymap.addLayer(animatedMarker); 3281 window.setTimeout(function(){ animatedMarker.start(); }, 1000); 3282 } 3283 3284 function moveSanta(point_arr, time_arr, popup_msg) { 3285 var icon_param = { 3286 iconName: 'santa2.gif', 3287 3288 iconSize: [192, 64], // size of the icon 3289 iconAnchor: [96, 32], 3290 popupAnchor: [50, -17] 3291 }; 3292 3293 moveObject(icon_param, point_arr, time_arr, popup_msg); 3294 } // function moveDrone(point_arr, time_arr, popup_msg) 3295 3296 function flyPlane(point_arr) 3297 { 3298 var plane_icon = L.icon({ 3299 iconUrl: 'images/crj_700_w.png', 3300 shadowUrl: 'images/crj_700_shadow_w.png' 3301 }); 3302 3303 var animatedMarker = L.animatedMarker(L.polyline(point_arr).getLatLngs(), { 3304 icon: plane_icon, 3305 autoStart: false, 3306 onEnd: function() { 3307 window.setTimeout(function(){ mymap.removeLayer(animatedMarker); }, 4000); 3308 } 3309 }).bindPopup('Heading to YYZ...'); 3310 3311 console.log("bearings: " + bearing(point_arr[0][0], point_arr[0][1], point_arr[1][0], point_arr[1][1])); 3312 3313 mymap.addLayer(animatedMarker); 3314 window.setTimeout(function(){ animatedMarker.start(); }, 1000); 3315 } 3316 3317 3318 3319 function flyGhost(point_arr) 3320 { 3321 var ghost_icon = L.divIcon({ 3322 className: 'skeleton-sprite flip-horizontally', 3323 iconSize: [36, 48], 3324 bgPos: [0, 0] 3325 //html: '<a>Here!!</a>' 3326 3327 }); 3328 3329 var ghost_icon2 = L.divIcon({ 3330 className: 'skeleton-sprite flip-horizontally', 3331 iconSize: [36, 48], 3332 bgPos: [36, 48] 3333 //html: '<a>Here!!</a>' 3334 3335 }); 3336 console.log("ghost_icon", ghost_icon); 3337 3338 var ghost_icon3 = L.icon({ 3339 iconUrl: 'images/frank_w2e.gif', 3340 iconSize: [72, 96], 3341 className: 'flip-horizontally' 3342 }); 3343 3344 var nMarker = L.marker([point_arr[0][0], point_arr[0][1]], {icon: ghost_icon2}); 3345 halloween_layer_group.addLayer(nMarker); 3346 3347 var animatedMarker = L.animatedMarker(L.polyline(point_arr).getLatLngs(), { 3348 icon: ghost_icon3, 3349 autoStart: false, 3350 onEnd: function() { 3351 window.setTimeout(function(){ halloween_layer_group.removeLayer(animatedMarker); }, 4000); 3352 } 3353 }).bindPopup('Trick or Treat!! Heading to YYZ...'); 3354 3355 console.log("animatedMarker", animatedMarker); 3356 3357 console.log("bearings: " + bearing(point_arr[0][0], point_arr[0][1], point_arr[1][0], point_arr[1][1])); 3358 3359 halloween_layer_group.addLayer(animatedMarker); 3360 3361 window.setTimeout(function(){ 3362 3363 animatedMarker.start(); 3364 3365 window.setTimeout(function(){ 3366 3367 animatedMarker.options = { 3368 icon: ghost_icon2, 3369 autoStart: false, 3370 onEnd: function() { 3371 window.setTimeout(function(){ halloween_layer_group.removeLayer(animatedMarker); }, 4000); 3372 } 3373 } 3374 console.log("animatedMarker", animatedMarker); 3375 }, 10000); 3376 3377 }, 1000); 3378 } 3379 3380 var moving_obj_icon_map = new Map(); 3381 3382 function moveDragon(curr_index, fg_order_increasing, next_index, point_arr, time_arr, name_arr, popup_msg_prefix, popup_msg_postfix) { 3383 console.log('moveDragon!!'); 3384 3385 var icon_param = { 3386 iconName: 'flying_dragon.gif', 3387 iconSize: [100, 90], 3388 className: null 3389 }; 3390 3391 stepObject(icon_param, curr_index, fg_order_increasing, next_index, point_arr, time_arr, name_arr, popup_msg_prefix, popup_msg_postfix); 3392 } // function moveDragon(curr_index, fg_order_increasing, next_index, point_arr, time_arr, name_arr, popup_msg_prefix, popup_msg_postfix) 3393 3394 function moveBunny(point_arr, time_arr, name_arr, popup_msg_prefix, popup_msg_postfix) { 3395 console.log('moveBunny!!'); 3396 3397 var icon_param = { 3398 iconName: 'hopping_bunny.gif', 3399 iconSize: [26, 32], 3400 className: null 3401 }; 3402 3403 stepObject(icon_param, 0, true, 1, point_arr, time_arr, name_arr, popup_msg_prefix, popup_msg_postfix); 3404 } // moveBunny(point_arr, time_arr, name_arr, popup_msg_prefix, popup_msg_postfix) 3405 3406 function moveDeer(point_arr, time_arr, name_arr, popup_msg_prefix, popup_msg_postfix) { 3407 console.log('moveDeer!!'); 3408 3409 var icon_param = { 3410 iconName: 'running_deer.gif', 3411 iconSize: [32, 32], 3412 className: null 3413 }; 3414 3415 stepObject(icon_param, 0, true, 1, point_arr, time_arr, name_arr, popup_msg_prefix, popup_msg_postfix); 3416 } // moveDeer(point_arr, time_arr, name_arr, popup_msg_prefix, popup_msg_postfix) 3417 3418 function moveCat(point_arr, time_arr, name_arr, popup_msg_prefix, popup_msg_postfix) { 3419 console.log('moveCat!!'); 3420 3421 var icon_param = { 3422 iconName: 'running_cat.gif', 3423 iconSize: [90, 90], 3424 className: null 3425 }; 3426 3427 stepObject(icon_param, 0, true, 1, point_arr, time_arr, name_arr, popup_msg_prefix, popup_msg_postfix); 3428 } // moveCat(point_arr, time_arr, name_arr, popup_msg_prefix, popup_msg_postfix) 3429 3430 function moveFrank(point_arr, time_arr, name_arr, popup_msg_prefix, popup_msg_postfix) { 3431 console.log('moveFrank!!'); 3432 3433 var icon_param = { 3434 iconName: 'walking_frank.gif', 3435 iconSize: [50, 50], 3436 className: null 3437 }; 3438 3439 stepObject(icon_param, 0, true, 1, point_arr, time_arr, name_arr, popup_msg_prefix, popup_msg_postfix); 3440 } // moveFrank(point_arr, time_arr, name_arr, popup_msg_prefix, popup_msg_postfix) 3441 3442 function moveWalker(point_arr, time_arr, name_arr, popup_msg_prefix, popup_msg_postfix) { 3443 console.log('moveWalker!!'); 3444 3445 var icon_param = { 3446 iconName: 'walking_walker.gif', 3447 iconSize: [25, 25], 3448 className: null 3449 }; 3450 3451 stepObject(icon_param, 0, true, 1, point_arr, time_arr, name_arr, popup_msg_prefix, popup_msg_postfix); 3452 } // moveWalker(point_arr, time_arr, name_arr, popup_msg_prefix, popup_msg_postfix) 3453 3454 function moveGhost1(point_arr, time_arr, name_arr, popup_msg_prefix, popup_msg_postfix) { 3455 3456 var icon_param = { 3457 iconName: 'flying_ghost1.gif', 3458 iconSize: [25, 25], 3459 className: null 3460 }; 3461 3462 stepObject(icon_param, 0, true, 1, point_arr, time_arr, name_arr, popup_msg_prefix, popup_msg_postfix); 3463 } // moveGhost1(point_arr, time_arr, name_arr, popup_msg_prefix, popup_msg_postfix) 3464 3465 function moveGhost2(point_arr, time_arr, name_arr, popup_msg_prefix, popup_msg_postfix) { 3466 3467 var icon_param = { 3468 iconName: 'flying_ghost2.gif', 3469 iconSize: [25, 25], 3470 className: null 3471 }; 3472 3473 stepObject(icon_param, 0, true, 1, point_arr, time_arr, name_arr, popup_msg_prefix, popup_msg_postfix); 3474 } // moveGhost2(point_arr, time_arr, name_arr, popup_msg_prefix, popup_msg_postfix) 3475 3476 function stepObject(icon_param, curr_index, fg_order_increasing, next_index, point_arr, time_arr, name_arr, popup_msg_prefix, popup_msg_postfix) { 3477 3478 3479 3480 var direction = getDirectionEW(point_arr[curr_index][0], point_arr[curr_index][1], point_arr[next_index][0], point_arr[next_index][1]); 3481 console.log("direction: " + direction); 3482 3483 var icon_uri = 'images/' + direction + '/' + icon_param.iconName; 3484 3485 var dir_icon = moving_obj_icon_map.get(icon_uri); 3486 3487 if(!dir_icon) { 3488 dir_icon = L.icon({ 3489 iconUrl: icon_uri, 3490 iconSize: icon_param.iconSize, 3491 className: icon_param.className, 3492 popupAnchor: [0, -13] 3493 }); 3494 3495 moving_obj_icon_map.set(icon_uri, dir_icon); 3496 } // if(!dir_icon) 3497 3498 var route_path_arr = [point_arr[curr_index], point_arr[next_index]]; 3499 var route_time_arr = null; 3500 3501 if(fg_order_increasing) 3502 route_time_arr = [time_arr[curr_index]]; 3503 else 3504 route_time_arr = [time_arr[curr_index - 1]]; // we need to offset by 1 in reverse. 3505 3506 var myMovingMarker = L.Marker.movingMarker( 3507 route_path_arr, route_time_arr, { 3508 icon: dir_icon, 3509 autostart: true 3510 } 3511 3512 ); 3513 3514 if(popup_msg_prefix && popup_msg_postfix) 3515 myMovingMarker.bindPopup(popup_msg_prefix + name_arr[next_index] + popup_msg_postfix); 3516 3517 halloween_layer_group.addLayer(myMovingMarker); 3518 3519 console.log("myMovingMarker", myMovingMarker); 3520 myMovingMarker.start(); 3521 3522 myMovingMarker.on('end', 3523 function() { 3524 console.log('end!'); 3525 3526 if(fg_order_increasing) { 3527 if(next_index == point_arr.length - 1) { 3528 // at the end. reverse direction 3529 stepObject(icon_param, next_index, !fg_order_increasing, curr_index, point_arr, time_arr, name_arr, popup_msg_prefix, popup_msg_postfix); 3530 3531 } // if(next_index == point_arr.length - 1) 3532 else { 3533 stepObject(icon_param, next_index, fg_order_increasing, next_index + 1, point_arr, time_arr, name_arr, popup_msg_prefix, popup_msg_postfix); 3534 } // else 3535 3536 } // if(fg_order_increasing) 3537 else 3538 { 3539 if(next_index == 0) { 3540 // at the end. reverse direction 3541 stepObject(icon_param, next_index, !fg_order_increasing, curr_index, point_arr, time_arr, name_arr, popup_msg_prefix, popup_msg_postfix); 3542 3543 } // if(next_index == point_arr.length -1) 3544 else { 3545 stepObject(icon_param, next_index, fg_order_increasing, next_index - 1, point_arr, time_arr, name_arr, popup_msg_prefix, popup_msg_postfix); 3546 } // else 3547 } // else 3548 3549 halloween_layer_group.removeLayer(myMovingMarker); 3550 } 3551 ) 3552 3553 } // function stepObject(icon_param, point_arr, popup_msg) 3554 3555 function moveReaper(point_arr, time_arr, popup_msg) { 3556 var icon_param = { 3557 iconName: 'flying_reaper.gif', 3558 iconSize: [33, 33], 3559 className: null 3560 }; 3561 3562 moveObject(icon_param, point_arr, time_arr, popup_msg); 3563 } // function moveReaper(point_arr, time_arr, popup_msg) 3564 3565 function moveZombie(point_arr, time_arr, popup_msg) { 3566 var icon_param = { 3567 iconName: 'walking_zombie.gif', 3568 iconSize: [33, 33], 3569 className: null 3570 }; 3571 3572 moveObject(icon_param, point_arr, time_arr, popup_msg); 3573 } // function moveZombie(point_arr, time_arr, popup_msg) 3574 3575 function moveGhost4(point_arr, time_arr, popup_msg) { 3576 var icon_param = { 3577 iconName: 'flying_ghost4.gif', 3578 iconSize: [40, 40], 3579 className: null 3580 }; 3581 3582 moveObject(icon_param, point_arr, time_arr, popup_msg); 3583 } // function moveGhost4(point_arr, time_arr, popup_msg) 3584 3585 function moveGhost5(point_arr, time_arr, popup_msg) { 3586 var icon_param = { 3587 iconName: 'flying_ghost5.gif', 3588 iconSize: [40, 40], 3589 className: null 3590 }; 3591 3592 moveObject(icon_param, point_arr, time_arr, popup_msg); 3593 } // function moveGhost5(point_arr, time_arr, popup_msg) 3594 3595 function moveGhost3(point_arr, time_arr, popup_msg) { 3596 var icon_param = { 3597 iconName: 'flying_ghost3.gif', 3598 iconSize: [50, 50], 3599 className: null 3600 }; 3601 3602 moveObject(icon_param, point_arr, time_arr, popup_msg); 3603 } // function moveGhost3(point_arr, time_arr, popup_msg) 3604 3605 function moveObject(icon_param, point_arr, time_arr, popup_msg) { 3606 var direction = getDirectionEW(point_arr[0][0], point_arr[0][1], point_arr[1][0], point_arr[1][1]); 3607 console.log("direction: " + direction); 3608 3609 //icon_param[] 3610 3611 var dir_icon = L.icon({ 3612 iconUrl: 'images/' + direction + '/' + icon_param.iconName, 3613 iconSize: icon_param.iconSize, 3614 className: icon_param.className, 3615 popupAnchor: icon_param.popupAnchor 3616 }); 3617 3618 var myMovingMarker = L.Marker.movingMarker( 3619 point_arr, time_arr, { 3620 icon: dir_icon, 3621 autostart: true, 3622 loop: true, 3623 zIndexOffset: 10000 3624 } 3625 3626 ); 3627 3628 if(popup_msg) 3629 myMovingMarker.bindPopup(popup_msg, {maxWidth : 640}); 3630 3631 //halloween_layer_group.addLayer(myMovingMarker); 3632 mymap.addLayer(myMovingMarker); 3633 3634 console.log("myMovingMarker", myMovingMarker); 3635 myMovingMarker.start(); 3636 3637 } // function moveObject(icon_param, point_arr, popup_msg) 3638 3639 function flyWitch(point_arr, popup_msg) 3640 { 3641 var icon_param = { 3642 iconName: 'flying_witch.gif', 3643 iconSize: [50, 50], 3644 className: null 3645 }; 3646 3647 flyObjectOnce(icon_param, point_arr, popup_msg); 3648 } // function flyWitch(point_arr, popup_msg) 3649 3650 3651 function flyObjectOnce(icon_param, point_arr, popup_msg) { 3652 3653 console.log("icon_param", icon_param); 3654
3655 var direction = getDirectionEW(point_arr[0][0], point_arr[0][1], point_arr[1][0], point_arr[1][1]); 3656 console.log("direction: " + direction); 3657 3658 //icon_param[] 3659 3660 var dir_icon = L.icon({ 3661 iconUrl: 'images/' + direction + '/' + icon_param.iconName, 3662 iconSize: icon_param.iconSize, 3663 className: icon_param.className 3664 }); 3665 3666 //var nMarker = L.marker([point_arr[0][0], point_arr[0][1]], {icon: param_icon}); 3667 //mymap.addLayer(nMarker); 3668 3669 var animatedMarker = L.animatedMarker(L.polyline(point_arr).getLatLngs(), { 3670 icon: dir_icon, 3671 autoStart: false, 3672 onEnd: function() { 3673 window.setTimeout(function(){ mymap.removeLayer(animatedMarker); }, 4000); 3674 } 3675 }); 3676 3677 if(popup_msg) 3678 animatedMarker.bindPopup(popup_msg); 3679 3680 //console.log("animatedMarker", animatedMarker); 3681 3682 3683 mymap.addLayer(animatedMarker); 3684 3685 //lm_layer_grp.addLayer(animatedMarker); 3686 3687 window.setTimeout(function(){ 3688 3689 animatedMarker.start(); 3690 3691 /* 3692 window.setTimeout(function(){ 3693 3694 var oppdir = "w2e"; 3695 3696 if(oppdir == direction) 3697 oppdir = "e2w"; 3698 3699 console.log("oppdir", oppdir); 3700 3701 var oppdir_icon = L.icon({ 3702 iconUrl: 'images/' + oppdir + '/' + icon_param.iconName, 3703 iconSize: icon_param.iconSize, 3704 className: icon_param.className 3705 }); 3706 3707 animatedMarker.setIcon(oppdir_icon); 3708 3709 }, 10000); 3710 */ 3711 3712 /* 3713 window.setTimeout(function(){ 3714 3715 animatedMarker.options = { 3716 icon: ghost_icon2, 3717 autoStart: false, 3718 onEnd: function() { 3719 window.setTimeout(function(){ mymap.removeLayer(animatedMarker); }, 4000); 3720 } 3721 } 3722 console.log("animatedMarker", animatedMarker); 3723 }, 10000); 3724 */ 3725 3726 }, 1000); 3727 } // function flyObjectOnce(icon_param, point_arr, popup_msg) 3728 3729 function getDirectionEW(startLat, startLng, destLat, destLng) { 3730 var direction = "w2e"; 3731 var bearing_degrees = bearing(startLat, startLng, destLat, destLng); 3732 3733 if(bearing_degrees > 180) 3734 direction = "e2w" 3735 3736 return direction; 3737 } // function getDirectionEW(startLat, startLng, destLat, destLng) 3738 3739 // Converts from degrees to radians. 3740 function toRadians(degrees) { 3741 return degrees * Math.PI / 180; 3742 }; 3743 3744 // Converts from radians to degrees. 3745 function toDegrees(radians) { 3746 return radians * 180 / Math.PI; 3747 } 3748 3749 3750 function bearing(startLat, startLng, destLat, destLng) { 3751 startLat = toRadians(startLat); 3752 startLng = toRadians(startLng); 3753 destLat = toRadians(destLat); 3754 destLng = toRadians(destLng); 3755 3756 y = Math.sin(destLng - startLng) * Math.cos(destLat); 3757 x = Math.cos(startLat) * Math.sin(destLat) - 3758 Math.sin(startLat) * Math.cos(destLat) * Math.cos(destLng - startLng); 3759 brng = Math.atan2(y, x); 3760 brng = toDegrees(brng); 3761 return (brng + 360) % 360; 3762 } 3763 3764 3765 var fg_image_loaded = false; // a hack 3766 3767 $(document).ready(function() { 3768 $("#myTextarea").keyup(function() { 3769 //$( "#myTextarea" ).autoResize(); 3770 3771 var currentText = $(this).val(); 3772 3773 var meta_obj = scanText(currentText); 3774 3775 if($("#myImg").length == 0 & meta_obj.hasUrl && isUrlValid(meta_obj.url)) 3776 { 3777 //$(".output").text(meta_obj.url); 3778 3779 var xhttp = getXHttp(); 3780 3781 xhttp.onreadystatechange = function() { 3782 if(this.readyState == 4 && this.status == 200) 3783 { 3784 //var meta_obj = extractMeta(xhttp.responseText); 3785 var meta_json = jQuery.parseJSON(xhttp.responseText); 3786 3787 console.log("meta_json: ", meta_json); 3788 3789 if(meta_json.image && !fg_image_loaded) 3790 { 3791 fg_image_loaded = true; 3792 //$(".output").text(meta_json.image); 3793 $(".output").prepend('<img id="myImg" src="' + meta_json.image + '" />'); 3794 } 3795 } 3796 }; 3797 3798 3799 3800 //xhttp.open("GET", meta_obj.url, true); 3801 3802 xhttp.open("GET", '/hey/?url=' + encodeURIComponent(meta_obj.url), true); 3803 3804 xhttp.send(); 3805 3806 } 3807 }); 3808 3809 //$("#event_url").focusout(function() { 3810 3811 //var currentText = $(this).val(); 3812 3813 //$(".output").text(currentText); 3814 //}); 3815 }); 3816 3817 function findLatLng() 3818 { 3819 var address = $("#address").val(); 3820 3821 var xhttp = getXHttp(); 3822 3823 xhttp.onreadystatechange = function() { 3824 if(this.readyState == 4 && this.status == 200) 3825 { 3826 var meta_json = jQuery.parseJSON(xhttp.responseText); 3827 3828 if(meta_json.results && meta_json.results[0].locations && meta_json.results[0].locations[0] && meta_json.results[0].locations[0].latLng) 3829 { 3830 var location_latlng = meta_json.results[0].locations[0].latLng; 3831 3832 //alert('[' + location_latlng.lat +',' + location_latlng.lng + ']'); 3833 L.marker(location_latlng).addTo(mymap).bindPopup("Event location").openPopup(); 3834 var view_latlng = location_latlng; 3835 view_latlng.lat += 0.001;
3835 // 43.661386 - 43.660599 3836 mymap.setView(view_latlng, 18); 3837 $( "#dialog" ).dialog({ position: 'top' }) 3838 $("#dialog_submit").prop("disabled", false); 3839 $("#dialog_submit").css("display", "block"); 3840 } 3841 else 3842 alert('404 Place Not Found.'); 3843 } 3844 }; 3845 3846 xhttp.open("GET", '/world/?location=' + encodeURIComponent(address), true); 3847 3848 xhttp.send(); 3849 } 3850 3851 function isUrlValid(url) { 3852 return /^(https?|s?ftp):\/\/(((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:)*@)?(((\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5]))|((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.?)(:\d*)?)(\/((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)+(\/(([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)*)*)?)?(\?((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)|[\uE000-\uF8FF]|\/|\?)*)?(#((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)|\/|\?)*)?$/i.test(url); 3853 } 3854 3855 function scanText(text) 3856 { 3857 var ret_obj = new Object(); 3858 ret_obj.hasUrl = false; 3859 3860 if(text.indexOf('http://') != - 1) 3861 { 3862 ret_obj.hasUrl = true; 3863 ret_obj.url = extractUrl(text, 'http://'); 3864 } 3865 else if(text.indexOf('https://') != - 1) 3866 { 3867 ret_obj.hasUrl = true; 3868 ret_obj.url = extractUrl(text, 'https://'); 3869 } 3870 3871 return ret_obj; 3872 } 3873 3874 function extractUrl(text, protocol) 3875 { 3876 var ret_text = text.trim(); 3877 3878 return ret_text.substring(ret_text.indexOf(protocol)); 3879 3880 } 3881 3882 function extractMeta(text) 3883 { 3884 var ret_obj = new Object(); 3885 ret_obj.hasOgImg = false; 3886 3887 html_dom = $.parseHTML(text, null, false); 3888 3889 $.each(html_dom, function (i, el) { 3890 if(el.nodeName == 'meta') 3891 { 3892 if(el.property.trim().toLowerCase() == 'og:image') 3893 { 3894 ret_obj.hasOgImg = true; 3895 ret_obj.img_url = el.content.trim(); 3896 } 3897 } 3898 }); 3899 3900 return ret_obj; 3901 } 3902 3903 // react 3904 3905 const e = React.createElement; 3906 3907 class LikeButton extends React.Component 3908 { 3909 constructor(props) 3910 { 3911 super(props); 3912 this.state = { liked: false}; 3913 } // constructor(props) 3914 3915 render() 3916 { 3917 if(this.state.liked) 3918 { 3919 return 'You liked this!'; 3920 } // if(this.state.liked) 3921 3922 return e 3923 ( 3924 'button', 3925 { 3926 onClick: () => this.setState({liked: true}) 3927 }, 3928 'Like' 3929 ); 3930 } // render() 3931 3932 } // class LikeButton extends React.Component 3933 3934 function loadReact2() 3935 { 3936 const domContainer = document.querySelector('#like_btn_test'); 3937 ReactDOM.render(e(LikeButton), domContainer); 3938 } // function loadReact() 3939</script>
vendor: 1 bytes, line 3939
3939
3940<script type="text/babel"> 3941 3942function Welcome(props) 3943{ 3944 return <h1>Hello, {props.name}</h1>; 3945} // function Welcome(props) 3946 3947function formatName(user) 3948{ 3949 return user.firstName + ' ' + user.lastName; 3950} // function formatName(user) 3951 3952function getGreeting(user2) 3953{ 3954 if(user2) 3955 { 3956 return <h1>Hello, {formatName(user2)}!</h1>; 3957 } // if(user) 3958 else 3959 return <h1>Hello, Stranger.</h1>; 3960} // function getGreeting(user) 3961 3962class Welcome2 extends React.Component 3963{ 3964 render() 3965 { 3966 return <h1>Hello2, {this.props.name}</h1>; 3967 } // render() 3968} // class Welcome2 extends React.Component 3969 3970function WelcomeParty(props) 3971{ 3972 return ( 3973 <div> 3974 <Welcome name='Reactor' /> 3975 <Welcome2 name='Reactor2' /> 3976 <Welcome name='Reactor3' /> 3977 </div> 3978 ); 3979} 3980 3981function Avatar(props) 3982{ 3983 return ( 3984 <img className="Avatar" 3985 width="160" 3986 src={props.user.avatarUrl} 3987 alt={props.user.name} 3988 /> 3989 ); 3990} // function Avatar(props) 3991 3992function UserInfo(props) 3993{ 3994 return ( 3995 <div className="UserInfo"> 3996 <Avatar user={props.user} /> 3997 <div className="UserInfo-name"> 3998 {props.user.name} 3999 </div> 4000 </div> 4001 ); 4002} // function UserInfo(props) 4003 4004function Comment(props) 4005{ 4006 return ( 4007 <div className="Comment"> 4008 <UserInfo user={props.author} /> 4009 4010 <div className="Comment-text"> 4011 {props.author.text} 4012 </div> 4013 <div className="Comment-date"> 4014 {props.author.date} 4015 </div> 4016 </div> 4017 ); 4018} // function Comment(props) 4019 4020let author = 4021{ 4022 name: "Shakespear", 4023 avatarUrl: "images/aussiecat_poster_512.jpg", 4024 text: "Great comment!!", 4025 date: (new Date()).toString() 4026}; 4027 4028function Clock(props) 4029{ 4030 return ( 4031 <div> 4032 <h1>Hello, world clock!</h1> 4033 <h2>It's {props.date.toLocaleTimeString()}.</h2> 4034 </div> 4035 ); 4036} 4037 4038class Clock2 extends React.Component 4039{ 4040 constructor(props) 4041 { 4042 super(props); 4043 this.state = {date: new Date()}; 4044 } // constructor(props) 4045 4046 componentDidMount() 4047 { 4048 console.log("componentDidMount()"); 4049 this.timerID = setInterval( 4050 () => this.tick(), 4051 1000 4052 ); 4053 } // componentDidMount() 4054 4055 componentWillUnmount() 4056 { 4057 clearInterval(this.timerID); 4058 } // componentWillUnmount() 4059 4060 tick() 4061 { 4062 this.setState({ 4063 date: new Date() 4064 }); 4065 } // tick() 4066 4067 render() 4068 { 4069 return ( 4070 <div> 4071 <h2>Hello, world clock3! It's {this.state.date.toLocaleTimeString()}.</h2> 4072 </div> 4073 ); 4074 } // render() 4075} // class Clock2 extends React.Component 4076 4077function Clock3() 4078{ 4079 return ( 4080 <div> 4081 <Clock2 /> 4082 <Clock2 /> 4083 <Clock2 /> 4084 </div> 4085 ); 4086} // function Clock3 4087 4088function Form() 4089{ 4090 function handleSubmit(e) 4091 { 4092 e.preventDefault(); 4093 console.log('You clicked submit.'); 4094 } // function handleSubmit(e) 4095 4096 return ( 4097 <form onSubmit={handleSubmit}> 4098 <button type="submit">Submit</button> 4099 </form> 4100 ); 4101 4102 4103} // function Form() 4104 4105class Toggle extends React.Component 4106{ 4107 constructor(props) 4108 { 4109 super(props); 4110 this.state = {isToggleOn: true}; 4111 4112 // This binding is necessary 4113 this.handleClick = this.handleClick.bind(this); 4114 } // constructor(props) 4115 4116 handleClick(i, e) 4117 { 4118 //console.log("(" + i + "): ", e); 4119 this.setState( 4120 prevState => ( 4121 { 4122 isToggleOn: !prevState.isToggleOn 4123 } 4124 ) 4125 ); 4126 } // handleClick() 4127 4128 render() 4129 { 4130 /* 4131 let ret_elm = ""; 4132 4133 for(let i = 0; i < 3; i++) ( 4134 4135 ret_elm += <button onClick={this.handleClick(i)}> 4136 {this.state.isToggleOn ? 'ON' : 'OFF'} 4137 </button> 4138 ); 4139 4140 return ret_elm; 4141 */ 4142 4143 return <button onClick={this.handleClick}> 4144 {this.state.isToggleOn ? 'ON' : 'OFF'} 4145 </button>; 4146 } // render() 4147} // class Toggle extends React.Component 4148 4149function UserGreeting(props) 4150{ 4151 return <h1>Welcome back!</h1>; 4152} // function UserGreeting(props) 4153 4154function GuestGreeting(props) 4155{ 4156 return <h1>Please sign up.</h1>; 4157} // function GuestGreeting(props) 4158 4159function Greeting(props) 4160{ 4161 const isLoggedIn = props.isLoggedIn; 4162 4163 if(isLoggedIn) 4164 { 4165 return <UserGreeting />; 4166 } // is(isLoggedIn) 4167 else 4168 return <GuestGreeting />; 4169} // function Greeting(props) 4170 4171function LoginButton(props) 4172{ 4173 return ( 4174 <button onClick={props.onClick}>Login</button> 4175 ); 4176} // function LoginButton(props) 4177 4178function LogoutButton(props) 4179{ 4180 return ( 4181 <button onClick={props.onClick}>Logout</button> 4182 ); 4183} // function LogoutButton(props) 4184 4185class LoginControl extends React.Component 4186{ 4187 constructor(props) 4188 { 4189 super(props); 4190 this.handleLoginClick = this.handleLoginClick.bind(this); 4191 this.handleLogoutClick = this.handleLogoutClick.bind(this); 4192 this.state = {isLoggedIn: false}; 4193 } // constructor(props) 4194 4195 handleLoginClick() 4196 { 4197 this.setState({isLoggedIn: true}); 4198 } // handleLoginClick() 4199 4200 handleLogoutClick() 4201 { 4202 this.setState({isLoggedIn: false}); 4203 } // handleLoginClick() 4204 4205 render() 4206 { 4207 const isLoggedIn = this.state.isLoggedIn; 4208 let button; 4209 if(isLoggedIn) 4210 { 4211 button = <LogoutButton onClick={this.handleLogoutClick} />; 4212 } // if(isLoggedIn) 4213 else 4214 { 4215 button = <LoginButton onClick={this.handleLoginClick} />; 4216 } // else 4217 4218 return ( 4219 <div> 4220 <Greeting isLoggedIn={isLoggedIn} /> 4221 The user is <b>{isLoggedIn ? 'currently' : 'not'}</b> logged in. 4222 {button} 4223 </div> 4224 ); 4225 } // render() 4226 4227} // class LoginControl extends React.Component 4228 4229class WarnPage extends React.Component 4230{ 4231 constructor(props) { 4232 super(props); 4233 this.state = {showWarning: true}; 4234 this.handleToggleClick = this.handleToggleClick.bind(this); 4235 } // constructor(props) 4236 4237 handleToggleClick() 4238 { 4239 this.setState( 4240 state => ({ 4241 showWarning: !state.showWarning 4242 })); 4243 } // handleToggleClick() 4244 4245 render() { 4246 return ( 4247 <div> 4248 <WarningBanner warn={this.state.showWarning} /> 4249 <button onClick={this.handleToggleClick}> 4250 {this.state.showWarning ? 'Hide' : 'Show'} 4251 </button> 4252 </div> 4253 ); 4254 } // render() 4255} // class WarnPage extends React.Component 4256 4257function Mailbox(props) 4258{ 4259 const unreadMessages = props.unreadMessages; 4260 return ( 4261 <div> 4262 <h1>Hello!</h1> 4263 {unreadMessages.length > 0 && 4264 <h2>You have {unreadMessages.length} unread messages.</h2> 4265 } 4266 </div> 4267 ); 4268} // function Mailbox(props) 4269 4270function WarningBanner(props) 4271{ 4272 if(!props.warn) 4273 { 4274 return null; 4275 } // if(!props.warn) 4276 4277 return ( 4278 <div className="warning">Warning!</div> 4279 ); 4280} // function WarningBanner(props) 4281 4282function ListItem(props) { 4283 const value = props.value; 4284 return ( 4285 <li>{value}</li> 4286 ); 4287} // function ListItem(props) 4288 4289function NumberList(props) { 4290 4291/* 4292 const listItems = props.map((number) => 4293 <ListItem key={number.toString()} value={number} /> 4294 ); 4295 4296 return listItems; 4297 */ 4298 4299 return (<ul>{props.map((number) => 4300 <ListItem key={number.toString()} value={number} />)}</ul>); 4301} // function NumberList(props) 4302 4303function Blog(props) { 4304 const sidebar = ( 4305 <ul>
4306 {props.posts.map((post) => 4307 <li key={post.id}> 4308 {post.title} 4309 </li> 4310 )} 4311 </ul> 4312 ); 4313 4314 const content = props.posts.map((post) => 4315 <Post key={post.id} id={post.id} title={post.title} content={post.content} /> 4316 ); 4317 return ( 4318 <div> 4319 {sidebar} 4320 <hr /> 4321 {content} 4322 </div> 4323 ); 4324} // function Blog(props) 4325 4326function Post(props) { 4327 return ( 4328 <div key={props.id}> 4329 <h3>{props.title}</h3> 4330 <p>{props.content}</p> 4331 </div> 4332 ); 4333} // function Post(props) 4334 4335class NameForm extends React.Component { 4336 constructor(props) { 4337 super(props); 4338 this.state = {value: ''}; 4339 4340 this.handleChange = this.handleChange.bind(this); 4341 this.handleSubmit = this.handleSubmit.bind(this); 4342 } // constructor(props) 4343 4344 handleChange(event) { 4345 //console.log(event.target.value); 4346 this.setState({value: event.target.value}); 4347 } // handleChange(event) 4348 4349 handleSubmit(event) { 4350 alert('A name was submitted: ' + this.state.value); 4351 event.preventDefault(); 4352 } // handleSubmit(event) 4353 4354 render() { 4355 return ( 4356 <form onSubmit={this.handleSubmit}> 4357 <label> 4358 Name: <input type="text" value={this.state.value} onChange={this.handleChange} /> 4359 </label> 4360 <input type="submit" value="Submit" /> 4361 </form> 4362 ); 4363 } // render() 4364} // class NameForm extends React.Component 4365 4366class EssayForm extends React.Component { 4367 4368 constructor(props) { 4369 super(props); 4370 this.state = { 4371 value: 'PLease write an essay about your favorite DOM element.' 4372 }; 4373 4374 this.handleChange = this.handleChange.bind(this); 4375 this.handleSubmit = this.handleSubmit.bind(this); 4376 } // constructor(props) 4377 4378 handleChange(event) { 4379 //console.log(event.target.value); 4380 this.setState({value: event.target.value}); 4381 } // handleChange(event) 4382 4383 handleSubmit(event) { 4384 alert('An essay was submitted: ' + this.state.value); 4385 event.preventDefault(); 4386 } // handleSubmit(event) 4387 4388 render() { 4389 return ( 4390 <form onSubmit={this.handleSubmit}> 4391 <label> 4392 Essay: 4393 <textarea value={this.state.value} onChange={this.handleChange} /> 4394 </label> 4395 <input type="submit" value="submit" /> 4396 </form> 4397 ); 4398 } // render() 4399} // class EssayForm extends React.Component 4400 4401class FlavorForm extends React.Component { 4402 4403 constructor(props) { 4404 super(props); 4405 this.state = {value: 'coconut'}; 4406 4407 this.handleChange = this.handleChange.bind(this); 4408 this.handleSubmit = this.handleSubmit.bind(this); 4409 } // constructor(props) 4410 4411 handleChange(event) { 4412 //console.log(event.target.value); 4413 this.setState({value: event.target.value}); 4414 } // handleChange(event) 4415 4416 handleSubmit(event) { 4417 alert('Your favorite flavor is: ' + this.state.value); 4418 } // handleSubmit(event) 4419 4420 render() { 4421 return ( 4422 <form onSubmit={this.handleSubmit}> 4423 <label> 4424 Pick your favorite flavor: 4425 <select value={this.state.value} onChange={this.handleChange}> 4426 <option value="grapefruit">Grapefruit</option> 4427 <option value="lime">Lime</option> 4428 <option value="coconut">Coconut</option> 4429 <option value="mango">Mango</option> 4430 <option value="strawberry">Strawberry</option> 4431 </select> 4432 {/*<!--select multiple={true} value={['coffee', 'tea', 'Cocoa']} onChange={this.handleChange}></select-->*/} 4433 </label> 4434 <input type="submit" value="Submit" /> 4435 </form> 4436 ); 4437 } // render() 4438} // class FlavorForm extends React.Component 4439 4440class Reservation extends React.Component { 4441 constructor(props) { 4442 super(props); 4443 this.state = { 4444 isGoing: true, 4445 numberOfGuests: 2 4446 }; 4447 4448 this.handleInputChange = this.handleInputChange.bind(this); 4449 } // constructor(props) 4450 4451 handleInputChange(event) { 4452 const target = event.target; 4453 const value = target.type === 'checkbox' ? target.checked : target.value; 4454 const name = target.name; 4455 4456 this.setState({[name]: value}); 4457 console.log(name, value); 4458 } // handleInputChange(event) 4459 4460 render() { 4461 return ( 4462 <form> 4463 <label> 4464 Is going: 4465 <input name="isGoing" type="checkbox" checked={this.state.isGoing} onChange={this.handleInputChange} /> 4466 </label> 4467 <br /> 4468 <label> 4469 Number of guests: 4470 <input name="numberOfGuests" type="number" value={this.state.numberOfGuests}
4470 onChange={this.handleInputChange} /> 4471 </label> 4472 </form> 4473 ); 4474 } // render() { 4475 4476} // class Reservation extends React.Component 4477 4478function BoilingVerdict(props) { 4479 if (props.celsius >= 100) { 4480 return <p>The water would boil.</p>; 4481 } // if (props.celsius >= 100) 4482 return <p>The water would not boil.</p>; 4483} // function BoilingVerdict(props) 4484 4485const scaleNames = { 4486 c: 'Celsius', 4487 f: 'Fahrenheit' 4488}; 4489 4490function toCelsius(fahrenheit) { 4491 return (fahrenheit - 32) * 5 / 9; 4492} // function toCelsius(fahrenheit) 4493 4494function toFahrenheit(celsius) { 4495 return (celsius * 9 / 5) + 32; 4496} // function toFahrenheit(celsius) 4497 4498function tryConvert(temperature, convert) { 4499 const input = parseFloat(temperature); 4500 if (Number.isNaN(input)) { 4501 return ''; 4502 } 4503 const output = convert(input); 4504 const rounded = Math.round(output * 1000) / 1000; 4505 return rounded.toString(); 4506} // function tryConvert(temperature, convert) 4507 4508class TemperatureInput extends React.Component { 4509 constructor(props) { 4510 super(props); 4511 this.handleChange = this.handleChange.bind(this); 4512 this.state = {temperature: ''}; 4513 } // constructor(props) 4514 4515 handleChange(e) { 4516 //this.setState({temperature: e.target.value}); 4517 this.props.onTemperatureChange(e.target.value); 4518 } // handleChange(e) 4519 4520 render() { 4521 //const temperature = this.state.temperature; 4522 const temperature = this.props.temperature; 4523 const scale = this.props.scale; 4524 return ( 4525 <fieldset> 4526 <legend>Enter temperature in {scaleNames[scale]}:</legend> 4527 <input value={temperature} onChange={this.handleChange} /> 4528 4529 4530 </fieldset> 4531 ); 4532 } // render() 4533 4534} // class TemperatureInput extends React.Component 4535 4536class Calculator extends React.Component { 4537 constructor(props) { 4538 super(props); 4539 this.handleCelsiusChange = this.handleCelsiusChange.bind(this); 4540 this.handleFahrenheitChange = this.handleFahrenheitChange.bind(this); 4541 this.state = {temperature: '', scale: 'c'}; 4542 } // constructor(props) 4543 4544 handleCelsiusChange(temperature) { 4545 this.setState({scale: 'c', temperature}); 4546 } // handleCelsiusChange(temperature) 4547 4548 handleFahrenheitChange(temperature) { 4549 this.setState({scale: 'f', temperature}); 4550 } // handleFahrenheitChange(temperature) 4551 4552 render() { 4553 const scale = this.state.scale; 4554 const temperature = this.state.temperature; 4555 const celsius = scale === 'f' ? tryConvert(temperature, toCelsius) : temperature; 4556 const fahrenheit = scale === 'c' ? tryConvert(temperature, toFahrenheit) : temperature; 4557 return ( 4558 <div> 4559 <TemperatureInput scale="c" 4560 temperature={celsius} 4561 onTemperatureChange={this.handleCelsiusChange} 4562 /> 4563 <TemperatureInput scale="f" 4564 temperature={fahrenheit} 4565 onTemperatureChange={this.handleFahrenheitChange} 4566 /> 4567 <BoilingVerdict celsius={parseFloat(celsius)} /> 4568 </div> 4569 ); 4570 } // render() 4571} // class Calculator extends React.Component 4572 4573class Calculator2 extends React.Component { 4574 constructor(props) { 4575 super(props); 4576 this.handleChange = this.handleChange.bind(this); 4577 this.state = {temperature: ''}; 4578 } // constructor(props) 4579 4580 handleChange(e) { 4581 this.setState({temperature: e.target.value}); 4582 } // handleChange(e) 4583 4584 render() { 4585 const temperature = this.state.temperature; 4586 4587 return ( 4588 <fieldset> 4589 <legend>Enter temperature in celsius:</legend> 4590 <input value={temperature} onChange={this.handleChange} /> 4591 <BoilingVerdict celsius={parseFloat(temperature)} /> 4592 4593 </fieldset> 4594 ); 4595 } // render() 4596} // class Calculator2 extends React.Component 4597 4598function FancyBorder(props) { 4599 return ( 4600 <div className={'FancyBorder FancyBorder-' + props.color}> 4601 {props.children} 4602 </div> 4603 ); 4604} // function FancyBorder(props) 4605 4606function Dialog(props) { 4607 return ( 4608 <FancyBorder color="blue"> 4609 <h1 className="Dialog-title"> 4610 {props.title} 4611 </h1> 4612 <p className="Dialog-message"> 4613 {props.message} 4614 </p> 4615 {props.children} 4616 </FancyBorder> 4617 ); 4618} // function WelcomeDialog() 4619 4620function WelcomeDialog(props) { 4621 return ( 4622 <Dialog title="Welcome" message="Thank you for visiting our spacecraft!" /> 4623 ); 4624} // function WelcomeDialog() 4625 4626class SignUpDialog extends React.Component 4627{ 4628 constructor(props) 4629 { 4630 super(props); 4631 this.handleChange = this.handleChange.bind(this); 4632 this.handleSignUp = this.handleSignUp.bind(this); 4633 this.state = {login: ''}; 4634 } // constructor(props) 4635 4636 render() { 4637 return ( 4638 <Dialog title="Mars Exploration Program" message="How should we refer to you?"> 4639 <input value={this.state.login} onChange={this.handleChange} />
4639 4640 <button onClick={this.handleSignUp}>Sign Me Up!</button> 4641 </Dialog> 4642 ); // return 4643 } // render() 4644 4645 handleChange(e) { 4646 this.setState({login: e.target.value}); 4647 } // handleChange(e) 4648 4649 handleSignUp() { 4650 alert(`Welcome aboard, ${this.state.login}!`); 4651 } // handleSignUp() 4652 4653} // class SignUpDialog extends React.Component 4654 4655function SplitPane(props) { 4656 return ( 4657 <div className="SplitPane"> 4658 <div className="SplitPane-left"> 4659 {props.left} 4660 </div> 4661 <div className="SplitPane-right"> 4662 {props.right} 4663 </div> 4664 </div> 4665 ); 4666} // function SplitPane(props) 4667 4668function App(props) { 4669 return ( 4670 <SplitPane left={ 4671 <FancyBorder color="green"> 4672 <h1 className="Dialog-title"> 4673 Welcome 4674 </h1> 4675 </FancyBorder> 4676 } right={ 4677 <FancyBorder color="red"> 4678 <p className="Dialog-message"> 4679 Thank you for visiting our spacecraft! 4680 </p> 4681 </FancyBorder> 4682 } /> 4683 ); 4684} // function App() 4685 4686let product_arr = [ 4687 {category: "Sporting Goods", price: "$49.99", stocked: true, name: "Football"}, 4688 {category: "Sporting Goods", price: "$9.99", stocked: true, name: "Baseball"}, 4689 {category: "Sporting Goods", price: "$29.99", stocked: false, name: "Basketball"}, 4690 {category: "Electronics", price: "$99.99", stocked: true, name: "iPod Touch"}, 4691 {category: "Electronics", price: "$399.99", stocked: true, name: "iPhone 5"}, 4692 {category: "Electronics", price: "$199.99", stocked: true, name: "Nexus 7"} 4693] 4694 4695class FilterableProductTable extends React.Component { 4696 display_list_arr = []; 4697 4698 constructor(props) { 4699 super(props); 4700 console.log(props.json); 4701 this.display_list_arr = props.json; 4702 4703 this.state = {search_term: "", fg_do_stock_filter: false}; 4704 4705 this.onChangeSearch = this.onChangeSearch.bind(this); 4706 this.onChangeFilter = this.onChangeFilter.bind(this); 4707 } // constructor(props) 4708 4709 onChangeSearch(e) { 4710 console.log(e.target.value); 4711 this.setState({search_term: e.target.value, fg_do_stock_filter: this.state.fg_do_stock_filter}); 4712 } // onChangeSearch(e) 4713 4714 onChangeFilter(e) { 4715 console.log(e.target.checked); 4716 this.setState({search_term: this.state.search_term, fg_do_stock_filter: e.target.checked}); 4717 //this.render(); 4718 } // onChangeFilter(e) 4719 4720 render() { 4721 console.log("this.state.search_term: " + this.state.search_term); 4722 console.log("this.state.fg_do_stock_filter: " + this.state.fg_do_stock_filter); 4723 4724 return ( 4725 <div> 4726 <SearchBar onChangeSearch={this.onChangeSearch} searchTerm={this.state.search_term} doStockFilter={this.state.fg_do_stock_filter} onChangeFilter={this.onChangeFilter} /> 4727 <ProductTable list={this.display_list_arr} searchTerm={this.state.search_term} doStockFilter={this.state.fg_do_stock_filter} /> 4728 </div> 4729 ); 4730 } // render() 4731} // class FilterableProductTable extends React.Component 4732 4733class SearchBar extends React.Component { 4734 4735 props; 4736 4737 constructor(props) { 4738 super(props); 4739 this.props = props; 4740 } // constructor(props) 4741 4742 render() { 4743 4744 return ( 4745 <form> 4746 <input type="text" name="search" onChange={this.props.onChangeSearch} value={this.props.searchTerm} placeHolder="Enter item name" /> 4747 <input type="checkbox" name="stock_filter" onChange={this.props.onChangeFilter} value={this.props.doStockFilter} /> In stock only 4748 </form> 4749 ); 4750 } // render() 4751} // class SearchBar extends React.Component 4752 4753class ProductTable extends React.Component { 4754 4755 display_category_item_map = new Map(); 4756 display_list = []; 4757 //search_term = ""; 4758 //fg_do_stock_filter = false; 4759 //myprops = null; 4760 4761 constructor(props) { 4762 super(props); 4763 4764 //this.search_term = props.searchTerm; 4765 //this.fg_do_stock_filter = props.doStockFilter; 4766 //this.processList(props.list, props.searchTerm, props.doStockFilter); 4767 this.display_list = props.list; 4768 //this.myprops = props; 4769 } // constructor(props) 4770 4771 processList(list, search_term, fg_do_stock_filter) { 4772 4773 this.display_category_item_map.clear(); // reset 4774 4775 for(let item of list) { 4776 4777 console.log("fg_do_stock_filter", fg_do_stock_filter); 4778 console.log("search_term", search_term); 4779 console.log('item: ', item); 4780 4781 if(fg_do_stock_filter && !item.stocked) 4782 { 4783 console.log('skipped: ', item); 4784 continue; // skip 4785 } 4786 4787 if(search_term != "" && item.name.toLowerCase().indexOf(search_term.toLowerCase()) == -1) 4788 continue; // skip 4789 4790 let display_item_list = this.display_category_item_map.get(item.category); 4791 4792 if(display_item_list == null) 4793 { 4794 display_item_list = []; 4795 this.display_category_item_map.set(item.category, display_item_list); 4796 } 4797 4798 console.log('added: ', item); 4799 display_item_list.push(item); 4800 } // for(let item of list) 4801 } // processList(list) 4802 4803 render() { 4804 4805 this.processList(this.display_list, this.props.searchTerm, this.props.doStockFilter); 4806 4807 let categories = [] 4808 let keys = this.display_category_item_map.keys(); 4809 for(let category_name of keys) { 4810 categories.push(category_name); 4811 } 4812 4813 console.log(categories); 4814 4815 let display_category_arr = categories.map((key) => 4816 <ProductCategoryRow key={key} name={key} products={this.display_category_item_map.get(key)} /> 4817 ); 4818 4819 return ( 4820 <table><tbody><tr><td>Name</td><td>Price</td></tr> 4821 {display_category_arr} 4822 </tbody></table> 4823 ); 4824 } // render() 4825} // class ProductTable extends React.Component 4826 4827class ProductCategoryRow extends React.Component { 4828 name = ''; 4829 4830 constructor(props) { 4831 super(props); 4832 this.name = props.name; 4833 } // constructor(props) 4834 4835 render() { 4836 return ( 4837 <tr><td colSpan='2'><table><tbody> 4838 <tr><td colSpan='2'>{this.name}</td></tr> 4839 <ProductRow products={this.props.products} /> 4840 </tbody></table></td></tr> 4841 ); 4842 } // render() 4843} // class ProductCategoryRow extends React.Component 4844 4845class ProductRow extends React.Component { 4846 //products = []; 4847 4848 constructor(props) { 4849 super(props); 4850 console.log('props.products', props.products); 4851 //this.products = props.products; 4852 } // constructor(props) 4853 4854 render() { 4855 4856 let product_items = this.props.products.map((product, index) => 4857 <tr key={index} ><td>{product.name}</td><td>{product.price}</td></tr> 4858 ); 4859 4860 console.log("product_items", product_items); 4861 4862 return product_items; 4863 } // render() 4864} // class ProductRow extends React.Component 4865 4866function SimpleDialog(props) { 4867 return ( 4868 <div> 4869 <h1 className="Dialog-title"> 4870 {props.title} 4871 </h1> 4872 <p className="Dialog-message"> 4873 {props.message} 4874 </p> 4875 {props.children} 4876 </div> 4877 ); 4878} 4879 4880class LoginDialog extends React.Component 4881{ 4882 constructor(props) 4883 { 4884 super(props); 4885 this.handleUserChange = this.handleUserChange.bind(this); 4886 this.handlePassChange = this.handlePassChange.bind(this); 4887 this.handleLogin = this.handleLogin.bind(this); 4888 this.state = {user: '', pass: ''}; 4889 } // constructor(props) 4890 4891 render() { 4892 return ( 4893 <SimpleDialog title="Login" message="Enter Credentials"> 4894 Username <input value={this.state.user} onChange={this.handleUserChange} />
4894<br /> 4895 PassWord <input value={this.state.pass} onChange={this.handlePassChange} type="password" /><br /> 4896 <button onClick={this.handleLogin}>Login</button> 4897 </SimpleDialog> 4898 ); // return 4899 } // render() 4900 4901 handleUserChange(e) { 4902 this.setState({user: e.target.value, pass: this.state.pass}); 4903 } // handleChange(e) 4904 4905 handlePassChange(e) { 4906 this.setState({user: this.state.user, pass: e.target.value}); 4907 } // handlePassChange(e) 4908 4909 handleLogin() { 4910 if(this.state.user) 4911 alert(`Sorry, ${this.state.user}!`); 4912 } // handleLogin() 4913 4914} // class LoginDialog extends React.Component 4915 4916class CaptureDialog extends React.Component 4917{ 4918 coordCapture = new L.Control.Coordinates(); 4919 4920 constructor(props) 4921 { 4922 super(props); 4923 this.handleLatChange = this.handleLatChange.bind(this); 4924 this.handleLngChange = this.handleLngChange.bind(this); 4925 this.handleToggle = this.handleToggle.bind(this); 4926 this.onMapClick = this.onMapClick.bind(this); 4927 this.state = {lat: '', lng: '', fg_capture: false}; 4928 4929 } // constructor(props) 4930 4931 render() { 4932 return ( 4933 <SimpleDialog title="Capture" message="Capture!"> 4934 Lat <input value={this.state.user} onChange={this.handleLatChange} /><br /> 4935 Lng <input value={this.state.pass} onChange={this.handleLngChange} /><br /> 4936 <button onClick={this.handleToggle}>Toggle</button> 4937 </SimpleDialog> 4938 ); // return 4939 } // render() 4940 4941 handleLatChange(e) { 4942 console.log(this.state); 4943 this.setState({lat: e.target.value, lng: this.state.lng, fg_capture: this.state.fg_capture}); 4944 } // handleChange(e) 4945 4946 handleLngChange(e) { 4947 console.log(this.state); 4948 this.setState({lat: this.state.lat, lng: e.target.value, fg_capture: this.state.fg_capture}); 4949 } // handlePassChange(e) 4950 4951 handleToggle(e) { 4952 let fg_toggle = !this.state.fg_capture; 4953 4954 console.log(this.coordCapture); 4955 4956 if(fg_toggle) { 4957 //console.log(this.state); 4958 this.coordCapture.addTo(mymap); 4959 mymap.on('click', this.onMapClick); 4960 4961 } // if(fg_toggle) 4962 else 4963 { 4964 this.coordCapture.remove(mymap); 4965 } 4966 4967 4968 this.setState({lat: this.state.lat, lng: this.state.lng, fg_capture: fg_toggle}); 4969 console.log(this.state); 4970 } // handleLogin() 4971 4972 onMapClick(e) { 4973 console.log(e); 4974 if(this.state.fg_capture) 4975 this.coordCapture.setCoordinates(e); 4976 } // function onMapClick(e) 4977 4978} // class CaptureDialog extends React.Component 4979 4980let fg_react_loaded = false; 4981 4982function loadReact() { 4983 if(fg_react_loaded) 4984 return; // skip. 4985 else 4986 fg_react_loaded = true; 4987 4988 const element = <div><LoginDialog /></div>; 4989 ReactDOM.render( 4990 element, 4991 document.getElementById('root') 4992 ); 4993 4994 const captureElement = <div><CaptureDialog /></div>; 4995 ReactDOM.render( 4996 captureElement, 4997 document.getElementById('settingsRoot') 4998 ); 4999 5000} // function loadReact() 5001 5002function loadReact3() 5003{ 5004 if(fg_react_loaded) 5005 return; // skip. 5006 else 5007 fg_react_loaded = true; 5008 5009 const user = { 5010 firstName: 'Harper', 5011 lastName: 'Perez3' 5012 } 5013 5014 const messages1 = []; 5015 const messages = ['React', 'Re: React', 'Re:Re: React']; 5016 5017 const numbers = [1, 2, 3, 4, 5, 6]; 5018 const listItems = NumberList(numbers); 5019 5020 const posts = [ 5021 {id: 1, title: 'Hello World', content: 'Welcome to learning React!'}, 5022 {id: 2, title: 'Installation', content: 'You can install React from npm.'}, 5023 {id: 3, title: 'Tutorials', content: 'Have to learn...'} 5024 ]; 5025 5026 const element = <div>{getGreeting(user)}<h2>Good to see you here!</h2><FilterableProductTable json={product_arr} /><SignUpDialog /><Calculator /><Reservation /><NameForm /><EssayForm /><Form /><FlavorForm /><LoginControl /><Blog posts={posts} /><Mailbox unreadMessages={messages} /><WarnPage /><Toggle />list: <ul>{listItems}</ul><div id='time' /><WelcomeParty /><Comment author={author} /></div>; 5027 ReactDOM.render( 5028 element, 5029 document.getElementById('root') 5030 ); 5031 5032 //function tick() 5033 //{ 5034 ReactDOM.render(<Clock3 />, document.getElementById('time')); 5035 //} // function tick() 5036 5037 //setInterval(tick, 1000); 5038} // function loadReact() 5039 </script>
5039 5040 5041
5041<script src="https://jhammann.github.io/sakura/dist/sakura.js"></script>
5041 5042
5042<script> 5043 //var sakura = new Sakura('#mapid'); 5044 </script>
5044 5045 5046
5046<script src="js/jquery-sakura.min.js"></script>
5046 5047
5048<script> 5049 // domReady 5050 //$(function() { 5051 //$('body').sakura(); 5052 //}); 5053 5054 // windowLoad 5055 $(window).load(function() { 5056 ////$('div#mapid').sakura(); 5057 }); 5058</script>
5058 5059 5060<div id="loader"><div id="loader_logo"><img id="loader_logo" src='images/tenatchmas.png'></div><div id="loader_spinner"></div></div> 5061<div id="mapid"></div> 5062 5063<div id="dialog" class="view_hidden" title="Suggest an event"> 5064 <form> 5065 <textarea id="myTextarea" rows="4" placeholder="Type something here..."></textarea> 5066 <div><input type="text" id="address" name="address" placeholder="event address..." /><button type="button" onclick="findLatLng()">Find</button></div> 5067 5068 <div class="output"></div> 5069 <input id="dialog_submit" class="view_hidden" type="submit" value="Submit event suggestion" disabled /> 5070 </form> 5071</div> 5072 5073 5074<div id="sidebar" class="leaflet-sidebar collapsed view_hidden"> 5075 <!-- Nav tabs --> 5076 <div class="leaflet-sidebar-tabs"> 5077 <ul role="tablist"> <!-- top aligned tabs --> 5078 5079 <li><a href="#home" role="tab"><img src='favicon.ico' width="40"></a></li--> 5080 <li class="disabled"><a href="#messages" role="tab"><i class="fa fa-envelope"></i></a></li> 5081 <li><a href="#profile" role="tab"><i class="fa fa-user"></i></a></li> 5082 </ul> 5083 5084 <ul role="tablist"> <!-- bottom aligned tabs --> 5085 <li><a href="#settings" role="tab"><i class="fa fa-gear"></i></a></li> 5086 </ul> 5087 </div> 5088 5089 <!-- Tab panes --> 5090 <div class="leaflet-sidebar-content"> 5091 <div class="leaflet-sidebar-pane" id="home"> 5092 <h1 class="leaflet-sidebar-header"> 5093 Who are We? 5094 <div class="leaflet-sidebar-close"><i class="fa fa-caret-left"></i></div> 5095 </h1> 5096 <p>Grouping Local Small Business Entrepreneurs into Great Spaces</p> 5097 <p>Tenatch's vision is to create an impactful platform that supports local small business entrepreneurs by combining complementary businesses from all social and cultural backgrounds expand their business opportunities and create a more sustainable future.</p> 5098 <p>We want to get you out of the building, and enjoy the fine city you are living in!</p> 5099 <a href="https://tenatch.ca" target="_blank"><img src="images/tenatch_bnm.jpeg" /></a> 5100 </div> 5101 5102 <div class="leaflet-sidebar-pane" id="messages"> 5103 <h1 class="leaflet-sidebar-header">Messages<div class="leaflet-sidebar-close"><i class="fa fa-caret-left"></i></div></h1> 5104 </div> 5105 5106 <div class="leaflet-sidebar-pane" id="profile"> 5107 <h1 class="leaflet-sidebar-header">Profile<div class="leaflet-sidebar-close"><i class="fa fa-caret-left"></i></div></h1> 5108 <div id="root"></div> 5109 </div> 5110 5111 <div class="leaflet-sidebar-pane" id="settings"> 5112 <h1 class="leaflet-sidebar-header"> 5113 Settings 5114 <div class="leaflet-sidebar-close"><i class="fa fa-caret-left"></i></div> 5115 </h1> 5116 <div id="settingsRoot"></div> 5117 </div> 5118 5119 </div> 5120 5121</div> 5122<div id="overlay"></div> 5123 5124 5125</body> 5126</html>
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.