Fixed bugs and added unit tests

bootstrap-tour.coffee

@@ -82,12 +82,14 @@
 
     # Verify if tour is enabled
     ended: ->
-      @getState("end")
+      !!@getState("end")
 
     # Restart tour
     restart: ->
       @setState("current_step", null)
       @setState("end", null)
+      @setCurrentStep(0)
+      @start()
 
     # Hide the specified step
     hideStep: (i) ->
@@ -126,7 +128,7 @@
       step.onShow(@) if step.onShow?
 
       # Show popover
-      @showPopover(step, i)
+      @_showPopover(step, i)
 
     # Setup current step variable
     setCurrentStep: (value) ->
@@ -152,7 +154,7 @@
       @showStep(step.next)
 
     # Show step popover
-    showPopover: (step, i) ->
+    _showPopover: (step, i) ->
       content = "#{step.content}<br /><p>"
       if step.end
         content += "<a href='#' class='end'>End</a>"

deps/bootstrap-alert.js

@@ -0,0 +1,90 @@
+/* ==========================================================
+ * bootstrap-alert.js v2.0.4
+ * http://twitter.github.com/bootstrap/javascript.html#alerts
+ * ==========================================================
+ * Copyright 2012 Twitter, Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ * ========================================================== */
+
+
+!function ($) {
+
+  "use strict"; // jshint ;_;
+
+
+ /* ALERT CLASS DEFINITION
+  * ====================== */
+
+  var dismiss = '[data-dismiss="alert"]'
+    , Alert = function (el) {
+        $(el).on('click', dismiss, this.close)
+      }
+
+  Alert.prototype.close = function (e) {
+    var $this = $(this)
+      , selector = $this.attr('data-target')
+      , $parent
+
+    if (!selector) {
+      selector = $this.attr('href')
+      selector = selector && selector.replace(/.*(?=#[^\s]*$)/, '') //strip for ie7
+    }
+
+    $parent = $(selector)
+
+    e && e.preventDefault()
+
+    $parent.length || ($parent = $this.hasClass('alert') ? $this : $this.parent())
+
+    $parent.trigger(e = $.Event('close'))
+
+    if (e.isDefaultPrevented()) return
+
+    $parent.removeClass('in')
+
+    function removeElement() {
+      $parent
+        .trigger('closed')
+        .remove()
+    }
+
+    $.support.transition && $parent.hasClass('fade') ?
+      $parent.on($.support.transition.end, removeElement) :
+      removeElement()
+  }
+
+
+ /* ALERT PLUGIN DEFINITION
+  * ======================= */
+
+  $.fn.alert = function (option) {
+    return this.each(function () {
+      var $this = $(this)
+        , data = $this.data('alert')
+      if (!data) $this.data('alert', (data = new Alert(this)))
+      if (typeof option == 'string') data[option].call($this)
+    })
+  }
+
+  $.fn.alert.Constructor = Alert
+
+
+ /* ALERT DATA-API
+  * ============== */
+
+  $(function () {
+    $('body').on('click.alert.data-api', dismiss, Alert.prototype.close)
+  })
+
+}(window.jQuery);

deps/example-tour.js

@@ -24,7 +24,7 @@ jQuery(function($) {
     + "complicated things. <br \/>Power to the people! :P"
   });
   tour.addStep({
-    path: "test.html",
+    path: "page.html",
     element: "h1",
     placement: "bottom",
     title: "See, you are not restricted to only one page",
@@ -42,13 +42,15 @@ jQuery(function($) {
   tour.start();
 
   if ( tour.ended() ) {
-    $(".content").prepend('<div class="alert">\
-                          <button class="close" data-dismiss="alert">×</button>\
-                          You ended the demo tour. <a href="" class="restart">Restart the demo tour.</a>\
-                          </div>');
+    $('<div class="alert">\
+      <button class="close" data-dismiss="alert">×</button>\
+      You ended the demo tour. <a href="" class="restart">Restart the demo tour.</a>\
+      </div>').prependTo(".content").alert();
   }
 
-  $(".restart").click(function () {
-    tour.restart()
+  $(".restart").click(function (e) {
+    e.preventDefault();
+    tour.restart();
+    $(this).parents(".alert").alert("close");
   });
 });

index.html

@@ -188,6 +188,7 @@ <h2 id="license">License</h2>
     <script src="deps/google-code-prettify/prettify.js"></script>
     <script src="deps/bootstrap-tooltip.js"></script>
     <script src="deps/bootstrap-popover.js"></script>
+    <script src="deps/bootstrap-alert.js"></script>
     <script src="deps/jquery.cookie.js"></script>
     <script src="bootstrap-tour.js"></script>
     <script src="deps/example-tour.js"></script>

page.html

@@ -0,0 +1,45 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <title>Bootstrap Tour, An Extension of Bootstrap from Twitter</title>
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="description" content="">
+    <meta name="author" content="">
+
+    <!-- Le styles -->
+    <link href="deps/bootstrap.css" rel="stylesheet">
+    <style>
+      body {
+        padding-top: 60px; /* 60px to make the container go all the way to the bottom of the topbar */
+      }
+    </style>
+    <link href="deps/bootstrap-responsive.css" rel="stylesheet">
+
+    <!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
+    <!--[if lt IE 9]>
+      <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
+    <![endif]-->
+  </head>
+
+  <body>
+
+    <div class="container">
+
+      <h1>This is just a test.</h1>
+      <p>Nothing to see here. Move on!</p>
+
+    </div> <!-- /container -->
+
+    <!-- Le javascript
+    ================================================== -->
+    <!-- Placed at the end of the document so the pages load faster -->
+    <script src="deps/jquery.js"></script>
+    <script src="deps/bootstrap-tooltip.js"></script>
+    <script src="deps/bootstrap-popover.js"></script>
+    <script src="deps/jquery.cookie.js"></script>
+    <script src="bootstrap-tour.js"></script>
+    <script src="deps/example-tour.js"></script>
+
+  </body>
+</html>

test.html

@@ -1,45 +1,25 @@
 <!DOCTYPE html>
-<html lang="en">
+<html>
   <head>
     <meta charset="utf-8">
-    <title>Bootstrap Tour, An Extension of Bootstrap from Twitter</title>
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <meta name="description" content="">
-    <meta name="author" content="">
+    <title>Bootstrap Tour Unit Tests</title>
+    <link rel="stylesheet" href="tests/qunit/qunit.css">
+    <script src="tests/qunit/qunit.js"></script>
+    <script src="tests/tests.js"></script>
 
-    <!-- Le styles -->
     <link href="deps/bootstrap.css" rel="stylesheet">
-    <style>
-      body {
-        padding-top: 60px; /* 60px to make the container go all the way to the bottom of the topbar */
-      }
-    </style>
-    <link href="deps/bootstrap-responsive.css" rel="stylesheet">
-
-    <!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
-    <!--[if lt IE 9]>
-      <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
-    <![endif]-->
-  </head>
-
-  <body>
-
-    <div class="container">
-
-      <h1>This is just a test.</h1>
-      <p>Nothing to see here. Move on!</p>
-
-    </div> <!-- /container -->
-
-    <!-- Le javascript
-    ================================================== -->
-    <!-- Placed at the end of the document so the pages load faster -->
     <script src="deps/jquery.js"></script>
     <script src="deps/bootstrap-tooltip.js"></script>
     <script src="deps/bootstrap-popover.js"></script>
     <script src="deps/jquery.cookie.js"></script>
     <script src="bootstrap-tour.js"></script>
-    <script src="deps/example-tour.js"></script>
-
+  </head>
+  <body>
+    <h1 id="qunit-header">Bootstrap Tour Unit Tests</h1>
+    <h2 id="qunit-banner"></h2>
+    <div id="qunit-testrunner-toolbar"></div>
+    <h2 id="qunit-userAgent"></h2>
+    <ol id="qunit-tests"></ol>
+    <div id="qunit-fixture"></div>
   </body>
 </html>