Page MenuHomePhorge
Files F85649326

No OneTemporary
Actions

Size
3 KB
Referenced Files
None
Subscribers
None

View Options

diff --git a/src/services/favicon_service/favicon_service.js b/src/services/favicon_service/favicon_service.js
index d1ddee4102..7e19629d98 100644
--- a/src/services/favicon_service/favicon_service.js
+++ b/src/services/favicon_service/favicon_service.js
@@ -1,61 +1,67 @@
-import { find } from 'lodash'
-
const createFaviconService = () => {
- let favimg, favcanvas, favcontext, favicon
+ const favicons = []
const faviconWidth = 128
const faviconHeight = 128
const badgeRadius = 32
const initFaviconService = () => {
- const nodes = document.getElementsByTagName('link')
- favicon = find(nodes, node => node.rel === 'icon')
- if (favicon) {
- favcanvas = document.createElement('canvas')
- favcanvas.width = faviconWidth
- favcanvas.height = faviconHeight
- favimg = new Image()
- favimg.src = favicon.href
- favcontext = favcanvas.getContext('2d')
- }
+ const nodes = document.querySelectorAll('link[rel="icon"]')
+ nodes.forEach(favicon => {
+ if (favicon) {
+ const favcanvas = document.createElement('canvas')
+ favcanvas.width = faviconWidth
+ favcanvas.height = faviconHeight
+ const favimg = new Image()
+ favimg.crossOrigin = 'anonymous'
+ favimg.src = favicon.href
+ const favcontext = favcanvas.getContext('2d')
+ favicons.push({ favcanvas, favimg, favcontext, favicon })
+ }
+ })
}
const isImageLoaded = (img) => img.complete && img.naturalHeight !== 0
const clearFaviconBadge = () => {
- if (!favimg || !favcontext || !favicon) return
+ if (favicons.length === 0) return
+ favicons.forEach(({ favimg, favcanvas, favcontext, favicon }) => {
+ if (!favimg || !favcontext || !favicon) return
- favcontext.clearRect(0, 0, faviconWidth, faviconHeight)
- if (isImageLoaded(favimg)) {
- favcontext.drawImage(favimg, 0, 0, favimg.width, favimg.height, 0, 0, faviconWidth, faviconHeight)
- }
- favicon.href = favcanvas.toDataURL('image/png')
+ favcontext.clearRect(0, 0, faviconWidth, faviconHeight)
+ if (isImageLoaded(favimg)) {
+ favcontext.drawImage(favimg, 0, 0, favimg.width, favimg.height, 0, 0, faviconWidth, faviconHeight)
+ }
+ favicon.href = favcanvas.toDataURL('image/png')
+ })
}
const drawFaviconBadge = () => {
- if (!favimg || !favcontext || !favcontext) return
-
+ if (favicons.length === 0) return
clearFaviconBadge()
+ favicons.forEach(({ favimg, favcanvas, favcontext, favicon }) => {
+ if (!favimg || !favcontext || !favcontext) return
+
+ const style = getComputedStyle(document.body)
+ const badgeColor = `${style.getPropertyValue('--badgeNotification') || 'rgb(240, 100, 100)'}`
- const style = getComputedStyle(document.body)
- const badgeColor = `${style.getPropertyValue('--badgeNotification') || 'rgb(240, 100, 100)'}`
-
- if (isImageLoaded(favimg)) {
- favcontext.drawImage(favimg, 0, 0, favimg.width, favimg.height, 0, 0, faviconWidth, faviconHeight)
- }
- favcontext.fillStyle = badgeColor
- favcontext.beginPath()
- favcontext.arc(faviconWidth - badgeRadius, badgeRadius, badgeRadius, 0, 2 * Math.PI, false)
- favcontext.fill()
- favicon.href = favcanvas.toDataURL('image/png')
+ if (isImageLoaded(favimg)) {
+ favcontext.drawImage(favimg, 0, 0, favimg.width, favimg.height, 0, 0, faviconWidth, faviconHeight)
+ }
+ favcontext.fillStyle = badgeColor
+ favcontext.beginPath()
+ favcontext.arc(faviconWidth - badgeRadius, badgeRadius, badgeRadius, 0, 2 * Math.PI, false)
+ favcontext.fill()
+ favicon.href = favcanvas.toDataURL('image/png')
+ })
}
return {
initFaviconService,
clearFaviconBadge,
drawFaviconBadge
}
}
const FaviconService = createFaviconService()
export default FaviconService

File Metadata

Mime Type
text/x-diff
Expires
Sat, Aug 29, 9:51 AM (1 d, 21 h)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
1736986
Default Alt Text
(3 KB)

Event Timeline