Explorar o código

HUE-1412 [core] Add splash screen to Follow me tour plugin

Splash modal is shown whenever there's a tour available on the page
Possibility to dismiss the modal forever
Changed icon to checkered flag
Enrico Berti %!s(int64=12) %!d(string=hai) anos
pai
achega
8f523476ab

+ 21 - 0
desktop/core/src/desktop/templates/common_footer.mako

@@ -171,6 +171,27 @@ from django.template.defaultfilters import escape, escapejs
 </script>
 %if tours_and_tutorials:
   <script src="/static/js/Source/jHue/available.tours.js"></script>
+  <div id="jHueTourModal" class="modal hide fade">
+    <div class="modal-header">
+      <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
+      <h3>${_('Did you know?')}</h3>
+    </div>
+    <div class="modal-body">
+      <div class="pull-left" style="color: #DDDDDD;font-size: 116px;margin: 10px; margin-right: 20px"><i class="icon-flag-checkered"></i></div>
+      <div style="margin: 10px">
+      <p>
+        ${_('There is one or more tours available for this page. These tours were created to guide you around.')}
+      </p>
+      <p>
+        ${_('You can see the list of the tours by clicking on the checkered flag badge on the side of this page.')}
+      </p>
+        </div>
+    </div>
+    <div class="modal-footer">
+      <label class="checkbox" style="float:left"><input id="jHueTourModalChk" type="checkbox" />${_('Do not show this dialog again')}</label>
+      <a href="#" class="btn btn-primary disable-feedback" data-dismiss="modal">${_('Got it, prof!')}</a>
+    </div>
+  </div>
 %endif
   </body>
 </html>

+ 11 - 1
desktop/core/static/js/Source/jHue/jquery.tour.js

@@ -116,7 +116,7 @@
   Plugin.prototype.initQuestionMark = function () {
     var _this = this;
     $("#jHueTourQuestion").remove();
-    var _questionMark = $("<div>").attr("id", "jHueTourQuestion").html('<i class="icon-question"></i>').addClass("jHueTourBadge");
+    var _questionMark = $("<div>").attr("id", "jHueTourQuestion").html('<i class="icon-flag-checkered" style=""></i>').addClass("jHueTourBadge");
     if (_this.options.questionMarkPlacement == "left"){
       _questionMark.addClass("jHueTourBadgeLeft");
     }
@@ -161,6 +161,16 @@
           _toursHtml += '<li>' + _this.options.labels.NO_AVAILABLE_TOURS + '</li>';
         }
       }
+      if (_added > 0 && typeof $.totalStorage !== "undefined" && ($.totalStorage("jHueTourHideModal") == null || $.totalStorage("jHueTourHideModal") == false)) {
+        $(document).ready(function () {
+          $("#jHueTourModal").modal();
+          $.totalStorage("jHueTourHideModal", true);
+          $("#jHueTourModalChk").attr("checked", "checked");
+          $("#jHueTourModalChk").on("change", function () {
+            $.totalStorage("jHueTourHideModal", $(this).is(":checked"));
+          });
+        });
+      }
       if (_this.options.showRemote){
         _toursHtml += '<li>' +
           ' <div class="input-append" style="margin-top: 10px">' +