Navigarea în cadrul site-ului

Ierarhia unui site este stocată în fişierul structure.json asociat cu site-ul. Ierarhia este încărcată în memorie şi este disponibilă în contextul paginii sub forma obiectului SCS.structureMap.

Generatorul de site-uri citeşte fişierul structure.json pentru a desena arborele site-ului în Generatorul de site-uri. Fişierul structure.json va conţine codul pentru paginile site-ului. De exemplu:

"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
     }

Codul JavaScript de navigare este necesar în cadrul paginilor site-ului şi pentru a citi acea structură şi pentru a extrage linkurile de navigare pentru site. Şabloanele furnizate cu Oracle Content Management includ exemple de fişiere JavaScript de navigare care ilustrează acest proces.

Fişierul topnav.js utilizat în unele dintre temele furnizate cu Oracle Content Management este un exemplu despre cum puteţi utiliza obiectul SCS.structureMap alături de apelurile API-ului de randare, precum SCSRenderAPI.getPageLinkData pentru a traversa structura site-ului şi a extrage marcajul HTML necesar pentru a randa meniurile de navigare în pagină. Iată codul din fişierul exemplu 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();
                        }
                }
        );
}

Puteţi să utilizaţi apelurile API-ului de randare pentru a genera linkuri de navigare care vor funcţiona în modurile Editare şi Previzualizare a site-ului şi într-un site publicat online. Consultaţi Referinţa API-ului de randare.

Este o practică bună să se introducă informaţiile de navigare într-un fişier JavaScript, precum topnav.js. Fişierul JavaScript este, de obicei, stocat în folderul /assets/js/ al temei, după cum puteţi vedea în temele exemplu furnizate cu Oracle Content Management.