Skip to content

Commit f7dbb06

Browse files
SilentCoderHereSilentCoderHere
committed
Code formatted
1 parent c3e9fee commit f7dbb06

2 files changed

Lines changed: 675 additions & 658 deletions

File tree

‎fruit-ai/script.js‎

Lines changed: 179 additions & 163 deletions
Original file line numberDiff line numberDiff line change
@@ -710,208 +710,224 @@ const fruits = [
710710
];
711711

712712
// Create floating fruits
713-
const floatingFruitsContainer = document.getElementById('floatingFruits');
714-
const fruitIcons = ['🍎', '🍌', '🍍', '🍊', '🍓', '🫐', '🍇', '🍉', '🥝', '🥭', '🍑', '🍒'];
713+
const floatingFruitsContainer = document.getElementById("floatingFruits");
714+
const fruitIcons = [
715+
"🍎",
716+
"🍌",
717+
"🍍",
718+
"🍊",
719+
"🍓",
720+
"🫐",
721+
"🍇",
722+
"🍉",
723+
"🥝",
724+
"🥭",
725+
"🍑",
726+
"🍒",
727+
];
715728

716-
function createFloatingFruits() {
717-
// Clear existing fruits
718-
floatingFruitsContainer.innerHTML = '';
729+
function createFloatingFruits() {
730+
// Clear existing fruits
731+
floatingFruitsContainer.innerHTML = "";
719732

720-
// Calculate how many fruits to create based on screen size
721-
const fruitCount = Math.min(15, Math.floor(window.innerWidth / 50));
733+
// Calculate how many fruits to create based on screen size
734+
const fruitCount = Math.min(15, Math.floor(window.innerWidth / 50));
722735

723-
for (let i = 0; i < fruitCount; i++) {
724-
const fruit = document.createElement('div');
725-
fruit.className = 'fruit';
726-
fruit.textContent = fruitIcons[Math.floor(Math.random() * fruitIcons.length)];
727-
fruit.style.left = `${Math.random() * 100}%`;
728-
fruit.style.top = `${Math.random() * 100}%`;
729-
fruit.style.animationDuration = `${15 + Math.random() * 20}s`;
730-
fruit.style.fontSize = `${1 + Math.random() * 1.5}rem`;
731-
floatingFruitsContainer.appendChild(fruit);
732-
}
733-
}
736+
for (let i = 0; i < fruitCount; i++) {
737+
const fruit = document.createElement("div");
738+
fruit.className = "fruit";
739+
fruit.textContent =
740+
fruitIcons[Math.floor(Math.random() * fruitIcons.length)];
741+
fruit.style.left = `${Math.random() * 100}%`;
742+
fruit.style.top = `${Math.random() * 100}%`;
743+
fruit.style.animationDuration = `${15 + Math.random() * 20}s`;
744+
fruit.style.fontSize = `${1 + Math.random() * 1.5}rem`;
745+
floatingFruitsContainer.appendChild(fruit);
746+
}
747+
}
734748

735-
// Initial creation of floating fruits
736-
createFloatingFruits();
749+
// Initial creation of floating fruits
750+
createFloatingFruits();
737751

738-
// Update floating fruits on resize
739-
window.addEventListener('resize', createFloatingFruits);
752+
// Update floating fruits on resize
753+
window.addEventListener("resize", createFloatingFruits);
740754

