1+ /*
2+ * sidebar.js
3+ * ~~~~~~~~~~
4+ *
5+ * This script makes the Sphinx sidebar collapsible.
6+ *
7+ * .sphinxsidebar contains .sphinxsidebarwrapper. This script adds
8+ * in .sphixsidebar, after .sphinxsidebarwrapper, the #sidebarbutton
9+ * used to collapse and expand the sidebar.
10+ *
11+ * When the sidebar is collapsed the .sphinxsidebarwrapper is hidden
12+ * and the width of the sidebar and the margin-left of the document
13+ * are decreased. When the sidebar is expanded the opposite happens.
14+ * This script saves a per-browser/per-session cookie used to
15+ * remember the position of the sidebar among the pages.
16+ * Once the browser is closed the cookie is deleted and the position
17+ * reset to the default (expanded).
18+ *
19+ * :copyright: Copyright 2007-2010 by the Sphinx team, see AUTHORS.
20+ * :license: BSD, see LICENSE for details.
21+ *
22+ */
23+
24+ $ ( function ( ) {
25+ // global elements used by the functions.
26+ // the 'sidebarbutton' element is defined as global after its
27+ // creation, in the add_sidebar_button function
28+ var bodywrapper = $ ( '.bodywrapper' ) ;
29+ var sidebar = $ ( '.sphinxsidebar' ) ;
30+ var sidebarwrapper = $ ( '.sphinxsidebarwrapper' ) ;
31+
32+ // original margin-left of the bodywrapper and width of the sidebar
33+ // with the sidebar expanded
34+ var bw_margin_expanded = bodywrapper . css ( 'margin-left' ) ;
35+ var ssb_width_expanded = sidebar . width ( ) ;
36+
37+ // margin-left of the bodywrapper and width of the sidebar
38+ // with the sidebar collapsed
39+ var bw_margin_collapsed = '.8em' ;
40+ var ssb_width_collapsed = '.8em' ;
41+
42+ // colors used by the current theme
43+ var dark_color = $ ( '.related' ) . css ( 'background-color' ) ;
44+ var light_color = $ ( '.document' ) . css ( 'background-color' ) ;
45+
46+ function sidebar_is_collapsed ( ) {
47+ return sidebarwrapper . is ( ':not(:visible)' ) ;
48+ }
49+
50+ function toggle_sidebar ( ) {
51+ if ( sidebar_is_collapsed ( ) )
52+ expand_sidebar ( ) ;
53+ else
54+ collapse_sidebar ( ) ;
55+ }
56+
57+ function collapse_sidebar ( ) {
58+ sidebarwrapper . hide ( ) ;
59+ sidebar . css ( 'width' , ssb_width_collapsed ) ;
60+ bodywrapper . css ( 'margin-left' , bw_margin_collapsed ) ;
61+ sidebarbutton . css ( {
62+ 'margin-left' : '0' ,
63+ 'height' : bodywrapper . height ( )
64+ } ) ;
65+ sidebarbutton . find ( 'span' ) . text ( '»' ) ;
66+ sidebarbutton . attr ( 'title' , _ ( 'Expand sidebar' ) ) ;
67+ document . cookie = 'sidebar=collapsed' ;
68+ }
69+
70+ function expand_sidebar ( ) {
71+ bodywrapper . css ( 'margin-left' , bw_margin_expanded ) ;
72+ sidebar . css ( 'width' , ssb_width_expanded ) ;
73+ sidebarwrapper . show ( ) ;
74+ sidebarbutton . css ( {
75+ 'margin-left' : ssb_width_expanded - 12 ,
76+ 'height' : bodywrapper . height ( )
77+ } ) ;
78+ sidebarbutton . find ( 'span' ) . text ( '«' ) ;
79+ sidebarbutton . attr ( 'title' , _ ( 'Collapse sidebar' ) ) ;
80+ document . cookie = 'sidebar=expanded' ;
81+ }
82+
83+ function add_sidebar_button ( ) {
84+ sidebarwrapper . css ( {
85+ 'float' : 'left' ,
86+ 'margin-right' : '0' ,
87+ 'width' : ssb_width_expanded - 28
88+ } ) ;
89+ // create the button
90+ sidebar . append (
91+ '<div id="sidebarbutton"><span>«</span></div>'
92+ ) ;
93+ var sidebarbutton = $ ( '#sidebarbutton' ) ;
94+ // find the height of the viewport to center the '<<' in the page
95+ var viewport_height ;
96+ if ( window . innerHeight )
97+ viewport_height = window . innerHeight ;
98+ else
99+ viewport_height = $ ( window ) . height ( ) ;
100+ sidebarbutton . find ( 'span' ) . css ( {
101+ 'display' : 'block' ,
102+ 'margin-top' : ( viewport_height - sidebar . position ( ) . top - 20 ) / 2
103+ } ) ;
104+
105+ sidebarbutton . click ( toggle_sidebar ) ;
106+ sidebarbutton . attr ( 'title' , _ ( 'Collapse sidebar' ) ) ;
107+ sidebarbutton . css ( {
108+ 'color' : '#FFFFFF' ,
109+ 'border-left' : '1px solid ' + dark_color ,
110+ 'font-size' : '1.2em' ,
111+ 'cursor' : 'pointer' ,
112+ 'height' : bodywrapper . height ( ) ,
113+ 'padding-top' : '1px' ,
114+ 'margin-left' : ssb_width_expanded - 12
115+ } ) ;
116+
117+ sidebarbutton . hover (
118+ function ( ) {
119+ $ ( this ) . css ( 'background-color' , dark_color ) ;
120+ } ,
121+ function ( ) {
122+ $ ( this ) . css ( 'background-color' , light_color ) ;
123+ }
124+ ) ;
125+ }
126+
127+ function set_position_from_cookie ( ) {
128+ if ( ! document . cookie )
129+ return ;
130+ var items = document . cookie . split ( ';' ) ;
131+ for ( var k = 0 ; k < items . length ; k ++ ) {
132+ var key_val = items [ k ] . split ( '=' ) ;
133+ var key = key_val [ 0 ] ;
134+ if ( key == 'sidebar' ) {
135+ var value = key_val [ 1 ] ;
136+ if ( ( value == 'collapsed' ) && ( ! sidebar_is_collapsed ( ) ) )
137+ collapse_sidebar ( ) ;
138+ else if ( ( value == 'expanded' ) && ( sidebar_is_collapsed ( ) ) )
139+ expand_sidebar ( ) ;
140+ }
141+ }
142+ }
143+
144+ add_sidebar_button ( ) ;
145+ var sidebarbutton = $ ( '#sidebarbutton' ) ;
146+ set_position_from_cookie ( ) ;
147+ } ) ;
0 commit comments