css in book epubs

fiduswriter · Jul 18, 2019 · b238149 · b238149
1 parent 5caf96f
commit b238149
Show file tree

Hide file tree

Showing 3 changed files with 39 additions and 8 deletions.
diff --git a/fiduswriter/book/static/js/modules/books/exporter/epub/index.js b/fiduswriter/book/static/js/modules/books/exporter/epub/index.js
@@ -152,13 +152,11 @@ export class EpubBookExporter extends DOMExporter {
     }
 
     exportTwo() {
-        const includeZips = [],
-            styleSheets = []
-        let httpOutputList = []
 
         this.outputList = this.outputList.concat(
             this.chapters.map(chapter => {
                 chapter.contents = styleEpubFootnotes(chapter.contents)
+                const styleSheets = [{filename: 'document.css'}, {filename: this.addDocStyle(chapter.doc)}]
                 let xhtmlCode = xhtmlTemplate({
                     part: chapter.part,
                     shortLang: chapter.doc.settings.language.split('-')[0],
@@ -177,6 +175,13 @@ export class EpubBookExporter extends DOMExporter {
                 }
             })
         )
+        this.loadStyles().then(
+            () => this.exportThree()
+        )
+    }
+
+    exportThree() {
+        const includeZips = []
 
         this.contentItems.push({
             link: 'copyright.xhtml#copyright',
@@ -192,6 +197,8 @@ export class EpubBookExporter extends DOMExporter {
         const timestamp = getTimestamp()
 
         this.images = uniqueObjects(this.images)
+        this.fontFiles = uniqueObjects(this.fontFiles)
+        this.styleSheets = uniqueObjects(this.styleSheets)
 
         // mark cover image
         if (this.coverImage) {
@@ -211,9 +218,10 @@ export class EpubBookExporter extends DOMExporter {
             idType: 'fidus',
             date: timestamp.slice(0, 10), // TODO: the date should probably be the original document creation date instead
             modified: timestamp,
-            styleSheets,
+            styleSheets: this.styleSheets,
             math: this.math,
             images: this.images,
+            fontFiles: this.fontFiles,
             chapters: this.chapters,
             coverImage: this.coverImage,
             mathliveOpfIncludes,
@@ -262,19 +270,28 @@ export class EpubBookExporter extends DOMExporter {
         }])
 
         this.outputList = this.outputList.concat(
-            styleSheets.map(sheet => ({
+            this.styleSheets.map(sheet => ({
                 filename: `EPUB/${sheet.filename}`,
                 contents: sheet.contents
             }))
         )
 
-        httpOutputList = httpOutputList.concat(
+        this.binaryFiles = this.binaryFiles.concat(
             this.images.map(image => ({
                 filename: `EPUB/${image.filename}`,
                 url: image.url
             }))
         )
 
+        this.fontFiles.forEach(font => {
+            this.binaryFiles.push({
+                filename: 'EPUB/' + font.filename,
+                url: font.url
+            })
+        })
+
+        this.binaryFiles = uniqueObjects(this.binaryFiles)
+
         if (this.math) {
             includeZips.push({
                 'directory': 'EPUB',
@@ -283,7 +300,7 @@ export class EpubBookExporter extends DOMExporter {
         }
         const zipper = new ZipFileCreator(
             this.outputList,
-            httpOutputList,
+            this.binaryFiles,
             includeZips,
             'application/epub+zip'
         )

diff --git a/fiduswriter/book/static/js/modules/books/exporter/epub/templates.js b/fiduswriter/book/static/js/modules/books/exporter/epub/templates.js
@@ -11,6 +11,7 @@ export const epubBookOpfTemplate = ({
         styleSheets,
         math,
         images,
+        fontFiles,
         chapters,
         coverImage,
         mathliveOpfIncludes,
@@ -81,6 +82,19 @@ export const epubBookOpfTemplate = ({
                 }"/>`
             ).join('')
         }
+        ${
+            fontFiles.map((fontFile, index) =>
+                `<item ${
+                    `id="font${index}"`
+                } href="${
+                    fontFile.filename
+                }" media-type="application/${
+                    fontFile.filename.split(".")[1]==="woff" ?
+                    'font-woff' :
+                    'font-sfnt'
+                }" />`
+            ).join('')
+        }
         ${
             styleSheets.map((sheet, index) =>
                 `<item id="css${index}" href="${escapeText(sheet.filename)}"

diff --git a/fiduswriter/book/static/js/modules/books/exporter/html/index.js b/fiduswriter/book/static/js/modules/books/exporter/html/index.js
@@ -102,7 +102,7 @@ export class HTMLBookExporter extends DOMExporter {
             const contents = chapter.contents,
                 doc = chapter.doc,
                 title = doc.title,
-                styleSheets = [{filename:this.addDocStyle(doc)}]
+                styleSheets = [{filename: this.addDocStyle(doc)}]
 
             this.prepareBinaryFiles(contents)