diff --git a/website/client/src/components/avatarModal/customize-options.vue b/website/client/src/components/avatarModal/customize-options.vue index af21a25521..e9a5f6dd90 100644 --- a/website/client/src/components/avatarModal/customize-options.vue +++ b/website/client/src/components/avatarModal/customize-options.vue @@ -6,6 +6,7 @@
+ + {{ option.text }} +
import appearance from '@/../../common/script/content/appearance'; +import upperFirst from 'lodash/upperFirst'; import { subPageMixin } from '../../mixins/subPage'; import { userStateMixin } from '../../mixins/userState'; import { avatarEditorUtilities } from '../../mixins/avatarEditUtilities'; @@ -82,9 +83,6 @@ import customizeBanner from './customize-banner'; import customizeOptions from './customize-options'; import subMenu from './sub-menu'; -const freeShirtKeys = Object.keys(appearance.shirt).filter(k => appearance.shirt[k].price === 0); -const specialShirtKeys = Object.keys(appearance.shirt).filter(k => appearance.shirt[k].price !== 0); - export default { components: { customizeBanner, @@ -106,17 +104,6 @@ export default { headAccessory: ['bearEars', 'cactusEars', 'foxEars', 'lionEars', 'pandaEars', 'pigEars', 'tigerEars', 'wolfEars'], }, chairKeys: ['none', 'black', 'blue', 'green', 'pink', 'red', 'yellow', 'handleless_black', 'handleless_blue', 'handleless_green', 'handleless_pink', 'handleless_red', 'handleless_yellow'], - specialShirtKeys, - items: [ - { - id: 'size', - label: this.$t('size'), - }, - { - id: 'shirt', - label: this.$t('shirt'), - }, - ], }; }, computed: { @@ -167,6 +154,7 @@ export default { ]; const noneOption = this.createGearItem(0, 'eyewear', 'base'); noneOption.none = true; + noneOption.text = this.$t('none'); const options = [ noneOption, ]; @@ -184,24 +172,17 @@ export default { return this.equip(newKey, type); }; + option.text = this.$t(`eyewearSpecial${upperFirst(key)}Text`); options.push(option); } return options; }, - freeShirts () { - return freeShirtKeys.map(s => this.mapKeysToFreeOption(s, 'shirt')); - }, - specialShirts () { - let backgroundUpdate = this.backgroundUpdate; // eslint-disable-line - const keys = this.specialShirtKeys; - const options = keys.map(key => this.mapKeysToOption(key, 'shirt')); - return options; - }, headbands () { const keys = ['blackHeadband', 'blueHeadband', 'greenHeadband', 'pinkHeadband', 'redHeadband', 'whiteHeadband', 'yellowHeadband']; const noneOption = this.createGearItem(0, 'headAccessory', 'base', 'headband'); noneOption.none = true; + noneOption.text = this.$t('none'); const options = [ noneOption, ]; @@ -213,7 +194,7 @@ export default { const type = this.user.preferences.costume ? 'costume' : 'equipped'; return this.equip(newKey, type); }; - + option.text = this.$t(`headAccessory${upperFirst(key)}Text`); options.push(option); } @@ -229,6 +210,7 @@ export default { option.active = this.user.preferences.chair === key; option.class = `button_chair_${key} chair ${key.includes('handleless_') ? 'handleless' : ''}`; option.click = () => this.set({ 'preferences.chair': key }); + option.text = appearance.chair[key].text(); return option; }); return options; @@ -244,6 +226,7 @@ export default { option.active = this.user.preferences.hair.flower === key; option.class = `icon_hair_flower_${key} flower`; option.click = () => this.set({ 'preferences.hair.flower': key }); + option.text = appearance.hair.flower[key].text(); return option; }); return options; @@ -271,6 +254,7 @@ export default { const noneOption = this.createGearItem(0, category, 'base', category); noneOption.none = true; + noneOption.text = this.$t('none'); const options = [ noneOption, ]; @@ -284,9 +268,13 @@ export default { option.active = this.user.preferences.costume ? this.user.items.gear.costume[category] === newKey : this.user.items.gear.equipped[category] === newKey; - option.class = `headAccessory_special_${option.key} ${category}`; + if (category === 'back') { + option.text = this.$t(`back${upperFirst(key)}Text`); option.class = `icon_back_special_${option.key} back`; + } else { + option.text = this.$t(`headAccessory${upperFirst(key)}Text`); + option.class = `headAccessory_special_${option.key} ${category}`; } option.click = () => { const type = this.user.preferences.costume ? 'costume' : 'equipped'; diff --git a/website/client/src/mixins/avatarEditUtilities.js b/website/client/src/mixins/avatarEditUtilities.js index 00539be959..f8214a91f7 100644 --- a/website/client/src/mixins/avatarEditUtilities.js +++ b/website/client/src/mixins/avatarEditUtilities.js @@ -5,6 +5,7 @@ import unlock from '@/../../common/script/ops/unlock'; import buy from '@/../../common/script/ops/buy/buy'; import appearanceSets from '@/../../common/script/content/appearance/sets'; +import appearances from '@/../../common/script/content/appearance'; import { getScheduleMatchingGroup } from '@/../../common/script/content/constants/schedule'; import { userStateMixin } from './userState'; @@ -33,6 +34,9 @@ export const avatarEditorUtilities = { // eslint-disable-line import/prefer-defa option.active = userPreference === key; option.class = this.createClass(type, subType, key); option.click = optionParam => (option.gemLocked ? this.unlock(`${optionParam.pathKey}.${key}`) : this.set({ [`preferences.${optionParam.pathKey}`]: optionParam.key })); + option.text = subType ? appearances[type][subType][key].text() + : appearances[type][key].text(); + return option; }, mapKeysToOption (key, type, subType, set) { diff --git a/website/common/locales/en/customizations.json b/website/common/locales/en/customizations.json index 74ab6c527d..77709c8dbc 100644 --- a/website/common/locales/en/customizations.json +++ b/website/common/locales/en/customizations.json @@ -3,25 +3,35 @@ "2b43f6": "Blue", "6bd049": "Green", "800ed0": "Purple", - "98461a": "Skin Tone 6", "915533": "Skin Tone 1", + "98461a": "Skin Tone 6", + "allCustomizationsOwned": "You own all of these items. You can try them on by customizing your avatar.", + "allEquipmentOwned": "You own all of these items. You can find them in your Equipment. Be sure to check back later for next month's options!", "aurora": "Aurora", "bear": "Bear", "black": "Black", "blond": "Blond", "blue": "Blue", + "blueEarrings": "Blue Earrings", + "blueFlower": "Blue Flower", + "blunt": "Blunt", "braid": "Braid", + "broad": "Broad", "brown": "Brown", "c06534": "Skin Tone 5", "c3e1dc": "Cyan", "cactus": "Cactus", "candycane": "Candy Cane", "candycorn": "Candy Corn", + "checkNextMonth": "Be sure to check back later for next month's options!", + "checkNextSeason": "Be sure to check back later for next season's options!", "clownfish": "Clownfish", "convict": "Referee", "cross": "Cross", + "curly": "Curly", "curlyLong": "Curly Long", "curlyShort": "Curly Short", + "customizationsNPC": "Felicitus Fennec", "d7a9f7": "Lavender", "dapper": "Dapper", "ddc994": "Skin Tone 2", @@ -43,18 +53,31 @@ "ghost": "Ghost", "ghostwhite": "Ghost White", "goatee": "Goatee", + "goldEarringLeft": "Gold Earring Left", + "goldEarringRight": "Gold Earring Right", + "goldEarrings": "Gold Earrings", "green": "Green", + "greenEarrings": "Green Earrings", + "greenFlower": "Green Flower", "halloween": "Halloween", + "handleless_black": "Black Handleless", + "handleless_blue": "Blue Handleless", + "handleless_green": "Green Handleless", + "handleless_pink": "Pink Handleless", + "handleless_red": "Red Handleless", + "handleless_yellow": "Yellow Handleless", "highPonytailLeft": "High Ponytail Left", "highPonytailRight": "High Ponytail Right", "holly": "Holly", "hollygreen": "Holly Green", + "hoopEarrings": "Hoop Earrings", "horizon": "Horizon", "largeMustache": "Large Mustache", "lava": "Lava", "leftBun": "Left Bun", "lion": "Lion", "longBeard": "Long Beard", + "lookingForMore": "Looking for more?", "merblue": "Merblue", "mergold": "Mergold", "mergreen": "Mergreen", @@ -63,8 +86,10 @@ "midnight": "Midnight", "mohawk": "Mohawk", "monster": "Monster", + "noItemsOwned": "You don't own any of these items", "ocean": "Ocean", "ogre": "Ogre", + "orangeFlower": "Orange Flower", "orchid": "Orchid", "panda": "Panda", "pastelBlue": "Pastel Blue", @@ -81,6 +106,9 @@ "pgreen": "Special Pastel Green", "pgreen2": "Pastel Green", "pig": "Pig", + "pink": "Pink", + "pinkEarrings": "Pink Earrings", + "pinkFlower": "Pink Flower", "polar": "Polar", "ponytail": "Ponytail", "porange": "Special Pastel Orange", @@ -92,11 +120,14 @@ "pumpkin": "Pumpkin", "pumpkin2": "Jack O' Lantern", "purple": "Purple", + "purpleEarrings": "Purple Earrings", + "purpleFlower": "Purple Flower", "pyellow": "Special Pastel Yellow", "pyellow2": "Pastel Yellow", "rainbow": "Rainbow", "red": "Red", "redblue": "Red and Blue", + "redEarrings": "Red Earrings", "reptile": "Reptile", "rightBun": "Right Bun", "sandnsea": "Sand 'n' Sea", @@ -105,8 +136,10 @@ "shadow2": "Shade", "shark": "Shark", "shortBeard": "Short Beard", + "sideswept": "Sideswept", "skeleton": "Skeleton", "skeleton2": "Bones", + "slim": "Slim", "smallMustache": "Small Mustache", "snowy": "Snowy", "straightLong": "Straight Long", @@ -121,21 +154,17 @@ "tropicalwater": "Tropical Water", "TRUred": "Crimson", "updo": "Updo", + "visitCustomizationsShop": "Head over to the Customizations Shop to browse the many ways you can customize your avatar!", "wavyLong": "Wavy Long", "wavyShort": "Wavy Short", "white": "White", + "whiteEarrings": "White Earrings", "winternight": "Winter Night", "winterstar": "Winter Star", + "wispy": "Wispy", "wolf": "Wolf", "yellow": "Yellow", + "yellowFlower": "Yellow Flower", "zombie": "Zombie", - "zombie2": "Undead", - "allCustomizationsOwned": "You own all of these items. You can try them on by customizing your avatar.", - "checkNextMonth": "Be sure to check back later for next month's options!", - "checkNextSeason": "Be sure to check back later for next season's options!", - "noItemsOwned": "You don't own any of these items", - "visitCustomizationsShop": "Head over to the Customizations Shop to browse the many ways you can customize your avatar!", - "lookingForMore": "Looking for more?", - "allEquipmentOwned": "You own all of these items. You can find them in your Equipment. Be sure to check back later for next month's options!", - "customizationsNPC": "Felicitus Fennec" + "zombie2": "Undead" } \ No newline at end of file diff --git a/website/common/script/content/appearance/hair/bangs.js b/website/common/script/content/appearance/hair/bangs.js index a112be50f3..41a1f013ba 100644 --- a/website/common/script/content/appearance/hair/bangs.js +++ b/website/common/script/content/appearance/hair/bangs.js @@ -1,9 +1,10 @@ import prefill from '../prefill'; +import t from '../../translation'; export default prefill({ - 0: {}, - 1: {}, - 2: {}, - 3: {}, - 4: {}, + 0: { text: t('none') }, + 1: { text: t('sideswept') }, + 2: { text: t('blunt') }, + 3: { text: t('wispy') }, + 4: { text: t('curly') }, }); diff --git a/website/common/script/content/appearance/hair/base.js b/website/common/script/content/appearance/hair/base.js index 13e76b2be2..4425f20dca 100644 --- a/website/common/script/content/appearance/hair/base.js +++ b/website/common/script/content/appearance/hair/base.js @@ -3,7 +3,7 @@ import sets from '../sets'; import t from '../../translation'; export default prefill({ - 0: {}, + 0: { text: t('none') }, 1: { text: t('ponytail') }, 2: { text: t('doublePonytail'), price: 2, set: sets.baseHair1 }, 3: { text: t('braid') }, diff --git a/website/common/script/content/appearance/hair/beard.js b/website/common/script/content/appearance/hair/beard.js index 845f05cd0d..2a9fd24649 100644 --- a/website/common/script/content/appearance/hair/beard.js +++ b/website/common/script/content/appearance/hair/beard.js @@ -3,7 +3,7 @@ import sets from '../sets'; import t from '../../translation'; export default prefill({ - 0: {}, + 0: { text: t('none') }, 1: { text: t('goatee'), price: 2, set: sets.facialHair }, 2: { text: t('shortBeard'), price: 2, set: sets.facialHair }, 3: { text: t('longBeard'), price: 2, set: sets.facialHair }, diff --git a/website/common/script/content/appearance/hair/flower.js b/website/common/script/content/appearance/hair/flower.js index 5f9048f2ed..486b83d17a 100644 --- a/website/common/script/content/appearance/hair/flower.js +++ b/website/common/script/content/appearance/hair/flower.js @@ -1,21 +1,22 @@ import prefill from '../prefill'; +import t from '../../translation'; export default prefill({ - 0: {}, - 1: {}, - 2: {}, - 3: {}, - 4: {}, - 5: {}, - 6: {}, - 7: {}, - 8: {}, - 9: {}, - 10: {}, - 11: {}, - 12: {}, - 13: {}, - 14: {}, - 15: {}, - 16: {}, + 0: { text: t('none') }, + 1: { text: t('blueFlower') }, + 2: { text: t('greenFlower') }, + 3: { text: t('pinkFlower') }, + 4: { text: t('purpleFlower') }, + 5: { text: t('orangeFlower') }, + 6: { text: t('yellowFlower') }, + 7: { text: t('hoopEarrings') }, + 8: { text: t('goldEarringLeft') }, + 9: { text: t('goldEarringRight') }, + 10: { text: t('goldEarrings') }, + 11: { text: t('whiteEarrings') }, + 12: { text: t('blueEarrings') }, + 13: { text: t('greenEarrings') }, + 14: { text: t('redEarrings') }, + 15: { text: t('pinkEarrings') }, + 16: { text: t('purpleEarrings') }, }); diff --git a/website/common/script/content/appearance/hair/mustache.js b/website/common/script/content/appearance/hair/mustache.js index 78c2c6c5a2..856fcd9dff 100644 --- a/website/common/script/content/appearance/hair/mustache.js +++ b/website/common/script/content/appearance/hair/mustache.js @@ -3,7 +3,7 @@ import sets from '../sets'; import t from '../../translation'; export default prefill({ - 0: {}, + 0: { text: t('none') }, 1: { text: t('smallMustache'), price: 2, set: sets.facialHair }, 2: { text: t('largeMustache'), price: 2, set: sets.facialHair }, });