diff --git a/app/javascript/packs/colorPicker.js b/app/javascript/packs/colorPicker.js
index 1ba554230..4cf0bb7b5 100644
--- a/app/javascript/packs/colorPicker.js
+++ b/app/javascript/packs/colorPicker.js
@@ -1,66 +1,76 @@
function makeColorPickerGo(colorInput, colorPalette) {
-
- colorInput.addEventListener("click", showColorPalette);
- colorInput.addEventListener("focusout", hideColorPalette);
- colorPalette.mouseIsOver = false;
- colorInput.style.border = `2px solid ${colorInput.value}`;
-
- colorPalette.onmouseover = () => {
- colorPalette.mouseIsOver = true;
- };
- colorPalette.onmouseout = () => {
- colorPalette.mouseIsOver = false;
- }
+ const currentColorInput = colorInput;
+ const currentColorPalette = colorPalette;
function hideColorPalette() {
- if(colorPalette.mouseIsOver === false) {
- colorPalette.style.display = 'none';
- colorInput.style.border = `2px solid ${colorInput.value}`;
+ if (currentColorPalette.mouseIsOver === false) {
+ currentColorPalette.style.display = 'none';
+ currentColorInput.style.border = `2px solid ${currentColorInput.value}`;
}
}
- function chooseColor(e) {
- let color = rgbToHex(e.target.style.backgroundColor);
- colorInput.value = color;
- colorInput.style.border = `2px solid ${color}`;
- colorPalette.style.display = 'none';
- }
-
function componentToHex(c) {
- var hex = c.toString(16);
- return hex.length == 1 ? "0" + hex : hex;
+ const hex = c.toString(16);
+ return hex.length === 1 ? `0${hex}` : hex;
}
function rgbToHex(color) {
- var arr = color.replace('rgb', '').replace('(', '').replace(')', '').split(',');
- return "#" + componentToHex(Number(arr[0])) + componentToHex(Number(arr[1])) + componentToHex(Number(arr[2]));
+ const arr = color
+ .replace('rgb', '')
+ .replace('(', '')
+ .replace(')', '')
+ .split(',');
+ return `#${componentToHex(Number(arr[0]))}${componentToHex(
+ Number(arr[1]),
+ )}${componentToHex(Number(arr[2]))}`;
+ }
+
+ function chooseColor(e) {
+ const color = rgbToHex(e.target.style.backgroundColor);
+ currentColorInput.value = color;
+ currentColorInput.style.border = `2px solid ${color}`;
+ currentColorPalette.style.display = 'none';
}
function showColorPalette() {
- console.log('show')
- colorPalette.style.display = 'block';
- var newDiv = '';
- colorPalette.innerHTML = newDiv;
- var options = document.getElementsByClassName('color-option')
- for (var i = 0; i < options.length; i++) {
- options[i].onclick = function(event) {chooseColor(event)}
+ currentColorPalette.style.display = 'block';
+ const newDiv =
+ '';
+ currentColorPalette.innerHTML = newDiv;
+ const options = document.getElementsByClassName('color-option');
+ for (let i = 0; i < options.length; i += 1) {
+ options[i].onclick = function handleColorOptionClick(event) {
+ chooseColor(event);
+ };
}
}
+ currentColorInput.addEventListener('click', showColorPalette);
+ currentColorInput.addEventListener('focusout', hideColorPalette);
+
+ currentColorPalette.mouseIsOver = false;
+ currentColorInput.style.border = `2px solid ${colorInput.value}`;
+
+ currentColorPalette.onmouseover = () => {
+ currentColorPalette.mouseIsOver = true;
+ };
+ currentColorPalette.onmouseout = () => {
+ currentColorPalette.mouseIsOver = false;
+ };
}
-var colorInputs = document.getElementsByClassName('color-picker');
-var colorPalettes = document.getElementsByClassName('color-palette');
+const colorInputs = document.getElementsByClassName('color-picker');
+const colorPalettes = document.getElementsByClassName('color-palette');
-for (var i = 0; i < colorInputs.length; i++) {
+for (let i = 0; i < colorInputs.length; i += 1) {
makeColorPickerGo(colorInputs[i], colorPalettes[i]);
}
window.InstantClick.on('change', () => {
- var colorInputs = document.getElementsByClassName('color-picker');
- var colorPalettes = document.getElementsByClassName('color-palette');
+ const colorInputElements = document.getElementsByClassName('color-picker');
+ const colorPaletteElements = document.getElementsByClassName('color-palette');
- for (var i = 0; i < colorInputs.length; i++) {
- makeColorPickerGo(colorInputs[i], colorPalettes[i]);
+ for (let i = 0; i < colorInputElements.length; i += 1) {
+ makeColorPickerGo(colorInputElements[i], colorPaletteElements[i]);
}
-});
\ No newline at end of file
+});
diff --git a/app/javascript/packs/notificationSubscriptionHandler.js b/app/javascript/packs/notificationSubscriptionHandler.js
index 3757a01fe..77c215e4c 100644
--- a/app/javascript/packs/notificationSubscriptionHandler.js
+++ b/app/javascript/packs/notificationSubscriptionHandler.js
@@ -84,8 +84,8 @@ function loadFunctionality() {
subscriptionButtons[i].addEventListener('click', e => {
e.preventDefault();
updateStatus(e.target);
- if (typeof sendHapticMessage !== 'undefined') {
- sendHapticMessage('medium');
+ if (typeof window.sendHapticMessage !== 'undefined') {
+ window.sendHapticMessage('medium');
}
});
subscriptionButtons[i].addEventListener('keydown', e => {