diff --git a/backend/app.py b/backend/app.py index a8893a5..0204c68 100644 --- a/backend/app.py +++ b/backend/app.py @@ -12,6 +12,8 @@ from flask_cors import CORS import uuid from flask import send_from_directory +import time +import os model = keras.models.load_model('multi-keras.h5') @@ -58,6 +60,16 @@ def send_js(path): return send_from_directory('images', path) +@app.route('/recent_images') +def view_recent_images(): + """ + Endpoints returning recently uploaded images from the community + """ + paths = get_most_recent_photos() + + return jsonify({'paths': paths}), 200 + + def readb64(encoded_data): nparr = np.fromstring(base64.b64decode(encoded_data), np.uint8) img = cv2.imdecode(nparr, cv2.IMREAD_COLOR) @@ -78,11 +90,20 @@ def process_upload(data): combined, _ = add_pink_hair(img) combined = (combined * 255.0).astype(np.uint8) - path = 'images/{}.jpg'.format(uuid.uuid4()) + # We are using the timestamp ms as a sorting key to show the post recent + # pictures taken to our frontend, and we use a uuid4 as a unique identifier + path = 'images/{}{}.jpg'.format(time.time(), uuid.uuid4()) cv2.imwrite(path, combined) return jsonify({'path': '/' + path}) + +def get_most_recent_photos(directory='images', count=10): + files = [os.path.join(directory, f) for f in os.listdir('images') if os.path.isfile(os.path.join('images', f))] + files.sort(reverse=True) + return files[0:count] + + graph = None graph = tf.get_default_graph() diff --git a/package.json b/package.json index b12112a..84fc522 100644 --- a/package.json +++ b/package.json @@ -3,6 +3,9 @@ "version": "0.1.0", "private": true, "dependencies": { + "@emotion/react": "^11.7.1", + "@emotion/styled": "^11.6.0", + "@mui/material": "^5.2.5", "@testing-library/jest-dom": "^5.11.4", "@testing-library/react": "^11.1.0", "@testing-library/user-event": "^12.1.10", @@ -10,12 +13,18 @@ "@types/node": "^12.0.0", "@types/react": "^17.0.0", "@types/react-dom": "^17.0.0", + "add": "^2.0.6", "blueimp-load-image": "^5.16.0", + "install": "^0.13.0", + "npm": "^8.3.0", "react": "^17.0.2", "react-dom": "^17.0.2", + "react-html5-camera-photo": "^1.5.5", + "react-medium-image-zoom": "^4.3.5", "react-scripts": "4.0.3", "typescript": "^4.1.2", - "web-vitals": "^1.0.1" + "web-vitals": "^1.0.1", + "yarn": "^1.22.17" }, "scripts": { "start": "react-scripts start", @@ -42,6 +51,7 @@ ] }, "devDependencies": { - "@types/blueimp-load-image": "^5.14.4" + "@types/blueimp-load-image": "^5.14.4", + "@types/react-html5-camera-photo": "^1.5.1" } } diff --git a/public/index.html b/public/index.html index 52cccdd..00ec45d 100644 --- a/public/index.html +++ b/public/index.html @@ -13,6 +13,14 @@ manifest.json provides metadata used when your web app is installed on a user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/ --> + +