update the layout to chat style

app.py

@@ -39,23 +39,33 @@ be to the input. This pipeline requires a value of at least `1`. It's possible y
 def previous(image):
     return image 
 
-def chat(image_in, in_steps, in_guidance_scale, in_img_guidance_scale, image_hid, img_name, counter_out, image_oneup, prompt, history, progress=gr.Progress(track_tqdm=True)):
+def upload_image(file):
+    return Image.open(file)
+    
+def chat(btn_upload, image_in, in_steps, in_guidance_scale, in_img_guidance_scale, image_hid, img_name, counter_out, image_oneup, prompt, history, progress=gr.Progress(track_tqdm=True)):
     progress(0, desc="Starting...")
-    if prompt.lower() == 'reverse' : #--to add revert functionality later
+    if prompt != '' and prompt.lower() == 'reverse' : #--to add revert functionality later
         history = history or []
         temp_img_name = img_name[:-4]+str(int(time.time()))+'.png' 
         image_oneup.save(temp_img_name)
         response = 'Reverted to the last image ' + '<img src="/file=' + temp_img_name + '">'  
         history.append((prompt, response))
         return history, history, image_oneup, temp_img_name, counter_out
-    if prompt.lower() == 'restart' : #--to add revert functionality later
+    if prompt != '' and prompt.lower() == 'restart' : #--to add revert functionality later
         history = history or []
         temp_img_name = img_name[:-4]+str(int(time.time()))+'.png' 
+        #Resizing the image
+        basewidth = 512
+        wpercent = (basewidth/float(image_in.size[0]))
+        hsize = int((float(image_in.size[1])*float(wpercent)))
+        image_in = image_in.resize((basewidth,hsize), Image.Resampling.LANCZOS)
         image_in.save(temp_img_name)
         response = 'Reverted to the last image ' + '<img src="/file=' + temp_img_name + '">'  
         history.append((prompt, response))
         return history, history, image_in, temp_img_name, counter_out
-    if counter_out > 0:
+    #adding supportive sample text
+    add_text_list = ["There you go", "Enjoy your image!", "Nice work! Wonder what you gonna do next!", "Way to go!", "Does this work for you?", "Something like this?"]        
+    if counter_out > 1:
       edited_image = pipe(prompt, image=image_hid, num_inference_steps=int(in_steps), guidance_scale=float(in_guidance_scale), image_guidance_scale=float(in_img_guidance_scale)).images[0]
       if os.path.exists(img_name):
         os.remove(img_name)
