Optimized the layout in case DISABLE_INDEX=YES and GENERATE_TREEVIEW=YES

- also illustrated the various layouts in the customization section of
  the manual to make choosing easier.

doc/CMakeLists.txt

@@ -82,6 +82,10 @@ set(DOC_FILES
         infoflow.fig
         infoflow.png
         install.doc
+        layout_index_and_notreeview.png
+        layout_index_and_treeview.png
+        layout_noindex_and_notreeview.png
+        layout_noindex_and_treeview.png
         lists.doc
         markdown.doc
         output.doc

doc/customize.doc

@@ -52,16 +52,25 @@ corresponding with the following settings:
 - \ref cfg_disable_index "DISABLE_INDEX" = \c NO
 - \ref cfg_generate_treeview "GENERATE_TREEVIEW" = \c NO
 
+\image html layout_index_and_notreeview.png
+\image latex layout_index_and_notreeview.png width=8cm
+
 you can switch to an interactive navigation tree as sidebar using
 
 - \ref cfg_disable_index "DISABLE_INDEX" = \c YES
 - \ref cfg_generate_treeview "GENERATE_TREEVIEW" = \c YES
 
+\image html layout_noindex_and_treeview.png
+\image latex layout_noindex_and_treeview.png width=8cm
+
 or even have both forms of navigation:
 
 - \ref cfg_disable_index "DISABLE_INDEX" = \c NO
 - \ref cfg_generate_treeview "GENERATE_TREEVIEW" = \c YES
 
+\image html layout_index_and_treeview.png
+\image latex layout_index_and_treeview.png width=8cm
+
 if you already use an external index (i.e. have one of the following
 options enabled
 \ref cfg_generate_htmlhelp "GENERATE_HTMLHELP",
@@ -73,6 +82,9 @@ then you can also disable all indices, like so:
 - \ref cfg_disable_index "DISABLE_INDEX" = \c YES
 - \ref cfg_generate_treeview "GENERATE_TREEVIEW" = \c NO
 
+\image html layout_noindex_and_notreeview.png
+\image latex layout_noindex_and_notreeview.png width=8cm
+
 \subsection minor_tweaks_dynsection Dynamic Content
 
 To make the HTML output more interactive, doxygen provides a number of options

doc/starting.doc

@@ -109,27 +109,23 @@ using the following table:
 
 Extension | Language | Extension | Language     | Extension | Language
 ---------:|--------- | ---------:|------------- | ---------:|---------
-.dox      |C / C++   | .idl      |IDL           | .f        |Fortran
-.doc      |C / C++   | .ddl      |IDL           | .for      |Fortran
-.c        |C / C++   | .odl      |IDL           | .f90      |Fortran
-.cc       |C / C++   | .java     |Java          | .f95      |Fortran
-.cxx      |C / C++   | .cs       |C#            | .f03      |Fortran
-.cpp      |C / C++   | .d        |D             | .f08      |Fortran
-.c++      |C / C++   | .php      |PHP           | .f18      |Fortran
-.ii       |C / C++   | .php4     |PHP           | .vhd      |VHDL
-.ixx      |C / C++   | .php5     |PHP           | .vhdl     |VHDL
-.ipp      |C / C++   | .inc      |PHP           | .ucf      |VHDL
-.i++      |C / C++   | .phtml    |PHP           | .qsf      |VHDL
-.inl      |C / C++   | .m        |Objective-C   | .l        |Lex
-.h        |C / C++   | .M        |Objective-C   | .md       |Markdown
-.H        |C / C++   | .py       |Python        | .markdown |Markdown
-.hh       |C / C++   | .pyw      |Python        | .ice      |Slice
-.HH       |C / C++   | | | | |
-.hxx      |C / C++   | | | | |
-.hpp      |C / C++   | | | | |
-.h++      |C / C++   | | | | |
-.mm       |C / C++   | | | | |
-.txt      |C / C++   | | | | |
+.dox      |C / C++   | .hpp      |C / C++       |.py        |Python
+.doc      |C / C++   | .h++      |C / C++       |.pyw       |Python
+.c        |C / C++   | .mm       |C / C++       |.f         |Fortran
+.cc       |C / C++   | .txt      |C / C++       |.for       |Fortran
+.cxx      |C / C++   | .idl      |IDL           |.f90       |Fortran
+.cpp      |C / C++   | .ddl      |IDL           |.f95       |Fortran
+.c++      |C / C++   | .odl      |IDL           |.f03       |Fortran
+.ii       |C / C++   | .java     |Java          |.f08       |Fortran
+.ixx      |C / C++   | .cs       |C#            |.f18       |Fortran
+.ipp      |C / C++   | .d        |D             |.vhd       |VHDL
+.i++      |C / C++   | .php      |PHP           |.vhdl      |VHDL
+.inl      |C / C++   | .php4     |PHP           |.ucf       |VHDL
+.h        |C / C++   | .php5     |PHP           |.qsf       |VHDL
+.H        |C / C++   | .inc      |PHP           |.l         |Lex
+.hh       |C / C++   | .phtml    |PHP           |.md        |Markdown
+.HH       |C / C++   | .m        |Objective-C   |.markdown  |Markdown
+.hxx      |C / C++   | .M        |Objective-C   |.ice       |Slice
 
 Please note that the above list might contain more items than that by default set
 in the \ref cfg_file_patterns "FILE_PATTERNS".

src/htmlgen.cpp

@@ -385,6 +385,9 @@ static QCString substituteHtmlKeywords(const QCString &str,
   if (treeView)
   {
     treeViewCssJs = "<link href=\"$relpath^navtree.css\" rel=\"stylesheet\" type=\"text/css\"/>\n"
+                        "<script type=\"text/javascript\">var page_layout=";
+    treeViewCssJs += Config_getBool(DISABLE_INDEX) ? "1" : "0";
+    treeViewCssJs += ";</script>\n"
 			"<script type=\"text/javascript\" src=\"$relpath^resize.js\"></script>\n"
 			"<script type=\"text/javascript\" src=\"$relpath^navtreedata.js\"></script>\n"
 			"<script type=\"text/javascript\" src=\"$relpath^navtree.js\"></script>\n";
@@ -2556,8 +2559,12 @@ QCString HtmlGenerator::writeSplitBarAsString(const QCString &name,const QCStrin
   // write split bar
   if (generateTreeView)
   {
-    result = QCString(
-     "<div id=\"side-nav\" class=\"ui-resizable side-nav-resizable\">\n"
+    if (!Config_getBool(DISABLE_INDEX))
+    {
+      result += QCString(
+       "<div id=\"side-nav\" class=\"ui-resizable side-nav-resizable\">\n");
+    }
+    result+= QCString(
      "  <div id=\"nav-tree\">\n"
      "    <div id=\"nav-tree-contents\">\n"
      "      <div id=\"nav-sync\" class=\"sync\"></div>\n"

templates/html/doxygen.css

@@ -1347,14 +1347,14 @@ dl.section dd {
 
 #projectname
 {
-	font: 300% Tahoma, Arial,sans-serif;
+	font: 200% Tahoma, Arial,sans-serif;
 	margin: 0px;
 	padding: 2px 0px;
 }
 
 #projectbrief
 {
-	font: 120% Tahoma, Arial,sans-serif;
+	font: 90% Tahoma, Arial,sans-serif;
 	margin: 0px;
 	padding: 0px;
 }

templates/html/header.html

@@ -17,6 +17,11 @@
 $extrastylesheet
 </head>
 <body>
+<!--BEGIN DISABLE_INDEX-->
+<!--BEGIN GENERATE_TREEVIEW-->
+<div id="side-nav" class="ui-resizable side-nav-resizable">
+<!--END GENERATE_TREEVIEW-->
+<!--END DISABLE_INDEX-->
 <div id="top"><!-- do not remove this div, it is closed by doxygen! -->
 
 <!--BEGIN TITLEAREA-->
@@ -29,8 +34,7 @@
   <!--END PROJECT_LOGO-->
   <!--BEGIN PROJECT_NAME-->
   <td id="projectalign" style="padding-left: 0.5em;">
-   <div id="projectname">$projectname
-   <!--BEGIN PROJECT_NUMBER-->&#160;<span id="projectnumber">$projectnumber</span><!--END PROJECT_NUMBER-->
+   <div id="projectname">$projectname<!--BEGIN PROJECT_NUMBER--><span id="projectnumber">&#160;$projectnumber</span><!--END PROJECT_NUMBER-->
    </div>
    <!--BEGIN PROJECT_BRIEF--><div id="projectbrief">$projectbrief</div><!--END PROJECT_BRIEF-->
   </td>
@@ -42,13 +46,13 @@
     </td>
    <!--END PROJECT_BRIEF-->
   <!--END !PROJECT_NAME-->
-  <!--BEGIN DISABLE_INDEX-->
-   <!--BEGIN SEARCHENGINE-->
-   <td>$searchbox</td>
-   <!--END SEARCHENGINE-->
-  <!--END DISABLE_INDEX-->
  </tr>
  </tbody>
+<!--BEGIN DISABLE_INDEX-->
+ <!--BEGIN SEARCHENGINE-->
+ <td colspan="2" style="padding-top: 4px;">$searchbox</td>
+ <!--END SEARCHENGINE-->
+<!--END DISABLE_INDEX-->
 </table>
 </div>
 <!--END TITLEAREA-->

templates/html/navtree.css

@@ -87,6 +87,7 @@
   position: absolute;
   left: 0px;
   width: $width;
+  overflow : hidden;
 }
 
 .ui-resizable .ui-resizable-handle {

templates/html/navtree.js

@@ -325,11 +325,14 @@ function selectAndHighlight(hash,n)
     $(n.itemDiv).addClass('selected');
     $(n.itemDiv).attr('id','selected');
   }
+  var topOffset=5;
+  if (page_layout==1) {
+    topOffset+=$('#top').outerHeight();
+  }
   if ($('#nav-tree-contents .item:first').hasClass('selected')) {
-    $('#nav-sync').css('top','30px');
-  } else {
-    $('#nav-sync').css('top','5px');
+    topOffset+=25;
   }
+  $('#nav-sync').css('top',topOffset+'px');
   showRoot();
 }
 

templates/html/resize.js

@@ -75,10 +75,20 @@ function initResizable()
   {
     var headerHeight = header.outerHeight();
     var footerHeight = footer.outerHeight();
-    var windowHeight = $(window).height() - headerHeight - footerHeight;
-    content.css({height:windowHeight + "px"});
-    navtree.css({height:windowHeight + "px"});
-    sidenav.css({height:windowHeight + "px"});
+    var windowHeight = $(window).height();
+    var contentHeight,navtreeHeight,sideNavHeight;
+    if (page_layout==0) { /* DISABLE_INDEX=NO */
+      contentHeight = windowHeight - headerHeight - footerHeight;
+      navtreeHeight = contentHeight;
+      sideNavHeight = contentHeight;
+    } else if (page_layout==1) { /* DISABLE_INDEX=YES */
+      contentHeight = windowHeight - footerHeight;
+      navtreeHeight = windowHeight - headerHeight;
+      sideNavHeight = windowHeight;
+    }
+    content.css({height:contentHeight + "px"});
+    navtree.css({height:navtreeHeight + "px"});
+    sidenav.css({height:sideNavHeight + "px"});
     var width=$(window).width();
     if (width!=collapsedWidth) {
       if (width<desktop_vp && collapsedWidth>=desktop_vp) {

templates/html/search.js

@@ -146,6 +146,7 @@ function SearchBox(name, resultsPath, inFrame, label, extension)
       // show search selection popup
       searchSelectWindow.style.display='block';
       left -= searchSelectWindow.offsetWidth;
+      if (left<10) left=10;
       searchSelectWindow.style.left =  left + 'px';
       searchSelectWindow.style.top  =  top  + 'px';
     }
@@ -383,6 +384,7 @@ function SearchBox(name, resultsPath, inFrame, label, extension)
          var top  = getYPos(domSearchBox) + 20;  // domSearchBox.offsetHeight + 1;
          domPopupSearchResultsWindow.style.display = 'block';
          left -= domPopupSearchResults.offsetWidth;
+         if (left<10) left=10;
          domPopupSearchResultsWindow.style.top     = top  + 'px';
          domPopupSearchResultsWindow.style.left    = left + 'px';
        }

templates/html/search_nomenu.css

@@ -8,12 +8,8 @@
     white-space : nowrap;
     float: none;
     margin-top: 0px;
-    right: 0px;
-    width: 170px;
+    width: 161px;
     height: 24px;
-    z-index: 102;
-    display: inline;
-    position: absolute;
 }
 
 #MSearchBox .left
@@ -64,8 +60,7 @@
 #MSearchBox .right {
     display:block;
     position:absolute;
-    right:10px;
-    top:0px;
+    left:141px;
     width:20px;
     height:19px;
     background:url('search_r.png') no-repeat;