Merge pull request #59 from fitcode/title_element

adding a title to the tour bubble

README.md

@@ -118,6 +118,8 @@ There are additional attributes that allow you to customize each tour-tip.
 
 * `tourtip-container-element` **(Default: "body")**: Element the tour tips are placed in. Especially practical when you have several scrollable containers you want to display tours in.
 
+* `tourtip-title` **(Default: null)**: Title creates a separate h3 element to allow the separation of a title and it's content.
+
 Inside your tour, you also have access to two scope methods for ending and starting the tour.
 
 ```HTML

dist/angular-tour-tpls.js

@@ -1,6 +1,6 @@
 /**
  * An AngularJS directive for showcasing features of your website
- * @version v0.2.5 - 2015-11-05
+ * @version v0.2.5 - 2015-12-10
  * @link https://github.com/DaftMonk/angular-tour
  * @author Tyler Henkel
  * @license MIT License, http://www.opensource.org/licenses/MIT
@@ -16,7 +16,7 @@
   angular.module('tour/tour.tpl.html', []).run([
     '$templateCache',
     function ($templateCache) {
-      $templateCache.put('tour/tour.tpl.html', '<div class="tour-tip">\n' + '    <span class="tour-arrow tt-{{ ttPlacement }}" ng-hide="centered"></span>\n' + '    <div class="tour-content-wrapper">\n' + '        <p ng-bind="ttContent"></p>\n' + '        <a ng-click="proceed()" ng-bind="ttNextLabel" class="small button tour-next-tip"></a>\n' + '        <a ng-click="closeTour()" class="tour-close-tip">&times;</a>\n' + '    </div>\n' + '</div>');
+      $templateCache.put('tour/tour.tpl.html', '<div class="tour-tip">\n' + '    <span class="tour-arrow tt-{{ ttPlacement }}" ng-hide="centered"></span>\n' + '    <div class="tour-content-wrapper">\n' + '        <h3 ng-bind="ttTitle"></h3>\n' + '        <p ng-bind="ttContent"></p>\n' + '        <a ng-click="proceed()" ng-bind="ttNextLabel" class="small button tour-next-tip"></a>\n' + '        <a ng-click="closeTour()" class="tour-close-tip">&times;</a>\n' + '    </div>\n' + '</div>\n' + '');
     }
   ]);
   angular.module('angular-tour.tour', []).constant('tourConfig', {
@@ -200,6 +200,10 @@
           attrs.$observe('tourtipElement', function (val) {
             scope.ttElement = val || null;
           });
+          //defaults: null
+          attrs.$observe('tourtipTitle', function (val) {
+            scope.ttTitle = val || null;
+          });
           //defaults: tourConfig.useSourceScope
           attrs.$observe('useSourceScope', function (val) {
             scope.ttSourceScope = !val ? tourConfig.useSourceScope : val === 'true';

dist/angular-tour.js

@@ -1,6 +1,6 @@
 /**
  * An AngularJS directive for showcasing features of your website
- * @version v0.2.5 - 2015-11-05
+ * @version v0.2.5 - 2015-12-10
  * @link https://github.com/DaftMonk/angular-tour
  * @author Tyler Henkel
  * @license MIT License, http://www.opensource.org/licenses/MIT
@@ -190,6 +190,10 @@
           attrs.$observe('tourtipElement', function (val) {
             scope.ttElement = val || null;
           });
+          //defaults: null
+          attrs.$observe('tourtipTitle', function (val) {
+            scope.ttTitle = val || null;
+          });
           //defaults: tourConfig.useSourceScope
           attrs.$observe('useSourceScope', function (val) {
             scope.ttSourceScope = !val ? tourConfig.useSourceScope : val === 'true';