From 9a806477508a130dfe62f4e629934d52d00bf00b Mon Sep 17 00:00:00 2001 From: Sanjib Sen Date: Fri, 20 Dec 2024 07:55:15 +0600 Subject: [PATCH 1/2] Image URL support --- app/(tabs)/index.tsx | 9 ++++----- package-lock.json | 4 ++-- 2 files changed, 6 insertions(+), 7 deletions(-) diff --git a/app/(tabs)/index.tsx b/app/(tabs)/index.tsx index 2a36f55..1a91578 100644 --- a/app/(tabs)/index.tsx +++ b/app/(tabs)/index.tsx @@ -8,7 +8,7 @@ export default function HomeScreen() { const [isApiCallInProgress, setIsApiCallInProgress] = useState(false); // Function to call the fact-check API - const checkFacts = async (caption) => { + const checkFacts = async (caption, imageUrl) => { try { const response = await fetch('https://factcheck.planpostai.com/check-facts', { @@ -17,7 +17,7 @@ export default function HomeScreen() { 'Accept': 'application/json', 'Content-Type': 'application/json', }, - body: JSON.stringify({ query: caption }), + body: JSON.stringify({ query: caption, url:imageUrl }), }); const responseText = await response.text(); @@ -32,7 +32,7 @@ export default function HomeScreen() { // Send the result back to WebView to show toast webviewRef.current?.injectJavaScript(` (function() { - showToast('${result.evidence.replace(/'/g, "\\'")}'); + showToast('${result.evidence.replace(/'/g, "\\'")}', 10000); return true; })(); `); @@ -60,7 +60,6 @@ export default function HomeScreen() { const handleMessage = async (event) => { try { const data = JSON.parse(event.nativeEvent.data); - switch (data.type) { case 'postData': setPostData(prevData => [...prevData, { @@ -76,7 +75,7 @@ export default function HomeScreen() { setIsApiCallInProgress(true); try { - const result = await checkFacts(data.caption); + const result = await checkFacts(data.caption, data.imageUrls[0]); setIsApiCallInProgress(false); webviewRef.current?.injectJavaScript(` diff --git a/package-lock.json b/package-lock.json index 0eeae55..1b73221 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,11 +1,11 @@ { - "name": "fake-check-bd", + "name": "fact-checker", "version": "1.0.0", "lockfileVersion": 3, "requires": true, "packages": { "": { - "name": "fake-check-bd", + "name": "fact-checker", "version": "1.0.0", "dependencies": { "@expo/vector-icons": "^14.0.2", -- 2.45.3 From ab7f299b92af9aa80737bd6be29203a20c35683b Mon Sep 17 00:00:00 2001 From: smfahim25 Date: Sun, 22 Dec 2024 17:05:08 +0600 Subject: [PATCH 2/2] added dynamic color for toast --- app.json | 2 +- app/(tabs)/index.tsx | 86 ++++++++++++++++++++++++++++---------------- 2 files changed, 57 insertions(+), 31 deletions(-) diff --git a/app.json b/app.json index b957482..ebca688 100644 --- a/app.json +++ b/app.json @@ -1,6 +1,6 @@ { "expo": { - "name": "FactChecker", + "name": "Fact checker", "slug": "fake-check-bd", "version": "1.0.0", "orientation": "portrait", diff --git a/app/(tabs)/index.tsx b/app/(tabs)/index.tsx index 1a91578..35a61b3 100644 --- a/app/(tabs)/index.tsx +++ b/app/(tabs)/index.tsx @@ -28,14 +28,22 @@ export default function HomeScreen() { } const result = JSON.parse(responseText); + let color; + if (result?.verdict === 'True') { + color = "#2E7D32"; + } else if (result?.verdict === 'False') { + color = "#D32F2F"; + } else { + color = "#F9A825"; + } - // Send the result back to WebView to show toast - webviewRef.current?.injectJavaScript(` - (function() { - showToast('${result.evidence.replace(/'/g, "\\'")}', 10000); - return true; - })(); - `); + // Send the result back to WebView to show toast + webviewRef.current?.injectJavaScript(` + (function() { + showToast('${result.evidence.replace(/'/g, "\\'")}', 10000, '${color}'); + return true; + })(); + `); return result; } catch (error) { @@ -97,12 +105,18 @@ export default function HomeScreen() { setIsApiCallInProgress(false); webviewRef.current?.injectJavaScript(` (function() { + const svgCode=\` + + + + + \`; enableAllButtons(); const button = document.querySelector('button[data-post-id="${data.postId}"]'); if (button) { button.disabled = false; button.style.opacity = '1'; - button.textContent = 'Check'; + button.innerHTML = svgCode; } return true; })(); @@ -181,26 +195,38 @@ export default function HomeScreen() { }; // Toast notification function - window.showToast = function(message, duration = 5000, isError = false) { - const container = document.getElementById('toast-container') || - (() => { - const cont = document.createElement('div'); - cont.id = 'toast-container'; - document.body.appendChild(cont); - return cont; - })(); + window.showToast = function showToast(message, duration, color = '#333') { + // Create the toast element + const toast = document.createElement('div'); + toast.textContent = message; - const toast = document.createElement('div'); - toast.className = 'toast' + (isError ? ' error-toast' : ''); - toast.textContent = message; - container.appendChild(toast); + // Apply basic styles + toast.style.position = 'fixed'; + toast.style.top = '5px'; + toast.style.left = '50%'; + toast.style.fontSize="16px"; + toast.style.fontWeight="800"; + toast.style.transform = 'translateX(-50%)'; + toast.style.padding = '10px 20px'; + toast.style.color = '#fff'; + toast.style.backgroundColor = color; // Dynamic background color + toast.style.borderRadius = '8px'; + toast.style.boxShadow = '0 2px 10px rgba(0, 0, 0, 0.3)'; + toast.style.zIndex = '9999'; + toast.style.opacity = '1'; + toast.style.transition = 'opacity 0.5s ease-in-out'; + toast.style.width = '85%'; - setTimeout(() => { - toast.classList.add('fade-out'); - toast.addEventListener('transitionend', () => { - toast.remove(); - }); - }, duration); + // Add toast to the DOM + document.body.appendChild(toast); + + // Auto-remove the toast after the specified duration + setTimeout(() => { + toast.style.opacity = '0'; // Fade out + setTimeout(() => { + document.body.removeChild(toast); // Remove from DOM + }, 500); // Match fade-out duration + }, duration); }; // Function to handle "See More" click @@ -284,7 +310,7 @@ export default function HomeScreen() { } // Create button if there's a caption or at least one image - if ((caption && caption.length > 40) || imagesToUse.length > 0) { + if ((caption && caption.length > 50) || imagesToUse.length > 0) { const postId = 'post_' + Math.random().toString(36).substr(2, 9); createButton(post, caption, imagesToUse, postId); } @@ -307,14 +333,14 @@ export default function HomeScreen() { border: "none", borderRadius: "8px", cursor: "pointer", - zIndex: 1000000, + zIndex: 9999, pointerEvents: "auto", transition: "all 0.3s", }); button.addEventListener("click", async () => { disableAllButtons(); - button.textContent = "Processing..."; + button.textContent = "Processing"; button.style.opacity = "0.5"; button.style.color="white"; button.style.padding="5px 5px"; @@ -380,6 +406,6 @@ export default function HomeScreen() { const styles = StyleSheet.create({ container: { flex: 1, - marginTop: 30, + marginTop: 35, }, }); -- 2.45.3