fix color cycling

This commit is contained in:
Kyle
2020-07-27 15:23:39 -07:00
parent e0438d01b1
commit b772555d43
2 changed files with 18 additions and 40 deletions

View File

@@ -8,28 +8,17 @@ rootStyles.setProperty('--font-color', '#000000')
rootStyles.setProperty('--body-background', 'none') rootStyles.setProperty('--body-background', 'none')
setCookie('colorPalette', 'dayRave') setCookie('colorPalette', 'dayRave')
//Stops the hue shift when another palette is loaded
if (document.getElementById('inputColorPalette') != null) {
document.getElementById('inputColorPalette').addEventListener('change', removeEventListener, false)
} else {
setTimeout(function() {document.getElementById('inputColorPalette').addEventListener('change', removeEventListener, false)}, 1000)
}
function removeEventListener() {
if (document.getElementById('inputColorPalette').value != 'dayRave') {
clearInterval(colorCycle)
document.getElementById('inputColorPalette').removeEventListener('change', removeEventListener, false)
}
}
//Shifts the hue //Shifts the hue
var colorCycle = setInterval(shiftHue, 200) var colorCycle
var currentHueRotation = 0 var currentHueRotation = 0
if (colorCycle == undefined) {
colorCycle = setInterval(shiftHue, 200)
}
function shiftHue() { function shiftHue(checkForClear = false) {
if (document.getElementById('inputColorPalette').value.includes('Rave')) {
rootStyles.setProperty('--site-background-filter', 'grayscale(0) hue-rotate(' + currentHueRotation + 'deg)') rootStyles.setProperty('--site-background-filter', 'grayscale(0) hue-rotate(' + currentHueRotation + 'deg)')
currentHueRotation += 1 currentHueRotation += 1
if (currentHueRotation == 360) { if (currentHueRotation == 360) {currentHueRotation = 0}
currentHueRotation = 0
} }
} }

View File

@@ -8,28 +8,17 @@ rootStyles.setProperty('--font-color', '#efefef')
rootStyles.setProperty('--body-background', 'none') rootStyles.setProperty('--body-background', 'none')
setCookie('colorPalette', 'nightRave') setCookie('colorPalette', 'nightRave')
//Stops the hue shift when another palette is loaded
if (document.getElementById('inputColorPalette') != null) {
document.getElementById('inputColorPalette').addEventListener('change', removeEventListener, false)
} else {
setTimeout(function() {document.getElementById('inputColorPalette').addEventListener('change', removeEventListener, false)}, 1000)
}
function removeEventListener() {
if (document.getElementById('inputColorPalette').value != 'nightRave') {
clearInterval(colorCycle)
document.getElementById('inputColorPalette').removeEventListener('change', removeEventListener, false)
}
}
//Shifts the hue //Shifts the hue
var colorCycle = setInterval(shiftHue, 200) var colorCycle
var currentHueRotation = 0 var currentHueRotation = 0
if (colorCycle == undefined) {
colorCycle = setInterval(shiftHue, 200)
}
function shiftHue() { function shiftHue(checkForClear = false) {
if (document.getElementById('inputColorPalette').value.includes('Rave')) {
rootStyles.setProperty('--site-background-filter', 'grayscale(0) hue-rotate(' + currentHueRotation + 'deg)') rootStyles.setProperty('--site-background-filter', 'grayscale(0) hue-rotate(' + currentHueRotation + 'deg)')
currentHueRotation += 1 currentHueRotation += 1
if (currentHueRotation == 360) { if (currentHueRotation == 360) {currentHueRotation = 0}
currentHueRotation = 0
} }
} }