Update app.py

app.py

@@ -349,9 +349,12 @@ def extract_features_siglip(image):
 @spaces.GPU
 def infer(crop_image_path,full_image_path,state,language,task_type=None):
     print("task type",task_type)
-    gallery_output = []
-    if task_type==1:
-        gallery_output.append(["recomendation_pic/1.8.jpg","recomendation_pic/1.9.jpg"])
+    style_gallery_output = []
+    item_gallery_output=[]
+
+    if task_type=="task 1":
+        item_gallery_output.append("recomendation_pic/1.8.jpg")
+        item_gallery_output.append("recomendation_pic/1.9.jpg")
         input_image = Image.open(full_image_path).convert("RGB")
         input_features = extract_features_siglip(input_image.convert("RGB"))
         input_features = input_features.detach().cpu().numpy()
@@ -362,16 +365,17 @@ def infer(crop_image_path,full_image_path,state,language,task_type=None):
             sim = -distances[0][i]
             image_url = df.iloc[v]["Link"]
             img_retrieved = read_image_from_url(image_url)
-            gallery_output.append(img_retrieved)
+            style_gallery_output.append(img_retrieved)
         if language=="English":
             msg="🖼️ Please refer to the section below to see the recommended results."
         else:
             msg="🖼️  请到下方查看推荐结果。"
         state+=[(None,msg)]
 
-        return gallery_output,state,state
-    elif task_type==2:
-        gallery_output.append(["recomendation_pic/2.8.jpg","recomendation_pic/2.9.png"])
+        return item_gallery_output, style_gallery_output,state,state
+    elif task_type=="task 2":
+        item_gallery_output.append("recomendation_pic/2.8.jpg")
+        item_gallery_output.append("recomendation_pic/2.9.png")
         input_image = Image.open(full_image_path).convert("RGB")
         input_features = extract_features_siglip(input_image.convert("RGB"))
         input_features = input_features.detach().cpu().numpy()
@@ -382,17 +386,18 @@ def infer(crop_image_path,full_image_path,state,language,task_type=None):
             sim = -distances[0][i]
             image_url = df.iloc[v]["Link"]
             img_retrieved = read_image_from_url(image_url)
-            gallery_output.append(img_retrieved)
+            style_gallery_output.append(img_retrieved)
         if language=="English":
             msg="🖼️ Please refer to the section below to see the recommended results."
         else:
             msg="🖼️  请到下方查看推荐结果。"
         state+=[(None,msg)]
 
-        return gallery_output,state,state
+        return item_gallery_output, style_gallery_output,state,state
     
-    elif task_type==3:
-        gallery_output.append(["recomendation_pic/3.8.png","recomendation_pic/3.9.png"])
+    elif task_type=="task 3":
+        item_gallery_output.append("recomendation_pic/3.8.png")
+        item_gallery_output.append("recomendation_pic/basket-2.png")
         input_image = Image.open(full_image_path).convert("RGB")
         input_features = extract_features_siglip(input_image.convert("RGB"))
         input_features = input_features.detach().cpu().numpy()
@@ -403,14 +408,15 @@ def infer(crop_image_path,full_image_path,state,language,task_type=None):
             sim = -distances[0][i]
             image_url = df.iloc[v]["Link"]
             img_retrieved = read_image_from_url(image_url)
-            gallery_output.append(img_retrieved)
+            style_gallery_output.append(img_retrieved)
         if language=="English":
             msg="🖼️ Please refer to the section below to see the recommended results."
         else:
             msg="🖼️  请到下方查看推荐结果。"
         state+=[(None,msg)]
 
-        return gallery_output,state,state
+        return item_gallery_output, style_gallery_output,state,state
+    
     elif crop_image_path:
         input_image = Image.open(crop_image_path).convert("RGB")
         input_features = extract_features_siglip(input_image.convert("RGB"))
@@ -422,7 +428,7 @@ def infer(crop_image_path,full_image_path,state,language,task_type=None):
             sim = -distances[0][i]
             image_url = df.iloc[v]["Link"]
             img_retrieved = read_image_from_url(image_url)
-            gallery_output.append(img_retrieved)
+            item_gallery_output.append(img_retrieved)
 
         input_image = Image.open(full_image_path).convert("RGB")
         input_features = extract_features_siglip(input_image.convert("RGB"))
@@ -434,14 +440,14 @@ def infer(crop_image_path,full_image_path,state,language,task_type=None):
             sim = -distances[0][i]
             image_url = df.iloc[v]["Link"]
             img_retrieved = read_image_from_url(image_url)
-            gallery_output.append(img_retrieved)
+            style_gallery_output.append(img_retrieved)
         if language=="English":
             msg="🖼️ Please refer to the section below to see the recommended results."
         else:
             msg="🖼️  请到下方查看推荐结果。"
         state+=[(None,msg)]
 
-        return gallery_output,state,state
+        return item_gallery_output, style_gallery_output,state,state
     else:
         input_image = Image.open(full_image_path).convert("RGB")
         input_features = extract_features_siglip(input_image.convert("RGB"))
@@ -453,14 +459,15 @@ def infer(crop_image_path,full_image_path,state,language,task_type=None):
             sim = -distances[0][i]
             image_url = df.iloc[v]["Link"]
             img_retrieved = read_image_from_url(image_url)
-            gallery_output.append(img_retrieved)
+            style_gallery_output.append(img_retrieved)
         if language=="English":
             msg="🖼️ Please refer to the section below to see the recommended results."
         else:
             msg="🖼️  请到下方查看推荐结果。"
         state+=[(None,msg)]
 
-        return gallery_output,state,state
+        return item_gallery_output, style_gallery_output,state,state
+        
 
 
 ###############################################################################
