pdfs fit nicley, display more pages and buttons are fixed to bottom and all inlined

matches.py

@@ -8,6 +8,7 @@ from create_db import Card, User, get_session
 bp = Blueprint('matches', __name__, url_prefix='/matches')
 
 def get_matches(user_id):
+    #@TODO this is buggy
     dbsession = get_session()
 
     list_of_matches = []
@@ -55,4 +56,4 @@ def index():
         names_by_ids[id]  = users.get(id).username
         emails_by_ids[id] = users.get(id).email 
 
-    return render_template("matches.html", username=username, list_of_matches=list_of_matches, names_by_ids=names_by_ids, emails_by_ids=emails_by_ids, users=users)
+    return render_template("matches.html", username=username, list_of_matches=list_of_matches, names_by_ids=names_by_ids, emails_by_ids=emails_by_ids, users=users)

share.py

@@ -5,13 +5,17 @@ from create_db import User, Card, get_session
 
 from hashlib import md5
 
-
+#@TODO najbrž je treba narediti tako da org card tudi dobi share id in se ostalo, kar to obsega
 def share(card, user_id):
     dbsession = get_session()
     
     #tu bi lahko naredili nek autoincrement ampak i guess da hash unique idja tudi daje unique share_id, tega potem uporabljamo, da preverimo matche
     h = md5(str(card.id).encode("utf-8")).hexdigest()
     card.share_id = h
+    
+    owner_card = dbsession.query(Card).filter(Card.id == card.id).first()
+    owner_card.share_id = h
+    dbsession.commit()
 
     # all users 
     users = dbsession.query(User).filter(User.id != user_id).all()
@@ -22,4 +26,4 @@ def share(card, user_id):
             print("sharing to, ", user.id)
             new_card = card = Card(title=card.title, interest_rate=-1.0, owner_id=user.id, item_location=card.item_location, last_review=None, share_id=h)
             dbsession.add(new_card)
-            dbsession.commit()
+            dbsession.commit()

static/style.css

@@ -138,11 +138,6 @@ html {
     height: calc(100vh - 332px);
   }
 
