PoNG Module: Navigation Bar: Unterschied zwischen den Versionen

Aus MH
Wechseln zu: Navigation, Suche
(Die Seite wurde neu angelegt: „Category:PoNGThis module is a uses header hook to add a navigation DIV in PoNG. The whole page is reloaded and the layout structure can be switched to …“)
 
K
 
Zeile 1: Zeile 1:
 
[[Category:PoNG]]This module is a uses header hook to add a navigation DIV in [[PoNG]]. The whole page is reloaded and the layout structure can be switched to a different one.  
 
[[Category:PoNG]]This module is a uses header hook to add a navigation DIV in [[PoNG]]. The whole page is reloaded and the layout structure can be switched to a different one.  
 
Please have a look at the other [[PoNG_Modules#Standard_Modules_coming_with_PoNG|standard modules coming with PoNG]].
 
  
 
This module uses the "layout" control feature of PoNG. So if you utilize the GET parameter "layout" the value  will be used to  
 
This module uses the "layout" control feature of PoNG. So if you utilize the GET parameter "layout" the value  will be used to  
 
determine the layout definition, so if you load <code><nowiki>http://mysite.xyz/basedir/index.html?layout=XYZ</nowiki> the structure JSON is get from <code><nowiki>http://mysite.xyz/basedir/svc/layout/XYZ/structure</nowiki></code>
 
determine the layout definition, so if you load <code><nowiki>http://mysite.xyz/basedir/index.html?layout=XYZ</nowiki> the structure JSON is get from <code><nowiki>http://mysite.xyz/basedir/svc/layout/XYZ/structure</nowiki></code>
 +
 +
Please have a look at the other [[PoNG_Modules#Standard_Modules_coming_with_PoNG|standard modules coming with PoNG]].
  
 
== Usage in "structure" ==
 
== Usage in "structure" ==

Aktuelle Version vom 30. März 2014, 18:36 Uhr

This module is a uses header hook to add a navigation DIV in PoNG. The whole page is reloaded and the layout structure can be switched to a different one.

This module uses the "layout" control feature of PoNG. So if you utilize the GET parameter "layout" the value will be used to determine the layout definition, so if you load http://mysite.xyz/basedir/index.html?layout=XYZ the structure JSON is get from http://mysite.xyz/basedir/svc/layout/XYZ/structure

Please have a look at the other standard modules coming with PoNG.

Usage in "structure"

Simply add a action to the actions array with "type": "modal-form"

Example structure file extract:

{
  "layout": {
     ...
     "header": [
     {
        ...
        "modules" : [ { "id": "MainNav", "type": "pong-navbar", "param": { "confURL":"nav" } } ] 
     },
     ...
   ],
   ...
}

Configuration

The confURL should be like this example:

{
   "navigations" : [
      { "layout":"main", "label":"Main"  },
      { "layout":"crm", "label":"CRM"  }
   }
}

Example result

Here is a Nav Bar result:

Fehler beim Erstellen des Vorschaubildes: Die Miniaturansicht konnte nicht am vorgesehenen Ort gespeichert werden

HTML is:


 <html>
 <head>...</head>
 <body>
    <div id="maindiv" class="page-width">
    <div id="header">
                ...
      <div id="MainNav" class="pong-navbar">
        <div class="pongNavBarItem pongNavBarItemActive">
            <a href="index.html?layout=main">
                Main
            </a>
        </div>
        <div class="pongNavBarItem">
            <a href="index.html?layout=crm">
                CRM
            </a>
        </div>
     </div>
     ...

CSS

  • Main DIV class: pong-navbar
  • Main DIV ID: <modules.id>
  • Navigation item DIV class: pongNavBarItem
    • Active page has additionally the class: pongNavBarItemActive