+ return
{
return '/' + id.replace(/-/g, '')
}
-function getMediumZoomMargin() {
- const width = window.innerWidth
+// function getMediumZoomMargin() {
+// const width = window.innerWidth
- if (width < 500) {
- return 8
- } else if (width < 800) {
- return 20
- } else if (width < 1280) {
- return 30
- } else if (width < 1600) {
- return 40
- } else if (width < 1920) {
- return 48
- } else {
- return 72
- }
-}
+// if (width < 500) {
+// return 8
+// } else if (width < 800) {
+// return 20
+// } else if (width < 1280) {
+// return 30
+// } else if (width < 1600) {
+// return 40
+// } else if (width < 1920) {
+// return 48
+// } else {
+// return 72
+// }
+// }
export default NotionPage
diff --git a/components/Player.js b/components/Player.js
index ec0ea461..98da72c3 100644
--- a/components/Player.js
+++ b/components/Player.js
@@ -5,7 +5,7 @@ const Player = () => {
const [player, setPlayer] = React.useState()
const ref = React.useRef(null)
- const showLrc = JSON.parse(BLOG.MUSIC_PLAYER_SHOW_LRC)
+ const lrcType = JSON.parse(BLOG.MUSIC_PLAYER_LRC_TYPE)
const playerVisible = JSON.parse(BLOG.MUSIC_PLAYER_VISIBLE)
const autoPlay = JSON.parse(BLOG.MUSIC_PLAYER_AUTO_PLAY)
@@ -16,7 +16,7 @@ const Player = () => {
setPlayer(new window.APlayer({
container: ref.current,
fixed: true,
- showlrc: showLrc,
+ lrcType: lrcType,
autoplay: autoPlay,
order: BLOG.MUSIC_PLAYER_ORDER,
audio: BLOG.MUSIC_PLAYER_AUDIO_LIST
diff --git a/components/Ribbon.js b/components/Ribbon.js
index d96e3591..2c6855fc 100644
--- a/components/Ribbon.js
+++ b/components/Ribbon.js
@@ -1,10 +1,20 @@
/* eslint-disable */
-import React from 'react'
+import { useEffect } from 'react'
+const id = 'canvasRibbon'
export const Ribbon = () => {
- React.useEffect(() => {
+ const destroyRibbon = ()=>{
+ const ribbon = document.getElementById(id)
+ if(ribbon && ribbon.parentNode){
+ ribbon.parentNode.removeChild(ribbon)
+ }
+ }
+
+ useEffect(() => {
createRibbon()
+ return () => destroyRibbon()
}, [])
+ return <>
}
/**
@@ -29,6 +39,7 @@ function createRibbon() {
a = window.innerWidth,
l = window.innerHeight,
d = e.s
+ i.id= id
let r, s
const u = Math
let h = 0
diff --git a/components/Sakura.js b/components/Sakura.js
index 3f69cc25..7898b3cc 100644
--- a/components/Sakura.js
+++ b/components/Sakura.js
@@ -1,10 +1,19 @@
/* eslint-disable */
-import React from 'react'
-
+import { useEffect } from 'react'
+const id = 'canvas_sakura'
export const Sakura = () => {
- React.useEffect(() => {
+ const destroySakura = ()=>{
+ const sakura = document.getElementById(id)
+ if(sakura && sakura.parentNode){
+ sakura.parentNode.removeChild(sakura)
+ }
+ }
+
+ useEffect(() => {
createSakura({})
+ return () => destroySakura()
}, [])
+ return <>
}
/**
@@ -129,7 +138,7 @@ function createSakura() {
'style',
'position: fixed;left: 0;top: 0;pointer-events: none;'
)
- canvas.setAttribute('id', 'canvas_sakura')
+ canvas.setAttribute('id', id)
document.getElementsByTagName('body')[0].appendChild(canvas)
cxt = canvas.getContext('2d')
var sakuraList = new SakuraList()
@@ -165,15 +174,12 @@ function createSakura() {
stop = requestAnimationFrame(asd)
}
}
- window.onresize = function () {
- var canvasSnow = document.getElementById('canvas_snow')
- }
img.onload = function () {
startSakura()
}
function stopp() {
if (staticx) {
- var child = document.getElementById('canvas_sakura')
+ var child = document.getElementById(id)
child.parentNode.removeChild(child)
window.cancelAnimationFrame(stop)
staticx = false
diff --git a/components/SideBarDrawer.js b/components/SideBarDrawer.js
index 47052db9..0db865cb 100644
--- a/components/SideBarDrawer.js
+++ b/components/SideBarDrawer.js
@@ -1,5 +1,5 @@
import { useRouter } from 'next/router'
-import React from 'react'
+import { useEffect } from 'react'
/**
* 侧边栏抽屉面板，可以从侧面拉出
@@ -8,7 +8,7 @@ import React from 'react'
*/
const SideBarDrawer = ({ children, isOpen, onOpen, onClose, className }) => {
const router = useRouter()
- React.useEffect(() => {
+ useEffect(() => {
const sideBarDrawerRouteListener = () => {
switchSideDrawerVisible(false)
}
@@ -37,8 +37,8 @@ const SideBarDrawer = ({ children, isOpen, onOpen, onClose, className }) => {
}
}
- return
