feat(tour): Iteration 5/29

common/locales/en/npc.json

@@ -59,25 +59,25 @@
     "tourEquipmentPage": "This is where your Equipment is stored! Your Battle Gear affects your stats. If you want to show different Equipment on your avatar without changing your stats, click \"Enable Costume.\"",
 
     "tourOkay": "Okay!",
+    "tourAwesome": "Awesome!",
+    "tourSplendid": "Splendid!",
+    "tourNifty": "Nifty!",
 
-    "tourAvatar1": "<strong>Your Avatar</strong><ul><li>Your avatar lives at the top of the task dashboard.</li><li>Click on your avatar at any time to customize it!</li></ul>",
+    "tourAvatar": "<strong>Customize Your Avatar</strong><ul><li>Your avatar represents you.</li><li>Customize now, or return later.</li><li>Your avatar starts plain until you've earned Equipment!</li></ul>",
-    "tourAvatar1Proceed": "Take me there!",
+    "tourAvatarProceed": "Show me my tasks!",
-    "tourAvatar2": "<strong>Customize Avatar</strong><ul><li>This is the page for basic avatar customization.</li><li>You can buy Equipment for your avatar later, once you've earned Gold.</li></ul>",
+    "tourToDosBrief": "<strong>To-Do List</strong><ul><li>Check off To-Dos to earn Gold & Experience!</li><li>To-Dos never make your avatar lose Health.</li></ul>",
-    "tourToDosBrief": "<strong>To-Do List</strong><ul><li>Check off To-Dos for Gold & Experience!</li><li>To-Dos never make your avatar lose Health</li></ul>",
+    "tourDailiesBrief": "<strong>Daily Tasks</strong><ul><li>Dailies repeat every day.</li><li>You lose Health if you skip Dailies.</li></ul>",
-    "tourDailiesBrief": "<strong>Daily Tasks</strong><ul><li>Dailies repeat every day</li><li>You lose Health if you skip Dailies</li></ul>",
     "tourDailiesProceed": "I'll be careful!",
-    "tourHabitsBrief": "<strong>Good & Bad Habits</strong><ul><li>Good Habits award Gold & Experience</li><li>Bad Habits make you lose Health</li></ul>",
+    "tourHabitsBrief": "<strong>Good & Bad Habits</strong><ul><li>Good Habits award Gold & Experience.</li><li>Bad Habits make you lose Health.</li></ul>",
     "tourHabitsProceed": "Makes sense!",
-    "tourRewardsBrief": "<strong>Reward List</strong><ul><li>Spend your Gold here</li><li>Purchase Equipment for your avatar, or set custom Rewards</li></ul>",
+    "tourRewardsBrief": "<strong>Reward List</strong><ul><li>Spend your hard-earned Gold here!</li><li>Purchase Equipment for your avatar, or set custom Rewards.</li></ul>",
-    "tourRewardsProceed": "Can't wait!",
+    "tourRewardsProceed": "That's all!",
-    "tourQuestions": "<strong>More Questions?</strong><ul><li>If you get confused, click the <span class='glyphicon glyphicon-question-sign'></span> next to the headers.</li><li>Explore the tabs in the header to discover more features!</li></ul>",
-    "tourQuestionsProceed": "I will!",
 
     "welcomeToHabit": "Welcome to HabitRPG, a game to improve your life!",
     "welcome1": "Create and customize an in-game avatar to represent you.",
     "welcome2": "Your real-life tasks affect your avatar's Health (HP), Experience (XP), and Gold!",
     "welcome3": "Complete tasks to earn Experience (XP) and Gold, which unlock awesome features and rewards!",
     "welcome4": "Avoid bad habits that drain Health (HP), or your avatar will die!",
-    "welcome5": "Now Justin the Guide will teach you how to use your task dashboard...",
+    "welcome5": "Now you'll customize your avatar and set up your tasks...",
     "imReady": "I'm Ready!"
 }

website/public/js/services/guideServices.js

