Рони - что-то не так пошло!!,,,,,???:(
По итогу:
приветствие
document.addEventListener("DOMContentLoaded", function () {
let user = localStorage.getItem("userName");
let title = user ? `Привет ${user}!` : `Введите своё имя.`;
let h1 = document.querySelector("h1");
h1.textContent = title;
let newname = document.querySelector("[name='newname']");
newname.hidden = !user;
let username = document.querySelector("[name='username']");
username.hidden = user;
user && (username.value = user);
let form = document.querySelector("form");
form.addEventListener("click", event => {
let { target } = event;
let txt = username.value.trim();
if (target == newname) {
localStorage.removeItem('userName');
form.action = ""
} else if (txt) {
localStorage.setItem("userName", txt);
form.action = 'play.html'//переход на страницу игры
} else event.preventDefault()
})
});
игра -тут проблема вылетили карандаши......
"use strict";
//Работа с цветам
const colors = [
{ color: '#ff0000', image: 'Pic/pencil_red.png' },
{ color: '#ffa500', image: 'Pic/pencil_orange.png' },
{ color: '#ffff00', image: 'Pic/pencil_yellow.png' },
{ color: '#008000', image: 'Pic/pencil_green.png' },
{ color: '#0000ff', image: 'Pic/pencil_blue.png' },
{ color: '#00008b', image: 'Pic/pencil_dark_blue.png' },
{ color: '#800080', image: 'Pic/pencil_purple.png' },
];
function renderColorPalette() {
const paletteContainer = document.querySelector(".palette");
const colorsItems = colors
.map(n => `
<button
style="background-image: url(${n.image})"
class="palette-button"
data-color="${n.color}"
></button>`)
.join('');
paletteContainer.innerHTML = colorsItems;
}
function handleClickOnColor(event) {
const button = event.target.closest(".palette-button");
if (!button) return;
const oldActiveButton = document.querySelector(".palette-button-active");
if (oldActiveButton) {
oldActiveButton.classList.remove("palette-button-active");
}
button.classList.add("palette-button-active");
}
function setEventsOnFilledElements() {
function handleMouseEnter() {
this.classList.add("selected");
}
function handleMouseLeave() {
this.classList.remove("selected");
}
const elements = document.querySelectorAll("*[fill]");
function handleClick() {
const currentColor = document.querySelector(".palette-button-active");
if (!currentColor) {
alert("Цвет не выбран");
return;
}
const save = { elem: this, color: this.getAttribute("fill") };
stateStack.push(save);
this.setAttribute("fill", currentColor.dataset.color);
if ([...elements].every(ep => ep.getAttribute('fill') != '#ffffff')) {
tick();
let time = document.getElementById('play_timer').innerHTML;
localStorage.setItem("time ", time);
setTimeout(() => alert('Вы всё закрасили!'));
* location.href = "/rekord.html";
}
}
elements.forEach(element => {
element.addEventListener("mouseenter", handleMouseEnter);
element.addEventListener("mouseleave", handleMouseLeave);
element.addEventListener("click", handleClick);
});
}
document.addEventListener("DOMContentLoaded", renderColorPalette);
document.addEventListener("click", handleClickOnColor);
document.addEventListener("DOMContentLoaded", setEventsOnFilledElements);
function check() {
const { length } = [...document.querySelectorAll("*[fill]")].filter(ep => ep.getAttribute('fill') == '#ffffff');
const txt = length ? `Ещё ${length} фигур не закрашено` : 'Вы всё закрасили!'
alert(txt)
}
const stateStack = []
function rev() {
if (stateStack.length) {
const { elem, color } = stateStack.pop();
elem.setAttribute("fill", color)
}
}
есть еще вот это
"use strict";
$(document).ready(function () {
if (localStorage.getItem("users") === null) {
localStorage.setItem("users", JSON.stringify([]));
}
let users = JSON.parse(localStorage.getItem("users"));
let userName = localStorage.getItem("userName");
let time = localStorage.getItem("time")
users.push({ userName, time });
localStorage.setItem("users", JSON.stringify(users));
for (const item of users) console.log(item);
var $select = $('#name');
$select.ready(function (event) {
$.each(JSON.parse(users), function (key, value) {
$('<option>').val(value.name).text(value.name).appendTo($select);
});
});
$('#play_game').click(function () {
let userName = document.getElementById('new_name').value;
localStorage.setItem("userName", userName)
users = JSON.parse(users);
users.push(newUser);
console.log(users);
localStorage.setItem("users", JSON.stringify(users));
});
});
Рони, я тебе что-бы проще было, в личку полностью файл(ссылку), если не против, там картинки и лого, не могу сдесь выложить:agree: Прошу прощения форумчане.