image-processor/app.py at develop · FindByColor/image-processor · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
"""Web App & CLI Image Processor for Find By Color"""

import os
import streamlit as st
import warnings

from PIL import ImageColor
from src.util import crop_image, generate_color_chart, get_device_info, get_mask, get_mask_json, get_overlay, get_product_colors, load_image, remove_image_background, get_color_json

# Disable Warning generated by External Model
warnings.filterwarnings("ignore")

# Configure Web App
st.set_option("deprecation.showfileUploaderEncoding", False)
st.set_page_config(
    page_title="Find By Color",
    page_icon=os.path.join(".streamlit", "img", "icon.ico"),
    initial_sidebar_state="collapsed",
    layout="centered",
    menu_items={
        'Get Help': 'https://github.com/FindByColor/image-processor#readme',
        'Report a bug': "https://github.com/FindByColor/image-processor/issues/new",
        'About': get_device_info()
    }
)

# Apply CSS Overrides
css = open(os.path.join(".streamlit", "css", "style.css"), "r")
st.markdown("<style>{:s}</style>".format(css.read()), unsafe_allow_html=True)

# Output Logo
svg = open(os.path.join(".streamlit", "img", "logo.svg"), "r")
st.write(svg.read(), unsafe_allow_html=True)

# Generate UI Element for File Upload
uploaded_file = st.file_uploader("Upload Image ...", type=["jpg", "png"], label_visibility="hidden")

# Wait for File Upload
if uploaded_file is not None:
    # Start Loading Indicator
    with st.spinner(text="Processing Image..."):
        # STEP 1: Load Original Image
        original_image = load_image(uploaded_file)

        # STEP 2: Generate Image Mask
        mask = get_mask(original_image)

        # STEP 3: Generate Detected Product Image
        overlay = get_overlay(original_image, mask)

        # STEP 4: Remove Background from Image
        processed_image = remove_image_background(original_image, mask)

        # STEP 5: Trim Image to Remove Transparent Pixels
        cropped_image = crop_image(processed_image)

        # STEP 6: Process Colors from Clipped Image
        colors = get_product_colors(cropped_image)

        # STEP 7: Generate Color Chart
        product_color_chart = generate_color_chart(colors, cropped_image)

        # Generate Tabbed Interface
        tab1, tab2, tab3, tab4, tab5 = st.tabs(["Colors", "Original", "Processed", "Steps", "Data"])

        def color_cell(val):
            rgb = ImageColor.getcolor(val, "RGB")
            L = (0.212 * rgb[0] + 0.701 * rgb[1] + 0.087 * rgb[2]) / 255
            if L > 0.5:
                text_color = '#000000'
            else:
                text_color = '#FFFFFF'

            return f'background-color: {val}; color: {text_color};'

        # Colors Tab
        with tab1:
            st.subheader("Color Usage")
            st.image(product_color_chart, width=420, use_column_width='never')

            height = (len(colors) * 35) + 37
            st.dataframe(colors.style.applymap(color_cell, subset=['hex']), use_container_width=True, height=height)

            # Download JSON Mapping of Pixel Data
            st.download_button(
                label="Download",
                data=get_color_json(colors),
                file_name="color.json",
                mime="application/json",
                key="download-color-json"
            )

        # Original Image Tab
        with tab2:
            st.image(original_image, caption="Original Product Image", use_column_width=True)

        # Processed Image Tab
        with tab3:
            st.image(processed_image, caption="Processed Product Image", use_column_width=True)

        # Steps Tab
        with tab4:
            col1, col2 = st.columns(2)
            with col1:
                st.image(original_image, caption="Original Product Image", use_column_width=True)
                st.image(mask * 255, caption="Detected Product Mask", use_column_width=True)

            with col2:
                st.image(overlay, caption="Detected Product Overlay", use_column_width=True)
                st.image(processed_image, caption="Processed Product Image", use_column_width=True)

        # Data Tab
        with tab5:
            st.subheader("Product Mask")
            st.dataframe(mask, use_container_width=True)

            # Download JSON Mapping of Pixel Data
            st.download_button(
                label="Download",
                data=get_mask_json(mask),
                file_name="mask.json",
                mime="application/json",
                key="download-mask-json"
            )