@@ -11,19 +11,12 @@ function($rootScope, User, $timeout, $state) {
   var chapters = {
     intro: [
       [
-        {
-          state: 'tasks',
-          element: ".main-herobox",
-          content: window.env.t('tourAvatar1'),
-          placement: "right",
-          proceed: window.env.t('tourAvatar1Proceed')
-        },
         {
           state: 'options.profile.avatar',
           element: '.tab-content.ng-scope',
-          content: window.env.t('tourAvatar2'),
+          content: window.env.t('tourAvatar'),
           placement: "top",
-          proceed: window.env.t('tourOkay'),
+          proceed: window.env.t('tourAvatarProceed'),
           backdrop: false,
           orphan: true
         },
@@ -52,14 +45,8 @@ function($rootScope, User, $timeout, $state) {
           state: 'tasks',
           element: ".task-column.rewards",
           content: window.env.t('tourRewardsBrief'),
-          placement: "left",
+          placement: "top",
-          proceed: window.env.t('tourRewardsProceed')
+          proceed: window.env.t('tourRewardsProceed'),
-        },
-        {
-          state: 'tasks',
-          content: window.env.t('tourQuestions'),
-          proceed: window.env.t('tourQuestionsProceed'),
-          orphan: true,
           final: true
         }
       ]
@@ -99,7 +86,8 @@ function($rootScope, User, $timeout, $state) {
         orphan: true,
         content: window.env.t('tourStatsPage'),
         final: true,
-        proceed: window.env.t('tourOkay')
+        proceed: window.env.t('tourOkay'),
+        hideNavigation: true
       }
     ]],
     tavern: [[
@@ -107,7 +95,8 @@ function($rootScope, User, $timeout, $state) {
         orphan: true,
         content: window.env.t('tourTavernPage'),
         final: true,
-        proceed: window.env.t('tourOkay')
+        proceed: window.env.t('tourAwesome'),
+        hideNavigation: true
       }
     ]],
     party: [[
@@ -115,7 +104,8 @@ function($rootScope, User, $timeout, $state) {
         orphan: true,
         content: window.env.t('tourPartyPage'),
         final: true,
-        proceed: window.env.t('tourOkay')
+        proceed: window.env.t('tourSplendid'),
+        hideNavigation: true
       }
     ]],
     guilds: [[
@@ -123,7 +113,8 @@ function($rootScope, User, $timeout, $state) {
         orphan: true,
         content: window.env.t('tourGuildsPage'),
         final: true,
-        proceed: window.env.t('tourOkay')
+        proceed: window.env.t('tourNifty'),
+        hideNavigation: true
       }
     ]],
     challenges: [[
@@ -131,7 +122,8 @@ function($rootScope, User, $timeout, $state) {
         orphan: true,
         content: window.env.t('tourChallengesPage'),
         final: true,
-        proceed: window.env.t('tourOkay')
+        proceed: window.env.t('tourOkay'),
+        hideNavigation: true
       }
     ]],
     market: [[
@@ -139,7 +131,8 @@ function($rootScope, User, $timeout, $state) {
         orphan: true,
         content: window.env.t('tourMarketPage'),
         final: true,
-        proceed: window.env.t('tourOkay')
+        proceed: window.env.t('tourAwesome'),
+        hideNavigation: true
       }
     ]],
     hall: [[
@@ -147,7 +140,8 @@ function($rootScope, User, $timeout, $state) {
         orphan: true,
         content: window.env.t('tourHallPage'),
         final: true,
-        proceed: window.env.t('tourOkay')
+        proceed: window.env.t('tourSplendid'),
+        hideNavigation: true
       }
     ]],
     pets: [[
@@ -155,7 +149,8 @@ function($rootScope, User, $timeout, $state) {
         orphan: true,
         content: window.env.t('tourPetsPage'),
         final: true,
-        proceed: window.env.t('tourOkay')
+        proceed: window.env.t('tourNifty'),
+        hideNavigation: true
       }
     ]],
     mounts: [[
@@ -163,7 +158,8 @@ function($rootScope, User, $timeout, $state) {
         orphan: true,
         content: window.env.t('tourMountsPage'),
         final: true,
-        proceed: window.env.t('tourOkay')
+        proceed: window.env.t('tourOkay'),
+        hideNavigation: true
       }
     ]],
     equipment: [[
@@ -171,7 +167,8 @@ function($rootScope, User, $timeout, $state) {
         orphan: true,
         content: window.env.t('tourEquipmentPage'),
         final: true,
-        proceed: window.env.t('tourOkay')
+        proceed: window.env.t('tourAwesome'),
+        hideNavigation: true
       }
     ]]
   }