-
-
-
-
-
   .drop-zone {
     max-width: 200px;
     height: 200px;
@@ -170,7 +165,7 @@ html {
 
   button {
     border-radius: 0px;
-    width: 20%;
+    width: 18%;
     height: 70px;
     font-size: 130%
   }

templates/deck/index.html

@@ -3,66 +3,90 @@
 {% block header %}
 {% endblock %} 
 {% block content %}
-  <article class="post">
-    <header>
+<article class="post">
+  <header>
       <p>Download: <a href="{{ card['item_location'] }}">{{ card['title'] }}</a></p>
-    </header>
-    
-    <canvas id="pdf-doc"></canvas>
-
-    <form method="post">
-      <input type="hidden" name="card_id" value="{{ card['id'] }}">
-      <span style="display: inline;">
-        <button style="background-color: #736B1E" rbutton" type="submit" name="rate" value="Yes" accesskey="1">Yes</button> <!--ti keyi so alt+shit+key...-->
-        <button style="background-color: #ED8008;" id="rbutton" type="submit" name="rate" value="Maybe" accesskey="2">Maybe</button>
-        <button style="background-color: #ED3f1C;" id="rbutton" type="submit" name="rate" value="No" accesskey="3">No</button>
-        <button style="background-color: #BF1B1B;" id="rbutton" type="submit" name="rate" value="Delete" accesskey="d">Delete</button>
-      </span>      
-        
-      <button style="margin-top: 1rem; background-color: #D9D2C6;" type="submit" name="share" value="share" accesskey="s">Share</button>
-    </form>
+    </header>    
+    <div style="background-color: blue; height: fit-content;" id="pdf-doc"></div>
   </article>
+  
+    <form method="post" style="position: fixed; bottom:0%; width: fill-available; width: -moz-available; width: -webkit-fill-available;">
+        <input type="hidden" name="card_id" value="{{ card['id'] }}">
+        <span style="display: inline;">
+          <button style="background-color: #736B1E" id="rbutton" type="submit" name="rate" value="Yes" accesskey="1">Yes</button> <!--ti keyi so alt+shit+key...-->
+          <button style="background-color: #ED8008;" id="rbutton" type="submit" name="rate" value="Maybe" accesskey="2">Maybe</button>
+          <button style="background-color: #ED3f1C;" id="rbutton" type="submit" name="rate" value="No" accesskey="3">No</button>
+          <button style="background-color: #BF1B1B;" id="rbutton" type="submit" name="rate" value="Delete" accesskey="d">Delete</button>
+          <button style="background-color: #D9D2C6;" type="submit" name="share" value="share" accesskey="s">Share</button>
+        </span>      
+      </form>
 
   <script type="text/javascript" src="{{ url_for('static', filename='js/pdf.js') }}"></script>
   <script type="text/javascript" src="{{ url_for('static', filename='js/pdf.worker.js') }}"></script>
   <script type="text/javascript">
     document.addEventListener('DOMContentLoaded', function (){
-      var zoomed = false;
-      var canvas = document.getElementById('pdf-doc');
-      var context = canvas.getContext('2d');
 
-      var openPage = function(pdfFile, pageNumber) {
-          pdfFile.getPage(pageNumber).then(function(page) {
-            var scale = 1.5;
-            var viewport = page.getViewport({ scale: scale, });
-            // Support HiDPI-screens.
-            var outputScale = window.devicePixelRatio || 1;
+      var currPage = 1; //Pages are 1-based not 0-based
+      var numPages = 0;
+      var thePDF = null;
 
-            canvas.width = Math.floor(viewport.width * outputScale);
-            canvas.height = Math.floor(viewport.height * outputScale);
-            canvas.style.width = Math.floor(viewport.width) + "px";
-            canvas.style.height =  Math.floor(viewport.height) + "px";
-
-            var transform = outputScale !== 1
-            ? [outputScale, 0, 0, outputScale, 0, 0]
-            : null;
-
-              var renderContext = {
-                  canvasContext: context,
-                  viewport: viewport,
-                  transform: transform
-              };
-
-              page.render(renderContext);
-          });
-      };
-      
-      pdfjsLib.disableStream = true;
+      //This is where you start
       var doc = pdfjsLib.getDocument('{{ card["item_location"] }}');
       doc.promise.then(function(pdf) {
-        // Do something with the PDF file stored in the `pdf` variable
-        openPage(pdf, 1);
+        //Set PDFJS global object (so we can easily access in our page functions
+        thePDF = pdf;
+        
+        //How many pages it has
+        numPages = pdf.numPages;
+
+        //Start with first page
+        pdf.getPage( 1 ).then( handlePages );
       });
+
+      function handlePages(page)
+      {
+          //This gives us the page's dimensions at full scale
+          var scale = 1.5;
+          var viewport = page.getViewport({ scale: scale, });
+
+          //We'll create a canvas for each page to draw it on
+          var canvas = document.createElement( "canvas" );
+          canvas.style.display = "block";
+          var context = canvas.getContext('2d');
+          
+          //Add it to the web page
+          document.getElementById('pdf-doc').appendChild(canvas);
+          
+          // Support HiDPI-screens.
+          var outputScale = window.devicePixelRatio || 1;
+
+          canvas.width = Math.floor(viewport.width * outputScale);
+          canvas.height = Math.floor(viewport.height * outputScale);
+          canvas.style.width = "100%";
+          canvas.style.height =  Math.floor(canvas.style.width * viewport.width / viewport.height);
+
+
+          var transform = outputScale !== 1
+          ? [outputScale, 0, 0, outputScale, 0, 0]
+          : null;
+            var renderContext = {
+              canvasContext: context,
+              viewport: viewport,
+              transform: transform
+              };
+              
+          //Draw it on the canvas
+          page.render(renderContext);
+
+
+          //Move to next page
+          currPage++;
+          if ( thePDF !== null && currPage <= Math.min(numPages, 10) )
+          {
+              thePDF.getPage( currPage ).then( handlePages );
+          }
+      }
   });
   </script>
+
 {% endblock %}

templates/matches.html

@@ -37,7 +37,7 @@
       <TD>
         <a href="mailto:
         {% for card in match %}
-          {{ emails_by_ids[card['owner_id']] }}
+        {{ emails_by_ids[card['owner_id']] }}
         {% endfor %}
         ">