Simplify Gallery Choice

Change time to utc
Add new database to record image click
Select image on click
Add hover color
Add report button

Home.py

@@ -38,7 +38,7 @@ def save_user_id(user_id):
     print(user_id)
     if not user_id:
         user_id = 'anonymous' + str(random.randint(0, 100000))
-    st.session_state.user_id = [user_id, datetime.now().strftime("%Y-%m-%d %H:%M:%S")]
+    st.session_state.user_id = [user_id, datetime.utcnow().strftime("%Y-%m-%d %H:%M:%S")]
     st.session_state.assigned_rank_mode = random.choice(['Drag and Sort', 'Battle'])
     st.session_state.epoch = {'gallery': 0, 'ranking': {}, 'summary': {'overall': 0}}
 

pages/Gallery.py

@@ -8,7 +8,6 @@ import random
 import numpy as np
 import pandas as pd
 import streamlit as st
-import streamlit.components.v1 as components
 
 from bs4 import BeautifulSoup
 from datasets import load_dataset, Dataset, load_from_disk
@@ -95,7 +94,8 @@ class GalleryApp:
 
             nodes.append(Node(id=items.loc[idx, 'image_id'],
                               # label=str(items.loc[idx, 'model_name']),
-                              title=f"model name: {items.loc[idx, 'model_name']}\nmodelVersion name: {items.loc[idx, 'modelVersion_name']}\nclip score: {items.loc[idx, 'clip_score']}\nmcos score: {items.loc[idx, 'mcos_score']}\npopularity: {items.loc[idx, 'model_download_count']}",
+                              # title=f"model name: {items.loc[idx, 'model_name']}\nmodelVersion name: {items.loc[idx, 'modelVersion_name']}\nclip score: {items.loc[idx, 'clip_score']}\nmcos score: {items.loc[idx, 'mcos_score']}\npopularity: {items.loc[idx, 'model_download_count']}",
+                              title=" ",
                               size=20,
                               shape='image',
                               image=f"https://modelcofferbucket.s3-accelerate.amazonaws.com/{items.loc[idx, 'image_id']}.png",
@@ -105,7 +105,8 @@ class GalleryApp:
                               color={'background': '#E0E0E1', 'border': '#ffffff', 'highlight': {'border': '#F04542'}},
                               # opacity=opacity,
                               shadow={'enabled': True, 'color': 'rgba(0,0,0,0.4)', 'size': 10, 'x': 1, 'y': 1},
-                              borderWidth=2,
+                              borderWidth=3,
+                              borderWidthSelected=3,
                               shapeProperties={'useBorderWithImage': True},
                               )
                          )
@@ -115,7 +116,7 @@ class GalleryApp:
                         directed=True,
                         physics=False,
                         hierarchical=False,
-                        interaction={'navigationButtons': True, 'dragNodes': False, 'multiselect': False},
+                        interaction={'navigationButtons': True, 'dragNodes': False, 'multiselect': False, 'hover': True},
                         # **kwargs
                         )
 
@@ -349,45 +350,106 @@ class GalleryApp:
                     modelVersion_id = item['modelVersion_id']
 
                     # handle selection
+                    # get the latest record in database
+                    cursor = GALLERY_CONN.cursor()
+                    query = "SELECT * FROM gallery_clicks WHERE username = '{}' AND timestamp = '{}' AND prompt_id = '{}' AND modelVersion_id = {} ORDER BY clicktime DESC LIMIT 1".format(
+                        st.session_state.user_id[0], st.session_state.user_id[1], prompt_id, modelVersion_id)
+                    cursor.execute(query)
+                    record = cursor.fetchone()
+                    try:
+                        image_status = record['status']
+                    except:
+                        image_status = None
+
+                    print('image_status: ', image_status)
+
                     if 'selected_dict' in st.session_state:
                         if item['prompt_id'] not in st.session_state.selected_dict:
                             st.session_state.selected_dict[item['prompt_id']] = []
 
-                        if modelVersion_id in st.session_state.selected_dict[item['prompt_id']]:
-                            checked = True
-                        else:
-                            checked = False
+                        # if 'last_clicked' not in st.session_state or item['image_id'] != st.session_state.last_clicked:
+                        #     print('last_clicked not in session state')
+                        #     self.image_selection_control(item['tag'], item['prompt'], item['prompt_id'], modelVersion_id, 'select')
+                        #     st.toast('Image selected.', icon='👍')
+                        #
+                        # st.session_state.last_clicked = item['image_id']
 