@@ -215,9 +212,9 @@ function($rootScope, User, $timeout, $state) {
             //'<button class="btn btn-sm btn-default" data-role="end" style="float:none;">' + (step.final ? 'Finish Tour' : 'Hide') + '</button>' +
             (showCounter ? '<span style="float:right;">'+ (i+1 +' of '+ _.flatten(chapters[k]).length) +'</span>' : '')+ // counter
             '<div class="btn-group">' +
-              '<button class="btn btn-sm btn-default" data-role="prev">&laquo; Previous</button>' +
+              (step.hideNavigation ? '' : '<button class="btn btn-sm btn-default" data-role="prev">&laquo; Previous</button>') +
               (showFinish ? ('<button class="btn btn-sm btn-primary" data-role="end" style="float:none;">' + (step.proceed ? step.proceed : "Finish Tour") + '</button>') :
-                ('<button class="btn btn-sm btn-primary" data-role="next">' + (step.proceed ? step.proceed : "Next") + ' &raquo;</button>')) +
+                (step.hideNavigation ? '' : ('<button class="btn btn-sm btn-primary" data-role="next">' + (step.proceed ? step.proceed : "Next") + ' &raquo;</button>'))) +
               '<button class="btn btn-sm btn-default" data-role="pause-resume" data-pause-text="Pause" data-resume-text="Resume">Pause</button>' +
             '</div>' +
           '</div>' +

website/views/shared/tasks/lists.jade

@@ -16,7 +16,7 @@ script(id='templates/habitrpg-tasks.html', type="text/ng-template")
               span.glyphicon.glyphicon-calendar
             // <a href="https://www.google.com/calendar/render?cid={{encodeiCalLink(_user.id, _user.apiToken)}}" rel=tooltip title="Google Calendar"><i class=icon-calendar></i></a>
             a.option-action(ng-click='list.help=!list.help', tooltip='Click for help')
-              span.glyphicon.glyphicon-question-sign
+              span.glyphicon.glyphicon-question-sign(style={'zoom':1.5,'vertical-align':'-webkit-baseline-middle'})
 
           // Header
           h2.task-column_title
@@ -117,6 +117,13 @@ script(id='templates/habitrpg-tasks.html', type="text/ng-template")
 
           +taskColumnTabs('top')
 
+          // Actual List
+          ul(class='{{list.type}}s main-list', ng-show='obj[list.type + "s"].length > 0', hrpg-sort-tasks, ng-if='!$state.includes("options.social.challenges")')
+            include ./task
+          //Loads the non-sortable lists for challenges
+          ul(class='{{list.type}}s main-list', ng-show='obj[list.type + "s"].length > 0', ng-if='$state.includes("options.social.challenges")')
+            include ./task
+
           // Static Rewards
           ul.items.rewards(ng-if='main && list.type=="reward"')
             li.task.reward-item(ng-repeat='item in itemStore',popover-trigger='mouseenter', popover-placement='top', popover='{{item.notes()}}')
@@ -160,13 +167,6 @@ script(id='templates/habitrpg-tasks.html', type="text/ng-template")
             +specialSpell('opaquePotion','spookDust')
             +specialSpell('petalFreePotion','shinySeed')
 
-          // Actual List
-          ul(class='{{list.type}}s main-list', ng-show='obj[list.type + "s"].length > 0', hrpg-sort-tasks, ng-if='!$state.includes("options.social.challenges")')
-            include ./task
-          //Loads the non-sortable lists for challenges
-          ul(class='{{list.type}}s main-list', ng-show='obj[list.type + "s"].length > 0', ng-if='$state.includes("options.social.challenges")')
-            include ./task
-
           // Spells
           ul.items(ng-if='main && list.type=="reward" && user.stats.class && !user.preferences.disableClasses')
             li.task.reward-item(ng-repeat='(k,skill) in Content.spells[user.stats.class]', ng-if='user.stats.lvl >= skill.lvl',popover-trigger='mouseenter', popover-placement='top', popover='{{skill.notes()}}')