modul1

2025-09-11 09:54:41 +00:00 · 2016-07-28 13:03:48 +03:00 · 2016-07-28 13:03:48 +03:00 · 8147350ce8
commit 8147350ce8
parent 606ed53f2a
11 changed files with 605 additions and 64 deletions
--- a/chapter-editor/chapter-editor.html
+++ b/chapter-editor/chapter-editor.html
@ -1,17 +0,0 @@
-<!DOCTYPE html>
-<html>
-    <head>
-        <meta charset="utf-8">
-        <title>Chaper Editor</title>
-    </head>
-    <body>
-        <div id="chapters" class="">
-            <h1>GIGI</h1>
-            <button id="savepage" type="button" name="button">Save Page</button>
-            <button id="superbuton" type="button" name="button">Edit Buffer 2</button>
-            <button id="title" type="button" name="button">Get Title</button>
-        </div>
-
-        <script src="chapter-editor.js" charset="utf-8"></script>
-    </body>
-</html>
--- a/chapter-editor/chapter-editor.js
+++ b/chapter-editor/chapter-editor.js
@ -1,42 +0,0 @@
-var win = null;
-
-document.getElementById("superbuton").onclick = function() {
-    win = window.open(chrome.extension.getURL('chapter-editor/editor.html'), '_blank');
-    win.focus();
-};
-
-document.getElementById('savepage').onclick = function() {
-    // chrome.tabs.query({
-    //     currentWindow: true,
-    //     active: true
-    // }, function(tab) {
-    //     chrome.tabs.sendMessage(
-    //         tab[0].id, {
-    //             type: 'page-to-buffer'
-    //         }
-    //     );
-    // });
-};
-
-document.getElementById('title').onclick = function() {
-    chrome.tabs.query({
-        currentWindow: true,
-        active: true
-    }, function(tab) {
-        chrome.tabs.sendMessage(
-            tab[0].id, {
-                type: 'get-title'
-            },
-            function(response) {
-                var title = localStorage.getItem('title');
-                if (title === null) {
-                    title = [];
-                } else {
-                    title = JSON.parse(title);
-                }
-                title.push(response);
-                localStorage.setItem('title', JSON.stringify(title));
-            }
-        );
-    });
-};
--- a/chapter-editor/filesaver.js
+++ b/chapter-editor/filesaver.js
--- a/chapter-editor/jquery.js
+++ b/chapter-editor/jquery.js
--- a/chapter-editor/jszip-utils.js
+++ b/chapter-editor/jszip-utils.js
--- a/chapter-editor/jszip.js
+++ b/chapter-editor/jszip.js
--- a/chapter-editor/menu.html
+++ b/chapter-editor/menu.html
@ -2,10 +2,38 @@
 <html>
    <head>
        <meta charset="utf-8">
-        <title>Chapter Editor</title>
+        <style>
+            .menu-holder {
+                padding: 5px;
+                padding-right: 10px;
+                margin: 0;
+            }
+
+            .menu-item {
+                display: block;
+                width: 100%;
+                margin: 5px;
+            }
+        </style>
    </head>
    <body>
-        <h1>Chapter Editor</h1>
+        <div class="menu-holder">
+            <h3>Save as Ebook:</h3>
+            <button id="savePage" type="button" name="button" class="menu-item">Save Page</button>
+            <button id="saveSelection" type="button" name="button" class="menu-item">Save Selection</button>
+            <hr/>
+            <button id="pageChapter" type="button" name="button" class="menu-item">Add Page as Chapter</button>
+            <button id="selectionChapter" type="button" name="button" class="menu-item">Add Selection as Chapter</button>
+            <hr/>
+            <button id="editChapters" type="button" name="button" class="menu-item">Edit Chapters...</button>
+        </div>

+
+        <script src="jquery.js" charset="utf-8"></script>
+        <script src="filesaver.js" charset="utf-8"></script>
+        <script src="jszip.js" charset="utf-8"></script>
+        <script src="jszip-utils.js" charset="utf-8"></script>
+        <script src="saveEbook.js" charset="utf-8"></script>
+        <script src="menu.js" charset="utf-8"></script>
    </body>
 </html>
