merge all pages from each book to one html file

assets/css/dist/main.css

@@ -13,7 +13,7 @@
  * DEFINITION OF THE PAPER SHEET
  */
 @page {
-  size: 210mm 291mm;
+  size: 234mm 315mm;
   margin: 0; }
 
 /**
@@ -23,19 +23,19 @@
   body {
     margin: 0; }
   .paper {
-    width: 210mm;
-    height: 290mm;
+    width: 234mm;
+    height: 314mm;
     box-sizing: border-box;
     counter-increment: page-counter;
     page-break-inside: avoid;
     page-break-after: always;
     overflow: hidden;
     /* Crop marks */
-    padding: 0mm;
+    padding: 12mm;
     position: relative; }
     .paper .crops {
-      width: 210mm;
-      height: 290mm;
+      width: 234mm;
+      height: 314mm;
       position: absolute;
       top: 0;
       left: 0; }
@@ -43,13 +43,13 @@
         border-style: solid;
         border-color: black;
         border-width: 0;
-        width: 0mm;
-        height: 0mm;
+        width: 12mm;
+        height: 12mm;
         position: absolute;
         box-sizing: border-box; }
         .paper .crops div span {
-          width: 0mm;
-          height: 0mm;
+          width: 5mm;
+          height: 5mm;
           background-color: white;
           position: absolute; }
       .paper .crops .crop-top-left {
@@ -93,15 +93,15 @@
   .spread .paper {
     float: left; }
   .spread .paper:nth-child(odd) {
-    margin-left: 0mm; }
+    margin-left: -12mm; }
   .spread .paper:nth-child(even) {
-    margin-right: 0mm; }
+    margin-right: -12mm; }
   .spread .paper:first-child {
     margin-left: 210mm; } }
 
 @media print {
   html {
-    width: 210mm; }
+    width: 234mm; }
   body {
     /* Allows printing of background colors */
     background-color: white;
@@ -132,7 +132,7 @@
 .header {
   top: 0;
   margin: 0;
-  padding-top: 8mm;
+  padding-top: 10mm;
   width: 100%;
   height: 10mm;
   text-align: left; }
@@ -143,9 +143,9 @@
 .body {
   height: 270mm;
   width: 210mm;
-  margin-bottom: 12mm;
-  padding-top: 18mm;
-  padding-bottom: 12mm;
+  margin-bottom: 15mm;
+  padding-top: 20mm;
+  padding-bottom: 15mm;
   position: absolute; }
 
 .recipient {
@@ -175,12 +175,12 @@
 .paper:nth-child(odd) .body,
 .paper:nth-child(odd) .footer {
   padding-left: 20mm;
-  padding-right: 20mm; }
+  padding-right: 10mm; }
 
 .paper:nth-child(even) .header,
 .paper:nth-child(even) .body,
 .paper:nth-child(even) .footer {
-  padding-left: 20mm;
+  padding-left: 10mm;
   padding-right: 20mm; }
 
 img {
@@ -233,13 +233,13 @@ p {
   body {
     background-color: #F0F0F0; }
   #pages {
-    width: 210mm;
-    height: 290mm;
+    width: 234mm;
+    height: 314mm;
     margin-left: auto;
     margin-right: auto; }
   .spread #pages {
-    width: 420mm;
-    height: 580mm; }
+    width: 468mm;
+    height: 628mm; }
   .paper {
     /* centrer la page à l'écran */
     background-color: white;

assets/css/setup.scss

@@ -3,10 +3,10 @@ $page-width: 210mm;
 $page-height: 290mm;
 
 /* the size of the crop marks*/
-$crop-size: 0mm;
+$crop-size: 7mm;
 
 /* the size of bleed */
-$bleed: 0mm;
+$bleed: 5mm;
 
 // page layouts
 // 1 for single page
@@ -14,9 +14,9 @@ $bleed: 0mm;
 $page-layout:1;
 
 $page-margin-inside: 20mm;
-$page-margin-outside: 20mm;
-$page-margin-top: 8mm;
-$page-margin-bottom: 12mm;
+$page-margin-outside: 10mm;
+$page-margin-top: 10mm;
+$page-margin-bottom: 15mm;
 
 // Header & footer variables
 $header-height: 10mm;

assets/js/gui.js

@@ -4,12 +4,15 @@ $(function() {
     // console.log(data);
     for (book of data) {
       // console.log(book);
-      var $optgroup = $('<optgroup>').attr('label', book.label);
-      for (page of book.pages) {
-        // console.log(page);
-        $optgroup.append($('<option>').attr('value', book.label+'/'+page.file).text(book.label+' : '+page.label));
-      }
-      $('[name="document"]').append($optgroup);
+      // var $optgroup = $('<optgroup>').attr('label', book.label);
+      // for (page of book.pages) {
+      //   // console.log(page);
+      //   $optgroup.append($('<option>').attr('value', book.label+'/'+page.file).text(book.label+' : '+page.label));
+      // }
+      $('[name="document"]').append(
+        $('<option>')
+          .attr('value', book.file).text(book.label)
+      );
     }
   })
 
@@ -17,30 +20,37 @@ $(function() {
     // console.log(e);
     // var optionSelected = $("option:selected", this);
     // var valueSelected = ;
-    console.log(this.value);
-    $('iframe').attr('src', 'build/'+this.value);
+    // console.log(this.value);
+    $('iframe').attr('src', this.value);
   });
 
   // activate toolbar events when iframe is loaded
   $('iframe').load(function() {
-    var doc = $("iframe").contents().find("html");
+    initIframe();
+  });
 
-    $('[name="preview"]').change(function() {
-        if($(this).is(":checked")) {
-            doc.addClass("preview");
-            doc.removeClass("normal");
-        } else {
-            doc.removeClass("preview");
-            doc.addClass("normal");
-        }
+  function initIframe(){
+    var doc = $("iframe").contents().find("html");
+    console.log('initIframe :: doc', doc);
+
+    $('input[name="preview"]').change(function(e) {
+      console.log('Preview',e);
+      if($(this).is(":checked")) {
+          doc.addClass("preview");
+          doc.removeClass("normal");
+      } else {
+          doc.removeClass("preview");
+          doc.addClass("normal");
+      }
     });
 
     $('[name="debug"]').change(function() {
-        if($(this).is(":checked")) {
-            doc.addClass("debug");
-        } else {
-            doc.removeClass("debug");
-        }
+
+      if($(this).is(":checked")) {
+          doc.addClass("debug");
+      } else {
+          doc.removeClass("debug");
+      }
     });
 
     $('[name="spread"]').change(function() {
@@ -51,42 +61,42 @@ $(function() {
         }
     });
 
-        //$('[name="hi-res"]').change(function() {
-            //if($(this).is(":checked")) {
-                //doc.addClass("export");
-            //} else {
-                //doc.removeClass("export");
-            //}
-        //});
+    //$('[name="hi-res"]').change(function() {
+        //if($(this).is(":checked")) {
+            //doc.addClass("export");
+        //} else {
+            //doc.removeClass("export");
+        //}
+    //});
 
-        $('[name="zoom"]').change(function() {
-            zoomLevel = $(this).val() / 100;
+    $('[name="zoom"]').change(function() {
+        zoomLevel = $(this).val() / 100;
 
-            doc.find("#pages").css({
-                "-webkit-transform": "scale(" + zoomLevel + ")",
-                "-webkit-transform-origin": "0 0"
-            });
-        });
-
-        //$(".paper").each(function(){
-            //page = $(this).attr("id");
-            //$("#toc-pages").append("<li><a href='#" + page + "'>" + page.replace("-", " ") + "</a></li>")
-        //});
-
-        $('[name="page"]').change(function() {
-            var pageNumber = $(this).val() - 1;
-
-            var target = doc.find('.paper:eq(' + pageNumber + ')');
-            var offsetTop = target.offset().top;
-
-            doc.find('body').scrollTop(offsetTop);
-        });
-
-        $("#print").on('click', function() {
-            $("iframe").get(0).contentWindow.print();
+        doc.find("#pages").css({
+            "-webkit-transform": "scale(" + zoomLevel + ")",
+            "-webkit-transform-origin": "0 0"
         });
     });
 
+    //$(".paper").each(function(){
+        //page = $(this).attr("id");
+        //$("#toc-pages").append("<li><a href='#" + page + "'>" + page.replace("-", " ") + "</a></li>")
+    //});
+
+    $('[name="page"]').change(function() {
+        var pageNumber = $(this).val() - 1;
+
+        var target = doc.find('.paper:eq(' + pageNumber + ')');
+        var offsetTop = target.offset().top;
+
+        doc.find('body').scrollTop(offsetTop);
+    });
+
+    $("#print").on('click', function() {
+        $("iframe").get(0).contentWindow.print();
+    });
+  }
+
     //// __________________________________ HIGH RESOLUTION __________________________________ //
     //$("#hi-res").click(function(e){
         //e.preventDefault();