Update app.py

app.py

@@ -183,7 +183,6 @@ def generate_background(prompt: str, aspect_ratio: str) -> Image.Image:
 
 
 def create_position_grid():
-    """3x3 위치 선택 그리드를 생성하는 HTML"""
     return """
     <div class="position-grid" style="display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; width: 150px; margin: auto;">
         <button class="position-btn" data-pos="top-left" onclick="updatePosition(this)">↖</button>
@@ -208,13 +207,11 @@ def create_position_grid():
             btn.style.backgroundColor = '#2196F3';
             btn.style.color = 'white';
             
-            // position State 업데이트
-            const positionState = document.querySelector('#position-state');
-            if (positionState) {
-                positionState.value = btn.dataset.pos;
-                // 변경 이벤트 발생
-                positionState.dispatchEvent(new Event('change'));
-            }
+            // Gradio에 이벤트 발생
+            const event = new CustomEvent('position-update', {
+                detail: { position: btn.dataset.pos }
+            });
+            document.dispatchEvent(event);
         }
         
         // 초기 선택 버튼 스타일 설정
@@ -223,8 +220,6 @@ def create_position_grid():
     </script>
     """
 
-
-
 def calculate_object_position(position: str, bg_size: tuple[int, int], obj_size: tuple[int, int]) -> tuple[int, int]:
     """오브젝트의 위치 계산"""
     bg_width, bg_height = bg_size
@@ -486,11 +481,11 @@ with gr.Blocks(theme=gr.themes.Soft(), css=css) as demo:
                     scale=1
                 )
 
-
+# UI 부분에서 position State 부분 수정
             with gr.Row(visible=False) as object_controls:
                 with gr.Column(scale=1):
                     position_grid = gr.HTML(create_position_grid())
-                    position = gr.State(value="bottom-center", elem_id="position-state")
+                    position = gr.State(value="bottom-center")  # elem_id 제거
                 with gr.Column(scale=1):
                     scale_slider = gr.Slider(
                         minimum=10,
@@ -499,7 +494,7 @@ with gr.Blocks(theme=gr.themes.Soft(), css=css) as demo:
                         step=10,
                         label="Object Size (%)"
                     )
-            
+
 
             
             process_btn = gr.Button(