Load mapillary viewer assets dynamically from CDN

This commit is contained in:
Bryan Housel
2016-05-29 23:07:37 -04:00
parent a99f54b83b
commit 6788f7932a
12 changed files with 84 additions and 207 deletions
-5
View File
@@ -312,11 +312,6 @@ D3_FILES = \
node_modules/d3/src/xhr/index.js \
node_modules/d3/src/end.js
mapillary:
cp node_modules/mapillary-js/dist/mapillary-js.min.css dist/mapillary/mapillary.css
cp node_modules/mapillary-js/dist/*.svg dist/mapillary
cp node_modules/mapillary-js/dist/mapillary-js.min.js dist/mapillary/mapillary.js
d3:
node_modules/.bin/smash $(D3_FILES) > js/lib/d3.v3.js
@echo 'd3 rebuilt. Please reapply 7e2485d, 4da529f, and 223974d'
-1
View File
@@ -1 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" width="400" height="400" viewBox="0 0 400 400" version="1.1"><title>turn-left</title><desc>Created with Sketch.</desc><g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g transform="translate(31.000000, 29.000000)"><g transform="translate(38.753425, 20.216749)"/><path d="M305 271.7C273.9 313.2 223.9 339.6 168.1 338.6 75.5 337 1.8 260.6 3.4 168.1 5 75.5 81.4 1.8 173.9 3.4 266.5 5 340.3 81.4 338.6 173.9 338.4 188.8 336.2 203.3 332.3 216.9 325.1 209.3 317.4 202.2 309.4 195.8 294.8 183.9 279.3 174.3 262.9 166.7L261.8 229.8C266.2 232.6 270.4 235.7 274.4 238.9 282.4 245.4 295.3 259.8 305 271.7L305 271.7 305 271.7ZM285.7 249.6C260.1 286.8 217 310.8 168.6 310 91.8 308.6 30.7 245.3 32 168.6 33.4 91.8 96.7 30.7 173.4 32 250.2 33.4 311.3 96.7 310 173.4 309.9 180.6 309.2 187.7 308 194.6 293.8 183.3 278.8 174 262.9 166.7L261.8 229.8C266.2 232.6 270.4 235.7 274.4 238.9 277.6 241.5 281.5 245.3 285.7 249.6L285.7 249.6 285.7 249.6Z" fill="#FFFFFF"/><g transform="translate(111.205479, 69.073892)"><g transform="translate(128.897260, 105.295567) rotate(-90.000000) translate(-128.897260, -105.295567) translate(23.589041, -23.586207)"/></g><path d="M219 246.6C221.9 249.5 221.9 254.2 219 257.1L203.3 272.8C200.4 275.6 195.8 275.7 192.9 272.8L98.6 178.6C97.9 177.8 97.3 176.8 96.9 175.9 95.4 173.1 95.8 169.5 98.2 167.1L192.4 72.9C195.3 70 200 70 202.9 72.9L218.6 88.6C221.5 91.5 221.5 96.2 218.6 99.1L163.6 154.1C168.7 153.8 190.2 151.8 217.9 158.6 245 165.2 271.9 177.6 296.9 197.1 317.1 212.9 335.3 232.8 351.1 257.1 352.6 259.5 353.4 265.5 350.3 267.4 344.8 270.7 336.2 276 331 279.1 329.1 280.3 324.4 281.2 320.9 275.7 317.4 270.1 292 238.2 275.1 225 254.2 208.7 231.6 199.4 209.6 193 183.1 185.2 161.7 187.2 161.7 187.2L219 246.6 219 246.6Z" fill="#FFFFFF"/></g></g></svg>

Before

Width:  |  Height:  |  Size: 1.8 KiB

-15
View File
@@ -1,15 +0,0 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="180px" height="180px" viewBox="0 0 180 180" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
<!-- Generator: Sketch 3.4.4 (17249) - http://www.bohemiancoding.com/sketch -->
<title>arrow-up</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
<g id="arrow-up" sketch:type="MSArtboardGroup" fill="#F5DEB3">
<g sketch:type="MSLayerGroup">
<path d="M88.8843817,45.7378806 C88.2998853,45.9497916 87.7515692,46.2899299 87.2830853,46.7584138 L31.3633947,102.678104 C29.6460614,104.395438 29.6518363,107.170498 31.3670031,108.885664 L40.6867453,118.205407 C42.4003967,119.919058 45.1811313,119.922189 46.8943052,118.209015 L90.8009276,74.3023926 L134.45055,117.952015 C136.167883,119.669349 138.942943,119.663574 140.65811,117.948407 L149.977852,108.628665 C151.691504,106.915013 151.694635,104.134279 149.981461,102.421105 L94.0617701,46.5014141 C92.6573109,45.0969549 90.5454231,44.8449445 88.8843817,45.7378806 L88.8843817,45.7378806 Z" id="Arrow" sketch:type="MSShapeGroup"></path>
<path d="M90,170.138812 C134.259444,170.138812 170.138812,134.259444 170.138812,90 C170.138812,45.7405562 134.259444,9.86118785 90,9.86118785 C45.7405562,9.86118785 9.86118785,45.7405562 9.86118785,90 C9.86118785,134.259444 45.7405562,170.138812 90,170.138812 L90,170.138812 L90,170.138812 Z M0,90 C0,40.2943725 40.2943725,0 90,0 C139.705627,0 180,40.2943725 180,90 C180,139.705627 139.705627,180 90,180 C40.2943725,180 0,139.705627 0,90 Z" id="Circle" sketch:type="MSShapeGroup"></path>
</g>
</g>
</g>
</svg>

Before

Width:  |  Height:  |  Size: 1.8 KiB

-15
View File
@@ -1,15 +0,0 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="180px" height="180px" viewBox="0 0 180 180" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
<!-- Generator: Sketch 3.4.4 (17249) - http://www.bohemiancoding.com/sketch -->
<title>arrow-up</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
<g id="arrow-up" sketch:type="MSArtboardGroup" fill="#FFFFFF">
<g sketch:type="MSLayerGroup">
<path d="M88.8843817,45.7378806 C88.2998853,45.9497916 87.7515692,46.2899299 87.2830853,46.7584138 L31.3633947,102.678104 C29.6460614,104.395438 29.6518363,107.170498 31.3670031,108.885664 L40.6867453,118.205407 C42.4003967,119.919058 45.1811313,119.922189 46.8943052,118.209015 L90.8009276,74.3023926 L134.45055,117.952015 C136.167883,119.669349 138.942943,119.663574 140.65811,117.948407 L149.977852,108.628665 C151.691504,106.915013 151.694635,104.134279 149.981461,102.421105 L94.0617701,46.5014141 C92.6573109,45.0969549 90.5454231,44.8449445 88.8843817,45.7378806 L88.8843817,45.7378806 Z" id="Arrow" sketch:type="MSShapeGroup"></path>
<path d="M90,170.138812 C134.259444,170.138812 170.138812,134.259444 170.138812,90 C170.138812,45.7405562 134.259444,9.86118785 90,9.86118785 C45.7405562,9.86118785 9.86118785,45.7405562 9.86118785,90 C9.86118785,134.259444 45.7405562,170.138812 90,170.138812 L90,170.138812 L90,170.138812 Z M0,90 C0,40.2943725 40.2943725,0 90,0 C139.705627,0 180,40.2943725 180,90 C180,139.705627 139.705627,180 90,180 C40.2943725,180 0,139.705627 0,90 Z" id="Circle" sketch:type="MSShapeGroup"></path>
</g>
</g>
</g>
</svg>

Before

Width:  |  Height:  |  Size: 1.8 KiB

-13
View File
@@ -1,13 +0,0 @@
.mapillary-js{background-color:#000;width:320px;height:240px;position:relative;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.Rect,.domRenderer,.rectContainer{position:absolute}.domRenderer{width:100%;height:100%;z-index:10;overflow:hidden}.rectContainer{top:0;right:0;bottom:0;left:0;z-index:10}.Rect{outline:#0f0 solid 2px}
.Attribution{background-color:rgba(0,0,0,.5);color:#fff;font-family:Arial,Helvetica,sans-serif;font-size:11px;position:absolute;bottom:0;right:0;z-index:10;padding:4px 2px}.Attribution a,.Attribution span{color:#fff;text-decoration:none;margin:0 2px 4px}.Attribution a:hover{color:#35af6d}
.Background p,.BackgroundWrapper{font-family:Helvetica,Arial,sans-serif}.BackgroundWrapper{background-color:#000;position:absolute;top:0;bottom:0;left:0;right:0;z-index:-1;color:#fff;text-align:center;padding-top:30%}.Background p{position:relative;padding:5px;font-size:12px;text-shadow:0 0 5px rgba(0,0,0,.75)}
@-webkit-keyframes uil-ripple{0%{width:0;height:0;opacity:0;margin:0}33%{width:44%;height:44%;margin:-22% 0 0 -22%;opacity:1}100%{width:88%;height:88%;margin:-44% 0 0 -44%;opacity:0}}@keyframes uil-ripple{0%{width:0;height:0;opacity:0;margin:0}33%{width:44%;height:44%;margin:-22% 0 0 -22%;opacity:1}100%{width:88%;height:88%;margin:-44% 0 0 -44%;opacity:0}}.uil-ripple-css{background:0 0;position:relative;width:100px;height:100px;top:-32px;left:-28px}.uil-ripple-css div{position:absolute;top:50%;left:50%;margin:0;width:0;height:0;opacity:0;border-radius:50%;border-width:12px;border-style:solid;-webkit-animation:uil-ripple 2s ease-out infinite;animation:uil-ripple 2s ease-out infinite}.Cover,.CoverBackground{top:0;right:0;bottom:0;left:0}.uil-ripple-css div:nth-of-type(1){border-color:rgba(255,255,255,.5)}.uil-ripple-css div:nth-of-type(2){border-color:#fff;-webkit-animation-delay:1s;animation-delay:1s}.Cover{position:absolute;width:100%;height:100%;background-color:rgba(0,0,0,.5);z-index:20;overflow:hidden;cursor:pointer;transition:opacity .2s ease-in-out}.CoverBackground{transition:all ease-in-out 250ms,-webkit-filter ease-in-out .1s;transition:all ease-in-out 250ms,filter ease-in-out .1s;transition:all ease-in-out 250ms,filter ease-in-out .1s,-webkit-filter ease-in-out .1s;-webkit-filter:blur(3px);filter:blur(3px);position:absolute;background-size:cover;background-position:center;z-index:-10}.Cover:hover .CoverBackground{-webkit-filter:blur(0);filter:blur(0)}.Cover.CoverDone>.CoverBackground{top:0;right:0;bottom:0;left:0;z-index:100}.CoverDone{visibility:hidden;opacity:0}.CoverButton{position:absolute;top:50%;left:50%;width:80px;height:70px;margin-left:-40px;margin-top:-35px;overflow:hidden;background-color:rgba(0,0,0,.6);color:#fff;border-radius:6px;border:none;padding:5px}.CoverButton:focus{outline:0}.CoverButtonIcon{display:inline-block;height:60px;width:60px;background:url(pano.svg);background-size:contain}.CoverButton:hover{background-color:rgba(0,0,0,.8);cursor:pointer}
.Debug,.DebugButton{background-color:#0f0;z-index:100}.Debug{position:fixed;top:0;right:0;bottom:0;width:30em;font-size:12px;padding:1em;font-family:Input,Menlo,monospace}.DebugButton{color:#fff;border:1px solid #fff;border-radius:2px;cursor:pointer;cursor:hand}.DebugButtonFixed{position:absolute;bottom:2px;left:2px}
.rectContainer{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.Rect{position:absolute;outline:#0f0 solid 2px}
.Directions,.DirectionsWrapper{display:block;pointer-events:none;position:absolute}.Directions{bottom:75px;left:50%}.DirectionsWrapper{width:100%;height:100px;bottom:0;overflow:visible}.DirectionsArrowDisabled,.DirectionsArrowPano,.DirectionsArrowStep{position:absolute;top:50%;left:50%;margin-left:-27px;margin-top:-27px;width:54px;height:54px;pointer-events:all}.DirectionsArrowPano,.DirectionsArrowStep{opacity:.8}.DirectionsArrowDisabled,.DirectionsArrowStep{background:url(arrow-up-white.svg);background-size:contain}.DirectionsArrowDisabled{opacity:.2;z-index:-10}.DirectionsArrowPano{background:url(arrow-up-wheat.svg);background-size:contain}.TurnLeft,.TurnRight{background:url(arrow-left.svg)}.DirectionsArrowPano:hover,.DirectionsArrowStep:hover{cursor:pointer;cursor:hand;opacity:1!important}.TurnAround,.TurnLeft,.TurnRight{opacity:.8;position:absolute;height:54px;width:54px;bottom:40px;cursor:pointer;cursor:hand;pointer-events:all}.TurnLeft,.TurnRight{-webkit-filter:drop-shadow(0 2px 1px rgba(0, 0, 0, .8));filter:drop-shadow(0 2px 1px rgba(0, 0, 0, .8))}.TurnAround:hover,.TurnLeft:hover,.TurnRight:hover{opacity:1}.TurnLeft{left:10px;background-size:contain;-webkit-transform:rotateX(60deg);transform:rotateX(60deg)}.TurnRight{right:10px;background-size:contain;-webkit-transform:rotateX(60deg) scaleX(-1);transform:rotateX(60deg) scaleX(-1)}.TurnAround{-webkit-filter:drop-shadow(-2px 0 1px rgba(0, 0, 0, .8));filter:drop-shadow(-2px 0 1px rgba(0, 0, 0, .8));left:10px;bottom:0;background:url(arrow-left.svg);background-size:contain;-webkit-transform:rotateX(60deg) rotateZ(270deg) scale(1.15,1.15);transform:rotateX(60deg) rotateZ(270deg) scale(1.15,1.15)}
.Loading{width:100%;height:2px;z-index:100;position:absolute;top:0}.LoadingBar{height:4px;position:relative;background-color:rgba(53,175,109,.8);transition:opacity .1s}
.NavigationComponent{bottom:0;left:0;position:absolute;right:0;top:0;z-index:5}.Direction{color:#fff;font-family:Helvetica,Arial,sans-serif;position:absolute;margin:.1rem;text-shadow:0 0 5px rgba(0,0,0,.75);background:url(arrow-up-white.svg);background-size:contain;width:1.3rem;height:1.3rem;display:block}.DirectionHidden{display:none}.DirectionForward{top:0;left:50%;-webkit-transform:translate(-50%,0);transform:translate(-50%,0)}.DirectionBackward{bottom:0;left:50%;-webkit-transform:translate(-50%,0) rotate(180deg);transform:translate(-50%,0) rotate(180deg)}.DirectionLeft{left:0;top:50%;-webkit-transform:translate(0,-50%) rotate(-90deg);transform:translate(0,-50%) rotate(-90deg)}.DirectionRight{right:0;top:50%;-webkit-transform:translate(0,-50%) rotate(90deg);transform:translate(0,-50%) rotate(90deg)}.DirectionTurnleft{left:0;top:0;-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}.DirectionTurnright{right:0;top:0;-webkit-transform:rotate(45deg);transform:rotate(45deg)}.DirectionTurnaround{left:0;bottom:0;-webkit-transform:rotate(-135deg);transform:rotate(-135deg)}
.RouteFrame{background-color:rgba(0,0,0,.5);outline:rgba(255,255,255,.5) solid 1px;width:80%;height:40px;text-align:center;color:#fff;margin:0 auto;position:absolute;z-index:40;bottom:30%;left:10%}.RouteFrame p{margin:0;padding:10px;font-family:Helvetica,Arial,sans-serif;font-size:14px;text-shadow:0 0 5px rgba(0,0,0,.75)}
.InSeq{position:absolute;top:0;height:120px;background:linear-gradient(to bottom,rgba(0,0,0,0) 10%,rgba(0,0,0,.65) 50%,rgba(0,0,0,0) 90%);width:24px}.NextInSeq:hover,.PrevInSeq:hover{opacity:1}.NextInSeq,.PrevInSeq{background:url(next-prev.svg);background-size:contain;opacity:.8;width:24px;height:48px;cursor:pointer;cursor:hand;-webkit-filter:drop-shadow(0 0 1px rgba(0, 0, 0, .8));filter:drop-shadow(0 0 1px rgba(0, 0, 0, .8))}.NextInSeq{margin-top:14px}.PrevInSeq{-webkit-transform:scaleY(-1);transform:scaleY(-1)}.InSeqDisabled,.InSeqDisabled:hover{background:url(next-prev.svg);cursor:not-allowed;opacity:.5}.PanoIndication{position:absolute;top:5px;right:5px;width:32px;height:24px;background:url(pano-icon.svg);background-size:contain;opacity:.8}
.SliderWrapper{text-align:center;position:absolute;bottom:40px;left:0;right:0}.SliderControl{max-width:60%;padding:4px;box-sizing:border-box;display:block;width:100%;margin:0 auto;marginTop:10px;cursor:pointer;color:inherit;background-color:rgba(255,255,255,.2);background-clip:'content-box';border-radius:999px;-webkit-appearance:none;-moz-appearance:none;appearance:none}.SliderControl::-webkit-slider-thumb{width:22px;height:22px;background:#474A4E;box-shadow:0 2px 4px 0 rgba(0,0,0,.5);border:2px solid #fff;border-radius:999px;-webkit-appearance:none}.SliderControl::-moz-range-thumb{width:22px;height:22px;background:#474A4E;box-shadow:0 2px 4px 0 rgba(0,0,0,.5);border:2px solid #fff;border-radius:999px;-moz-appearance:none;appearance:none}.SliderControl:focus{outline:0}
.TagMover,.TagResizer,.TagVertex{-webkit-transform:translate(-50%,-50%)}.TagContainer{position:absolute;top:0;right:0;bottom:0;left:0;z-index:-1;pointer-events:none}.TagSymbol{cursor:default}.TagMover,.TagResizer{transform:translate(-50%,-50%);pointer-events:all}.TagMover{border-radius:7px;width:14px;height:14px;opacity:.2}.TagMover:hover{opacity:.5}.TagResizer{border-radius:10px;width:20px;height:20px;opacity:0}.TagResizer:hover{opacity:.3}.TagVertex{transform:translate(-50%,-50%);pointer-events:none;border-radius:3px;width:6px;height:6px}.TagInteractor,.TagSpotInteractor{-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);pointer-events:all;border-radius:7px;width:14px;height:14px;opacity:0}.TagInteractor{background:#ff4500}.TagInteractor:hover{opacity:.6}.TagSpotInteractor:hover{opacity:.3}
-39
View File
File diff suppressed because one or more lines are too long
-12
View File
@@ -1,12 +0,0 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="24px" height="48px" viewBox="0 0 24 48" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
<!-- Generator: Sketch 3.4.4 (17249) - http://www.bohemiancoding.com/sketch -->
<title>next-prev</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
<g id="next-prev" sketch:type="MSArtboardGroup" fill="#FFFFFF">
<path d="M21.6039352,44 L3,44 L3,13.303507 L12.3004282,4 L21.6023958,13.3019676 L21.6039352,44 Z M6.18420282,13.7116538 L12.2642395,7.63161717 L18.6410272,13.711654 L12.2642396,11.9389206 L6.18420282,13.7116538 Z" id="Rectangle-6" sketch:type="MSShapeGroup"></path>
</g>
</g>
</svg>

Before

Width:  |  Height:  |  Size: 906 B

-14
View File
@@ -1,14 +0,0 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="145px" height="114px" viewBox="0 0 145 114" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
<!-- Generator: Sketch 3.4.4 (17249) - http://www.bohemiancoding.com/sketch -->
<title>pano</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
<g id="pano" sketch:type="MSLayerGroup" transform="translate(4.000000, 6.000000)">
<path d="M136.427616,101.807648 C136.427616,101.807648 103.95513,92.4055621 68.5000001,92.4055621 C33.0448703,92.4055621 0.572384,101.807648 0.572384,101.807648 L0.572384,0.192352 C0.572384,0.192352 30.9846137,10.2284306 68.5000001,10.2284306 C106.015387,10.2284306 136.427616,0.192352 136.427616,0.192352 L136.427616,101.807648 L136.427616,101.807648 Z" id="Rectangle-1-Copy" stroke="#FFFFFF" stroke-width="8" sketch:type="MSShapeGroup"></path>
<path d="M65.8239308,92.4231971 C66.713742,92.4115409 67.6059227,92.4055621 68.5000001,92.4055621 C103.95513,92.4055621 136.427616,101.807648 136.427616,101.807648 L136.427616,84.2903818 L98.9050281,49.1182351 L76.9921806,75.2240455 L51.5180961,57.490618 L26.6619151,75.2240455 L15.7632278,65.691486 L1.63866675,83.6540085 L0.969168939,97.555913 L5.96006817,100.397529 C16.1005638,97.9020616 39.2901084,92.9240832 64.582964,92.4431338 L65.9122033,92.3076437 L65.8239308,92.4231971 L65.8239308,92.4231971 L65.8239308,92.4231971 Z" id="Rectangle-1-Copy-2" fill="#FFFFFF" sketch:type="MSShapeGroup"></path>
<ellipse id="Oval-1" fill="#FFFFFF" sketch:type="MSShapeGroup" cx="24.7873212" cy="29.9869603" rx="12.2647085" ry="12.2314708"></ellipse>
</g>
</g>
</svg>

Before

Width:  |  Height:  |  Size: 1.8 KiB

-20
View File
@@ -1,20 +0,0 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="256px" height="256px" viewBox="0 0 256 256" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
<!-- Generator: Sketch 3.4.4 (17249) - http://www.bohemiancoding.com/sketch -->
<title>pano</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
<g id="pano" sketch:type="MSArtboardGroup">
<g id="Rectangle-1-Copy-+-Rectangle-1-Copy-2-+-Oval-1" sketch:type="MSLayerGroup" transform="translate(61.572384, 84.192352)">
<path d="M135.855232,101.615296 C135.855232,101.615296 103.382746,92.2132101 67.9276161,92.2132101 C32.4724863,92.2132101 0,101.615296 0,101.615296 L0,0 C0,0 30.4122297,10.0360786 67.9276161,10.0360786 C105.443003,10.0360786 135.855232,0 135.855232,0 L135.855232,101.615296 Z" id="Rectangle-1-Copy" stroke="#FFFFFF" stroke-width="8" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<path d="M65.2515468,92.2308451 C66.141358,92.2191889 67.0335387,92.2132101 67.9276161,92.2132101 C103.382746,92.2132101 135.855232,101.615296 135.855232,101.615296 L135.855232,84.0980298 L98.3326441,48.9258831 L76.4197966,75.0316935 L50.9457121,57.298266 L26.0895311,75.0316935 L15.1908438,65.499134 L1.06628275,83.4616565 L0.396784939,97.363561 L5.38768417,100.205177 C15.5281798,97.7097096 38.7177244,92.7317312 64.01058,92.2507818 L65.3398193,92.1152917 L65.2515468,92.2308451 L65.2515468,92.2308451 Z" id="Rectangle-1-Copy-2" fill="#FFFFFF" sketch:type="MSShapeGroup"></path>
<ellipse id="Oval-1" fill="#FFFFFF" sketch:type="MSShapeGroup" cx="24.2149372" cy="29.7946083" rx="12.2647085" ry="12.2314708"></ellipse>
</g>
<path d="M218.346443,139.284176 L218.346443,151.634652 L252.65332,134.481213 L218.346443,117.327775 L218.346443,128.305975 L207.368243,128.305975 L207.368243,139.284176 L218.346443,139.284176 Z" id="Triangle-1-Copy-3" fill="#FFFFFF" sketch:type="MSShapeGroup"></path>
<path d="M40.6535565,139.284176 L40.6535565,151.634652 L6.34667969,134.481213 L40.6535565,117.327775 L40.6535565,128.305975 L51.6317571,128.305975 L51.6317571,139.284176 L40.6535565,139.284176 Z" id="Triangle-1-Copy-4" fill="#FFFFFF" sketch:type="MSShapeGroup"></path>
<path d="M134.336433,73.2141516 L146.686909,73.2141516 L129.53347,38.9072747 L112.380032,73.2141516 L123.358232,73.2141516 L123.358232,84.1923522 L134.336433,84.1923522 L134.336433,73.2141516 Z" id="Triangle-1-Copy-5" fill="#FFFFFF" sketch:type="MSShapeGroup"></path>
<path d="M134.336433,196.785848 L146.686909,196.785848 L129.53347,231.092725 L112.380032,196.785848 L123.358232,196.785848 L123.358232,185.807648 L134.336433,185.807648 L134.336433,196.785848 Z" id="Triangle-1-Copy-6" fill="#FFFFFF" sketch:type="MSShapeGroup"></path>
</g>
</g>
</svg>

Before

Width:  |  Height:  |  Size: 3.0 KiB

-2
View File
@@ -6,7 +6,6 @@
<link rel='stylesheet' href='css/reset.css'>
<link rel='stylesheet' href='css/map.css'>
<link rel='stylesheet' href='css/app.css'>
<link rel='stylesheet' href='dist/mapillary/mapillary.css'>
<!-- mobile devices -->
<meta name='viewport' content='initial-scale=1.0 maximum-scale=1.0'>
@@ -245,7 +244,6 @@
<script src='js/lib/locale.js'></script>
<script src='data/introGraph.js'></script>
<script src='dist/mapillary/mapillary.js'></script>
</head>
<body>
<div id='id-container'></div>
+66 -53
View File
@@ -2,7 +2,10 @@ iD.services.mapillary = function() {
var mapillary = {},
dispatch = d3.dispatch('loadedImages', 'loadedSigns'),
apibase = 'https://a.mapillary.com/v2/',
viewercss = 'https://npmcdn.com/mapillary-js@1.3.0/dist/mapillary-js.min.css',
viewerjs = 'https://npmcdn.com/mapillary-js@1.3.0/dist/mapillary-js.min.js',
clientId = 'NzNRM2otQkR2SHJzaXJmNmdQWVQ0dzo1ZWYyMmYwNjdmNDdlNmVi',
defaultKey = 'ytfE1_iD_N-jmHfTHkj1Ug',
maxResults = 1000,
tileZoom = 14;
@@ -18,16 +21,65 @@ iD.services.mapillary = function() {
}
function loadSignDefs(context) {
if (!iD.services.mapillary.sign_defs) {
iD.services.mapillary.sign_defs = {};
_.each(['au', 'br', 'ca', 'de', 'us'], function(region) {
d3.json(context.asset('traffico/string-maps/' + region + '-map.json'), function(err, data) {
if (err) return;
if (region === 'de') region = 'eu';
iD.services.mapillary.sign_defs[region] = data;
});
if (iD.services.mapillary.sign_defs) return;
iD.services.mapillary.sign_defs = {};
_.each(['au', 'br', 'ca', 'de', 'us'], function(region) {
d3.json(context.asset('traffico/string-maps/' + region + '-map.json'), function(err, data) {
if (err) return;
if (region === 'de') region = 'eu';
iD.services.mapillary.sign_defs[region] = data;
});
});
}
function loadViewer() {
// mapillary-wrap
var wrap = d3.select('#content').selectAll('.mapillary-wrap')
.data([0]);
var enter = wrap.enter().append('div')
.attr('class', 'mapillary-wrap')
.classed('al', true) // 'al'=left, 'ar'=right
.classed('hidden', true);
enter.append('button')
.attr('class', 'thumb-hide')
.on('click', function () { mapillary.hideViewer(); })
.append('div')
.call(iD.svg.Icon('#icon-close'));
enter.append('div')
.attr('id', 'mly')
.attr('class', 'mly-wrapper')
.classed('active', false);
// mapillary-viewercss
d3.select('head').selectAll('#mapillary-viewercss')
.data([0])
.enter()
.append('link')
.attr('id', 'mapillary-viewercss')
.attr('rel', 'stylesheet')
.attr('href', viewercss);
// mapillary-viewerjs
d3.select('head').selectAll('#mapillary-viewerjs')
.data([0])
.enter()
.append('script')
.attr('id', 'mapillary-viewerjs')
.attr('src', viewerjs)
.on('load', function() {
if (Mapillary) {
iD.services.mapillary.viewer = new Mapillary.Viewer('mly', clientId, defaultKey, {
baseImageSize: 320,
imagePlane: false,
cover: false,
debug: false
});
}
});
}
}
function abortRequest(i) {
@@ -148,6 +200,10 @@ iD.services.mapillary = function() {
loadTiles('signs', url, projection, dimensions);
};
mapillary.loadViewer = function() {
loadViewer();
};
// partition viewport into `psize` x `psize` regions
function partitionViewport(psize, projection, dimensions) {
@@ -205,39 +261,6 @@ iD.services.mapillary = function() {
return iD.services.mapillary.sign_defs[country][type];
};
mapillary.initViewer = function(imageKey) {
var hidden = !imageKey;
var wrap = d3.select('#content').selectAll('.mapillary-wrap')
.data([0]);
// Enter
var enter = wrap.enter().append('div')
.attr('class', 'mapillary-wrap')
.classed('al', true) // 'al'=left, 'ar'=right
.classed('hidden', hidden);
enter.append('button')
.attr('class', 'thumb-hide')
.on('click', function () { mapillary.hideViewer(); })
.append('div')
.call(iD.svg.Icon('#icon-close'));
enter.append('div')
.attr('id', 'mly')
.attr('class', 'mly-wrapper')
.classed('active', !hidden);
// if (Mapillary && !iD.services.mapillary.viewer) {
// iD.services.mapillary.viewer = new Mapillary.Viewer('mly', clientId, imageKey, {
// baseImageSize: 320,
// imagePlane: false,
// cover: false,
// debug: false
// });
// }
return mapillary;
};
mapillary.showViewer = function(imageKey) {
if (!imageKey) return;
@@ -253,17 +276,7 @@ iD.services.mapillary = function() {
if (iD.services.mapillary.viewer) {
iD.services.mapillary.viewer.moveToKey(imageKey);
} else {
mapillary.initViewer(imageKey);
if (Mapillary && !iD.services.mapillary.viewer) {
iD.services.mapillary.viewer = new Mapillary.Viewer('mly', clientId, imageKey, {
baseImageSize: 320,
imagePlane: false,
cover: false,
debug: false
});
}
loadViewer();
}
return mapillary;
+18 -18
View File
@@ -2,7 +2,7 @@ iD.svg.MapillaryImages = function(projection, context, dispatch) {
var debouncedRedraw = _.debounce(function () { dispatch.change(); }, 1000),
minZoom = 12,
layer = d3.select(null),
_mapillary, _viewer, _mlyLoading, pendingImg;
_mapillary, _viewer; //, _mlyLoading, pendingImg;
function init() {
@@ -20,13 +20,13 @@ iD.svg.MapillaryImages = function(projection, context, dispatch) {
return _mapillary;
}
function showLoading(image) {
var mapillary = getMapillary();
if (!mapillary) return;
pendingImg = image;
d3.selectAll('.layer-mapillary-images .viewfield-group, .layer-mapillary-signs .icon-sign')
.classed('loading', function(d) { return d.key === image.key; });
}
// function showLoading(image) {
// var mapillary = getMapillary();
// if (!mapillary) return;
// pendingImg = image;
// d3.selectAll('.layer-mapillary-images .viewfield-group, .layer-mapillary-signs .icon-sign')
// .classed('loading', function(d) { return d.key === image.key; });
// }
function showViewer(image) {
var mapillary = getMapillary();
@@ -39,7 +39,7 @@ iD.svg.MapillaryImages = function(projection, context, dispatch) {
_viewer.on('nodechanged', viewerNavHandler);
// To avoid edge case, when network is too slow and user clicks on multiple viewfield-groups
_viewer.on('loadingchanged', function(s) {
// _viewer.on('loadingchanged', function(s) {
// if (!s && pendingImg) {
// d3.selectAll('.layer-mapillary-images .viewfield-group, .layer-mapillary-signs .icon-sign')
// .classed('loading', function() { return false; });
@@ -49,7 +49,7 @@ iD.svg.MapillaryImages = function(projection, context, dispatch) {
// pendingImg = null;
// }
// _mlyLoading = s;
});
// });
}
}
@@ -64,18 +64,18 @@ iD.svg.MapillaryImages = function(projection, context, dispatch) {
if (_viewer) {
_viewer.off('nodechanged');
_viewer.off('loadingchanged');
// _viewer.off('loadingchanged');
_viewer = null;
}
_mlyLoading = null;
pendingImg = null;
// _mlyLoading = null;
// pendingImg = null;
}
function showLayer() {
var mapillary = getMapillary();
if (!mapillary) return;
mapillary.initViewer();
mapillary.loadViewer();
editOn();
layer
@@ -112,13 +112,13 @@ iD.svg.MapillaryImages = function(projection, context, dispatch) {
var image = mapillary.selectedImage();
if (image && image.key === d.key) return;
if (_mlyLoading) {
showLoading(d);
} else {
// if (_mlyLoading) {
// showLoading(d);
// } else {
mapillary.selectedImage(d);
context.map().centerEase(d.loc);
showViewer(d);
}
// }
}
function transform(d) {