diff --git a/Gruntfile.js b/Gruntfile.js index 53c1e422a9..e22820131e 100644 --- a/Gruntfile.js +++ b/Gruntfile.js @@ -81,7 +81,6 @@ module.exports = function(grunt) { 'public/bower_components/bootstrap/docs/assets/js/bootstrap.min.js', 'public/js/static.js', - 'public/js/services/memberServices.js', 'public/js/services/userServices.js', 'public/js/controllers/authCtrl.js' ] diff --git a/public/css/header.styl b/public/css/header.styl index a70a00fb46..916b001abe 100644 --- a/public/css/header.styl +++ b/public/css/header.styl @@ -8,7 +8,7 @@ border-bottom: 1px solid rgba(0,0,0,0.2) // margin-top: -1px overflow: hidden - position relative + // position relative /* login/menu buttons --------------------- */ diff --git a/public/css/npcs.styl b/public/css/npcs.styl index c9cc6d3bfc..dae4676197 100644 --- a/public/css/npcs.styl +++ b/public/css/npcs.styl @@ -18,10 +18,11 @@ width: 54px height: 30px position: absolute - bottom: 0px + top: 117px // 147 (header-height) - 30 (bailey height) right: 50px cursor: pointer + .static-popover z-index 0 display block diff --git a/public/js/controllers/notificationCtrl.js b/public/js/controllers/notificationCtrl.js index 74d65a4989..bb2cb890e2 100644 --- a/public/js/controllers/notificationCtrl.js +++ b/public/js/controllers/notificationCtrl.js @@ -3,8 +3,6 @@ habitrpg.controller('NotificationCtrl', ['$scope', '$rootScope', 'User', 'Guide', 'Notification', function ($scope, $rootScope, User, Guide, Notification) { - Guide.initTour(); - $rootScope.$watch('user.stats.hp', function(after, before) { if (after == before) return; Notification.hp(after - before, 'hp'); diff --git a/public/js/controllers/tasksCtrl.js b/public/js/controllers/tasksCtrl.js index 6e93c152dd..9e1d143312 100644 --- a/public/js/controllers/tasksCtrl.js +++ b/public/js/controllers/tasksCtrl.js @@ -35,7 +35,7 @@ habitrpg.controller("TasksCtrl", ['$scope', '$rootScope', '$location', 'User', ' if (task.type === "reward" && User.user.stats.gp < task.value) return Notification.text('Not enough GP.'); Algos.score(User.user, task, direction); - User.log({op: "score", data: task, dir: direction}); + User.log({op: "score",data: task, dir: direction}); }; diff --git a/public/js/services/guideServices.js b/public/js/services/guideServices.js index 45cbeff75b..ece2842998 100644 --- a/public/js/services/guideServices.js +++ b/public/js/services/guideServices.js @@ -5,9 +5,14 @@ */ angular.module('guideServices', []). - factory('Guide', ['User', function(User) { + factory('Guide', ['$rootScope', 'User', function($rootScope, User) { - var initTour = function() { + /** + * Init and show the welcome tour. Note we do it listening to a $rootScope broadcasted 'userLoaded' message, + * this because we need to determine whether to show the tour *after* the user has been pulled from the server, + * otherwise it's always start off as true, and then get set to false later + */ + $rootScope.$on('userUpdated', function(){ if (User.user.flags.showTour === false) return; var tourSteps = [ { @@ -59,11 +64,87 @@ angular.module('guideServices', []). }); tour.restart(); // Tour doesn't quite mesh with our handling of flags.showTour, just restart it on page load //tour.start(true); + }) + + var alreadyShown = function(before, after) { + return !(!before && after === true); }; - return { - initTour: initTour - } + var showPopover = function(selector, title, html, placement) { + if (!placement) placement = 'bottom'; + $(selector).popover('destroy'); + html = "
" + html + "[Close]
"; + $(selector).popover({ + title: title, + placement: placement, + trigger: 'manual', + html: true, + content: html + }).popover('show'); + }; + + $rootScope.$watch('user.flags.customizationsNotification', function(after, before) { + if (alreadyShown(before, after)) return + $('.main-herobox').popover('destroy'); + showPopover('.main-herobox', 'Customize Your Avatar', "Click your avatar to customize your appearance.", 'bottom'); + }); + + $rootScope.$watch('user.flags.itemsEnabled', function(after, before) { + if (alreadyShown(before, after)) return; + var html = "Congratulations, you have unlocked the Item Store! You can now buy weapons, armor, potions, etc. Read each item's comment for more information."; + showPopover('div.rewards', 'Item Store Unlocked', html, 'left'); + }); + + $rootScope.$watch('user.flags.petsEnabled', function(after, before) { + if (alreadyShown(before, after)) return; + var html = "You have unlocked Pets! You can now buy pets with Gems (note, you replenish Gems with real-life money - so chose your pets wisely!)"; + showPopover('#rewardsTabs', 'Pets Unlocked', html, 'left'); + }); + + $rootScope.$watch('user.flags.partyEnabled', function(after, before) { + if (alreadyShown(before, after)) return; + var html = "Be social, join a party and play Habit with your friends! You'll be better at your habits with accountability partners. Click User -> Options -> Party, and follow the instructions. LFG anyone?"; + showPopover('.user-menu', 'Party System', html, 'bottom'); + }); + + $rootScope.$watch('user.flags.dropsEnabled', function(after, before) { + if (alreadyShown(before, after)) return; + var drop = window.helpers.randomVal(window.items.items.pets); + var eggs = User.user.items.eggs = []; + eggs.push(drop); // FIXME put this on server instead + User.set('items.eggs', eggs); + $rootScope.modals.dropsEnabled = true; + }); + + $rootScope.$watch('user.items.pets', function(after, before) { + if (User.user.achievements && User.user.achievements.beastMaster) return; + if (before >= 90) { + User.set('achievements.beastMaster', true); + $('#beastmaster-achievement-modal').modal('show'); // FIXME + } + }); + + $rootScope.$watch('user.items', function(after, before) { + if (User.user.achievements && User.user.achievements.ultimateGear) return; + var items = User.user.items; + if (+items.weapon >= 6 && +items.armor >= 5 && +items.head >= 5 && +items.shield >= 5) { + User.set('achievements.ultimateGear', true); // FIXME + $('#max-gear-achievement-modal').modal('show'); // FIXME + } + }); + + // FIXME how to handle tasks.*.streak? + // FIXME move to tasksCtrl + /*$rootScope.$watch('user.tasks.*.streak', function(id, after, before) { + if (after > 0) { + if ((after % 21) === 0) { + user.incr('achievements.streak', 1) + return $('#streak-achievement-modal').modal('show'); + } else if ((before - after === 1) && (before % 21 === 0)) { + return user.incr('achievements.streak', -1); + } + } + });*/ } ]); diff --git a/public/js/services/memberServices.js b/public/js/services/memberServices.js index f4cad5923b..5c16118b85 100644 --- a/public/js/services/memberServices.js +++ b/public/js/services/memberServices.js @@ -5,11 +5,11 @@ */ angular.module('memberServices', ['ngResource']). - factory('Members', ['API_URL', '$resource', - function(API_URL, $resource) { + factory('Members', ['$rootScope', 'API_URL', '$resource', + function($rootScope, API_URL, $resource) { var members = {}; var Member = $resource(API_URL + '/api/v1/members/:uid', {uid:'@_id'}); - return { + var memberServices = { members: members, @@ -69,5 +69,11 @@ angular.module('memberServices', ['ngResource']). } } } + + $rootScope.$on('userUpdated', function(event, user){ + memberServices.populate(user); + }) + + return memberServices; } ]); diff --git a/public/js/services/userServices.js b/public/js/services/userServices.js index 670557878f..bc68a2be2a 100644 --- a/public/js/services/userServices.js +++ b/public/js/services/userServices.js @@ -5,8 +5,8 @@ */ angular.module('userServices', []). - factory('User', ['$http', '$location', 'API_URL', 'STORAGE_USER_ID', 'STORAGE_SETTINGS_ID', 'Members', - function($http, $location, API_URL, STORAGE_USER_ID, STORAGE_SETTINGS_ID, Members) { + factory('User', ['$rootScope', '$http', '$location', 'API_URL', 'STORAGE_USER_ID', 'STORAGE_SETTINGS_ID', + function($rootScope, $http, $location, API_URL, STORAGE_USER_ID, STORAGE_SETTINGS_ID) { var authenticated = false, defaultSettings = { auth: { apiId: '', apiToken: ''}, @@ -67,9 +67,9 @@ angular.module('userServices', []). if(data.wasModified) { delete data.wasModified; _.extend(user, data); + $rootScope.$emit('userUpdated', user); } user._v = data._v; - Members.populate(user); // FIXME handle this somewhere else, we don't need to check every single time var offset = moment().zone(); // eg, 240 - this will be converted on server as -(offset/60) diff --git a/public/js/static.js b/public/js/static.js index f65568c182..4876031b17 100644 --- a/public/js/static.js +++ b/public/js/static.js @@ -1,6 +1,6 @@ "use strict"; -window.habitrpg = angular.module('habitrpg', ['userServices', 'memberServices']) +window.habitrpg = angular.module('habitrpg', ['userServices']) .constant("API_URL", "") .constant("STORAGE_USER_ID", 'habitrpg-user') .constant("STORAGE_SETTINGS_ID", 'habit-mobile-settings') \ No newline at end of file diff --git a/views/static/layout.jade b/views/static/layout.jade index 813842b38a..2057c6ab30 100644 --- a/views/static/layout.jade +++ b/views/static/layout.jade @@ -32,7 +32,6 @@ html script(type='text/javascript', src='/bower_components/bootstrap/docs/assets/js/bootstrap.min.js') script(type='text/javascript', src='/js/static.js') - script(type='text/javascript', src='/js/services/memberServices.js') script(type='text/javascript', src='/js/services/userServices.js') script(type='text/javascript', src='/js/controllers/authCtrl.js') -}