Navigácia na lokalite

Hierarchia lokality je uložená v súbore structure.json priradenom k lokalite. Hierarchia sa načíta do pamäte a sprístupní v kontexte stránky ako objekt SCS.structureMap.

Generátor lokalít číta súbor structure.json na vykreslenie stromu lokality. Súbor structure.json bude obsahovať kód pre stránky lokality. Príklad:

"pages": [  {        
     "id": 100,      
     "name": "Home",                                    
     "parentId": null,             
     "pageUrl": "index.html",      
     "hideInNavigation": false,    
     "linkUrl": "",                
     "linkTarget": "",             
     "children": [ 200,            
                   300,            
                   400,            
                   500 ],          
     "overrideUrl":false           
     } 
   
     {
     "id":200,
     "name":"Products"
     "parentId":100,                
     "hideInNavigation":false,      
     "LinkUrl":"",                  
                 "linkTarget":"",               
                 "children":[ 204, 205],        
                 "overrideUrl":false            
     }                              

     {
     "id":204,
     "name":"Hiking Boots",
     "parentId":200,
                 "pageUrl":"products/hiking_boots.html",
                 "hideInNavigation":false,
                 "linkUrl":"",
     "linkTarger":"",
     "children":[],
     "overrideUrl":false
     }

Stránky lokality musia obsahovať aj kód JavaScript pre navigáciu, aby sa pre lokalitu prečítala aj táto štruktúra a vykreslili navigačné prepojenia. Šablóny poskytované so službou Oracle Content Management obsahujú vzorové súbory JavaScript pre navigáciu, ktoré ilustrujú, ako to funguje.

Súbor topnav.js, ktorý sa používa v niektorých motívoch poskytovaných so službou Oracle Content Management, predstavuje príklad použitia objektu SCS.structureMap s volaniami rozhrania Render API, ako je SCSRenderAPI.getPageLinkData, na prechod štruktúrou lokality a vykreslenie markupu HTML potrebného na vykreslenie ponúk navigácie na stránke. Tu je kód zo vzorového súboru topnav.js:

function renderNode(id, navBar)
{
        if (id >= 0)
        {
                var navNode = SCS.structureMap[id];
                if( navNode &&
                        (
                                ( typeof navNode.hideInNavigation != "boolean" ) ||
                                ( navNode.hideInNavigation === false )
                        ) )
                {
                        var navItem = document.createElement("li");
                        var navLink = document.createElement("a");
                        var navText = document.createTextNode(navNode.name);
                        
                        var linkData = SCSRenderAPI.getPageLinkData(navNode.id) || {};
                        if( linkData.href ) {
                                navLink.href = linkData.href;
                        }
                        if( linkData.target ) {
                                navLink.target = linkData.target;
                        }

                        navLink.appendChild(navText);
                        navItem.appendChild(navLink);

                        if (navNode.children.length > 0)
                        {
                                var navSub = document.createElement("ul");
                                
                                for (var c = 0; c < navNode.children.length; c++)
                                {
                                        renderNode(navNode.children[c], navSub);
                                }
                                
                                navItem.appendChild(navSub);
                        }
                        navBar.appendChild(navItem);
                }
        }
}

function renderNav()
{
        var topnav = document.getElementById("topnav");         // expected to be an empty <div>

        if (topnav)
        {
                var navBar = document.createElement("ul");

                renderNode(SCS.navigationRoot, navBar);

                topnav.appendChild(navBar);
        }
}

// Must wait for all our script to be ready...
if (document.addEventListener)
{
        document.addEventListener('scsrenderstart', renderNav, false); 
}
else if (document.attachEvent)
{
        document.documentElement.scsrenderstart = 0;
        document.documentElement.attachEvent("onpropertychange",
                function(event)
                {
                        if (event && (event.propertyName == "scsrenderstart"))
                        {
                                renderNav();
                        }
                }
        );
}

Pomocou volaní rozhrania Render API môžete vygenerovať navigačné prepojenia, ktoré budú fungovať v režimoch úprav a ukážky lokality, ako aj na publikovanej lokalite online. Pozrite si časť Popis rozhrania Render API.

Navigačné informácie sa odporúča vložiť do jedného súboru JavaScript, napríklad topnav.js. Tento súbor JavaScript sa zvyčajne nachádza v priečinku /assets/js/ motívu, ako je to aj v prípade vzorových motívov poskytovaných so službou Oracle Content Management.