eric/bridget
1
0
Fork 0
mirror of https://github.com/Sped0n/bridget.git synced 2026-04-21 13:39:30 -07:00
Code Issues Packages Projects Releases Wiki Activity

eslint update

Browse Source
This commit is contained in:
Spedon
2023-03-09 21:24:22 +08:00
parent 2618bbbcf2
commit 4208b6ed56
2 changed files with 67 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files

64
assets/js/theme.js
View File

@@ -1,35 +1,63 @@
const images = document.getElementsByClassName("image"); const images = document.getElementsByClassName('image')
let globalIndex = 0, const featuredPicNum = document.body.getAttribute('featuredPicNum')
last = {x: 0, y: 0};
let globalIndex = 0
let last = { x: 0, y: 0 }
function duper (num) {
return ('0000' + num).slice(-4)
}
const footerIndex = document.getElementsByClassName('ftid')
const numSpan = (numOne, numTwo) => {
const numOneString = duper(numOne)
const numTwoString = duper(numTwo)
footerIndex.item(0).innerText = numOneString[0]
footerIndex.item(1).innerText = numOneString[1]
footerIndex.item(2).innerText = numOneString[2]
footerIndex.item(3).innerText = numOneString[3]
footerIndex.item(4).innerText = numTwoString[0]
footerIndex.item(5).innerText = numTwoString[1]
footerIndex.item(6).innerText = numTwoString[2]
footerIndex.item(7).innerText = numTwoString[3]
}
numSpan(0, featuredPicNum)
const activate = (image, x, y) => { const activate = (image, x, y) => {
image.style.left = `${x}px`; image.style.left = `${x}px`
image.style.top = `${y}px`; image.style.top = `${y}px`
image.style.zIndex = globalIndex; image.style.zIndex = '' + globalIndex
image.dataset.status = "active"; image.dataset.status = 'active'
last = {x, y}; last = { x, y }
} }
const distanceFromLast = (x, y) => { const distanceFromLast = (x, y) => {
return Math.hypot(x - last.x, y - last.y); return Math.hypot(x - last.x, y - last.y)
} }
const handleOnMove = e => { const handleOnMove = e => {
if (distanceFromLast(e.clientX, e.clientY) > (window.innerWidth / 20)) { if (distanceFromLast(e.clientX, e.clientY) > (window.innerWidth / 20)) {
const lead = images[globalIndex % images.length], const imageIndex = globalIndex % images.length
tail = images[(globalIndex - 5) % images.length];
activate(lead, e.clientX, e.clientY); const lead = images[imageIndex]
const tail = images[(globalIndex - 5) % images.length]
if (tail) tail.dataset.status = "inactive"; activate(lead, e.clientX, e.clientY)
globalIndex++; numSpan((imageIndex + 1), featuredPicNum)
}
console.log(imageIndex + ' /' + featuredPicNum)
if (tail) tail.dataset.status = 'inactive'
globalIndex++
}
} }
window.onmousemove = e => handleOnMove(e); window.onmousemove = e => handleOnMove(e)
window.ontouchmove = e => handleOnMove(e.touches[0]); window.ontouchmove = e => handleOnMove(e.touches[0])

34
layouts/index.html
View File

@@ -1,23 +1,31 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html lang="en">
<head> <head>
<meta charset="utf-8" /> <meta charset="utf-8"/>
{{- partial "head.html" . -}} <meta name="viewport" content="width=device-width, initial-scale=1"/>
<title>{{ .Title }}</title> {{- partial "head.html" . -}}
<title>{{ .Title }}</title>
</head> </head>
<body> <body>
<header> <header>
{{- partial "header.html" . -}} {{- partial "header.html" . -}}
</header> </header>
<div id="main"> <div id="main">
{{ $sourcePath := "images" }} {{ $sourcePath := "images" }}
{{ $gallery := site.GetPage $sourcePath }} {{ $gallery := site.GetPage $sourcePath }}
{{ with $gallery.Resources.ByType "image" }} {{ $images := $gallery.Resources.ByType "image" }}
{{ range . }} {{ $index := len $images }}
<img class="image" src="{{ .RelPermalink }}" alt="x"/> <script type="text/javascript">
{{ end }} document.body.setAttribute('featuredPicNum', {{$index}})
{{ end }} </script>
{{ range $images }}
{{ $index = sub $index 1}}
<img class="image" data-index="{{ $index }}" data-status="inactive" src="{{ .RelPermalink }}"/>
{{ end }}
</div> </div>
{{- partial "footer.html" . -}} <footer>
{{ partial "footer.html" . }}
</footer>
</body> </body>
</html> </html>