From 9a2a0fa78e03d37db9298def026eceff1d04c350 2014-03-01 04:01:48
From: Paul Ivanov <pi@berkeley.edu>
Date: 2014-03-01 04:01:48
Subject: [PATCH] initial bootstrap tour

One way to get it to play currently is with a cell like this:

    %%javascript
    $.getScript('/static/notebook/js/tour.js')

provided that you have Bootstrap Tour installed in the components

---

diff --git a/IPython/html/static/notebook/js/tour.js b/IPython/html/static/notebook/js/tour.js
new file mode 100644
index 0000000..3dace16
--- /dev/null
+++ b/IPython/html/static/notebook/js/tour.js
@@ -0,0 +1,105 @@
+//----------------------------------------------------------------------------
+//  Copyright (C) 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.
+//----------------------------------------------------------------------------
+
+//============================================================================
+// Tour of IPython Notebok UI (with Bootstrap Tour)
+//============================================================================
+
+var step_duration = 5000;
+var tour_steps = [
+  { 
+    element: $("#ipython_notebook").parent(),
+    title: "Let's take it from the top",
+    placement: 'bottom',
+    content: "This is the Header.",
+    backdrop: true,
+  }, {
+    element: "#ipython_notebook",
+    title: "Header",
+    placement: 'bottom',
+    content: "Clicking here takes you back to the Dashboard."
+  }, {
+    element: "#notebook_name",
+    title: "Filename",
+    placement: 'bottom',
+    content: "You can click here to change the filename for this notebook."
+  }, 
+          {
+    element: "#checkpoint_status",
+    title: "Checkpoint status",
+    placement: 'bottom',
+    content: "Information about the last time this notebook was saved."
+  }, {
+    element: "#menus",
+    placement: 'bottom',
+    title: "Notebook Menubar",
+    content: "The actions that you can perform with this notebook, its cells, and its kernel"
+  }, {
+    element: "#menus",
+    placement: 'bottom',
+    title: "Notebook Menubar",
+    content: "The actions that you can perform with this notebook, its cells, and its kernel"
+  }, {
+    element: "#notification_kernel",
+    placement: 'bottom',
+    onShow: function(tour) {  IPython.notification_area.widget_dict.kernel.set_message("sample notification"); },
+    onHide: function(tour) {  IPython.notification_area.widget_dict.kernel.set_message("sample notification", 100); },
+    title: "Notification area",
+    content: "Message in response to user action (Kernel busy, Interrupt, etc)"
+  }, {
+    element: "#modal_indicator",
+    title: "Mode indicator",
+    placement: 'bottom',
+    content: "IPython has two modes: Edit Mode and Command Mode. This indicator tells you which mode you are in."
+  }, {
+    element: "#modal_indicator",
+    title: "Mode indicator",
+    placement: 'bottom',
+    content: "Right now you are in Command mode, and many keyboard shortcuts are available."
+  }, {
+    element: "#modal_indicator",
+    title: "Edit Mode",
+    placement: 'bottom',
+    onShow: function(tour) { IPython.notebook.edit_mode(); },
+    content: "And now we've switched to Edit Mode, regular typing will go into the currently active cell."
+  }, {
+    element: $('.selected'),
+    title: "Edit Mode",
+    placement: 'bottom',
+    onHide: function(tour) { IPython.notebook.command_mode(); },
+    content: "Notice that the border around the currently active cell changed color."
+  }, {
+    element: "#kernel_indicator",
+    title: "Kernel indicator",
+    placement: 'bottom',
+    content: "This is the Kernel indicator. It looks like this when the Kernel is idle.",
+  }, {
+    element: "#kernel_indicator",
+    title: "Kernel Indicator",
+    placement: 'bottom',
+    onShow: function(tour) { $([IPython.events]).trigger('status_busy.Kernel'); },
+    onHide: function(tour) { $([IPython.events]).trigger('status_idle.Kernel');},
+    content: "The Kernel indicator looks like this when the Kernel is busy.",
+  }
+];
+var tour = new Tour({
+    //orphan: true,
+    storage: false, // start tour from beginning every time
+    //element: $("#ipython_notebook"),
+    debug: true,
+    reflex: true, // click on element to continue tour
+    //backdrop: true, // show dark behind popover
+    animation: false,
+    duration: step_duration,
+    onStart: function() { console.log('tour started'); },
+    steps: tour_steps,
+});
+// Initialize the tour
+tour.init();
+
+// Start the tour
+tour.start();