@@ -65,40 +75,54 @@ def chat(image_in, in_steps, in_guidance_scale, in_img_guidance_scale, image_hid
         # Save the image to the file-like object
         edited_image.save(fp)
       #Get the name of the saved image
-      saved_image_name = fp.name
+      saved_image_name2 = fp.name
       #edited_image.save(temp_img_name) #, overwrite=True)
+      history = history or []
+      response = random.choice(add_text_list) + '<img src="/file=' + saved_image_name2 + '">'  
+      history.append((prompt, response))
       counter_out += 1
-    else:
+      return history, history, edited_image, temp_img_name, counter_out
+    elif counter_out == 0:
       seed = random.randint(0, 1000000)
       img_name = f"./edited_image_{seed}.png"
-      #Resizing the image - 512 or 300 pixels
-      basewidth = 300
+      #convert file object to image
+      image_in = Image.open(btn_upload)
+      #Resizing the image
+      basewidth = 512
       wpercent = (basewidth/float(image_in.size[0]))
       hsize = int((float(image_in.size[1])*float(wpercent)))
       image_in = image_in.resize((basewidth,hsize), Image.Resampling.LANCZOS)
-      edited_image = pipe(prompt, image=image_in, num_inference_steps=int(in_steps), guidance_scale=float(in_guidance_scale), image_guidance_scale=float(in_img_guidance_scale)).images[0]
       if os.path.exists(img_name):
         os.remove(img_name)
       with open(img_name, "wb") as fp:
+        # Save the image to the file-like object
+        image_in.save(fp)
+      #Get the name of the saved image
+      saved_image_name0 = fp.name
+      history = history or []
+      response = '<img src="/file=' + img_name + '">'   #IMG_NAME
+      history.append((prompt, response))
+      counter_out += 1
+      return history, history, image_in, img_name, counter_out
+    elif counter_out == 1:        
+      #instruct-pix2pix inference
+      edited_image = pipe(prompt, image=image_in, num_inference_steps=int(in_steps), guidance_scale=float(in_guidance_scale), image_guidance_scale=float(in_img_guidance_scale)).images[0]
+      if os.path.exists(img_name):
+        os.remove(img_name)
+      temp_img_name = img_name[:-4]+str(int(time.time()))+'.png' 
+      with open(temp_img_name, "wb") as fp:
         # Save the image to the file-like object
         edited_image.save(fp)
       #Get the name of the saved image
-      saved_image_name2 = fp.name
-    history = history or []
-    #Resizing (or not) the image for better display and adding supportive sample text
-    add_text_list = ["There you go", "Enjoy your image!", "Nice work! Wonder what you gonna do next!", "Way to go!", "Does this work for you?", "Something like this?"]
-    if counter_out > 0:
-        response = random.choice(add_text_list) + '<img src="/file=' + saved_image_name + '">'  
-        history.append((prompt, response))
-        return history, history, edited_image, temp_img_name, counter_out
-    else:
-        response = random.choice(add_text_list) + '<img src="/file=' + saved_image_name2 + '">'   #IMG_NAME
-        history.append((prompt, response))
-        counter_out += 1
-        return history, history, edited_image, img_name, counter_out
-        
+      saved_image_name1 = fp.name
+      history = history or []
+      response = random.choice(add_text_list) + '<img src="/file=' + saved_image_name1 + '">'   #IMG_NAME
+      history.append((prompt, response))
+      counter_out += 1
+      return history, history, edited_image, temp_img_name, counter_out
         
 
+#Blocks layout
 with gr.Blocks() as demo:
     gr.Markdown("""<h1><center> Chat Interface with InstructPix2Pix: Give Image Editing Instructions</h1></center>
     <p>For faster inference without waiting in the queue, you may duplicate the space and upgrade to GPU in settings.<br/>
@@ -117,15 +141,14 @@ with gr.Blocks() as demo:
     3. Now you can load larger images (~5 mb) as well
     
     <p/>""")
-    with gr.Row():
-      with gr.Column():
-        image_in = gr.Image(type='pil', label="Original Image")
-        text_in = gr.Textbox()
+    with gr.Column():
+        chatbot = gr.Chatbot()
         state_in = gr.State()
-        #with gr.Row():
-        b1 = gr.Button('Edit the image!')
-        #b2 = gr.Button('Revert!')
+        with gr.Row():
+            text_in = gr.Textbox(value='', Plaseholder="Enter your instructions here")
+            btn_upload = gr.UploadButton("Upload image", file_types=["image"], file_count="single")
         with gr.Accordion("Advance settings for Training and Inference", open=False):
+          image_in = gr.Image(visible=False,type='pil', label="Original Image")
           gr.Markdown("Advance settings for - Number of Inference steps, Guidanace scale, and Image guidance scale.")
           in_steps = gr.Number(label="Enter the number of Inference steps", value = 20)
           in_guidance_scale = gr.Slider(1,10, step=0.5, label="Set Guidance scale", value=7.5)
@@ -133,12 +156,13 @@ with gr.Blocks() as demo:
           image_hid = gr.Image(type='pil', visible=False)
           image_oneup = gr.Image(type='pil', visible=False)
           img_name_temp_out = gr.Textbox(visible=False)
-          #img_revert = gr.Checkbox(visible=True, value=False,label=to track a revert message)
           counter_out = gr.Number(visible=False, value=0, precision=0)
-      chatbot = gr.Chatbot() 
-    b1.click(chat,[image_in, in_steps, in_guidance_scale, in_img_guidance_scale, image_hid, img_name_temp_out,counter_out, image_oneup,  text_in, state_in], [chatbot, state_in, image_hid, img_name_temp_out, counter_out]) #, queue=True)
-    b1.click(previous, [image_hid], [image_oneup])
-    #b2.click(previous, image_oneup, image_hid)
+
+    btn_upload.upload(chat,
+                      [btn_upload, image_in, in_steps, in_guidance_scale, in_img_guidance_scale, image_hid, img_name_temp_out,counter_out, image_oneup,  text_in, state_in], 
+                      [chatbot, state_in, image_in, img_name_temp_out, counter_out])
+    text_in.submit(chat,[btn_upload, image_in, in_steps, in_guidance_scale, in_img_guidance_scale, image_hid, img_name_temp_out,counter_out, image_oneup,  text_in, state_in], [chatbot, state_in, image_hid, img_name_temp_out, counter_out])
+    text_in.submit(previous, [image_hid], [image_oneup])
     gr.Markdown(help_text)
     
 demo.queue(concurrency_count=10)