Split project into 3 files: index.html, css/styles.css, js/main.js
This commit is contained in:
+196
@@ -0,0 +1,196 @@
|
||||
document.addEventListener('DOMContentLoaded', () => {
|
||||
checkSession();
|
||||
});
|
||||
|
||||
function getCookie(name) {
|
||||
const value = `; ${document.cookie}`;
|
||||
const parts = value.split(`; ${name}=`);
|
||||
if (parts.length === 2) return parts.pop().split(';').shift();
|
||||
return '';
|
||||
}
|
||||
|
||||
function setCookie(name, value, days) {
|
||||
const expires = new Date();
|
||||
expires.setTime(expires.getTime() + days * 24 * 60 * 60 * 1000);
|
||||
document.cookie = name + '=' + encodeURIComponent(value) + ';expires=' + expires.toUTCString() + ';path=/';
|
||||
}
|
||||
|
||||
const API_URL = 'https://n8n.odoo4projects.com/webhook/paraguay/login';
|
||||
const NEWSLETTER_URL = 'https://n8n.odoo4projects.com/webhook/paraguay/newsletter';
|
||||
|
||||
function checkSession() {
|
||||
const sessionid = getCookie('sessionid');
|
||||
console.log('checkSession: sessionid =', sessionid);
|
||||
const intro = document.getElementById('intro-section');
|
||||
const news = document.getElementById('news-col');
|
||||
const login = document.getElementById('login-panel');
|
||||
const newsletter = document.getElementById('newsletter-panel');
|
||||
const notebook = document.getElementById('notebook-panel');
|
||||
console.log('checkSession elements:', { intro, news, login, newsletter, notebook });
|
||||
if (sessionid) {
|
||||
if (intro) intro.classList.add('hidden');
|
||||
if (news) news.classList.add('hidden');
|
||||
if (login) login.classList.add('hidden');
|
||||
if (newsletter) newsletter.classList.add('hidden');
|
||||
if (notebook) notebook.classList.remove('hidden');
|
||||
} else {
|
||||
if (notebook) notebook.classList.add('hidden');
|
||||
if (login) login.classList.remove('hidden');
|
||||
if (newsletter) newsletter.classList.remove('hidden');
|
||||
}
|
||||
}
|
||||
|
||||
document.querySelectorAll('.lang-btn').forEach(btn => {
|
||||
btn.addEventListener('click', () => {
|
||||
const lang = btn.dataset.lang;
|
||||
document.body.dataset.lang = lang;
|
||||
document.querySelectorAll('.lang-btn').forEach(b => b.classList.remove('active'));
|
||||
btn.classList.add('active');
|
||||
});
|
||||
});
|
||||
|
||||
document.querySelectorAll('.notebook .tab').forEach(tab => {
|
||||
tab.addEventListener('click', () => {
|
||||
document.querySelectorAll('.notebook .tab').forEach(t => t.classList.remove('active'));
|
||||
tab.classList.add('active');
|
||||
const tabName = tab.dataset.tab;
|
||||
document.querySelectorAll('.notebook .tab-content').forEach(c => c.classList.add('hidden'));
|
||||
document.getElementById('tab-' + tabName).classList.remove('hidden');
|
||||
});
|
||||
});
|
||||
|
||||
async function sendTelegramUser() {
|
||||
const user = document.getElementById('telegram-user').value.trim();
|
||||
if (!user) { alert('Bitte geben Sie einen Telegram-Nutzernamen ein.'); return; }
|
||||
const btn = document.querySelector('#login-step-1 .btn-primary');
|
||||
btn.disabled = true; btn.textContent = 'Verifizierung läuft...';
|
||||
try {
|
||||
const response = await fetch(API_URL, {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({ username: user })
|
||||
});
|
||||
console.log('sendTelegramUser response:', response.status, await response.clone().json());
|
||||
if (response.ok) {
|
||||
const data = await response.json();
|
||||
console.log('sendTelegramUser data:', data);
|
||||
if (data.sessionid) {
|
||||
setCookie('sessionid', data.sessionid, 1);
|
||||
}
|
||||
document.getElementById('login-step-1').classList.add('hidden');
|
||||
document.getElementById('login-step-2').classList.remove('hidden');
|
||||
alert('Code wurde an Ihren Telegram-Account gesendet.');
|
||||
} else {
|
||||
alert('Fehler bei der Verifizierung. Bitte versuchen Sie es erneut.');
|
||||
btn.disabled = false; btn.textContent = document.body.dataset.lang === 'de' ? 'Anmelden' : 'Login';
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('sendTelegramUser error:', error);
|
||||
alert('Fehler bei der Verbindung. Bitte versuchen Sie es erneut.');
|
||||
btn.disabled = false; btn.textContent = document.body.dataset.lang === 'de' ? 'Anmelden' : 'Login';
|
||||
}
|
||||
}
|
||||
|
||||
async function verifyCode() {
|
||||
const code = document.getElementById('verification-code').value.trim();
|
||||
if (!code) { alert('Bitte geben Sie den Verifizierungscode ein.'); return; }
|
||||
const btns = document.querySelectorAll('#login-step-2 .btn-primary');
|
||||
btns.forEach(b => b.disabled = true);
|
||||
try {
|
||||
const response = await fetch(API_URL, {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({
|
||||
username: document.getElementById('telegram-user').value,
|
||||
code: code,
|
||||
sessionid: getCookie('sessionid')
|
||||
})
|
||||
});
|
||||
console.log('verifyCode response:', response.status, await response.clone().json());
|
||||
if (response.ok) {
|
||||
const data = await response.json();
|
||||
console.log('verifyCode data:', data);
|
||||
if (data.sessionid) {
|
||||
setCookie('sessionid', data.sessionid, 1);
|
||||
document.getElementById('intro-section').classList.add('hidden');
|
||||
document.getElementById('news-col').classList.add('hidden');
|
||||
document.getElementById('login-panel').classList.add('hidden');
|
||||
document.getElementById('notebook-panel').classList.remove('hidden');
|
||||
}
|
||||
} else {
|
||||
alert('Ungültiger Code. Bitte versuchen Sie es erneut.');
|
||||
btns.forEach(b => b.disabled = false);
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('verifyCode error:', error);
|
||||
alert('Fehler bei der Verbindung. Bitte versuchen Sie es erneut.');
|
||||
btns.forEach(b => b.disabled = false);
|
||||
}
|
||||
}
|
||||
|
||||
async function submitLoginData() {
|
||||
const name = document.getElementById('full-name').value.trim();
|
||||
const llc = document.getElementById('llc-name').value.trim();
|
||||
if (!name || !llc) { alert('Bitte geben Sie Name und LLC-Namen ein.'); return; }
|
||||
const btns = document.querySelectorAll('#login-step-3 .btn-primary');
|
||||
btns.forEach(b => b.disabled = true);
|
||||
try {
|
||||
const response = await fetch(API_URL, {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({
|
||||
username: document.getElementById('telegram-user').value,
|
||||
name: name,
|
||||
llc: llc
|
||||
})
|
||||
});
|
||||
console.log('submitLoginData response:', response.status, await response.clone().json());
|
||||
if (response.ok) {
|
||||
const data = await response.json();
|
||||
console.log('submitLoginData data:', data);
|
||||
if (data.sessionid) {
|
||||
setCookie('sessionid', data.sessionid, 1);
|
||||
}
|
||||
document.getElementById('intro-section').classList.add('hidden');
|
||||
document.getElementById('news-col').classList.add('hidden');
|
||||
document.getElementById('login-panel').classList.add('hidden');
|
||||
document.getElementById('notebook-panel').classList.remove('hidden');
|
||||
alert('Erfolgreich angemeldet! Willkommen!');
|
||||
} else {
|
||||
alert('Fehler bei der Anmeldung.');
|
||||
btns.forEach(b => b.disabled = false);
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('submitLoginData error:', error);
|
||||
alert('Fehler bei der Verbindung.');
|
||||
btns.forEach(b => b.disabled = false);
|
||||
}
|
||||
}
|
||||
|
||||
async function subscribeNewsletter() {
|
||||
const email = document.getElementById('newsletter-email').value.trim();
|
||||
if (!email) { alert('Bitte geben Sie eine E-Mail-Adresse ein.'); return; }
|
||||
const btn = document.querySelector('#newsletter-form .btn-primary');
|
||||
btn.disabled = true; btn.textContent = document.body.dataset.lang === 'de' ? 'Absenden...' : 'Submitting...';
|
||||
try {
|
||||
const response = await fetch(NEWSLETTER_URL, {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({ email: email })
|
||||
});
|
||||
console.log('subscribeNewsletter response:', response.status, await response.clone().json());
|
||||
if (response.ok) {
|
||||
document.getElementById('newsletter-form').classList.add('hidden');
|
||||
document.getElementById('newsletter-success').classList.remove('hidden');
|
||||
} else {
|
||||
alert('Fehler bei der Anmeldung. Bitte versuchen Sie es erneut.');
|
||||
btn.disabled = false;
|
||||
btn.textContent = document.body.dataset.lang === 'de' ? 'Abonnieren' : 'Subscribe';
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('subscribeNewsletter error:', error);
|
||||
alert('Fehler bei der Verbindung. Bitte versuchen Sie es erneut.');
|
||||
btn.disabled = false;
|
||||
btn.textContent = document.body.dataset.lang === 'de' ? 'Abonnieren' : 'Subscribe';
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user