You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
70 lines
1.6 KiB
70 lines
1.6 KiB
var canvas = document.getElementById('logo-canvas'), |
|
ctx = canvas.getContext('2d'), |
|
logo_wrap = document.getElementById('logo-wrap'), |
|
splash = document.getElementById('splash'), |
|
logo_img = document.getElementById('logo-img'), |
|
color = "white", |
|
lasttime, |
|
freeze |
|
|
|
|
|
function fixdim() { |
|
dimensions.update() |
|
|
|
var displaywidth = Math.sqrt(dimensions.width)*18//dimensions.width > 900 ? 900 : 450 |
|
|
|
var doc = document.documentElement; |
|
var top = (window.pageYOffset || doc.scrollTop) - (doc.clientTop || 0); |
|
|
|
// logo_wrap.style.top = top / 2 + 'px' |
|
var rect = splash.getBoundingClientRect() |
|
var bottom = rect.top + rect.height |
|
|
|
var fadestart = rect.height/2 |
|
|
|
logo_wrap.style.opacity = Math.max(Math.min((bottom-fadestart)/fadestart,1),0) |
|
|
|
logo_img.style.width = displaywidth + 'px' |
|
|
|
if(!freeze){ |
|
var displayheight = displaywidth * 4/15 //dimensions.width > 900 ? 250 : 125 |
|
canvas.width = displayheight*window.devicePixelRatio |
|
canvas.style.width = displayheight + 'px' |
|
canvas.height = displayheight*window.devicePixelRatio |
|
canvas.style.height = displayheight + 'px' |
|
} |
|
} |
|
|
|
addEventListener('scroll', fixdim) |
|
|
|
var gh = .12; |
|
|
|
function main (time) { |
|
fixdim() |
|
ctx.clearRect(0,0,canvas.width,canvas.height) |
|
|
|
var t = time/10000 |
|
|
|
ctx.strokeStyle = ctx.fillStyle = color |
|
var sm = 1 |
|
|
|
var m = tesseractwithrotation(t, t*2, t*3, mouse.x/100, mouse.y/100, 0) |
|
|
|
drawtesseract(ctx, m, { |
|
x: canvas.width/2, |
|
y: canvas.height/2, |
|
size: gh*canvas.height, |
|
line_width: 2, |
|
}) |
|
|
|
lasttime = time |
|
requestAnimationFrame(main) |
|
} |
|
|
|
|
|
|
|
requestAnimationFrame(function init(t) { |
|
fixdim() |
|
lasttime = t |
|
requestAnimationFrame(main) |
|
}) |