Would you recommend that I change all “vars” to “const,” as I did here?
I put everything in notepad and replaced all the “vars” with “const.”
Good, or bad?
jslint says there are no errors in the code.
(function iife() {
"use strict";
function hide(el) {
el.classList.add("hide");
}
function hideInitialOverlay(wrapper) {
hide(wrapper);
}
function initialOverlayClickHandler() {
const wrapper = document.querySelector(".jacketa");
hideInitialOverlay(wrapper);
wrapper.removeEventListener("click", initialOverlayClickHandler);
}
function initButton(selector) {
const wrapper = document.querySelector(selector);
wrapper.addEventListener("click", initialOverlayClickHandler);
}
initButton(".jacketa");
}());
(function iife() {
"use strict";
document.querySelector(".jacketa").addEventListener("click", function() {
document.querySelector(".container").classList.remove("hide");
});
}());
(function iife() {
"use strict";
function show(el) {
el.classList.remove("hide");
}
function hide(el) {
el.classList.add("hide");
}
function getButtonContainer(el) {
while (el.classList.contains("playButton") === false) {
el = el.parentNode;
}
return el;
}
function hideAllButtons(button) {
button.querySelectorAll(".play, .pause, .speaker").forEach(hide);
}
function getPlay(button) {
return button.querySelector(".play");
}
function getPause(button) {
return button.querySelector(".pause");
}
function showPlayButton(button) {
const play = getPlay(button);
hideAllButtons(button);
show(play);
button.classList.remove("active");
}
function isPlaying(button) {
const play = getPlay(button);
return play.classList.contains("hide");
}
function pauseAllButtons() {
const buttons = document.querySelectorAll(".playButton");
buttons.forEach(function hidePause(button) {
if (isPlaying(button)) {
showPlayButton(button);
}
});
}
function showPauseButton(button) {
const pause = getPause(button);
pauseAllButtons();
hideAllButtons(button);
show(pause);
button.classList.add("active");
}
function getAudio() {
return document.querySelector("audio");
}
function playAudio(player, src) {
player.volume = 1.0;
if (player.getAttribute("src") !== src) {
player.setAttribute("src", src);
}
player.play();
}
function showButton(button, opts) {
if (opts.playing) {
showPlayButton(button);
} else {
showPauseButton(button);
}
}
function pauseAudio(player) {
player.pause();
}
function manageAudio(player, opts) {
if (opts.playing) {
pauseAudio(player);
} else {
playAudio(player, opts.src);
}
}
function togglePlayButton(button) {
const player = getAudio();
const playing = isPlaying(button);
showButton(button, {
playing
});
manageAudio(player, {
src: button.getAttribute("data-audio"),
playing
});
}
function playButtonClickHandler(evt) {
const button = getButtonContainer(evt.target);
togglePlayButton(button);
}
function initButton(selector) {
const wrapper = document.querySelector(selector);
wrapper.addEventListener("click", playButtonClickHandler);
}
initButton(".wrapa");
}());
(function iife() {
"use strict";
function hide(el) {
el.classList.add("hide");
}
function hideInitialOverlay(wrapper) {
hide(wrapper);
}
function initialOverlayClickHandler() {
const wrapper = document.querySelector(".jacketc");
hideInitialOverlay(wrapper);
wrapper.removeEventListener("click", initialOverlayClickHandler);
}
function initButton(selector) {
const wrapper = document.querySelector(selector);
wrapper.addEventListener("click", initialOverlayClickHandler);
}
initButton(".jacketc");
}());
(function iife() {
"use strict";
document.querySelector(".jacketc").addEventListener("click", function() {
document.querySelector(".wrapg").classList.remove("hide");
});
}());
(function iife() {
"use strict";
const tag = document.createElement("script");
tag.src = "https://www.youtube.com/player_api";
const firstScriptTag = document.getElementsByTagName("script")[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
function onPlayerReady(event) {
const youtubePlayer = event.target;
youtubePlayer.setVolume(100); // percent
}
window.onYouTubePlayerAPIReady = function() {
new YT.Player(document.querySelector(".js-player"), {
events: {
"onReady": onPlayerReady
}
});
};
}());
(function iife() {
"use strict";
function hide(el) {
el.classList.add("hide");
}
function hideInitialOverlay(wrapper) {
hide(wrapper);
}
function initialOverlayClickHandler() {
const wrapper = document.querySelector(".jacketd");
hideInitialOverlay(wrapper);
wrapper.removeEventListener("click", initialOverlayClickHandler);
}
function initButton(selector) {
const wrapper = document.querySelector(selector);
wrapper.addEventListener("click", initialOverlayClickHandler);
}
initButton(".jacketd");
}());
(function iife() {
"use strict";
document.querySelector(".jacketd").addEventListener("click", function() {
document.querySelector(".wraph").classList.remove("hide");
});
}());
(function iife() {
"use strict";
function show(el) {
el.classList.remove("hide");
}
function hide(el) {
el.classList.add("hide");
}
function getButtonContainer(el) {
while (el.classList.contains("playButton") === false) {
el = el.parentNode;
}
return el;
}
function hideAllButtons(button) {
button.querySelectorAll(".play, .pause, .speaker").forEach(hide);
}
function getPlay(button) {
return button.querySelector(".play ");
}
function getPause(button) {
return button.querySelector(".pause");
}
function getSpeaker(button) {
return button.querySelector(".speaker");
}
function showPlayButton(button) {
const play = getPlay(button);
hideAllButtons(button);
show(play);
button.classList.remove("active");
}
function isPlaying(button) {
const play = getPlay(button);
return play.classList.contains("hide");
}
function pauseAllButtons() {
const buttons = document.querySelectorAll(".playButton");
buttons.forEach(function hidePause(button) {
if (isPlaying(button)) {
showPlayButton(button);
}
});
}
function showPauseButton(button) {
const pause = getPause(button);
pauseAllButtons();
hideAllButtons(button);
show(pause);
button.classList.add("activated");
}
function showSpeakerButton(button) {
const speaker = getSpeaker(button);
hideAllButtons(button);
show(speaker);
}
function getAudio() {
return document.querySelector("audio");
}
function playAudio(player, src) {
player.volume = 1.0;
if (player.getAttribute("src") !== src) {
player.setAttribute("src", src);
}
player.play();
}
function showButton(button, opts) {
if (opts.playing) {
showPlayButton(button);
} else {
showPauseButton(button);
}
}
function pauseAudio(player) {
player.pause();
}
function manageAudio(player, opts) {
if (opts.playing) {
pauseAudio(player);
} else {
playAudio(player, opts.src);
}
}
function playButton(button) {
const player = getAudio();
const playing = isPlaying(button);
showButton(button, {
playing
});
manageAudio(player, {
src: button.getAttribute("data-audio"),
playing
});
}
function showPause(button) {
if (isPlaying(button)) {
showPauseButton(button);
}
}
function showSpeaker(button) {
if (isPlaying(button)) {
showSpeakerButton(button);
}
}
function playButtonClickHandler(evt) {
const button = getButtonContainer(evt.target);
playButton(button);
}
function playButtonMouseoverHandler(evt) {
const button = getButtonContainer(evt.target);
showPause(button);
}
function playButtonMouseoutHandler(evt) {
const button = getButtonContainer(evt.target);
showSpeaker(button);
}
function initButton(selector) {
const wrapper = document.querySelector(selector);
wrapper.addEventListener("click", playButtonClickHandler);
wrapper.addEventListener("mouseover", playButtonMouseoverHandler);
wrapper.addEventListener("mouseout", playButtonMouseoutHandler);
}
initButton(".wrapb");
}());
(function iife() {
"use strict";
function show(el) {
el.classList.remove("hide");
}
function hide(el) {
el.classList.add("hide");
}
function getButtonContainer(el) {
while (el.classList.contains("playButton") === false) {
el = el.parentNode;
}
return el;
}
function hideAllButtons(button) {
button.querySelectorAll(".play, .pause, .speaker").forEach(hide);
}
function getPlay(button) {
return button.querySelector(".play");
}
function getPause(button) {
return button.querySelector(".pause");
}
function showPlayButton(button) {
const play = getPlay(button);
hideAllButtons(button);
show(play);
button.classList.remove("active");
}
function isPlaying(button) {
const play = getPlay(button);
return play.classList.contains("hide");
}
function pauseAllButtons() {
const buttons = document.querySelectorAll(".playButton");
buttons.forEach(function hidePause(button) {
if (isPlaying(button)) {
showPlayButton(button);
}
});
}
function showPauseButton(button) {
const pause = getPause(button);
pauseAllButtons();
hideAllButtons(button);
show(pause);
}
function getAudio() {
return document.querySelector("audio");
}
function playAudio(player, src) {
player.volume = 1.0;
if (player.getAttribute("src") !== src) {
player.setAttribute("src", src);
}
player.play();
}
function showButton(button, opts) {
if (opts.playing) {
showPlayButton(button);
} else {
showPauseButton(button);
}
}
function pauseAudio(player) {
player.pause();
}
function manageAudio(player, opts) {
if (opts.playing) {
pauseAudio(player);
} else {
playAudio(player, opts.src);
}
}
function playButton(button) {
const player = getAudio();
const playing = isPlaying(button);
showButton(button, {
playing
});
manageAudio(player, {
src: button.getAttribute("data-audio"),
playing
});
}
function playButtonClickHandler(evt) {
const button = getButtonContainer(evt.target);
playButton(button);
}
function initButton(selector) {
const wrapper = document.querySelector(selector);
wrapper.addEventListener("click", playButtonClickHandler);
}
initButton(".wrapc");
}());
(function iife() {
"use strict";
function show(el) {
el.classList.remove("hide");
}
function hide(el) {
el.classList.add("hide");
}
function getButtonContainer(el) {
while (el.classList.contains("playButton") === false) {
el = el.parentNode;
}
return el;
}
function hideAllButtons(button) {
button.querySelectorAll(".play, .pause, .speaker").forEach(hide);
}
function getPlay(button) {
return button.querySelector(".play");
}
function getPause(button) {
return button.querySelector(".pause");
}
function showPlayButton(button) {
const play = getPlay(button);
hideAllButtons(button);
show(play);
button.classList.remove("active");
}
function isPlaying(button) {
const play = getPlay(button);
return play.classList.contains("hide");
}
function pauseAllButtons() {
const buttons = document.querySelectorAll(".playButton");
buttons.forEach(function hidePause(button) {
if (isPlaying(button)) {
showPlayButton(button);
}
});
}
function showPauseButton(button) {
const pause = getPause(button);
pauseAllButtons();
hideAllButtons(button);
show(pause);
}
function getAudio() {
return document.querySelector("audio");
}
function playAudio(player, src) {
player.volume = 1.0;
if (player.getAttribute("src") !== src) {
player.setAttribute("src", src);
}
player.play();
}
function showButton(button, opts) {
if (opts.playing) {
showPlayButton(button);
} else {
showPauseButton(button);
}
}
function pauseAudio(player) {
player.pause();
}
function manageAudio(player, opts) {
if (opts.playing) {
pauseAudio(player);
} else {
playAudio(player, opts.src);
}
}
function togglePlayButton(button) {
const player = getAudio();
const playing = isPlaying(button);
showButton(button, {
playing
});
manageAudio(player, {
src: button.getAttribute("data-audio"),
playing
});
}
function playButtonClickHandler(evt) {
const button = getButtonContainer(evt.target);
togglePlayButton(button);
}
function initButton(selector) {
const wrapper = document.querySelector(selector);
wrapper.addEventListener("click", playButtonClickHandler);
}
initButton(".wrapd");
}());
(function iife() {
"use strict";
function hide(el) {
el.classList.add("hide");
}
function hideInitialOverlay(wrapper) {
hide(wrapper);
}
function initialOverlayClickHandler() {
const wrapper = document.querySelector(".jacketb");
hideInitialOverlay(wrapper);
wrapper.removeEventListener("click", initialOverlayClickHandler);
}
function initButton(selector) {
const wrapper = document.querySelector(selector);
wrapper.addEventListener("click", initialOverlayClickHandler);
}
initButton(".jacketb");
}());
(function iife() {
"use strict";
document.querySelector(".jacketb").addEventListener("click", function() {
document.querySelector(".wrape").classList.remove("hide");
});
}());
(function iife() {
"use strict";
function show(el) {
el.classList.remove("hide");
}
function hide(el) {
el.classList.add("hide");
}
function getButtonContainer(el) {
while (el.classList.contains("playButton") === false) {
el = el.parentNode;
}
return el;
}
function hideAllButtons(button) {
button.querySelectorAll(".play, .pause, .speaker").forEach(hide);
}
function getPlay(button) {
return button.querySelector(".play");
}
function getPause(button) {
return button.querySelector(".pause");
}
function showPlayButton(button) {
const play = getPlay(button);
hideAllButtons(button);
show(play);
button.classList.remove("active");
}
function isPlaying(button) {
const play = getPlay(button);
return play.classList.contains("hide");
}
function pauseAllButtons() {
const buttons = document.querySelectorAll(".playButton");
buttons.forEach(function hidePause(button) {
if (isPlaying(button)) {
showPlayButton(button);
}
});
}
function showPauseButton(button) {
const pause = getPause(button);
pauseAllButtons();
hideAllButtons(button);
show(pause);
}
function getAudio() {
return document.querySelector("audio");
}
function playAudio(player, src) {
player.volume = 1.0;
if (player.getAttribute("src") !== src) {
player.setAttribute("src", src);
}
player.play();
}
function showButton(button, opts) {
if (opts.playing) {
showPlayButton(button);
} else {
showPauseButton(button);
}
}
function pauseAudio(player) {
player.pause();
}
function manageAudio(player, opts) {
if (opts.playing) {
pauseAudio(player);
} else {
playAudio(player, opts.src);
}
}
function togglePlayButton(button) {
const player = getAudio();
const playing = isPlaying(button);
showButton(button, {
playing
});
manageAudio(player, {
src: button.getAttribute("data-audio"),
playing
});
}
function playButtonClickHandler(evt) {
const button = getButtonContainer(evt.target);
togglePlayButton(button);
}
function initButton(selector) {
const wrapper = document.querySelector(selector);
wrapper.addEventListener("click", playButtonClickHandler);
}
initButton(".wrape");
}());
(function iife() {
"use strict";
function show(el) {
el.classList.remove("hide");
}
function hide(el) {
el.classList.add("hide");
}
function getButtonContainer(el) {
while (el.classList.contains("playButton") === false) {
el = el.parentNode;
}
return el;
}
function hideAllButtons(button) {
button.querySelectorAll(".play, .pause, .speaker").forEach(hide);
}
function getPlay(button) {
return button.querySelector(".play");
}
function getPause(button) {
return button.querySelector(".pause");
}
function showPlayButton(button) {
const play = getPlay(button);
hideAllButtons(button);
show(play);
button.classList.remove("active");
}
function isPlaying(button) {
const play = getPlay(button);
return play.classList.contains("hide");
}
function pauseAllButtons() {
const buttons = document.querySelectorAll(".playButton");
buttons.forEach(function hidePause(button) {
if (isPlaying(button)) {
showPlayButton(button);
}
});
}
function showPauseButton(button) {
const pause = getPause(button);
pauseAllButtons();
hideAllButtons(button);
show(pause);
}
function getAudio() {
return document.querySelector("audio");
}
function playAudio(player, src) {
player.volume = 1.0;
if (player.getAttribute("src") !== src) {
player.setAttribute("src", src);
}
player.play();
}
function showButton(button, opts) {
if (opts.playing) {
showPlayButton(button);
} else {
showPauseButton(button);
}
}
function pauseAudio(player) {
player.pause();
}
function manageAudio(player, opts) {
if (opts.playing) {
pauseAudio(player);
} else {
playAudio(player, opts.src);
}
}
function togglePlayButton(button) {
const player = getAudio();
const playing = isPlaying(button);
showButton(button, {
playing
});
manageAudio(player, {
src: button.getAttribute("data-audio"),
playing
});
}
function playButtonClickHandler(evt) {
const button = getButtonContainer(evt.target);
togglePlayButton(button);
}
function initButton(selector) {
const wrapper = document.querySelector(selector);
wrapper.addEventListener("click", playButtonClickHandler);
}
initButton(".wrapf");
}());