// ===== ЛОГИКА МАСТЕРА =====
const BookWizard = {
currentStep: 1,
totalSteps: 3,
selectedType: null,
selectedStyle: 'classic',
pagesCount: 10,
coverFile: null,
init: function() {
this.modal = document.getElementById('bookWizard');
this.steps = this.modal.querySelectorAll('.wizard-step');
this.setupTypeSelection();
this.setupStyleSelection();
this.setupPagesControl();
this.setupCoverUpload();
this.setupNavigation();
this.setupCreateBook();
// Открыть мастер при клике на "Создать книгу"
document.getElementById('createBookWelcomeBtn').onclick = () => this.open();
},
open: function() {
this.currentStep = 1;
this.showStep(1);
this.modal.classList.add('active');
},
close: function() {
this.modal.classList.remove('active');
},
showStep: function(step) {
this.steps.forEach((el, i) => {
el.classList.toggle('active', i + 1 === step);
});
this.currentStep = step;
},
setupTypeSelection: function() {
const cards = this.modal.querySelectorAll('.type-card');
const nextBtn = this.modal.querySelector('.wizard-step[data-step="1"] .next-btn');
cards.forEach(card => {
card.addEventListener('click', () => {
cards.forEach(c => c.classList.remove('selected'));
card.classList.add('selected');
this.selectedType = card.dataset.type;
nextBtn.disabled = false;
});
});
},
setupStyleSelection: function() {
const cards = this.modal.querySelectorAll('.style-card');
cards.forEach(card => {
card.addEventListener('click', () => {
cards.forEach(c => c.classList.remove('active'));
card.classList.add('active');
this.selectedStyle = card.dataset.style;
});
});
},
setupPagesControl: function() {
const minus = document.getElementById('pagesMinus');
const plus = document.getElementById('pagesPlus');
const display = document.getElementById('pagesCountDisplay');
minus.addEventListener('click', () => {
if (this.pagesCount > 1) {
this.pagesCount--;
display.textContent = this.pagesCount;
}
});
plus.addEventListener('click', () => {
if (this.pagesCount < 50) {
this.pagesCount++;
display.textContent = this.pagesCount;
}
});
},
setupCoverUpload: function() {
const uploadBtn = document.getElementById('coverUploadBtn');
const fileInput = document.getElementById('coverFileInput');
const fileName = document.getElementById('coverFileName');
uploadBtn.addEventListener('click', () => fileInput.click());
fileInput.addEventListener('change', function() {
if (this.files && this.files[0]) {
const file = this.files[0];
const reader = new FileReader();
reader.onload = function(e) {
BookWizard.coverFile = e.target.result;
fileName.textContent = '✅ ' + file.name;
fileName.style.color = '#4caf50';
};
reader.readAsDataURL(file);
}
});
},
setupNavigation: function() {
const nextBtns = this.modal.querySelectorAll('.next-btn');
const prevBtns = this.modal.querySelectorAll('.prev-btn');
nextBtns.forEach(btn => {
btn.addEventListener('click', () => {
if (this.currentStep < this.totalSteps) {
this.showStep(this.currentStep + 1);
}
});
});
prevBtns.forEach(btn => {
btn.addEventListener('click', () => {
if (this.currentStep > 1) {
this.showStep(this.currentStep - 1);
}
});
});
},
setupCreateBook: function() {
document.getElementById('createBookBtn').addEventListener('click', () => {
this.createBook();
});
},
createBook: function() {
const name = document.getElementById('bookNameInput').value.trim() || 'Моя книга';
const hasCover = document.querySelector('.setting-checkbox input[type="checkbox"]:checked');
const hasToc = document.querySelectorAll('.setting-checkbox input[type="checkbox"]')[1]?.checked;
const hasThanks = document.querySelectorAll('.setting-checkbox input[type="checkbox"]')[2]?.checked;
const hasTitle = document.querySelectorAll('.setting-checkbox input[type="checkbox"]')[3]?.checked;
// Создаём книгу
const bookId = Date.now();
const pages = [];
let pageNum = 1;
// Обложка
if (hasCover) {
pages.push({
id: Date.now() + 1,
type: this.selectedType === 'family' ? 'template-cover' :
this.selectedType === 'portrait' ? 'template-hero' :
this.selectedType === 'travel' ? 'template-cover' :
'template-cover',
photo: this.coverFile || null,
customNumber: pageNum++
});
}
// Титул
if (hasTitle) {
pages.push({
id: Date.now() + 2,
type: 'template-history',
nameText: name,
customNumber: pageNum++
});
}
// Основные страницы
const mainPageTypes = {
'family': 'photo-text-storyteller',
'portrait': 'template-hero',
'travel': 'photo-only-1',
'album': 'photo-only-2',
'text': 'special-thanks',
'story': 'template-history',
'custom': 'empty'
};
const mainType = mainPageTypes[this.selectedType] || 'photo-text-storyteller';
for (let i = 0; i < this.pagesCount; i++) {
pages.push({
id: Date.now() + 3 + i,
type: mainType,
customNumber: pageNum++
});
}
// Оглавление
if (hasToc) {
pages.push({
id: Date.now() + 100,
type: 'special-toc-columns',
customNumber: pageNum++
});
}
// Благодарность
if (hasThanks) {
pages.push({
id: Date.now() + 101,
type: 'special-thanks',
customNumber: pageNum++
});
}
// Сохраняем
window.pages = pages;
window.currentPage = 0;
localStorage.setItem('book_pages', JSON.stringify(pages));
localStorage.setItem('project_name', name);
localStorage.setItem('selected_template', this.selectedStyle);
if (window.pushToHistory) window.pushToHistory();
if (window.updateEditor) window.updateEditor();
if (window.renderThumbnails) window.renderThumbnails();
this.close();
// Закрываем приветствие
const welcome = document.getElementById('welcomeOverlay');
if (welcome) welcome.classList.add('hidden');
// Показываем панели
document.getElementById('constructorHeader')?.classList.add('visible');
document.getElementById('thumbnailsPanel')?.classList.add('visible');
document.getElementById('templatesPanel')?.classList.add('visible');
document.getElementById('editorWrapper')?.classList.add('visible');
// Обновляем название
const logo = document.getElementById('logoText');
if (logo) logo.textContent = name;
// Показываем уведомление
this.showNotification('✅ Книга "' + name + '" создана!');
},
showNotification: function(text) {
const notif = document.createElement('div');
notif.style.cssText = `
position: fixed;
bottom: 30px;
left: 50%;
transform: translateX(-50%);
background: rgba(0,0,0,0.85);
backdrop-filter: blur(20px);
border: 1px solid #ff9800;
border-radius: 16px;
padding: 16px 32px;
color: #ffffff;
font-size: 16px;
z-index: 999999;
animation: slideUp 0.5s ease;
box-shadow: 0 10px 40px rgba(0,0,0,0.5);
`;
notif.textContent = text;
document.body.appendChild(notif);
setTimeout(() => {
notif.style.animation = 'slideDown 0.5s ease forwards';
setTimeout(() => notif.remove(), 500);
}, 3000);
}
};
// Стили для уведомления
const notificationStyles = document.createElement('style');
notificationStyles.textContent = `
@keyframes slideUp {
0% { opacity: 0; transform: translateX(-50%) translateY(30px); }
100% { opacity: 1; transform: translateX(-50%) translateY(0); }
}
@keyframes slideDown {
0% { opacity: 1; transform: translateX(-50%) translateY(0); }
100% { opacity: 0; transform: translateX(-50%) translateY(30px); }
}
`;
document.head.appendChild(notificationStyles);
// Инициализация
document.addEventListener('DOMContentLoaded', () => BookWizard.init());
