Sun Dec 20 2020 16:00:53 GMT+0000 (Coordinated Universal Time)
Saved by @bifrost #reactnative
<SafeAreaView style={styles.container}> <Text numberOfLines={1}>hello</Text> </SafeAreaView>
#reactnative
#css #styledcomponents #react.js #reactnative
const Nav = styled.div` div > a.active > div { color: ${props => props.color} } ` function Header() { const {DefaultColor} = useContext(GlobalContext) return <Nav color={DefaultColor?.success} /> }
#reactnative #javascript
import React, { useEffect } from "react"; import { Text, View, StyleSheet, BackHandler, Alert } from "react-native"; import { useBackHandler } from "@react-native-community/hooks" const App = () => { // Callback function for back action const backActionHandler = () => { Alert.alert("Alert!", "Are you sure you want to exit app?", [ { text: "Cancel", onPress: () => null, style: "cancel" }, { text: "YES", onPress: () => BackHandler.exitApp() } ]); return true; }; // hook which handles event listeners under the hood useBackHandler(backActionHandler) return ( <View style={styles.container}> <Text style={styles.text}>Click Back button!</Text> </View> ); }; const styles = StyleSheet.create({ container: { flex: 1, alignItems: "center", justifyContent: "center" }, text: { fontSize: 18, fontWeight: "bold" } }); export default App;
app.post("/upload", upload.single("image"), async (req, res) => { try { if (!req.file) { res.status(400).json({ success: false, error: "No file uploaded" }); return; } const imageBuffer = req.file.buffer; const itemsArray = []; const fileName = `public/${Date.now()}.png`; const imageUrl = await uploadToSupabase(imageBuffer, fileName); console.log("Uploaded image:", imageUrl); const objects = await getObjectDetection(imageBuffer); const productTitle = await getProductTitle(imageBuffer); console.log("Product title:", productTitle); const matchedCategory = await compareTitleToJSON(productTitle); console.log("Matched Category:", matchedCategory); let croppedImageUrl; let categoryExistsInObjects = false; if (matchedCategory) { for (const object of objects) { if (object.name.toLowerCase() === matchedCategory.toLowerCase()) { categoryExistsInObjects = true; break; } } } console.log( "Category Exists in Detected Objects:", categoryExistsInObjects ); let secondaryMatchedCategory; if (!categoryExistsInObjects) { // Use OCR title as a backup secondaryMatchedCategory = await compareTitleToAllItems(productTitle); console.log( "Backup Matched Category from OCR title:", secondaryMatchedCategory ); } if (matchedCategory && categoryExistsInObjects) { const object = objects.find( (obj) => obj.name.toLowerCase() === matchedCategory.toLowerCase() ); croppedImageUrl = await cropImageForCategory( imageBuffer, objects, matchedCategory ); if (object) { const vertices = object.boundingPoly.normalizedVertices; const x1 = vertices[0].x; const y1 = vertices[0].y; const x2 = vertices[2].x; const y2 = vertices[2].y; const croppedBuffer = await cropImage(imageBuffer, x1, y1, x2, y2); // Upload the cropped image to Supabase const croppedFileName = `public/${Date.now()}.png`; croppedImageUrl = await uploadToSupabase( croppedBuffer, croppedFileName ); console.log("Cropped image URL:", croppedImageUrl); } } else if (secondaryMatchedCategory) { // Add this condition const croppedFileName = `public/${Date.now()}.png`; croppedImageUrl = await cropImageForCategory( imageBuffer, objects, secondaryMatchedCategory ); console.log("Secondary cropped image URL:", croppedImageUrl); } else { croppedImageUrl = null; // Assign null when neither condition is met } const question = "Is this a shopping webpage where I can buy clothing?"; const answer = await askQuestionAboutImage(imageUrl, question); const isShoppingWebpage = answer.includes("yes"); console.log("This is a shopping page?:", isShoppingWebpage); if (croppedImageUrl) { const croppedItemsArray = await getItems(croppedImageUrl); itemsArray.push(...croppedItemsArray); // Combine the results } console.log( "Category Exists in Detected Objects (before response):", categoryExistsInObjects ); res.json({ success: true, imageUrl: categoryExistsInObjects && croppedImageUrl ? croppedImageUrl : imageUrl, objects, productTitle, itemsArray: itemsArray, isShoppingWebpage, matchedCategory, categoryExistsInObjects, croppedImageUrl, }); console.log("Items Array sent in response:", itemsArray); } catch (error) { console.error("Error uploading image to Supabase:", error); res.status(500).json({ success: false, error: "Image upload failed" }); } });
{ "Top": [ "Top", "T-shirt", "T-Shirt", " T-shirt", "Tee", "Blouse", "Sweater", "Tank top", "Short Sleeve T-shirt", "Long-sleeve shirt", "Hoodie", "Polo shirt", "Turtleneck", "Button-up shirt", "Bra", "Hoodie", "Vest", "Bikini", "Tankini", "Bikinis-and-Tankini-Sets" ], "Shorts": [ "Shorts", "Bermuda", "Bermudas", "Trunk", "Trunks", "Capri", "Capris", "Boardshort", "Boardshorts", "Culotte", "Culottes", "Cargo shorts", "Gym shorts", "Cycling shorts", "Jogging shorts", "Boxer shorts", "Swimsuit", "Swim-briefs-shorts", "briefs", "Swim", "Bandeaus", "Swimsuit-one-piece", "Bikini", "Tankini" ], "Pants": [ "Pant", "Pants", "Jean", "Jeans", "Legging", "Leggings", "Slack", "Slacks", "Trouser", "Trousers", "Chino", "Chinos", "Corduroy", "Corduroys", "Jegging", "Jeggings", "Sweatpant", "Sweatpants", "Jogger", "Joggers", "Palazzo pant", "Palazzo pants" ], "Outerwear": [ "Jacket", "Coat", "Blazer", "Windbreaker", "Parka", "Peacoat", "Crop-top", "Crop top", "Trench coat", "Puffer jacket", "Denim jacket", "Bomber jacket", "Raincoat" ], "Hat": [ "Hat", "Baseball cap", "Beanie", "Fedora", "Sun hat", "Trucker hat", "Bucket hat", "Cowboy hat", "Beret", "Panama hat", "Boater" ], "Sock": [ "Sock", "Socks", "Ankle sock", "Ankle socks", "Crew sock", "Crew socks", "No-show sock", "No-show socks", "Athletic sock", "Athletic socks", "Thermal sock", "Thermal socks", "Compression sock", "Compression socks", "Toe sock", "Toe socks" ], "Dress": [ "Dress", "Maxi dress", "Midi dress", "Mini dress", "Sheath dress", "A-line dress", "Bodycon dress", "Wrap dress", "Slip dress", "Skater dress", "Shift dress" ], "Miniskirt": [ "Skirt", "Miniskirt", "Pencil skirt", "Pleated skirt", "A-line skirt", "Denim skirt", "Leather skirt", "Circle skirt", "Accordion skirt", "Ruffle skirt", "Tiered skirt", "Maxi skirt" ], "High heels": [ "High heel", "High heels", "Stiletto", "Pump", "Pumps", "Wedge heel", "Wedge heels", "Kitten heel", "Kitten heels", "Platform heel", "Platform heels", "Slingback heel", "Slingback heels", "Peep-toe heel", "Peep-toe heels", "Ankle-strap heel", "Ankle-strap heels", "Cone heel", "Cone heels", "Block heel", "Block heels" ], "Shoes": [ "Shoe", "Shoes", "Sneaker", "Sneakers", "Boot", "Boots", "Sandal", "Sandals", "Flat", "Flats", "Loafer", "Loafers", "Moccasin", "Moccasins", "Oxford", "Oxfords", "Espadrille", "Espadrilles", "Ballet shoe", "Ballet shoes", "Slipper", "Slippers" ] }
axios.get('https://api.example.com/data') .then(response => { // Handle the successful response here console.log(response.data); }) .catch(error => { // Handle errors here console.error('Error fetching data:', error); });
Copy this HTML code:
Preview:
open_in_newInstructions on embedding in Medium
Comments