1(self.webpackChunkone_web=self.webpackChunkone_web||[]).push([[4364],{7642:(t,e,i)=>{"use strict";var a=i(71413),o=i(52706),r=i(62905),s=i(20726),n=i(80027),l=i(63822),d=i(30466),c=i(25017),h=i(52800),p=i(67719),u=i(5074),m=Object.defineProperty,g=Object.getOwnPropertyDescriptor,v=(t,e,i,a)=>{for(var o,r=a>1?void 0:a?g(e,i):e,s=t.length-1;s>=0;s--)(o=t[s])&&(r=(a?o(e,i,r):o(r))||r);return a&&r&&m(e,i,r),r};const b=new Set;function y(){if(0===b.size)return;const t=Date.now();b.forEach((e=>{e.nowTimestamp=t}))}setInterval(y,6e4);let f=class extends a.WF{constructor(){super(...arguments),this.showTimezone=!0}render(){if(!this.timestamp||!this.timezone)return;if(!n.s1?.translations?.enabled)return(0,u.om)(this.timestamp,this.timezone,this.showTimezone,this.nowTimestamp)??void 0;const t=(0,r.utcToZonedTime)(this.timestamp,this.timezone),e=(0,r.utcToZonedTime)(this.nowTimestamp,this.timezone),i=(0,s.A)(t,e);let a=c.A;const o=(0,d.A)();"es"===o?a=h.A:"vi"===o&&(a=p.A);const m=(0,u.hv)(this.timestamp,this.timezone,a);return n.X0.simpleDateFormat?i<-6?`${m.day} ${m.month} ${m.year} ${(0,l.t)("at")} ${m.hour}:${m.minute}`:i<-1?`${(0,l.t)("Last")} ${m.weekday} ${(0,l.t)("at")} ${m.hour}:${m.minute}`.trim():i<0?`${(0,l.t)("Yesterday at")} ${m.hour}:${m.minute}`:i<1?`${(0,l.t)("Today at")} ${m.hour}:${m.minute}`:i<2?`${(0,l.t)("Tomorrow at")} ${m.hour}:${m.minute}`:i<7?`${m.weekday} ${(0,l.t)("at")} ${m.hour}:${m.minute}`:`${m.day} ${m.month} ${m.year}`:i<-6?`${m.month} ${m.day}`:i<-1?`${(0,l.t)("Last")} ${m.weekday} ${(0,l.t)("at")} ${m.hour}:${m.minute} ${m.dayPeriod} ${this.showTimezone?m.timeZoneName:""}`.trim():i<0?`${(0,l.t)("Yesterday at")} ${m.hour}:${m.minute} ${m.dayPeriod} ${this.showTimezone?m.timeZoneName:""}`.trim():i<1?`${(0,l.t)("Today at")} ${m.hour}:${m.minute} ${m.dayPeriod} ${this.showTimezone?m.timeZoneName:""}`.trim():i<2?`${(0,l.t)("Tomorrow at")} ${m.hour}:${m.minute} ${m.dayPeriod} ${this.showTimezone?m.timeZoneName:""}`.trim():i<7?`${m.weekday} ${(0,l.t)("at")} ${m.hour}:${m.minute} ${m.dayPeriod} ${this.showTimezone?m.timeZoneName:""}`.trim():`${m.month} ${m.day}`}connectedCallback(){super.connectedCallback(),b.add(this),y()}disconnectedCallback(){b.delete(this),super.disconnectedCallback()}createRenderRoot(){return this}};v([(0,o.MZ)({type:Number})],f.prototype,"timestamp",2),v([(0,o.MZ)({type:String})],f.prototype,"timezone",2),v([(0,o.MZ)({type:Boolean,attribute:"show-timezone"})],f.prototype,"showTimezone",2),v([(0,o.MZ)({type:Number})],f.prototype,"nowTimestamp",2),f=v([(0,o.EM)("relative-time")],f)},97834:(t,e,i)=>{"use strict";i.r(e),i.d(e,{default:()=>K});var a=i(71413),o=i(52706),r=i(35135),s=i(56599),n=i(5218),l=i(30555),d=i(80027),c=i(85385),h=i(39569),p=i(22708),u=i(52850),m=i(4983),g=i(10388),v=i(91780),b=i(66003),y=i(36007),f=i(57914),w=i(52657),$=i(82224),k=i(88014),x=i(95504),A=i(99863),M=i(63822),q=i(98979),C=i(85564),R=i(24634),T=i(5124),E=i(32701),S=i(38155),F=i(78707),_=i(86094),I=i(18211),O=i(42582);const L=a.AH` 2 :host { 3 position: relative; 4 } 5 .quick-buttons { 6 padding: var(--gap) 0.25rem; 7 display: flex; 8 align-items: center; 9 justify-content: space-evenly; 10 border-top: rgb(var(--silver)) solid var(--border-width); 11 } 12 .quick-button { 13 display: flex; 14 flex-wrap: wrap; 15 align-items: center; 16 justify-content: center; 17 } 18 .quick-button-icon { 19 display: inline-flex; 20 align-items: center; 21 justify-content: center; 22 height: 3rem; 23 width: 3rem; 24 background: rgb(var(--peter-river)); 25 border-radius: 3rem; 26 margin-bottom: 0.25rem; 27 transition: box-shadow 0.25s ease-in-out; 28 border: 5px solid transparent; 29 } 30 .quick-button-copy { 31 position: absolute; 32 display: flex; 33 justify-content: center; 34 align-items: flex-start; 35 height: 2rem; 36 width: calc(100% + var(--gap)); 37 left: calc(var(--gap) / -2); 38 bottom: 0; 39 text-align: center; 40 } 41 .quick-button.selected .quick-button-icon { 42 animation-name: fade-in-out; 43 animation-timing-function: linear; 44 animation-duration: 1.25s; 45 animation-iteration-count: 1; 46 animation-direction: forward; 47 opacity: 1; 48 border: 5px solid rgb(79, 169, 250); 49 } 50 .quick-button.link .quick-button-icon { 51 background: rgb(var(--peter-river-light)); 52 transition: background 1s; 53 } 54 .quick-button-btn:hover .quick-button-icon { 55 box-shadow: var(--shadow-md); 56 } 57 .quick-button.link.dashboard .quick-button-icon { 58 background: rgb(var(--sea-foam)); 59 } 60 .quick-button.selected .quick-button-copy { 61 text-decoration: underline; 62 } 63 .quick-button-btn { 64 background: none; 65 border: none; 66 max-width: 5rem; 67 padding-bottom: 2rem; 68 position: relative; 69 cursor: pointer; 70 } 71 .quick-button-icon img { 72 height: 1.75rem; 73 width: 1.75rem; 74 } 75 .quick-roadways { 76 position: relative; 77 padding: var(--gap) 0.25rem; 78 display: flex; 79 align-items: center; 80 justify-content: space-around; 81 border-top: rgb(var(--silver)) solid var(--border-width); 82 box-shadow: var(--shadow-sm); 83 } 84 .quick-roadway { 85 background-color: #fff; 86 font-size: 14px; 87 line-height: 1.5; 88 margin: 0; 89 padding: 0.25rem 0.5rem; 90 border: 1px solid rgb(var(--asbestos)); 91 color: rgb(var(--darker)); 92 border-radius: 2rem; 93 transition: box-shadow 0.25s ease-in-out; 94 } 95 .quick-roadway:hover { 96 box-shadow: var(--shadow-sm); 97 cursor: pointer; 98 } 99 .quick-roadway:active { 100 background: rgb(var(--silver)); 101 } 102 .quick-roadway-more { 103 line-height: 1.5; 104 display: flex; 105 align-items: center; 106 justify-content: center; 107 background: rgb(var(--asbestos)); 108 color: white; 109 position: relative; 110 } 111 .quick-roadway-more svg { 112 width: 9px; 113 margin-left: 4px; 114 position: relative; 115 bottom: 0px; 116 } 117 .quick-roadway-wrapper { 118 position: relative; 119 } 120 .roadway-modal { 121 position: absolute; 122 bottom: -20rem; 123 right: 0.25rem; 124 background: white; 125 border-radius: 2px; 126 width: 15rem; 127 height: 20rem; 128 z-index: 10;
129 color: rgb(var(--darkest)); 130 box-shadow: var(--shadow-md); 131 overflow: hidden; 132 } 133 .roadway-modal-search { 134 padding: 0.5rem; 135 padding-bottom: 0; 136 } 137 .roadway-modal-scroll { 138 height: calc(100% - 90px); 139 width: 100%; 140 overflow-y: scroll; 141 } 142 .roadway-input { 143 display: inline-block; 144 background: rgb(var(--clouds)); 145 padding: 0.75rem 0.75rem; 146 width: calc(100% - 2rem); 147 color: rgb(var(--concrete)); 148 border: 1px solid rgb(var(--concrete)); 149 margin-bottom: 10px; 150 border-radius: 10px; 151 font-size: 14px; 152 } 153 .roadway-modal-results { 154 padding: 0.5rem; 155 } 156 .roadway-modal-result { 157 display: flex; 158 align-items: center; 159 justify-content: start; 160 color: rgb(var(--darker)); 161 font-size: 14px; 162 margin-bottom: 0.75rem; 163 margin-right: 0; 164 padding: 0; 165 text-decoration: none; 166 width: 100%; 167 } 168 .roadway-modal-icon { 169 margin-right: 0.25rem; 170 fill: rgb(var(--darker)); 171 } 172 .hidden { 173 display: none; 174 } 175 @keyframes fade-in-out { 176 0% { 177 opacity: 1; 178 } 179 25% { 180 opacity: 0.55; 181 } 182 50% { 183 opacity: 1; 184 } 185 75% { 186 opacity: 0.55; 187 } 188 100% { 189 opacity: 1; 190 } 191 } 192 @media all and (max-width: 768px) { 193 .quick-roadways { 194 justify-content: start; 195 gap: var(--gap); 196 max-width: 100vw; 197 overflow-x: auto; 198 } 199 .quick-roadway { 200 white-space: nowrap; 201 } 202 .quick-roadway-more { 203 margin-right: 20px; 204 } 205 } 206 @media all and (max-width: 376px) { 207 .quick-button-copy { 208 font-size: 12px; 209 } 210 .quick-button { 211 max-width: 48px; 212 } 213 .hide-mobile { 214 display: none; 215 } 216 } 217`;var B=Object.defineProperty,z=Object.getOwnPropertyDescriptor,N=(t,e,i,a)=>{for(var o,r=a>1?void 0:a?z(e,i):e,s=t.length-1;s>=0;s--)(o=t[s])&&(r=(a?o(e,i,r):o(r))||r);return a&&r&&B(e,i,r),r};let P=class extends((0,s.N)(g.Ay)(a.WF)){constructor(){super(...arguments),this.showRoadwayModal=!1,this.selectedIdx=-1,this.isUserLoggedIn=!1,this.popularRoadways=[],this.qbRoadways=[],this.moreRoadsButtonRef=(0,S._)(),this.moreRoadsInputRef=(0,S._)()}static get styles(){return[E.A,T.A,R.A,q.A,C.A,L]}render(){return a.qy` 218 <div 219 class="quick-buttons" 220 role="radiogroup" 221 aria-label="Use the following quick buttons to enable popular combinations of map layers." 222 > 223 ${d.ph?.quickButtons.map(((t,e)=>a.qy` <button 224 class="quick-button-btn quick-button ${(0,l.H)({selected:!t.favoritesBtn&&e===this.selectedIdx,link:!!t.favoritesBtn})}" 225 aria-label="Show ${t.label} ${t.favoritesBtn?"":"Layer"}" 226 role="${(0,r.J)(t.favoritesBtn?void 0:"radio")}" 227 aria-checked=${(0,r.J)(t.favoritesBtn?void 0:e===this.selectedIdx)} 228 @click=${this.handleClick} 229 data-idx=${e} 230 > 231 <div class="quick-button-icon"> 232 ${t.favoritesBtn?a.qy`<img src="${(0,r.J)(t.icon)}" alt="${t.label}" />`:a.qy` <img src="${(0,r.J)(t.icon)}" alt="${t.label}" />`} 233 </div> 234 ${t.favoritesBtn?a.qy` <p class="quick-button-copy">${t.label}</p> `:a.qy`<p class="quick-button-copy">${t.label}</p>`} 235 </button>`))} 236 </div> 237 <div class="quick-roadways"> 238 ${this.renderLinks()} 239 <div class="quick-roadway-wrapper"> 240 <button 241 type="button" 242 class="quick-roadway quick-roadway-more" 243 @click=${this.toggleModal} 244 ${(0,S.K)(this.moreRoadsButtonRef)} 245 aria-controls="qbRoadwayModal" 246 aria-haspopup="menu" 247 aria-expanded=${this.showRoadwayModal} 248 > 249 More 250 <svg id="back-button-img" class="btn_icon" style="fill: white;" aria-hidden="true"> 251 <use href="${"/images/sprites.svg#arrow-down"}"></use> 252 </svg> 253 </button> 254 ${this.renderRoadwayModal()} 255 </div> 256 </div> 257 `}renderLinks(){const t=t=>a.qy` <button 258 type="button" 259 class="quick-roadway ${(0,l.H)({"hide-mobile":!!t.hideMobile})}" 260 @click=${this.handleRoadway} 261 data-link="${t.link}" 262 aria-label="Quick Search for ${t.name} Events" 263 > 264 ${t.name} 265 </button>`;return this.qbRoadways.length?a.qy`${this.qbRoadways.map(((e,i)=>t(e)))}`:a.qy`${d.ph?.defaultRoadways.map(((e,i)=>t(e)))}`}renderRoadwayModal(){return a.qy` 266 <div 267 class="roadway-modal ${!0===this.showRoadwayModal?"":"hidden"}" 268 aria-label="roadway search dropdown" 269 @blur=${this.focusOut} 270 id="qbRoadwayModal" 271 role="menu" 272 > 273 <div class="roadway-modal-search" role="menuitem"> 274 <label 275 for="quick-roadway-search" 276 style="height: .5px; width: 0; overflow: hidden; display: inline-block;" 277 >Roadway Search</label 278 > 279 <input 280 id="quick-roadway-search" 281 type="text" 282 class="roadway-input" 283 placeholder="Roadway" 284 ${(0,S.K)(this.moreRoadsInputRef)}
285 @keyup=${this.filterPopularRoutes} 286 /> 287 <h6>Popular Roadways</h6> 288 </div> 289 <div class="roadway-modal-scroll"> 290 <div class="roadway-modal-results"> 291 ${this.popularRoadways?this.popularRoadways.map((t=>a.qy` 292 <button 293 role="menuitem" 294 type="button" 295 class="roadway-modal-result btn btn-link" 296 @click=${this.handleRoadway} 297 data-link=${this.generateRoadwayString(t)} 298 > 299 <svg 300 class="btn_icon roadway-modal-icon" 301 role="presentation" 302 aria-hidden="true" 303 > 304 <use href="/images/sprites.svg#roadway"></use> 305 </svg> 306 ${t.name} 307 </button> 308 `)):a.qy` <p>No matching popular routes found.</p> `} 309 </div> 310 </div> 311 </div> 312 `}async handleClick(t){const e=t.currentTarget.getAttribute("data-idx");let i;if("string"==typeof e&&(i=parseInt(e,10)),"number"==typeof i&&!Number.isNaN(i)){this.selectedIdx=i;const t=d.ph?.quickButtons?.[i];if(t.roadways?.length&&(this.qbRoadways=t.roadways),g.Ay.dispatch((0,p.P)(p.U.TRAY_QUICK_BUTTON_CLICK,t?.label??t?.icon,u.l_R.TRAY_EVENT)),t?.favoritesBtn)return void await this.navFavorites();const e=t?.classifications?.reduce(((t,e)=>(t[e]=!0,t)),{});if(e){const t={};for(const e in g.Ay.getState().app.activeLayers)t[e]=!1;this.allLayers={...t,...e},g.Ay.dispatch((0,_.h)(e)),await g.Ay.dispatch((0,F.gX)())}}}handleKeyup(t){"Escape"===t.code&&(this.showRoadwayModal=!1,this.moreRoadsButtonRef?.value?.focus())}focusOut(){this.showRoadwayModal=!1}async handleRoadway(t){const e=t.currentTarget,i=e.getAttribute("data-link");i&&(g.Ay.dispatch((0,p.P)(p.U.TRAY_QUICK_ROAD_CLICK,e.innerText||i,u.l_R.TRAY_EVENT)),await g.Ay.dispatch((0,b.oo)(`${i}`)))}async navFavorites(){this.isUserLoggedIn?this.dispatchEvent(new CustomEvent("show-favorites")):await g.Ay.dispatch((0,b.oo)("#login"))}toggleModal(){if(this.showRoadwayModal)return this.showRoadwayModal=!1,null!=window.dismissQuickButtonMoreDropdownCallback&&(document.body.removeEventListener("click",window.dismissQuickButtonMoreDropdownCallback,!0),window.dismissQuickButtonMoreDropdownCallback=void 0),void this.moreRoadsButtonRef.value?.focus();this.showRoadwayModal=!0,window.dismissQuickButtonMoreDropdownCallback=this.dismissModal.bind(this),document.body.addEventListener("click",window.dismissQuickButtonMoreDropdownCallback,!0),this.dispatchEvent(new CustomEvent("click-more-quick-roads")),setTimeout((()=>this.moreRoadsInputRef.value?.focus()),0)}dismissModal(t){if(!this.showRoadwayModal)return;const e=t.composedPath();e.some((t=>t?.classList?.contains("quick-roadway-more")))||e.filter((t=>{const e=t;return"string"==typeof e?.className&&e.className.includes("roadway-modal")})).length||(this.showRoadwayModal=!1)}generateRoadwayString(t){return`/search/roadway=${(0,O.A)(t.name)}/@${(0,I.A)(t.bbox[0])},${(0,I.A)(t.bbox[1])},${(0,I.A)(t.bbox[2])},${(0,I.A)(t.bbox[3])}/`}filterPopularRoutes(t){const{value:e}=t.currentTarget;this.popularRoadways=g.Ay.getState().areasAndLocations.allRoutes.filter((t=>function(t,e){const i=t.replaceAll(/[\W]/gi,"").split("").join(".*");return new RegExp(i,"i").test(e)}(e,t.name)))}checkForRemoveSelect(t){const e=this.allLayers,i=t;for(const a in t)e&&e[a]!==i[a]&&(this.selectedIdx=-1,this.allLayers=void 0)}connectedCallback(){super.connectedCallback(),this.addEventListener("keyup",this.handleKeyup)}disconnectedCallback(){this.removeEventListener("keyup",this.handleKeyup),super.disconnectedCallback()}stateChanged(t){this.isUserLoggedIn=(0,x.M3)(t),this.popularRoadways=t.areasAndLocations.allRoutes,this.checkForRemoveSelect(t.app.activeLayers)}};N([(0,o.MZ)({type:Boolean})],P.prototype,"showRoadwayModal",2),N([(0,o.MZ)({type:Number})],P.prototype,"selectedIdx",2),N([(0,o.MZ)({type:Boolean})],P.prototype,"isUserLoggedIn",2),N([(0,o.MZ)({type:Array})],P.prototype,"popularRoadways",2),N([(0,o.MZ)({type:Array})],P.prototype,"qbRoadways",2),N([(0,o.MZ)({type:Object})],P.prototype,"allLayers",2),P=N([(0,o.EM)("tray-quick-buttons")],P);var Z=i(58959),U=(i(53903),i(32825),i(58877),i(55453),i(70544),i(62600),i(70909),i(95313),i(8289
3120),i(16053),i(20732)),D=i(21379),j=Object.defineProperty,W=Object.getOwnPropertyDescriptor,V=(t,e,i,a)=>{for(var o,r=a>1?void 0:a?W(e,i):e,s=t.length-1;s>=0;s--)(o=t[s])&&(r=(a?o(e,i,r):o(r))||r);return a&&r&&j(e,i,r),r};let K=class extends((0,s.N)(g.M_)(Z.o)){constructor(){super(...arguments),this.events=[],this.cameras=[],this.cmsMessages=[],this.cmsFloodgates=[],this.cmsCampaigns=[],this.isLoggedIn=!1,this.isAccountPending=!1,this.cameraViewType=m.j6.Default,this.activationSubmissionStatus=u.vky.UNSUBMITTED,this.showFavorites=!1}static get styles(){return[E.A,T.A,R.A,q.A,C.A,a.AH` 313 .fav-list-btn { 314 padding: 0.25rem var(--gap); 315 display: inline-block; 316 border-radius: var(--border-radius); 317 margin-top: 0.75rem; 318 color: #fff; 319 } 320 .fav-list-text { 321 white-space: initial; 322 } 323 .fav-wrap { 324 display: flex; 325 } 326 .fav-title { 327 flex: 1; 328 white-space: initial; 329 } 330 331 .fav-title > .badge-pill { 332 margin-top: calc(var(--gap) / 4); 333 margin-left: calc(var(--gap) / 2); 334 height: fit-content; 335 } 336 337 .fav-edit-btn, 338 .fav-edit-btn:active, 339 .fav-edit-btn:hover { 340 flex-direction: column; 341 font-size: var(--smallest); 342 color: rgb(var(--concrete)); 343 padding: 0.5rem; 344 box-shadow: none !important; 345 } 346 .fav-edit-icon { 347 width: 1rem; 348 height: 1rem; 349 padding-bottom: 0.25rem; 350 } 351 date-last-updated { 352 display: block; 353 margin-bottom: 0.25rem; 354 } 355 356 .campaigns-list { 357 width: calc(100% - 2 * var(--gap)); 358 box-shadow: var(--shadow-sm); 359 margin-left: var(--gap); 360 margin-right: var(--gap); 361 border: var(--border-width) solid rgb(var(--silver)); 362 margin-bottom: calc(var(--gap) * 2); 363 border-left: 0px !important; 364 border-right: 0px !important; 365 } 366 367 .campaign-card { 368 width: 100%; 369 } 370 371 .campaign-card-link { 372 width: 100%; 373 height: 100%; 374 display: block; 375 line-height: 0; 376 position: relative; 377 transition: all 0.15s ease-in-out 0s; 378 } 379 380 .campaign-card-link:hover { 381 box-shadow: 0 0 0 0.25rem rgba(var(--peter-river), 0.25); 382 z-index: 10; 383 } 384 385 .campaign-card-link:focus { 386 position: relative; 387 z-index: 10; 388 } 389 390 .campaign-card-img { 391 width: 100%; 392 height: auto; 393 } 394 395 .link-icon { 396 opacity: 0; 397 position: absolute; 398 right: calc(var(--gap) / 2); 399 bottom: calc(var(--gap) / 2); 400 color: white; 401 height: 2rem; 402 width: 2rem; 403 transition: all 0.2s ease-in-out; 404 } 405 406 .campaign-card-link:hover > .link-icon { 407 opacity: 100; 408 } 409 410 .cms-message-content { 411 max-height: 4rem; 412 overflow-y: ellipsis; 413 position: relative; 414 white-space: normal; 415 } 416 417 .fadeout { 418 position: absolute; 419 top: 2rem; 420 width: 100%; 421 height: 2rem; 422 background-image: linear-gradient(rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%); 423 } 424 425 .heading-list-title { 426 margin: 0; 427 padding: 1rem; 428 color: rgb(var(--tray-list-title-fg, --darker)); 429 background-color: rgb(var(--tray-list-title-bg)); 430 } 431 432 #critical-events-header { 433 background-color: rgb(var(--critical-events-header-bg, --tray-list-title-bg)); 434 color: rgb(var(--critical-events-header-text, --tray-list-title-fg)); 435 } 436 .header-message { 437 font-size: 14px; 438 display: flex; 439 align-items: center; 440 justify-content: center; 441 } 442 `]}render(){const t=this.cameras||[];return this.isLoading?a.qy` 443 <div class="h-display placeholder_h2"></div> 444 <card-media-carousel @crc:carousel:scrolltocard=${this.onCarouselScrollToCard}> 445 <card-media visible></card-media> 446 <card-media visible></card-media> 447 <card-media></card-media> 448 </card-media-carousel> 449 <card-result-list role="list"> 450 <h2 slot="title" class="h-display heading-list-title" id="critical-events-header"> 451 ${(0,M.A)("dashboard.list.title","Critical Events")} 452 </h2> 453 <card-result loading role="listitem"></card-result> 454 </card-result-list> 455 `:a.qy` 456 ${d.ps.headerMessage?a.qy` <card-result-list 457 style="position: sticky; 458 max-width: 100vw; 459 top: 0; 460 z-index: 2;" 461 > 462 <h2 slot="title" class="h-display heading-list-title header-message"> 463 ${(0,n._)(d.ps.headerMessage)} 464 </h2> 465 </card-result-list>`:a.qy``} 466 <card-result-list> 467 <h2 slot="title" class="h-display heading-list-title"> 468 ${d.ph?.header} 469 <context-help-tooltip 470 slot="prefix" 471 @show=${()=>g.M_.dispatch({type:u.Aky,title:"Quick Buttons"})} 472 > 473 <h3>What's This?</h3> 474 <p>${d.ph?.infoText}</p> 475 </context-help-tooltip> 476 </h2> 477 <tray-quick-buttons 478 @show-favorites=${this.setShowFavorites} 479 @click-more-quick-roads=${this.onClickMoreQuickRoads} 480 ></tray-quick-buttons> 481 </card-result-list>
482 ${this.showFavorites?a.qy` 483 ${d.mc&&d.ps.showCameras?a.qy` 484 ${this.renderDashboardCameraHeader()} 485 <card-media-carousel 486 @crc:carousel:scrolltocard=${this.onCarouselScrollToCard} 487 .itemKeys=${t.map((t=>t.uri)).sort()} 488 > 489 ${this.renderAddFavoriteCameraPrompt()} 490 ${t.map(((t,e)=>{const i=t?.url??d.QW["camera-unavailable"];return t&&t.category===u.NaE.LINK?a.qy` 491 <card-media-external-link 492 @card-click=${this.cameraViewClicked} 493 uri=${t.uri} 494 hover-uri=${(0,r.J)(t.parentCollection.uri??void 0)} 495 category="${t.category}" 496 src=${i} 497 title=${t.title} 498 ?visible=${0===e} 499 > 500 ${t.title} 501 </card-media-external-link> 502 `:a.qy` 503 <card-media 504 @card-click=${this.handleMediaCardClick} 505 @crc:card:mouseover=${U.A} 506 @crc:card:mouseout=${U.n} 507 category=${t.category} 508 src=${i} 509 uri=${t.uri} 510 hover-uri=${(0,r.J)(t.parentCollection.uri??void 0)} 511 title=${t.title} 512 ?visible=${0===e} 513 > 514 ${a.qy` 515 <favorite-camera-view-button 516 slot="card-button" 517 class="card_header-button-container" 518 contentUri=${t.uri} 519 contentType=${u.Gqw.CAMERA} 520 hide-labels 521 ></favorite-camera-view-button> 522 `} 523 ${t.title} 524 </card-media> 525 `}))} 526 </card-media-carousel> 527 `:void 0} 528 ${a.qy`${this.renderFavoritesList()} ${this.renderFavoriteVisual()}`} 529 `:a.qy` 530 <card-result-list role="list"> 531 <h2 slot="title" class="h-display heading-list-title" id="critical-events-header"> 532 ${(0,M.A)("dashboard.list.title","Critical Information")} 533 <context-help-tooltip 534 slot="prefix" 535 @show=${()=>g.M_.dispatch({type:u.Aky,title:"critical events"})} 536 > 537 <h3>What's This?</h3> 538 <p>${(0,n._)(d.d2.dashboardList)}</p> 539 </context-help-tooltip> 540 </h2> 541 ${!this.error&&this.cmsFloodgates?a.qy` 542 ${this.cmsFloodgates?.map((t=>a.qy`<card-result 543 icon="/images/icon-floodgate.svg" 544 border-color="rgb(var(--notification-bg, var(--danger)))" 545 uri="/${t.uri}" 546 role="listitem" 547 > 548 <h3>${t.title}</h3> 549 ${"High"===t.priority?a.qy` 550 <p class="text-muted text-smaller" style="white-space: normal"> 551 ${(0,n._)(t.content)} 552 </p> 553 `:a.qy``} 554 </card-result>`))} 555 `:a.qy``} 556 ${this.error||!this.events?a.qy` 557 <card-result 558 role="listitem" 559 icon="${d.KP.icon}" 560 border-color=${d.KP.borderColor} 561 > 562 <h3>${d.KP.title}</h3> 563 <p class="text-muted text-smaller" style="white-space: normal"> 564 ${(0,n._)(d.KP.description)} 565 </p> 566 </card-result> 567 `:void 0} 568 ${this.error||0!==this.events.length||this.cmsFloodgates?.length?void 0:a.qy` 569 <card-result role="listitem" icon="${"/images/icon-search-fill-solid.svg"}"> 570 <h3> 571 ${(0,M.A)("dashboard.list.noresults.title","No results found. Make sure at least one map layer is turned on.")} 572 </h3> 573 <p class="text-muted text-smaller"> 574 ${(0,M.A)("dashboard.list.noresults.body","We can't find any critical road or weather events in your searched area.")} 575 </p> 576 </card-result> 577 `} 578 ${this.error?void 0:this.renderCriticalEvents()} 579 </card-result-list> 580 581 ${this.renderCMSContent()} 582 <slot name="twitterFeed"></slot> 583 `} 584 `}renderCriticalEvents(){return this.events.map((t=>{const e=(t.delayDescriptions?t.delayDescriptions:[]).filter((t=>!t?.segmentDelays?.length)),i=t.isWazeEvent?t.beginTime:t.lastUpdated;return a.qy` 585 <card-result 586 .result=${t} 587 icon="${t.icon||""}" 588 uri="/${t.uri}" 589 hover-uri="${t.uri}" 590 thumb-url=${(0,r.J)(t?.views?.[0]?.url??void 0)} 591 thumb-alt=${(0,r.J)(t.title??void 0)} 592 thumb-category="${(0,r.J)(t.views&&t.views[0]?t.views[0].category:u.NaE.UNKNOWN)}" 593 border-color="${t.color||""}" 594 .delayDescriptions=${e} 595 .quantities=${t?.quantities||[]} 596 @crc:card:mouseover=${U.A} 597 @crc:card:mouseout=${U.n} 598 @click=${this.trackEventClick}
598 599 role="listitem" 600 > 601 <h3>${t.title}</h3> 602 ${i?a.qy` 603 <date-last-updated 604 ?isWazeEvent="${t.isWazeEvent}" 605 .agencyAttribution="${t.agencyAttribution}" 606 timestamp=${(0,r.J)(i.timestamp)} 607 timezone=${(0,r.J)(i.timezone)} 608 label="${t.isWazeEvent?"Reported by":"Updated"}" 609 ></date-last-updated> 610 `:void 0} 611 <p class="text-muted text-smaller">${t.cityReference}</p> 612 </card-result> 613 `}))}handleMediaCardClick(t){const e=t.currentTarget?.uri;(0,U.n)(),g.M_.dispatch((0,D.z)(e))}renderDashboardCameraHeader(){if(d.mc)return this.cameraViewType===m.j6.Favorite&&this.isLoggedIn?a.qy` 614 <h4 class="h-display"> 615 ${(0,M.A)("dashboard.camera.favoriteHeader","Your Favorite Cameras")} 616 <context-help-tooltip 617 slot="prefix" 618 @show=${()=>g.M_.dispatch({type:u.Aky,title:"favorite cameras"})} 619 > 620 <h3>What's This?</h3> 621 <p>${(0,n._)(d.d2.favoriteCameras)}</p> 622 </context-help-tooltip> 623 </h4> 624 `:this.cameraViewType===m.j6.Hot?a.qy` 625 <h4 class="h-display"> 626 ${(0,M.A)("dashboard.camera.header","Hot cameras")} 627 <context-help-tooltip 628 slot="prefix" 629 @show=${()=>g.M_.dispatch({type:u.Aky,title:"hot cameras"})} 630 > 631 <h3>What's This?</h3> 632 <p>${(0,n._)(d.d2.hotCameras)}</p> 633 </context-help-tooltip> 634 </h4> 635 `:void this.setHideFavorites()}renderAddFavoriteCameraPrompt(){if(this.isLoggedIn&&this.cameraViewType===m.j6.Favorite&&0===this.cameras?.length)return a.qy` 636 <card-media 637 @card-click=${this.openFavoriteCameraInstuctions} 638 src=${"/images/icon-camera-add-favorites.svg"} 639 alt=${(0,M.A)("prompt.favorite.camera","Add a favorite a camera")} 640 title=${(0,M.A)("prompt.favorite.camera","Let's favorite a camera")} 641 visible 642 > 643 ${(0,M.A)("prompt.favorite.camera","Let's favorite a camera")} 644 </card-media> 645 `}openFavoriteCameraInstuctions(){g.M_.dispatch({type:u.DoY,tutorialType:u.S9j.FAVORITE}),g.M_.dispatch({type:u.BSm,slug:u.QeQ.FAVORITE_CAMERA_ADD})}renderFavoritesList(){if(this.error||!this.isLoggedIn)return;const t=this.activationSubmissionStatus===u.vky.SUCCESS,e=this.activationSubmissionStatus===u.vky.ERROR,i=this.activationSubmissionStatus===u.vky.PENDING||this.activationSubmissionStatus===u.vky.UNSUBMITTED;return a.qy`<card-result-list role="list" id="favorites"> 646 <h2 slot="title" class="h-display"> 647 ${this.favorites?.length??0} ${1===this.favorites?.length?"Favorite":"Favorites"} 648 <context-help-tooltip slot="prefix"> 649 <h3>What's This?</h3> 650 <p>${(0,n._)(d.d2.favoritesList)}</p> 651 </context-help-tooltip> 652 </h2> 653 ${this.isAccountPending?a.qy` 654 <card-result icon=${"/images/icon-mail-fill-solid-round.svg"} role="listitem"> 655 <h3>Your account is not fully activated</h3> 656 <p class="text-muted text-smaller fav-list-text"> 657 To activate your account, you must click the Accept link in the email. 658 </p> 659 <button 660 class=${(0,l.H)({btn:!0,"btn-dark":i,"btn-success":t,"btn-error":e,"btn-sm":!0,"fav-list-btn":!0})} 661 ?disabled=${t} 662 @click=${this.clickResendEmail} 663 > 664 ${this.activationSubmissionStatus===u.vky.PENDING?a.qy`<spinning-loader class="btn-loader"></spinning-loader>`:void 0} 665 ${i?"Resend email":void 0} 666 ${t?"Activation email sent":void 0} 667 ${e?"Activation email failed to send":void 0} 668 </button> 669 </card-result> 670 `:void 0} 671 ${this.favorites?.length?void 0:a.qy` 672 <card-result icon=${"/images/icon-favorite-fill-solid.svg"} role="listitem"> 673 <h3>${(0,M.A)("prompt.addFavorite","Add a Favorite")}</h3> 674 <p class="text-muted text-smaller fav-list-text"> 675 ${(0,M.A)("prompt.noFavorites","You don't have any favorite places or routes.")} 676 </p> 677 <button class="btn btn-dark btn-sm fav-list-btn" @click=${this.clickAddFavorite}> 678 Let's add one! 679 </button> 680 </card-result> 681 `} 682 ${this.favorites?.map((t=>{if(!t.visual)return;const e=this.determineFavoriteTypeSlug(t),i=(t.alertSchedule?.sendEmail||t.alertSchedule?.sendSms)??!1;return a.qy` 683 <card-result 684 uri=${(0,r.J)(t.url)} 685 icon=${this.determineFavoriteIcon(e,i)} 686 border-color="rgb(var(--travel-time-sign-blue))" 687 data-uri=${t.uri} 688 @crc:card:mouseover=${this.handleFavoriteMouseover} 689 @crc:card:mouseout=${this.handleFavoriteMouseout} 690 role="listitem" 691 > 692 <div class="fav-wrap"> 693 <h3 class="fav-title"> 694 ${t.name} 695 ${i?a.qy`<span class="badge badge-pill badge-teal">notifications</span>`:void 0} 696 </h3> 697 <a 698 class="btn fav-edit-btn" 699 title="Edit" 700 href="#${u.Gqw.FAVORITE}/${e}/${A.u2.EDIT}/${t.id}" 701 @click=${this.handleFavoriteEditClick} 702 > 703 <img 704 src=${"/images/icon-edit-fill-solid.svg"} 705 alt="" 706 class="fav-edit-icon" 707 role="presentation" 708 /> 709 <div>Edit</div> 710 </a> 711 </div> 712 </card-result> 713 `}))} 714 </card-result-list> `}renderCMSContent(){if(0!==this.cmsMessages.length||0!==this.cmsCampaigns.length)return a.qy` <card-result-list role="list"> 715 <h2 slot="title" class="h-display"> 716 ${(0,M.A)("dashboard.list.announcements","Announcements")} 717 <context-help-tooltip 718 slot="prefix" 719 @show=${()=>g.M_.dispatch({type:u.Aky,title:"announcement"})} 720 > 721 <h3>What's This?</h3> 722 <p>
722${(0,n._)(d.d2.dashboardAnnouncements)}</p> 723 </context-help-tooltip> 724 </h2> 725 ${this.error?a.qy` 726 <card-result 727 role="listitem" 728 icon="${d.KP.icon}" 729 border-color=${d.KP.borderColor} 730 > 731 <h3>${d.KP.title}</h3> 732 <p class="text-muted text-smaller" style="white-space: normal"> 733 ${(0,n._)(d.KP.description)} 734 </p> 735 </card-result> 736 `:void 0} 737 ${this.error?a.qy``:this.cmsCampaigns.map(((t,e)=>a.qy`<div 738 class="campaign-card" 739 data-idx=${e} 740 @click=${this.onClickCmsCampaign} 741 > 742 <a 743 class="campaign-card-link" 744 href=${t.url||"#"} 745 target="_blank" 746 title=${t.title} 747 aria-label=${t.title} 748 > 749 <img 750 class="campaign-card-img" 751 alt=${t.title} 752 src=${t.content} 753 width=${(0,r.J)(d.mq.campaignImageWidth)} 754 height=${(0,r.J)(d.mq.campaignImageHeight)} 755 /> 756 <img 757 class="link-icon" 758 src="${"/images/icon-external-link-outline.svg"}" 759 alt="External Campaign Link" 760 /> 761 </a> 762 </div>`))} 763 ${this.error?void 0:this.cmsMessages.map(((t,e)=>a.qy`<card-result 764 role="listitem" 765 uri="/${t.uri}" 766 icon="${"/images/icon-notification-speaker-fill-solid.svg"}" 767 border-color="rgb(var(--travel-time-sign-blue))" 768 data-idx=${e} 769 @click=${this.onClickCmsMessage} 770 > 771 <h3>${t.title}</h3> 772 <div class="cms-message-content"> 773 ${(0,h.p)(t.content)} 774 <div class="fadeout"></div> 775 </div> 776 </card-result>`))} 777 </card-result-list>`}onClickCmsCampaign(t){const e=t.currentTarget,i=parseInt(e.getAttribute("data-idx")||"-1",10);if(-1!==i){const{title:t,url:e}=this.cmsCampaigns[i],a=`title="${t}"&url=${e||""}`;g.M_.dispatch((0,p.P)("campaign",a,u.l_R.ANNOUNCEMENT))}}onClickCmsMessage(t){const e=t.currentTarget,i=parseInt(e.getAttribute("data-idx")||"-1",10);if(-1!==i){const{title:t,uri:e}=this.cmsMessages[i],a=`title="${t}"&url=${e}`;g.M_.dispatch((0,p.P)("message",a,u.l_R.ANNOUNCEMENT))}}determineFavoriteIcon(t,e){let i="";return t!==u.Odl.FAVORITE_AREA||e||(i="/images/icon-pin-fill-solid.svg"),t===u.Odl.FAVORITE_AREA&&e&&(i="/images/icon-pin-notification-fill-solid.svg"),t!==u.Odl.FAVORITE_ROUTE||e||(i="/images/icon-car-fill-solid.svg"),t===u.Odl.FAVORITE_ROUTE&&e&&(i="/images/icon-car-notification-fill-solid.svg"),t!==u.Odl.FAVORITE_DRAWN_AREA||e||(i="/images/icon-area-fill-solid.svg"),t===u.Odl.FAVORITE_DRAWN_AREA&&e&&(i="/images/icon-area-notification-fill-solid.svg"),i}determineFavoriteTypeSlug(t){return"FavoriteTrip"===t.__typename?u.Odl.FAVORITE_ROUTE:"FavoriteArea"===t.__typename&&t.customAreaShapeSource===m.dT.UserDrawn?u.Odl.FAVORITE_DRAWN_AREA:u.Odl.FAVORITE_AREA}renderFavoriteVisual(){const t=this.favorites?.find((t=>t.uri===this.hoveringFavoriteUri));if(t)return t.visual?.map((t=>a.qy` <map-feature .feature=${t}></map-feature> `))}handleFavoriteEditClick(t){const{href:e}=t.currentTarget;t.stopPropagation(),t.preventDefault(),g.M_.dispatch((0,b.oo)(e))}handleFavoriteMouseover(t){if((0,c.V)())return;if(this.activeView!==k.UN.DASHBOARD)return;const{uri:e}=t.currentTarget.dataset;if(!this.favorites||!e)throw new Error("Invalid state for favorite hover");g.M_.dispatch((0,v.$h)(e))}handleFavoriteMouseout(){this.activeView===k.UN.DASHBOARD&&g.M_.dispatch((0,v.$h)(void 0))}trackEventClick(t){const{uri:e}=t.currentTarget;e&&g.M_.dispatch({type:u.xOv,id:e})}updated(t){if(t.has("scrollToElement")&&this.scrollToElement){const t=this.renderRoot?.querySelector(this.scrollToElement);t&&requestAnimationFrame((()=>t.scrollIntoView()))}}setShowFavorites(){this.dispatchEvent(new CustomEvent("setshow-favorites"))}setHideFavorites(){this.dispatchEvent(new CustomEvent("sethide-favorites"))}onClickMoreQuickRoads(){this.dispatchEvent(new CustomEvent("click-more-quick-roads"))}stateChanged(t){this.activeView=t.tray.activeView,this.events=(0,k.yJ)(t),this.cameras=(0,k.OS)(t),this.cmsMessages=t.tray.dashboard.cmsMessages,this.cmsFloodgates=t.cmsContent.cmsFloodgates,this.cmsCampaigns=t.tray.dashboard.cmsCampaigns,this.isLoggedIn=(0,x.M3)(t),this.isAccountPending=t.your511.account?.accountStatus===m.u1.Pending,this.cameraViewType=t.tray.dashboard.cameraViewType,this.favorites=(0,A.iM
777)(t),this.isLoading=t.tray.isLoading,this.error=t.tray.error,this.hoveringFavoriteUri=t.your511Favorites.hoveringFavoriteUri,this.activationSubmissionStatus=t.your511.sendActivateEmailStatus,this.scrollToElement=t.app.scrollToElement}disconnectedCallback(){g.M_.dispatch((0,v.$h)(void 0)),(0,$.Zp)(),super.disconnectedCallback()}clickResendEmail(){g.M_.dispatch((0,y.e1)())}clickAddFavorite(){g.M_.dispatch((0,b.f5)(u.QeQ.FAVORITE_SEARCH)),g.M_.dispatch((0,f.ML)(w.lC))}};V([(0,o.MZ)({type:Array})],K.prototype,"events",2),V([(0,o.MZ)({type:Array})],K.prototype,"cameras",2),V([(0,o.MZ)({type:Array})],K.prototype,"favorites",2),V([(0,o.MZ)({type:Array})],K.prototype,"cmsMessages",2),V([(0,o.MZ)({type:Array})],K.prototype,"cmsFloodgates",2),V([(0,o.MZ)({type:Array})],K.prototype,"cmsCampaigns",2),V([(0,o.MZ)({type:String})],K.prototype,"hoveringFavoriteUri",2),V([(0,o.MZ)({type:Boolean})],K.prototype,"isLoggedIn",2),V([(0,o.MZ)({type:Boolean})],K.prototype,"isAccountPending",2),V([(0,o.MZ)({type:String})],K.prototype,"cameraViewType",2),V([(0,o.MZ)({type:String})],K.prototype,"scrollToElement",2),V([(0,o.MZ)({type:String})],K.prototype,"activationSubmissionStatus",2),V([(0,o.MZ)({type:Boolean})],K.prototype,"showFavorites",2),K=V([(0,o.EM)("tray-dashboard")],K)},95313:(t,e,i)=>{"use strict";var a,o=i(71413),r=i(52706),s=i(10427),n=i(51728),l=i(24634),d=Object.defineProperty,c=Object.getOwnPropertyDescriptor,h=(t,e,i,a)=>{for(var o,r=a>1?void 0:a?c(e,i):e,s=t.length-1;s>=0;s--)(o=t[s])&&(r=(a?o(e,i,r):o(r))||r);return a&&r&&d(e,i,r),r},p=(t,e,i)=>{if(!e.has(t))throw TypeError("Cannot "+i)};let u=class extends o.WF{constructor(){super(...arguments),this.iconSource="/images/icon-whats-fill-solid.svg",this.expanded=!1,this.omitIcon=!1,this.position=n.kl.BOTTOM,this.strategy="absolute",((t,e,i)=>{if(e.has(t))throw TypeError("Cannot add the same private member more than once");e instanceof WeakSet?e.add(t):e.set(t,void 0)})(this,a)}static get styles(){return[...s.Ay.styles,l.A,o.AH` 778 :host { 779 display: inline-block; 780 margin: -1rem -0.75rem -0.75rem; 781 vertical-align: sub; 782 783 --bg-color: rgb(var(--darkest)); 784 --text-color: #fff; 785 } 786 787 :host([center-vertically]) { 788 margin: -1.25rem -0.75rem -1rem; 789 vertical-align: middle; 790 } 791 792 :host([small-footprint]) [slot='toggler'] { 793 padding: 0; 794 margin: var(--gap); 795 } 796 797 #tooltip-wrapper { 798 padding: 1rem; 799 width: calc(100vw - var(--scrollbar-width) - 2rem - var(--gap) * 2); 800 max-width: 360px; 801 font-size: var(--smaller); 802 border-radius: var(--border-radius); 803 background-color: var(--bg-color); 804 box-shadow: var(--shadow-sm); 805 text-align: left; 806 text-transform: initial; 807 color: var(--text-color); 808 position: relative; 809 } 810 811 ::slotted(h3), 812 ::slotted(h4) { 813 font-size: var(--smaller) !important; 814 margin-bottom: 0.25rem; 815 } 816 817 popper-container { 818 --tail-color: rgb(var(--darkest)); 819 --tail-border-width: 0; 820 } 821 .tooltip-close { 822 position: absolute; 823 top: 0; 824 right: 0; 825 padding: var(--gap); 826 display: none; 827 fill: rgb(var(--concrete)); 828 } 829 @media (hover: none) { 830 .tooltip-close { 831 display: flex; 832 } 833 } 834 835 .btn-context-help { 836 padding: calc(var(--gap) - 0.25rem); 837 margin: 0.25rem; 838 } 839 `]}render(){return o.qy` 840 <popper-container 841 @mouseenter=${this.enter} 842 @mouseleave=${this.leave} 843 @focusin=${this.show} 844 @focusout=${this.hide} 845 @click=${this.stopPropagation} 846 position=${this.position} 847 strategy=${this.strategy} 848 ?is-visible="${this.expanded}" 849 is-flip 850 > 851 <button slot="toggler" class="btn fadein btn-context-help" aria-label="Help Tooltip"> 852 ${this.omitIcon?o.qy``:o.qy`<img role="presentation" class="icon-sm" src="${this.iconSource}" alt="" />`} 853 </button> 854 <div id="tooltip-wrapper"> 855 <button class="btn btn-close tooltip-close" title="Close"> 856 <svg role="presentation" class="btn_icon btn-sm_icon" aria-hidden="true"> 857 <use href="${"/images/sprites.svg#close-btn"}"></use> 858 </svg> 859 </button> 860 <slot></slot>
861 </div> 862 </popper-container> 863 `}stopPropagation(t){t.preventDefault(),t.stopPropagation(),this.expanded=!this.expanded}connectedCallback(){super.connectedCallback(),this.setAttribute("role","tooltip")}show(){this.expanded=!0}hide(){this.expanded=!1}enter(){var t,e,i;t=this,e=a,i=setTimeout((()=>{this.expanded=!0}),1e3),p(t,e,"write to private field"),e.set(t,i)}leave(){var t;clearTimeout((p(this,t=a,"read from private field"),t.get(this))),this.expanded=!1}};a=new WeakMap,h([(0,r.MZ)({type:String,attribute:"icon-source"})],u.prototype,"iconSource",2),h([(0,r.MZ)({type:Boolean,reflect:!0})],u.prototype,"expanded",2),h([(0,r.MZ)({type:Boolean})],u.prototype,"omitIcon",2),h([(0,r.MZ)({type:String})],u.prototype,"position",2),h([(0,r.MZ)({type:String})],u.prototype,"strategy",2),u=h([(0,r.EM)("context-help-tooltip")],u)},32825:(t,e,i)=>{"use strict";i.d(e,{A:()=>p});var a=i(71413),o=i(52706),r=i(63822),s=i(32701),n=i(80027),l=(i(7642),Object.defineProperty),d=Object.getOwnPropertyDescriptor,c=(t,e,i,a)=>{for(var o,r=a>1?void 0:a?d(e,i):e,s=t.length-1;s>=0;s--)(o=t[s])&&(r=(a?o(e,i,r):o(r))||r);return a&&r&&l(e,i,r),r};let h=class extends a.WF{constructor(){super(...arguments),this.label="Updated",this.isWazeEvent=!1}static get styles(){return[s.A,a.AH` 864 :host { 865 display: inline; 866 color: rgb(var(--darker)); 867 font-style: italic; 868 font-size: var(--smaller); 869 } 870 a { 871 font-weight: bold; 872 text-decoration: underline; 873 } 874 `]}render(){return this.timestamp&&this.timezone?this.isWazeEvent&&this.agencyAttribution?a.qy` 875 ${(0,r.t)(this.label)} ${this.agencyAttribution.agencyName} 876 <relative-time timestamp=${this.timestamp} timezone=${this.timezone}></relative-time> 877 `:n.JM.agencyAttributionEnabled&&this.agencyAttribution?a.qy` 878 ${this.agencyAttribution.agencyIconURL?a.qy` 879 <img 880 src="${this.agencyAttribution.agencyIconURL}" 881 alt="" 882 style="vertical-align: middle" 883 role="presentation" 884 /> 885 `:""} 886 ${(0,r.t)(this.label)} 887 <relative-time timestamp=${this.timestamp} timezone=${this.timezone}></relative-time> 888 ${this.agencyAttribution.agencyName?a.qy` 889 ${(0,r.t)("by")} 890 ${this.agencyAttribution.agencyURL?a.qy` 891 <a href="${this.agencyAttribution.agencyURL}" 892 >${this.agencyAttribution.agencyName}</a 893 > 894 `:a.qy` ${this.agencyAttribution.agencyName} `} 895 `:a.qy``} 896 `:a.qy` 897 ${(0,r.t)(this.label)} 898 <relative-time timestamp=${this.timestamp} timezone=${this.timezone}></relative-time> 899 `:a.qy`<span class="placeholder placeholder_last-updated"></span>`}};c([(0,o.MZ)({type:Number})],h.prototype,"timestamp",2),c([(0,o.MZ)({type:String})],h.prototype,"timezone",2),c([(0,o.MZ)({type:String,reflect:!0})],h.prototype,"label",2),c([(0,o.MZ)({type:Object,reflect:!0})],h.prototype,"agencyAttribution",2),c([(0,o.MZ)({type:Boolean,reflect:!0})],h.prototype,"isWazeEvent",2),h=c([(0,o.EM)("date-last-updated")],h);const p=8792==i.j?h:null},16053:(t,e,i)=>{"use strict";var a=i(71413),o=i(52706),r=i(56599),s=i(10388),n=i(52850),l=i(80027),d=i(32701),c=i(24634);const h=t=>({type:n.gNy,contentUri:t});var p=i(91780),u=i(21379),m=i(95504),g=Object.defineProperty,v=Object.getOwnPropertyDescriptor,b=(t,e,i,a)=>{for(var o,r=a>1?void 0:a?v(e,i):e,s=t.length-1;s>=0;s--)(o=t[s])&&(r=(a?o(e,i,r):o(r))||r);return a&&r&&g(e,i,r),r};let y=class extends((0,r.N)(s.M_)(a.WF)){constructor(){super(...arguments),this.contentUri="",this.contentType="page",this.hideLabels=!1,this.favoriteCameraIsSubmitting=!1,this.isFavorited=!1,this.isLoggedIn=!1}static get styles(){return[d.A,c.A,a.AH` 900 :host { 901 width: 100%; 902 height: 100%; 903 } 904 905 @media screen and (prefers-reduced-motion: reduce) { 906 .heart-btn { 907 transition: none; 908 } 909 } 910 911 .heart-btn { 912 padding: 0; 913 } 914 915 .heart-btn[disabled] { 916 opacity: 0.5; 917 pointer-events: none; 918 cursor: wait; 919 } 920 921 .heart-btn_label { 922 display: block; 923 white-space: initial; 924 font-size: var(--smallest); 925 margin-top: var(--gap); 926 } 927 .heart-btn_icon { 928 width: 100%; 929 height: 100%; 930 } 931 `]}stateChanged(t){this.favoriteCameraIsSubmitting=t.your511Favorites.pendingFavoriteCameraViewUris.has(this.contentUri),this.isFavorited=t.your511Favorites.favoriteCameraViewUris?.includes(this.contentUri)??!1,this.isLoggedIn=(0,m.M3)(t)}addFavorite(){this.favoriteCameraIsSubmitting||(s.M_.dispatch(h(this.contentUri)),s.M_.dispatch((0,p.oS)(this.contentUri)))}removeFavorite(){this.favoriteCameraIsSubmitting||(s.M_.dispatch(h(this.contentUri)),s.M_.dispatch((0,p.tN)(this.contentUri)))}onFavoriteCameraClick(t){return t.preventDefault(),t.stopPropagation(),this.isLoggedIn?(this.isFavorited&&this.removeFavorite(),this.addFavorite()):s.M_.dispatch((0,u.z)(`${n.Gqw.LOGIN}`))}render(){const t=this.isFavorited?l.Lk.favorite.getUnsaveLabel(this.contentType):l.Lk.favorite.getSaveLabel(this.contentType),e=this.isFavorited?"/images/icon-favorite-fill-solid-selected.svg":"/images/icon-favorite-fill-solid.svg",i=!this.hideLabels&&!l.Lk.alwaysHideLabels;return a.qy` 932 <button 933 class="btn btn-light heart-btn" 934 @click="${this.onFavoriteCameraClick}" 935 title="${t}" 936 aria-label="${t}" 937 ?disabled=${this.favoriteCameraIsSubmitting} 938 part="button" 939 > 940 <img src="${e}" class="heart-btn_icon" alt="" part="icon" role="presentation" /> 941 ${i?a.qy` <span class="heart-btn_label">${t}</span> `:""} 942 </button> 943 `}};b([(0,o.MZ)({type:String,reflect:!0})],y.prototype,"contentUri",2),b([(0,o.MZ)({type:String,reflect:!0})],y.prototype,"contentType",2),b([(0,o.MZ)({type:Boolean,reflect:!0,attribute:"hide-labels"})],y.prototype,"hideLabels",2),b([(0,o.MZ)({type:Boolean})],y.prototype,"favoriteCameraIsSubmitting",2),b([(0,o.MZ)({type:Boolean})],y.prototype,"isFavorited",2),b([(0,o.MZ)({type:Boolean})],y.prototype,"isLoggedIn",2),y=b([(0,o.EM)("favorite-camera-view-button")],y)}
943,58877:(t,e,i)=>{"use strict";var a=i(71413),o=i(52706),r=i(96076);Object.defineProperty,Object.getOwnPropertyDescriptor;let s=class extends a.WF{set feature(t){r.W.getMap().then((e=>{if(this._feature&&this._feature.getId()!==t.id){const i=this._feature.getId();e.data.overrideStyle(e.data.getFeatureById(i),t.properties)}else[this._feature]=e.data.addGeoJson(t)}))}disconnectedCallback(){r.W.getMap().then((t=>{this._feature&&(t.data.remove(this._feature),delete this._feature,super.disconnectedCallback())}))}createRenderRoot(){return this}};s=((t,e,i,a)=>{for(var o,r=e,s=t.length-1;s>=0;s--)(o=t[s])&&(r=o(r)||r);return r})([(0,o.EM)("map-feature")],s)},53903:(t,e,i)=>{"use strict";var a=i(71413),o=i(52706),r=i(30555),s=i(56599),n=i(38155),l=i(80027),d=i(66003),c=i(21379),h=i(52850),p=i(10388),u=i(24634),m=i(32701),g=i(51728),v=Object.defineProperty,b=Object.getOwnPropertyDescriptor,y=(t,e,i,a)=>{for(var o,r=a>1?void 0:a?b(e,i):e,s=t.length-1;s>=0;s--)(o=t[s])&&(r=(a?o(e,i,r):o(r))||r);return a&&r&&v(e,i,r),r};let f=class extends((0,s.N)(p.Ay)(a.WF)){constructor(){super(...arguments),this.active=!0,this.showCloseButton=!0,this.position=g.kl.BOTTOM,this.tutorialType=void 0,this.escKeyPressCallback=this.escKeyPress.bind(this),this.focusLoopDivRef=(0,n._)(),this.nextButtonRef=(0,n._)()}static get styles(){return[m.A,u.A,a.AH` 944 :host { 945 --bg-color: var(--dark-blue-a11y); 946 --fg-color: 255, 255, 255; 947 --bubble-width: calc(100vw - var(--scrollbar-width) - var(--gap) * 2); 948 --bubble-max-width: 32rem; 949 /* needed when placed in header or map-controls */ 950 pointer-events: all; 951 font-size: 1rem; 952 } 953 954 @media all and (max-width: 1080px) { 955 :host { 956 overflow: scroll; 957 display: inline-block; 958 max-height: 50vh; 959 } 960 } 961 962 @media all and (max-width: 320px) { 963 :host { 964 overflow: scroll !important; 965 top: auto !important; 966 max-height: calc(100vh - 150px); 967 position: absolute; 968 } 969 :host#tutorial-feedback { 970 left: -100px !important; 971 } 972 } 973 974 #bubble-container { 975 position: relative; 976 z-index: 2; 977 width: var(--bubble-width); 978 max-width: var(--bubble-max-width); 979 980 border-radius: var(--border-radius); 981 box-shadow: var(--shadow-md); 982 background-color: rgb(var(--bg-color)); 983 } 984 985 #slotted-content { 986 padding: 1.5rem 1.5rem 1rem; 987 color: rgb(var(--fg-color)); 988 } 989 990 #close-button { 991 position: absolute; 992 top: 0px; 993 right: 0px; 994 fill: rgb(var(--fg-color)); 995 } 996 997 #close-button:focus { 998 background-color: rgba(var(--concrete), 0.3); 999 } 1000 1001 #next-fields { 1002 color: rgb(var(--fg-color)); 1003 background-color: rgb(var(--darker-blue-a11y)); 1004 border-bottom-left-radius: var(--border-radius); 1005 border-bottom-right-radius: var(--border-radius); 1006 padding: 1rem 1.5rem; 1007 display: flex; 1008 justify-content: flex-start; 1009 align-items: center; 1010 flex-wrap: wrap; 1011 } 1012 1013 .focus-dark:focus { 1014 outline: black solid 0.25rem; 1015 } 1016 1017 #tutorial-select:focus { 1018 outline: black solid 0.25rem; 1019 } 1020 1021 @media (min-width: 768px) { 1022 #next-fields { 1023 flex-wrap: nowrap; 1024 } 1025 } 1026 1027 #next-fields.final-step { 1028 /* padding-top: 1.5rem; */ 1029 justify-content: center; 1030 } 1031 1032 #next-fields div { 1033 flex: 1 1 auto; 1034 margin-right: 0.5rem; 1035 } 1036 1037 #next-fields label { 1038 margin-right: 0.5rem; 1039 font-size: var(--smaller); 1040 } 1041 1042 #next-fields select { 1043 font-family: inherit; 1044 min-height: calc(var(--smaller) * 1.5 + 1rem); 1045 font-size: var(--smaller); 1046 padding: 0.5rem; 1047 color: inherit; 1048 background: rgb(var(--bg-color)); 1049 border-radius: var(--border-radius); 1050 border: 1px solid rgba(255, 255, 255, 0.6); 1051 cursor: pointer; 1052 } 1053 1054 @supports (-moz-appearance: none) { 1055 /* dropdown button workaround for firefox */ 1056 #next-fields select { 1057 -moz-appearance: none; 1058 background: url('/images/down_triangle-white.svg') no-repeat right 55%; 1059 padding-right: 2rem; 1060 } 1061 } 1062 1063 #pointer-events-blocker { 1064 position: fixed; 1065 z-index: 1; 1066 width: 200vw; 1067 height: 200vh; 1068 transform: translate(-50%, -50%); 1069 cursor: auto; 1070 background: transparent; 1071 } 1072 `]}render(){return a.qy` 1073 <div 1074 id="bubble-container" 1075 role="dialog" 1076 aria-modal="true" 1077 aria-labelledby="bubble-title" 1078 aria-describedby="bubble-content" 1079 tabindex="-1" 1080 > 1081 ${this.showCloseButton?a.qy` 1082 <button 1083 id="close-button" 1084 class="btn" 1085 title="close this tutorial" 1086 aria-label="close this tutorial" 1087 @click="${this.closeButtonClick}" 1088 > 1089 <svg class="btn_icon" width="36" height="36" aria-hidden="true"> 1090 <use href="${"/images/sprites.svg#close"}"></use> 1091 </svg> 1092 </button> 1093 `:""} 1094 <div id="slotted-content"> 1095 <slot tabindex="0" id="bubble-title" name="title"></slot> 1096 <slot tabindex="0" id="bubble-content" name="content"></slot>
1097 </div> 1098 <div 1099 id="next-fields" 1100 class=${(0,r.H)({"final-step":!!this.isFinalStep})} 1101 > 1102 ${this.footerNextFields()} 1103 </div> 1104 </div> 1105 <div ${(0,n.K)(this.focusLoopDivRef)} tabindex="0"></div> 1106 <div id="pointer-events-blocker" @click=${this.closeButtonClick}></div> 1107 `}footerNextFields(){const t=this.tutorialType===h.S9j.WELCOME?l.BQ.welcome.steps:l.BQ.favorite.steps;return a.qy` 1108 <slot name="footer"> 1109 ${this.isFinalStep?"":a.qy` 1110 <div> 1111 <label for="tutorial-select">Tell me next about:</label> 1112 <select id="tutorial-select" @change="${this.onStepChange}"> 1113 ${Object.entries(t).map((([t,e])=>t&&e?a.qy`${this.slug===t?a.qy``:a.qy` 1114 <option 1115 value="${t}" 1116 name="${e.label}" 1117 ?selected=${this.isFinalStep&&this.slug===t||!this.isFinalStep&&this.nextSlug===t} 1118 > 1119 ${e.label} 1120 </option> 1121 `} `:void 0))} 1122 </select> 1123 </div> 1124 `} 1125 ${!this.nextSlug||this.slug===this.nextSlug&&this.isFinalStep?a.qy` 1126 <button 1127 ${(0,n.K)(this.nextButtonRef)} 1128 id="done-button" 1129 class="btn btn-white btn-rounded btn-sm btn-padding-sm focus-dark" 1130 @click="${this.closeButtonClick}" 1131 title="Done, close tutorial" 1132 aria-label="Done, close tutorial" 1133 > 1134 <div aria-hidden="true">DONE</div> 1135 </button> 1136 `:a.qy` 1137 <button 1138 ${(0,n.K)(this.nextButtonRef)} 1139 id="next-button" 1140 class="btn btn-white btn-rounded btn-sm btn-padding-sm focus-dark" 1141 @click="${this.nextButtonClick}" 1142 title="next tip" 1143 aria-label="next tip" 1144 > 1145 <slot name="next-button-label" aria-hidden="true">NEXT TIP</slot> 1146 </button> 1147 `} 1148 </slot> 1149 `}connectedCallback(){super.connectedCallback(),document.addEventListener("keydown",this.escKeyPressCallback);const t=()=>{this.focusLoopDivRef.value?this.focusLoopDivRef.value.addEventListener("focus",(()=>this.focus())):setTimeout(t,1e3)};t(),this.updateComplete.then((()=>{this.renderRoot?.querySelector("#bubble-container")?.focus()}))}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener("keydown",this.escKeyPressCallback)}stateChanged(t){this.tutorialType=t.app.tutorialType,void 0===t.app.tutorialStep||this.active&&this.slug&&this.slug!==t.app.tutorialStep?this.active=!1:!this.active&&this.slug&&this.slug===t.app.tutorialStep&&(this.active=!0),this.setAttribute("tabindex",this.active?"0":"-1");const{modalView:e}=t.modal,i=e&&e!==h.Gqw.TOUR;this.active&&!i&&this.updateComplete.then((()=>{setTimeout((()=>{this.renderRoot.querySelector("#bubble-container")?.focus()}),300)}))}willUpdate(t){if(this.slug&&(t.has("slug")||t.has("active")||t.has("tutorialType"))){const t=this.tutorialType===h.S9j.WELCOME?Object.keys(l.BQ.welcome.steps):Object.keys(l.BQ.favorite.steps),e=t.findIndex((t=>t===this.slug));this.isFinalStep=e===t.length-1,this.nextSlug=this.isFinalStep?void 0:t[e+1]}}onStepChange(t){this.nextSlug=t.target.value}async nextButtonClick(){if(!this.nextSlug||!this.tutorialType)throw new Error("Invalid tutorial state.");const t=this.tutorialType===h.S9j.WELCOME?l.BQ.welcome.steps[this.nextSlug]:l.BQ.favorite.steps[this.nextSlug];if(!t)throw new Error("Invalid tutorial state.");await p.Ay.dispatch((0,c.z)(`${h.Gqw.TOUR}/${this.tutorialType}/${t.slug}`))}closeButtonClick(){if(!this.tutorialType)throw new Error("Invalid tutorial state.");p.Ay.dispatch((0,d.RB)(this.tutorialType,void 0)),p.Ay.dispatch((0,c.z)(null))}escKeyPress(t){this.active&&"Escape"===t.code&&this.closeButtonClick()}};y([(0,o.MZ)({type:String,reflect:!0})],f.prototype,"slug",2),y([(0,o.MZ)({type:String})],f.prototype,"nextSlug",2),y([(0,o.MZ)({type:Boolean,reflect:!0})],f.prototype,"active",2),y([(0,o.MZ)({type:Boolean})],f.prototype,"isFinalStep",2),y([(0,o.MZ)({type:Boolean})],f.prototype,"showCloseButton",2),y([(0,o.MZ)({type:String})],f.prototype,"position",2),y([(0,o.MZ)({type:String})],f.prototype,"tutorialType",2),f=y([(0,o.EM)("tutorial-bubble")],f)},98979:(t,e,i)=>{"use strict";i.d(e,{A:()=>a});const a=i(71413).AH` 1150 .badge { 1151 display: inline-block; 1152 padding: 2px; 1153 font-size: var(--smallest); 1154 font-weight: 700; 1155 line-height: 1; 1156 text-align: center; 1157 white-space: nowrap; 1158 vertical-align: text-bottom; 1159 border-radius: 0.25rem; 1160 /* transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out; */ 1161 } 1162 .badge-pill { 1163 padding-right: 0.5rem; 1164 padding-left: 0.5rem; 1165 border-radius: 10rem; 1166 } 1167 .badge-teal { 1168 color: rgba(var(--notification-pill-badge-teal-fill, var(--bright-notification-fill)), 1); 1169 /* background-color: #e5f8ef; */ 1170 border: var(--border-width) solid 1171 rgba(var(--notification-pill-badge-teal-fill, var(--bright-notification-fill)), 1); 1172 } 1173`},39569:(t,e,i)=>{"use strict";i.d(e,{p:()=>d});var a=i(4842),o=i(5218),r=i(77614),s=i(78770),n=i.n(s);class l extends a.WL{constructor(){super(...arguments),this.memoizedSanitize=(0,r.A)((t=>{return e=t,n()(e,{allowedTags:n().defaults.allowedTags.concat(["img"]),allowedSchemes:n().defaults.allowedSchemes.concat(["data"]),allowedAttributes:{...n().defaults.allowedAttributes,h1:["id"],h2:["id"],h3:["id"],h4:["id"],h5:["id"],h6:["id"]}});var e}))}render(t){const e=this.memoizedSanitize(t);return(0,o._)(e)}}const d=(0,a.u$)(l)},49746:()=>{},19977:()=>{},197:()=>{},21866:()=>{},52739:()=>{}}]);
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.