--- a/chapter-editor/menu.js
+++ b/chapter-editor/menu.js
@ -0,0 +1,87 @@
+var win = null;
+
+document.getElementById("editChapters").onclick = function() {
+    win = window.open(chrome.extension.getURL('chapter-editor/editor.html'), '_blank');
+    win.focus();
+};
+
+
+function getEbookPages() { // TODO add as utils
+    try {
+        var allPages = localStorage.getItem('ebook');
+        if (!allPages) {
+            allPages = [];
+        } else {
+            allPages = JSON.parse(allPages);
+        }
+        return allPages;
+    } catch (e) {
+        console.log(e);
+        return [];
+    }
+}
+
+function saveEbookPages(pages) {
+    localStorage.setItem('ebook', JSON.stringify(pages));
+}
+
+document.getElementById('savePage').onclick = function() {
+    chrome.tabs.query({
+        currentWindow: true,
+        active: true
+    }, function(tab) {
+        console.log('aiai');
+        chrome.tabs.sendMessage(
+            tab[0].id,
+            {
+                type: 'extract-page'
+            },
+            function (response) {
+                var allPages = getEbookPages();
+                allPages.push(response);
+                saveEbookPages(allPages);
+                buildEbook();
+            }
+        );
+    });
+};
+
+document.getElementById('saveSelection').onclick = function() {
+    chrome.tabs.query({
+        currentWindow: true,
+        active: true
+    }, function(tab) {
+        chrome.tabs.sendMessage(
+            tab[0].id,
+            {
+                type: 'extract-selection'
+            },
+            function (response) {
+                console.log('Selection EXTRAcTED', response);
+            }
+        );
+    });
+};
+
+document.getElementById('title').onclick = function() {
+    chrome.tabs.query({
+        currentWindow: true,
+        active: true
+    }, function(tab) {
+        chrome.tabs.sendMessage(
+            tab[0].id, {
+                type: 'get-title'
+            },
+            function(response) {
+                var title = localStorage.getItem('title');
+                if (title === null) {
+                    title = [];
+                } else {
+                    title = JSON.parse(title);
+                }
+                title.push(response);
+                localStorage.setItem('title', JSON.stringify(title));
+            }
+        );
+    });
+};
--- a/chapter-editor/saveEbook.js
+++ b/chapter-editor/saveEbook.js
@ -0,0 +1,238 @@
+
+var cssFileName = 'ebook.css';
+var pageName = 'ebook.xhtml';
+var ebookName = "ebook-" + document.title + ".epub";
+
+function getEbookPages() {
+    try {
+        var allPages = localStorage.getItem('ebook');
+        if (!allPages) {
+            allPages = [];
+        } else {
+            allPages = JSON.parse(allPages);
+        }
+        return allPages;
+    } catch (e) {
+        console.log(e);
+        return [];
+    }
+
+}
+
+function getImagesIndex(allImgSrc) {
+    return Object.keys(allImgSrc).reduce(function(prev, elem, index) {
+        return prev + '\n' + '<item href="images/' + allImgSrc[elem] + '" id="img' + index + '" media-type="image/' + getFileExtension(elem) + '"/>';
+    }, '');
+}
+
+function getExternalLinksIndex() { // TODO ???
+    return allExternalLinks.reduce(function(prev, elem, index) {
+        return prev + '\n' + '<item href="' + elem + '" />';
+    }, '');
+}
+
+function getFileExtension(fileName) {
+    var tmpFileName = fileName.split('.').pop();
+    if (tmpFileName.indexOf('?') > 0) {
+        tmpFileName = tmpFileName.split('?')[0];
+    }
+    if (tmpFileName.trim() === '') {
+        return 'jpg'; //TODO
+    }
+    return tmpFileName;
+}
+
+// function walkDOM(main) {
+//     var arr = [];
+//     var loop = function(main) {
+//         do {
+//             try {
+//                 if (allowElements.indexOf(main.tagName.toLowerCase()) > -1) {
+//                     arr.push(main);
+//                 }
+//             } catch (e) {
+//             }
+//             if (main.hasChildNodes()) {
+//                 loop(main.firstChild);
+//             }
+//         }
+//         while (main = main.nextSibling);
+//     }
+//     loop(main);
+//     return arr;
+// }
+
+
+function deferredAddZip(url, filename, zip) {
+    var deferred = $.Deferred();
+    JSZipUtils.getBinaryContent(url, function(err, data) {
+        if (err) {
+            deferred.reject(err);
+        } else {
+            zip.file(filename, data, {
+                binary: true
+            });
+            deferred.resolve(data);
+        }
+    });
+    return deferred;
+}
+
+// http://ebooks.stackexchange.com/questions/1183/what-is-the-minimum-required-content-for-a-valid-epub
+function buildEbook() {
+    console.log('Prepare Content...');
+
+    var allPages = getEbookPages();
+    var zip = new JSZip();
+
+    zip.file('mimetype', 'application/epub+zip');
+
+    var metaInfFolder = zip.folder("META-INF");
+    metaInfFolder.file('container.xml',
+        '<?xml version="1.0"?>' +
+        '<container version="1.0" xmlns="urn:oasis:names:tc:opendocument:xmlns:container">' +
+        '<rootfiles>' +
+        '<rootfile full-path="OEBPS/content.opf" media-type="application/oebps-package+xml"/>' +
+        '</rootfiles>' +
+        '</container>'
+    );
+
+
+    var oebps = zip.folder("OEBPS");
+    oebps.file('toc.xhtml',
+        '<?xml version="1.0" encoding="utf-8"?>' +
+        '<html xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops">' +
+        '<head>' +
+        '<title>toc.xhtml</title>' +
+        '<link href="' + cssFileName + '" rel="stylesheet" type="text/css" />' +
+        '</head>' +
+        '<body>' +
+        '<nav id="toc" epub:type="toc">' +
+        '<h1 class="frontmatter">Table of Contents</h1>' +
+        '<ol class="contents">' +
+        // '<li><a href="pages/' + pageName + '">' + ebookName + '</a></li>' + // TODO remove
+        allPages.reduce(function (prev, page) {
+            return prev + '\n' + '<li><a href="pages/' + page.url + '">' + page.title + '</a></li>';
+        }, '') +
+        '</ol>' +
+        '</nav>' +
+        '</body>' +
+        '</html>'
+    );
+
+    oebps.file('toc.ncx',
+        '<?xml version="1.0" encoding="UTF-8" ?>' +
+        '<ncx version="2005-1" xml:lang="en" xmlns="http://www.daisy.org/z3986/2005/ncx/">' +
+        '<head>' +
+        '<meta name="dtb:uid" content="isbn"/>' +
+        '<meta name="dtb:depth" content="1"/>' +
+        '</head>' +
+        '<docTitle>' +
+        '<text></text>' +
+        '</docTitle>' +
+        '<navMap>' +
+        // '<content src="pages/' + pageName + '" />' + // TODO remove
+        allPages.reduce(function (prev, page, index) {
+            return prev + '\n' +
+            '<navPoint id="ebook' + index + '" playOrder="' + (index+1) + '">' +
+            '<navLabel><text>' + page.title + '</text></navLabel>' +
+            '<content src="pages/' + page.url + '" />' +
+            '</navPoint>';
+        }, '') +
+        '</navMap>' +
+        '</ncx>'
+    );
+
+    oebps.file(cssFileName, '');
+
+    var pagesFolder = oebps.folder('pages');
+    allPages.forEach(function (page) {
+        pagesFolder.file(page.url,
+            '<?xml version="1.0" encoding="utf-8"?>' +
+            '<html xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops">' +
+            '<head>' +
+            '<title>' + page.title + '</title>' +
+            '<link href="' + cssFileName + '" rel="stylesheet" type="text/css" />' +
+            '</head><body>' +
+            page.content +
+            '</body></html>'
+        );
+    });
+
+    oebps.file('content.opf',
+        '<?xml version="1.0" encoding="UTF-8" ?>' +
+        '<package xmlns="http://www.idpf.org/2007/opf" xmlns:dc="http://purl.org/dc/elements/1.1/" unique-identifier="db-id" version="3.0">' +
+        '<metadata>' +
+        '<dc:title id="t1">Title</dc:title>' +
+        '<dc:identifier id="db-id">isbn</dc:identifier>' +
+        '<meta property="dcterms:modified">2014-03-27T09:14:09Z</meta>' +
+        '<dc:language>en</dc:language>' +
+        '</metadata>' +
+        '<manifest>' +
+        '<item id="toc" properties="nav" href="toc.xhtml" media-type="application/xhtml+xml" />' +
+        '<item id="ncx" href="toc.ncx" media-type="application/x-dtbncx+xml" />' +
+        '<item id="template_css" href="' + cssFileName + '" media-type="text/css" />' +
+        // '<item id="ebook" href="pages/' + pageName + '" media-type="application/xhtml+xml" />' + //properties="remote-resources" // TODO remove
+        allPages.reduce(function (prev, page, index) {
+            return prev + '\n' + '<item id="ebook' + index + '" href="pages/' + page.url + '" media-type="application/xhtml+xml" />';
+        }, '') +
+        allPages.reduce(function (prev, page, index) {
+            return prev + '\n' + getImagesIndex(page.imgs);
+        }, '') +
+        // getExternalLinksIndex() +
+        '</manifest>' +
+        '<spine toc="ncx">' +
+        // '<itemref idref="ebook" />' + // TODO remove
+        allPages.reduce(function (prev, page, index) {
+            return prev + '\n' + '<itemref idref="ebook' + index + '" />';
+        }, '') +
+        '</spine>' +
+        '</package>'
+    );
+
+
+
+
+    ///////////////
+    ///////////////
+    var imgs = oebps.folder("images");
+    var imgsPromises = [];
+    allPages.forEach(function (page) {
+        Object.keys(page.imgs).forEach(function(imgSrc, index) {
+            var tmpDeffered = deferredAddZip(imgSrc, page.imgs[imgSrc], imgs);
+            imgsPromises.push(tmpDeffered);
+        });
+    });
+
+    var done = false;
+
+    $.when.apply($, imgsPromises).done(function() {
+        done = true;
+        zip.generateAsync({
+                type: "blob"
+            })
+            .then(function(content) {
+                saveAs(content, ebookName);
+            });
+        console.log("done !");
+    }).fail(function(err) {
+        alert(err);
+    });
+
+    setTimeout(function() {
+        if (done) {
+            return;
+        }
+        zip.generateAsync({
+                type: "blob"
+            })
+            .then(function(content) {
+                saveAs(content, ebookName);
+            });
+    }, 60000);
+
+    ///////////// clean
+    localStorage.removeItem('ebook');
+    imageIndex = 0;
+
+}
--- a/extractHtml.js
+++ b/extractHtml.js
@ -0,0 +1,247 @@
+var allImgSrc = {};
+
+//////
+
+function getFileExtension(fileName) {
+    var tmpFileName = fileName.split('.').pop();
+    if (tmpFileName.indexOf('?') > 0) {
+        tmpFileName = tmpFileName.split('?')[0];
+    }
+    if (tmpFileName.trim() === '') {
+        return 'jpg'; //TODO
+    }
+    return tmpFileName;
+}
+
+function getImageSrc(srcTxt) {
+    if (!srcTxt) {
+        return '';
+    }
+    allImgSrc[srcTxt] = 'img-' + (Math.floor(Math.random()*1000000)) + '.' + getFileExtension(srcTxt);
+    return '../images/' + allImgSrc[srcTxt];
+}
+
+function getHref(hrefTxt) {
+    if (!hrefTxt) {
+        return '';
+    }
+    if (hrefTxt.indexOf('#') === 0) {
+        hrefTxt = window.location.href + hrefTxt;
+    }
+    if (hrefTxt.indexOf('/') === 0) {
+        hrefTxt = window.location.protocol + '//' + window.location.hostname + hrefTxt;
+    }
+    // hrefTxt = escape(hrefTxt); // TODO
+    return hrefTxt;
+}
+
+function force(contentString) {
+    try {
+        var tagOpen = '@@@';
+        var tagClose = '###';
+        var inlineElements = ['h1', 'h2', 'h3', 'sup', 'b', 'i', 'em', 'code', 'pre', 'p'];
+
+        var $content = $(contentString);
+
+        $content.find('img').each(function (index, elem) {
+            $(elem).replaceWith('<span>' + tagOpen + 'img src="' + getImageSrc($(elem).attr('src')) + '"' + tagClose + tagOpen + '/img' + tagClose + '</span>');
+        });
+
+        $content.find('a').each(function (index, elem) {
+            $(elem).replaceWith('<span>' + tagOpen + 'a href="' + getHref($(elem).attr('href')) + '"' + tagClose + $(elem).html() + tagOpen + '/a' + tagClose + '</span>');
+        });
+
+        if ($('*').length < 3000) { // TODO
+            inlineElements.forEach(function (tagName) {
+                $content.find(tagName).each(function (index, elem) {
+                    $(elem).replaceWith('<span>' + tagOpen + tagName + tagClose + $(elem).html() + tagOpen + '/' + tagName + tagClose + '</span>');
+                });
+            });
+        }
+
+        contentString = $content.text();
+
+        var tagOpenRegex = new RegExp(tagOpen, 'gi');
+        var tagCloseRegex = new RegExp(tagClose, 'gi');
+        contentString = contentString.replace(tagOpenRegex, '<');
+        contentString = contentString.replace(tagCloseRegex, '>');
+        contentString = contentString.replace(/&amp;/gi, '&'); // TODO ??
+        contentString = contentString.replace(/&/gi, '&amp;');
+
+        return contentString;
+    } catch(e) {
+        console.log(e);
+    }
+}
+
+// https://github.com/blowsie/Pure-JavaScript-HTML5-Parser
+function sanitize(rawContentString) {
+
+    var srcTxt = '';
+    var dirty = null;
+    try {
+        // dirty = getHtmlAsString(rawContent);
+        wdirty = $.parseHTML(rawContentString);
+        $wdirty = $(wdirty);
+        $wdirty.find('script, style, svg, canvas, noscript').remove();
+        $wdirty.find('*:empty').not('img').remove();
+
+        dirty = $wdirty.html();
+
+        // dirty = dirty.replace(/&nbsp;/gi, '');
+        // dirty = HTMLtoXML(dirty);
+
+        ////////////////
+
+
+        return force(dirty);
+
+
+        // var dirty = '<div>' + document.getElementsByTagName('body')[0].innerHTML + '</div>';
+
+        var results = '';
+        var lastFragment = '';
+        var lastTag = '';
+        var inList = false;
+        var allowedTags = ['div', 'p', 'code', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'span', 'blockquote',
+            'img', 'a', 'ol', 'ul', 'li', 'b', 'i', 'sup', 'strong', 'strike',
+            'table', 'tr', 'td', 'th', 'thead', 'tbody', 'pre', 'em'
+        ];
+        var allowedTextTags = ['h4', 'h5', 'h6', 'span'];
+
+        HTMLParser(dirty, {
+            start: function(tag, attrs, unary) {
+                lastTag = tag;
+                if (allowedTags.indexOf(tag) < 0) {
+                    return;
+                }
+
+                if (tag === 'ol' || tag === 'ul') {
+                    inList = true;
+                }
+                if (tag === 'li' && !inList) {
+                    tag = 'p';
+                }
+
+                var tattrs = null;
+                if (tag === 'img') {
+                    tattrs = attrs.filter(function(attr) {
+                        return attr.name === 'src';
+                    }).map(function(attr) {
+                        return getImageSrc(attr.escaped);
+                    });
+                    lastFragment = tattrs.length === 0 ? '<img></img>' : '<img src="' + tattrs[0] + '" alt=""></img>';
+                } else if (tag === 'a') {
+                    tattrs = attrs.filter(function(attr) {
+                        return attr.name === 'href';
+                    }).map(function(attr) {
+                        return getHref(attr.escaped);
+                    });
+                    lastFragment = tattrs.length === 0 ? '<a>' : '<a href="' + tattrs[0] + '">';
+                } else {
+                    lastFragment = '<' + tag + '>';
+                }
+
+                results += lastFragment;
+                lastFragment = '';
+            },
+            end: function(tag) {
+                if (allowedTags.indexOf(tag) < 0 || tag === 'img') {
+                    return;
+                }
+
+                if (tag === 'ol' || tag === 'ul') {
+                    inList = false;
+                }
+                if (tag === 'li' && !inList) {
+                    tag = 'p';
+                }
+
+                results += "</" + tag + ">\n";
+            },
+            chars: function(text) {
+                if (lastTag !== '' && allowedTags.indexOf(lastTag) < 0) {
+                    return;
+                }
+                results += text;
+            },
+            comment: function(text) {
+                // results += "<!--" + text + "-->";
+            }
+        });
+
+        // results = results.replace(/<([^>]+?)>\s*<\/\1>/gim, '');
+        results = results.replace(/&[a-z]+;/gim, '');
+
+        return results;
+
+    } catch (e) {
+        console.trace();
+        console.log(e);
+
+        return force(dirty);
+    }
+
+}
+
+function getContent(htmlContent) {
+    try {
+        var tmp = document.createElement('div');
+        tmp.appendChild(htmlContent.cloneNode(true));
+        var dirty = '<div>' + tmp.innerHTML + '</div>';
+        return sanitize(dirty);
+    } catch (e) {
+        console.log(e);
+        return '';
+    }
+}
+
+/////
+
+function getPageUrl(url) {
+    return url.toLowerCase().replace(/\s+/g,'_').replace(/[^a-z0-9_]/g,'') + Math.floor(Math.random() * 10000) + '.xhtml';
+}
+
+function getPageTitle(inp) { //TODO
+    return inp;
+}
+
+function getSelectedNodes() {
+    if (document.selection) {
+        // return document.selection.createRange().parentElement();
+        return document.selection.createRange();
+    }
+    var selection = window.getSelection();
+    if (selection.rangeCount > 0) {
+        var range = selection.getRangeAt(0);
+        var selectionContents = range.cloneContents();
+        return selectionContents;
+    }
+}
+
+chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) {
+    console.log('Extract Html...');
+    var result = {};
+    var pageSrc = '';
+
+    if (request.type === 'extract-page') {
+        pageSrc = document.getElementsByTagName('body')[0];
+        result = {
+            url: getPageUrl(document.title),
+            title: getPageTitle(document.title), //gatPageTitle(document.title),
+            imgs: allImgSrc,
+            content: getContent(pageSrc)
+        };
+    } else if (request.type === 'extract-selection') {
+        pageSrc = getSelectedNodes();
+        result = {
+            url: getPageUrl(document.title),
+            title: getPageTitle(document.title),
+            imgs: allImgSrc,
+            content: getContent(pageSrc)
+        };
+    }
+
+    sendResponse(result);
+    console.log('Html Extracted');
+});
--- a/manifest.json
+++ b/manifest.json
@ -13,7 +13,7 @@
    "content_scripts": [{
        "matches": ["<all_urls>"],
        "css": ["fonts.css"],
-        "js": ["jquery.js", "filesaver.js", "jszip.js", "jszip-utils.js", "pure-parser.js", "gigi.js"]
+        "js": ["chapter-editor/jquery.js", "filesaver.js", "jszip.js", "jszip-utils.js", "pure-parser.js", "extractHtml.js"]
    }],

    "background": {
@ -23,7 +23,7 @@
    "browser_action": {
        "default_icon": "",
        "default_title": "Beastify",
-        "default_popup": "chapter-editor/chapter-editor.html"
+        "default_popup": "chapter-editor/menu.html"
     },

    "permissions": [