From 9fae0f84fdd7341a0f6f2a8cc4e75c5bfd13d9c0 Mon Sep 17 00:00:00 2001 From: nestict <icttechnest@gmail.com> Date: Wed, 14 May 2025 14:37:41 +0200 Subject: [PATCH] Upload files to "/" --- login.html | 643 +++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 643 insertions(+) create mode 100644 login.html diff --git a/login.html b/login.html new file mode 100644 index 00000000..9fbe2577 --- /dev/null +++ b/login.html @@ -0,0 +1,643 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <meta name="viewport" content="width=device-width, initial-scale=1.0"> + <title>yatmack</title> + <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> + <script src="https://cdnjs.cloudflare.com/ajax/libs/core-js/3.8.3/core.min.js"></script> + <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script> + <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> + <link href='https://fonts.googleapis.com/css2?family=Lexend:wght@300;400;500;600;700&display=swap' rel='stylesheet'> + <script src="https://cdn.tailwindcss.com"></script> +<script> +tailwind.config = { + theme: { + extend: { + colors: { + navy: { + DEFAULT: '#023047', + 50: '#e6f0f5', + 100: '#cce1eb', + 200: '#99c3d7', + 300: '#66a5c3', + 400: '#3387af', + 500: '#023047', + 600: '#022640', + 700: '#011d39', + 800: '#011332', + 900: '#010a2b' + }, + orange: { + DEFAULT: '#fb8500', + 50: '#fff4e6', + 100: '#ffe9cc', + 200: '#ffd399', + 300: '#ffbd66', + 400: '#ffa733', + 500: '#fb8500', + 600: '#cc6d00', + 700: '#995200', + 800: '#663600', + 900: '#331b00' + } + }, + fontFamily: { + 'lexend': ['Lexend', 'sans-serif'], + }, + animation: { + 'spin-fast': 'spin 0.5s linear infinite', + 'fade-in': 'fadeIn 0.3s ease-in-out', + 'slide-up': 'slideUp 0.3s ease-out' + }, + keyframes: { + fadeIn: { + '0%': { opacity: '0' }, + '100%': { opacity: '1' } + }, + slideUp: { + '0%': { transform: 'translateY(10px)', opacity: '0' }, + '100%': { transform: 'translateY(0)', opacity: '1' } + } + } + } + } +} +</script> +</head> +<body class="font-lexend min-h-screen bg-gradient-to-b from-navy to-navy/95 text-gray-100"> +<div class="container mx-auto px-2 py-4 max-w-3xl"> + <div class="bg-white/10 backdrop-blur-lg rounded-2xl shadow-xl mb-6 overflow-hidden border border-white/10"> + <div class="p-3 relative"> + <h1 class="text-2xl font-bold text-center text-orange mb-3">YATMACK HOTSPOT</h1> + <p class="text-gray-100/90 text-center text-sm mb-4"> + Select package ? Enter M-Pesa number ? Complete payment + </p> + <div class="flex items-center justify-center gap-2 py-2 px-4 bg-white/5 rounded-xl"> + <i class="fas fa-headset text-orange"></i> + <p class="text-sm font-medium">Support: 254705042522</p> + </div> + </div> + </div> + <div class="py-2 sm:py-1 lg:py-1"> + <div class="mx-auto max-w-screen-2xl px-1 md:px-1"> + <div class="mx-auto max-w-lg grid grid-cols-2 sm:grid-cols-2 md:grid-cols-3 gap-4 p-1" id="cards-container"> + </div> + </div> + </div> + <button onclick="redeemVoucher()" class="w-full bg-orange hover:bg-orange/90 text-white font-medium py-4 px-6 rounded-xl shadow-lg transition duration-200 flex items-center justify-center gap-3 mb-6"> + <i class="fas fa-ticket-alt"></i> + <span>Redeem Voucher</span> + </button> + <div class="bg-white/10 backdrop-blur-lg rounded-2xl shadow-xl overflow-hidden border border-white/10 mb-6"> + <div class="p-6 space-y-8"> + <!-- Reconnect with M-Pesa --> + <div class="space-y-4"> + <h3 class="text-lg font-semibold text-orange">Reconnect with M-Pesa</h3> + <div class="flex flex-col sm:flex-row gap-3"> + <input id="mpesaCodeInput" type="text" placeholder="Enter M-Pesa code (e.g., SCK15SKB4Z)" class="flex-grow px-4 py-3 bg-white/5 border border-white/10 rounded-xl focus:outline-none focus:ring-2 focus:ring-orange/50 text-white placeholder:text-gray-400"> + <button id="reconnectBtn" class="bg-orange hover:bg-orange/90 text-white font-medium py-3 px-6 rounded-xl transition duration-200">Reconnect</button> + </div> + </div> + <div class="space-y-4"> + <h3 class="text-lg font-semibold text-orange">Active Package Login</h3> + <form id="loginForm" action="$(link-login-only)" method="post" $(if chap-id)onSubmit="return doLogin()" $(endif)> + <input type="hidden" name="dst" value="$(link-orig)"> + <input type="hidden" name="popup" value="true"> + <input type="hidden" name="mac" id="mac" value="$(mac)"> + <div class="flex flex-col sm:flex-row gap-3"> + <input id="usernameInput" name="username" type="text" placeholder="Enter Username (e.g., ACC123456)" class="flex-grow px-4 py-3 bg-white/5 border border-white/10 rounded-xl focus:outline-none focus:ring-2 focus:ring-orange/50 text-white placeholder:text-gray-400"> + <button id="submitBtn" type="button" onclick="submitLogin()" class="bg-orange hover:bg-orange/90 text-white font-medium py-3 px-6 rounded-xl transition duration-200">Connect</button> + </div> + <input type="hidden" name="password" value="1234"> + </form> + </div> + </div> + </div> + <div class="text-center"> + <p class="text-sm text-gray-400">© 2025 yatmack. Created by Smartisp</p> + </div> +</div> +<script> +function fetchData() { + var domain = 'https://yatmack2.smartisp.co.ke/'; + var siteUrl = domain + "/index.php?_route=plugin/hotspot_plan"; + var routerName = encodeURIComponent("yatmack"); + var dataparams = `routername=${routerName}`; + fetch(siteUrl, { + method: 'POST', + headers: { + 'Content-Type': 'application/x-www-form-urlencoded' + }, + body: dataparams + }) + .then(response => { + if (!response.ok) { + throw new Error(`Error ${response.status}: ${response.statusText}`); + } + return response.json(); + }) + .then(data => { + populateCards(data); + }) + .catch(error => { + console.error('Fetch error:', error); + }); +} +function populateCards(data) { + var cardsContainer = document.getElementById('cards-container'); + cardsContainer.innerHTML = ''; // Clear existing content + // Sort the plans by price in ascending order + data.data.forEach(router => { + // Sort hotspot plans by price + router.plans_hotspot.sort((a, b) => parseFloat(a.price) - parseFloat(b.price)); + router.plans_hotspot.forEach(item => { + var cardDiv = document.createElement('div'); + cardDiv.className = 'bg-white border border-black rounded-lg shadow-md overflow-hidden transition duration-300 hover:shadow-lg flex flex-col items-center justify-between mx-auto mb-4 w-40'; + cardDiv.innerHTML = ` + <div class="bg-blue-500 text-white w-full py-1"> + <h2 class="text-sm font-medium uppercase text-center" style="font-size: clamp(0.75rem, 1.5vw, 1rem); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;"> + ${item.planname} + </h2> + </div> + <div class="px-4 py-2 flex-grow"> + <p class="text-2xl font-bold text-blue-600 mb-1"> + <span class="text-lg font-medium text-black">${item.currency}</span> + ${item.price} + </p> + <p class="text-sm text-black mb-2"> + Valid for ${item.validity} ${item.timelimit} + </p> + <hr class="border-black mb-2"> + </div> + <div class="px-4 py-2 flex-shrink-0"> + <a href="#" class="inline-block bg-gray-900 text-white hover:bg-blue-600 font-semibold py-1 px-4 rounded-lg transition duration-300 text-md" + onclick="handlePhoneNumberSubmission('${item.planId}', '${item.routerId}'); return false;" + data-plan-id="${item.planId}" + data-router-id="${item.routerId}"> + Buy + </a> + </div> + `; + cardsContainer.appendChild(cardDiv); + }); + }); +} +fetchData(); +function getMacAddress() { + return "$(mac)"; // MikroTik replaces this with the user's MAC address +} + +function getOrCreateAccountId() { + var radiaxid = localStorage.getItem('radiaxid'); + if (!radiaxid) { + radiaxid = getMacAddress(); + localStorage.setItem('radiaxid', radiaxid); + setCookie('radiaxid', radiaxid, 365); + } + return radiaxid; +} + +function getAccountId() { + return localStorage.getItem('radiaxid') || getCookie('radiaxid') || getMacAddress(); +} + +function formatPhoneNumber(phoneNumber) { + if (phoneNumber.startsWith('+')) { + phoneNumber = phoneNumber.substring(1); + } + if (phoneNumber.startsWith('0')) { + phoneNumber = '254' + phoneNumber.substring(1); + } + if (phoneNumber.match(/^(7|1)/)) { + phoneNumber = '254' + phoneNumber; + } + return phoneNumber; +} + +function setCookie(name, value, days) { + var expires = ""; + if (days) { + var date = new Date(); + date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000)); + expires = "; expires=" + date.toUTCString(); + } + document.cookie = name + "=" + (value || "") + expires + "; path=/"; +} + +function getCookie(name) { + var nameEQ = name + "="; + var ca = document.cookie.split(';'); + for (var i = 0; i < ca.length; i++) { + var c = ca[i]; + while (c.charAt(0) == ' ') c = c.substring(1, c.length); + if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length, c.length); + } + return null; +} + +var loginTimeout; +function handlePhoneNumberSubmission(planId, routerId, price) { + var accountId = getOrCreateAccountId(); + var modalHtml = ` + <div id="paymentModal" class='fixed inset-0 bg-black/30 backdrop-blur-sm z-50 animate-fade-in'> + <div class="fixed left-1/2 top-1/2 transform -translate-x-1/2 -translate-y-1/2 w-full max-w-md"> + <div class="bg-white text-black rounded-lg shadow-xl"> + <div class="flex items-center justify-between p-4 border-b border-gray-300"> + <h5 class="text-xl font-semibold"> + Enter Your Mpesa Number + </h5> + <button class="text-gray-500 hover:text-black" onclick="closeModal('paymentModal')"> + <svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24"> + <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" /> + </svg> + </button> + </div> + <div class="p-4"> +<div class="bg-navy-50 border-l-4 border-navy-400 p-4 rounded-md mb-4"> <div class="flex"> <div class="flex-shrink-0"> <svg class="h-5 w-5 text-navy-400" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 16h-1v-4h-1m1 4v.01m6.938-2.162A9 9 0 1111 3v0a9 9 0 018.938 10.838z" /> </svg> </div> <div class="ml-3"> <p class="text-sm text-navy-700"> You are about to initiate M-pesa payment. Enter phone number below and click Pay Now to initialize payment. </p> </div> </div></div> <input type="text" class="w-full px-4 py-3 border border-orange-300 rounded-lg focus:ring-2 focus:ring-navy-400 focus:border-blue-500 text-black" id="phoneNumberInput" required placeholder="e.g. 0712345678"> + <div class="text-red-500 mt-1 hidden" id="invalidPhone">Please enter a valid phone number!</div> + </div> + <div class="flex justify-end space-x-2 p-4 border-t border-gray-300"> + <button onclick="closeModal('paymentModal')" class="px-4 py-2 bg-orange text-black rounded-lg hover:bg-gray-300">Close</button> + <button id="payNowBtn" class="px-4 py-2 bg-navy text-white font-semibold hover:from-blue-600 hover:to-blue-500 flex items-center rounded-lg"> + <svg class="w-5 h-5 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24"> + <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 9V7a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2m2 4h10a2 2 0 002-2v-6a2 2 0 00-2-2H9a2 2 0 00-2 2v6a2 2 0 002 2zm7-5a2 2 0 11-4 0 2 2 0 014 0z" /> + </svg> + Pay Now + </button> + </div> + </div> + </div> + </div> + `; + document.body.insertAdjacentHTML('beforeend', modalHtml); + var modal = document.getElementById('paymentModal'); + modal.classList.remove('hidden'); + var payNowBtn = document.getElementById('payNowBtn'); + var phoneInput = document.getElementById('phoneNumberInput'); + phoneInput.focus(); + payNowBtn.addEventListener('click', function() { handlePayment(); }); + function handlePayment() { + if (!phoneInput.value) { + document.getElementById('invalidPhone').classList.remove('hidden'); + return; + } + payNowBtn.disabled = true; + payNowBtn.innerHTML = ` + <svg class='animate-spin -ml-1 mr-3 h-5 w-5 text-white' xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24'> + <circle class='opacity-25' cx='12' cy='12' r='10' stroke='currentColor' stroke-width='4'></circle> + <path class='opacity-75' fill='currentColor' d='M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z'></path> + </svg> + Processing... + `; + var formattedPhoneNumber = formatPhoneNumber(phoneInput.value); + document.getElementById('usernameInput').value = accountId; + + fetch('https://yatmack2.smartisp.co.ke/index.php?_route=plugin/CreateHotspotuser&type=grant', { + method: 'POST', + headers: {'Content-Type': 'application/json'}, + body: JSON.stringify({ + phone_number: formattedPhoneNumber, + plan_id: planId, + router_id: routerId, + account_id: accountId + }) + }) + .then(response => response.json()) + .then(data => { + if (data.status === 'error') throw new Error(data.message); + closeModal('paymentModal'); + showProcessingModal(); + checkPaymentStatus(formattedPhoneNumber); + }) + .catch(error => { + closeModal('paymentModal'); + showErrorModal(error.message); + }); + } +} + +function showProcessingModal() { + var processingModalHtml = ` + <div id='processingModal' class='fixed inset-0 bg-black/30 backdrop-blur-sm z-50 animate-fade-in'> + <div class='fixed left-1/2 top-1/2 transform -translate-x-1/2 -translate-y-1/2 w-full max-w-md animate-slide-up'> + <div class='bg-gradient-to-br from-white to-gray-50 shadow-2xl rounded-2xl p-8 text-center border border-gray-100'> + <div class='flex justify-center'> + <svg class='animate-spin h-20 w-20 text-navy-500' xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24'> + <circle class='opacity-25' cx='12' cy='12' r='10' stroke='currentColor' stroke-width='4'></circle> + <path class='opacity-75' fill='currentColor' d='M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z'></path> + </svg> + </div> + <div class="mt-6 bg-navy-50/50 backdrop-blur-xs border border-navy-200 rounded-xl p-6 shadow-lg"> <div class="flex items-center space-x-4"> <svg class="h-8 w-8 text-navy-400 flex-shrink-0" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 16h-1v-4h-1m1 4v.01m6.938-2.162A9 9 0 1111 3v0a9 9 0 018.938 10.838z" /> </svg> <div class="flex-1"> <h2 class="text-xl font-semibold text-navy-600 font-lexend">Initializing Payment</h2> <p class="text-navy-500 mt-2">A payment request has been sent to your phone. Please wait while we process your payment.</p> </div> </div> <div class="mt-4 h-2 w-full bg-navy-100 rounded-full overflow-hidden"> <div class="h-2 bg-navy-400 rounded-full animate-pulse"></div> </div> </div> </div> + </div> + </div> + `; + document.body.insertAdjacentHTML('beforeend', processingModalHtml); +} +function closeModal(modalId) { + var modal = document.getElementById(modalId); + if (modal) { + modal.classList.add('hidden'); + setTimeout(function() { modal.remove(); }, 300); + } +} + +function showSuccessModal() { + var successModalHtml = ` + <div id='successModal' class='fixed inset-0 bg-black/60 backdrop-blur-sm z-50 transition-all duration-300'> + <div class='fixed left-1/2 top-1/2 transform -translate-x-1/2 -translate-y-1/2 w-full max-w-lg transition-all duration-300 ease-out'> + <div class='bg-white/95 backdrop-blur-md shadow-2xl rounded-3xl p-8 text-center border border-gray-200/50 ring-1 ring-gray-900/5'> + <div class='flex justify-center mb-6'> + <div class='relative'> + <div class='absolute inset-0 rounded-full bg-green-500/20 animate-pulse'></div> + <svg class='h-16 w-16 text-green-500' xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='currentColor'> + <path stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z'/> + </svg> + </div> + </div> + <div class='space-y-4'> + <h2 class='text-2xl font-semibold text-gray-900'>Payment Successful</h2> + <div class='bg-green-50 rounded-2xl p-6 border border-green-100'> + <div class='flex items-center gap-4'> + <svg class='h-6 w-6 text-green-500 flex-shrink-0' xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='currentColor'> + <path stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M9 12l2 2 4-4'/> + </svg> + <p class='text-sm text-green-700'>Your transaction has been completed successfully. You will be redirected shortly.</p> + </div> + </div> + </div> + </div> + </div> + </div> + `; + document.body.insertAdjacentHTML('beforeend', successModalHtml); + setTimeout(function() { closeModal('successModal'); }, 2000); +} + +function showErrorModal(errorMsg) { + var errorModalHtml = ` + <div id='errorModal' class='fixed inset-0 bg-black/60 backdrop-blur-sm z-50 transition-all duration-300'> + <div class='fixed left-1/2 top-1/2 transform -translate-x-1/2 -translate-y-1/2 w-full max-w-lg transition-all duration-300 ease-out'> + <div class='bg-white/95 backdrop-blur-md shadow-2xl rounded-3xl p-8 text-center border border-gray-200/50 ring-1 ring-gray-900/5'> + <div class='flex justify-center mb-6'> + <div class='relative'> + <div class='absolute inset-0 rounded-full bg-red-500/20 animate-pulse'></div> + <svg class='h-16 w-16 text-red-500' xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='currentColor'> + <path stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M6 18L18 6M6 6l12 12'/> + </svg> + </div> + </div> + <div class='space-y-4'> + <h2 class='text-2xl font-semibold text-gray-900'>Payment Failed</h2> + <div class='bg-red-50 rounded-2xl p-6 border border-red-100'> + <div class='flex items-center gap-4'> + <svg class='h-6 w-6 text-red-500 flex-shrink-0' xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='currentColor'> + <path stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M12 8v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z'/> + </svg> + <p class='text-sm text-red-700'>An error occurred while processing your payment. Please try again.</p> + </div> + </div> + </div> + </div> + </div> + </div> + `; + document.body.insertAdjacentHTML('beforeend', errorModalHtml); + setTimeout(function() { closeModal('errorModal'); }, 2000); +} + +function checkPaymentStatus(phoneNumber) { + var accountId = getOrCreateAccountId(); + var checkInterval = setInterval(function() { + fetch('https://yatmack2.smartisp.co.ke/index.php?_route=plugin/CreateHotspotuser&type=verify', { + method: 'POST', + headers: {'Content-Type': 'application/json'}, + body: JSON.stringify({account_id: accountId}) + }) + .then(function(response) { return response.json(); }) + .then(function(data) { + console.log('Raw Response:', data); + if (data.Resultcode === '3') { + clearInterval(checkInterval); + closeModal('processingModal'); + showSuccessModal(); + if (loginTimeout) clearTimeout(loginTimeout); + loginTimeout = setTimeout(function() { document.getElementById('loginForm').submit(); }, 2000); + } else if (data.Resultcode === '2') { + clearInterval(checkInterval); + closeModal('processingModal'); + showErrorModal(data.Message); + } else { + console.error('Unexpected result code:', data.Resultcode); + } + }) + .catch(function(error) { + console.error('Error during fetch request:', error); + clearInterval(checkInterval); + closeModal('processingModal'); + showErrorModal('An error occurred while checking payment status.'); + }); + }, 1000); + + setTimeout(function() { + clearInterval(checkInterval); + closeModal('processingModal'); + showErrorModal('Timeout while waiting for payment confirmation.'); + }, 300000); // 5 minutes +} + +document.addEventListener('DOMContentLoaded', function() { + var accountId = getOrCreateAccountId(); + var usernameInput = document.getElementById('usernameInput'); + if (usernameInput && !usernameInput.value) { + usernameInput.value = accountId; + } + var submitBtn = document.getElementById('submitBtn'); + if (submitBtn) { + submitBtn.addEventListener('click', function() { + document.getElementById('loginForm').submit(); + }); + } +}); +var loginTimeout; // Variable to store the timeout ID +function redeemVoucher() { + Swal.fire({ + title: 'Redeem Voucher', + input: 'text', + inputPlaceholder: 'Enter voucher code', + inputValidator: function(value) { + if (!value) { + return 'You need to enter a voucher code!'; + } + }, + confirmButtonColor: '#3085d6', + cancelButtonColor: '#d33', + confirmButtonText: 'Redeem', + showLoaderOnConfirm: true, + preConfirm: (voucherCode) => { + var accountId = voucherCode; + return fetch('https://yatmack2.smartisp.co.ke/index.php?_route=plugin/CreateHotspotuser&type=voucher', { + method: 'POST', + headers: {'Content-Type': 'application/json'}, + body: JSON.stringify({voucher_code: voucherCode, account_id: accountId}), + }) + .then(response => { + if (!response.ok) throw new Error('Network response was not ok'); + return response.json(); + }) + .then(data => { + if (data.status === 'error') throw new Error(data.message); + return data; + }); + }, + allowOutsideClick: () => !Swal.isLoading() + }).then((result) => { + if (result.isConfirmed) { + Swal.fire({ + icon: 'success', + title: 'Voucher Redeemed', + text: result.value.message, + showConfirmButton: false, + allowOutsideClick: false, + didOpen: () => { + Swal.showLoading(); + var username = result.value.username; + console.log('Received username from server:', username); + var usernameInput = document.querySelector('input[name="username"]'); + if (usernameInput) { + console.log('Found username input element.'); + usernameInput.value = username; + loginTimeout = setTimeout(function() { + var loginForm = document.getElementById('loginForm'); + if (loginForm) { + loginForm.submit(); + } else { + console.error('Login form not found.'); + Swal.fire({ + icon: 'error', + title: 'Error', + text: 'Login form not found. Please try again.', + }); + } + }, 2000); + } else { + console.error('Username input element not found.'); + Swal.fire({ + icon: 'error', + title: 'Error', + text: 'Username input not found. Please try again.', + }); + } + } + }); + } + }).catch(error => { + Swal.fire({ + icon: 'error', + title: 'Oops...', + text: error.message, + }); + }); +} +document.addEventListener('DOMContentLoaded', function() { + var reconnectBtn = document.getElementById('reconnectBtn'); + var mpesaCodeInput = document.getElementById('mpesaCodeInput'); + var macInput = document.getElementById('mac'); + var loginForm = document.getElementById('loginForm'); + if (reconnectBtn) { + reconnectBtn.addEventListener('click', function() { + // Validate inputs before processing + if (!mpesaCodeInput || !macInput || !loginForm) { + Swal.fire({ + icon: 'error', + title: 'Error', + text: 'Required form elements are missing' + }); + return; + } + var mpesaCode = mpesaCodeInput.value.trim().split(' ')[0]; + var mac = macInput.value.trim(); + fetch('https://yatmack2.smartisp.co.ke/index.php?_route=plugin/ReconnectUser', { + method: 'POST', + headers: {'Content-Type': 'application/json'}, + body: JSON.stringify({ mpesa_code: mpesaCode, mac: mac }), + }) + .then(response => { + if (!response.ok) { + throw new Error('Network response was not ok'); + } + return response.json(); + }) + .then(data => { + console.log('Response data:', data); + var resultCode = data.Resultcode; + var message = data.Message; + var status = data.Status; + var username = data.username; + if (resultCode === '1') { + Swal.fire({ + icon: 'error', + title: 'Invalid Code', + text: message + }); + } + else if (resultCode === '3') { + Swal.fire({ + icon: 'error', + title: 'Expired Package', + text: message + }); + } + else if (resultCode === '2') { + Swal.fire({ + icon: 'success', + title: status, + text: message, + showConfirmButton: false, + allowOutsideClick: false, + didOpen: () => { + Swal.showLoading(); + console.log('Received username from server:', username); + var usernameInput = document.querySelector('input[name="username"]'); + if (usernameInput) { + console.log('Found username input element.'); + usernameInput.value = username; + setTimeout(function() { + var loginForm = document.getElementById('loginForm'); + if (loginForm) { + loginForm.submit(); + } else { + console.error('Login form not found.'); + Swal.fire({ + icon: 'error', + title: 'Error', + text: 'Login form not found. Please try again.', + }); + } + }, 2000); + } else { + console.error('Username input element not found.'); + Swal.fire({ + icon: 'error', + title: 'Error', + text: 'Username input not found. Please try again.', + }); + } + } + }); + } + }) + .catch(error => { + Swal.fire({ + icon: 'error', + title: 'Oops...', + text: error.message + }); + }); + }); + } else { + console.error('Reconnect button not found'); + } +}); +</script> +</html>