Implemented menu based UI using Wijmo.

IPython/frontend/html/notebook/static/js/menubar.js

@@ -0,0 +1,111 b''
+//----------------------------------------------------------------------------
+//  Copyright (C) 2008-2011  The IPython Development Team
+//
+//  Distributed under the terms of the BSD License.  The full license is in
+//  the file COPYING, distributed as part of this software.
+//----------------------------------------------------------------------------
+
+//============================================================================
+// MenuBar
+//============================================================================
+
+var IPython = (function (IPython) {
+
+    var MenuBar = function (selector) {
+        this.selector = selector;
+        if (this.selector !== undefined) {
+            this.element = $(selector);
+            this.style();
+            this.bind_events();
+        }
+    };
+
+
+    MenuBar.prototype.style = function () {
+        $('ul#menus').wijmenu();
+        $('ul#menus').wijmenu("option", "showDelay", 200);
+        $('ul#menus').wijmenu("option", "hideDelay", 200);
+        $(".selector").wijmenu("option", "animation", {animated:"fade", duration: 200, easing: null})
+    };
+
+
+    MenuBar.prototype.bind_events = function () {
+        //  File
+        this.element.find('#new_notebook').click(function () {
+            window.open($('body').data('baseProjectUrl')+'new');
+        });
+        this.element.find('#open_notebook').click(function () {
+            window.open($('body').data('baseProjectUrl'));
+        });
+        this.element.find('#save_notebook').click(function () {
+            IPython.save_widget.save_notebook();
+        });
+        this.element.find('#download_ipynb').click(function () {
+            var notebook_id = IPython.save_widget.get_notebook_id();
+            var url = $('body').data('baseProjectUrl') + 'notebooks/' +
+                      notebook_id + '?format=json';
+            window.open(url,'_newtab');
+        });
+        this.element.find('#download_py').click(function () {
+            var notebook_id = IPython.save_widget.get_notebook_id();
+            var url = $('body').data('baseProjectUrl') + 'notebooks/' +
+                      notebook_id + '?format=py';
+            window.open(url,'_newtab');
+        });
+        this.element.find('button#print_notebook').click(function () {
+            IPython.print_widget.print_notebook();
+        });
+        // Edit
+        this.element.find('#delete_cell').click(function () {
+            IPython.notebook.delete_cell();
+        });
+        this.element.find('#move_cell_up').click(function () {
+            IPython.notebook.move_cell_up();
+        });
+        this.element.find('#move_cell_down').click(function () {
+            IPython.notebook.move_cell_down();
+        });
+        // Insert
+        this.element.find('#insert_cell_above').click(function () {
+            IPython.notebook.insert_code_cell_above();
+        });
+        this.element.find('#insert_cell_below').click(function () {
+            IPython.notebook.insert_code_cell_below();
+        });
+        // Cell
+        this.element.find('#run_cell').click(function () {
+            IPython.notebook.execute_selected_cell();
+        });
+        this.element.find('#run_cell_in_place').click(function () {
+            IPython.notebook.execute_selected_cell({terminal:true});
+        });
+        this.element.find('#run_all_cells').click(function () {
+            IPython.notebook.execute_all_cells();
+        });
+        this.element.find('#to_code').click(function () {
+            IPython.notebook.to_code();
+        });
+        this.element.find('#to_markdown').click(function () {
+            IPython.notebook.to_markdown();
+        });
+        this.element.find('#toggle_output').click(function () {
+            IPython.notebook.toggle_output();
+        });
+        this.element.find('#clear_all_output').click(function () {
+            IPython.notebook.clear_all_output();
+        });
+        // Kernel
+        this.element.find('#int_kernel').click(function () {
+            IPython.notebook.kernel.interrupt();
+        });
+        this.element.find('#restart_kernel').click(function () {
+            IPython.notebook.restart_kernel();
+        });
+    };
+
+
+    IPython.MenuBar = MenuBar;
+
+    return IPython;
+
+}(IPython));

IPython/frontend/html/notebook/static/css/notebook.css

@@ -19,7 +19,7 b' body {'
 
 span#save_widget {
     padding: 2px 0px;
-    margin: 0px;
+    margin: 0px 0px 0px 300px;
     display:inline-block;
 }
 
@@ -56,41 +56,8 b' span#kernel_status {'
     color: black;
 }
 
