Skip to content

Commit

Permalink
Merge pull request #644 from ananyag309/default
Browse files Browse the repository at this point in the history
Done fixes in feedback
  • Loading branch information
vimistify authored Oct 12, 2024
2 parents 79a6953 + 760481b commit 3567a8a
Showing 1 changed file with 187 additions and 100 deletions.
287 changes: 187 additions & 100 deletions Feedback.html
Original file line number Diff line number Diff line change
Expand Up @@ -329,6 +329,26 @@
background: radial-gradient(circle, rgba(71, 240, 255, 0.3), rgba(0, 119, 255, 0.3));
transition: transform 0.1s, left 0.1s, top 0.1s;
}

#backToTopBtn {
display: none; /* Hidden by default */
position: fixed;
bottom: 20px;
right: 30px;
z-index: 99;
font-size: 18px;
border: none;
outline: none;
background-color: #e81a1a;
color: white;
cursor: pointer;
padding: 15px;
border-radius: 4px;
}

#backToTopBtn:hover {
background-color: #555;
}
</style>
</head>

Expand Down Expand Up @@ -491,116 +511,183 @@ <h3 style="font-size: 1.5rem; margin-bottom: 10px; color: #2980b9;">Subscribe to
"></button>
</div>
</footer>
<script src="preloader.js"></script>
<script>
// Add event listeners to each star label for toggling the selection
const stars = document.querySelectorAll('.star-rating input');
stars.forEach(star => {
star.addEventListener('change', function () {
// Remove the checked state from all stars
stars.forEach(s => {
const label = document.querySelector(`label[for="${s.id}"]`);
label.style.color = '#ddd'; // Reset color for unselected stars
});
// Highlight the selected star and all previous stars
this.checked = true;
const currentStarValue = this.value;
for (let i = 1; i <= currentStarValue; i++) {
const label = document.querySelector(`label[for="star${i}"]`);
label.style.color = '#ffdd00'; // Highlight selected stars
}
});
});

// Handle form submission
const form = document.getElementById('feedback-box');
const feedbackBox = document.querySelector('.feedback-box');
const thankYouMessage = document.getElementById('thank-you-message');