@@ -614,7 +621,7 @@ css = """
 
 
 .info_btn {
-    background: white !important;
+    background: rgb(245, 245, 245) !important;
     border: none !important;
     box-shadow: none !important;
     font-size: 15px !important;
@@ -623,7 +630,7 @@ css = """
 }
 
 .info_btn_interact {
-    background: rgb(242, 240, 233) !important;
+    background: rgb(217, 217, 217) !important;
     box-shadow: none !important;
     font-size: 15px !important;
     min-width: 6rem !important;
@@ -631,16 +638,24 @@ css = """
 }
 
 .function_button {
+    background: rgb(227, 226, 226) !important;
     border: none !important;
     box-shadow: none !important;
 }
 
 .function_button_rec {
-    background: rgb(245, 193, 154) !important;
+    background: rgb(189, 189, 189) !important;
     border: none !important;
     box-shadow: none !important;
 }
 
+.small_button {
+    font-size: 12px !important;
+    padding: 2px 8px !important;
+    min-width: 60px !important;
+    height: 30px !important;
+}
+
 #tool_box {max-width: 50px}
  
 """
@@ -703,26 +718,65 @@ Use a markdown outline format with appropriate emojis based on the image and Wik
 ]
 
 recommendation_prompt=[
-    '''I want you to write the recommendation reason according to the following content, as a markdown outline with appropriate emojis that describe what you see according to the image:Recommendation reason: {{Recommendation based on objects in the image or Recommendation based on overall visual similarity}}
-    Detailed analysis: Based on the recommendation reason, explain why you recommend image 2 after viewing image 1.Each bullet point should be in {language} language, with a response length of about {length} words.''',
+    
+    [
+    '''
+    First identify what the object of the first painting is, you save yourself as the parameter: {{object}}, do not need to tell me, the following will use the parameter. I want you to write the recommendation reason according to the following content, as a markdown outline with appropriate emojis that describe what you see according to the painting: 
+    Recommendation reason: {{Recommendation based on {{object}} in the painting you saw earlier. Detailed analysis: Based on the recommendation reason and the relationship between the two paintings, explain why you recommend another painting. Please generate in three points. }}
+    Each bullet point should be in {language} language, with a response length of about {length} words.
+    ''',
+    '''
+    When generating answers, you should tell people that I am the creator of painting you were looking at earlier itself, and generate text in the tone and manner in which you are the creator of painting were looking at earlier. 
+
+    First identify what the object of the first painting is, you save yourself as the parameter: {{object}}, do not need to tell me, the following will use the. I want you to write the recommendation reason according to the following content, as a markdown outline with appropriate emojis that describe what you see according to the painting: 
+
+    Recommendation reason: {{I'm the creator of that painting you saw earlier. I'm an artist. and I'm recommending this painting based on the fact that the {{object}} I've drawn also appear in the painting you're looking at. }} Detailed analysis: Based on the recommendation reason and the relationship between the two paintings, explain why you recommend another painting. Please generate the three points in the tone and manner as if you are the creator of painting were looking at earlier and start every sentence with I.
+
+    Each bullet point should be in {language} language, with a response length of about {length} words.
+
+    ''',
+    '''
+    When generating answers, you should tell people that you are the object itself that was selected in the painting, and generate text in the tone and manner in which you are the object 
+
+    First identify what the object of the first painting is, you save yourself as the parameter: {{object}}, do not need to tell me, the following will use the parameter. I want you to write the recommendation reason according to the following content, as a markdown outline with appropriate emojis that describe what you see according to the painting: 
+
+    Recommendation reason: {{I'm the {{object}} in the painting you were looking at earlier, and I'm recommending this painting based on the fact that I'm also present in the one you're looking at.}} Detailed analysis: Based on the recommendation reason and the relationship between the two paintings, explain why you recommend another painting. Please generate the three points in the tone and manner as if you are the object of this painting and start every sentence with I. 
+
+    Each bullet point should be in {language} language, with a response length of about {length} words.
+
+    '''],
+    
+    [
     '''
-    When generating the answer, you should tell others that you are the creators of the first paintings and generate the text in the tone and manner as if you are the creator of the painting.
-    I want you to write the recommendation reason according to the following content, as a markdown outline with appropriate emojis that describe what you see according to the image:
-    Recommendation reason: {{ As the author of the first painting, I recommend based on the object I painted OR As the author of the first painting, I recommend based on the overall similarity in appearance}}
-    Detailed analysis: Based on the recommendation reason, explain why you recommend image 2 after viewing image 1. Please generate the above points in the tone and manner as if you are the creator of this painting and start every sentence with I.
+    First identify what the name of the first painting is, you save yourself as the parameter: {{name}}, do not need to tell me, the following will use the parameter. I want you to write the recommendation reason according to the following content, as a markdown outline with appropriate emojis that describe what you see according to the painting: 
+    Recommendation reason: {{Recommendation based on the painting {{name}}.Detailed analysis: Based on the recommendation reason and the relationship between the two paintings, explain why you recommend another painting. Please generate in three points.}} 
     Each bullet point should be in {language} language, with a response length of about {length} words.
     ''',
     '''
-    When generating answers, you should tell people that you are the object itself that was selected in the first painting, and generate text in the tone and manner in which you are the object
-    I want you to write the recommendation reason according to the following content, as a markdown outline with appropriate emojis that describe what you see according to the image:  
-    Recommendation reason: {{As an object in the first painting, I am recommending based on myself OR As an object in the first painting, I am recommending based on the overall similarity of the first painting's appearance}}
-    Detailed analysis: Based on the recommendation reason, explain why you recommend image 2 after viewing image 1. Please generate the above points in the tone and manner as if you are the object of this painting and start every sentence with I.  
+    When generating answers, you should tell people that I am the creator of painting you were looking at earlier itself, and generate text in the tone and manner in which you are the creator of painting were looking at earlier. 
+
+    First identify what the creator of the first painting is, you save yourself as the parameter: {artist}, do not need to tell me, the following will use the parameter. I want you to write the recommendation reason according to the following content, as a markdown outline with appropriate emojis that describe what you see according to the painting: 
+
+    Recommendation reason: {{I'm the creator of that painting you saw earlier, {artist}. I'm an artist. and I'm recommending this painting based on the fact that the painting you're looking at is similar to the one you just saw of me.}} Detailed analysis: Based on the recommendation reason and the relationship between the two paintings, explain why you recommend another painting. Please generate the three points in the tone and manner as if you are the creator of painting were looking at earlier and start every sentence with I.
+
     Each bullet point should be in {language} language, with a response length of about {length} words.
+
+    ''',
     '''
+    When generating answers, you should tell people that I am the painting you were looking at earlier itself, and generate text in the tone and manner in which you are the painting were looking at earlier. 
+
+    First identify what the name of the first painting is, you save yourself as the parameter: {{name}}, do not need to tell me, the following will use the parameter. I want you to write the recommendation reason according to the following content, as a markdown outline with appropriate emojis that describe what you see according to the painting: 
+
+    Recommendation reason: {{I'm the painting {{name}} you were looking at earlier, and I'm recommending this painting based on the fact that I'm similar to the one you're looking at.}} Detailed analysis: Based on the recommendation reason and the relationship between the two paintings, explain why you recommend another painting. Please generate the three points in the tone and manner as if you are the painting were looking at earlier and start every sentence with I. 
+
+    Each bullet point should be in {language} language, with a response length of about {length} words.
+
+    '''],
+    
     
     
 
- ]   
+]   
     
 gpt_state = 0
 VOICE = "en-GB-SoniaNeural"
