From eb9dc2bb9b53b1440cfcf648943fdc6230ccac3d Mon Sep 17 00:00:00 2001
From: milochen0418 <milo_chen@mail2000.com.tw>
Date: Fri, 12 May 2023 10:25:35 +0800
Subject: [PATCH 1/3] [Fix 71] Add example using pc.upload

---
 upload/.gitignore         |   4 +++
 upload/assets/favicon.ico | Bin 0 -> 15406 bytes
 upload/pcconfig.py        |  10 ++++++++
 upload/requirements.txt   |   1 +
 upload/upload/__init__.py |   0
 upload/upload/upload.py   |  50 ++++++++++++++++++++++++++++++++++++++
 6 files changed, 65 insertions(+)
 create mode 100644 upload/.gitignore
 create mode 100644 upload/assets/favicon.ico
 create mode 100644 upload/pcconfig.py
 create mode 100644 upload/requirements.txt
 create mode 100644 upload/upload/__init__.py
 create mode 100644 upload/upload/upload.py

diff --git a/upload/.gitignore b/upload/.gitignore
new file mode 100644
index 00000000..3ea4b7ab
--- /dev/null
+++ b/upload/.gitignore
@@ -0,0 +1,4 @@
+pynecone.db
+.web
+__pycache__/
+*.py[cod]
\ No newline at end of file
diff --git a/upload/assets/favicon.ico b/upload/assets/favicon.ico
new file mode 100644
index 0000000000000000000000000000000000000000..8a93bfa72ad182e4a21385b6daac8106eb16158e
GIT binary patch
literal 15406
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
CTt?CW

literal 0
HcmV?d00001

diff --git a/upload/pcconfig.py b/upload/pcconfig.py
new file mode 100644
index 00000000..dc078a1c
--- /dev/null
+++ b/upload/pcconfig.py
@@ -0,0 +1,10 @@
+import pynecone as pc
+
+class UploadConfig(pc.Config):
+    pass
+
+config = UploadConfig(
+    app_name="upload",
+    db_url="sqlite:///pynecone.db",
+    env=pc.Env.DEV,
+)
diff --git a/upload/requirements.txt b/upload/requirements.txt
new file mode 100644
index 00000000..0c427fb4
--- /dev/null
+++ b/upload/requirements.txt
@@ -0,0 +1 @@
+pynecone>=0.1.29
\ No newline at end of file
diff --git a/upload/upload/__init__.py b/upload/upload/__init__.py
new file mode 100644
index 00000000..e69de29b
diff --git a/upload/upload/upload.py b/upload/upload/upload.py
new file mode 100644
index 00000000..e7e84f20
--- /dev/null
+++ b/upload/upload/upload.py
@@ -0,0 +1,50 @@
+import os
+import pynecone as pc
+from typing import List
+class State(pc.State):
+    """The app state."""
+    files_path:str = f".web/public/files/"
+    str_files:str=""
+    async def handle_upload(self, files: List[pc.UploadFile]):
+        if(False is os.path.exists(self.files_path)):
+            os.makedirs(self.files_path, 0o755)
+        for file in files:
+            upload_data = await file.read()
+            output_filepath = self.files_path + file.filename
+            with open(output_filepath, "wb") as file_object:
+                file_object.write(upload_data)
+        filelist = os.listdir(self.files_path)
+        self.str_files = ""
+        for filename in filelist:
+            self.str_files = self.str_files+filename+"\n"
+
+def index():
+    return pc.vstack(
+        pc.hstack(
+            pc.button(
+                "Upload", 
+                on_click=lambda: State.handle_upload(pc.upload_files())
+            ),
+        ),
+        pc.upload(
+            pc.button("Select File", height="70px", width="200px"),
+            pc.text("Drag and drop files here or click to select files", height="100px", width="200px"),
+            border="1px dotted black",
+            padding="2em",
+        ),
+        pc.text_area(
+            is_disabled=True,
+            value=State.str_files,
+            width="100%",
+            height="100%",
+            bg="white",
+            color="black",
+            placeholder="Response",
+            min_height="20em",
+        ),
+    )
+
+# Add state and page to the app.
+app = pc.App(state=State)
+app.add_page(index, title="Upload")
+app.compile()
\ No newline at end of file

From 844e7ab04b566d4d57e3d858597e91ccaffc106c Mon Sep 17 00:00:00 2001
From: milochen0418 <milo_chen@mail2000.com.tw>
Date: Fri, 12 May 2023 12:14:55 +0800
Subject: [PATCH 2/3] add progress effect when uploading

