clean-mla-gdoc 1.0.2

package/README.md

@@ -0,0 +1,60 @@
+# cleanMLAGDoc.js v1.0.2
+
+A lightweight JavaScript library specifically designed to reformat **Google Docs HTML exports** into the **MLA (Modern Language Association) Style** layout. It handles physical pagination, alphabetical sorting of Works Cited, and provides a "DRAFT" watermark feature.
+
+> [!IMPORTANT]
+> **Compatibility Note:** This library is specifically tailored for the class structures (`.c1`, `.c7`, `.doc-content`) generated by **Google Docs** when exported as HTML. For best results, ensure your Google Doc is using the **Report** preset before exporting.
+
+## Features
+*   **Dynamic Tab Title**: Automatically renames the browser tab to `[LastName] [FirstName] [AssignmentName]`.
+*   **Auto-Pagination**: Breaks content into 8.5" x 11" pages with 1-inch margins.
+*   **MLA Header**: Processes the 4-line header and title from Google Docs classes.
+*   **Smart Date Mapping**: Converts numerical dates (e.g., `12/25/2026`) to MLA format (`25 Dec. 2026`).
+*   **Works Cited Sorting**: Automatically alphabetizes the "Works Cited" section.
+*   **Draft Mode**: Trigger a "DRAFT" watermark by adding `| draft` to your document header.
+
+## How the Tab Title Works
+The script automatically updates the browser tab title following a professional file-naming convention. It extracts the student's name from the first paragraph and the assignment title from the header. To maintain a professional look, the script **strips the `| draft` flag** from the tab title while retaining it for the watermark logic.
+
+**Final Format:** `[LastName] [FirstName] [AssignmentName]`
+
+## Usage & Formatting Rules
+
+### Enabling Draft Mode
+To enable the "DRAFT" watermark across all pages, include the string `| draft` (case-insensitive) in the document header. 
+*   **Requirement**: The `| draft` flag **must be placed after** the assignment name.
+*   *Example:* `English Essay | draft`
+
+### Works Cited
+Any content following an element containing the text "Works Cited" will be moved to its own page and sorted alphabetically based on the first word of each entry.
+
+## Installation
+Include the minified script in your project. The library will automatically detect if jQuery is present; if not, it will load it along with other necessary assets from a CDN.
+
+```html
+<!-- Include the library at the end of your body tag -->
+<script src="https://cdn.jsdelivr.net"></script>
+
+## Printing
+Printing is **seamless**. Because the library handles all pagination, margins, and font styling via a specialized `@media print` stylesheet, you do not need to adjust your browser's print settings. Simply use `Ctrl + P` (or `Cmd + P`) and the document will print exactly as it appears on the screen.
+
+> [!TIP]
+> **Print Settings:** For the cleanest output, ensure **"Headers and Footers"** is **unchecked** in your browser's print dialog to avoid redundant browser-generated page numbers or URLs. To see the "DRAFT" watermark, ensure **"Background Graphics"** is **checked**.
+
+## Contributing
+Contributions are welcome! If Google Docs updates its HTML export structure and changes class names (like `.c1` or `.c7`), please feel free to:
+1. **Fork** the repository.
+2. **Update** the selectors in the unminified `cleanMLAGDoc.js`.
+3. Submit a **Pull Request** with a description of the changes.
+
+## Dependencies
+The library dynamically loads the following assets via [jsDelivr](https://www.jsdelivr.com) if they are not already present in the environment:
+* [jQuery 3.7.1](https://cdn.jsdelivr.net/npm/jquery@3.7.1/)
+* [Favicon.js 1.0.0](https://cdn.jsdelivr.net/npm/favicon.js@1.0.0/)
+
+## License
+This project is licensed under the **GNU General Public License v3.0**.  
+Full license text available at: [https://www.gnu.org](https://www.gnu.org)
+
+---
+**Copyright (c) 2026 Musicalisk <Musicalisk.travail@tuta.io>**

package/dist/cleanMLAGDoc.js

@@ -0,0 +1,246 @@
+/*
+ * cleanMLAGDoc.js v1.0.2
+ * Copyright (c) 2026 Musicalisk <Musicalisk.travail@tuta.io>
+ * Licensed under the GNU General Public License v3.0
+ * Full license text: https://www.gnu.org
+ */
+
+(function() {
+    // Configuration for external dependencies and assets
+    const CONFIG = {
+        jqueryUrl: "https://cdn.jsdelivr.net/npm/jquery@3.7.1/dist/jquery.min.js",
+        faviconUrl: "https://cdn.jsdelivr.net/npm/favicon.js@1.0.0/dist/favicon.min.js",
+        iconFrames: [
+            'https://img.icons8.com/?size=16&id=1395&format=png&color=FA5252',
+            'https://img.icons8.com/?size=16&id=1395&format=png&color=20C997',
+            'https://img.icons8.com/?size=16&id=1395&format=png&color=339AF0'
+        ]
+    };
+
+    // Helper to load external scripts dynamically
+    const loadScript = (url, callback) => {
+        let script = document.createElement("script");
+        script.src = url;
+        script.onload = callback;
+        document.head.appendChild(script);
+    };
+
+    // Main formatting logic
+    const initializeCleanMLAG = () => {
+        /** 
+         * CSS INJECTION 
+         * Defines the physical 8.5x11 inch page structure and the "DRAFT" watermark.
+         */
+        $('<style>').html(`
+            @page { size: 8.5in 11in; margin: 0; }
+            html { background: #d0d0d0 !important; width: 100% !important; }
+            body { 
+                visibility: hidden; 
+                margin: 0 !important; 
+                padding: 40px 0 !important; 
+                display: flex !important; 
+                flex-direction: column !important; 
+                align-items: center !important; 
+                width: 100% !important; 
+                max-width: none !important; 
+                background: transparent !important; 
+                font-family: "Times New Roman", serif !important; 
+                line-height: 2.0 !important; 
+                color: #000 !important; 
+            }
+            .mla-page-container { 
+                background: #fff !important; 
+                box-shadow: 0 0 20px rgba(0,0,0,.2) !important; 
+                width: 8.5in !important; 
+                height: 11in !important; 
+                margin: 0 auto 40px auto !important; 
+                padding: 1in !important; 
+                box-sizing: border-box !important; 
+                position: relative; 
+                overflow: hidden; 
+                flex-shrink: 0; 
+            }
+            .watermark::before { 
+                content: 'DRAFT' !important; 
+                position: absolute !important; 
+                top: 50% !important; 
+                left: 50% !important; 
+                transform: translate(-50%, -50%) rotate(-45deg) !important; 
+                font-size: 150px !important; 
+                color: rgba(0,0,0,0.12) !important; 
+                z-index: 99 !important; 
+                pointer-events: none !important; 
+                white-space: nowrap !important; 
+                display: block !important; 
+            }
+            .no-indent { text-indent: 0 !important; }
+            p { text-indent: .5in !important; margin: 0 !important; }
+            .header-wrapper { 
+                position: absolute; 
+                top: .5in; 
+                right: 1in; 
+                text-align: right !important; 
+                text-indent: 0 !important; 
+                width: 6.5in; 
+                height: .5in; 
+                line-height: .5in !important; 
+                z-index: 10; 
+            }
+            .hanging-indent { text-indent: -.5in !important; padding-left: .5in !important; }
+            .centered-title { text-align: center !important; text-indent: 0 !important; }
+            @media print { 
+                html { background: #fff !important; } 
+                body { padding: 0 !important; visibility: visible !important; } 
+                .mla-page-container { margin: 0 auto !important; box-shadow: none !important; page-break-after: always !important; } 
+            }
+        `).appendTo('head');
+
+        setTimeout(() => {
+            /** 
+             * DRAFT & METADATA DETECTION 
+             * Checks the header for the "| draft" string and extracts the assignment title.
+             */
+            const headerElement = $('.c1').first();
+            const headerText = headerElement.text().trim();
+            const isDraft = /\|\s*draft/i.test(headerText);
+            const assignmentName = String(headerText.replace(/\|\s*draft.*/i, '').trim() || "Assignment");
+
+            // Extract Name and Page Content
+            let paragraphs = $('p').filter(function() {
+                return $(this).text().trim().length > 0 && !$(this).hasClass('c1');
+            });
+
+            let firstLine = paragraphs.first().text().trim();
+            let nameParts = firstLine.split(' ');
+            let firstName = String(nameParts[0] || "First");
+            let lastName = String(nameParts[nameParts.length - 1] || "Last");
+
+            document.title = lastName + " " + firstName + " " + assignmentName;
+
+            // Cleanup: remove raw elements and duplicate headers
+            $('.c1').remove();
+            $('*').filter(function() {
+                return ($(this).css('text-align') === 'right' || $(this).css('position') === 'absolute') && $(this).text().includes(lastName);
+            }).remove();
+
+            let elementsToProcess = $('.doc-content > *,.c7 > *,body > *').not('script,style,.mla-page-container').get();
+            $('body').children().not('script,style').remove();
+
+            /** 
+             * PAGE FACTORY 
+             * Creates a new page and applies the "DRAFT" watermark if flagged.
+             */
+            const createPage = (pageNum) => {
+                let page = $('<div class="mla-page-container"></div>');
+                if (isDraft) page.addClass('watermark');
+                page.append(`<div class="header-wrapper">${lastName} ${pageNum}</div>`);
+                return page;
+            };
+
+            // Pagination state
+            let currentPageNum = 1;
+            let currentPage = createPage(currentPageNum);
+            let currentHeight = 0;
+            const maxHeight = 860; // Max vertical content height before page break
+            let worksCitedStarted = false;
+            let processedHeader = false;
+            let processedTitle = false;
+            let worksCitedItems = [];
+
+            $('body').append(currentPage);
+
+            /** 
+             * DATE LOGIC 
+             * Converts "MM/DD/YYYY" or "DD/MM/YYYY" styles to "DD Mon. YYYY".
+             */
+            const getMonthName = (n) => ["", "Jan.", "Feb.", "Mar.", "Apr.", "May", "June", "July", "Aug.", "Sept.", "Oct.", "Nov.", "Dec."][parseInt(n)] || "";
+            const dateRegex = /^(\d{1,2})[\/\-\.](\d{1,2})[\/\-\.](\d{2,4})$/;
+
+            /** 
+             * RENDERING ENGINE 
+             * Measures element height in a hidden container to determine if it fits on the current page.
+             */
+            const renderElement = (element) => {
+                let tempWrapper = $('<div style="width:6.5in;position:absolute;visibility:hidden;line-height:2.0"></div>')
+                    .append(element.clone())
+                    .appendTo('body');
+                let elementHeight = tempWrapper.outerHeight(true);
+                tempWrapper.remove();
+
+                if (currentHeight + elementHeight > maxHeight) {
+                    currentPageNum++;
+                    currentPage = createPage(currentPageNum);
+                    $('body').append(currentPage);
+                    currentHeight = 0;
+                }
+                currentPage.append(element);
+                currentHeight += elementHeight;
+            };
+
+            // Content processing loop
+            $(elementsToProcess).each(function() {
+                let $el = $(this);
+                let text = $el.text().trim();
+
+                if (text.length === 0 && !$el.is('img,table')) return;
+
+                // Detect start of Works Cited
+                if (text.toLowerCase().includes("works cited") && !worksCitedStarted) {
+                    worksCitedStarted = true;
+                    currentPageNum++;
+                    currentPage = createPage(currentPageNum);
+                    $('body').append(currentPage);
+                    currentHeight = 0;
+                    $el.addClass('centered-title no-indent');
+                    renderElement($el);
+                    return;
+                }
+
+                if (!worksCitedStarted) {
+                    // Logic for first-page MLA header
+                    if (!processedHeader) {
+                        $el.addClass('no-indent');
+                        let match = text.match(dateRegex);
+                        if (match) {
+                            // match[1] = Day, match[2] = Month, match[3] = Year
+                            $el.text(match[1] + " " + getMonthName(match[2]) + " " + match[3]);
+                            processedHeader = true;
+                        }
+                    } else if (!processedTitle) {
+                        $el.addClass('centered-title no-indent');
+                        processedTitle = true;
+                    } else {
+                        let html = $el.html();
+                        if (html.includes('&nbsp;')) $el.html(html.replace(/&nbsp;/g, ' '));
+                    }
+                    renderElement($el);
+                } else {
+                    // Gather entries for alphabetical sorting
+                    worksCitedItems.push($el.addClass('hanging-indent no-indent'));
+                }
+            });
+
+            /** 
+             * WORKS CITED ALPHABETICAL SORT 
+             * Sorts entries and renders them to the final pages.
+             */
+            if (worksCitedItems.length > 0) {
+                worksCitedItems.sort((a, b) => a.text().trim().localeCompare(b.text().trim()))
+                    .forEach(item => renderElement(item));
+            }
+
+            // Reveal document
+            $('body').css('visibility', 'visible');
+
+            // Optional Favicon Animation
+            loadScript(CONFIG.faviconUrl, () => {
+                if (window.favicon || window.favico) {
+                    (window.favicon || window.favico).animate(CONFIG.iconFrames, 1750);
+                }
+            });
+        }, 600);
+    };
+
+    // Entry point: ensure jQuery is loaded
+    window.jQuery ? initializeCleanMLAG() : loadScript(CONFIG.jqueryUrl, initializeCleanMLAG);
+})();

package/dist/cleanMLAGDoc.min.js

@@ -0,0 +1 @@
+/* cleanMLAGDoc.min.js v1.0.2 | Copyright (c) 2026 Musicalisk <Musicalisk.travail@tuta.io> | Licensed under the GNU General Public License v3.0 | Full license text: https://www.gnu.org */(function(){const L={j:"https://cdn.jsdelivr.net/npm/jquery@3.7.1/dist/jquery.min.js",f:"https://cdn.jsdelivr.net/npm/favicon.js@1.0.0/dist/favicon.min.js",i:['https://img.icons8.com/?size=16&id=1395&format=png&color=FA5252','https://img.icons8.com/?size=16&id=1395&format=png&color=20C997','https://img.icons8.com/?size=16&id=1395&format=png&color=339AF0']};const l=(u,c)=>{let s=document.createElement("script");s.src=u;s.onload=c;document.head.appendChild(s)};const r=()=>{$('<style>').html(`@page{size:8.5in 11in;margin:0}html{background:#d0d0d0!important;width:100%!important}body{visibility:hidden;margin:0!important;padding:40px 0!important;display:flex!important;flex-direction:column!important;align-items:center!important;width:100%!important;max-width:none!important;background:transparent!important;font-family:"Times New Roman",serif!important;line-height:2.0!important;color:#000!important}.mla-page-container{background:#fff!important;box-shadow:0 0 20px rgba(0,0,0,.2)!important;width:8.5in!important;height:11in!important;margin:0 auto 40px auto!important;padding:1in!important;box-sizing:border-box!important;position:relative;overflow:hidden;flex-shrink:0}.watermark::before{content:'DRAFT'!important;position:absolute!important;top:50%!important;left:50%!important;transform:translate(-50%,-50%) rotate(-45deg)!important;font-size:150px!important;color:rgba(0,0,0,0.12)!important;z-index:99!important;pointer-events:none!important;white-space:nowrap!important;display:block!important}.no-indent{text-indent:0!important}p{text-indent:.5in!important;margin:0!important}.header-wrapper{position:absolute;top:.5in;right:1in;text-align:right!important;text-indent:0!important;width:6.5in;height:.5in;line-height:.5in!important;z-index:10}.hanging-indent{text-indent:-.5in!important;padding-left:.5in!important}.centered-title{text-align:center!important;text-indent:0!important}@media print{html{background:#fff!important}body{padding:0!important;visibility:visible!important}.mla-page-container{margin:0 auto!important;box-shadow:none!important;page-break-after:always!important}}`).appendTo('head');setTimeout(()=>{const h=$('.c1').first(),ht=h.text().trim();const isD=/\|\s*draft/i.test(ht);const an=String(ht.replace(/\|\s*draft.*/i,'').trim()||"Assignment");let pgs=$('p').filter(function(){return $(this).text().trim().length>0&&!$(this).hasClass('c1')});let s=pgs.first().text().trim(),n=s.split(' '),f=String(n[0]||"First"),ln=String(n[n.length-1]||"Last");document.title=ln+" "+f+" "+an;$('.c1').remove();$('*').filter(function(){return($(this).css('text-align')==='right'||$(this).css('position')==='absolute')&&$(this).text().includes(ln)}).remove();let e=$('.doc-content > *,.c7 > *,body > *').not('script,style,.mla-page-container').get();$('body').children().not('script,style').remove();const p=(v)=>{let g=$('<div class="mla-page-container"></div>');if(isD)g.addClass('watermark');g.append(`<div class="header-wrapper">${ln} ${v}</div>`);return g};let c=1,u=p(c),y=0,x=860,z=false,ph=false,pt=false,ci=[];$('body').append(u);const gm=(n)=>["","Jan.","Feb.","Mar.","Apr.","May","June","July","Aug.","Sept.","Oct.","Nov.","Dec."][parseInt(n)]||"",dr=/^(\d{1,2})[\/\-\.](\d{1,2})[\/\-\.](\d{2,4})$/,re=(o)=>{let k=$('<div style="width:6.5in;position:absolute;visibility:hidden;line-height:2.0"></div>').append(o.clone()).appendTo('body'),q=k.outerHeight(true);k.remove();if(y+q>x){c++;u=p(c);$('body').append(u);y=0}u.append(o);y+=q};$(e).each(function(j){let o=$(this),v=o.text().trim();if(v.length===0&&!o.is('img,table'))return;if(v.toLowerCase().includes("works cited")&&!z){z=true;c++;u=p(c);$('body').append(u);y=0;o.addClass('centered-title no-indent');re(o);return}if(!z){if(!ph){let m=v.match(dr);if(m){o.text(m[1]+" "+gm(m[2])+" "+m[3]);ph=true}o.addClass('no-indent')}else if(!pt){o.addClass('centered-title no-indent');pt=true}else{let h=o.html();if(h.includes('&nbsp;'))o.html(h.replace(/&nbsp;/g,' '))}re(o)}else{ci.push(o.addClass('hanging-indent no-indent'))}});if(ci.length>0){ci.sort((a,b)=>a.text().trim().localeCompare(b.text().trim())).forEach(i=>re(i))} $('body').css('visibility','visible');l(L.f,()=>{if(window.favicon||window.favico)(window.favicon||window.favico).animate(L.i,1750)})},600)};window.jQuery?r():l(L.j,r)})();

package/package.json

@@ -0,0 +1,26 @@
+{
+  "name": "clean-mla-gdoc",
+  "version": "1.0.2",
+  "description": "A lightweight JavaScript library to reformat Google Docs HTML exports into MLA Style layout with auto-pagination and Works Cited sorting.",
+  "main": "dist/cleanMLAGDoc.js",
+  "browser": "dist/cleanMLAGDoc.min.js",
+  "keywords": [
+    "\"mla\"",
+    "\"google-docs\"",
+    "\"academic\""
+  ],
+  "homepage": "https://github.com/Musicalisk/clean-mla-gdoc#readme",
+  "bugs": {
+    "url": "https://github.com/Musicalisk/clean-mla-gdoc/issues"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/Musicalisk/clean-mla-gdoc.git"
+  },
+  "license": "ISC",
+  "author": "\"Musicalisk <Musicalisk.travail@tuta.io>",
+  "type": "commonjs",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  }
+}