Configuration for tour complete

OiWorld · Jul 26, 2018 · d23a3c3 · d23a3c3
1 parent 14b1d57
commit d23a3c3
Show file tree

Hide file tree

Showing 4 changed files with 42 additions and 12 deletions.
diff --git a/lib/assets/js/main.js b/lib/assets/js/main.js
@@ -68,6 +68,12 @@ jQuery(document).ready(function(){
 		}
 	});
 
+	//event listener for Bootstrap Tour
+	$("#mtwTakeTour").click(function(){
+		tour.restart(true);
+	});
+
+
 	//on desktop - differentiate between a user trying to hover over a dropdown item vs trying to navigate into a submenu's contents
 	sidebar.children('ul').menuAim({
         activate: function(row) {

diff --git a/lib/assets/js/tour.js b/lib/assets/js/tour.js
@@ -1,15 +1,28 @@
 // Instance the tour
 var tour = new Tour({
+    orphan: true,
+    backdrop: true,
     steps: [
     {
-      element: "#my-element",
-      title: "Title of my step",
-      content: "Content of my step"
+        title: "Welcome To Mind The Word",
+        content: "This tour will walk through the extension.",
+    },
+    {
+        element: "#my-element",
+        title: "Title of my step",
+        content: "Content of my step"
     }
   ]});
 
   // Initialize the tour
   tour.init();
 
   // Start the tour
-  tour.start(true);
+  chrome.storage.local.get(['newInstallUpdate'], (result) => {
+    if(result.newInstallUpdate){
+        tour.restart(true);
+    }
+    chrome.storage.local.set({
+        'newInstallUpdate': false
+    });
+  });
diff --git a/lib/scripts/eventPage.js b/lib/scripts/eventPage.js
@@ -404,3 +404,11 @@ chrome.runtime.onMessage.addListener(function(message, sender, sendResponse) {
       chrome.browserAction.setBadgeText({text:String('')});
     } 
 });
+
+chrome.runtime.onInstalled.addListener(function(details){
+  if(details.reason == "install" || details.reason == "update"){
+    chrome.storage.local.set({
+      'newInstallUpdate': true
+    });
+  }
+});
diff --git a/lib/views/options.html b/lib/views/options.html
@@ -32,21 +32,24 @@
 
        <nav class="cd-nav">
         <ul class="cd-top-nav">
-           <li>
-             <a href="#statistics" data-toggle="tab" data-translate="statistics">Statistics</a>
-           </li>
-           <li>
-             <a href="#contribute" data-toggle="tab" data-translate="contribute">Contribute</a>
-           </li>
+            <li>
+                <a id = "mtwTakeTour" href="#">Take Tour</a>
+            </li>
+            <li>
+                <a href="#statistics" data-toggle="tab" data-translate="statistics">Statistics</a>
+            </li>
+            <li>
+                <a href="#contribute" data-toggle="tab" data-translate="contribute">Contribute</a>
+            </li>
 
         </ul>
        </nav>
       </header>
 
-    <main id="my-element" class="cd-main-content">
+    <main class="cd-main-content">
      <nav class="cd-side-nav">
         <ul>
-          <li class="active">
+          <li id="my-element" class="active">
             <a href="#translation-settings" data-toggle="tab" data-translate="translation" data-placement="right" title="Language Translation Services">Translation</a>
           </li>
           <li>