From: Mike Bayer <mike_mp@zzzcomputing.com>
Date: Fri, 2 May 2014 00:39:46 +0000 (-0400)
Subject: - experiment with multi-zoned navigation
X-Git-Tag: rel_1_0_0b1~415^2^2~13
X-Git-Url: http://git.ipfire.org/gitweb.cgi?a=commitdiff_plain;h=6c7fe6d5420e7e3a4d113ec4f2428c20b215052a;p=thirdparty%2Fsqlalchemy%2Fsqlalchemy.git

- experiment with multi-zoned navigation
---

diff --git a/doc/build/conf.py b/doc/build/conf.py
index 55db668018..ff7f70661a 100644
--- a/doc/build/conf.py
+++ b/doc/build/conf.py
@@ -96,7 +96,7 @@ release = "0.9.4"
 
 release_date = "March 28, 2014"
 
-site_base = "http://www.sqlalchemy.org"
+site_base = os.environ.get("RTD_SITE_BASE", "http://www.sqlalchemy.org")
 
 # arbitrary number recognized by builders.py, incrementing this
 # will force a rebuild
diff --git a/doc/build/static/docs.css b/doc/build/static/docs.css
index b7c02248b5..54ae768d09 100644
--- a/doc/build/static/docs.css
+++ b/doc/build/static/docs.css
@@ -90,10 +90,11 @@ a.headerlink:hover {
 }
 
 #docs-top-navigation {
-  margin:10px 0px 10px 0px;
+  margin:10px 0px;
   line-height:1.2em;
 }
 
+
 .docs-navigation-links {
   font-family:Verdana,sans-serif;
 }
@@ -149,8 +150,6 @@ a.headerlink:hover {
 /* content container, sidebar */
 
 #docs-body-container {
-  background-color:#EFEFEF;
-  border: solid 1px #CCC;
 }
 
 #docs-body,
@@ -174,12 +173,37 @@ a.headerlink:hover {
 }
 
 #docs-sidebar {
-  float:left;
-  width:212px;
-  padding: 10px 0 0 15px;
+
+  width:210px;
+  padding: 0px 0 0 15px;
   font-size:.85em;
+
+  border: solid 1px #CCC;
+
+  float:left;
+
+  z-index: 3;
+  background-color: #EFEFEF;
+
+}
+
+#docs-top-navigation-container.automated {
+    position:fixed;
+    top:0;
+    z-index:100;
+    width:100%;
+    background-color:#FFF;
+}
+
+#docs-sidebar.automated {
+    float: none;
+    position: fixed;
+    top: 96px;
+    bottom: 0;
+    overflow-y: auto;
 }
 
+
 #docs-sidebar h3, #docs-sidebar h4 {
     background-color: #DDDDDD;
     color: #222222;
@@ -189,7 +213,7 @@ a.headerlink:hover {
     margin: 10px 0 0 -15px;
     padding: 5px 10px 5px 10px;
     text-shadow: 1px 1px 0 white;
-    width:210px;
+    /*width:210px;*/
 }
 
 #docs-sidebar h3 a, #docs-sidebar h4 a {
@@ -212,11 +236,13 @@ a.headerlink:hover {
 #docs-body {
   background-color:#FFFFFF;
   padding:1px 10px 10px 10px;
+
+  border: solid 1px #CCC;
+
 }
 
 #docs-body.withsidebar {
   margin: 0 0 0 230px;
-  border-left:3px solid #DFDFDF;
 }
 
 #docs-body h1,
diff --git a/doc/build/static/init.js b/doc/build/static/init.js
index 1876d470e6..c7de23a9a8 100644
--- a/doc/build/static/init.js
+++ b/doc/build/static/init.js
@@ -7,14 +7,43 @@ function initSQLPopups() {
     });
 }
 
-/*function initFloatyThings() {
-	$("dl.function, dl.class, dl.method, dl.attr, dl.data").each(function(idx, elem) {
-		$(elem).prepend("<div class='floatything'>" + $(elem).contents("dt").attr('id')+ "</div>");
-	});
-}*/
+var automatedBreakpoint = -1;
+
+function initFloatyThings() {
+
+    automatedBreakpoint = $("#docs-top-navigation-container").offset().top;
+
+    function setNavSize() {
+        $("#docs-top-navigation-container").css("width", $("#docs-container").width());
+    }
+
+    $(window).scroll(function() {
+        var scrolltop = $(window).scrollTop();
+        if (scrolltop >= automatedBreakpoint - 10) {
+            setNavSize();
+            $("#docs-top-navigation-container").addClass("automated");
+            $("#docs-sidebar").addClass("automated");
+            $("#docs-sidebar").css("top", $("#docs-top-navigation-container").height());
+            $("#docs-top-navigation").addClass("automated");
+            $("#docs-body").css("padding-top", "100px");
+        }
+        else {
+            $("#docs-top-navigation-container.automated").css("width", "");
+            $("#docs-sidebar.automated").scrollTop(0);
+            $("#docs-top-navigation-container").removeClass("automated");
+            $("#docs-sidebar").removeClass("automated");
+            $("#docs-top-navigation").removeClass("automated");
+            $("#docs-body").css("padding-top", "");
+        }
+
+    })
+
+    $(window).resize(setNavSize());
+}
+
 
 $(document).ready(function() {
     initSQLPopups();
-    /*initFloatyThings();*/
+    initFloatyThings();
 });
 
diff --git a/doc/build/templates/layout.mako b/doc/build/templates/layout.mako
index a879fa4819..192780effa 100644
--- a/doc/build/templates/layout.mako
+++ b/doc/build/templates/layout.mako
@@ -112,6 +112,7 @@ withsidebar = bool(toc) and current_page_name != 'index'
 
 </div>
 
+<div id="docs-top-navigation-container">
 <div id="docs-top-navigation">
     <div id="docs-top-page-control" class="docs-navigation-links">
         <ul>
@@ -155,11 +156,22 @@ withsidebar = bool(toc) and current_page_name != 'index'
     </div>
 
 </div>
+</div>
 
 <div id="docs-body-container">
 
 % if withsidebar:
     <div id="docs-sidebar">
+
+    <h4>Quick Search</h4>
+    <p>
+    <form class="search" action="${pathto('search')}" method="get">
+      <input type="text" name="q" size="18" /> <input type="submit" value="${_('Search')}" />
+      <input type="hidden" name="check_keywords" value="yes" />
+      <input type="hidden" name="area" value="default" />
+    </form>
+    </p>
+
     <h3><a href="${pathto('index')}">Table of Contents</a></h3>
     ${toc}
 
@@ -182,14 +194,6 @@ withsidebar = bool(toc) and current_page_name != 'index'
     </ul>
     % endif
 
-    <h4>Quick Search</h4>
-    <p>
-    <form class="search" action="${pathto('search')}" method="get">
-      <input type="text" name="q" size="18" /> <input type="submit" value="${_('Search')}" />
-      <input type="hidden" name="check_keywords" value="yes" />
-      <input type="hidden" name="area" value="default" />
-    </form>
-    </p>
 
     </div>
 % endif