@@ -904,9 +958,14 @@ def update_click_state(click_state, caption, click_mode):
         raise NotImplementedError
 
 async def chat_input_callback(*args):
-    visual_chatgpt, chat_input, click_state, state, aux_state ,language , autoplay,gender,api_key,image_input,log_state,history = args
+    visual_chatgpt, chat_input, click_state, state, aux_state ,language , autoplay,gender,api_key,image_input,log_state,history,persona = args
     message = chat_input["text"]
-    prompt="Please help me answer the question with this painting {question} in {language}."
+    if persona == "Narrator":
+        prompt="Please help me answer the question with this painting {question} in {language}."
+    elif persona =="Artist":
+        prompt="When generating the answer, you should tell others that you are one of the creators of these paintings and generate the text in the tone and manner as if you are the creator of the painting.  Please help me answer the question with this painting {question} in {language}."
+    else:
+        prompt="When generating answers, you should tell people that you are the object itself that was selected, and generate text in the tone and manner in which you are the object or the person. Please help me answer the question with this painting {question} in {language}."
     prompt=prompt.format(question=message, language=language)
     
     if visual_chatgpt is not None:
@@ -914,7 +973,8 @@ async def chat_input_callback(*args):
         read_info = re.sub(r'[#[\]!*]','',result)
         read_info = emoji.replace_emoji(read_info,replace="")   
         state = state + [(message,result)]
-        log_state += [(message,result)]
+        log_state += [(message,"/////")]
+        log_state += [("/////",result)]
         # log_state += [("%% chat messahe %%",None)]
         
         history.append({"role": "user", "content": message})
@@ -933,9 +993,8 @@ async def chat_input_callback(*args):
         return state, state, None, audio,log_state,history
 
         
-async def upload_callback(image_input,state, log_state, visual_chatgpt=None, openai_api_key=None,language="English",narritive=None,history=None,autoplay=False,session="Session 1",task_type=0):
+async def upload_callback(image_input,state, log_state, task_type, visual_chatgpt=None, openai_api_key=None,language="English",narritive=None,history=None,autoplay=True,session="Session 1"):
     print("narritive", narritive)
-    print("image input",image_input)
     if isinstance(image_input, dict):  # if upload from sketcher_input, input contains image and mask
         image_input = image_input['background']
         