form.addEventListener('submit', function (event) {
event.preventDefault(); // Prevent the default form submission
<!-- FAQ Popup Button -->
<button id="faqButton" style="position: fixed; bottom: 20px; right: 80px; z-index: 1000; background-color: #2980b9; color: white; border: none; padding: 10px 20px; border-radius: 5px; cursor: pointer; display: none;">FAQ</button>

// Hide the feedback-box div
feedbackBox.style.display = 'none';

// Show the thank-you message
thankYouMessage.style.display = 'flex';

// Hide the form to avoid further submissions
form.style.display = 'none';
<!-- FAQ Popup -->
<div id="faqPopup" style="display: none; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); background-color: white; padding: 20px; border-radius: 10px; box-shadow: 0 0 10px rgba(0,0,0,0.3); z-index: 1001; max-width: 80%; max-height: 80%; overflow-y: auto;">
<h2>Frequently Asked Questions</h2>
<div class="faq-content">
<div class="faq-item">
<h3>What is AmbuFlow?</h3>
<p>AmbuFlow is an advanced ambulance monitoring system designed to optimize emergency response times and improve patient care.</p>
</div>
<div class="faq-item">
<h3>How does real-time tracking work?</h3>
<p>Our system uses GPS technology to track ambulances in real-time, allowing for efficient dispatch and route optimization.</p>
</div>
<div class="faq-item">
<h3>Is the service available 24/7?</h3>
<p>Yes, AmbuFlow operates round the clock to ensure emergency services are always available when needed.</p>
</div>
<div class="faq-item">
<h3>How can hospitals benefit from AmbuFlow?</h3>
<p>Hospitals can improve resource management, reduce response times, and enhance overall patient care through our integrated system.</p>
</div>
</div>
<button id="closeFaqPopup" style="background-color: #e74c3c; color: white; border: none; padding: 5px 10px; border-radius: 5px; cursor: pointer; margin-top: 10px;">Close</button>
</div>

// Redirect to the home page after 2 seconds
setTimeout(function () {
window.location.href = 'index.html';
}, 5000); // Adjust the delay as needed
<script src="preloader.js"></script>
<script>
// Add event listeners to each star label for toggling the selection
const stars = document.querySelectorAll('.star-rating input');
stars.forEach(star => {
star.addEventListener('change', function () {
// Remove the checked state from all stars
stars.forEach(s => {
const label = document.querySelector(`label[for="${s.id}"]`);
label.style.color = '#ddd'; // Reset color for unselected stars
});
// Highlight the selected star and all previous stars
this.checked = true;
const currentStarValue = this.value;
for (let i = 1; i <= currentStarValue; i++) {
const label = document.querySelector(`label[for="star${i}"]`);
label.style.color = '#ffdd00'; // Highlight selected stars
}
});

// Update or add this JavaScript for the cursor effect
const coords = { x: 0, y: 0 };
const circles = document.querySelectorAll(".circle");

const colors = [
"#ffb56b",
"#fdaf69",
"#f89d63",
"#f59761",
"#ef865e",
"#ec805d",
"#e36e5c",
"#df685c",
"#d5585c",
"#d1525c",
"#c5415d",
"#c03b5d",
"#b22c5e",
"#ac265e",
"#9c155f",
"#950f5f",
"#830060",
"#7c0060",
"#680060",
"#60005f",
"#48005f",
"#3d005e"
];
});

// Handle form submission
const form = document.getElementById('feedback-box');
const feedbackBox = document.querySelector('.feedback-box');
const thankYouMessage = document.getElementById('thank-you-message');

form.addEventListener('submit', function (event) {
event.preventDefault(); // Prevent the default form submission

// Hide the feedback-box div
feedbackBox.style.display = 'none';

// Show the thank-you message
thankYouMessage.style.display = 'flex';

// Hide the form to avoid further submissions
form.style.display = 'none';

// Redirect to the home page after 2 seconds
setTimeout(function () {
window.location.href = 'index.html';
}, 5000); // Adjust the delay as needed
});

// Update or add this JavaScript for the cursor effect
const coords = { x: 0, y: 0 };
const circles = document.querySelectorAll(".circle");

const colors = [
"#ffb56b",
"#fdaf69",
"#f89d63",
"#f59761",
"#ef865e",
"#ec805d",
"#e36e5c",
"#df685c",
"#d5585c",
"#d1525c",
"#c5415d",
"#c03b5d",
"#b22c5e",
"#ac265e",
"#9c155f",
"#950f5f",
"#830060",
"#7c0060",
"#680060",
"#60005f",
"#48005f",
"#3d005e"
];

circles.forEach(function (circle, index) {
circle.x = 0;
circle.y = 0;
circle.style.backgroundColor = colors[index % colors.length];
});

window.addEventListener("mousemove", function(e){
coords.x = e.clientX;
coords.y = e.clientY;
});

function animateCircles() {
let x = coords.x;
let y = coords.y;

circles.forEach(function (circle, index) {
circle.x = 0;
circle.y = 0;
circle.style.backgroundColor = colors[index % colors.length];
});
circle.style.left = x - 12 + "px";
circle.style.top = y - 12 + "px";

window.addEventListener("mousemove", function(e){
coords.x = e.clientX;
coords.y = e.clientY;
});

function animateCircles() {
let x = coords.x;
let y = coords.y;

circles.forEach(function (circle, index) {
circle.style.left = x - 12 + "px";
circle.style.top = y - 12 + "px";
circle.style.scale = (circles.length - index) / circles.length;

circle.style.scale = (circles.length - index) / circles.length;
circle.x = x;
circle.y = y;

circle.x = x;
circle.y = y;

const nextCircle = circles[index + 1] || circles[0];
x += (nextCircle.x - x) * 0.3;
y += (nextCircle.y - y) * 0.3;
});

requestAnimationFrame(animateCircles);
}

animateCircles();
</script>
const nextCircle = circles[index + 1] || circles[0];
x += (nextCircle.x - x) * 0.3;
y += (nextCircle.y - y) * 0.3;
});

<!-- Add this if it's not already present -->
<div class="circle"></div>
requestAnimationFrame(animateCircles);
}

animateCircles();

// Add this new code for the Back to Top functionality
const backToTopBtn = document.getElementById('backToTopBtn');
const faqButton = document.getElementById('faqButton');
const faqPopup = document.getElementById('faqPopup');
const closeFaqPopup = document.getElementById('closeFaqPopup');

// Show/hide buttons when user scrolls
window.onscroll = function() {
if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
backToTopBtn.style.display = "block";
faqButton.style.display = "block";
} else {
backToTopBtn.style.display = "none";
faqButton.style.display = "none";
}
};

// Scroll to top when button is clicked
backToTopBtn.addEventListener('click', function() {
document.body.scrollTop = 0; // For Safari
document.documentElement.scrollTop = 0; // For Chrome, Firefox, IE and Opera
});

// FAQ Popup functionality
faqButton.addEventListener('click', () => {
faqPopup.style.display = 'block';
});

closeFaqPopup.addEventListener('click', () => {
faqPopup.style.display = 'none';
});

// Close popup when clicking outside
window.addEventListener('click', (event) => {
if (event.target === faqPopup) {
faqPopup.style.display = 'none';
}
});
</script>

<!-- Add this if it's not already present -->
<div class="circle"></div>
</body>

</html>

0 comments on commit 3567a8a

Please sign in to comment.