fix(hairstyles): base layer above bangs

gulp/gulp-sprites.js

@@ -148,6 +148,9 @@ function cssVarMap (sprite) {
   }
   if (~sprite.name.indexOf('shirt'))
     sprite.custom.px.offset_y = `-${ sprite.y + 30 }px`; // even more for shirts
-  if (~sprite.name.indexOf('topHair'))
-    sprite.custom.px.offset_y = `-${ sprite.y }px`; // don't crop updos
+  if (~sprite.name.indexOf('hair_base')) {
+    let styleArray = sprite.name.split('_').slice(2,3);
+    if (Number(styleArray[0]) > 14)
+      sprite.custom.px.offset_y = `-${ sprite.y }px`; // don't crop updos
+  }
 }

website/client-old/js/controllers/userCtrl.js

@@ -66,10 +66,8 @@ habitrpg.controller("UserCtrl", ['$rootScope', '$scope', '$location', 'User', '$
         if (confirm(window.env.t('purchaseFor',{cost:cost*4})) !== true) return;
         if (User.user.balance < cost) return $rootScope.openModal('buyGems');
       } else if (!_.get(User.user, 'purchased.' + path)) {
-        if (path.indexOf('hair.base') === -1 || !_.includes(['0', '1', '3'], path.split('.').pop())) {
-          if (confirm(window.env.t('purchaseFor',{cost:cost*4})) !== true) return;
-          if (User.user.balance < cost) return $rootScope.openModal('buyGems');
-        }
+        if (confirm(window.env.t('purchaseFor',{cost:cost*4})) !== true) return;
+        if (User.user.balance < cost) return $rootScope.openModal('buyGems');
       }
       User.unlock({query:{path:path}})
     }

website/common/script/content/appearance/hair/base.js

@@ -17,4 +17,10 @@ module.exports = prefill({
   12: {price: 2, set: sets.baseHair2},
   13: {price: 2, set: sets.baseHair2},
   14: {price: 2, set: sets.baseHair2},
+  15: {price: 2, set: sets.baseHair3},
+  16: {price: 2, set: sets.baseHair3},
+  17: {price: 2, set: sets.baseHair3},
+  18: {price: 2, set: sets.baseHair3},
+  19: {price: 2, set: sets.baseHair3},
+  20: {price: 2, set: sets.baseHair3},
 });

website/common/script/content/appearance/hair/index.js

@@ -4,7 +4,6 @@ import beard from './beard.js';
 import color from './color.js';
 import flower from './flower.js';
 import mustache from './mustache.js';