@@ -944,7 +1003,7 @@ async def upload_callback(image_input,state, log_state, visual_chatgpt=None, ope
     elif isinstance(image_input, bytes):
         image_input = Image.open(io.BytesIO(image_input))
 
-
+    
     click_state = [[], [], []]
     
     
@@ -984,16 +1043,34 @@ async def upload_callback(image_input,state, log_state, visual_chatgpt=None, ope
         visual_chatgpt.current_image = new_image_path
         paragraph = get_gpt_response(openai_api_key, new_image_path,f"What's going on in this picture? in {language}")
         # visual_chatgpt.agent.memory.buffer = visual_chatgpt.agent.memory.buffer + visual_chatgpt.global_prompt 
-        parsed_data = get_gpt_response(openai_api_key, new_image_path,"Please provide the name, artist, year of creation (including the art historical period), and painting style used for this painting. Return the information in dictionary format without any newline characters. Format as follows: { \"name\": \"Name of the painting\", \"artist\": \"Name of the artist\", \"year\": \"Year of creation (Art historical period)\", \"style\": \"Painting style used in the painting\",\"gender\": \"The gender of the author\"}")
-        print(parsed_data)
-        parsed_data = json.loads(parsed_data.replace("'", "\""))
-        name, artist, year, material,gender= parsed_data["name"],parsed_data["artist"],parsed_data["year"], parsed_data["style"],parsed_data['gender']
-        gender=gender.lower()
-        print("gender",gender)
-        
-        
-
-        
+        if task_type=="task 3":
+            name="Along the River During the Qingming Festival"
+            artist="Zhang Zeduan"
+            year="12th century (Song Dynasty)"
+            material="Chinese painting"
+            gender="male"
+        
+        elif task_type=="task 1":
+            name ="The Ambassadors"
+            artist ="Hans Holbein the Younger"
+            year = "1533 (Northern Renaissance)"
+            material="Realism"
+            gender = "male"
+                
+        elif task_type=="task 2":
+            name = "The Football Players"
+            artist= "Albert Gleizes"
+            year= "1912 (Cubism)"
+            material="Cubism"
+            gender= "male"
+            
+        else:
+            parsed_data = get_gpt_response(openai_api_key, new_image_path,"Please provide the name, artist, year of creation (including the art historical period), and painting style used for this painting. Return the information in dictionary format without any newline characters. Format as follows: { \"name\": \"Name of the painting\", \"artist\": \"Name of the artist\", \"year\": \"Year of creation (Art historical period)\", \"style\": \"Painting style used in the painting\",\"gender\": \"The gender of the author\"}")
+            print(parsed_data)
+            parsed_data = json.loads(parsed_data.replace("'", "\""))
+            name, artist, year, material,gender= parsed_data["name"],parsed_data["artist"],parsed_data["year"], parsed_data["style"],parsed_data['gender']
+            gender=gender.lower()
+                        
     if language=="English":
         if naritive_mapping[narritive]==0 :
             msg=f"🤖 Hi, I am EyeSee. Let's explore this painting '{name}' together. You can click on the area you're interested in and choose from four types of information: Description, Analysis, Interpretation, and Judgment. Based on your selection, I will provide you with the relevant information."
@@ -1033,7 +1110,7 @@ async def upload_callback(image_input,state, log_state, visual_chatgpt=None, ope
                                                                                                                                                                                                                                                                                          
 
     return [state, state, image_input, click_state, image_input, image_input, image_input, image_input, image_embedding, \
-        original_size, input_size] + [f"Name: {name}", f"Artist: {artist}", f"Year: {year}", f"Style: {material}"]*4 + [paragraph,artist, gender,new_image_path,log_state,history,audio_output,task_type]
+        original_size, input_size] + [f"Name: {name}", f"Artist: {artist}", f"Year: {year}", f"Style: {material}"]*4 + [paragraph,artist, gender,new_image_path,log_state,history,audio_output]
 
 
 
@@ -1103,7 +1180,7 @@ def inference_click(image_input, point_prompt, click_mode, enable_wiki, language
         Image.open(out["crop_save_path"]).save(new_crop_save_path)
         print("new crop save",new_crop_save_path)
 
-    yield state, state, click_state, image_input_nobackground, click_index_state, input_mask_state, input_points_state, input_labels_state, out_state,new_crop_save_path,image_input_nobackground
+    return state, state, click_state, image_input_nobackground, click_index_state, input_mask_state, input_points_state, input_labels_state, out_state,new_crop_save_path,image_input_nobackground
     
 
 query_focus_en = [
@@ -1134,7 +1211,11 @@ async def submit_caption(naritive, state,length, sentiment, factuality, language
     print("input_labels_state",input_labels_state)
         
     prompt=generate_prompt(focus_type,paragraph,length,sentiment,factuality,language, naritive)
-    
+    print("log state",log_state[-1])
+    if log_state[-1][0] is None or not log_state[-1][0].startswith("%%"):
+        log_state =  log_state + [("No like/dislike", None)] 
+        log_state =  log_state + [("%% user interaction %%",None)]
+        
     log_state =  log_state + [("Selected image point: {}, Input label: {}".format(input_points_state, input_labels_state), None)] 
     
     
@@ -1147,7 +1228,7 @@ async def submit_caption(naritive, state,length, sentiment, factuality, language
     # if not args.disable_gpt and text_refiner:
     if not args.disable_gpt:
         print("new crop save",new_crop_save_path)
-        focus_info=get_gpt_response(openai_api_key,new_crop_save_path,prompt,history)
+        focus_info=get_gpt_response(openai_api_key,new_crop_save_path,prompt)
         if focus_info.startswith('"') and focus_info.endswith('"'):
             focus_info=focus_info[1:-1]
         focus_info=focus_info.replace('#', '')
@@ -1204,7 +1285,7 @@ async def submit_caption(naritive, state,length, sentiment, factuality, language
         return state, state, click_index_state, input_mask_state, input_points_state, input_labels_state, out_state, None,None,log_state,history
 
 
-naritive_mapping = {"Third-person": 0, "Single-Persona: Artist": 1, "Multi-Persona: Objects": 2}
+naritive_mapping = {"Narrator": 0, "Artist": 1, "In-Situ": 2}
 
 def generate_prompt(focus_type, paragraph,length, sentiment, factuality, language,naritive):
     
@@ -1658,51 +1739,81 @@ async def texttospeech(text, language,gender='female'):
         print(f"Error in texttospeech: {e}")
         return None
 
+async def get_recommendation(new_crop,image_path,openai_api_key,language,autoplay,length,log_state,sort_score,narritive,state,recommend_type,artist,recomended_path):
+    
+    if recommend_type=="Item":
+        persona=naritive_mapping[narritive]
+        prompt=recommendation_prompt[0][persona].format(language=language,length=length)
+        image_paths=[new_crop,recomended_path]
+        result=get_gpt_response(openai_api_key, image_paths, prompt)
+        print("recommend result",result)
+        state += [(None, f"{result}")]
+        log_state += [("User wants to know object recomendation reason", None)]
+        log_state = log_state + [(narritive, None)]
+        log_state = log_state + [(f"image sort ranking {sort_score}", None)]
+        log_state = log_state + [(None, f"{result}")]
+        read_info = re.sub(r'[#[\]!*]','',result)
+        read_info = emoji.replace_emoji(read_info,replace="")  
+        print("associate",read_info)
+        audio_output=None
+        if autoplay:
+            audio_output = await texttospeech(read_info, language)
+        return state,state,audio_output,log_state,index,gr.update(value=[])
+    else:
+        persona=naritive_mapping[narritive]
+        
+        if persona==1:
+            prompt=recommendation_prompt[1][persona].format(language=language,length=length,artist=artist[8:])
+        else:
+            prompt=recommendation_prompt[1][persona].format(language=language,length=length)
+        image_paths=[image_path,recomended_path]
+        result=get_gpt_response(openai_api_key, image_paths, prompt )
+        print("recommend result",result)
+        state += [(None, f"{result}")]
+        log_state += [("User wants to know style recomendation reason", None)]
+        log_state = log_state + [(narritive, None)]
+        log_state = log_state + [(f"image sort ranking {sort_score}", None)]
+        log_state = log_state + [(None, f"{result}")]
+        read_info = re.sub(r'[#[\]!*]','',result)
+        read_info = emoji.replace_emoji(read_info,replace="")  
+        print("associate",read_info)
+        audio_output=None
+        if autoplay:
+            audio_output = await texttospeech(read_info, language)
+        return state,state,audio_output,log_state,index,gr.update(value=[])
+
+
 # give the reason of recommendation
-async def associate(image_path,new_crop,openai_api_key,language,autoplay,length,log_state,sort_score,narritive,evt: gr.SelectData):
-    persona=naritive_mapping[narritive]
+async def item_associate(new_crop,openai_api_key,language,autoplay,length,log_state,sort_score,narritive,state,evt: gr.SelectData):
     rec_path=evt._data['value']['image']['path']
-    index=evt.index
-    print("rec_path",rec_path)
-    prompt=recommendation_prompt[persona].format(language=language,length=length)
-    if new_crop:
-        image_paths=[new_crop,rec_path]
-    else:
-        image_paths=[image_path,rec_path]
-    result=get_gpt_response(openai_api_key, image_paths, prompt)
-    print("recommend result",result)
-    reason = [(None, f"{result}")]
-    log_state = log_state + [(narritive, None)]
-    log_state = log_state + [(f"image sort ranking {sort_score}", None)]
-    log_state = log_state + [(None, f"{result}")]
-    read_info = re.sub(r'[#[\]!*]','',result)
-    read_info = emoji.replace_emoji(read_info,replace="")  
-    print("associate",read_info)
-    audio_output=None
-    if autoplay:
-        audio_output = await texttospeech(read_info, language)
-    return reason,audio_output,log_state,index,gr.update(value=[])
+    return state,state,None,log_state,None,gr.update(value=[]),rec_path,rec_path,"Item"
+
+
+async def style_associate(image_path,openai_api_key,language,autoplay,length,log_state,sort_score,narritive,state,artist,evt: gr.SelectData):
+    rec_path=evt._data['value']['image']['path']
+    return state,state,None,log_state,None,gr.update(value=[]),rec_path, rec_path,"Style"
+
 
-def change_naritive(session_type,image_input, chatbot, state, click_state, paragraph, origin_image,narritive,language="English"):
+def change_naritive(session_type,image_input, state, click_state, paragraph, origin_image,narritive,task_instruct,gallery_output,style_gallery_result,reco_reasons,language="English"):
     if session_type=="Session 1":
-        return None, [], [], [[], [], []], "", None, []
+        return None, [], [], [[], [], []], "", None, None, [], [],[],[],gr.update(value="Preview")
     else:
         if language=="English":
-            if narritive=="Third-person" :
+            if narritive=="Narrator" :
                 state += [
                 (
                     None,
                     f"🤖 Hi, I am EyeSee. Let's explore this painting together."
                 )
                 ]
-            elif narritive=="Single-Persona: Artist":
+            elif narritive=="Artist":
                 state += [
                 (
                     None,
                     f"🧑‍🎨 Let's delve into it from the perspective of the artist."
                 )
                 ]
-            elif narritive=="Multi-Persona: Objects":
+            elif narritive=="In-Situ":
                 state += [
                 (
                     None,
@@ -1710,21 +1821,21 @@ def change_naritive(session_type,image_input, chatbot, state, click_state, parag
                 )
                 ]
         elif language=="Chinese":
-            if narritive=="Third-person" :
+            if narritive=="Narrator" :
                 state += [
                     (
                         None,
                         "🤖 让我们从第三方视角一起探索这幅画吧。"
                     )
                 ]
-            elif narritive == "Single-Persona: Artist":
+            elif narritive == "Artist":
                 state += [
                 (
                     None,
                     "🧑‍🎨 让我们从艺术家的视角深入探索这幅画。"
                 )
             ]
-            elif narritive == "Multi-Persona: Objects":
+            elif narritive == "In-Situ":
                 state += [
                 (
                     None,
@@ -1732,7 +1843,8 @@ def change_naritive(session_type,image_input, chatbot, state, click_state, parag
                 )
             ]
 
-        return image_input, state, state, click_state, paragraph, origin_image
+
+        return image_input, state, state, click_state, paragraph, origin_image,task_instruct,gallery_output,style_gallery_result,reco_reasons,reco_reasons,gr.update(value="Preview")
 
 
 def print_like_dislike(x: gr.LikeData,state,log_state):
@@ -1748,7 +1860,7 @@ def print_like_dislike(x: gr.LikeData,state,log_state):
     return log_state,state
 
 def get_recommendationscore(index,score,log_state):
-    log_state+=[(f"Picture {index} : {score}",None)]
+    log_state+=[(f"{index} : {score}",None)]
     log_state+=[("%% recommendation %%",None)]
     return log_state
     
@@ -1776,10 +1888,9 @@ def create_ui():
     description = """<p>Gradio demo for EyeSee Anything in Art, image to dense captioning generation with various language styles. To use it, simply upload your image, or click one of the examples to load them. """
 
     examples = [
-        ["test_images/1.The Ambassadors.jpg","test_images/task1.jpg"],
-        ["test_images/2.Football Players.jpg","test_images/task2.jpg"],
-        ["test_images/3.Along the River during the Qingming Festival.jpeg","test_images/task3.jpg"],
-        # ["test_images/test3.jpg"],
+        ["test_images/1.The Ambassadors.jpg","test_images/task1.jpg","task 1"],
+        ["test_images/2.Football Players.jpg","test_images/task2.jpg","task 2"],
+        ["test_images/3-square.jpg","test_images/task3.jpg","task 3"],
         # ["test_images/test4.jpg"],
         # ["test_images/test5.jpg"],
         # ["test_images/Picture5.png"],
@@ -1796,7 +1907,7 @@ def create_ui():
         log_state=gr.State([])
         # history log for gpt
         history_log=gr.State([])
-        task_type=gr.State(0)
+        
         out_state = gr.State(None)
         click_state = gr.State([[], [], []])
         origin_image = gr.State(None)
@@ -1823,21 +1934,34 @@ def create_ui():
         # store the whole image path 
         image_path=gr.State('')
         pic_index=gr.State(None)
+        recomended_state=gr.State([])
+        
+        recomended_path=gr.State(None)
+        recomended_type=gr.State(None)
+        
    
         
-        with gr.Row():
-            auto_play = gr.Checkbox(
-            label="Check to autoplay audio", value=False, elem_classes="custom-autoplay"
-        )
-            output_audio = gr.HTML(
-                label="Synthesised Audio", elem_classes="custom-output"
-            )
+
         with gr.Row():  
-            with gr.Column(scale=1,min_width=50,visible=False) as instruct:
-                task_instuction=gr.Image(type="pil", interactive=True, elem_classes="task_instruct",height=650,label=None)                    
+            
             with gr.Column(scale=6):
                 with gr.Column(visible=False) as modules_not_need_gpt:
-                    
+                    with gr.Row():
+                        naritive = gr.Radio(
+                        choices=["Narrator", "Artist","In-Situ"],
+                        value="Narrator",
+                        label="Select Mode",
+                        scale=5,
+                        interactive=True) 
+                        
+                        add_button = gr.Button(value="Extend Area", interactive=True,elem_classes="tools_button_add",icon=add_icon_path)
+                        minus_button = gr.Button(value="Remove Area", interactive=True,elem_classes="tools_button",icon=minus_icon_path)
+                        clear_button_click = gr.Button(value="Reset", interactive=True,elem_classes="tools_button",icon="assets/icons/recycle.png") 
+                                                
+                        auto_play = gr.Checkbox(
+                        label="Check to autoplay audio", value=True, elem_classes="custom-autoplay",visible=False)
+                        output_audio = gr.HTML(
+                            label="Synthesised Audio", elem_classes="custom-output", visible=False)
                     with gr.Tab("Base(GPT Power)",visible=False) as base_tab:
                         image_input_base = gr.Image(type="pil", interactive=True, elem_classes="image_upload",height=650)
                         with gr.Row():
@@ -1854,49 +1978,32 @@ def create_ui():
                             year_label_base2 = gr.Button(value="Year: ",elem_classes="info_btn_interact")
                             material_label_base2 = gr.Button(value="Style: ",elem_classes="info_btn")  
 
-                    with gr.Tab("Click") as click_tab:
-                        with gr.Row():
-                            with gr.Column(scale=10,min_width=600):
-                                image_input = gr.Image(type="pil", interactive=True, elem_classes="image_upload",height=650)
-                                example_image = gr.Image(type="pil", interactive=False, visible=False)
+                    with gr.Row():
+                        with gr.Column(scale=1,min_width=50,visible=False) as instruct:
+                            task_instuction=gr.Image(type="pil", interactive=False, elem_classes="task_instruct",height=650,label="Instruction")        
+                        with gr.Column(scale=6):
+                            with gr.Tab("Click") as click_tab:
                                 with gr.Row():
-                                    name_label = gr.Button(value="Name: ",elem_classes="info_btn")
-                                    artist_label = gr.Button(value="Artist: ",elem_classes="info_btn_interact")
-                                    year_label = gr.Button(value="Year: ",elem_classes="info_btn_interact")
-                                    material_label = gr.Button(value="Style: ",elem_classes="info_btn")
-                            
-     
-
-                            
-                            # example_image_click = gr.Image(type="pil", interactive=False, visible=False)
-                            # the tool column
-                            with gr.Column(scale=1,elem_id="tool_box",min_width=80):
-                                add_button = gr.Button(value="Extend Area", interactive=True,elem_classes="tools_button_add",icon=add_icon_path)
-                                minus_button = gr.Button(value="Remove Area", interactive=True,elem_classes="tools_button",icon=minus_icon_path)
-                                clear_button_click = gr.Button(value="Reset", interactive=True,elem_classes="tools_button")
-                                focus_d = gr.Button(value="Describe",interactive=True,elem_classes="function_button",variant="primary") 
-                                focus_da = gr.Button(value="D+Analysis",interactive=True,elem_classes="function_button",variant="primary") 
-                                focus_dai = gr.Button(value="DA+Interprete",interactive=True,elem_classes="function_button",variant="primary") 
-                                focus_dda = gr.Button(value="Judge",interactive=True,elem_classes="function_button",variant="primary")
-
-                                recommend_btn = gr.Button(value="Recommend",interactive=True,elem_classes="function_button_rec")
+                                    with gr.Column(scale=10,min_width=600):
+                                        image_input = gr.Image(type="pil", interactive=True, elem_classes="image_upload",height=650)
+                                        example_image = gr.Image(type="pil", interactive=False, visible=False)
+                                    # example_image_click = gr.Image(type="pil", interactive=False, visible=False)
+                                    # the tool column
+                                    with gr.Column(scale=1,elem_id="tool_box",min_width=80):
+                                        name_label = gr.Button(value="Name: ",elem_classes="info_btn")
+                                        artist_label = gr.Button(value="Artist: ",elem_classes="info_btn_interact")
+                                        year_label = gr.Button(value="Year: ",elem_classes="info_btn_interact")
+                                        material_label = gr.Button(value="Style: ",elem_classes="info_btn")
+
+                                        focus_d = gr.Button(value="Describe",interactive=True,elem_classes="function_button") 
+                                        focus_da = gr.Button(value="D+Analysis",interactive=True,elem_classes="function_button") 
+                                        focus_dai = gr.Button(value="DA+Interprete",interactive=True,elem_classes="function_button") 
+                                        focus_dda = gr.Button(value="Judge",interactive=True,elem_classes="function_button")
+
+                                        recommend_btn = gr.Button(value="Recommend",interactive=True,elem_classes="function_button_rec")
                                 # focus_asso = gr.Button(value="Associate",interactive=True,elem_classes="function_button",variant="primary")
+
                         
-                        with gr.Row(visible=False):
-                            with gr.Column():                                                                          
-                                with gr.Row():
-                                    # point_prompt = gr.Radio(
-                                    #     choices=["Positive", "Negative"],
-                                    #     value="Positive",
-                                    #     label="Point Prompt",
-                                    #     scale=5,
-                                    #     interactive=True)
-                                    click_mode = gr.Radio(
-                                        choices=["Continuous", "Single"],
-                                        value="Continuous",
-                                        label="Clicking Mode",
-                                        scale=5,
-                                        interactive=True)
 
                                                                     
                     with gr.Tab("Trajectory (beta)", visible=False) as traj_tab:
@@ -1953,6 +2060,7 @@ def create_ui():
             with gr.Column(scale=4):                    
                 with gr.Column(visible=True) as module_key_input:
                     openai_api_key = gr.Textbox(
+                        value="sk-proj-bxHhgjZV8TVgd1IupZrUT3BlbkFJvrthq6zIxpZVk3vwsvJ9",
                         placeholder="Input openAI API key",
                         show_label=False,
                         label="OpenAI API Key",
@@ -1969,27 +2077,28 @@ def create_ui():
                 #     with gr.Column(visible=False) as modules_need_gpt2: 
                 #         paragraph_output = gr.Textbox(lines=16, label="Describe Everything", max_lines=16)
                 #         cap_everything_button = gr.Button(value="Caption Everything in a Paragraph", interactive=True)
+                with gr.Column(visible=False) as modules_not_need_gpt2: 
+                            with gr.Blocks():
+                                chatbot = gr.Chatbot(label="Chatbox", elem_classes="chatbot",likeable=True,height=750,bubble_full_width=False)
+                                with gr.Column() as modules_need_gpt3:
+                                    chat_input = gr.MultimodalTextbox(interactive=True, file_types=[".txt"], placeholder="Message EyeSee...", show_label=False)
+                                    with gr.Row(): 
+                                        clear_button_text = gr.Button(value="Clear Chat", interactive=True)
+                                        export_button = gr.Button(value="Export Chat Log", interactive=True, variant="primary")
+                            with gr.Row(visible=False):
+                                with gr.Column():                                                                          
+                                    with gr.Row():
+                                        click_mode = gr.Radio(
+                                            choices=["Continuous", "Single"],
+                                            value="Continuous",
+                                            label="Clicking Mode",
+                                            scale=5,
+                                            interactive=True)
                 
     
 
-                with gr.Column(visible=False) as modules_not_need_gpt2:
-                    with gr.Row():     
-                        naritive = gr.Radio(
-                        choices=["Third-person", "Single-Persona: Artist","Multi-Persona: Objects"],
-                        value="Third-person",
-                        label="Persona",
-                        scale=5,
-                        interactive=True)  
-                    with gr.Blocks():
-                        chatbot = gr.Chatbot(label="Chatbox", elem_classes="chatbot",likeable=True,height=600,bubble_full_width=False)
-                        with gr.Column() as modules_need_gpt3:
-                            chat_input = gr.MultimodalTextbox(interactive=True, file_types=[".txt"], placeholder="Message EyeSee...", show_label=False)
-                            with gr.Row(): 
-                                clear_button_text = gr.Button(value="Clear Chat", interactive=True)
-                                export_button = gr.Button(value="Export Chat Log", interactive=True, variant="primary")
-                                # submit_button_text = gr.Button(value="Send", interactive=True, variant="primary")
-                                # upvote_btn = gr.Button(value="👍 Upvote", interactive=True) 
-                                # downvote_btn = gr.Button(value="👎 Downvote", interactive=True)
+                
+
                     
                     
 
@@ -2012,27 +2121,59 @@ def create_ui():
         
         with gr.Row():
             with gr.Column(scale=6):
-                with gr.Column(visible=False) as recommend:
-                    sort_rec=gr.Dropdown(["1", "2", "3", "4"], 
-                                value=[], 
-                                multiselect=True, 
-                                    label="Score", info="Please sort the pictures according to your preference"
-                    )
+                with gr.Row():
+                    with gr.Column(visible=False) as recommend:
+        
+                        # sort_rec=gr.Dropdown(["1", "2", "3", "4"], visible=False,
+                        #             value=[], 
+                        #             multiselect=True, 
+                        #                 label="Score", info="Please sort the pictures according to your preference"
+                        # )
+
+                        gallery_result = gr.Gallery(
+                        label="Object-based Recommendation",
+                        height="auto",
+                        columns=2,
+                        interactive=False
+                        # columns=4, 
+                        # rows=2,
+                        # show_label=False, 
+                        # allow_preview=True, 
+                        # object_fit="contain", 
+                        # height="auto", 
+                        # preview=True, 
+                        # show_share_button=True, 
+                        # show_download_button=True
+                        )
                     
-                    gallery_result = gr.Gallery(
-                    label="Recommendations",
-                    height="auto",
-                    columns=4
-                    # columns=4, 
-                    # rows=2,
-                    # show_label=False, 
-                    # allow_preview=True, 
-                    # object_fit="contain", 
-                    # height="auto", 
-                    # preview=True, 
-                    # show_share_button=True, 
-                    # show_download_button=True
-                    )
+                        style_gallery_result = gr.Gallery(
+                        label="Style-based Recommendation",
+                        height="auto",
+                        columns=2,
+                        interactive=False
+                        # columns=4, 
+                        # rows=2,
+                        # show_label=False, 
+                        # allow_preview=True, 
+                        # object_fit="contain", 
+                        # height="auto", 
+                        # preview=True, 
+                        # show_share_button=True, 
+                        # show_download_button=True
+                        )
+                    with gr.Column(scale=3):
+                        selected_image = gr.Image(label="Selected Image", interactive=False)
+                    
+                    sort_rec = gr.Radio(
+                            choices=[1,2,3,4,5,6,7],
+                            label="Score",
+                            interactive=True,info="Please sort the recommendation artwork")    
+                    
+                    recommend_type = gr.Radio(
+                            choices=["Preview","Reasons"],
+                            label="Information Type",
+                            value="Preview",
+                            interactive=True,visible=False)   
                     
 
             with gr.Column(scale=4,visible=False) as reco_reasons:
@@ -2040,12 +2181,13 @@ def create_ui():
                 recommend_score = gr.Radio(
                             choices=[1,2,3,4,5,6,7],
                             label="Score",
-                            interactive=True)             
+                            interactive=True,info='Please score the recommendation reasons')             
         
         with gr.Row():
+            task_type = gr.Textbox(visible=False)
             gr.Examples(
         examples=examples,
-        inputs=[example_image,task_instuction],
+        inputs=[example_image,task_instuction,task_type],
         )                
             
         
@@ -2170,6 +2312,7 @@ def create_ui():
                                 interactive=True,
                                 label="Generated Caption Length",
                             )
+            
             # auto_play = gr.Checkbox(
             # label="Check to autoplay audio", value=False, elem_classes="custom-autoplay"
         # )
@@ -2217,17 +2360,30 @@ def create_ui():
         recommend_btn.click(
             fn=infer,
             inputs=[new_crop_save_path,image_path,state,language,task_type],
-            outputs=[gallery_result,chatbot,state]
+            outputs=[gallery_result,style_gallery_result,chatbot,state]
             )
 
         gallery_result.select(
-            associate,
-            inputs=[image_path,new_crop_save_path,openai_api_key,language,auto_play,length,log_state,sort_rec,naritive],
-            outputs=[recommend_bot,output_audio,log_state,pic_index,recommend_score],
+            item_associate,
+            inputs=[new_crop_save_path,openai_api_key,language,auto_play,length,log_state,sort_rec,naritive,recomended_state],
+            outputs=[recommend_bot,recomended_state,output_audio,log_state,pic_index,recommend_score,selected_image,recomended_path, recomended_type],
             
             
         )
         
+        style_gallery_result.select(
+            style_associate,
+            inputs=[image_path,openai_api_key,language,auto_play,length,log_state,sort_rec,naritive,recomended_state,artist_label],
+            outputs=[recommend_bot,recomended_state,output_audio,log_state,pic_index,recommend_score,selected_image,recomended_path,recomended_type],
+            
+            
+        )
+        
+        selected_image.select(
+            get_recommendation,
+            inputs=[new_crop_save_path,image_path, openai_api_key,language,auto_play,length,log_state,sort_rec,naritive,recomended_state,recomended_type,artist_label,recomended_path],
+            outputs=[recommend_bot,recomended_state,output_audio,log_state,pic_index,recommend_score])
+        
         ###############################################################################
         ############# above part is for text to image #############
         ###############################################################################
@@ -2444,11 +2600,18 @@ def create_ui():
 
         # cap_everything_button.click(cap_everything, [paragraph, visual_chatgpt, language,auto_play], 
         #                             [paragraph_output,output_audio])
-        
+        def reset_and_add(origin_image):
+            new_prompt = "Positive"
+            new_add_icon = "assets/icons/plus-square-blue.png"
+            new_add_css = "tools_button_clicked"
+            new_minus_icon = "assets/icons/minus-square.png"
+            new_minus_css= "tools_button" 
+            return [[],[],[]],origin_image, new_prompt, gr.update(icon=new_add_icon,elem_classes=new_add_css), gr.update(icon=new_minus_icon,elem_classes=new_minus_css)
+            
         clear_button_click.click(
-            lambda x: ([[], [], []], x),
+            reset_and_add,
             [origin_image],
-            [click_state, image_input],
+            [click_state, image_input,point_prompt,add_button,minus_button],
             queue=False,
             show_progress=False
         )
@@ -2503,11 +2666,11 @@ def create_ui():
         #                     name_label_base2, artist_label_base2, year_label_base2, material_label_base2,name_label_traj, artist_label_traj, year_label_traj, material_label_traj, \
         #                         paragraph,artist,gender,image_path])
         
-        image_input.upload(upload_callback, [image_input, state, log_state,visual_chatgpt,openai_api_key,language,naritive,history_log,auto_play,session_type,task_type],
+        image_input.upload(upload_callback, [image_input, state, log_state,task_type, visual_chatgpt,openai_api_key,language,naritive,history_log,auto_play,session_type],
                            [chatbot, state, origin_image, click_state, image_input, image_input_base, sketcher_input,image_input_base_2,
                             image_embedding, original_size, input_size,name_label,artist_label,year_label,material_label,name_label_base, artist_label_base, year_label_base, material_label_base, \
                             name_label_base2, artist_label_base2, year_label_base2, material_label_base2,name_label_traj, artist_label_traj, year_label_traj, material_label_traj, \
-                                paragraph,artist,gender,image_path,log_state,history_log,output_audio,task_type])
+                                paragraph,artist,gender,image_path,log_state,history_log,output_audio])
         
         # sketcher_input.upload(upload_callback, [sketcher_input, state, visual_chatgpt,openai_api_key],
         #                    [chatbot, state, origin_image, click_state, image_input, image_input_base, sketcher_input,image_input_base_2,
@@ -2515,26 +2678,23 @@ def create_ui():
         #                     name_label_base2, artist_label_base2, year_label_base2, material_label_base2,name_label_traj, artist_label_traj, year_label_traj, material_label_traj, \
         #                         paragraph,artist])
         
-        # image_input.upload(upload_callback, [image_input, state, visual_chatgpt, openai_api_key],
-        #                    [chatbot, state, origin_image, click_state, image_input, image_input_base, sketcher_input,
-        #                     image_embedding, original_size, input_size,name_label,artist_label,year_label,material_label,name_label_base, artist_label_base, year_label_base, material_label_base,paragraph,artist])
-        # sketcher_input.upload(upload_callback, [sketcher_input, state, visual_chatgpt, openai_api_key],
-        #                       [chatbot, state, origin_image, click_state, image_input, image_input_base, sketcher_input,
-        #                        image_embedding, original_size, input_size,name_label,artist_label,year_label,material_label,name_label_base, artist_label_base, year_label_base, material_label_base,paragraph,artist])
-        chat_input.submit(chat_input_callback, [visual_chatgpt, chat_input, click_state, state, aux_state,language,auto_play,gender,openai_api_key,image_path,log_state,history_log],
+        
+        chat_input.submit(chat_input_callback, [visual_chatgpt, chat_input, click_state, state, aux_state,language,auto_play,gender,openai_api_key,image_path,log_state,history_log,naritive],
                           [chatbot, state, aux_state,output_audio,log_state,history_log])
         # chat_input.submit(lambda: "", None, chat_input)
         chat_input.submit(lambda: {"text": ""}, None, chat_input)
-        # submit_button_text.click(chat_input_callback, [visual_chatgpt, chat_input, click_state, state, aux_state,language,auto_play],
-        #                   [chatbot, state, aux_state,output_audio])
-        # submit_button_text.click(lambda: "", None, chat_input)
-        example_image.change(upload_callback, [example_image, state, log_state, visual_chatgpt, openai_api_key,language,naritive,history_log,auto_play,session_type,task_type],
+
+        example_image.change(upload_callback, [example_image, state, log_state, task_type,  visual_chatgpt, openai_api_key,language,naritive,history_log,auto_play,session_type],
                              [chatbot, state, origin_image, click_state, image_input, image_input_base, sketcher_input,image_input_base_2,
                               image_embedding, original_size, input_size,name_label,artist_label,year_label,material_label,name_label_base, artist_label_base, year_label_base, material_label_base, \
                             name_label_base2, artist_label_base2, year_label_base2, material_label_base2,name_label_traj, artist_label_traj, year_label_traj, material_label_traj, \
-                            paragraph,artist,gender,image_path, log_state,history_log,output_audio,task_type])
+                            paragraph,artist,gender,image_path, log_state,history_log,output_audio])
 
         example_image.change(clear_chat_memory, inputs=[visual_chatgpt])
+        example_image.change(
+            lambda:([],[],[],None,[],gr.update(value="Preview")), 
+            [],
+            [gallery_result,style_gallery_result,recommend_bot,new_crop_save_path,chatbot,recommend_type])
 
         # def on_click_tab_selected():
         #     if gpt_state ==1:
@@ -2560,6 +2720,12 @@ def create_ui():
         # click_tab.select(on_click_tab_selected, outputs=[modules_need_gpt1,modules_not_need_gpt2,modules_need_gpt0,modules_need_gpt2])
         # base_tab.select(on_base_selected, outputs=[modules_need_gpt0,modules_need_gpt2,modules_not_need_gpt2,modules_need_gpt1])
         # base_tab2.select(on_base_selected, outputs=[modules_not_need_gpt2,modules_not_need_gpt2,modules_need_gpt0,modules_need_gpt1])
+        
+        def print_reason():
+            print("reason")
+            
+            
+
 
   
   
@@ -2678,21 +2844,21 @@ def create_ui():
         
         naritive.change(
             change_naritive,
-            [session_type, image_input, chatbot, state, click_state, paragraph, origin_image,naritive,language],
-            [image_input, chatbot, state, click_state, paragraph, origin_image,gallery_result],
+            [session_type, image_input, state, click_state, paragraph, origin_image,naritive,
+             task_instuction,gallery_result,style_gallery_result,recomended_state,language],
+            [image_input, chatbot, state, click_state, paragraph, origin_image,task_instuction,gallery_result,style_gallery_result,recomended_state,recommend_bot,recommend_type],
             queue=False,
             show_progress=False
         
         )
-        def session_change():
+        def change_session():
             instruction=Image.open('test_images/task4.jpg')
-            return [],instruction
-        
+            return None, [], [], [[], [], []], "", None, [],[],instruction,"task 4",[],[],[]
         
         session_type.change(
-            session_change,
+            change_session,
             [],
-            [log_state,task_instuction]
+            [image_input, chatbot, state, click_state, paragraph, origin_image,history_log,log_state,task_instuction,task_type,gallery_result,style_gallery_result,recommend_bot]
         )
         
         # upvote_btn.click(