fix slider `working`

app.py

@@ -21,8 +21,7 @@ def result50(date=datetime.now()):
 @app.route("/")
 @app.route('/top50async/<date>/')
 def top50async(date="2020-01-12"):
-    delta = datetime.now() - datetime(2014,1,1)
-    return render_template('async_list.html', date=date, rangeDate=delta.days )
+    return render_template('async_list.html', date=date )
 
 @app.route('/top50json/<date>/')
 def top50json(date):

static/js/app.js

@@ -1,12 +1,13 @@
 
-const MIN_DATE = dayjs("2012-01-01")
-
+const MIN_DATE = dayjs("2014-01-01")
+const RANGE_MAX = dayjs().diff(MIN_DATE,"d")
 const coinTop50 = {
     data() {
       return {
         date :document.getElementById("startDate").innerText,
         items: [],
-        rangeDate:document.getElementById("startDate").getAttribute("max"),
+        rangeDate:RANGE_MAX,
+        maxRange:RANGE_MAX,
         datepicker:null
       }
     },

templates/async_list.html

@@ -51,7 +51,7 @@
           <p class="range-field">
             <label for="date">Select Date</label>
             <input type="text"  id="date" v-model="date" class="datepicker">
-            <input type="range" min="0" max="{{rangeDate}}" v-model="rangeDate" />
+            <input type="range" id="rangeDate" min="0" :max="maxRange" v-model="rangeDate" />
           </p>
         </form>
         <h4>Top 50 Cryptocurrency by market cap </h4>