File size: 6,594 Bytes
82ad063
853ba2a
8418d21
e21a5db
8418d21
 
853ba2a
 
 
 
 
 
 
 
8418d21
853ba2a
8418d21
 
 
4bf4d19
853ba2a
 
 
 
 
 
 
 
 
82ad063
853ba2a
dd5ac22
b19c6c6
82ad063
 
853ba2a
 
 
82ad063
853ba2a
 
 
 
 
 
 
 
 
 
 
8ee9eb8
853ba2a
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
82ad063
e21a5db
 
 
 
 
 
 
 
853ba2a
 
 
 
 
 
 
 
 
 
 
 
 
e21a5db
853ba2a
e21a5db
 
 
 
 
 
 
853ba2a
e21a5db
853ba2a
 
 
 
 
 
 
 
8ee9eb8
853ba2a
 
 
e21a5db
853ba2a
 
 
 
 
 
 
 
 
 
 
 
 
 
e21a5db
82ad063
853ba2a
e21a5db
82ad063
8ee9eb8
853ba2a
82ad063
 
 
 
 
 
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
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
import gradio as gr

css="""
#col-container {max-width: 1400px; margin-left: auto; margin-right: auto;}
"""

# title = """
# <div style="text-align: center;max-width: 1000px;">
#     <h1>Chat with PDF</h1>
#     <p style="text-align: center;">Upload a .PDF from your computer, click the "UPLoad PDF" button,C-V your openai access token, press enter. <br />
#     when everything is ready, you can start asking questions about the pdf ;)</p>
#     <a style="display:inline-block; margin-left: 1em" href="https://huggingface.co/spaces/lei0lei/chat-pdf?duplicate=true"><img src="https://img.shields.io/badge/-Duplicate%20Space%20to%20skip%20the%20queue-blue?labelColor=white&style=flat&logo=data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAP5JREFUOE+lk7FqAkEURY+ltunEgFXS2sZGIbXfEPdLlnxJyDdYB62sbbUKpLbVNhyYFzbrrA74YJlh9r079973psed0cvUD4A+4HoCjsA85X0Dfn/RBLBgBDxnQPfAEJgBY+A9gALA4tcbamSzS4xq4FOQAJgCDwV2CPKV8tZAJcAjMMkUe1vX+U+SMhfAJEHasQIWmXNN3abzDwHUrgcRGmYcgKe0bxrblHEB4E/pndMazNpSZGcsZdBlYJcEL9Afo75molJyM2FxmPgmgPqlWNLGfwZGG6UiyEvLzHYDmoPkDDiNm9JR9uboiONcBXrpY1qmgs21x1QwyZcpvxt9NS09PlsPAAAAAElFTkSuQmCC&logoWidth=14" alt="Duplicate Space"></a>
# </div>
# """
title = """
<div style="text-align: center;max-width: 1200px;">
    <h1>Chat with PDF</h1>
</div>
"""


def toggle_sidebar(state):
    '''
    sidebar状态转换
    '''
    state = not state
    return gr.update(visible = state), state


# Gradio application setup
def _create_demo():
    with gr.Blocks(css=css,
        theme = "Soft"  # Change the theme here
        ) as demo:
        
        with gr.Row():
            with gr.Column(elem_id="col-sidebar",scale=0.1,visible=False) as sidebar:
                nothing = gr.Button('This is sidebar')
        # Create a Gradio block
            with gr.Column(elem_id="col-container"):
                gr.HTML(title)
                
                with gr.Column():
                    with gr.Row():
                        with gr.Column(scale=0.8):
                            api_key = gr.Textbox(
                                placeholder='Enter your OpenAI API key',
                                show_label=False,
                                interactive=True,
                            container=False)
                            
                        with gr.Column(scale=0.2):
                            change_api_key = gr.Button('Update API Key',interactive = False)

                    with gr.Row():
                        with gr.Column(scale=1):
                            upload_btn = gr.UploadButton("📁 Upload PDF", file_types=[".pdf"],scale=0.9)
                            sidebar_state = gr.State(False)
                            toggle_sidebar_btn = gr.Button("🫵")
                            toggle_sidebar_btn.click(toggle_sidebar, [sidebar_state], [sidebar, sidebar_state])


                    with gr.Row():
                        with gr.Column(elem_id='pdf-preview-container'):
                            show_img = gr.Image(label='PDF Preview', height=680)

                        with gr.Column(elem_id='chatbot-container'):
                            with gr.Row():
                                chatbot = gr.Chatbot(value=[], elem_id='chatbot', height=625)
                            with gr.Row():
                                
                                text_input = gr.Textbox(
                                        show_label=False,
                                        placeholder="Ask your pdf?",
                                    container=False,scale=0.9)

                                
                                submit_btn = gr.Button('💭',scale=0.1)


                return demo, api_key, change_api_key, chatbot, show_img, text_input, submit_btn, upload_btn

smbtn_css = """
#small_btn {
    margin: 0.6em 0em 0.55em 0;
    max-width: 1em;
    min-width: 1em !important;
    height: 1em;
}
"""
def create_demo():
    '''
    Interface with no api component
    '''
    with gr.Blocks(css=css,
        theme = "Soft"  # Change the theme here
        ) as demo:
        
        with gr.Row():
            with gr.Column(elem_id="col-sidebar",scale=0.1,visible=False) as sidebar:
                nothing = gr.Button('This is sidebar')
        # Create a Gradio block
            with gr.Column(elem_id="col-container"):
                
                gr.HTML(title)
                        
                with gr.Row():  
                            sidebar_state = gr.State(False)
                            toggle_sidebar_btn = gr.Button(">>",size='sm',scale=1)
                            toggle_sidebar_btn.click(toggle_sidebar, [sidebar_state], [sidebar, sidebar_state])
                        
                            upload_btn = gr.UploadButton("📁 Upload PDF", file_types=[".pdf"],scale=9)
                
                             
                with gr.Column():
                    # with gr.Row():
                    #     with gr.Column(scale=0.8):
                    #         api_key = gr.Textbox(
                    #             placeholder='Enter your OpenAI API key',
                    #             show_label=False,
                    #             interactive=True,
                    #         container=False)
                            
                    #     with gr.Column(scale=0.2):
                    #         change_api_key = gr.Button('Update API Key',interactive = False)

                    


                    with gr.Row():
                        with gr.Column(elem_id='pdf-preview-container'):
                            show_img = gr.Image(label='PDF Preview', height=680)

                        with gr.Column(elem_id='chatbot-container'):
                            with gr.Row():
                                chatbot = gr.Chatbot(value=[], elem_id='chatbot', height=625)
                            with gr.Row():
                                
                                text_input = gr.Textbox(
                                        show_label=False,
                                        placeholder="Ask your pdf?",
                                    container=False,scale=8)

                                
                                submit_btn = gr.Button('💭',scale=1)


                return demo, chatbot, show_img, text_input, submit_btn, upload_btn


if __name__ == '__main__':
    demo, api_key, change_api_key, chatbot, show_img, text_input, submit_btn, upload_btn = create_demo()
    demo.queue()
    demo.launch()