---
 upload/upload/upload.py | 38 ++++++++++++++++++++++++++++++--------
 1 file changed, 30 insertions(+), 8 deletions(-)

diff --git a/upload/upload/upload.py b/upload/upload/upload.py
index e7e84f20..2881dc42 100644
--- a/upload/upload/upload.py
+++ b/upload/upload/upload.py
@@ -1,11 +1,16 @@
 import os
+import asyncio
 import pynecone as pc
 from typing import List
+
 class State(pc.State):
     """The app state."""
     files_path:str = f".web/public/files/"
     str_files:str=""
+    is_uploading:bool=False
+
     async def handle_upload(self, files: List[pc.UploadFile]):
+        self.is_uploading = True
         if(False is os.path.exists(self.files_path)):
             os.makedirs(self.files_path, 0o755)
         for file in files:
@@ -13,6 +18,13 @@ async def handle_upload(self, files: List[pc.UploadFile]):
             output_filepath = self.files_path + file.filename
             with open(output_filepath, "wb") as file_object:
                 file_object.write(upload_data)
+        return self.show_files
+    
+    async def show_files(self):
+        await asyncio.sleep(1.0)
+        self.is_uploading = False
+        if(False is os.path.exists(self.files_path)):
+            os.makedirs(self.files_path, 0o755)
         filelist = os.listdir(self.files_path)
         self.str_files = ""
         for filename in filelist:
@@ -20,18 +32,28 @@ async def handle_upload(self, files: List[pc.UploadFile]):
 
 def index():
     return pc.vstack(
-        pc.hstack(
-            pc.button(
-                "Upload", 
-                on_click=lambda: State.handle_upload(pc.upload_files())
-            ),
-        ),
         pc.upload(
             pc.button("Select File", height="70px", width="200px"),
             pc.text("Drag and drop files here or click to select files", height="100px", width="200px"),
             border="1px dotted black",
             padding="2em",
         ),
+        pc.hstack(
+            pc.button(
+                "Upload", 
+                on_click=State.handle_upload(pc.upload_files()),
+            ),
+            pc.button(
+                "Refresh", 
+                on_click=State.show_files,
+            ),
+        ),
+        pc.heading("Files:"),
+        pc.cond(
+            State.is_uploading,
+            pc.progress(is_indeterminate=True, color="blue", width="100%"),
+            pc.progress(value=0, width="100%"),
+        ),
         pc.text_area(
             is_disabled=True,
             value=State.str_files,
@@ -39,12 +61,12 @@ def index():
             height="100%",
             bg="white",
             color="black",
-            placeholder="Response",
+            placeholder="No File",
             min_height="20em",
         ),
     )
 
 # Add state and page to the app.
-app = pc.App(state=State)
+app = pc.App(state=State, on_load=State.show_files())
 app.add_page(index, title="Upload")
 app.compile()
\ No newline at end of file

From 71154f7e690f2b1ba4ea889c32f3b0043e915b8f Mon Sep 17 00:00:00 2001
From: milochen0418 <milo_chen@mail2000.com.tw>
Date: Fri, 12 May 2023 12:25:15 +0800
Subject: [PATCH 3/3] improve style of select button

---
 upload/upload/upload.py | 12 ++++++++++--
 1 file changed, 10 insertions(+), 2 deletions(-)

diff --git a/upload/upload/upload.py b/upload/upload/upload.py
index 2881dc42..7cc6461a 100644
--- a/upload/upload/upload.py
+++ b/upload/upload/upload.py
@@ -8,7 +8,6 @@ class State(pc.State):
     files_path:str = f".web/public/files/"
     str_files:str=""
     is_uploading:bool=False
-
     async def handle_upload(self, files: List[pc.UploadFile]):
         self.is_uploading = True
         if(False is os.path.exists(self.files_path)):
@@ -30,10 +29,19 @@ async def show_files(self):
         for filename in filelist:
             self.str_files = self.str_files+filename+"\n"
 
+color = "rgb(107,99,246)"
 def index():
     return pc.vstack(
         pc.upload(
-            pc.button("Select File", height="70px", width="200px"),
+            #pc.button("Select File", ),
+            pc.button(
+                "Select File(s)",
+                height="70px",
+                width="200px",
+                color=color,
+                bg="white",
+                border=f"1px solid {color}",
+            ),
             pc.text("Drag and drop files here or click to select files", height="100px", width="200px"),
             border="1px dotted black",
             padding="2em",