-import topHair from './top-hair.js';
 
 module.exports = {
   color,
@@ -13,5 +12,4 @@ module.exports = {
   flower,
   beard,
   mustache,
-  topHair,
 };

website/common/script/content/appearance/sets.js

@@ -4,7 +4,7 @@ import prefill from './prefill.js';
 module.exports = prefill({
   baseHair1: {setPrice: 5, text: t('hairSet1')},
   baseHair2: {setPrice: 5, text: t('hairSet2')},
-  topHair: {setPrice: 5, text: t('hairSet3')},
+  baseHair3: {setPrice: 5, text: t('hairSet3')},
   facialHair: {setPrice: 5, text: t('bodyFacialHair')},
   specialShirts: {setPrice: 5, text: t('specialShirts')},
   winterHairColors: {setPrice: 5, availableUntil: '2016-01-01'},

website/common/script/ops/unlock.js

@@ -52,10 +52,6 @@ module.exports = function unlock (user, req = {}, analytics) {
     } */
   } else {
     alreadyOwns = _.get(user, `purchased.${path}`) === true;
-
-    if (!alreadyOwns && path.indexOf('hair.base') !== -1) {
-      alreadyOwns = _.includes(['0', '1', '3'], path.split('.').pop());
-    }
   }
 
   if ((!user.balance || user.balance < cost) && !alreadyOwns) {
@@ -83,12 +79,6 @@ module.exports = function unlock (user, req = {}, analytics) {
 
       // Using Object so path[1] won't create an array but an object {path: {1: value}}
       setWith(user, `preferences.${key}`, value, Object);
-      if (path.indexOf('hair.base') !== -1) {
-        _.set(user, 'preferences.hair.topHair', 0);
-      }
-      if (path.indexOf('hair.topHair') !== -1) {
-        _.set(user, 'preferences.hair.base', 0);
-      }
     } else {
       // Using Object so path[1] won't create an array but an object {path: {1: value}}
       setWith(user, `purchased.${path}`, true, Object);

website/server/models/user/schema.js

@@ -395,7 +395,6 @@ let schema = new Schema({
       beard: {type: Number, default: 0},
       mustache: {type: Number, default: 0},
       flower: {type: Number, default: 1},
-      topHair: {type: Number, default: 0},
     },
     hideHeader: {type: Boolean, default: false},
     skin: {type: String, default: '915533'},

website/views/options/profile.jade

@@ -114,9 +114,9 @@ mixin customizeProfile(mobile)
 
             // Base hairstyles (free)
             menu(label=env.t('hairBase'))
-              button(class='head_0 customize-option', type='button', ng-click='unlock("hair.base.0")', ng-class='{selectableInventory: user.preferences.hair.base === 0 && user.preferences.hair.topHair === 0}')
+              button(class='head_0 customize-option', type='button', ng-click='set({"preferences.hair.base":0})', ng-class='{selectableInventory: user.preferences.hair.base == 0}')
               each num in [1,3]
-                button(class='hair_base_#{num}_{{user.preferences.hair.color}} customize-option', type='button', ng-click='unlock("hair.base.#{num}")', ng-class='{selectableInventory: user.preferences.hair.base == "#{num}"}')
+                button(class='hair_base_#{num}_{{user.preferences.hair.color}} customize-option', type='button', ng-click='set({"preferences.hair.base":#{num}})', ng-class='{selectableInventory: user.preferences.hair.base == "#{num}"}')
 
             // Purchasable hairstyles
             menu(label=env.t('hairSet1'))
@@ -134,12 +134,12 @@ mixin customizeProfile(mobile)
               each num in styles
                 button(class='hair_base_#{num}_{{user.preferences.hair.color}} customize-option', type='button', ng-class='{locked: !user.purchased.hair.base["#{num}"], selectableInventory: user.preferences.hair.base == "#{num}"}', ng-click='unlock("hair.base.#{num}")')
             menu(label=env.t('hairSet3'))
-              - var styles = [1,2,3,4,5,6]
-              span(ng-hide='#{showPath("user.purchased.hair.topHair", styles, "&&")}')
+              - var styles = [15,16,17,18,19,20]
+              span(ng-hide='#{showPath("user.purchased.hair.base", styles, "&&")}')
                 +gemCost(2)
-                  button.btn.btn-xs(ng-click='#{unlockPath("hair.topHair", styles)}')!= env.t('unlockSet', {cost: 5}) + ' <span class="Pet_Currency_Gem1x inline-gems"/>'
+                  button.btn.btn-xs(ng-click='#{unlockPath("hair.base", styles)}')!= env.t('unlockSet', {cost: 5}) + ' <span class="Pet_Currency_Gem1x inline-gems"/>'
               each num in styles
-                button(class='hair_topHair_#{num}_{{user.preferences.hair.color}} customize-option', type='button', ng-class='{locked: !user.purchased.hair.topHair["#{num}"], selectableInventory: user.preferences.hair.topHair == "#{num}"}', ng-click='unlock("hair.topHair.#{num}")')
+                button(class='hair_base_#{num}_{{user.preferences.hair.color}} customize-option', type='button', ng-class='{locked: !user.purchased.hair.base["#{num}"], selectableInventory: user.preferences.hair.base == "#{num}"}', ng-click='unlock("hair.base.#{num}")')
 
           li.customize-menu
             menu(label=env.t('bodyFacialHair'))

website/views/shared/avatar/generated_avatar.jade

@@ -19,7 +19,7 @@ mixin generatedAvatar(options)
   +costumeSetting('back', {suffix: " + '_collar'"})
   +costumeSetting('body')
   span.head_0
-  - var hairTypes = ['base', 'bangs', 'topHair', 'mustache', 'beard']
+  - var hairTypes = ['bangs', 'base', 'mustache', 'beard']
   each type in hairTypes
     span(class='hair_#{type}_{{profile.preferences.hair.#{type}}}_{{profile.preferences.hair.color}}')
   +costumeSetting('eyewear')