rendere alle Seiten, benutze Wischgesten zum Wechseln

2 files changed, 91 insertions, 37 deletions

diff --git a/index.html b/index.html
index 83a25a8..e1df469 100644
--- a/index.html
+++ b/index.html
@@ -49,8 +49,8 @@
         <script type="text/javascript">
             app.initialize();
         </script>
+        <script type="text/javascript" src="js/pdf.js"></script>
         <script type="text/javascript" src="js/jquery-2.1.0.min.js"></script>
         <script type="text/javascript" src="js/jquery.mobile-1.4.2.min.js"></script>
-        <script type="text/javascript" src="js/pdf.js"></script>
     </body>
 </html>
diff --git a/js/index.js b/js/index.js
index f07f600..2602cd3 100644
--- a/js/index.js
+++ b/js/index.js
@@ -16,41 +16,57 @@
  *   along with this program.  If not, see <http://www.gnu.org/licenses/>.
 */
 
-var page_html = '\
-<div data-role="page" class="page" id="page-{ID}" data-prefetch>\
-    <div data-role="header">\
-        <h1>WvS VPlan | Vertretungen</h1>\
-    </div>\
-    <div role="main" class="ui-content">\
-        <canvas id="canvas-{ID}" style="border:1px solid black;"/>\
-    </div>\
-</div>\
+var page_html = '\n\
+<div data-role="page" class="page" id="page-vplan-{ID}" data-prefetch>\n\
+    <div data-role="header">\n\
+        <h1>WvS VPlan | Vertretungen</h1>\n\
+    </div>\n\
+    <div role="main" class="ui-content" id="pdf-{ID}" data-plan-url="">\n\
+    </div>\n\
+</div>\n\
 ';
 
-function show_pdf(url, filename){
-    name = encodeURIComponent(filename.replace(".pdf", ""));
+function renderPage(div, pdf, pageNumber, callback){
+    pdf.getPage(pageNumber).then(function(page){
+        var scale = 1;
+        var viewport = page.getViewport(scale);
 
-    console.log("Download fertig, zeige PDF " + name);
+        var pageDisplayWidth = viewport.width;
+        var pageDisplayHeight = viewport.height;
 
-    $("#loginpage").after(page_html.replace(/{ID}/g, name));
-    location.href = "#page-" + name;
+        var pageDivHolder = document.createElement('div');
+/*        pageDivHolder.className = 'pdfpage';
+        pageDivHolder.style.width = pageDisplayWidth + 'px';
+        pageDivHolder.style.height = pageDisplayWidth + 'px';
+*/
+        var canvas = document.createElement('canvas');
+        canvas.className = 'pdfcanvas';
+        var context = canvas.getContext('2d');
+        canvas.width = pageDisplayWidth;
+        canvas.height = pageDisplayHeight;
 
-    PDFJS.getDocument(url).then(function(pdf){
-        pdf.getPage(1).then(function(page){
-            var scale = 1.5;
-            var viewport = page.getViewport(scale);
-            var canvas = document.getElementById("canvas-" + name);
-            var context = canvas.getContext('2d');
+        pageDivHolder.appendChild(canvas);
+        div.appendChild(pageDivHolder);
 
-            canvas.height = viewport.height;
-            canvas.width = viewport.width;
+        var renderContext = {
+            canvasContext: context,
+            viewport: viewport
+        };
+        page.render(renderContext).promise.then(callback);
+    });
+}
 
-            var renderContext = {
-                canvasContext: context,
-                viewport: viewport
-            };
+function render_pdf(viewerstr){
+    console.log("Rendere PDF: " + $(viewerstr).attr('data-plan-url') + " (" + viewerstr + ")");
 
-            page.render(renderContext);
+    PDFJS.getDocument($(viewerstr).attr('data-plan-url')).then(function(pdf){
+        var viewer = document.getElementById(viewerstr.replace(/#/, ''));
+        var pageNumber = 1;
+        renderPage(viewer, pdf, pageNumber++, function pageRenderingComplete(){
+            if(pageNumber > pdf.numPages){
+                return;
+            }
+            renderPage(viewer, pdf, pageNumber++, pageRenderingComplete);
         });
     });
 }
@@ -59,7 +75,7 @@ function fail(text){
     alert("Etwas ist schiefgelaufen: " + text.toString());
 }
 
-function download_pdf(link){
+function download_pdf(link, id){
     var filename = link.substring(link.lastIndexOf('/') + 1);
 
     window.requestFileSystem(
@@ -78,7 +94,11 @@ function download_pdf(link){
                             sPath,
                             function(theFile){
                                 console.log("Download fertig: " + theFile.toURL());
-                                show_pdf(theFile.toURL(), filename);
+                                $('#pdf-' + id).attr('data-plan-url', theFile.toURL());
+
+                                if(location.href.indexOf("page-") == -1){
+                                    location.href = "#page-vplan-" + id;
+                                }
                             },
                             function(error){
                                 console.log("Fehler: " + error.source + " - "+ error.target + " - " + error.code);
@@ -90,7 +110,7 @@ function download_pdf(link){
             fail);
 }
 
-function get_plan(link){
+function get_plan(link, id){
     var request = $.ajax({
         type: "GET",
         url: link
@@ -102,7 +122,7 @@ function get_plan(link){
 
         console.log('Plan gefunden: ' + pdflink);
 
-        download_pdf(pdflink);
+        download_pdf(pdflink, id);
     });
 
     request.fail(function(jqXHR, textStatus){
@@ -117,12 +137,46 @@ function get_overview(link){
     });
 
     request.done(function(result){
-        var plans_re = new RegExp("window\\.open\\(&#039;(http://***REMOVED***\\.de/moodle/mod/resource/view\\.php\\?id=\\d+)&amp;redirect=1&#039;\\)");
-        var links = plans_re.exec(result);
+        var plans_re = new RegExp("window\\.open\\(&#039;(http://***REMOVED***\\.de/moodle/mod/resource/view\\.php\\?id=\\d+)&amp;redirect=1&#039;\\)", "g");
+        var link;
+
+        // TODO keine result.match: Login fehlerhaft
+        //
+        // Pages für Vertretungsplände erstellen und pageshow-Events festlegen
+        
+        var resultl = result.match(plans_re).length;
+
+        for(j = 0; j < resultl; j++){
+            new_html = page_html.replace(/{ID}/g, j);
+            
+            $('#loginpage').after(new_html);
+
+            if(j + 1 < resultl){
+                $('#page-vplan-' + j).on('swipeleft', function(event){
+                    console.log("Wisch links");
+                    location.href = "#page-vplan-" + (parseInt($('.ui-page-active').attr('id').match(/\d+/)[0]) + 1);
+                });
+            }
+
+            if(j - 1 >= 0){
+                $('#page-vplan-' + j).on('swiperight', function(event){
+                    console.log("Wisch rechts");
+                    location.href = "#page-vplan-" + (parseInt($('.ui-page-active').attr('id').match(/\d+/)[0]) - 1);
+                });
+            }
+
+            console.log('Html hinzugefügt zu: ' + j);
+
+            $('#page-vplan-' + j).on('pageshow', function(event){
+                render_pdf($('.ui-page-active').attr('id').replace(/page-vplan/, '#pdf'));
+            });
+        }
+        
+        j = 0;
 
-        for(var i = 1; i < links.length; i += 2){
-            console.log('suche Plan ' + links[i]);
-            get_plan(links[i]);
+        while((link = plans_re.exec(result)) !== null){
+            console.log('suche Plan ' + link[1]);
+            get_plan(link[1], j++);
         }
 
         console.log('Übersichts-Request erfolgreich');