integrated

Front_End/Rp_organic/android/app/src/debug/AndroidManifest.xml

@@ -4,4 +4,5 @@
          to allow setting breakpoints, to provide hot reload, etc.
     -->
     <uses-permission android:name="android.permission.INTERNET"/>
+    <application android:usesCleartextTraffic="true" />
 </manifest>

Front_End/Rp_organic/lib/main.dart

@@ -22,7 +22,7 @@ class _WebViewWebPageState extends State<MyApp> {
       home: WillPopScope(
         onWillPop: ()async{
           String url = await controller.currentUrl();
-          if(url == "https://test-flask-research.herokuapp.com/"){
+          if(url == "http://192.168.8.105:5000"){
             return true;
           }else{
             controller.goBack();
@@ -35,7 +35,7 @@ class _WebViewWebPageState extends State<MyApp> {
             child: Container(
               child: SafeArea (
                 child: WebView(
-                  initialUrl: "https://test-flask-research.herokuapp.com/",
+                  initialUrl: "http://192.168.8.105:5000",
                   javascriptMode: JavascriptMode.unrestricted,
                   gestureNavigationEnabled: true,
                   geolocationEnabled: false,//support geolocation or not

Front_End/Rp_organic/pubspec.lock

@@ -49,7 +49,7 @@ packages:
       name: cupertino_icons
       url: "https://pub.dartlang.org"
     source: hosted
-    version: "1.0.3"
+    version: "1.0.4"
   fake_async:
     dependency: transitive
     description:
@@ -171,7 +171,7 @@ packages:
       name: process
       url: "https://pub.dartlang.org"
     source: hosted
-    version: "4.2.3"
+    version: "4.2.4"
   sky_engine:
     dependency: transitive
     description: flutter
@@ -246,7 +246,7 @@ packages:
       name: win32
       url: "https://pub.dartlang.org"
     source: hosted
-    version: "2.2.9"
+    version: "2.3.0"
   xdg_directories:
     dependency: transitive
     description:
@@ -255,5 +255,5 @@ packages:
     source: hosted
     version: "0.1.2"
 sdks:
-  dart: ">=2.13.0 <3.0.0"
+  dart: ">=2.14.0 <3.0.0"
   flutter: ">=1.22.0"

Server/app.py

+import math
+import random
 import os
 import cv2
 import mahotas as mt
@@ -6,28 +8,40 @@ from werkzeug.utils import secure_filename
 import numpy as np
 import pandas as pd
 from flask import Flask, request, redirect, url_for, send_from_directory, render_template
+from keras.preprocessing.image import ImageDataGenerator, load_img, img_to_array
 import pyrebase
 import joblib
-
+from PIL import Image
+from io import BytesIO
+from keras_preprocessing import image
+from datetime import date
+from keras.models import load_model
+import csv 
+from keras.layers import Dense, Dropout, Conv2D, MaxPooling2D, Activation, Flatten, BatchNormalization, SeparableConv2D
+from keras.models import Sequential
+from tensorflow.keras import datasets, layers, models
 #
-ALLOWED_EXTENSIONS = set(['jpg', 'jpeg', 'png'])
+ALLOWED_EXTENSIONS = set(['jpg', 'jpeg', 'png', 'JPG'])
 UPLOAD_FOLDER = 'uploads'
 
 outFileFolder = './model/'
 fileP = outFileFolder + 'org_Cu_Model.joblib'
 stdp = outFileFolder + 'std_scaler.bin'
+
     #open file
 mfile = open(fileP, "rb")
 sfile = open(stdp, "rb")
+
 #load the trained model
 model = joblib.load(mfile) 
 sc_X = joblib.load(sfile)
+model1 = load_model('imgClassification.h5')
 
 def allowed_file(filename):
     return '.' in filename and \
            filename.rsplit('.', 1)[1] in ALLOWED_EXTENSIONS
 
-
+# Background remove image for classify organic inorganic
 def bg_sub(file):
     main_img  = cv2.imread(file)
     img = cv2.cvtColor(main_img, cv2.COLOR_BGR2RGB)
@@ -69,8 +83,8 @@ def bg_sub(file):
                 final_img[y,x] = white_pix
     return final_img
 
+# feature extraction for classify organic inorganic
 def feature_extract(img):  
-
     #Preprocessing
     gs = cv2.cvtColor(img,cv2.COLOR_RGB2GRAY)
     blur = cv2.GaussianBlur(gs, (25,25),0)
@@ -127,6 +141,7 @@ def feature_extract(img):
     return df_temp           
 #
 
+# firebase configuration
 config = {
 	"apiKey": "AIzaSyDbGBvceqiGUB-iPJN7AXXS-AyUx80cg6s",
     "authDomain": "esp32ndvi.firebaseapp.com",
@@ -142,11 +157,12 @@ firebase = pyrebase.initialize_app(config)
 
 db = firebase.database()
 
-app = Flask(__name__)
 #
+app = Flask(__name__)
 app.config['UPLOAD_FOLDER'] = UPLOAD_FOLDER
 #
 
+# route for ndvi page
 @app.route('/ndvi', methods=['GET','POST'])
 def basic():
 	if request.method == 'POST':
@@ -173,11 +189,12 @@ def refresh(device_name):
     val_nir = dict_ndvi['nir']
     return render_template('orangeNdvi.html', n = val_ndvi , v = val_vis, r = val_nir ,key = ndvi.key(), conn = " Connected" )
     
-
+# Home 
 @app.route('/')
 def home():
 	    return render_template('client.html')
 
+# Cucumber classification
 @app.route("/cucumber")
 def template_test():
     return render_template('cucumberOrg.html', label='', imagesource='')
@@ -196,9 +213,17 @@ def upload_file():
             featuresOfimg = feature_extract(bg_remove_img)
             scaled_feature = sc_X.transform(featuresOfimg)
             print(scaled_feature)
-            output = model.predict_proba(scaled_feature)[0]
-            out = {'Organic:': output[0], 'Inorganic': output[1]}
-    return render_template("cucumberOrg.html", label=output, imagesource=file_path)
+            output = model.predict_proba(scaled_feature)
+            vx = output.reshape(-1,1)
+            org = round(vx[0][0], 2)*100
+            inor = round(vx[1][0], 2)*100
+
+            if( org >= 50):
+                p = "Organic"
+            else:
+                p = "Inorganic"
+
+    return render_template("cucumberOrg.html",pred1 = p, labelOrg=org,labelIno=inor, imagesource=file_path)
 
 #
 @app.route('/uploads/<filename>')
@@ -207,6 +232,251 @@ def uploaded_file(filename):
                                filename)
 #
 
+#Giwi
+
+@app.route("/classify", methods = ["POST"])
+def classify():
+    image_path = "https://static9.depositphotos.com/1628352/1107/i/600/depositphotos_11071200-stock-photo-cabbage.jpg"
+    class_names = ['banana', 'cabbage', 'cucumber', 'mango', 'orange', 'tomato']
+    img = Image.open(BytesIO(request.urlopen(image_path).read())).resize((224, 224))
+    # img = image.load_img(request.urlopen(image_path), target_size=(224,224,3))
+    x = image.img_to_array(img)
+    x = np.expand_dims(x, axis=0)
+    images = np.vstack([x])
+    pred = model1.predict(images, batch_size=6)
+    label = np.argmax(pred, axis=1)
+    out = class_names[np.argmax(pred)]
+    return render_template("predi.html", prediction_text_class = out)
+
+@app.route("/price", methods = ["POST"])
+def price():
+    today = date.today()
+    dt = today.strftime("%d/%m/%Y")
+    image_path = "http://192.168.8.103/capture?_cb=1634477807414"
+    wt = random.randint(380, 560)
+    class_names = ['banana', 'cabbage', 'cucumber', 'mango', 'orange', 'tomato']
+    img = Image.open(BytesIO(request.urlopen(image_path).read())).resize((224, 224))
+    # img = image.load_img(request.urlopen(image_path), target_size=(224,224,3))
+    x = image.img_to_array(img)
+    x = np.expand_dims(x, axis=0)
+    images = np.vstack([x])
+    pred = model1.predict(images, batch_size=6)
+    label = np.argmax(pred, axis=1)
+    out = class_names[np.argmax(pred)]
+
+
+    with open('data/Predict_vegetable_2021_SL.csv', encoding="utf8") as f:
+        csv_reader = csv.DictReader(f)
+        next(csv_reader)
+
+        for line in csv_reader:
+
+            if line['date'] == dt and line['item'] == out:
+                para = line['price']
+                print(line['price'])
+
+
+    return render_template("resultsPrice.html", vegita = out, dte = dt, price = para, weight = wt, esti = math.trunc(int(para) * int(wt) / 1000))
+
+
+@app.route("/priceC", methods = ["POST"])
+def priceC():
+    if request.method == 'POST':
+        # check if the post request has the file part
+        if 'file' not in request.files:
+            flash('No file part')
+            return redirect(request.url)
+        file = request.files['file']
+        # if user does not select file, browser also
+        # submit an empty part without filename
+        if file.filename == '':
+            flash('No selected file')
+            return redirect(request.url)
+        if file and allowed_file(file.filename):
+            filename = secure_filename(file.filename)
+
+            print(filename)
+            image_path = filename
+            print("workinggggg")
+            today = date.today()
+            wt = random.randint(380, 560)
+            dt = today.strftime("%d/%m/%Y")
+            class_names = ['banana', 'cabbage', 'cucumber', 'mango', 'orange', 'tomato']
+            img = image.load_img(image_path, target_size=(224,224,3))
+    # img = image.load_img(request.urlopen(image_path), target_size=(224,224,3))
+            x = image.img_to_array(img)
+            x = np.expand_dims(x, axis=0)
+            images = np.vstack([x])
+            pred = model1.predict(images, batch_size=6)
+            label = np.argmax(pred, axis=1)
+            out = class_names[np.argmax(pred)]
+
+
+            with open('data/Predict_vegetable_2021_SL.csv', encoding="utf8") as f:
+                csv_reader = csv.DictReader(f)
+                next(csv_reader)
+
+                for line in csv_reader:
+
+                    if line['date'] == dt and line['item'] == out:
+                        para = line['price']
+                        print(line['price'])
+
+
+            return render_template("resultsPrice.html", vegita = out, dte = dt, price = para, weight = wt, esti = math.trunc(int(para) * int(wt) / 1000))
+
+# Sethma
+# Disease recognition
+IMAGE_SIZE = (224, 224)
+img2 = load_model('model/diseases_model3.h5')
+
+
+
+def predict(file):
+   img  = load_img(file, target_size=IMAGE_SIZE)
+   img = img_to_array(img)/255.0
+   img = np.expand_dims(img, axis=0)
+   probs = img2.predict(img)[0]
+    #output = {'Healthy' : probs[0],'Sigatoka': probs[1]} 
+    #healthy = probs[0]*100
+    #sigatoka = probs[1]*100
+   output = {probs[0],probs[1]} 
+    
+   return probs
+
+
+
+@app.route('/', methods=['GET', 'POST'])
+def upload_desease_file():
+    if request.method == 'POST':
+        file = request.files['file']
+        if file and allowed_file(file.filename):
+            filename = secure_filename(file.filename)
+            file_path = os.path.join(app.config['UPLOAD_FOLDER'], filename)
+            file.save(file_path)
+            output = predict(file_path)
+           # output = {probs[0],probs[1]} 
+            healthy = output[0]*100
+            sigatoka = output[1]*100
+            
+           
+    return render_template("disease.html", label1=healthy,label2=sigatoka, imagesource=file_path)
+
+# Lahiru(Quality & freshness annalysis)
+
+
+@app.route('/predict/<weight>/<pathss>')
+def predict(weight, pathss):
+
+    pic1 = "/static/img/" + pathss
+    path2 = "static/img/" + pathss
+
+    model = models.Sequential()
+
+    new_model = load_model('model/fruitType.h5')
+
+    img = cv2.imread(
+        path2, 1)
+    img = cv2.resize(img, (50, 50))
+    img = np.reshape(img, [1, 50, 50, 3])
+    predicted_value = np.argmax(model.predict(img))
+    print(model.predict(img))
+    type = ""
+    if predicted_value == 0:
+        type = "BANANA"
+    elif predicted_value == 1:
+        type = "TOMATO"
+    else:
+        type = "cant predict"
+
+    model = Sequential()
+    model.add(Conv2D(32, (3, 3), kernel_initializer='he_uniform',
+                     padding='same', activation='relu', input_shape=(100, 100, 3)))
+    model.add(BatchNormalization())
+    model.add(SeparableConv2D(32, (3, 3), kernel_initializer='he_uniform',
+                              padding='same', activation='relu'))
+    model.add(MaxPooling2D((2, 2)))
+    model.add(BatchNormalization())
+    model.add(Dropout(0.3))
+
+    model.add(SeparableConv2D(64, (3, 3), kernel_initializer='he_uniform',
+                              padding='same', activation='relu'))
+    model.add(SeparableConv2D(64, (3, 3), kernel_initializer='he_uniform',
+                              padding='same', activation='relu'))
+    model.add(BatchNormalization())
+    model.add(MaxPooling2D((2, 2)))
+    model.add(Dropout(0.4))
+
+    model.add(Conv2D(128, (3, 3), kernel_initializer='he_uniform',
+                     padding='same', activation='relu'))
+
+    model.add(Conv2D(128, (3, 3), kernel_initializer='he_uniform',
+                     padding='same', activation='relu'))
+    model.add(BatchNormalization())
+    model.add(MaxPooling2D((2, 2)))
+    model.add(Dropout(0.5))
+
+    model.add(Flatten())
+
+    model.add(Dense(128, activation='relu', kernel_initializer='he_uniform'))
+    model.add(Dropout(0.3))
+    if type == "BANANA":
+        model.add(Dense(1, activation='sigmoid'))
+        new_model = load_model(
+            'model/Banana.h5')
+    else:
+        model.add(Dense(1, activation='sigmoid'))
+        new_model = load_model(
+            'model/Tomato.h5')
+
+    imge = cv2.imread(
+        path2, 1)
+    imge = cv2.cvtColor(imge, cv2.COLOR_BGR2RGB)
+    imge = cv2.resize(imge, (100, 100))
+    imge = np.reshape(imge, [1, 100, 100, 3])
+    imge = np.array(imge).astype('float32')/255
+    predicted_value = model.predict_classes(imge)
+    print(predicted_value)
+    print(model.predict(imge))
+
+    outputs = ""
+    if type == "BANANA":
+        if predicted_value == 0:
+            outputs = "Fresh Banana"
+        elif predicted_value == 1:
+            outputs = "Rotten Banana"
+        else:
+            outputs = "Cant predict"
+
+    else:
+        if predicted_value == 0:
+            outputs = "Fresh Tomato"
+        elif predicted_value == 1:
+            outputs = "Rotten Tomato"
+        else:
+            outputs = "Cant predict"
+
+    gram = 0.0
+    quality = ""
+    size = ""
+    weight1 = float(weight)
+
+    gram = weight1 * 1000
+
+    if gram < 114:
+        size = "Small"
+        quality = "Grade A"
+    elif gram < 151:
+        size = "Medium"
+        quality = "Grade B"
+    elif gram > 151:
+        size = "Large"
+        quality = "Grade C"
+    else:
+        size = "Cant predict"
+
+    return render_template("predict.html", Predicted=outputs, type=type, weight=gram, sizee=size, qualityy=quality, paths=pic1)
+
 
 if __name__ == '__main__':
-    app.run(debug=True)
\ No newline at end of file
+     app.run(debug=True , host = '192.168.1.100')
\ No newline at end of file

Server/data/Predict_vegetable_2021_SL.csv

+date,item,price
+16/10/2021,banana,97
+16/10/2021,mango,46
+16/10/2021,orange,64
+16/10/2021,cabbage,110
+16/10/2021,cucumber,92
+16/10/2021,tomato,122
+17/10/2021,banana,101
+17/10/2021,mango,54
+17/10/2021,orange,62
+17/10/2021,cabbage,135
+17/10/2021,cucumber,98
+17/10/2021,tomato,115
+18/10/2021,banana,98
+18/10/2021,mango,51
+18/10/2021,orange,62
+18/10/2021,cabbage,101
+18/10/2021,cucumber,82
+18/10/2021,tomato,77
+19/10/2021,banana,94
+19/10/2021,mango,66
+19/10/2021,orange,82
+19/10/2021,cabbage,114
+19/10/2021,cucumber,90
+19/10/2021,tomato,63
+20/10/2021,banana,54
+20/10/2021,mango,35
+20/10/2021,orange,75
+20/10/2021,cabbage,94
+20/10/2021,cucumber,82
+20/10/2021,tomato,90
+21/10/2021,banana,98
+21/10/2021,mango,51
+21/10/2021,orange,62
+21/10/2021,cabbage,101
+21/10/2021,cucumber,82
+21/10/2021,tomato,77
+22/10/2021,banana,89
+22/10/2021,mango,53
+22/10/2021,orange,77
+22/10/2021,cabbage,90
+22/10/2021,cucumber,85
+22/10/2021,tomato,96
+23/10/2021,banana,95
+23/10/2021,mango,59
+23/10/2021,orange,82
+23/10/2021,cabbage,99
+23/10/2021,cucumber,84
+23/10/2021,tomato,97
+24/10/2021,banana,94
+24/10/2021,mango,66
+24/10/2021,orange,82
+24/10/2021,cabbage,114
+24/10/2021,cucumber,90
+24/10/2021,tomato,63
+25/10/2021,banana,98
+25/10/2021,mango,51
+25/10/2021,orange,62
+25/10/2021,cabbage,101
+25/10/2021,cucumber,82
+25/10/2021,tomato,77
+26/10/2021,banana,89
+26/10/2021,mango,53
+26/10/2021,orange,77
+26/10/2021,cabbage,90
+26/10/2021,cucumber,85
+26/10/2021,tomato,96
+27/10/2021,banana,94
+27/10/2021,mango,66
+27/10/2021,orange,82
+27/10/2021,cabbage,114
+27/10/2021,cucumber,90
+27/10/2021,tomato,63
+28/10/2021,banana,98
+28/10/2021,mango,51
+28/10/2021,orange,62
+28/10/2021,cabbage,101
+28/10/2021,cucumber,82
+28/10/2021,tomato,77
+29/10/2021,banana,89
+29/10/2021,mango,53
+29/10/2021,orange,77
+29/10/2021,cabbage,90
+29/10/2021,cucumber,85
+29/10/2021,tomato,96
+30/10/2021,banana,94
+30/10/2021,mango,66
+30/10/2021,orange,82
+30/10/2021,cabbage,114
+30/10/2021,cucumber,90
+30/10/2021,tomato,63

Server/templates/client.html

@@ -111,21 +111,21 @@
                 </div>
                 <h3 class="card-title mb-3">Diseases</h3>
                 
-                <form action="/">
-                  <input class="btn btn-primary" type="file" id="img" name="img" accept="image/*">
+                <form action="/" method=post enctype=multipart/form-data>
+                  <input class="btn btn-primary" id="img" type=file name=file>
                   <br>
                   <br>
-                  <button data-bs-toggle="modal"
-                  data-bs-target="#diseases" class="btn btn-warning">Check with choosed image</button>
+                  <button class="btn btn-warning" type=submit>Check with choosed image</button>
                 </form>
 
                 or
                 <br>
                 <button data-bs-toggle="modal"
-                  data-bs-target="#diseases" class="btn btn-success">Check with captured image</button>
+                  data-bs-target="#diseases" class="btn btn-success" >Check with captured image</button>
               </div>
             </div>
           </div>
+
           <div class="col-md">
             <div class="card bg-dark text-light">
               <div class="card-body text-center">
@@ -144,8 +144,7 @@
 
                 or
                 <br>
-                <button data-bs-toggle="modal"
-                  data-bs-target="#quality" class="btn btn-success">Check with captured image</button>
+                <a href="http://192.168.1.2/" class="btn btn-success">Check with captured image</a>
               </div>
 
 
@@ -160,7 +159,7 @@
                 <h3 class="card-title mb-3">Price</h3>
                                
                 <form action="#"method="post">
-                  <input class="btn btn-primary" type="file" id="img" name="img" accept="image/*">
+                  <input class="btn btn-primary" type="file" id="img" name="img" accept="image/*" >
                   <br>
                   <br>
                   <button type="submit" data-bs-toggle="modal"
@@ -236,8 +235,9 @@
             <div class="card bg-light">
               <div class="card-body text-center">
                 <img
-                  src="https://randomuser.me/api/portraits/men/11.jpg"
+                  src="{{ url_for('static',filename='img/f1.png') }}"
                   class="rounded-circle mb-3"
+                  style="width: 75%;"
                   alt=""
                 />
                 <h3 class="card-title mb-3">Giwantha Wijekoon</h3>
@@ -257,8 +257,9 @@
             <div class="card bg-light">
               <div class="card-body text-center">
                 <img
-                  src="https://randomuser.me/api/portraits/men/12.jpg"
+                  src="{{ url_for('static',filename='img/f2.png') }}"
                   class="rounded-circle mb-3"
+                  style="width: 75%;"
                   alt=""
                 />
                 <h3 class="card-title mb-3">Lakshan Wijewardane</h3>
@@ -278,8 +279,9 @@
             <div class="card bg-light">
               <div class="card-body text-center">
                 <img
-                  src="https://randomuser.me/api/portraits/men/12.jpg"
+                  src="{{ url_for('static',filename='img/f4.png') }}"
                   class="rounded-circle mb-3"
+                  style="width: 75%;"
                   alt=""
                 />
                 <h3 class="card-title mb-3">Lahiru Sanka Kumara</h3>
@@ -299,8 +301,9 @@
             <div class="card bg-light">
               <div class="card-body text-center">
                 <img
-                  src="https://randomuser.me/api/portraits/women/12.jpg"
+                  src="{{ url_for('static',filename='img/f3.png') }}"
                   class="rounded-circle mb-3"
+                  style="width: 75%;"
                   alt=""
                 />
                 <h3 class="card-title mb-3">Sethma Wattegedara</h3>

Server/templates/cucumberOrg.html

@@ -145,7 +145,7 @@
                           {% if imagesource %}
                           <img
                             src="{{imagesource}}"
-                            style="width: 500px;"
+                            id="imagecu"
                             alt=""
                           />
                           {% endif %}
@@ -176,7 +176,7 @@
                           {% else %}
                           <img
                             src="{{ url_for('static',filename='img/wrong.gif') }}"
-                            style="width: 100px;"
+                            style="width: 50px;"
                             alt=""
                           />
                           <h5 class="card-title mb-3">Its {{pred1}}</h5>
@@ -218,9 +218,10 @@
             <div class="card bg-light">
               <div class="card-body text-center">
                 <img
-                  src="https://randomuser.me/api/portraits/men/11.jpg"
-                  class="rounded-circle mb-3"
-                  alt=""
+                src="{{ url_for('static',filename='img/f1.png') }}"
+                class="rounded-circle mb-3"
+                style="width: 75%;"
+                alt=""
                 />
                 <h3 class="card-title mb-3">Giwantha Wijekoon</h3>
                 <p class="card-text">
@@ -239,9 +240,10 @@
             <div class="card bg-light">
               <div class="card-body text-center">
                 <img
-                  src="https://randomuser.me/api/portraits/men/12.jpg"
-                  class="rounded-circle mb-3"
-                  alt=""
+                src="{{ url_for('static',filename='img/f2.png') }}"
+                class="rounded-circle mb-3"
+                style="width: 75%;"
+                alt=""
                 />
                 <h3 class="card-title mb-3">Lakshan Wijewardane</h3>
                 <p class="card-text">
@@ -260,9 +262,10 @@
             <div class="card bg-light">
               <div class="card-body text-center">
                 <img
-                  src="https://randomuser.me/api/portraits/men/12.jpg"
-                  class="rounded-circle mb-3"
-                  alt=""
+                src="{{ url_for('static',filename='img/f4.png') }}"
+                class="rounded-circle mb-3"
+                style="width: 75%;"
+                alt=""
                 />
                 <h3 class="card-title mb-3">Lahiru Sanka Kumara</h3>
                 <p class="card-text">
@@ -281,9 +284,10 @@
             <div class="card bg-light">
               <div class="card-body text-center">
                 <img
-                  src="https://randomuser.me/api/portraits/women/12.jpg"
-                  class="rounded-circle mb-3"
-                  alt=""
+                src="{{ url_for('static',filename='img/f3.png') }}"
+                class="rounded-circle mb-3"
+                style="width: 75%;"
+                alt=""
                 />
                 <h3 class="card-title mb-3">Sethma Wattegedara</h3>
                 <p class="card-text">

Server/templates/disease.html

+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <link
+      href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/css/bootstrap.min.css"
+      rel="stylesheet"
+      integrity="sha384-+0n0xVW2eSR5OomGNYDnhzAbDsOXxcvSN1TPprVMTNDbiYZCxYbOOl7+AMvyTG2x"
+      crossorigin="anonymous"
+    />
+    <link
+      rel="stylesheet"
+      href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.3.0/font/bootstrap-icons.css"
+    />
+    <link
+      href="https://api.mapbox.com/mapbox-gl-js/v2.1.1/mapbox-gl.css"
+      rel="stylesheet"
+    />
+    <link rel="stylesheet" href="{{ url_for('static',filename='css/style.css') }}" />
+    <title>OrgiCheck</title>
+  </head>
+  <body>
+    <!-- Navbar -->
+  
+    <nav class="navbar navbar-expand-lg bg-dark navbar-dark py-3 fixed-top">
+      <div class="container">
+        <a href="/" class="navbar-brand"> <img src="{{ url_for('static',filename='img/orgicheck lolgomini.png') }}" style="height: 3rem;" alt="logo" /></a>
+
+
+        <button
+          class="navbar-toggler"
+          type="button"
+          data-bs-toggle="collapse"
+          data-bs-target="#navmenu"
+        >
+          <span class="navbar-toggler-icon"></span>
+        </button>
+
+        <div class="collapse navbar-collapse" id="navmenu">
+          <ul class="navbar-nav ms-auto">
+            <li class="nav-item">
+              <a href="#cam" class="nav-link">Device Connection</a>
+            </li>
+            <li class="nav-item">
+              <a href="#team" class="nav-link">Team</a>
+            </li>
+          </ul>
+        </div>
+      </div>
+    </nav>
+
+    <!-- Showcase -->
+    <section
+      class="bg-dark text-light p-5 p-lg-0 pt-lg-5 text-center text-sm-start"
+    >
+      <div class="container">
+        <div class="d-sm-flex align-items-center justify-content-between">
+          <div>
+            <h1>Check your Veggies and Fruits with <span class="text-warning"> OrgiCheck&trade; Smart</span></h1>
+            <p class="lead my-4">
+              Our utmost aim is to help our community to explore the real status of the fruits and vegetables that they are consuming. Use <span class="text-warning"> OrgiCheck&trade; Smart</span> 
+              to check whether you are paying real value of vegetable and fruits.
+            </p>
+            <a href="#check" class="btn btn-success btn-lg">
+              Get Start
+            </a>
+            <!-- <button
+              class="btn btn-success btn-lg"
+              data-bs-toggle="modal"
+              data-bs-target="#enroll"
+            >
+              Get Start
+            </button> -->
+          </div>
+          <img
+            class="img-fluid w-25 d-none d-sm-block"
+            src="{{ url_for('static',filename='img/orgicheck lolgo.png') }}"
+            alt=""
+          />
+        </div>
+      </div>
+      <br>
+      <br><br>
+    </section>
+
+    <!-- Newsletter -->
+    <section class="bg-success text-light p-5">
+      <div class="container">
+        <div class="d-md-flex justify-content-between align-items-center">
+          <h4 class="mb-3 mb-md-0">Subscribe Our Newsletter and stand a chance to win <span class="text-warning"> OrgiCheck&trade; Smart</span></h4>
+
+          <div class="input-group news-input">
+            <input type="text" class="form-control" placeholder="Enter Email" />
+            <button class="btn btn-dark btn-lg" type="button">Submit</button>
+          </div>
+        </div>
+      </div>
+    </section>
+    <section>
+        <div class="d-flex justify-content-center">
+ 
+         <p style="margin-bottom:4cm;"></p>
+       
+        <div class="row">
+            <div class="col-lg-4">
+              <div class="page-header">
+                 <h3>     </h3> 
+                <h3 id="tables">Result</h3>
+              </div>
+              <div class="bs-component">
+                <img width="400" height="400" src="{{imagesource}}" /> 
+                <table class="table table-hover">
+                    <tr class="table-active">
+                      <!-- <th scope="col">Image</th> -->
+                      <th scope="col">Predict</th>
+                    </tr>
+                    <tr>
+                     
+                        <th scope="row">Leaf Type</th>
+                        <th scope="row">Accuracy</th>
+    
+                     
+                                 
+                      </tr>
+                      <tr>
+                                                     
+                        <td> Healthy              : </td>
+                        <td> {{label1 }} </td>
+                        
+                      
+                      </tr>
+                      <tr>
+                        <td> Sigatoka Disease     :</td>
+                        <td><i> {{label2 }}</i></td>
+    
+                      </tr>
+    
+    
+                </table> 
+            </div>
+          </div>
+            </div>
+          </div>
+    
+          <p>     </p>
+          <p>    </p>
+          <p>     </p>
+          <p>     </p>
+          <p>     </p>
+          <p>     </p>
+          <p>     </p>
+          <p>     </p>
+          <p>     </p>
+          <p>     </p>
+          <p>     </p>
+        </div>
+        </section>
+       
+
+   <!-- Check Sections -->
+   <section id="cam" class="p-5 bg-dark text-light">
+    <div class="container">
+      <div class="row align-items-center justify-content-between">
+        <div class="col-md">
+          <img id="stream" src="{{ url_for('static',filename='img/orgicheck lolgo.png') }}" class="img-fluid" alt=""/>
+          <script>
+              const img = document.querySelector('#stream');
+              const WS_URL = 'ws:///192.168.8.105:8888';
+              const ws = new WebSocket(WS_URL);
+              let urlObject;
+              ws.onopen = () => console.log(`Connected to ${WS_URL}`);
+              ws.onmessage = message => {
+                  const arrayBuffer = message.data;
+                  if(urlObject){
+                      URL.revokeObjectURL(urlObject);
+                  }
+                  urlObject = URL.createObjectURL(new Blob([arrayBuffer]));
+                  img.src = urlObject;
+              }
+          </script>
+        </div>
+        <div class="col-md p-5">
+          <h2>Device Connection</h2>
+          <p>
+            Please connect your <span class="text-warning"> OrgiCheck&trade; Smart</span> with the same network
+          </p>
+          <a href="#" class="btn btn-light mt-3">
+            <i class="bi bi-chevron-right"></i> Learn More
+          </a>
+        </div>
+      </div>
+    </div>
+  </section>
+
+  <section id="team" class="p-5 bg-success">
+    <div class="container">
+      <h2 class="text-center text-white">Our Team</h2>
+      <p class="lead text-center text-white mb-5">
+        The team behind <span class="text-warning"> OrgiCheck&trade; Smart</span>
+      </p>
+      <div class="row g-4">
+        <div class="col-md-6 col-lg-3">
+          <div class="card bg-light">
+            <div class="card-body text-center">
+              <img
+                src="{{ url_for('static',filename='img/f1.png') }}"
+                class="rounded-circle mb-3"
+                style="width: 75%;"
+                alt=""
+              />
+              <h3 class="card-title mb-3">Giwantha Wijekoon</h3>
+              <p class="card-text">
+                Lorem ipsum dolor sit amet consectetur adipisicing elit.
+                Assumenda accusamus nobis sed cupiditate iusto? Quibusdam.
+              </p>
+              <a href="#"><i class="bi bi-twitter text-dark mx-1"></i></a>
+              <a href="#"><i class="bi bi-facebook text-dark mx-1"></i></a>
+              <a href="#"><i class="bi bi-linkedin text-dark mx-1"></i></a>
+              <a href="#"><i class="bi bi-instagram text-dark mx-1"></i></a>
+            </div>
+          </div>
+        </div>
+
+        <div class="col-md-6 col-lg-3">
+          <div class="card bg-light">
+            <div class="card-body text-center">
+              <img
+                src="{{ url_for('static',filename='img/f2.png') }}"
+                class="rounded-circle mb-3"
+                style="width: 75%;"
+                alt=""
+              />
+              <h3 class="card-title mb-3">Lakshan Wijewardane</h3>
+              <p class="card-text">
+                Lorem ipsum dolor sit amet consectetur adipisicing elit.
+                Assgnn hnhnnj
+              </p>
+              <a href="#"><i class="bi bi-twitter text-dark mx-1"></i></a>
+              <a href="#"><i class="bi bi-facebook text-dark mx-1"></i></a>
+              <a href="#"><i class="bi bi-linkedin text-dark mx-1"></i></a>
+              <a href="#"><i class="bi bi-instagram text-dark mx-1"></i></a>
+            </div>
+          </div>
+        </div>
+
+        <div class="col-md-6 col-lg-3">
+          <div class="card bg-light">
+            <div class="card-body text-center">
+              <img
+                src="{{ url_for('static',filename='img/f4.png') }}"
+                class="rounded-circle mb-3"
+                style="width: 75%;"
+                alt=""
+              />
+              <h3 class="card-title mb-3">Lahiru Sanka Kumara</h3>
+              <p class="card-text">
+                Lorem ipsum dolor sit amet consectetur adipisicing elit.
+                Assumenda accusamus nobis sed cupiditate iusto? Quibusdam.
+              </p>
+              <a href="#"><i class="bi bi-twitter text-dark mx-1"></i></a>
+              <a href="#"><i class="bi bi-facebook text-dark mx-1"></i></a>
+              <a href="#"><i class="bi bi-linkedin text-dark mx-1"></i></a>
+              <a href="#"><i class="bi bi-instagram text-dark mx-1"></i></a>
+            </div>
+          </div>
+        </div>
+
+        <div class="col-md-6 col-lg-3">
+          <div class="card bg-light">
+            <div class="card-body text-center">
+              <img
+                src="{{ url_for('static',filename='img/f3.png') }}"
+                class="rounded-circle mb-3"
+                style="width: 75%;"
+                alt=""
+              />
+              <h3 class="card-title mb-3">Sethma Wattegedara</h3>
+              <p class="card-text">
+                Lorem ipsum dolor sit amet consectetur adipisicing elit.
+                Assumenda accusamus nobis sed cupiditate iusto? Quibusdam.
+              </p>
+              <a href="#"><i class="bi bi-twitter text-dark mx-1"></i></a>
+              <a href="#"><i class="bi bi-facebook text-dark mx-1"></i></a>
+              <a href="#"><i class="bi bi-linkedin text-dark mx-1"></i></a>
+              <a href="#"><i class="bi bi-instagram text-dark mx-1"></i></a>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </section>
+
+  <!-- Contact & Map -->
+  <section class="p-5">
+    <div class="container">
+      <div class="row g-4">
+        <div class="col-md">
+          <h2 class="text-center mb-4">Contact Info</h2>
+          <ul class="list-group list-group-flush lead">
+            <li class="list-group-item">
+              <span class="fw-bold">Main Location:</span> 50 Main st Malabe
+            </li>
+            <li class="list-group-item">
+              <span class="fw-bold">Phone No:</span> (+94) 11-5555-555
+            </li>
+            <li class="list-group-item">
+              <span class="fw-bold">WhatsApp No:</span> (+94) 11-5555-555
+            </li>
+            <li class="list-group-item">
+              <span class="fw-bold">Email:</span>
+              info@orgicheck.com
+            </li>
+          </ul>
+        </div>
+        <div class="col-md">
+          <div id="map"></div>
+        </div>
+      </div>
+    </div>
+  </section>
+
+  <!-- Footer -->
+  <footer class="p-5 bg-dark text-white text-center position-relative">
+    <div class="container">
+      <p class="lead">Copyright &copy; 2021 OrgiCheck</p>
+
+      <a href="#" class="position-absolute bottom-0 end-0 p-5">
+        <i class="bi bi-arrow-up-circle h1"></i>
+      </a>
+    </div>
+  </footer>
+
+      <!-- Modal for Organic -->
+      <div
+      class="modal fade"
+      id="organic"
+      tabindex="-1"
+      aria-labelledby="enrollLabel"
+      aria-hidden="true"
+    >
+      <div class="modal-dialog">
+        <div class="modal-content">
+          <div class="modal-header">
+            <h5 class="modal-title" id="enrollLabel">Organic</h5>
+            <button
+              type="button"
+              class="btn-close"
+              data-bs-dismiss="modal"
+              aria-label="Close"
+            ></button>
+          </div>
+          <div class="modal-body">
+            <p class="lead">eqggggggggg</p>
+            <form>
+              <div class="mb-3">
+                <label class="col-form-label">
+                  grgggggggg
+                </label>
+                <label class="col-form-label">
+                  grrrrrrr
+                </label>
+              </div>
+              <div class="mb-3">
+                <label class="col-form-label">rwg</label>
+                <label class="col-form-label">
+                  500g
+                </label>
+              </div>
+              <div class="mb-3">
+                <label class="col-form-label">wrwrgwrg:</label>
+                <label class="col-form-label">LKR. 80.00</label>
+              </div>
+              <div class="mb-3">
+                <label class="col-form-label">eqqqqqqqqqq:</label>
+                <label class="col-form-label">LKR. 40.00</label>
+              </div>
+            </form>
+          </div>
+          <div class="modal-footer">
+            <button
+              type="button"
+              class="btn btn-danger"
+              data-bs-dismiss="modal"
+            >
+              Close
+            </button>
+          </div>
+        </div>
+      </div>
+    </div>
+
+      <!-- Modal for Diseases -->
+      <div
+      class="modal fade"
+      id="diseases"
+      tabindex="-1"
+      aria-labelledby="enrollLabel"
+      aria-hidden="true"
+    >
+      <div class="modal-dialog">
+        <div class="modal-content">
+          <div class="modal-header">
+            <h5 class="modal-title" id="enrollLabel">Diseases</h5>
+            <button
+              type="button"
+              class="btn-close"
+              data-bs-dismiss="modal"
+              aria-label="Close"
+            ></button>
+          </div>
+          <div class="modal-body">
+            <p class="lead">bvbvbhbvhbhv</p>
+            <form>
+              <div class="mb-3">
+                <label class="col-form-label">
+                  veeweee
+                </label>
+                <label class="col-form-label">
+                  qeveqeqeq
+                </label>
+              </div>
+              <div class="mb-3">
+                <label class="col-form-label">Aveeeve</label>
+                <label class="col-form-label">
+                  vewv 
+                </label>
+              </div>
+              <div class="mb-3">
+                <label class="col-form-label">wwwwwww:</label>
+                <label class="col-form-label">vvvvvvvv</label>
+              </div>
+              <div class="mb-3">
+                <label class="col-form-label">wwwwwwww</label>
+                <label class="col-form-label">LKR. 40.00</label>
+              </div>
+            </form>
+          </div>
+          <div class="modal-footer">
+            <button
+              type="button"
+              class="btn btn-danger"
+              data-bs-dismiss="modal"
+            >
+              Close
+            </button>
+          </div>
+        </div>
+      </div>
+    </div>
+
+      <!-- Modal for Quality -->
+      <div
+      class="modal fade"
+      id="quality"
+      tabindex="-1"
+      aria-labelledby="enrollLabel"
+      aria-hidden="true"
+    >
+      <div class="modal-dialog">
+        <div class="modal-content">
+          <div class="modal-header">
+            <h5 class="modal-title" id="enrollLabel">Quality</h5>
+            <button
+              type="button"
+              class="btn-close"
+              data-bs-dismiss="modal"
+              aria-label="Close"
+            ></button>
+          </div>
+          <div class="modal-body">
+            <p class="lead">ggggggggggggg</p>
+            <form>
+              <div class="mb-3">
+                <label class="col-form-label">
+                  grgrgeh: 
+                </label>
+                <label class="col-form-label">
+                  Mahehengo
+                </label>
+              </div>
+              <div class="mb-3">
+                <label class="col-form-label">wjtje:</label>
+                <label class="col-form-label">
+                  500g
+                </label>
+              </div>
+              <div class="mb-3">
+                <label class="col-form-label">rwhwhrhr:</label>
+                <label class="col-form-label">wrgttfbht</label>
+              </div>
+              <div class="mb-3">
+                <label class="col-form-label">egwgwg</label>
+                <label class="col-form-label">522</label>
+              </div>
+            </form>
+          </div>
+          <div class="modal-footer">
+            <button
+              type="button"
+              class="btn btn-danger"
+              data-bs-dismiss="modal"
+            >
+              Close
+            </button>
+          </div>
+        </div>
+      </div>
+    </div>
+
+  <!-- Modal for Price -->
+  <div
+    class="modal fade"
+    id="price"
+    tabindex="-1"
+    aria-labelledby="enrollLabel"
+    aria-hidden="true"
+  >
+    <div class="modal-dialog">
+      <div class="modal-content">
+        <div class="modal-header">
+          <h5 class="modal-title" id="enrollLabel">Price Prediction</h5>
+          <button
+            type="button"
+            class="btn-close"
+            data-bs-dismiss="modal"
+            aria-label="Close"
+          ></button>
+        </div>
+        <div class="modal-body">
+          <p class="lead">Estimated Price for scanned item</p>
+          <form>
+            <div class="mb-3">
+              <label class="col-form-label">
+                Detected Item: 
+              </label>
+              <label class="col-form-label">
+                Mango
+              </label>
+            </div>
+            <div class="mb-3">
+              <label class="col-form-label">Approximate Weight:</label>
+              <label class="col-form-label">
+                500g
+              </label>
+            </div>
+            <div class="mb-3">
+              <label class="col-form-label">Price per 1kg:</label>
+              <label class="col-form-label">LKR. 80.00</label>
+            </div>
+            <div class="mb-3">
+              <label class="col-form-label">Estimated Price:</label>
+              <label class="col-form-label">LKR. 40.00</label>
+            </div>
+          </form>
+        </div>
+        <div class="modal-footer">
+          <button
+            type="button"
+            class="btn btn-danger"
+            data-bs-dismiss="modal"
+          >
+            Close
+          </button>
+        </div>
+      </div>
+    </div>
+  </div>
+
+  <script
+    src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/js/bootstrap.bundle.min.js"
+    integrity="sha384-gtEjrD/SeCtmISkJkNUaaKMoLD0//ElJ19smozuHV6z3Iehds+3Ulb9Bn9Plx0x4"
+    crossorigin="anonymous"
+  ></script>
+  <script src="https://api.mapbox.com/mapbox-gl-js/v2.1.1/mapbox-gl.js"></script>
+
+  <script>
+    mapboxgl.accessToken =
+      'pk.eyJ1IjoiYnRyYXZlcnN5IiwiYSI6ImNrbmh0dXF1NzBtbnMyb3MzcTBpaG10eXcifQ.h5ZyYCglnMdOLAGGiL1Auw'
+    var map = new mapboxgl.Map({
+      container: 'map',
+      style: 'mapbox://styles/mapbox/streets-v11',
+      center: [79.9696, 6.9061],
+      zoom: 13,
+    })
+  </script>
+
+</body>
+</html>

Server/templates/orangeNdvi.html

@@ -194,9 +194,10 @@
             <div class="card bg-light">
               <div class="card-body text-center">
                 <img
-                  src="https://randomuser.me/api/portraits/men/11.jpg"
-                  class="rounded-circle mb-3"
-                  alt=""
+                src="{{ url_for('static',filename='img/f1.png') }}"
+                class="rounded-circle mb-3"
+                style="width: 75%;"
+                alt=""
                 />
                 <h3 class="card-title mb-3">Giwantha Wijekoon</h3>
                 <p class="card-text">
@@ -215,9 +216,10 @@
             <div class="card bg-light">
               <div class="card-body text-center">
                 <img
-                  src="https://randomuser.me/api/portraits/men/12.jpg"
-                  class="rounded-circle mb-3"
-                  alt=""
+                src="{{ url_for('static',filename='img/f2.png') }}"
+                class="rounded-circle mb-3"
+                style="width: 75%;"
+                alt=""
                 />
                 <h3 class="card-title mb-3">Lakshan Wijewardane</h3>
                 <p class="card-text">
@@ -236,9 +238,10 @@
             <div class="card bg-light">
               <div class="card-body text-center">
                 <img
-                  src="https://randomuser.me/api/portraits/men/12.jpg"
-                  class="rounded-circle mb-3"
-                  alt=""
+                src="{{ url_for('static',filename='img/f4.png') }}"
+                class="rounded-circle mb-3"
+                style="width: 75%;"
+                alt=""
                 />
                 <h3 class="card-title mb-3">Lahiru Sanka Kumara</h3>
                 <p class="card-text">
@@ -257,9 +260,10 @@
             <div class="card bg-light">
               <div class="card-body text-center">
                 <img
-                  src="https://randomuser.me/api/portraits/women/12.jpg"
-                  class="rounded-circle mb-3"
-                  alt=""
+                src="{{ url_for('static',filename='img/f3.png') }}"
+                class="rounded-circle mb-3"
+                style="width: 75%;"
+                alt=""
                 />
                 <h3 class="card-title mb-3">Sethma Wattegedara</h3>
                 <p class="card-text">

Server/templates/predi.html

+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <title>Title</title>
+</head>
+<body>
+    <form action="{{ url_for('classify')}}"method="post">
+        <button type="submit" class="btn btn-primary btn-block btn-large">Predict</button>
+    </form>
+
+    <form action="{{ url_for('price')}}"method="post">
+        <button type="submit" class="btn btn-primary btn-block btn-large">Pre55</button>
+    </form>
+   <br>
+   <br>
+   {{ prediction_text_class }}
+
+    {{ vegita }}
+{{ dte }}
+
+{{ pr }}
+</body>
+</html>
\ No newline at end of file

Server/templates/predict.html

+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
+  <script src="https://cdn.jsdelivr.net/npm/html2canvas@1.0.0-rc.5/dist/html2canvas.min.js">
+  </script>
+  <meta charset="UTF-8" />
+  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/css/bootstrap.min.css" rel="stylesheet"
+    integrity="sha384-+0n0xVW2eSR5OomGNYDnhzAbDsOXxcvSN1TPprVMTNDbiYZCxYbOOl7+AMvyTG2x" crossorigin="anonymous" />
+  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.3.0/font/bootstrap-icons.css" />
+  <link href="https://api.mapbox.com/mapbox-gl-js/v2.1.1/mapbox-gl.css" rel="stylesheet" />
+  <!-- <link rel="stylesheet" href="css/style.css" /> -->
+  <title>OrgiCheck</title>
+</head>
+
+<body>
+  <!-- Navbar -->
+  <nav class="navbar navbar-expand-lg bg-dark navbar-dark py-3 fixed-top">
+    <div class="container">
+      <a href="http://127.0.0.1:5000/" class="navbar-brand">OrgiCheck</a>
+
+      <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navmenu">
+        <span class="navbar-toggler-icon"></span>
+      </button>
+
+      <div class="collapse navbar-collapse" id="navmenu">
+        <ul class="navbar-nav ms-auto">
+          <li class="nav-item">
+            <a href="#cam" class="nav-link">Device Connection</a>
+          </li>
+          <li class="nav-item">
+            <a href="#team" class="nav-link">Team</a>
+          </li>
+        </ul>
+      </div>
+    </div>
+  </nav>
+
+  <!-- Check Sections -->
+  <section id="cam" class="p-5 bg-dark text-light">
+    <div class="container">
+      <div class="row align-items-center justify-content-between">
+        <div class="col-md p-5">
+          <div class="col-md " id="objectimg">
+            <img
+              src={{paths}} width="404" height="303">
+          </div>
+
+        </div>
+        <div class="col-md p-5">
+          <h3>Fruit Type : {{type}}</h3>
+          <h3>Predicted Output : {{Predicted}}</h3>
+          <h3>Weight : {{weight}}</h3>
+          <h3>Size : {{sizee}}</h3>
+          <h3>Quality : {{qualityy}}</h3>
+
+          <button onclick="analyse()" class="btn btn-light mt-3"><i class="bi bi-chevron-right"></i> Analyse
+            Again</button>
+
+
+        </div>
+      </div>
+    </div>
+  </section>
+
+
+
+  <!-- Boxes -->
+  <section id="check" class="p-5">
+    <div class="container">
+      <div class="row text-center g-4">
+        <div class="col-md">
+          <div class="card bg-dark text-light">
+            <div class="card-body text-center">
+              <div class="h1 mb-3">
+                <i class="bi bi-bookmark-heart"></i>
+              </div>
+              <h3 class="card-title mb-3">Organicness</h3>
+              <button data-bs-toggle="modal" data-bs-target="#organic" class="btn btn-success">Check</button>
+            </div>
+          </div>
+        </div>
+        <div class="col-md">
+          <div class="card bg-dark text-light">
+            <div class="card-body text-center">
+              <div class="h1 mb-3">
+                <i class="bi bi-bug"></i>
+              </div>
+              <h3 class="card-title mb-3">Diseases</h3>
+              <button data-bs-toggle="modal" data-bs-target="#diseases" class="btn btn-success">Check</button>
+            </div>
+          </div>
+        </div>
+        <div class="col-md">
+          <div class="card bg-dark text-light">
+            <div class="card-body text-center">
+              <div class="h1 mb-3">
+                <i class="bi bi-hand-thumbs-up"></i>
+              </div>
+              <h3 class="card-title mb-3">Quality</h3>
+              <a href="client.html" class="btn btn-success">Check</a>
+            </div>
+          </div>
+        </div>
+        <div class="col-md">
+          <div class="card bg-dark text-light">
+            <div class="card-body text-center">
+              <div class="h1 mb-3">
+                <i class="bi bi-cash"></i>
+              </div>
+              <h3 class="card-title mb-3">Price</h3>
+              <button data-bs-toggle="modal" data-bs-target="#price" class="btn btn-success">Check</button>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </section>
+
+
+
+  <section id="team" class="p-5 bg-success">
+    <div class="container">
+      <h2 class="text-center text-white">Our Team</h2>
+      <p class="lead text-center text-white mb-5">
+        The team behind <span class="text-warning"> OrgiCheck&trade; Smart</span>
+      </p>
+      <div class="row g-4">
+        <div class="col-md-6 col-lg-3">
+          <div class="card bg-light">
+            <div class="card-body text-center">
+              <img src="https://randomuser.me/api/portraits/men/11.jpg" class="rounded-circle mb-3" alt="" />
+              <h3 class="card-title mb-3">Giwantha Wijekoon</h3>
+              <p class="card-text">
+                Lorem ipsum dolor sit amet consectetur adipisicing elit.
+                Assumenda accusamus nobis sed cupiditate iusto? Quibusdam.
+              </p>
+              <a href="#"><i class="bi bi-twitter text-dark mx-1"></i></a>
+              <a href="#"><i class="bi bi-facebook text-dark mx-1"></i></a>
+              <a href="#"><i class="bi bi-linkedin text-dark mx-1"></i></a>
+              <a href="#"><i class="bi bi-instagram text-dark mx-1"></i></a>
+            </div>
+          </div>
+        </div>
+
+        <div class="col-md-6 col-lg-3">
+          <div class="card bg-light">
+            <div class="card-body text-center">
+              <img src="https://randomuser.me/api/portraits/men/12.jpg" class="rounded-circle mb-3" alt="" />
+              <h3 class="card-title mb-3">Lakshan Wijewardane</h3>
+              <p class="card-text">
+                Lorem ipsum dolor sit amet consectetur adipisicing elit.
+                Assgnn hnhnnj
+              </p>
+              <a href="#"><i class="bi bi-twitter text-dark mx-1"></i></a>
+              <a href="#"><i class="bi bi-facebook text-dark mx-1"></i></a>
+              <a href="#"><i class="bi bi-linkedin text-dark mx-1"></i></a>
+              <a href="#"><i class="bi bi-instagram text-dark mx-1"></i></a>
+            </div>
+          </div>
+        </div>
+
+        <div class="col-md-6 col-lg-3">
+          <div class="card bg-light">
+            <div class="card-body text-center">
+              <img src="https://randomuser.me/api/portraits/men/12.jpg" class="rounded-circle mb-3" alt="" />
+              <h3 class="card-title mb-3">Lahiru Sanka Kumara</h3>
+              <p class="card-text">
+                Lorem ipsum dolor sit amet consectetur adipisicing elit.
+                Assumenda accusamus nobis sed cupiditate iusto? Quibusdam.
+              </p>
+              <a href="#"><i class="bi bi-twitter text-dark mx-1"></i></a>
+              <a href="#"><i class="bi bi-facebook text-dark mx-1"></i></a>
+              <a href="#"><i class="bi bi-linkedin text-dark mx-1"></i></a>
+              <a href="#"><i class="bi bi-instagram text-dark mx-1"></i></a>
+            </div>
+          </div>
+        </div>
+
+        <div class="col-md-6 col-lg-3">
+          <div class="card bg-light">
+            <div class="card-body text-center">
+              <img src="https://randomuser.me/api/portraits/women/12.jpg" class="rounded-circle mb-3" alt="" />
+              <h3 class="card-title mb-3">Sethma Wattegedara</h3>
+              <p class="card-text">
+                Lorem ipsum dolor sit amet consectetur adipisicing elit.
+                Assumenda accusamus nobis sed cupiditate iusto? Quibusdam.
+              </p>
+              <a href="#"><i class="bi bi-twitter text-dark mx-1"></i></a>
+              <a href="#"><i class="bi bi-facebook text-dark mx-1"></i></a>
+              <a href="#"><i class="bi bi-linkedin text-dark mx-1"></i></a>
+              <a href="#"><i class="bi bi-instagram text-dark mx-1"></i></a>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </section>
+
+  <!-- Contact & Map -->
+  <section class="p-5">
+    <div class="container">
+      <div class="row g-4">
+        <div class="col-md">
+          <h2 class="text-center mb-4">Contact Info</h2>
+          <ul class="list-group list-group-flush lead">
+            <li class="list-group-item">
+              <span class="fw-bold">Main Location:</span> 50 Main st Malabe
+            </li>
+            <li class="list-group-item">
+              <span class="fw-bold">Phone No:</span> (+94) 11-5555-555
+            </li>
+            <li class="list-group-item">
+              <span class="fw-bold">WhatsApp No:</span> (+94) 11-5555-555
+            </li>
+            <li class="list-group-item">
+              <span class="fw-bold">Email:</span>
+              info@orgicheck.com
+            </li>
+          </ul>
+        </div>
+        <div class="col-md">
+          <div id="map"></div>
+        </div>
+      </div>
+    </div>
+  </section>
+
+  <!-- Footer -->
+  <footer class="p-5 bg-dark text-white text-center position-relative">
+    <div class="container">
+      <p class="lead">Copyright &copy; 2021 OrgiCheck</p>
+
+      <a href="#" class="position-absolute bottom-0 end-0 p-5">
+        <i class="bi bi-arrow-up-circle h1"></i>
+      </a>
+    </div>
+  </footer>
+
+  <!-- Modal for Organic -->
+  <div class="modal fade" id="organic" tabindex="-1" aria-labelledby="enrollLabel" aria-hidden="true">
+    <div class="modal-dialog">
+      <div class="modal-content">
+        <div class="modal-header">
+          <h5 class="modal-title" id="enrollLabel">Organic</h5>
+          <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+        </div>
+        <div class="modal-body">
+          <p class="lead">eqggggggggg</p>
+          <form>
+            <div class="mb-3">
+              <label class="col-form-label">
+                grgggggggg
+              </label>
+              <label class="col-form-label">
+                grrrrrrr
+              </label>
+            </div>
+            <div class="mb-3">
+              <label class="col-form-label">rwg</label>
+              <label class="col-form-label">
+                500g
+              </label>
+            </div>
+            <div class="mb-3">
+              <label class="col-form-label">wrwrgwrg:</label>
+              <label class="col-form-label">LKR. 80.00</label>
+            </div>
+            <div class="mb-3">
+              <label class="col-form-label">eqqqqqqqqqq:</label>
+              <label class="col-form-label">LKR. 40.00</label>
+            </div>
+          </form>
+        </div>
+        <div class="modal-footer">
+          <button type="button" class="btn btn-danger" data-bs-dismiss="modal">
+            Close
+          </button>
+        </div>
+      </div>
+    </div>
+  </div>
+
+  <!-- Modal for Diseases -->
+  <div class="modal fade" id="diseases" tabindex="-1" aria-labelledby="enrollLabel" aria-hidden="true">
+    <div class="modal-dialog">
+      <div class="modal-content">
+        <div class="modal-header">
+          <h5 class="modal-title" id="enrollLabel">Diseases</h5>
+          <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+        </div>
+        <div class="modal-body">
+          <p class="lead">bvbvbhbvhbhv</p>
+          <form>
+            <div class="mb-3">
+              <label class="col-form-label">
+                veeweee
+              </label>
+              <label class="col-form-label">
+                qeveqeqeq
+              </label>
+            </div>
+            <div class="mb-3">
+              <label class="col-form-label">Aveeeve</label>
+              <label class="col-form-label">
+                vewv
+              </label>
+            </div>
+            <div class="mb-3">
+              <label class="col-form-label">wwwwwww:</label>
+              <label class="col-form-label">vvvvvvvv</label>
+            </div>
+            <div class="mb-3">
+              <label class="col-form-label">wwwwwwww</label>
+              <label class="col-form-label">LKR. 40.00</label>
+            </div>
+          </form>
+        </div>
+        <div class="modal-footer">
+          <button type="button" class="btn btn-danger" data-bs-dismiss="modal">
+            Close
+          </button>
+        </div>
+      </div>
+    </div>
+  </div>
+
+  <!-- Modal for Quality -->
+  <div class="modal fade" id="quality" tabindex="-1" aria-labelledby="enrollLabel" aria-hidden="true">
+    <div class="modal-dialog">
+      <div class="modal-content">
+        <div class="modal-header">
+          <h5 class="modal-title" id="enrollLabel">Quality</h5>
+          <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+        </div>
+        <div class="modal-body">
+          <p class="lead">ggggggggggggg</p>
+          <form>
+            <div class="mb-3">
+              <label class="col-form-label">
+                grgrgeh:
+              </label>
+              <label class="col-form-label">
+                Mahehengo
+              </label>
+            </div>
+            <div class="mb-3">
+              <label class="col-form-label">wjtje:</label>
+              <label class="col-form-label">
+                500g
+              </label>
+            </div>
+            <div class="mb-3">
+              <label class="col-form-label">rwhwhrhr:</label>
+              <label class="col-form-label">wrgttfbht</label>
+            </div>
+            <div class="mb-3">
+              <label class="col-form-label">egwgwg</label>
+              <label class="col-form-label">522</label>
+            </div>
+          </form>
+        </div>
+        <div class="modal-footer">
+          <button type="button" class="btn btn-danger" data-bs-dismiss="modal">
+            Close
+          </button>
+        </div>
+      </div>
+    </div>
+  </div>
+
+  <!-- Modal for Price -->
+  <div class="modal fade" id="price" tabindex="-1" aria-labelledby="enrollLabel" aria-hidden="true">
+    <div class="modal-dialog">
+      <div class="modal-content">
+        <div class="modal-header">
+          <h5 class="modal-title" id="enrollLabel">Price Prediction</h5>
+          <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+        </div>
+        <div class="modal-body">
+          <p class="lead">Estimated Price for scanned item</p>
+          <form>
+            <div class="mb-3">
+              <label class="col-form-label">
+                Detected Item:
+              </label>
+              <label class="col-form-label">
+                Mango
+              </label>
+            </div>
+            <div class="mb-3">
+              <label class="col-form-label">Approximate Weight:</label>
+              <label class="col-form-label">
+                500g
+              </label>
+            </div>
+            <div class="mb-3">
+              <label class="col-form-label">Price per 1kg:</label>
+              <label class="col-form-label">LKR. 80.00</label>
+            </div>
+            <div class="mb-3">
+              <label class="col-form-label">Estimated Price:</label>
+              <label class="col-form-label">LKR. 40.00</label>
+            </div>
+          </form>
+        </div>
+        <div class="modal-footer">
+          <button type="button" class="btn btn-danger" data-bs-dismiss="modal">
+            Close
+          </button>
+        </div>
+      </div>
+    </div>
+  </div>
+
+  <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/js/bootstrap.bundle.min.js"
+    integrity="sha384-gtEjrD/SeCtmISkJkNUaaKMoLD0//ElJ19smozuHV6z3Iehds+3Ulb9Bn9Plx0x4"
+    crossorigin="anonymous"></script>
+  <script src="https://api.mapbox.com/mapbox-gl-js/v2.1.1/mapbox-gl.js"></script>
+
+  <script>
+    var W_value = 0.00
+    // setInterval(function () {
+
+
+    //   var xmlHttp;
+    //   if (window.XMLHttpRequest) {
+    //     xmlHttp = new XMLHttpRequest();
+    //   } else if (window.ActiveXObject) {
+    //     xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
+    //   } else {
+    //     alert("Browser Doesnt Support Ajax!");
+    //   }
+    //   if (xmlHttp !== null) {
+
+    //     xmlHttp.onreadystatechange = async function () {
+    //       if (xmlHttp.readyState === 4) {
+
+    //         var res = xmlHttp.responseText;
+
+    //         W_value = res;
+    //         $("#weight").html(W_value);
+
+
+    //       }
+
+    //     };
+    //     xmlHttp.open("GET", "http://192.168.1.5/GetValue/", true);
+    //     xmlHttp.send();
+
+    //   }
+
+    // }, 1000);
+
+    function analyse() {
+
+
+      window.location.href = "http://192.168.1.5/";
+
+    }
+
+    mapboxgl.accessToken =
+      'pk.eyJ1IjoiYnRyYXZlcnN5IiwiYSI6ImNrbmh0dXF1NzBtbnMyb3MzcTBpaG10eXcifQ.h5ZyYCglnMdOLAGGiL1Auw'
+    var map = new mapboxgl.Map({
+      container: 'map',
+      style: 'mapbox://styles/mapbox/streets-v11',
+      center: [79.9696, 6.9061],
+      zoom: 13,
+    })
+  </script>
+
+</body>
+
+</html>
\ No newline at end of file

Server/templates/resultsPrice.html

+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <link
+      href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/css/bootstrap.min.css"
+      rel="stylesheet"
+      integrity="sha384-+0n0xVW2eSR5OomGNYDnhzAbDsOXxcvSN1TPprVMTNDbiYZCxYbOOl7+AMvyTG2x"
+      crossorigin="anonymous"
+    />
+    <link
+      rel="stylesheet"
+      href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.3.0/font/bootstrap-icons.css"
+    />
+    <link
+      href="https://api.mapbox.com/mapbox-gl-js/v2.1.1/mapbox-gl.css"
+      rel="stylesheet"
+    />
+    <link rel="stylesheet" href="/public/css/style.css" />
+    <title>OrgiCheck</title>
+  </head>
+  <body>
+    <!-- Navbar -->
+    <nav class="navbar navbar-expand-lg bg-dark navbar-dark py-3 fixed-top">
+      <div class="container">
+        <a href="/" class="navbar-brand">OrgiCheck</a>
+
+        <button
+          class="navbar-toggler"
+          type="button"
+          data-bs-toggle="collapse"
+          data-bs-target="#navmenu"
+        >
+          <span class="navbar-toggler-icon"></span>
+        </button>
+
+        <div class="collapse navbar-collapse" id="navmenu">
+          <ul class="navbar-nav ms-auto">
+            <li class="nav-item">
+              <a href="#cam" class="nav-link">Device Connection</a>
+            </li>
+            <li class="nav-item">
+              <a href="#team" class="nav-link">Team</a>
+            </li>
+          </ul>
+        </div>
+      </div>
+    </nav>
+<br>
+<br>
+    <br>
+    <br>
+    <!-- Boxes -->
+    <section id="check" class="p-5">
+      <div class="container">
+        <div class="row text-center g-4">
+          <div class="col-md">
+            <div class="card bg-dark text-light">
+              <div class="card-body text-center">
+                <div class="h1 mb-3">
+                  <i class="bi bi-cash"></i>
+                </div>
+                <h3 class="card-title mb-3">Price</h3>
+
+                <p><span class="text-warning"> Detected Fruit/Vegetable : </span>{{ vegita }}</p>
+                <p><span class="text-warning"> Estimated Weight : </span>{{ weight }} grams.</p>
+                <p> <span class="text-warning"> Estimated Price for 1Kg : </span> LKR. {{ price }}.00 </p>
+                <p> <span class="text-warning"> Estimated Price : </span> LKR. {{ esti }}.00 </p>
+                </div>
+
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <!-- Footer -->
+    <footer class="p-5 bg-dark text-white text-center position-relative">
+      <div class="container">
+        <p class="lead">Copyright &copy; 2021 OrgiCheck</p>
+
+        <a href="#" class="position-absolute bottom-0 end-0 p-5">
+          <i class="bi bi-arrow-up-circle h1"></i>
+        </a>
+      </div>
+    </footer>
+
+  </body>
+</html>