741-
// Levenshtein Distance function
742-
function levenshtein(a, b) {
743-
if (a.length === 0) return b.length;
744-
if (b.length === 0) return a.length;
755+
// Levenshtein Distance function
756+
function levenshtein(a, b) {
757+
if (a.length === 0) return b.length;
758+
if (b.length === 0) return a.length;
745759

746-
const matrix = Array.from({ length: a.length + 1 }, () =>
747-
Array(b.length + 1).fill(0)
760+
const matrix = Array.from({ length: a.length + 1 }, () =>
761+
Array(b.length + 1).fill(0)
762+
);
763+
for (let i = 0; i <= a.length; i++) matrix[i][0] = i;
764+
for (let j = 0; j <= b.length; j++) matrix[0][j] = j;
765+
for (let i = 1; i <= a.length; i++) {
766+
for (let j = 1; j <= b.length; j++) {
767+
const cost = a[i - 1] === b[j - 1] ? 0 : 1;
768+
matrix[i][j] = Math.min(
769+
matrix[i - 1][j] + 1,
770+
matrix[i][j - 1] + 1,
771+
matrix[i - 1][j - 1] + cost
748772
);
749-
for (let i = 0; i <= a.length; i++) matrix[i][0] = i;
750-
for (let j = 0; j <= b.length; j++) matrix[0][j] = j;
751-
for (let i = 1; i <= a.length; i++) {
752-
for (let j = 1; j <= b.length; j++) {
753-
const cost = a[i - 1] === b[j - 1] ? 0 : 1;
754-
matrix[i][j] = Math.min(
755-
matrix[i - 1][j] + 1,
756-
matrix[i][j - 1] + 1,
757-
matrix[i - 1][j - 1] + cost
758-
);
759-
}
760-
}
761-
return matrix[a.length][b.length];
762773
}
774+
}
775+
return matrix[a.length][b.length];
776+
}
763777

764-
// Get best matches
765-
function getBestMatches(word) {
766-
const topDistance = {};
767-
fruits.forEach((fruit) => {
768-
const dist = levenshtein(word.toLowerCase(), fruit.toLowerCase());
769-
if (!topDistance[dist]) topDistance[dist] = [];
770-
// Avoid duplicates
771-
if (!topDistance[dist].includes(fruit)) {
772-
topDistance[dist].push(fruit);
773-
}
774-
});
775-
return topDistance;
778+
// Get best matches
779+
function getBestMatches(word) {
780+
const topDistance = {};
781+
fruits.forEach((fruit) => {
782+
const dist = levenshtein(word.toLowerCase(), fruit.toLowerCase());
783+
if (!topDistance[dist]) topDistance[dist] = [];
784+
// Avoid duplicates
785+
if (!topDistance[dist].includes(fruit)) {
786+
topDistance[dist].push(fruit);
776787
}
788+
});
789+
return topDistance;
790+
}
777791

778-
// UI Elements
779-
const input = document.getElementById("fruitInput");
780-
const resultsDiv = document.getElementById("results");
781-
const suggestionsDiv = document.getElementById("suggestions");
782-
const checkBtn = document.getElementById("checkBtn");
783-
const clearBtn = document.getElementById("clearBtn");
792+
// UI Elements
793+
const input = document.getElementById("fruitInput");
794+
const resultsDiv = document.getElementById("results");
795+
const suggestionsDiv = document.getElementById("suggestions");
796+
const checkBtn = document.getElementById("checkBtn");
797+
const clearBtn = document.getElementById("clearBtn");
784798

785-
// Input event for suggestions
786-
let inputTimeout;
787-
input.addEventListener("input", () => {
788-
// Clear previous timeout
789-
clearTimeout(inputTimeout);
799+
// Input event for suggestions
800+
let inputTimeout;
801+
input.addEventListener("input", () => {
802+
// Clear previous timeout
803+
clearTimeout(inputTimeout);
790804

791-
// Set new timeout to avoid too frequent updates
792-
inputTimeout = setTimeout(() => {
793-
const val = input.value.trim().toLowerCase();
794-
if (!val) {
795-
suggestionsDiv.innerHTML = "";
796-
suggestionsDiv.style.display = "none";
797-
return;
798-
}
805+
// Set new timeout to avoid too frequent updates
806+
inputTimeout = setTimeout(() => {
807+
const val = input.value.trim().toLowerCase();
808+
if (!val) {
809+
suggestionsDiv.innerHTML = "";
810+
suggestionsDiv.style.display = "none";
811+
return;
812+
}
799813

800-
const matches = fruits
801-
.filter((f) => f.toLowerCase().includes(val))
802-
.slice(0, 5);
814+
const matches = fruits
815+
.filter((f) => f.toLowerCase().includes(val))
816+
.slice(0, 5);
803817

804-
if (matches.length > 0) {
805-
suggestionsDiv.innerHTML = matches.map((f) => `<p>${f}</p>`).join("");
806-
suggestionsDiv.style.display = "block";
807-
} else {
808-
suggestionsDiv.innerHTML = "";
809-
suggestionsDiv.style.display = "none";
810-
}
811-
}, 150);
812-
});
818+
if (matches.length > 0) {
819+
suggestionsDiv.innerHTML = matches.map((f) => `<p>${f}</p>`).join("");
820+
suggestionsDiv.style.display = "block";
821+
} else {
822+
suggestionsDiv.innerHTML = "";
823+
suggestionsDiv.style.display = "none";
824+
}
825+
}, 150);
826+
});
813827

814-
// Suggestion click event
815-
suggestionsDiv.addEventListener("click", (e) => {
816-
if (e.target.tagName === 'P') {
817-
input.value = e.target.textContent;
818-
suggestionsDiv.innerHTML = "";
819-
suggestionsDiv.style.display = "none";
820-
// Trigger input event to update suggestions
821-
input.dispatchEvent(new Event('input'));
822-
}
823-
});
828+
// Suggestion click event
829+
suggestionsDiv.addEventListener("click", (e) => {
830+
if (e.target.tagName === "P") {
831+
input.value = e.target.textContent;
832+
suggestionsDiv.innerHTML = "";
833+
suggestionsDiv.style.display = "none";
834+
// Trigger input event to update suggestions
835+
input.dispatchEvent(new Event("input"));
836+
}
837+
});
824838

825-
// Hide suggestions when clicking outside
826-
document.addEventListener('click', (e) => {
827-
if (!input.contains(e.target) && !suggestionsDiv.contains(e.target)) {
828-
suggestionsDiv.style.display = "none";
829-
}
830-
});
839+
// Hide suggestions when clicking outside
840+
document.addEventListener("click", (e) => {
841+
if (!input.contains(e.target) && !suggestionsDiv.contains(e.target)) {
842+
suggestionsDiv.style.display = "none";
843+
}
844+
});
831845

832-
// Check button event
833-
checkBtn.addEventListener("click", () => {
834-
const val = input.value.trim();
835-
resultsDiv.innerHTML = "";
846+
// Check button event
847+
checkBtn.addEventListener("click", () => {
848+
const val = input.value.trim();
849+
resultsDiv.innerHTML = "";
836850

837-
if (!val) {
838-
resultsDiv.innerHTML = `
851+
if (!val) {
852+
resultsDiv.innerHTML = `
839853
<div class="no-results">
840854
<i class="fas fa-exclamation-circle"></i> Please enter a fruit name to check
841855
</div>
842856
`;
843-
return;
844-
}
857+
return;
858+
}
845859

846-
// Show loading state
847-
const originalText = checkBtn.innerHTML;
848-
checkBtn.innerHTML = '<span class="spinner"></span> Checking...';
849-
checkBtn.disabled = true;
860+
// Show loading state
861+
const originalText = checkBtn.innerHTML;
862+
checkBtn.innerHTML = '<span class="spinner"></span> Checking...';
863+
checkBtn.disabled = true;
850864

851-
// Simulate processing time for better UX
852-
setTimeout(() => {
853-
const matches = getBestMatches(val);
854-
const labels = {
855-
0: { text: "Exact Match", icon: "fas fa-check" },
856-
1: { text: "Small Typo", icon: "fas fa-spell-check" },
857-
2: { text: "Close Match", icon: "fas fa-exchange-alt" },
858-
3: { text: "Similar Fruit", icon: "fas fa-search" }
859-
};
865+
// Simulate processing time for better UX
866+
setTimeout(() => {
867+
const matches = getBestMatches(val);
868+
const labels = {
869+
0: { text: "Exact Match", icon: "fas fa-check" },
870+
1: { text: "Small Typo", icon: "fas fa-spell-check" },
871+
2: { text: "Close Match", icon: "fas fa-exchange-alt" },
872+
3: { text: "Similar Fruit", icon: "fas fa-search" },
873+
};
860874

861-
let hasResults = false;
875+
let hasResults = false;
862876

863-
Object.keys(labels).forEach((dist) => {
864-
if (matches[dist] && matches[dist].length > 0) {
865-
hasResults = true;
866-
const categoryDiv = document.createElement("div");
867-
categoryDiv.className = "result-category";
868-
categoryDiv.innerHTML = `
877+
Object.keys(labels).forEach((dist) => {
878+
if (matches[dist] && matches[dist].length > 0) {
879+
hasResults = true;
880+
const categoryDiv = document.createElement("div");
881+
categoryDiv.className = "result-category";
882+
categoryDiv.innerHTML = `
869883
<h3><i class="${labels[dist].icon}"></i> ${labels[dist].text}</h3>
870884
<div>
871-
${matches[dist].map(fruit => `<span class="fruit-badge">${fruit}</span>`).join('')}
885+
${matches[dist]
886+
.map((fruit) => `<span class="fruit-badge">${fruit}</span>`)
887+
.join("")}
872888
</div>
873889
`;
874-
resultsDiv.appendChild(categoryDiv);
875-
}
876-
});
890+
resultsDiv.appendChild(categoryDiv);
891+
}
892+
});
877893

878-
if (!hasResults) {
879-
resultsDiv.innerHTML = `
894+
if (!hasResults) {
895+
resultsDiv.innerHTML = `
880896
<div class="no-results">
881897
<i class="fas fa-question-circle"></i> No matching fruits found. Try a different spelling.
882898
</div>
883899
`;
884-
}
900+
}
885901

886-
// Restore button state
887-
checkBtn.innerHTML = originalText;
888-
checkBtn.disabled = false;
889-
}, 500);
890-
});
902+
// Restore button state
903+
checkBtn.innerHTML = originalText;
904+
checkBtn.disabled = false;
905+
}, 500);
906+
});
891907

892-
// Clear button event
893-
clearBtn.addEventListener("click", () => {
894-
input.value = "";
895-
suggestionsDiv.innerHTML = "";
896-
suggestionsDiv.style.display = "none";
897-
resultsDiv.innerHTML = "";
898-
input.focus();
899-
});
908+
// Clear button event
909+
clearBtn.addEventListener("click", () => {
910+
input.value = "";
911+
suggestionsDiv.innerHTML = "";
912+
suggestionsDiv.style.display = "none";
913+
resultsDiv.innerHTML = "";
914+
input.focus();
915+
});
900916

901-
// Enter key support
902-
input.addEventListener("keyup", (e) => {
903-
if (e.key === "Enter") {
904-
checkBtn.click();
905-
}
906-
});
917+
// Enter key support
918+
input.addEventListener("keyup", (e) => {
919+
if (e.key === "Enter") {
920+
checkBtn.click();
921+
}
922+
});
907923

908-
// Handle page visibility change
909-
document.addEventListener('visibilitychange', function () {
910-
if (!document.hidden) {
911-
// Page is visible again, refresh floating fruits
912-
createFloatingFruits();
913-
}
914-
});
924+
// Handle page visibility change
925+
document.addEventListener("visibilitychange", function () {
926+
if (!document.hidden) {
927+
// Page is visible again, refresh floating fruits
928+
createFloatingFruits();
929+
}
930+
});
915931

916-
// Initialize with focus on input
917-
input.focus();
932+
// Initialize with focus on input
933+
input.focus();

0 commit comments

Comments
 (0)