1
0
mirror of https://github.com/go-gitea/gitea.git synced 2024-11-04 08:17:24 -05:00
gitea/web_src/js/webcomponents/GiteaOriginUrl.js
wxiaoguang 529bac1950
Polyfill the window.customElements (#23592)
Related: #23590

Reference:
https://github.com/webcomponents/polyfills/tree/master/packages/webcomponentsjs

It seems that there are some users using old browsers, so the
`window.customElements` need polyfill.

The Custom Elements would help a lot for Gitea's UI problems, including:

* `<span class="js-pretty-number">`
* `<time data-format>`

So it's worth get polyfill.

---------

Co-authored-by: delvh <dev.lh@web.de>
2023-03-20 23:17:56 +08:00

20 lines
862 B
JavaScript

import '@webcomponents/custom-elements'; // automatically adds custom elements for older browsers that don't support it
// this is a Gitea's private HTML component, it converts an absolute or relative URL to an absolute URL with the current origin
window.customElements.define('gitea-origin-url', class extends HTMLElement {
connectedCallback() {
const urlStr = this.getAttribute('data-url');
try {
// only process absolute HTTP/HTTPS URL or relative URLs ('/xxx' or '//host/xxx')
if (urlStr.startsWith('http://') || urlStr.startsWith('https://') || urlStr.startsWith('/')) {
const url = new URL(urlStr, window.origin);
url.protocol = window.location.protocol;
url.host = window.location.host;
this.textContent = url.toString();
return;
}
} catch {}
this.textContent = urlStr;
}
});