button to chapter comments, calculate word count (unused atm), clean up cleanup code

package.json

@@ -14,19 +14,19 @@
     "fimfic2epub": "./bin/fimfic2epub"
   },
   "main": "fimfic2epub.js",
-
   "files": [
     "fimfic2epub.js",
     "fimfic2epub.js.map",
     "bin/"
   ],
-
   "dependencies": {
     "detect-node": "^2.0.3",
     "escape-string-regexp": "^1.0.5",
     "html-entities": "^1.2.0",
+    "html-to-text": "^2.1.3",
     "image-size": "^0.5.0",
     "jszip": "^3.1.1",
+    "match-words": "^0.1.0",
     "mithril": "^0.2.5",
     "pretty-data": "^0.40.0",
     "request": "^2.74.0",
@@ -59,11 +59,12 @@
     "webpack": "^2.1.0-beta.20",
     "webpack-node-externals": "^1.3.3"
   },
-
   "standard": {
     "env": {
       "browser": true
     },
-    "globals": ["FIMFIC2EPUB_VERSION"]
+    "globals": [
+      "FIMFIC2EPUB_VERSION"
+    ]
   }
 }

src/FimFic2Epub.js

@@ -211,7 +211,7 @@ module.exports = class FimFic2Epub {
       }
       this.tags = tags
 
-      cleanMarkup(description, (html) => {
+      cleanMarkup(description).then((html) => {
         this.storyInfo.description = html
         this.findRemoteResources('description', 'description', html)
         resolve()

src/cleanMarkup.js

@@ -14,7 +14,12 @@ if (!isNode) {
   tidy = require('tidy-html5').tidy_html5
 }
 
-export function cleanMarkup (html, callback) {
+export function cleanMarkup (html) {
+  if (!html) {
+    return Promise.resolve('')
+  }
+
+  return new Promise((resolve, reject) => {
     // fix center tags
     html = html.replace(/<center>/g, '<p style="text-align: center;">')
     html = html.replace(/<\/center>/g, '</p>')
@@ -84,10 +89,11 @@ export function cleanMarkup (html, callback) {
       html = html.replace('<blockquote style="margin: 10px 0px; box-sizing:border-box; -moz-box-sizing:border-box;margin-right:25px; padding: 15px;background-color: #F7F7F7;border: 1px solid #AAA;width: 50%;float:left;box-shadow: 5px 5px 0px #EEE;">', '<blockquote class="left_insert">')
       html = html.replace('<blockquote style="margin: 10px 0px; box-sizing:border-box; -moz-box-sizing:border-box;margin-left:25px; padding: 15px;background-color: #F7F7F7;border: 1px solid #AAA;width: 50%;float:right;box-shadow: 5px 5px 0px #EEE;">', '<blockquote class="right_insert">')
 
-    html = tidy(`<?xml version="1.0" encoding="utf-8"?>\n` + html, tidyOptions)
+      html = tidy(html, tidyOptions).trim()
 
-    callback(html)
+      resolve(html)
     }
+  })
 }
 
 export function fixDoubleSpacing (html) {

src/html-wordcount.js

@@ -0,0 +1,12 @@
+import htmlToText from 'html-to-text'
+import matchWords from 'match-words'
+
+export default function htmlWordCount (html) {
+  let text = htmlToText.fromString(html, {
+    wordwrap: false,
+    ignoreImage: true,
+    ignoreHref: true
+  })
+
+  return matchWords(text).length
+}

src/style.styl

@@ -145,6 +145,33 @@ figure.youtube {
   }
 }
 
+a.chaptercomments {
+  text-decoration: none;
+  display: inline-block;
+  position: relative;
+  margin: 1em;
+  padding: 0.5em 1em;
+  cursor: pointer;
+
+  textcolor(#fff);
+  font-weight: normal;
+  font-family: sans-serif;
+  font-size: 0.9em;
+  text-shadow: -1px -1px #699739;
+
+  box-shadow: 0px 1px #81b945 inset;
+  border-radius: 3px;
+  border: 1px solid #699739;
+  border-bottom-color: #638f36;
+  border-top-color: #6fa03c;
+  outline: none;
+
+  bgcolor(#7bb042);
+  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #7bb042), color-stop(100%, #6fa03c));
+  background: -webkit-linear-gradient(top, #7bb042 0%, #6fa03c 100%);
+  background: linear-gradient(to bottom, #7bb042 0%, #6fa03c 100%);
+}
+
 #toc {
   ol {
     list-style-type: none;

src/templates.js

@@ -4,6 +4,7 @@ import render from './lib/mithril-node-render'
 import { pd as pretty } from 'pretty-data'
 import zeroFill from 'zero-fill'
 
+import htmlWordCount from './html-wordcount'
 import { cleanMarkup } from './cleanMarkup'
 import { NS } from './constants'
 
@@ -46,19 +47,21 @@ export function createChapter (ch, html, callback) {
   // remove leading and trailing <br /> tags and whitespace
   chapter = chapter.replace(trimWhitespace, '')
 
-  let sections = [
-    [
-      m('.chapter-title', [
-        m('h1', ch.title),
-        m('hr')
-      ]),
-      m.trust(chapter)
-    ],
-    authorNotes ? m('div#author_notes', {className: authorNotesPos < chapterPos ? 'top' : 'bottom'}, m.trust(authorNotes)) : null
+  Promise.all([cleanMarkup(chapter), cleanMarkup(authorNotes)]).then((values) => {
+    let [cleanChapter, cleanAuthorNotes] = values
+
+    ch.realWordCount = htmlWordCount(cleanChapter)
+
+    let content = [
+      m.trust(cleanChapter),
+      cleanAuthorNotes ? m('div#author_notes', {className: authorNotesPos < chapterPos ? 'top' : 'bottom'}, [
+        m('p', m('b', 'Author\'s Note:')),
+        m.trust(cleanAuthorNotes)]) : null
     ]
 
-  if (authorNotes && authorNotesPos < chapterPos) {
-    sections.reverse()
+    // if author notes are a the beginning of the chapter
+    if (cleanAuthorNotes && authorNotesPos < chapterPos) {
+      content.reverse()
     }
 
     let chapterPage = '<!doctype html>' + render(
@@ -68,12 +71,20 @@ export function createChapter (ch, html, callback) {
           m('link', {rel: 'stylesheet', type: 'text/css', href: '../Styles/style.css'}),
           m('title', ch.title)
         ]),
-      m('body', sections)
+        m('body', [
+          m('.chapter-title', [
+            m('h1', ch.title),
+            m('hr')
+          ]),
+          content,
+          m('p.double', {style: 'text-align: center; clear: both;'},
+            m('a.chaptercomments', {href: ch.link + '#comment_list'}, 'Read chapter comments online')
+          )
+        ])
       ])
     )
 
-  cleanMarkup(chapterPage, (html) => {
-    callback(html)
+    callback(chapterPage)
   })
 }