-                    if checked:
-                        # deselect = st.button('Deselect', key=f'select_{item["prompt_id"]}_{item["modelVersion_id"]}', use_container_width=True)
-                        deselect = st.form_submit_button('Deselect', use_container_width=True, on_click=self.image_selection_control, args=(item['tag'], item['prompt'], item['prompt_id'], item['modelVersion_id'], False))
+                        # if modelVersion_id in st.session_state.selected_dict[item['prompt_id']]:
+                        #     checked = True
+                        # else:
+                        #     checked = False
+                    selection_control_button = st.empty()
+                    report_control_button = st.empty()
 
-                    else:
-                        # select = st.button('Select', key=f'select_{item["prompt_id"]}_{item["modelVersion_id"]}', use_container_width=True, type='primary')
-                        select = st.form_submit_button('Select', use_container_width=True, type='primary', on_click=self.image_selection_control, args=(item['tag'], item['prompt'], item['prompt_id'], item['modelVersion_id'], True))
+                    if image_status == 'report':
+                        st.warning('You have reported this image')
+                        unreport = report_control_button.form_submit_button('Withdraw report', use_container_width=True, type='secondary', on_click=self.image_selection_control, args=(item['tag'], item['prompt'], item['prompt_id'], item['modelVersion_id'], 'deselect'))
 
+                    else:
+                        if image_status is None:
+                            self.image_selection_control(item['tag'], item['prompt'], item['prompt_id'],
+                                                         modelVersion_id,
+                                                         'select')
+                            # st.toast('Image selected.', icon='👍')
+
+                        if image_status == 'select' or image_status == 'reselect' or image_status is None:
+                            # deselect = st.button('Deselect', key=f'select_{item["prompt_id"]}_{item["modelVersion_id"]}', use_container_width=True)
+                            deselect = selection_control_button.form_submit_button('Deselect', use_container_width=True, on_click=self.image_selection_control, args=(item['tag'], item['prompt'], item['prompt_id'], item['modelVersion_id'], 'deselect'))
+
+                            st.info(
+                                "Image selected. **Click the 'Check out selections ➡️' on top to see all selected images**. You can get back to gallery graph at anytime.")
+
+                        elif image_status =='deselect':
+                            # select = st.button('Select', key=f'select_{item["prompt_id"]}_{item["modelVersion_id"]}', use_container_width=True, type='primary')
+                            reselect = selection_control_button.form_submit_button('Reselect', use_container_width=True, type='primary', on_click=self.image_selection_control, args=(item['tag'], item['prompt'], item['prompt_id'], item['modelVersion_id'], 'reselect'))
+
+                        report = report_control_button.form_submit_button('⚠️Report', use_container_width=True, type='secondary',
+                                                       on_click=self.image_selection_control, args=(
+                            item['tag'], item['prompt'], item['prompt_id'], item['modelVersion_id'], 'report'))
                     # st.write(item)
-                    infos = ['model_name', 'modelVersion_name', 'model_download_count', 'clip_score', 'mcos_score',
-                             'nsfw_score']
-
-                    infos_df = item[infos]
-                    # rename columns
-                    infos_df = infos_df.rename(index={'model_name': 'Model', 'modelVersion_name': 'Version', 'model_download_count': 'Downloads', 'clip_score': 'Clip Score', 'mcos_score': 'mcos Score', 'nsfw_score': 'NSFW Score'})
-                    st.table(infos_df)
+                    # infos = ['model_name', 'modelVersion_name', 'model_download_count', 'clip_score', 'mcos_score',
+                    #          'nsfw_score']
+                    #
+                    # infos_df = item[infos]
+                    # # rename columns
+                    # infos_df = infos_df.rename(index={'model_name': 'Model', 'modelVersion_name': 'Version', 'model_download_count': 'Downloads', 'clip_score': 'Clip Score', 'mcos_score': 'mcos Score', 'nsfw_score': 'NSFW Score'})
+                    # st.table(infos_df)
 
             else:
                 st.info('Please click on an image to show')
 
-    def image_selection_control(self, tag, prompt, prompt_id, modelVersion_id, to_select):
+    def image_selection_control(self, tag, prompt, prompt_id, modelVersion_id, operation:['select', 'reselect', 'deselect','report']):
         self.remove_ranking_states(prompt_id)
-        if to_select:
+
+        # # update the status of the lastest clicktime
+        # query = "UPDATE gallery_clicks SET status= '{}' " \
+        #         "WHERE username = '{}' AND timestamp = '{}' AND prompt_id = '{}' AND modelVersion_id = {} AND clicktime = " \
+        #         "(SELECT MAX(clicktime) WHERE username = '{}' AND timestamp = '{}' AND prompt_id = '{}' AND modelVersion_id = {}" \
+        #     .format(operation,
+        #             st.session_state.user_id[0], st.session_state.user_id[1], prompt_id, modelVersion_id,
+        #             st.session_state.user_id[0], st.session_state.user_id[1], prompt_id, modelVersion_id)
+
+        if operation == 'select' or operation == 'reselect':
             st.session_state.selected_dict[prompt_id].append(modelVersion_id)
             # add focus to session state
             st.session_state.gallery_focus['tag'] = tag
             st.session_state.gallery_focus['prompt'] = prompt
 
