Skip to content

Commit

Permalink
fix: window.DisableAnimatedMan as boolean (#62)
Browse files Browse the repository at this point in the history 
* fix: window.DisableAnimatedMan as boolean

* chore: auto-fix linting and formatting issues

---------

Co-authored-by: hamster1963 <hamster1963@users.noreply.github.com>
  • Loading branch information
@hamster1963
hamster1963 and hamster1963 authored Dec 19, 2024
1 parent 9440d1f commit cc30a53
Show file tree
Hide file tree
Showing 2 changed files with 93 additions and 93 deletions.
2 changes: 1 addition & 1 deletion src/components/header.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -66,7 +66,7 @@ export default function Header() {
const navigate = useNavigate()

// @ts-expect-error DisableAnimatedMan is a global variable
const disableAnimatedMan = window.DisableAnimatedMan === true
const disableAnimatedMan = window.DisableAnimatedMan as boolean

return isDesktop ? (
<header className="flex pt-8 px-4 dark:bg-black/40 bg-muted border-b-[1px] overflow-visible">
Expand Down
184 changes: 92 additions & 92 deletions src/lib/inject.ts
View file
Original file line number Diff line number Diff line change
@@ -1,104 +1,104 @@
export const InjectContext = (content: string) => {
const tempDiv = document.createElement("div")
tempDiv.innerHTML = content
const tempDiv = document.createElement("div")
tempDiv.innerHTML = content

const INJECTION_MARK = "data-injected" // 自定义属性标识
const INJECTION_MARK = "data-injected" // 自定义属性标识

// 清理已有的注入资源
const cleanInjectedResources = () => {
document.querySelectorAll(`[${INJECTION_MARK}]`).forEach((node) => node.remove())
}

const loadExternalScript = (scriptElement: HTMLScriptElement): Promise<void> => {
return new Promise((resolve, reject) => {
const script = document.createElement("script")
script.src = scriptElement.src
script.async = false // 保持顺序执行
script.setAttribute(INJECTION_MARK, "true") // 添加标识
script.onload = () => resolve()
script.onerror = () => reject(new Error(`Failed to load script: ${scriptElement.src}`))
document.head.appendChild(script)
})
}
// 清理已有的注入资源
const cleanInjectedResources = () => {
document.querySelectorAll(`[${INJECTION_MARK}]`).forEach((node) => node.remove())
}

const executeInlineScript = (scriptElement: HTMLScriptElement): void => {
const script = document.createElement("script")
script.textContent = scriptElement.textContent
script.setAttribute(INJECTION_MARK, "true") // 添加标识
document.body.appendChild(script)
}
const loadExternalScript = (scriptElement: HTMLScriptElement): Promise<void> => {
return new Promise((resolve, reject) => {
const script = document.createElement("script")
script.src = scriptElement.src
script.async = false // 保持顺序执行
script.setAttribute(INJECTION_MARK, "true") // 添加标识
script.onload = () => resolve()
script.onerror = () => reject(new Error(`Failed to load script: ${scriptElement.src}`))
document.head.appendChild(script)
})
}

const loadStyle = (styleElement: HTMLStyleElement): Promise<void> => {
return new Promise((resolve, reject) => {
if ((styleElement as any).href) {
// 处理 <link>
const link = document.createElement("link")
link.rel = "stylesheet"
link.href = (styleElement as any).href
link.setAttribute(INJECTION_MARK, "true") // 添加标识
link.onload = () => resolve()
link.onerror = () => reject(new Error(`Failed to load stylesheet: ${link.href}`))
document.head.appendChild(link)
} else {
const style = document.createElement("style")
style.textContent = styleElement.textContent
style.setAttribute(INJECTION_MARK, "true") // 添加标识
document.head.appendChild(style)
resolve()
}
})
}
const executeInlineScript = (scriptElement: HTMLScriptElement): void => {
const script = document.createElement("script")
script.textContent = scriptElement.textContent
script.setAttribute(INJECTION_MARK, "true") // 添加标识
document.body.appendChild(script)
}

const handlers: { [key: string]: (element: HTMLElement) => Promise<void> } = {
SCRIPT: (element) => {
const scriptElement = element as HTMLScriptElement
if (scriptElement.src) {
// 加载外部脚本
return loadExternalScript(scriptElement)
} else {
// 推迟执行内联脚本，后续手动执行
return Promise.resolve()
}
},
STYLE: (element) => loadStyle(element as HTMLStyleElement),
META: (element) => {
const meta = element.cloneNode(true) as HTMLElement
meta.setAttribute(INJECTION_MARK, "true") // 添加标识
document.head.appendChild(meta) // 将 meta 标签插入到 <head>
return Promise.resolve()
},
DEFAULT: (element) => {
element.setAttribute(INJECTION_MARK, "true") // 添加标识
document.body.appendChild(element)
return Promise.resolve()
},
}
const loadStyle = (styleElement: HTMLStyleElement): Promise<void> => {
return new Promise((resolve, reject) => {
if ((styleElement as any).href) {
// 处理 <link>
const link = document.createElement("link")
link.rel = "stylesheet"
link.href = (styleElement as any).href
link.setAttribute(INJECTION_MARK, "true") // 添加标识
link.onload = () => resolve()
link.onerror = () => reject(new Error(`Failed to load stylesheet: ${link.href}`))
document.head.appendChild(link)
} else {
const style = document.createElement("style")
style.textContent = styleElement.textContent
style.setAttribute(INJECTION_MARK, "true") // 添加标识
document.head.appendChild(style)
resolve()
}
})
}

// 开始注入前清理已有资源
cleanInjectedResources()
const handlers: { [key: string]: (element: HTMLElement) => Promise<void> } = {
SCRIPT: (element) => {
const scriptElement = element as HTMLScriptElement
if (scriptElement.src) {
// 加载外部脚本
return loadExternalScript(scriptElement)
} else {
// 推迟执行内联脚本，后续手动执行
return Promise.resolve()
}
},
STYLE: (element) => loadStyle(element as HTMLStyleElement),
META: (element) => {
const meta = element.cloneNode(true) as HTMLElement
meta.setAttribute(INJECTION_MARK, "true") // 添加标识
document.head.appendChild(meta) // 将 meta 标签插入到 <head>
return Promise.resolve()
},
DEFAULT: (element) => {
element.setAttribute(INJECTION_MARK, "true") // 添加标识
document.body.appendChild(element)
return Promise.resolve()
},
}

const externalScriptQueue: Promise<void>[] = []
// 开始注入前清理已有资源
cleanInjectedResources()

Array.from(tempDiv.childNodes).forEach((node) => {
if (node.nodeType === Node.ELEMENT_NODE) {
const element = node as HTMLElement
if (element.tagName === "SCRIPT" && !(element as HTMLScriptElement).src) {
// 直接执行内联脚本
executeInlineScript(element as HTMLScriptElement)
} else {
const handler = handlers[element.tagName] || handlers.DEFAULT
externalScriptQueue.push(handler(element))
}
} else if (node.nodeType === Node.TEXT_NODE) {
document.body.appendChild(document.createTextNode(node.textContent || ""))
}
})
const externalScriptQueue: Promise<void>[] = []

return Promise.all(externalScriptQueue)
.then(() => {
console.log("All resources have been injected successfully.")
})
.catch((error) => {
console.error("Error during resource injection:", error)
Array.from(tempDiv.childNodes).forEach((node) => {
if (node.nodeType === Node.ELEMENT_NODE) {
const element = node as HTMLElement
if (element.tagName === "SCRIPT" && !(element as HTMLScriptElement).src) {
// 直接执行内联脚本
executeInlineScript(element as HTMLScriptElement)
} else {
const handler = handlers[element.tagName] || handlers.DEFAULT
externalScriptQueue.push(handler(element))
}
} else if (node.nodeType === Node.TEXT_NODE) {
document.body.appendChild(document.createTextNode(node.textContent || ""))
}
})

return Promise.all(externalScriptQueue)
.then(() => {
console.log("All resources have been injected successfully.")
})
.catch((error) => {
console.error("Error during resource injection:", error)
})
}

0 comments on commit cc30a53

Please sign in to comment.