Scribd
Upload
22 views

Frontend

Uploaded by

anuchandru003
Copyright
© © All Rights Reserved
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
22 views

Frontend

Uploaded by

anuchandru003
Copyright
© © All Rights Reserved
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
You are on page 1/ 6

from flask import Flask, render_template, request, redirect, url_for,

send_from_directory
from keras.models import load_model
import numpy as np
import cv2
import os
import uuid

app = Flask(__name__)

# Load your trained model


model = load_model('C:/Users/Yashu/Desktop/alzheimer_prediction/models/model.h5')

# Class names mapping


classnames = {0: 'Mild_Demented', 1: 'Moderate_Demented', 2: 'Very_Mild_Demented',
3: 'Non_Demented'}

# Create the upload folder to save uploaded images temporarily


UPLOAD_FOLDER = 'uploads/'
if not os.path.exists(UPLOAD_FOLDER):
os.makedirs(UPLOAD_FOLDER)

app.config['UPLOAD_FOLDER'] = UPLOAD_FOLDER

@app.route('/')
def index():
return render_template('index.html')

@app.route('/upload', methods=['GET', 'POST'])


def upload():
if request.method == 'POST':
file = request.files['file']
if not file or file.filename == '':
return redirect(url_for('upload'))

if not file.filename.lower().endswith(('.jpg', '.jpeg', '.png', '.gif')):


return redirect(url_for('upload'))

filename = str(uuid.uuid4()) + '_' + file.filename


filepath = os.path.join(app.config['UPLOAD_FOLDER'], filename)
file.save(filepath)

# Read and preprocess the image


img = cv2.imread(filepath)
img = cv2.cvtColor(img, cv2.COLOR_BGR2GRAY)
img = cv2.resize(img, (128, 128))
img = np.expand_dims(img, axis=-1)
img = np.expand_dims(img, axis=0)

# Normalize the image


img = img / 255.0

# Make predictions
prediction = model.predict(img)
predicted_class_index = np.argmax(prediction)
predicted_class = classnames[predicted_class_index]

return render_template('result.html', filename=filename,


predicted_class=predicted_class)
return render_template('upload.html')

@app.route('/uploads/<filename>')
def uploaded_file(filename):
return send_from_directory(app.config['UPLOAD_FOLDER'], filename)

if __name__ == '__main__':
app.run(debug=True, host='0.0.0.0', port=5000)

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Early Diagnosis of Dementia</title>

<style>
body {
margin: 0;
padding: 0;
font-family: 'Times New Roman', Times, serif;
background-image: url("{{ url_for('static', filename='app1.jpg') }}");
background-size: cover;
background-position: center;
background-repeat: no-repeat;
background-color: #f8f9fa;
height: 100vh;
overflow-x: hidden; /* Prevent horizontal scrolling */
}

.menu-icon {
position: absolute;
top: 10px;
left: 10px; /* Positioned to the left */
cursor: pointer;
padding: 10px;
background-color: #007bff; /* Blue background for the menu icon */
border-radius: 5px;
color: white; /* White text for the menu icon */
}

.sidebar {
height: 100%; /* Full height */
width: 0; /* Initially closed */
position: fixed; /* Stay in place */
top: 0; /* Start from the top */
left: 0; /* Slide in from the left */
background-color: black; /* Black background for the sidebar */
overflow-x: hidden;
transition: 0.5s; /* Smooth transition */
padding-top: 60px; /* Space for the menu icon */
}

.sidebar a, .sidebar .upload-button {


padding: 10px 15px; /* Spacing */
text-decoration: none;
font-size: 20px; /* Larger font size */
color: white; /* White text in the sidebar */
display: block; /* Make each link take full width */
transition: background-color 0.3s; /* Smooth hover effect */
}

.sidebar a:hover, .sidebar .upload-button:hover {


background-color: #333; /* Darker grey on hover */
}

.close-button {
position: absolute; /* Fixed position */
top: 20px; /* At the top */
right: 25px; /* Close to the edge */
font-size: 30px; /* Larger size */
cursor: pointer; /* Clickable */
color: white; /* White text for the close button */
}