-        else:
-            st.session_state.selected_dict[prompt_id].remove(modelVersion_id)
+        elif operation == 'deselect':
+            if modelVersion_id in st.session_state.selected_dict[prompt_id]:
+                st.session_state.selected_dict[prompt_id].remove(modelVersion_id)
+        elif operation == 'report':
+            pass
+
+        cursor = GALLERY_CONN.cursor()
+        clicktime = datetime.utcnow().strftime("%Y-%m-%d %H:%M:%S")
+        query = "INSERT INTO gallery_clicks (username, timestamp, tag, prompt_id, modelVersion_id, clicktime, status) VALUES ('{}', '{}', '{}', '{}', {}, '{}', '{}')".format(
+            st.session_state.user_id[0], st.session_state.user_id[1], tag, prompt_id, modelVersion_id, clicktime,
+            operation)
+
+        cursor.execute(query)
+        GALLERY_CONN.commit()
+        cursor.close()
 
     def checkout_mode(self, tag, items):
         # st.write(items)
@@ -446,7 +508,7 @@ class GalleryApp:
                                         if keys[0] == 'select' and keys[1] == str(prompt_id):
                                             if st.session_state[key]:
                                                 st.session_state.selected_dict[prompt_id].append(int(keys[2]))
-
+                                                self.image_selection_control(tag, prompt, prompt_id, int(keys[2]), 'select')    # update database
                                     st.session_state.edit_state = False
                                     st.rerun()
 
@@ -459,24 +521,22 @@ class GalleryApp:
                                 st.session_state.gallery_state = 'graph'
 
                                 print('selected_dict: ', st.session_state.selected_dict)
+
+                                # # save the user selection to database
                                 # cursor = GALLERY_CONN.cursor()
+                                # st.session_state.epoch['gallery'] += 1
+                                # checkouttime = datetime.utcnow().strftime("%Y-%m-%d %H:%M:%S")
+                                # # for modelVersion_id in st.session_state.selected_dict[prompt_id]:
+                                # for key, values in st.session_state.selected_dict.items():
+                                #     # print('key: ', key, 'values: ', values)
+                                #     key_tag = self.promptBook[self.promptBook['prompt_id'] == key]['tag'].unique()[0]
+                                #     for value in values:
+                                #         query = "INSERT INTO gallery_selections (username, timestamp, tag, prompt_id, modelVersion_id, checkouttime, epoch) VALUES ('{}', '{}', '{}', '{}', {}, '{}', {})".format(st.session_state.user_id[0], st.session_state.user_id[1], key_tag, key, value, checkouttime, st.session_state.epoch['gallery'])
+                                #         print(query)
+                                #         cursor.execute(query)
+                                # GALLERY_CONN.commit()
                                 # cursor.close()
 
-                                # save the user selection to database
-                                cursor = GALLERY_CONN.cursor()
-                                st.session_state.epoch['gallery'] += 1
-                                checkouttime = datetime.now().strftime("%Y-%m-%d %H:%M:%S")
-                                # for modelVersion_id in st.session_state.selected_dict[prompt_id]:
-                                for key, values in st.session_state.selected_dict.items():
-                                    # print('key: ', key, 'values: ', values)
-                                    key_tag = self.promptBook[self.promptBook['prompt_id'] == key]['tag'].unique()[0]
-                                    for value in values:
-                                        query = "INSERT INTO gallery_selections (username, timestamp, tag, prompt_id, modelVersion_id, checkouttime, epoch) VALUES ('{}', '{}', '{}', '{}', {}, '{}', {})".format(st.session_state.user_id[0], st.session_state.user_id[1], key_tag, key, value, checkouttime, st.session_state.epoch['gallery'])
-                                        print(query)
-                                        cursor.execute(query)
-                                GALLERY_CONN.commit()
-                                cursor.close()
-
                                 # get the largest epoch number of this user and prompt
                                 cursor = GALLERY_CONN.cursor()
                                 db_table = 'battle_results' if st.session_state.assigned_rank_mode=='Battle' else 'sort_results'

pages/Ranking.py

@@ -183,7 +183,7 @@ class RankingApp:
         #         query = "DELETE FROM sort_results WHERE username = %s AND timestamp = %s AND prompt_id = %s AND position1 = %s AND position2 = %s AND position3 = %s AND position4 = %s"
         #         curser.execute(query, (st.session_state.user_id[0], st.session_state.user_id[1], prompt_id, result['position1'], result['position2'], result['position3'], result['position4']))
 
