hdoc-tools 0.1.0

package/ui/js/doc.hornbill.js

@@ -0,0 +1,485 @@
+//-- DOM/URL EVENTS
+//-- THIS CONTROLS NAVIGATION
+//-- loaded in index.html
+
+var jqContentContainer = null;
+var jqLeftNav = null;
+var global = {stateParams:{},lastLayoutClass:""};    
+
+var docAppMethods = {
+    switchViewTheme:function()
+    {
+        if(ThemePreference)document.documentElement.classList.remove(ThemePreference)
+
+        if(ThemePreference === 'dark')
+        {
+            ThemePreference = 'light';
+        }
+        else{
+            ThemePreference = 'dark'
+        }
+
+        localStorage.setItem('hdocbook-theme-appearance',ThemePreference)
+        document.documentElement.classList.add(ThemePreference)
+    },
+    renderNavigation:function()
+    {
+        let self = this;
+        self.docApp.navSections = self.docApp.book.navigation.items; //-- show be an array of nav groups
+    },
+    toggleMobileMenu:function()
+    {
+        let isOpen = $(".mobile-menu-btn").data("isopen");
+        if(isOpen)
+        {
+            $(".DocSidebar").removeClass("open");
+        }
+        else
+        {
+            $(".DocSidebar").addClass("open");
+        }
+        //-- store new mode
+        $(".mobile-menu-btn").data("isopen",!isOpen);
+    },
+    resetMobileMenu:function(ev)
+    {
+        if( ev && ($(ev.srcElement).hasClass("mobile-menu-btn")[0] || $(ev.srcElement).closest(".mobile-menu-btn")[0]) )
+        {
+            //-- skp as have clikc no menu btn
+        }
+        else
+        {
+            $(".mobile-menu-btn").data("isopen",false);
+            $(".DocSidebar").removeClass("open");
+        }
+    }
+    
+};
+
+ 
+ //--
+ //-- user clicked back or forwards
+ window.addEventListener('popstate', function (event) 
+ {
+    const loadUrl = new URL(event.target.location.href);
+    loadContentUrl(loadUrl.pathname + loadUrl.hash,{},false,true);
+});
+
+
+//--- GLOBAL FUNCTIONS
+function removeTrailingSlash(str) {
+    return str.endsWith('/') ? str.slice(0, -1) : str;
+} 
+function removeStartingSlash(str) {
+    return str.startsWith('/') ? str.slice(1, str.length) : str;
+
+    //if(linkRef.indexOf("/")===0)linkRef = linkRef.replace("/","");
+} 
+
+function toSeoUrl(url) {
+    return url.toString()               // Convert to string
+        .normalize('NFD')               // Change diacritics
+        .replace(/[\u0300-\u036f]/g,'') // Remove illegal characters
+        .replace(/\s+/g,'-')            // Change whitespace to dashes
+        .toLowerCase()                  // Change to lowercase
+        .replace(/&/g,'-and-')          // Replace ampersand
+        .replace(/[^a-z0-9\-]/g,'')     // Remove anything that is not a letter, number or dash
+        .replace(/-+/g,'-')             // Remove duplicate dashes
+        .replace(/^-*/,'')              // Remove starting dashes
+        .replace(/-*$/,'');             // Remove trailing dashes
+}
+
+function listenForHrefClicks()
+{
+    //-- trap all link click events - we want to handle links so can cancel and load content ourselves
+    $("A").off("click").on("click", function(ev)
+    {
+
+        let ele =  this;
+        if(ele.href)
+        {
+            const checkUrl = new URL(ele.href);
+
+            view.resetMobileMenu();
+
+            //-- clicking on a hash tag header link element - so jsut scroll to element
+            if(checkUrl.origin +"/"===siteBaseLocation)
+            {
+                //-- if a url that is part of this doc site then handle loading content inline else let link do whatever (i.e. its an external link)                
+                ev.stopImmediatePropagation();
+                ev.preventDefault();                
+
+                //-- do we need to scroll into view element on this page
+                if(checkUrl.hash && $(checkUrl.hash +".faq-toc-item")[0])
+                {
+                    $(checkUrl.hash +".faq-toc-item")[0].scrollIntoView();    
+                    if(ele.href!==document.location.href) window.history.pushState(null, null, ele.href); //-- user has clicked a link so we want to add state to history so we can click back                
+                }
+                else
+                {                
+                    loadContentUrl(ele.getAttribute("href"),false,false);
+                }
+                return false;
+            }
+            else
+            {
+                //-- if not part of this website then always open in new tab as considered an external site
+                ele.setAttribute("target","_blank");
+            }
+        }
+    });
+
+}
+
+//-- based on content url highlight match navigation menu item
+function highlightNavigationLinkFromUrl(matchLinkHref)
+{
+    
+    matchLinkHref = removeStartingSlash(matchLinkHref).split("#")[0]; //-- remvoe # link
+    $('a.DocLink').removeClass("active");
+    
+    document.querySelectorAll('a.DocLink').forEach((el) => {
+        
+        let checkUrl = null;
+        try{
+            checkUrl = new URL(el.href);
+        }
+        catch(e)
+        {
+            console.log("BAD navigation menu item found",el.href)
+        }
+
+        if(checkUrl)
+        {
+            //console.log(checkUrl.pathname,matchLinkHref)
+            if(removeStartingSlash(checkUrl.pathname).indexOf(matchLinkHref)===0)
+            {
+                $(el).addClass("active");
+                return false;//break out
+            }
+            else if(matchLinkHref.indexOf(removeStartingSlash(checkUrl.pathname) + "/")===0)
+            {
+                $(el).addClass("active");
+                return false;//break out
+            }
+        }
+    });
+}
+
+//-- create items to stick in toc from current loaded content
+//-- searches for H2,H3
+function generateTableOfContentsFromDoc()
+{
+    let container = jqContentContainer[0];
+    if(container)
+    {
+        const currUrl = new URL(document.location.href);
+        view.docApp.tableOfContents = [];
+        for (let i=2; i<=3; i++) 
+        {
+            let headers = container.getElementsByTagName("h"+i);
+            for (let j=0; j<headers.length; j++) 
+            {
+                let jqCurrHeader = $(headers[j]);
+                //-- only process headers that do not have this class
+                if(!jqCurrHeader.hasClass("no-auto-anchor")) jqCurrHeader.addClass("faq-toc-item");
+            }
+        }
+
+        var headersTocItem = container.getElementsByClassName("faq-toc-item");
+        for (let k = 0; k < headersTocItem.length; k++) 
+        {
+            let item = headersTocItem[k];
+            let strLabel = $.trim(item.innerText);
+            if(strLabel)
+            {
+                let seoSafeId = toSeoUrl(strLabel); //-- will use SEO to set in url so can scroll to element from url
+                let linkUrl = currUrl.pathname + "#" + seoSafeId;                
+                item.id = seoSafeId;
+
+                view.docApp.tableOfContents.push({ele:item,eleText:strLabel,tagName:item.tagName,href:linkUrl});
+
+                //-- add link icon to header (using seo id)
+                $(item).append("<a class='header-anchor'><i class='bi bi-link'></i></a>");
+                $(item).find("a").attr("href",linkUrl);
+                
+            }
+        }
+    }
+}
+
+
+function loadContentUrl(linkRef,fromPageRefresh,fromPopState)
+{
+    //-- clear table of contents
+    view.docApp.tableOfContents = [];
+
+    if(linkRef.indexOf(window.location.origin +"/")===0)
+    {
+        linkRef = linkRef.replace(window.location.origin  +"/","");
+    }
+
+    //-- remove trailing / if has one
+    linkRef = removeTrailingSlash(linkRef);
+    //-- remove starting / if link starts with it
+    linkRef = removeStartingSlash(linkRef);
+
+    //-- update url in browser
+    setBrowserViewUrl(linkRef,{},fromPageRefresh,fromPopState);
+
+    //-- destroy any existing content children and events properly
+    jqContentContainer.empty();
+
+
+    //-- for now just load whatever the href prop is (we can add actions to perform specific processing and then load content based on element atts etc)
+    let frontmatterData = {};
+    fetch("content/"+linkRef).then(response =>
+    { 
+        if(response.headers.has("X-frontmatter"))
+        {
+            frontmatterData = response.headers.get("X-frontmatter");
+            frontmatterData = JSON.parse(atob(frontmatterData));
+        }
+        return response.text();
+    }).then(html => 
+    {
+        jqContentContainer.html(html);
+
+        //-- remove previous layoutclass if have one
+        if(global.lastLayoutClass)
+        {
+            $("#DocContent").removeClass(global.lastLayoutClass);
+            global.lastLayoutClass = "";
+        }
+
+        //-- if have layoutclass add it to content container - this is so we can specify table list view sizes etc
+        if(frontmatterData.layout)
+        {
+            $("#DocContent").addClass(frontmatterData.layout);
+            global.lastLayoutClass = frontmatterData.layout;
+
+            //-- if layout supports toc (expects layout to have name "<layoutname>-toc")
+            if(frontmatterData.layout.substr(frontmatterData.layout.length - 4)==="-toc")
+            {
+                //generateTableOfContentsFromDoc();
+            }
+
+        }
+
+        //--generate toc for all layouts that have h2/h3
+        generateTableOfContentsFromDoc();
+
+        //-- do any code highlighting
+        document.querySelectorAll('pre code').forEach((el) => {
+            hljs.highlightBlock(el);
+        });
+        
+        //-- show copy button by any code blocks
+        var options = {
+            contentSelector: ".injected-document-content",
+            // Delay in ms used for `setTimeout` before badging is applied
+            // Use if you need to time highlighting and badge application
+            // since the badges need to be applied afterwards.
+            // 0 - direct execution (ie. you handle timing
+            loadDelay:0,
+
+            // CSS class(es) used to render the copy icon.
+            copyIconClass: "bi bi-clipboard",
+            // CSS class(es) used to render the done icon.
+            checkIconClass: "bi bi-clipboard-check --htl-c-brand",
+
+            // intercept text copying - passed in text return text out
+            onBeforeCodeCopied: function(text) {                
+                return text;
+            }
+        };
+
+        highlightJsBadge(options);
+
+        //-- make sure selected link parents are set to .expand=true
+        if(expandNavParentSectionBySelectedLinkHref(linkRef))
+        {
+            view.updateCounter++;
+            view.$nextTick(function()
+            {
+                //-- find any navigation links that match url and highlight
+                listenForHrefClicks();                
+                highlightNavigationLinkFromUrl(linkRef);   
+
+                //-- scroll to element that match hash (if have one)
+                if(document.location.hash)
+                {
+                    $(document.location.hash)[0].scrollIntoView();
+                }
+            });
+            view.$forceUpdate();
+        }
+    });
+}
+
+function loadBookDefaultLink()
+{
+    $(".DocLink").first().click();
+}
+
+function expandNavParentSectionBySelectedLinkHref(findByLinkRef, currentNavSection)
+{
+    findByLinkRef = findByLinkRef.split("#")[0];
+    if(currentNavSection === undefined) 
+        currentNavSection = view.docApp.navSections;
+
+
+    for(let x=0;x<currentNavSection.length;x++)
+    {
+        if(currentNavSection[x].items)
+        {
+            let res = expandNavParentSectionBySelectedLinkHref(findByLinkRef,currentNavSection[x].items);
+            if(res)
+            {
+                currentNavSection[x].expand=true;
+                return res;
+            }
+        }
+        else
+        {
+            //-- check item to see if it matches url
+            if(removeStartingSlash(removeTrailingSlash(currentNavSection[x].link)) == findByLinkRef)
+            {
+                return true;
+            }
+        }
+    }
+
+}
+
+function setBrowserViewUrl(strHrefToLoad,viewData,fromPageRefresh,fromPopState)
+{
+   
+   let urlToSet = window.location.origin + "/" + strHrefToLoad;
+   const url = new URL(urlToSet);
+   
+   //-- remove any old params
+   for(let strKey in global.stateParams)
+   {
+       url.searchParams.delete(strKey);
+   }
+
+   //-- now set new data params in url
+   for(let strKey in viewData)
+   {
+       url.searchParams.set(strKey,viewData[strKey]);
+   }    
+
+   //-- store global params
+   global.stateParams = viewData
+
+   if(!fromPopState)
+   {
+     if(fromPageRefresh)
+     {
+       window.history.replaceState(null, null, url); //-- user has refreshed page or jsut visited page
+     }
+     else
+     {
+       window.history.pushState(null, null, url); //-- user has clicked a link so we want to add state to history so we can click back
+     }
+   }
+
+}
+
+async function fetchContentFile(strFilePath)
+{
+  return await fetch(strFilePath).then(response => response.text()).then(fileContent => 
+  {
+    return fileContent;
+  });
+}
+
+async function fetchJsonFile(strFilePath)
+{
+  return await fetch(strFilePath).then(response => response.json()).then(jsonObject => 
+  {
+    return jsonObject;
+  });
+}
+
+
+//-- THE INIT APP CALLED FROM index.html
+var view = new Vue({
+    el: '#vDocDevApp',
+    data: {updateCounter:0,bookId:"", docApp:{book:{},navSections:[],tableOfContents:[]}},
+    methods:docAppMethods,
+    directives: {
+       somedirectivename: {
+            bind (el, binding, vnode) {
+                //-- do something when created on element
+            }
+        }
+    } ,
+    mounted:function()
+    {
+
+    }       
+});
+
+//-- repeatable conmponent for nav sections
+Vue.component('nav-section-component', {
+    props: ['asection'],
+    template: '#nav-section-template',
+    methods:{
+        toggleNavCollapse:function(navSection)
+        {
+            navSection.expand=!navSection.expand;
+            this.$forceUpdate();
+        }    
+    }
+ });
+
+
+async function intialiseApp() {
+
+    // set theme switch
+    $(".theme-switch-checkbox").prop('checked', (ThemePreference === 'dark'));
+
+    jqContentContainer = $(".injected-document-content");
+    jqLeftNav = $("#DocSidebarNav");
+
+    await fetchJsonFile("content/library.json").then(function(data){
+
+        // Get docbook library list
+        view.docApp.library = data;
+        view.docId = view.docApp.library.books[0].docId;
+
+    }).then(function(){
+        // Get hdocbook.json
+        fetchJsonFile("content/" + view.docId + "/hdocbook.json").then(function(data)
+        {
+            view.docApp.book = data;
+            view.bookId = data.docId;
+            view.docApp.title = data.title || "";
+            view.docApp.description = data.description || "";
+            //-- now render out the nav menu
+            view.renderNavigation();
+    
+            $("#vDocDevApp").removeClass("hb-hidden");
+    
+            setTimeout(function()
+            {
+                listenForHrefClicks();
+    
+                //-- check if url is not root - in which case we need to load content for url
+                var initialLoadContentHref = window.location.href.replace(window.location.origin+"/","");
+                if(initialLoadContentHref)
+                {
+                    //-- find the link we are going to show and make sure parent/s are set to .expand=true
+                    loadContentUrl(initialLoadContentHref,true,false);
+                }
+                else
+                {
+                    //-- we are loading root so select for link
+                    loadBookDefaultLink();   
+                }
+            },200)
+        })
+    })
+ }

package/ui/js/highlightjs/LICENSE

@@ -0,0 +1,24 @@
+Copyright (c) 2006, Ivan Sagalaev
+All rights reserved.
+Redistribution and use in source and binary forms, with or without
+modification, are permitted provided that the following conditions are met:
+
+    * Redistributions of source code must retain the above copyright
+      notice, this list of conditions and the following disclaimer.
+    * Redistributions in binary form must reproduce the above copyright
+      notice, this list of conditions and the following disclaimer in the
+      documentation and/or other materials provided with the distribution.
+    * Neither the name of highlight.js nor the names of its contributors 
+      may be used to endorse or promote products derived from this software 
+      without specific prior written permission.
+
+THIS SOFTWARE IS PROVIDED BY THE REGENTS AND CONTRIBUTORS ``AS IS'' AND ANY
+EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED
+WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
+DISCLAIMED. IN NO EVENT SHALL THE REGENTS AND CONTRIBUTORS BE LIABLE FOR ANY
+DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES
+(INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES;
+LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND
+ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+(INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS
+SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.