Sfoglia il codice sorgente

use progress element

Daniel Sheffield 1 anno fa
parent
commit
86e7600ef0
3 ha cambiato i file con 31 aggiunte e 8 eliminazioni
  1. 19 1
      app/rest/templates/loading.tpl
  2. 6 1
      app/rest/templates/progress.tpl
  3. 6 6
      app/rest/trend.py

+ 19 - 1
app/rest/templates/loading.tpl

@@ -17,13 +17,31 @@ body {
   position: absolute;
   left: 45vw;
   top: 45vh;
+}
+div.progress {
+  display:grid;
+  grid-template-columns: max-content max-content;
+  grid-gap:5px;
+}
+div.progress label {
+  text-align:left;
+}
+div.progress label:after {
+  content: "...";
+}
+div.progress:has(+ .done) {
+  display: none;
+}
+div.progress:has(+ .done) label:after {
+  content: "";
 }
     </style>
   </head>
   <body>
     <div class="loader-container">
 % end
-% include('progress', **progress)
+% if not end:
+%   include('progress', **progress)
 % if end:
     <meta http-equiv="Refresh" content="0;" />
   </body>

+ 6 - 1
app/rest/templates/progress.tpl

@@ -1 +1,6 @@
-<p>{{stage}} ... </p>
+% setdefault("done", False)
+% if not done:
+<div class="progress"><label for="loading-{{stage}}">{{stage}}</label><progress id="loading-{{stage}}" value="{{percent}}" max="100"/></div>
+% else:
+<div class="done"/>
+% end

+ 6 - 6
app/rest/trend.py

@@ -71,12 +71,12 @@ def trend_internal(conn: Connection[TupleRow], path: str, query: FormsDict):
                 yield abort(404, f"No data for {fields}")
                 return
             
+            progress.update({ "stage": "Preparing data", "percent": "30"})
+            yield template("loading", done=True) + template("loading", progress=progress)
+            
             in_chart = data['$/unit'].apply(lambda x: (x or False) and True)
             data = data[in_chart]
             
-            progress.update({ "stage": "Preparing data", "percent": "30"})
-            yield template("loading", progress=progress)
-            
             pivot = data.pivot_table(index=['ts_raw',], columns=['product',], values=['$/unit'], aggfunc='mean')
             pivot.columns = pivot.columns.droplevel()
             sns.set_theme(style='darkgrid', palette='pastel', context="talk")
@@ -118,12 +118,12 @@ def trend_internal(conn: Connection[TupleRow], path: str, query: FormsDict):
                 spine.set_color('#ffffff')
             
             progress.update({ "stage": "Rendering chart", "percent": "50"})
-            yield template("loading", progress=progress)
+            yield template("loading", done=True) + template("loading", progress=progress)
             
             f = StringIO()
             plt.savefig(f, format='svg')
-            progress.update({ "stage": "Done", "percent": "100", "complete": True})
-            yield template("loading", end=True, progress=progress)
+            progress.update({ "stage": "Done", "percent": "100" })
+            yield template("loading", done=True) + template("loading", end=True, progress=progress)
             
             organic = BOOLEAN.get(query.organic, None)
             action = path.split('/')[-1]