.header {
text-align: center;
position: absolute;
top: -30px; /* Position at the top */
left: 50%; /* Center horizontally */
transform: translateX(-50%); /* Ensure proper centering */
color: white; /* Make text white */
padding: 20px;
border-radius: 10px;
background-color: rgba(0, 0, 0, 0); /* Light background for better
visibility */
}
</style>

<script>
function openSidebar() {
document.getElementById("sidebar").style.width = "250px"; /* Open the
sidebar */
}

function closeSidebar() {
document.getElementById("sidebar").style.width = "0"; /* Close the sidebar
*/
}
</script>
</head>
<body>
<!-- Menu icon for opening the sidebar -->
<div class="menu-icon" onclick="openSidebar()">☰</div>

<!-- Sidebar with black background and white text -->


<div id="sidebar" class="sidebar">
<!-- Close button for the sidebar -->
<span class="close-button" onclick="closeSidebar()">&times;</span>
<!-- Upload button redirects to the upload page -->
<a href="{{ url_for('upload') }}" class="upload-button">Upload</a>

<!-- Additional navigation links -->


<a href="#">Home</a>

</div>

<!-- Header at the top-center with white text -->


<div class="header">
<h1>EARLY DIAGNOSIS OF DEMENTIA USING DEEP LEARNING</h1>
</div>
</body>
</html>

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Upload Image for Dementia Prediction</title>
<style>
body {
font-family: Arial, sans-serif;
text-align: center;
background-image: url("{{ url_for('static',
filename='brain4.jpeg') }}");
background-size: cover;
background-position: center;
background-repeat: no-repeat;
padding-top: 50px;
}

.container {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
border: 2px solid #007bff;
border-radius: 10px;
padding: 20px;
max-width: 600px;
margin: auto;
background-color: white;
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
gap: 20px;
}

.file-input {
padding: 10px;
border: 1px solid #ccc;
border-radius: 5px;
width: 100%;
}

.submit-button {
padding: 10px 20px;
background-color: #007bff;
color: white;
text-decoration: none;
border-radius: 5px;
cursor: pointer;
border: none;
transition: background-color 0.3s ease;
width: 100%;
}

.submit-button:hover {
background-color: #0056b3;
}
</style>
</head>
<body>
<div class="container">
<h1>Upload Image for Dementia Prediction</h1>

<form action="{{ url_for('upload') }}" method="post"


enctype="multipart/form-data">
<input type="file" name="file" class="file-input" accept="image/*"
id="file-input">
<input type="submit" value="Upload" class="submit-button">
</form>
</div>
</body>
</html>

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Diagnosis Result</title>
<style>
body {
font-family: Arial, sans-serif;
text-align: center;
background-color: #f8f9fa;
padding: 20px;
background-image: url("{{ url_for('static',
filename='brain2.jpg') }}"); /* Add your background image here */
background-size: cover; /* Ensure the background image covers the
entire screen */
background-position: center; /* Center the background image */
background-repeat: no-repeat; /* Avoid repeating the background image
*/
padding-top: 50px; /* Add padding to avoid overlapping */
}
.container {
max-width: 600px;
margin: auto;
background-color:white;
padding: 20px;
border-radius: 10px;
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.1);
}
h1, h3 {
margin: 20px 0; /* Separate headings */
}
img {
border: 2px solid #ddd;
border-radius: 10px;
padding: 10px;
margin: 20px 0;
}
.upload-link {
color: #007bff;
text-decoration: none;
transition: color 0.3s ease;
}
.upload-link:hover {
color: #0056b3;
}
</style>
</head>
<body>
<div class="container">
<h1>Diagnosis Result</h1>
<h3>Uploaded Image:</h3>
<img src="{{ url_for('uploaded_file', filename=filename) }}" alt="Uploaded
Image" width="200">
<h3>Predicted Class: {{ predicted_class }}</h3>
<a class="upload-button" href="{{ url_for('upload') }}">Upload another
image</a>
</div>
</body>
</html>

You might also like