diff --git a/Modules/User/routes/client.php b/Modules/User/routes/client.php index 9949da6..a5242fd 100644 --- a/Modules/User/routes/client.php +++ b/Modules/User/routes/client.php @@ -9,7 +9,8 @@ use Modules\CourseFinder\Http\Controllers\ProgramLevelController; Route::get('/', [WebsiteController::class, 'home']); Route::get('course-finder/{id}', [WebsiteController::class, 'coursefinderSingle'])->name('coursefinder.single'); -Route::get('/course-finder', [WebsiteController::class, 'coursefinder'])->name('program.coursefinder'); +Route::get('/course-finder/', [WebsiteController::class, 'coursefinder'])->name('program.coursefinder'); +Route::get('/cost-calculator', [WebsiteController::class, 'costCalculator'])->name('cost.calculator'); Route::get('/resources', [WebsiteController::class, 'resources'])->name('resources'); Route::get('blog/{alias}', [WebsiteController::class, 'blogSingle'])->name('blog.single'); Route::get('service/{alias}', [WebsiteController::class, 'serviceSingle'])->name('service.single'); diff --git a/app/Http/Controllers/WebsiteController.php b/app/Http/Controllers/WebsiteController.php index 142324a..2382e27 100644 --- a/app/Http/Controllers/WebsiteController.php +++ b/app/Http/Controllers/WebsiteController.php @@ -239,4 +239,17 @@ class WebsiteController extends Controller return view("client.raffles.pages.resources-template", $data); } + + public function costCalculator(Request $request) + { + $data['programs'] = $this->programService->findAll($request); + $data['countryOptions'] = Country::where('status', 1)->where('parent_id', null)->pluck('title', 'id'); + $data['programLevelOptions'] = ProgramLevel::where('status', 1)->pluck('title', 'id'); + $data['intakeOptions'] = Program::INTAKE; + $data['coopOptions'] = Coop::where('status', 1)->pluck('title', 'id'); + $data['testOptions'] = Test::where('status', 1)->where('parent_id', null)->pluck('title', 'id'); + $data['statusOptions'] = config('constants.page_status_options'); + + return view("client.raffles.pages.cost-calculator", $data); + } } diff --git a/public/raffles/assets/images/backgrounds_general/achievements-banner.png b/public/raffles/assets/images/backgrounds_general/achievements-banner.png new file mode 100644 index 0000000..212966f Binary files /dev/null and b/public/raffles/assets/images/backgrounds_general/achievements-banner.png differ diff --git a/public/raffles/assets/images/backgrounds_general/blog-banner.png b/public/raffles/assets/images/backgrounds_general/blog-banner.png new file mode 100644 index 0000000..4f25a98 Binary files /dev/null and b/public/raffles/assets/images/backgrounds_general/blog-banner.png differ diff --git a/public/raffles/assets/images/backgrounds_general/career-banner.png b/public/raffles/assets/images/backgrounds_general/career-banner.png new file mode 100644 index 0000000..5ef09ac Binary files /dev/null and b/public/raffles/assets/images/backgrounds_general/career-banner.png differ diff --git a/public/raffles/assets/images/backgrounds_general/contact-us-banner.png b/public/raffles/assets/images/backgrounds_general/contact-us-banner.png new file mode 100644 index 0000000..d3525f2 Binary files /dev/null and b/public/raffles/assets/images/backgrounds_general/contact-us-banner.png differ diff --git a/public/raffles/assets/images/backgrounds_general/cost-calc.png b/public/raffles/assets/images/backgrounds_general/cost-calc.png new file mode 100644 index 0000000..9dc4601 Binary files /dev/null and b/public/raffles/assets/images/backgrounds_general/cost-calc.png differ diff --git a/public/raffles/assets/images/backgrounds_general/course-finder-banner.png b/public/raffles/assets/images/backgrounds_general/course-finder-banner.png new file mode 100644 index 0000000..9373fca Binary files /dev/null and b/public/raffles/assets/images/backgrounds_general/course-finder-banner.png differ diff --git a/public/raffles/assets/images/backgrounds_general/events-banner.png b/public/raffles/assets/images/backgrounds_general/events-banner.png new file mode 100644 index 0000000..1e6c8f7 Binary files /dev/null and b/public/raffles/assets/images/backgrounds_general/events-banner.png differ diff --git a/public/raffles/assets/images/backgrounds_general/franchise-banner.png b/public/raffles/assets/images/backgrounds_general/franchise-banner.png new file mode 100644 index 0000000..d452f8e Binary files /dev/null and b/public/raffles/assets/images/backgrounds_general/franchise-banner.png differ diff --git a/public/raffles/assets/images/backgrounds_general/franchise-model.png b/public/raffles/assets/images/backgrounds_general/franchise-model.png new file mode 100644 index 0000000..b40ca69 Binary files /dev/null and b/public/raffles/assets/images/backgrounds_general/franchise-model.png differ diff --git a/public/raffles/assets/images/backgrounds_general/free-res-banner.png b/public/raffles/assets/images/backgrounds_general/free-res-banner.png new file mode 100644 index 0000000..2d94b1d Binary files /dev/null and b/public/raffles/assets/images/backgrounds_general/free-res-banner.png differ diff --git a/public/raffles/assets/images/backgrounds_general/gallery-banner.png b/public/raffles/assets/images/backgrounds_general/gallery-banner.png new file mode 100644 index 0000000..020773c Binary files /dev/null and b/public/raffles/assets/images/backgrounds_general/gallery-banner.png differ diff --git a/public/raffles/assets/images/backgrounds_general/our-partner-img.png b/public/raffles/assets/images/backgrounds_general/our-partner-img.png new file mode 100644 index 0000000..daa41c6 Binary files /dev/null and b/public/raffles/assets/images/backgrounds_general/our-partner-img.png differ diff --git a/public/raffles/assets/images/backgrounds_general/social-banner.png b/public/raffles/assets/images/backgrounds_general/social-banner.png new file mode 100644 index 0000000..4b7eb8f Binary files /dev/null and b/public/raffles/assets/images/backgrounds_general/social-banner.png differ diff --git a/public/raffles/assets/js/style.js b/public/raffles/assets/js/style.js index 0a04276..74a9426 100644 --- a/public/raffles/assets/js/style.js +++ b/public/raffles/assets/js/style.js @@ -2,438 +2,438 @@ document.addEventListener("DOMContentLoaded", function () { let intouchBtn = document.getElementById("get-in-touch"); - let intouchPopup = document.getElementById("get-in-touch-page"); - let closeBtns = document.getElementById("close-btn"); - + let intouchPopup = document.getElementById("get-in-touch-page"); + let closeBtns = document.getElementById("close-btn"); + // Show login popup intouchBtn.addEventListener("click", function () { intouchPopup.classList.add("active"); // alert("clicked ") - + }); - + // Hide both popups when clicking any close button closeBtns.addEventListener("click", function () { intouchPopup.classList.remove("active"); - + }); - - - + + + // Hide popups when clicking outside them window.addEventListener("click", function (event) { - if (event.target.classList.contains("get-in-touch-page")) { - intouchPopup.classList.remove("active"); - - } + if (event.target.classList.contains("get-in-touch-page")) { + intouchPopup.classList.remove("active"); + + } }); - }); +}); -// university image animation - window.addEventListener('DOMContentLoaded', () => { -const section = document.getElementById('animated-section'); -const leftItems = document.querySelectorAll('.left-group .line-item'); -const rightItems = document.querySelectorAll('.right-group .line-item'); +// university image animation +window.addEventListener('DOMContentLoaded', () => { + const section = document.getElementById('animated-section'); + const leftItems = document.querySelectorAll('.left-group .line-item'); + const rightItems = document.querySelectorAll('.right-group .line-item'); -const observer = new IntersectionObserver((entries) => { - entries.forEach(entry => { - if (entry.isIntersecting) { - leftItems.forEach((item, i) => { - setTimeout(() => item.classList.add('visible'), i * 300); - }); - rightItems.forEach((item, i) => { - setTimeout(() => item.classList.add('visible'), i * 300); - }); - } else { - leftItems.forEach(item => item.classList.remove('visible')); - rightItems.forEach(item => item.classList.remove('visible')); - } - }); -}, { threshold: 0.5 }); + const observer = new IntersectionObserver((entries) => { + entries.forEach(entry => { + if (entry.isIntersecting) { + leftItems.forEach((item, i) => { + setTimeout(() => item.classList.add('visible'), i * 300); + }); + rightItems.forEach((item, i) => { + setTimeout(() => item.classList.add('visible'), i * 300); + }); + } else { + leftItems.forEach(item => item.classList.remove('visible')); + rightItems.forEach(item => item.classList.remove('visible')); + } + }); + }, { threshold: 0.5 }); -observer.observe(section); + observer.observe(section); - }); +}); - // tabs in free resources - function showTab(id) { +// tabs in free resources +function showTab(id) { // Remove active class from all buttons document.querySelectorAll('.tab-btn').forEach(btn => btn.classList.remove('active')); - + // Hide all tab contents document.querySelectorAll('.tab-content').forEach(tab => tab.classList.remove('active')); - + // Show the selected tab document.getElementById(id).classList.add('active'); - } - - // NEW: Attach click event on all tab buttons - document.querySelectorAll('.tab-btn').forEach(button => { +} + +// NEW: Attach click event on all tab buttons +document.querySelectorAll('.tab-btn').forEach(button => { button.addEventListener('click', function () { - // Remove active from all - document.querySelectorAll('.tab-btn').forEach(btn => btn.classList.remove('active')); - - // Add active to clicked button - this.classList.add('active'); + // Remove active from all + document.querySelectorAll('.tab-btn').forEach(btn => btn.classList.remove('active')); + + // Add active to clicked button + this.classList.add('active'); }); - }); - +}); - - // counter section - - document.addEventListener("DOMContentLoaded", function () { + + +// counter section + +document.addEventListener("DOMContentLoaded", function () { const counters = document.querySelectorAll(".counter"); const observer = new IntersectionObserver(entries => { - entries.forEach(entry => { - const counter = entry.target; + entries.forEach(entry => { + const counter = entry.target; - if (entry.isIntersecting) { - if (!counter.classList.contains('started')) { - startCounting(counter); - counter.classList.add('started'); - } - } else { - resetCounter(counter); - counter.classList.remove('started'); - } - }); + if (entry.isIntersecting) { + if (!counter.classList.contains('started')) { + startCounting(counter); + counter.classList.add('started'); + } + } else { + resetCounter(counter); + counter.classList.remove('started'); + } + }); }); counters.forEach(counter => { - observer.observe(counter); + observer.observe(counter); }); function startCounting(counter) { - let start = 0; - const targetNumber = parseInt(counter.getAttribute("data-target")); - const duration = 2000; // 2 seconds - const increment = targetNumber / (duration / 16); + let start = 0; + const targetNumber = parseInt(counter.getAttribute("data-target")); + const duration = 2000; // 2 seconds + const increment = targetNumber / (duration / 16); - const timer = setInterval(() => { - start += increment; - if (start >= targetNumber) { - counter.textContent = targetNumber; - clearInterval(timer); - } else { - counter.textContent = Math.floor(start); - } - }, 16); + const timer = setInterval(() => { + start += increment; + if (start >= targetNumber) { + counter.textContent = targetNumber; + clearInterval(timer); + } else { + counter.textContent = Math.floor(start); + } + }, 16); } function resetCounter(counter) { - counter.textContent = 0; + counter.textContent = 0; } - }); - - - // course finder ball bouncing - window.addEventListener('DOMContentLoaded', () => { - const canvas = document.getElementById('flagCanvas'); - const ctx = canvas.getContext('2d'); - const ballSection = document.getElementById('ball-section'); - - // Get responsive ball size - function getBallSize() { - const width = window.innerWidth; - if (width < 480) return 20; - if (width < 768) return 30; - return 40; - } - - let ballSize = getBallSize(); - - // Responsive canvas sizing - function resizeCanvas() { - canvas.width = ballSection.clientWidth; - canvas.height = ballSection.clientHeight; - ballSize = getBallSize(); - } - resizeCanvas(); - window.addEventListener('resize', resizeCanvas); - - const gravity = 0.25; - const friction = 0.8; - const elasticity = 0.75; - const flags = ['us', 'gb', 'np', 'dk', 'ca', 'au']; - let balls = []; - - class Ball { - constructor(x, y, radius, imageSrc) { - this.x = x; - this.y = y; - this.radius = radius; - this.dx = (Math.random() - 0.5) * 2; - this.dy = 0; - this.image = new Image(); - this.image.src = imageSrc; - this.dragging = false; - this.offsetX = 0; - this.offsetY = 0; - this.elasticity = elasticity; - this.hasSettled = false; - } - - draw() { - ctx.save(); - ctx.beginPath(); - ctx.arc(this.x, this.y, this.radius, 0, Math.PI * 2); - ctx.closePath(); - ctx.clip(); - - const img = this.image; - const size = Math.min(img.width, img.height); - const sx = (img.width - size) / 2; - const sy = (img.height - size) / 2; - - ctx.drawImage( - img, sx, sy, size, size, - this.x - this.radius, this.y - this.radius, - this.radius * 2, this.radius * 2 - ); - - ctx.restore(); - } - - update(others) { - if (!this.dragging) { - this.dy += gravity; - this.x += this.dx; - this.y += this.dy; - - // Floor - if (this.y + this.radius > canvas.height) { - this.y = canvas.height - this.radius; - this.dy *= -this.elasticity; - this.dx *= friction; - if (Math.abs(this.dy) < 0.5) { - this.dy = 0; - this.hasSettled = true; - } - } - - // Walls - if (this.x - this.radius < 0) { - this.x = this.radius; - this.dx *= -friction; - } else if (this.x + this.radius > canvas.width) { - this.x = canvas.width - this.radius; - this.dx *= -friction; - } - } - - // Collisions - if (this.dragging || !this.hasSettled) { - for (let other of others) { - if (other !== this) { - this.resolveBallCollision(other); - } - } - } - - this.draw(); - } - - resolveBallCollision(other) { - const dx = other.x - this.x; - const dy = other.y - this.y; - const dist = Math.sqrt(dx * dx + dy * dy); - const minDist = this.radius + other.radius; - - if (dist < minDist) { - const nx = dx / dist; - const ny = dy / dist; - const overlap = minDist - dist; - - const impulse = 0.5; - this.x -= nx * overlap * impulse; - this.y -= ny * overlap * impulse; - other.x += nx * overlap * impulse; - other.y += ny * overlap * impulse; - - const tx = -ny; - const ty = nx; - - const dpTan1 = this.dx * tx + this.dy * ty; - const dpTan2 = other.dx * tx + other.dy * ty; - - const dpNorm1 = this.dx * nx + this.dy * ny; - const dpNorm2 = other.dx * nx + other.dy * ny; - - this.dx = tx * dpTan1 + nx * dpNorm2; - this.dy = ty * dpTan1 + ny * dpNorm2; - other.dx = tx * dpTan2 + nx * dpNorm1; - other.dy = ty * dpTan2 + ny * dpNorm1; - } - } - } - - function createBalls() { - balls = []; - for (let i = 0; i < 30; i++) { - const flag = flags[i % flags.length]; - const x = Math.random() * (canvas.width - ballSize * 2) + ballSize; - const y = -Math.random() * 300; - balls.push(new Ball(x, y, ballSize, `assets/images/logo/country/${flag}.png`)); - } - } - - createBalls(); - - let draggedBall = null; - let lastMouse = { x: 0, y: 0 }; - - canvas.addEventListener('pointerdown', (e) => { - const rect = canvas.getBoundingClientRect(); - const scaleX = canvas.width / rect.width; - const scaleY = canvas.height / rect.height; - const mouseX = (e.clientX - rect.left) * scaleX; - const mouseY = (e.clientY - rect.top) * scaleY; - - for (let ball of balls) { - const dx = mouseX - ball.x; - const dy = mouseY - ball.y; - if (Math.sqrt(dx * dx + dy * dy) < ball.radius) { - ball.dragging = true; - draggedBall = ball; - ball.offsetX = dx; - ball.offsetY = dy; - ball.hasSettled = false; - lastMouse = { x: mouseX, y: mouseY }; - break; - } - } - }); - - canvas.addEventListener('pointermove', (e) => { - if (draggedBall) { - const rect = canvas.getBoundingClientRect(); - const scaleX = canvas.width / rect.width; - const scaleY = canvas.height / rect.height; - const mouseX = (e.clientX - rect.left) * scaleX; - const mouseY = (e.clientY - rect.top) * scaleY; - - draggedBall.x = mouseX - draggedBall.offsetX; - draggedBall.y = mouseY - draggedBall.offsetY; - draggedBall.dx = (mouseX - lastMouse.x) * 0.4; - draggedBall.dy = (mouseY - lastMouse.y) * 0.4; - lastMouse = { x: mouseX, y: mouseY }; - } - }); - - window.addEventListener('pointerup', () => { - if (draggedBall) { - draggedBall.dragging = false; - draggedBall = null; - } - }); - - // Animation loop - let animationId = null; - let isAnimating = false; - - function animate() { - ctx.clearRect(0, 0, canvas.width, canvas.height); - balls.forEach(ball => ball.update(balls)); - animationId = requestAnimationFrame(animate); - } - - // Intersection Observer - const observer = new IntersectionObserver((entries) => { - entries.forEach(entry => { - if (entry.isIntersecting) { - if (!isAnimating) { - createBalls(); - isAnimating = true; - animate(); - } - } else { - if (isAnimating) { - cancelAnimationFrame(animationId); - isAnimating = false; - } - } - }); - }, { threshold: 0.1 }); - - observer.observe(ballSection); }); - - // scroll detect in slider - // JS script +// course finder ball bouncing +window.addEventListener('DOMContentLoaded', () => { + const canvas = document.getElementById('flagCanvas'); + const ctx = canvas.getContext('2d'); + const ballSection = document.getElementById('ball-section'); + + // Get responsive ball size + function getBallSize() { + const width = window.innerWidth; + if (width < 480) return 20; + if (width < 768) return 30; + return 40; + } + + let ballSize = getBallSize(); + + // Responsive canvas sizing + function resizeCanvas() { + canvas.width = ballSection.clientWidth; + canvas.height = ballSection.clientHeight; + ballSize = getBallSize(); + } + resizeCanvas(); + window.addEventListener('resize', resizeCanvas); + + const gravity = 0.25; + const friction = 0.8; + const elasticity = 0.75; + const flags = ['us', 'gb', 'np', 'dk', 'ca', 'au']; + let balls = []; + + class Ball { + constructor(x, y, radius, imageSrc) { + this.x = x; + this.y = y; + this.radius = radius; + this.dx = (Math.random() - 0.5) * 2; + this.dy = 0; + this.image = new Image(); + this.image.src = imageSrc; + this.dragging = false; + this.offsetX = 0; + this.offsetY = 0; + this.elasticity = elasticity; + this.hasSettled = false; + } + + draw() { + ctx.save(); + ctx.beginPath(); + ctx.arc(this.x, this.y, this.radius, 0, Math.PI * 2); + ctx.closePath(); + ctx.clip(); + + const img = this.image; + const size = Math.min(img.width, img.height); + const sx = (img.width - size) / 2; + const sy = (img.height - size) / 2; + + ctx.drawImage( + img, sx, sy, size, size, + this.x - this.radius, this.y - this.radius, + this.radius * 2, this.radius * 2 + ); + + ctx.restore(); + } + + update(others) { + if (!this.dragging) { + this.dy += gravity; + this.x += this.dx; + this.y += this.dy; + + // Floor + if (this.y + this.radius > canvas.height) { + this.y = canvas.height - this.radius; + this.dy *= -this.elasticity; + this.dx *= friction; + if (Math.abs(this.dy) < 0.5) { + this.dy = 0; + this.hasSettled = true; + } + } + + // Walls + if (this.x - this.radius < 0) { + this.x = this.radius; + this.dx *= -friction; + } else if (this.x + this.radius > canvas.width) { + this.x = canvas.width - this.radius; + this.dx *= -friction; + } + } + + // Collisions + if (this.dragging || !this.hasSettled) { + for (let other of others) { + if (other !== this) { + this.resolveBallCollision(other); + } + } + } + + this.draw(); + } + + resolveBallCollision(other) { + const dx = other.x - this.x; + const dy = other.y - this.y; + const dist = Math.sqrt(dx * dx + dy * dy); + const minDist = this.radius + other.radius; + + if (dist < minDist) { + const nx = dx / dist; + const ny = dy / dist; + const overlap = minDist - dist; + + const impulse = 0.5; + this.x -= nx * overlap * impulse; + this.y -= ny * overlap * impulse; + other.x += nx * overlap * impulse; + other.y += ny * overlap * impulse; + + const tx = -ny; + const ty = nx; + + const dpTan1 = this.dx * tx + this.dy * ty; + const dpTan2 = other.dx * tx + other.dy * ty; + + const dpNorm1 = this.dx * nx + this.dy * ny; + const dpNorm2 = other.dx * nx + other.dy * ny; + + this.dx = tx * dpTan1 + nx * dpNorm2; + this.dy = ty * dpTan1 + ny * dpNorm2; + other.dx = tx * dpTan2 + nx * dpNorm1; + other.dy = ty * dpTan2 + ny * dpNorm1; + } + } + } + + function createBalls() { + balls = []; + for (let i = 0; i < 30; i++) { + const flag = flags[i % flags.length]; + const x = Math.random() * (canvas.width - ballSize * 2) + ballSize; + const y = -Math.random() * 300; + balls.push(new Ball(x, y, ballSize, `assets/images/logo/country/${flag}.png`)); + } + } + + createBalls(); + + let draggedBall = null; + let lastMouse = { x: 0, y: 0 }; + + canvas.addEventListener('pointerdown', (e) => { + const rect = canvas.getBoundingClientRect(); + const scaleX = canvas.width / rect.width; + const scaleY = canvas.height / rect.height; + const mouseX = (e.clientX - rect.left) * scaleX; + const mouseY = (e.clientY - rect.top) * scaleY; + + for (let ball of balls) { + const dx = mouseX - ball.x; + const dy = mouseY - ball.y; + if (Math.sqrt(dx * dx + dy * dy) < ball.radius) { + ball.dragging = true; + draggedBall = ball; + ball.offsetX = dx; + ball.offsetY = dy; + ball.hasSettled = false; + lastMouse = { x: mouseX, y: mouseY }; + break; + } + } + }); + + canvas.addEventListener('pointermove', (e) => { + if (draggedBall) { + const rect = canvas.getBoundingClientRect(); + const scaleX = canvas.width / rect.width; + const scaleY = canvas.height / rect.height; + const mouseX = (e.clientX - rect.left) * scaleX; + const mouseY = (e.clientY - rect.top) * scaleY; + + draggedBall.x = mouseX - draggedBall.offsetX; + draggedBall.y = mouseY - draggedBall.offsetY; + draggedBall.dx = (mouseX - lastMouse.x) * 0.4; + draggedBall.dy = (mouseY - lastMouse.y) * 0.4; + lastMouse = { x: mouseX, y: mouseY }; + } + }); + + window.addEventListener('pointerup', () => { + if (draggedBall) { + draggedBall.dragging = false; + draggedBall = null; + } + }); + + // Animation loop + let animationId = null; + let isAnimating = false; + + function animate() { + ctx.clearRect(0, 0, canvas.width, canvas.height); + balls.forEach(ball => ball.update(balls)); + animationId = requestAnimationFrame(animate); + } + + // Intersection Observer + const observer = new IntersectionObserver((entries) => { + entries.forEach(entry => { + if (entry.isIntersecting) { + if (!isAnimating) { + createBalls(); + isAnimating = true; + animate(); + } + } else { + if (isAnimating) { + cancelAnimationFrame(animationId); + isAnimating = false; + } + } + }); + }, { threshold: 0.1 }); + + observer.observe(ballSection); +}); + + + +// scroll detect in slider +// JS script // JS for updating label on scroll window.addEventListener('load', () => { - console.log("Window loaded. Running scroll indicator script."); + console.log("Window loaded. Running scroll indicator script."); - const scrollLabel = document.getElementById('scroll-indicator-label'); - console.log("Scroll Label Element:", scrollLabel); + const scrollLabel = document.getElementById('scroll-indicator-label'); + console.log("Scroll Label Element:", scrollLabel); - const sections = document.querySelectorAll('.scroll-section'); - console.log("Found Sections:", sections); + const sections = document.querySelectorAll('.scroll-section'); + console.log("Found Sections:", sections); - if (!scrollLabel || sections.length === 0) { - console.error("Could not find scroll label or sections to observe. Exiting."); - return; - } + if (!scrollLabel || sections.length === 0) { + console.error("Could not find scroll label or sections to observe. Exiting."); + return; + } - const observer = new IntersectionObserver( - (entries) => { - console.log("IntersectionObserver callback fired:", entries); - entries.forEach(entry => { - console.log("Observing entry:", entry.target, "Is intersecting:", entry.isIntersecting); - if (entry.isIntersecting) { - // --- CHANGE IS HERE --- - const sectionId = entry.target.id; // Get the ID of the intersecting section - // --- END OF CHANGE --- + const observer = new IntersectionObserver( + (entries) => { + console.log("IntersectionObserver callback fired:", entries); + entries.forEach(entry => { + console.log("Observing entry:", entry.target, "Is intersecting:", entry.isIntersecting); + if (entry.isIntersecting) { + // --- CHANGE IS HERE --- + const sectionId = entry.target.id; // Get the ID of the intersecting section + // --- END OF CHANGE --- - console.log("Intersecting section ID:", sectionId); + console.log("Intersecting section ID:", sectionId); - if (sectionId) { // Check if ID exists - // Optional: Format the ID if needed (example: replace hyphens, capitalize) - // let displayText = sectionId.replace(/-/g, ' ').replace(/\b\w/g, l => l.toUpperCase()); - // scrollLabel.textContent = displayText; + if (sectionId) { // Check if ID exists + // Optional: Format the ID if needed (example: replace hyphens, capitalize) + // let displayText = sectionId.replace(/-/g, ' ').replace(/\b\w/g, l => l.toUpperCase()); + // scrollLabel.textContent = displayText; - // Simple version: Use the ID directly - scrollLabel.textContent = sectionId; - console.log("Updated scroll label text to:", sectionId); + // Simple version: Use the ID directly + scrollLabel.textContent = sectionId; + console.log("Updated scroll label text to:", sectionId); - } else { - console.warn("Intersecting section is missing an ID attribute:", entry.target); - } - } - }); - }, - { - threshold: 0.5 // Trigger when 50% of the section is visible - // Consider adjusting rootMargin if you have sticky headers/footers - // rootMargin: "-50px 0px -50px 0px" // Example: ignore top/bottom 50px - } - ); + } else { + console.warn("Intersecting section is missing an ID attribute:", entry.target); + } + } + }); + }, + { + threshold: 0.5 // Trigger when 50% of the section is visible + // Consider adjusting rootMargin if you have sticky headers/footers + // rootMargin: "-50px 0px -50px 0px" // Example: ignore top/bottom 50px + } + ); - sections.forEach(section => { - if (!section.id) { - console.warn("Section is missing an ID, it won't update the label:", section); - } - console.log("Observing section:", section); - observer.observe(section); - }); + sections.forEach(section => { + if (!section.id) { + console.warn("Section is missing an ID, it won't update the label:", section); + } + console.log("Observing section:", section); + observer.observe(section); + }); - console.log("Intersection observer setup complete."); + console.log("Intersection observer setup complete."); }); // Optional: Add a check outside the load event to see if the script file itself is loaded console.log("Scroll indicator script file loaded."); -// aeroplane flying +// aeroplane flying const plane = document.getElementById("plane"); let planeX = 100; @@ -441,39 +441,39 @@ let planeYBase = 200; // starting height let vx; if (window.innerWidth < 600) { - // mobile - vx = 1; + // mobile + vx = 1; } else if (window.innerWidth < 1200) { - // tablet - vx = 2; + // tablet + vx = 2; } else { - // desktop - vx = 3; + // desktop + vx = 3; } - // horizontal speed +// horizontal speed let direction = 1; // 1 = right, -1 = left // const amplitude = 150; let amplitude; if (window.innerWidth < 768) { - // mobile - amplitude = 90; + // mobile + amplitude = 90; } else { - // desktop - amplitude = 150; + // desktop + amplitude = 150; } // const numWaves = 2; let numWaves; if (window.innerWidth < 768) { - // mobile - numWaves = 1; + // mobile + numWaves = 1; } else { - // desktop - numWaves = 3; + // desktop + numWaves = 3; } - + let dodgeOffset = 0; const dodgeDecay = 0.9; @@ -483,190 +483,190 @@ let downwardStep = 200; // increase per edge hit let goingDown = true; function updatePosition() { - const w = window.innerWidth; - const h = document.body.scrollHeight; - const maxPlaneY = h - 200; + const w = window.innerWidth; + const h = document.body.scrollHeight; + const maxPlaneY = h - 200; - // bounce left/right - if (planeX <= 0 || planeX >= w - plane.width) { - vx *= -1; - direction *= -1; - plane.style.transform = `scaleX(${direction > 0 ? 1 : -1})`; + // bounce left/right + if (planeX <= 0 || planeX >= w - plane.width) { + vx *= -1; + direction *= -1; + plane.style.transform = `scaleX(${direction > 0 ? 1 : -1})`; - if (goingDown) { - targetDownwardMovement += downwardStep; - if (planeYBase + targetDownwardMovement >= maxPlaneY) { - targetDownwardMovement = maxPlaneY - planeYBase; - goingDown = false; - } - } else { - targetDownwardMovement -= downwardStep; - if (targetDownwardMovement <= 0) { - targetDownwardMovement = 0; - goingDown = true; - } + if (goingDown) { + targetDownwardMovement += downwardStep; + if (planeYBase + targetDownwardMovement >= maxPlaneY) { + targetDownwardMovement = maxPlaneY - planeYBase; + goingDown = false; + } + } else { + targetDownwardMovement -= downwardStep; + if (targetDownwardMovement <= 0) { + targetDownwardMovement = 0; + goingDown = true; + } + } } - } - planeX += vx; + planeX += vx; - // 🟢 Smoothly move downwardMovement towards targetDownwardMovement - downwardMovement += (targetDownwardMovement - downwardMovement) * 0.05; + // 🟢 Smoothly move downwardMovement towards targetDownwardMovement + downwardMovement += (targetDownwardMovement - downwardMovement) * 0.05; - // progress across screen - let progress = planeX / (w - plane.width); - if (direction < 0) { - progress = 1 - progress; - } + // progress across screen + let progress = planeX / (w - plane.width); + if (direction < 0) { + progress = 1 - progress; + } - const angle = progress * numWaves * 2 * Math.PI; - const waveY = Math.sin(angle) * amplitude; + const angle = progress * numWaves * 2 * Math.PI; + const waveY = Math.sin(angle) * amplitude; - const finalY = planeYBase + downwardMovement + waveY + dodgeOffset; + const finalY = planeYBase + downwardMovement + waveY + dodgeOffset; - plane.style.left = planeX + 'px'; - plane.style.top = finalY + 'px'; + plane.style.left = planeX + 'px'; + plane.style.top = finalY + 'px'; - dodgeOffset *= dodgeDecay; + dodgeOffset *= dodgeDecay; - requestAnimationFrame(updatePosition); + requestAnimationFrame(updatePosition); } -document.addEventListener("mousemove", function(e) { - const viewportOffset = plane.getBoundingClientRect(); - const planeCenterX = viewportOffset.left + plane.width / 2; - const planeCenterY = viewportOffset.top + plane.height / 2; - const dx = e.clientX - planeCenterX; - const dy = e.clientY - planeCenterY; - const dist = Math.sqrt(dx * dx + dy * dy); +document.addEventListener("mousemove", function (e) { + const viewportOffset = plane.getBoundingClientRect(); + const planeCenterX = viewportOffset.left + plane.width / 2; + const planeCenterY = viewportOffset.top + plane.height / 2; + const dx = e.clientX - planeCenterX; + const dy = e.clientY - planeCenterY; + const dist = Math.sqrt(dx * dx + dy * dy); - if (dist < 100) { - dodgeOffset -= (dy / dist) * 10; - } + if (dist < 100) { + dodgeOffset -= (dy / dist) * 10; + } }); updatePosition(); -// gallery image +// gallery image const images = Array.from(document.querySelectorAll('.gallery img')); const lightbox = document.getElementById('lightbox'); const lightboxImg = document.getElementById('lightbox-img'); let currentIndex = 0; images.forEach((img, index) => { - img.addEventListener('click', () => { - currentIndex = index; - showImage(); - }); + img.addEventListener('click', () => { + currentIndex = index; + showImage(); + }); }); function showImage() { - lightboxImg.src = images[currentIndex].src; - lightbox.classList.add('active'); + lightboxImg.src = images[currentIndex].src; + lightbox.classList.add('active'); } function closeLightbox() { - lightbox.classList.remove('active'); + lightbox.classList.remove('active'); } function changeSlide(step) { - currentIndex = (currentIndex + step + images.length) % images.length; - showImage(); + currentIndex = (currentIndex + step + images.length) % images.length; + showImage(); } document.addEventListener('keydown', e => { - if (!lightbox.classList.contains('active')) return; - if (e.key === 'ArrowRight') changeSlide(1); - if (e.key === 'ArrowLeft') changeSlide(-1); - if (e.key === 'Escape') closeLightbox(); + if (!lightbox.classList.contains('active')) return; + if (e.key === 'ArrowRight') changeSlide(1); + if (e.key === 'ArrowLeft') changeSlide(-1); + if (e.key === 'Escape') closeLightbox(); }); -// cost calculator progress +// cost calculator progress - let currentStep = 1; - const totalSteps = 5; - const monkey = document.getElementById('monkey').querySelector('img'); - const monkeyContainer = document.getElementById('monkey'); - const nextBtn = document.querySelector('.next-btn button'); - const bananalast = document.getElementById('b5'); - +let currentStep = 1; +const totalSteps = 5; +const monkey = document.getElementById('monkey').querySelector('img'); +const monkeyContainer = document.getElementById('monkey'); +const nextBtn = document.querySelector('.next-btn button'); +const bananalast = document.getElementById('b5'); - const monkeyImages = [ - "assets/images/icons/monkey1.png", - "assets/images/icons/monkey2.png", - "assets/images/icons/monkey3.png", - "assets/images/icons/monkey4.png", - "assets/images/icons/monkey5.png", - "assets/images/icons/monkey6.png", - "assets/images/icons/monkey7.png", - ]; - nextBtn.addEventListener('click', () => { - if (currentStep < totalSteps) { - currentStep++; +const monkeyImages = [ + "/raffles/assets/images/icons/monkey1.png", + "/raffles/assets/images/icons/monkey2.png", + "/raffles/assets/images/icons/monkey3.png", + "/raffles/assets/images/icons/monkey4.png", + "/raffles/assets/images/icons/monkey5.png", + "/raffles/assets/images/icons/monkey6.png", + "/raffles/assets/images/icons/monkey7.png" +]; - // Move monkey - if (window.innerWidth <= 540) { - const percent = ((currentStep -1) / (totalSteps - 0.2)) * 100; - monkeyContainer.style.left = percent + '%'; - } - else if (window.innerWidth <= 768) { - const percent = ((currentStep -1) / (totalSteps - 0.3)) * 100; - monkeyContainer.style.left = percent + '%'; - } - else if (window.innerWidth <= 992) { - const percent = ((currentStep -1) / (totalSteps - 0.7)) * 100; - monkeyContainer.style.left = percent + '%'; - } - else if (window.innerWidth <= 1180) { - const percent = ((currentStep -1) / (totalSteps - 0.2)) * 100; - monkeyContainer.style.left = percent + '%'; - } - else{ - const percent = ((currentStep -1) / (totalSteps - 0.5)) * 100; - monkeyContainer.style.left = percent + '%'; - } - +nextBtn.addEventListener('click', () => { + if (currentStep < totalSteps) { + currentStep++; - // Change monkey image - monkey.src = monkeyImages[currentStep - 1]; + // Move monkey + if (window.innerWidth <= 540) { + const percent = ((currentStep - 1) / (totalSteps - 0.2)) * 100; + monkeyContainer.style.left = percent + '%'; + } + else if (window.innerWidth <= 768) { + const percent = ((currentStep - 1) / (totalSteps - 0.3)) * 100; + monkeyContainer.style.left = percent + '%'; + } + else if (window.innerWidth <= 992) { + const percent = ((currentStep - 1) / (totalSteps - 0.7)) * 100; + monkeyContainer.style.left = percent + '%'; + } + else if (window.innerWidth <= 1180) { + const percent = ((currentStep - 1) / (totalSteps - 0.2)) * 100; + monkeyContainer.style.left = percent + '%'; + } + else { + const percent = ((currentStep - 1) / (totalSteps - 0.5)) * 100; + monkeyContainer.style.left = percent + '%'; + } - // Update step content - const currentContent = document.getElementById('step' + (currentStep - 1)); - const nextContent = document.getElementById('step' + currentStep); - if (currentContent && nextContent) { - currentContent.classList.remove('active'); - nextContent.classList.add('active'); - } - // At final step (Step 5), hide Next and show Done - if (currentStep === totalSteps) { - nextBtn.style.display = 'none'; - doneBtn.style.display = 'block'; - } - }w + // Change monkey image + monkey.src = monkeyImages[currentStep - 1]; + + // Update step content + const currentContent = document.getElementById('step' + (currentStep - 1)); + const nextContent = document.getElementById('step' + currentStep); + if (currentContent && nextContent) { + currentContent.classList.remove('active'); + nextContent.classList.add('active'); + } + + // At final step (Step 5), hide Next and show Done + if (currentStep === totalSteps) { + nextBtn.style.display = 'none'; + doneBtn.style.display = 'block'; + } + } w }); doneBtn.addEventListener('click', () => { - bananalast.classList.add('active'); + bananalast.classList.add('active'); - if (window.innerWidth <= 992) { - // On mobile: show 7th image and move down - monkey.src = monkeyImages[6]; // 7th image (index 6) - monkeyContainer.style.top = '142%'; - monkeyContainer.style.left = '40%'; // Optional: keep it centered or adjust as needed - } else { - // On desktop: show 6th image and move right - monkey.src = monkeyImages[5]; // 6th image (index 5) - monkeyContainer.style.left = '110%'; - monkeyContainer.style.top = '-120%'; // Reset top if changed previously - } + if (window.innerWidth <= 992) { + // On mobile: show 7th image and move down + monkey.src = monkeyImages[6]; // 7th image (index 6) + monkeyContainer.style.top = '142%'; + monkeyContainer.style.left = '40%'; // Optional: keep it centered or adjust as needed + } else { + // On desktop: show 6th image and move right + monkey.src = monkeyImages[5]; // 6th image (index 5) + monkeyContainer.style.left = '110%'; + monkeyContainer.style.top = '-120%'; // Reset top if changed previously + } }); - // Final monkey image - +// Final monkey image + diff --git a/resources/views/client/raffles/layouts/partials/header.blade.php b/resources/views/client/raffles/layouts/partials/header.blade.php index d362593..5bd25c2 100644 --- a/resources/views/client/raffles/layouts/partials/header.blade.php +++ b/resources/views/client/raffles/layouts/partials/header.blade.php @@ -166,7 +166,7 @@ class="lqd-scrl-indc-el inline-block absolute rounded-4">
- diff --git a/resources/views/client/raffles/pages/cost-calculator.blade.php b/resources/views/client/raffles/pages/cost-calculator.blade.php new file mode 100644 index 0000000..495b753 --- /dev/null +++ b/resources/views/client/raffles/pages/cost-calculator.blade.php @@ -0,0 +1,250 @@ +@extends('client.raffles.layouts.app') +@section('content') +
+ +
+ +
+ +
+
+

Cost Calculator

+
+
+
+ +
+
+
+ +
+ +
+ @csrf + + + + + +
+ +
+

Choose items to find the total cost

+
Where do you want to study?
+ +
+ @foreach ($countryOptions as $id => $country) +
+
+
+ +

{{ $country }}

+ +
+
+ @endforeach +
+
+ +
+

Choose items to find the total cost

+
Which English Proficiency Do you Have? +
+ +
+ @foreach ($testOptions as $id => $test) +
+
+
+ +

{{ $test }}

+ +
+
+ @endforeach +
+
+ +
+

Choose items to find the total cost

+
Which Intake do you want to go?
+ +
+ @foreach ($intakeOptions as $id => $intake) +
+
+
+ +

{{ $intake }}

+ +
+
+ @endforeach +
+
+ +
+

Choose items to find the total cost

+
How long do you want to study
+ +
+
+
+
+ +

1 year

+ + +
+
+
+
+
+ +

2 year

+ +
+
+
+
+
+ +

3 year

+ +
+
+
+
+ +
+

Choose items to find the total cost

+
Whats Your Program Level Choice?
+ +
+ @foreach ($programLevelOptions as $id => $level) +
+
+
+ +

{{ $level }}

+ +
+
+ @endforeach +
+
+ +
+ + +
+ +
+
+ +
+ + +
+ + +
+ + +
+ + +
+
+
+
+
+
+ +
+ +
+ +
+
+

Total Cost

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
S.N.SelectMax Price
1Bachelors$13000/year
2Bachelors$13000/year
3Bachelors$13000/year
4Bachelors$13000/year
5Bachelors$13000/year
+
+
+ +
+
+
+ +
+@endsection + +@push('js') + +@endpush