MCPcopy Index your code
hub / github.com/Maps4HTML/MapML.js / _createStylesheetLink

Method _createStylesheetLink

src/map-link.js:424–483  ·  view source on GitHub ↗
()

Source from the content-addressed store, hash-verified

422 if (this.href && this.projection) this._alternate = true;
423 }
424 _createStylesheetLink() {
425 // MIME type application/pmtiles+stylesheet is an invention of the requirement to get
426 // closer to loading style rules as CSS does, via link / (map-link)
427 // we could probably do something similar with map-style i.e. treat the
428 // content of map-style as though it was a stylesheet tbd caveat CSP
429 if (this.type === 'application/pmtiles+stylesheet') {
430 const pmtilesStyles = new URL(this.href, this.getBase()).href;
431 import(pmtilesStyles)
432 .then((module) => module.pmtilesRulesReady)
433 .then((initializedRules) => {
434 this._pmtilesRules = initializedRules;
435 })
436 .catch((reason) => {
437 console.error(
438 'Error importing pmtiles symbolizer rules or theme: \n' + reason
439 );
440 });
441 } else {
442 // a CSS stylesheet
443 // if the parent element is a map-link, the stylesheet is a link that should
444 // be loaded as part of a templated layer processing i.e. on moveend
445 // and the generated <link> that implements this <map-link> should be located
446 // in the parent <map-link>._templatedLayer.container root node if
447 // the _templatedLayer is an instance of TemplatedTileLayer or
448 // TemplatedFeaturesOrTilesLayer
449 //
450 // if the parent node (or the host of the shadow root parent node) is map-layer, the link should be created in the _layer
451 // container
452 this._stylesheetHost =
453 this.getRootNode() instanceof ShadowRoot
454 ? this.getRootNode().host
455 : this.parentElement;
456 if (this._stylesheetHost === undefined) return;
457
458 this.link = document.createElement('link');
459 this.link.mapLink = this;
460 this.link.setAttribute('href', new URL(this.href, this.getBase()).href);
461 copyAttributes(this, this.link);
462
463 // IMPORTANT: Only render if the correct container exists for THIS element's parent.
464 // Don't fall back to _extentLayer if this is a layer child - wait for _layer instead.
465 const isLayerChild = this._stylesheetHost.tagName === 'MAP-LAYER';
466 const isExtentChild = this._stylesheetHost.tagName === 'MAP-EXTENT';
467
468 if (isLayerChild && this._stylesheetHost._layer) {
469 this._stylesheetHost._layer.renderStyles(this);
470 } else if (isExtentChild && this._stylesheetHost._extentLayer) {
471 this._stylesheetHost._extentLayer.renderStyles(this);
472 } else if (this._stylesheetHost._templatedLayer) {
473 this._stylesheetHost._templatedLayer.renderStyles(this);
474 }
475 }
476
477 function copyAttributes(source, target) {
478 return Array.from(source.attributes).forEach((attribute) => {
479 if (attribute.nodeName !== 'href' && attribute.nodeName !== 'media')
480 target.setAttribute(attribute.nodeName, attribute.nodeValue);
481 });

Callers 2

connectedCallbackMethod · 0.95
_enableLinkMethod · 0.95

Calls 3

getBaseMethod · 0.95
copyAttributesFunction · 0.85
setAttributeMethod · 0.80

Tested by

no test coverage detected