-div#left_panel {
-    overflow-y: auto;
-    top: 0px;
-    left: 0px;
-    margin: 0px;
+.wijmo-wijmenu {
     padding: 0px;
-    position: absolute;
-}
-
-div.section_header {
-    padding: 5px;
-}
-
-div.section_header h3 {
-    display: inline;
-}
-
-div.section_content {
-    padding: 5px;
-}
-
-span.section_row_buttons button {
-    width: 70px;
-}
-
-span.section_row_buttons a {
-    width: 70px;
-}
-
-.section_row {
-    margin: 5px 0px;
-}
-
-.section_row_buttons {
-    float: right;
 }
 
 #kernel_persist {
@@ -110,78 +77,7 b' span.section_row_buttons a {'
     font-size: 85%;
 }
 
-#autoindent_span {
-    float: right;
-}
-
-#timebeforetooltip{
-    margin-top:-3px;
-    text-align:right;
-}
-
-#timebeforetooltip_span {
-    float: right;
-    padding: 0px 5px;
-    font-size: 85%;
-}
-
-#timebeforetooltip_label {
-    float: right;
-    text-align:right;
-    font-size: 85%;
-}
-
-#tooltipontab_span {
-    float: right;
-}
-
-#smartcompleter_span {
-    float: right;
-}
-
-.checkbox_label {
-    font-size: 85%;
-    float: right;
-    padding: 0.3em;
-}
-
-.section_row_header {
-    float: left;
-    font-size: 85%;
-    padding: 0.4em 0em;
-    font-weight: bold;
-}
-
-span.button_label {
-    padding: 0.2em 1em;
-    font-size: 77%;
-    float: right;
-}
-
-/* This is needed because FF was adding a 2px margin top and bottom. */
-.section_row .ui-button {
-    margin-top: 0px;
-    margin-bottom: 0px;
-}
-
-#download_format {
-    float: right;
-    font-size: 85%;
-    width: 62px;
-    margin: 1px 5px;
-}
-
-div#left_panel_splitter {
-    width: 8px;
-    top: 0px;
-    left: 202px;
-    margin: 0px;
-    padding: 0px;
-    position: absolute;
-}
-
 div#notebook_panel {
-/*    The L margin will be set in the Javascript code*/
     margin: 0px 0px 0px 0px;
     padding: 0px;
 }
@@ -378,23 +274,23 b' div.text_cell_render {'
 
 /*"close" "expand" and "Open in pager button" of
 /* the tooltip*/