-        sorttime = datetime.now().strftime("%Y-%m-%d %H:%M:%S")
+        sorttime = datetime.utcnow().strftime("%Y-%m-%d %H:%M:%S")
         # handle the case where user press the 'prev' button
         query = "DELETE FROM sort_results WHERE username = %s AND timestamp = %s AND prompt_id = %s AND epoch = %s"
         curser.execute(query, (st.session_state.user_id[0], st.session_state.user_id[1], prompt_id, st.session_state.epoch['ranking'][prompt_id]))
@@ -247,7 +247,7 @@ class RankingApp:
 
     def next_battle(self, tag, prompt_id, image_ids, winner, curr_position, total_num):
         loser = 'left' if winner == 'right' else 'right'
-        battletime = datetime.now().strftime("%Y-%m-%d %H:%M:%S")
+        battletime = datetime.utcnow().strftime("%Y-%m-%d %H:%M:%S")
 
         curser = RANKING_CONN.cursor()
 

pages/Summary.py

@@ -46,7 +46,7 @@ class DashboardApp:
                 comment = st.text_area('Please leave your comments here.', key='comment')
                 submit_feedback = st.form_submit_button('Submit Feedback')
                 if submit_feedback:
-                    commenttime = datetime.now().strftime("%Y-%m-%d %H:%M:%S")
+                    commenttime = datetime.utcnow().strftime("%Y-%m-%d %H:%M:%S")
                     curser = RANKING_CONN.cursor()
                     # parse the comment to at most 300 to avoid SQL injection
                     for i in range(0, len(comment), 300):
@@ -190,7 +190,7 @@ class DashboardApp:
         # print('latest_epoch',latest_epoch)
         if latest_epoch is None or latest_epoch['epoch'] < st.session_state.epoch['summary'][tag_name]:
             # save the current ranking results to the database
-            summarytime = datetime.now().strftime("%Y-%m-%d %H:%M:%S")
+            summarytime = datetime.utcnow().strftime("%Y-%m-%d %H:%M:%S")
             curser = RANKING_CONN.cursor()
             for i in range(len(st.session_state.modelVersion_standings[tag])):
                 curser.execute(f"INSERT INTO summary_results (username, timestamp, tag, modelVersion_id, position, ranking_score, summarytime, epoch, customized) VALUES ('{st.session_state.user_id[0]}', '{st.session_state.user_id[1]}', '{tag_name}', '{st.session_state.modelVersion_standings[tag][i][0]}', {i+1}, {st.session_state.modelVersion_standings[tag][i][1]}, '{summarytime}', {st.session_state.epoch['summary'][tag_name]}, 0)")
@@ -201,7 +201,7 @@ class DashboardApp:
         # insert the current before the target
         st.session_state.modelVersion_standings[tag].insert(target, st.session_state.modelVersion_standings[tag].pop(current))
         tag_name = 'overview' if tag == '%' else tag
-        summarytime = datetime.now().strftime("%Y-%m-%d %H:%M:%S")
+        summarytime = datetime.utcnow().strftime("%Y-%m-%d %H:%M:%S")
         curser = RANKING_CONN.cursor()
         # clear the current user's ranking results
         curser.execute(f"DELETE FROM summary_results WHERE username = '{st.session_state.user_id[0]}' AND timestamp = '{st.session_state.user_id[1]}' AND tag = '{tag_name}' AND epoch = {st.session_state.epoch['summary'][tag_name]}")
@@ -259,21 +259,6 @@ class DashboardApp:
             self.sidebar(tags, mode)
             self.leaderboard(tag, db_table)
 
-        # with st.sidebar:
-        #     with st.form('overall_feedback'):
-        #         comment = st.text_area('Please leave your comments here.', key='comment')
-        #         submit_feedback = st.form_submit_button('Submit Feedback')
-        #         if submit_feedback:
-        #             commenttime = datetime.now().strftime("%Y-%m-%d %H:%M:%S")
-        #             curser = RANKING_CONN.cursor()
-        #             # parse the comment to at most 300 to avoid SQL injection
-        #             for i in range(0, len(comment), 300):
-        #                 curser.execute(f"INSERT INTO comments (username, timestamp, comment, commenttime) VALUES ('{st.session_state.user_id[0]}', '{st.session_state.user_id[1]}', '{comment[i:i+300]}', '{commenttime}')")
-        #             RANKING_CONN.commit()
-        #             curser.close()
-        #
-        #             st.sidebar.info('🙏 **Thanks for your feedback! We will take it into consideration in our future work.**')
-
 
 if __name__ == "__main__":
     st.set_page_config(layout="wide")