-.tooltip a{
+.tooltip a {
     float:right;
 }
 
 /*properties of tooltip after "expand"*/
-.bigtooltip{
+.bigtooltip {
     height:30%;
 }
 
 /*properties of tooltip before "expand"*/
-.smalltooltip{
+.smalltooltip {
     text-overflow: ellipsis;
     overflow: hidden;
     height:15%;
 }
 
-.tooltip{
+.tooltip {
     /*transition when "expand"ing tooltip */
     -webkit-transition-property: height;
     -webkit-transition-duration: 1s;
@@ -419,11 +315,11 b' div.text_cell_render {'
 }
 
 /*fixed part of the completion*/
-.completions p b{
+.completions p b {
     font-weight:bold;
 }
 
-.completions p{
+.completions p {
     background: #DDF;
     /*outline: none;
     padding: 0px;*/
@@ -440,7 +336,7 b' pre.dialog {'
     padding-left: 2em;
 }
 
-p.dialog{
+p.dialog {
     padding : 0.2em;
 }
 

IPython/frontend/html/notebook/static/js/layout.js

@@ -26,24 +26,11 b' var IPython = (function (IPython) {'
         var w = win.width();
         var h = win.height();
         var header_height = $('div#header').outerHeight(true);
-        var app_height = h - header_height - 2;  // content height
+        var menubar_height = $('div#menubar').outerHeight(true);
+        var app_height = h-header_height-menubar_height-2;  // content height
 
         $('div#main_app').height(app_height + 2);  // content+padding+border height
 
-        $('div#left_panel').height(app_height);
-
-        $('div#left_panel_splitter').height(app_height);
-
-        $('div#notebook_panel').height(app_height);
-        var left_panel_width = $('div#left_panel').outerWidth();
-        var left_panel_splitter_width = $('div#left_panel_splitter').outerWidth();
-        if (IPython.left_panel.expanded) {
-            $('div#notebook_panel').css({marginLeft : left_panel_width+left_panel_splitter_width});
-        } else {
-        $('div#notebook_panel').css({marginLeft : left_panel_splitter_width});
-        }
-
-
         var pager_height = IPython.pager.percentage_height*app_height;
         var pager_splitter_height = $('div#pager_splitter').outerHeight(true);
         $('div#pager').height(pager_height);

IPython/frontend/html/notebook/static/js/notebook.js

@@ -30,6 +30,7 b' var IPython = (function (IPython) {'
         this.set_tooltipontab(true);
         this.set_smartcompleter(true);
         this.set_timebeforetooltip(1200);
+        this.set_autoindent(true);
     };
 
 
@@ -197,7 +198,8 b' var IPython = (function (IPython) {'
         });
 
         $(window).bind('beforeunload', function () {
-            var kill_kernel = $('#kill_kernel').prop('checked');
+            // TODO: Make killing the kernel configurable.
+            var kill_kernel = false;
             if (kill_kernel) {
                 that.kernel.kill();
             }

IPython/frontend/html/notebook/static/js/notebookmain.js

@@ -79,17 +79,15 b' $(document).ready(function () {'
     $('div#main_app').addClass('border-box-sizing ui-widget ui-widget-content');
     $('div#notebook_panel').addClass('border-box-sizing ui-widget');
 
-    $('ul#menus').wijmenu();
-
     IPython.layout_manager = new IPython.LayoutManager();
     IPython.pager = new IPython.Pager('div#pager', 'div#pager_splitter');
-    IPython.left_panel = new IPython.LeftPanel('div#left_panel', 'div#left_panel_splitter');
     IPython.save_widget = new IPython.SaveWidget('span#save_widget');
     IPython.quick_help = new IPython.QuickHelp('span#quick_help_area');
     IPython.login_widget = new IPython.LoginWidget('span#login_widget');
-    IPython.print_widget = new IPython.PrintWidget('span#print_widget');
+    IPython.print_widget = new IPython.PrintWidget();
     IPython.notebook = new IPython.Notebook('div#notebook');
     IPython.kernel_status_widget = new IPython.KernelStatusWidget('#kernel_status');
+    IPython.menubar = new IPython.MenuBar('#menubar')
     IPython.kernel_status_widget.status_idle();
 
     IPython.layout_manager.do_resize();

IPython/frontend/html/notebook/static/js/printwidget.js

@@ -1,38 +1,8 b''
 var IPython = (function (IPython) {
 
-    var PrintWidget = function (selector) {
-        this.selector = selector;
-        if (this.selector !== undefined) {
-            this.element = $(selector);
-            this.style();
-            this.bind_events();
-        }
+    var PrintWidget = function () {
     };
 
-    PrintWidget.prototype.style = function () {
-        this.element.find('button#print_notebook').button();
-        this.element.find('button#print_notebook').attr('title',
-            "Open a new window with printer-friendly HTML of the Notebook." +
-            " Note that this is incomplete, and may not produce perfect" +
-            " printed output." +
-            " Make sure to save before printing, to ensure the output is up to date."
-            );
-    };
-
-    PrintWidget.prototype.bind_events = function () {
-        var that = this;
-        this.element.find('button#print_notebook').click(function () {
-            that.print_notebook();
-        });
-    };
-
-    PrintWidget.prototype.enable = function () {
-        this.element.find('button#print_notebook').button('enable');
-    };
-
-    PrintWidget.prototype.disable = function () {
-        this.element.find('button#print_notebook').button('disable');
-    };
 
     PrintWidget.prototype.print_notebook = function () {
         var w = window.open('', '_blank', 'scrollbars=1,menubar=1');
@@ -53,8 +23,9 b' var IPython = (function (IPython) {'
         return false;
     };
 
+
     IPython.PrintWidget = PrintWidget;
-    
+
     return IPython;
 
 }(IPython));

IPython/frontend/html/notebook/static/js/savewidget.js

@@ -30,10 +30,6 b' var IPython = (function (IPython) {'
         this.element.find('input#notebook_name').attr('tabindex','1');
         this.element.find('button#save_notebook').button();
         this.element.find('button#save_notebook').attr('title', 'Save the Notebook');
-        var left_panel_width = $('div#left_panel').outerWidth();
-        var left_panel_splitter_width = $('div#left_panel_splitter').outerWidth();
-        $('span#save_widget').css({marginLeft:left_panel_width+left_panel_splitter_width});
-
     };
 
 
@@ -124,28 +120,24 b' var IPython = (function (IPython) {'
     SaveWidget.prototype.status_save = function () {
         this.element.find('button#save_notebook').button('option', 'label', '<u>S</u>ave');
         this.element.find('button#save_notebook').button('enable');
-        IPython.print_widget.enable();
     };
 
 
     SaveWidget.prototype.status_saving = function () {
         this.element.find('button#save_notebook').button('option', 'label', 'Saving');
         this.element.find('button#save_notebook').button('disable');
-        IPython.print_widget.disable();
     };
 
 
     SaveWidget.prototype.status_loading = function () {
         this.element.find('button#save_notebook').button('option', 'label', 'Loading');
         this.element.find('button#save_notebook').button('disable');
-        IPython.print_widget.disable();
     };    
 
 
     SaveWidget.prototype.status_rename = function () {
         this.element.find('button#save_notebook').button('option', 'label', 'Rename');
         this.element.find('button#save_notebook').button('enable');
-        IPython.print_widget.enable();
     };
 
 

IPython/frontend/html/notebook/templates/notebook.html

@@ -65,71 +65,71 b''
     <span id="kernel_status">Idle</span>
 </div>
 
-<div id="menu_bar">
+<div id="menubar">
     <ul id="menus">
         <li><a href="#">File</a>
             <ul>
-                <li><a href="#">New</a></li>
-                <li><a href="#">Open...</a></li>
+                <li id="new_notebook"><a href="#">New</a></li>
+                <li id="open_notebook"><a href="#">Open...</a></li>
                 <li></li>
-                <li><a href="#">Save</a></li>
+                <li id="save_notebook"><a href="#">Save</a></li>
                 <li></li>
                 <li><a href="#">Download as</a>
                     <ul>
-                        <li><a href="#">IPython (.ipynb)</a></li>
-                        <li><a href="#">Python (.py)</a></li>
+                        <li id="download_ipynb"><a href="#">IPython (.ipynb)</a></li>
+                        <li id="download_py"><a href="#">Python (.py)</a></li>
                     </ul>
                 </li>
                 <li></li>
-                <li><a href="#">Print</a></li>
+                <li id="print_notebook"><a href="#">Print</a></li>
                 
             </ul>
         </li>
         <li><a href="#">Edit</a>
             <ul>
-                <li><a href="#">Delete</a></li>
+                <li id="delete_cell"><a href="#">Delete</a></li>
                 <li></li>
-                <li><a href="#">Move Up</a></li>
-                <li><a href="#">Move Down</a></li>
+                <li id="move_cell_up"><a href="#">Move Cell Up</a></li>
+                <li id="move_cell_down"><a href="#">Move Cell Down</a></li>
             </ul>
         </li>
         <li><a href="#">Insert</a>
             <ul>
-                <li><a href="#">Insert Above</a>
-                <li><a href="#">Insert Below</a>
+                <li id="insert_cell_above"><a href="#">Insert Cell Above</a>
+                <li id="insert_cell_below"><a href="#">Insert Cell Below</a>
                 </li>
             </ul>
         </li>
         <li><a href="#">Cell</a>
             <ul>
-                <li><a href="#">Run</a></li>
-                <li><a href="#">Run in Place</a></li>
-                <li><a href="#">Run All</a></li>
+                <li id="run_cell"><a href="#">Run</a></li>
+                <li id="run_cell_in_place"><a href="#">Run in Place</a></li>
+                <li id="run_all_cells"><a href="#">Run All</a></li>
                 <li></li>
-                <li><a href="#">Code Cell</a></li>
-                <li><a href="#">Markdown Cell</a></li>
+                <li id="to_code"><a href="#">Code Cell</a></li>
+                <li id="to_markdown"><a href="#">Markdown Cell</a></li>
                 <li></li>
-                <li><a href="#">Toggle Output</a></li>
-                <li><a href="#">Clear All Output</a></li>
+                <li id="toggle_output"><a href="#">Toggle Output</a></li>
+                <li id="clear_all_output"><a href="#">Clear All Output</a></li>
             </ul>
         </li>
         <li><a href="#">Kernel</a>
             <ul>
-                <li><a href="#">Interrupt</a></li>
-                <li><a href="#">Restart</a></li>
+                <li id="int_kernel"><a href="#">Interrupt</a></li>
+                <li id="restart_kernel"><a href="#">Restart</a></li>
             </ul>
         </li>
         <li><a href="#">Help</a>
             <ul>
-                <li><a href="#">IPython Help</a></li>
-                <li><a href="#">Notebook Help</a></li>
+                <li><a href="http://ipython.org/documentation.html" target="_blank">IPython Help</a></li>
+                <li><a href="http://ipython.org/ipython-doc/stable/interactive/htmlnotebook.html" target="_blank">Notebook Help</a></li>
                 <li><a href="#">Notebook QuickRef</a></li>
                 <li><h2>External Docs</h2></li>
-                <li><a href="#">Python</a></li>
-                <li><a href="#">NumPy</a></li>
-                <li><a href="#">SciPy</a></li>
-                <li><a href="#">SymPy</a></li>
-                <li><a href="#">Matplotlib</a></li>
+                <li><a href="http://docs.python.org" target="_blank">Python</a></li>
+                <li><a href="http://docs.scipy.org/doc/numpy/reference/" target="_blank">NumPy</a></li>
+                <li><a href="http://docs.scipy.org/doc/scipy/reference/" target="_blank">SciPy</a></li>
+                <li><a href="http://docs.sympy.org/dev/index.html" target="_blank">SymPy</a></li>
+                <li><a href="http://matplotlib.sourceforge.net/" target="_blank">Matplotlib</a></li>
             </ul>
         </li>
     </ul>
@@ -138,190 +138,6 b''
 
 <div id="main_app">
 
-    <div id="left_panel">
-
-        <div id="notebook_section">
-            <div class="section_header">
-                <h3>Notebook</h3>
-            </div>
-            <div class="section_content">
-                <div class="section_row">
-                    <span id="new_open" class="section_row_buttons">
-                        <button id="new_notebook">New</button>
-                        <button id="open_notebook">Open</button>
-                    </span>
-                    <span class="section_row_header">Actions</span>
-                </div>
-                <div class="section_row">
-                    <span>
-                        <select id="download_format">
-                            <option value="json">ipynb</option>
-                            <option value="py">py</option>
-                        </select>
-                    </span>
-                    <span class="section_row_buttons">
-                        <button id="download_notebook">Download</button>
-                    </span>
-                </div>
-                <div class="section_row">
-                    <span class="section_row_buttons">
-                        <span id="print_widget">
-                            <button id="print_notebook">Print</button>
-                        </span>
-                    </span>
-                </div>
-            </div>
-        </div>
-
-        <div id="cell_section">
-            <div class="section_header">
-                <h3>Cell</h3>
-            </div>
-            <div class="section_content">
-                <div class="section_row">
-                    <span class="section_row_buttons">
-                        <button id="delete_cell"><u>D</u>elete</button>
-                    </span>
-                    <span class="section_row_header">Actions</span>
-                </div>
-                <div class="section_row">
-                    <span id="cell_type" class="section_row_buttons">
-                        <button id="to_code"><u>C</u>ode</button>
-<!--                        <button id="to_html">HTML</button>-->
-                        <button id="to_markdown"><u>M</u>arkdown</button>
-                    </span>
-                     <span class="button_label">Format</span> 
-                </div>
-                <div class="section_row">
-                    <span id="cell_output" class="section_row_buttons">
-                        <button id="toggle_output"><u>T</u>oggle</button>
-                        <button id="clear_all_output">ClearAll</button>
-                    </span>
-                    <span class="button_label">Output</span>
-                </div>
-                <div class="section_row">
-                    <span id="insert" class="section_row_buttons">
-                        <button id="insert_cell_above"><u>A</u>bove</button>
-                        <button id="insert_cell_below"><u>B</u>elow</button>
-                    </span>
-                    <span class="button_label">Insert</span>
-                </div>
-                <div class="section_row">
-                    <span id="move" class="section_row_buttons">
-                        <button id="move_cell_up">Up</button>
-                        <button id="move_cell_down">Down</button>
-                    </span>
-                    <span class="button_label">Move</span>
-                </div>
-                <div class="section_row">
-                    <span id="run_cells" class="section_row_buttons">
-                        <button id="run_selected_cell">Selected</button>
-                        <button id="run_all_cells">All</button>
-                    </span>
-                    <span class="button_label">Run</span>
-                </div>
-                <div class="section_row">
-                    <span id="autoindent_span">
-                        <input type="checkbox" id="autoindent" checked="true"></input>
-                    </span>
-                    <span class="checkbox_label" id="autoindent_label">Autoindent:</span>
-                </div>
-            </div>
-        </div>
-
-        <div id="kernel_section">
-            <div class="section_header">
-                <h3>Kernel</h3>
-            </div>
-            <div class="section_content">
-                <div class="section_row">
-                    <span id="int_restart" class="section_row_buttons">
-                        <button id="int_kernel"><u>I</u>nterrupt</button>
-                        <button id="restart_kernel">Restart</button>
-                    </span>
-                    <span class="section_row_header">Actions</span>
-                </div>
-                <div class="section_row">
-                    <span id="kernel_persist">
-                        {% if kill_kernel %}
-                            <input type="checkbox" id="kill_kernel" checked="true"></input>
-                        {% else %}
-                            <input type="checkbox" id="kill_kernel"></input>
-                        {% end %}
-                    </span>
-                    <span class="checkbox_label" id="kill_kernel_label">Kill kernel upon exit:</span>
-                </div>
-            </div>
-        </div>
-
-        <div id="help_section">
-            <div class="section_header">
-                <h3>Help</h3>
-            </div>
-            <div class="section_content">
-                <div class="section_row">
-                    <span id="help_buttons0" class="section_row_buttons">
-                        <a id="python_help" href="http://docs.python.org" target="_blank">Python</a>
-                        <a id="ipython_help" href="http://ipython.org/documentation.html" target="_blank">IPython</a>
-                    </span>
-                    <span class="section_row_header">Links</span>
-                </div>
-                <div class="section_row">
-                    <span id="help_buttons1" class="section_row_buttons">
-                        <a id="numpy_help" href="http://docs.scipy.org/doc/numpy/reference/" target="_blank">NumPy</a>
-                        <a id="scipy_help" href="http://docs.scipy.org/doc/scipy/reference/" target="_blank">SciPy</a>
-                    </span>
-                </div>
-                <div class="section_row">
-                    <span id="help_buttons2" class="section_row_buttons">
-                        <a id="matplotlib_help" href="http://matplotlib.sourceforge.net/" target="_blank">MPL</a>
-                        <a id="sympy_help" href="http://docs.sympy.org/dev/index.html" target="_blank">SymPy</a>
-                    </span>
-                </div>
-                <div class="section_row">
-                    <span class="help_string">run selected cell</span>
-                    <span class="help_string_label">Shift-Enter :</span>
-                </div>
-                <div class="section_row">
-                    <span class="help_string">run selected cell in-place</span>
-                    <span class="help_string_label">Ctrl-Enter  :</span>
-                </div>
-                <div class="section_row">
-                    <span class="help_string">show keyboard shortcuts</span>
-                    <span class="help_string_label">Ctrl-m h  :</span>
-                </div>
-            </div>
-        </div>
-
-        <div id="config_section">
-            <div class="section_header">
-                <h3>Configuration</h3>
-            </div>
-            <div class="section_content">
-                <div class="section_row">
-                    <span id="tooltipontab_span">
-                        <input type="checkbox" id="tooltipontab" checked="true"></input>
-                    </span>
-                    <span class="checkbox_label" id="tooltipontab_label">Tooltip on tab:</span>
-                </div>
-                <div class="section_row">
-                    <span id="smartcompleter_span">
-                        <input type="checkbox" id="smartcompleter" checked="true"></input>
-                    </span>
-                    <span class="checkbox_label" id="smartcompleter_label">Smart completer:</span>
-                </div>
-                <div class="section_row">
-                    <span id="timebeforetooltip_span">
-                        <input type="text" id="timebeforetooltip" value="1200" size='6'></input>
-                        <span class="numeric_input_label" id="timebeforetooltip_unit">milliseconds</span>
-                    </span>
-                    <span class="numeric_input_label" id="timebeforetooltip_label">Time before tooltip : </span>
-                </div>
-            </div>
-        </div>
-
-    </div>
-    <div id="left_panel_splitter"></div>
     <div id="notebook_panel">
         <div id="notebook"></div>
         <div id="pager_splitter"></div>
@@ -361,9 +177,8 b''
 <script src="/static/js/quickhelp.js" type="text/javascript" charset="utf-8"></script>
 <script src="/static/js/loginwidget.js" type="text/javascript" charset="utf-8"></script>
 <script src="/static/js/pager.js" type="text/javascript" charset="utf-8"></script>
-<script src="/static/js/panelsection.js" type="text/javascript" charset="utf-8"></script>
 <script src="/static/js/printwidget.js" type="text/javascript" charset="utf-8"></script>
-<script src="/static/js/leftpanel.js" type="text/javascript" charset="utf-8"></script>
+<script src="/static/js/menubar.js" type="text/javascript" charset="utf-8"></script>
 <script src="/static/js/notebook.js" type="text/javascript" charset="utf-8"></script>
 <script src="/static/js/notebookmain.js" type="text/javascript" charset="utf-8"></script>