Redesign Implementation Todos

[paglias]

This is an internal issue used to keep track of what's needed for the redesign.

General

Performances

• [ ] Load only the locales needed: in particular do not load static pages' strings in the app and vicevers
• [ ] get rid of spritesheets
• [ ] split vendors.js and the css into different chunks too

Grid

• [x] Change gutters to match Zeplin's (24px vs 30px in Bootstrap by default)

  Popovers

• [ ] Popovers do not disappear immediately when the underlying item is removed (see bootstrap-vue/bootstrap-vue#283)

Dropdown

• [ ] First element is selected by default (see https://github.com/bootstrap-vue/bootstrap-vue/issues/new)

Icons

• [x] Icons:
  • [x] create stylesheet or way to load them, not final implementation but something quick that works
  • [ ] Icons in search input should change background color according to state (see zeplin)
  • [x] how not to duplicate code (radio buttons use same icon but different background - when used as background-image)
  • [x] Useful links https://css-tricks.com/svg-symbol-good-choice-icons/ and https://css-tricks.com/responsive-images-youre-just-changing-resolutions-use-srcset/

HTTP

• [ ] Extract API URL to a constant

Common Ops

• [ ] Handle errors
• [ ] How to deal with Object.assign (see https://github.com/HabitRPG/habitica/blob/0af1203832a64f2b3c3bcf0a8d7829fbfd841629/website/common/script/ops/equip.js#L49-L53)

Sidebar

• [ ] If there's not enough content in the page the sidebar does not have 100% height and the result is odd (see https://cloud.githubusercontent.com/assets/589911/26213966/10a56420-3bfb-11e7-8044-60599cecab05.png) )

  Other

• [ ] Issue with UglifyJS when building for production (switch to babili, because uglify does not support all ES6+ syntax)
• [ ] Go through all TODOs comments
• [ ] Adjusting the page padding forces a layout reflow and takes something like 50ms https://github.com/HabitRPG/habitica/blob/0af1203832a64f2b3c3bcf0a8d7829fbfd841629/website/client/components/inventory/drawer.vue#L147

Components

Loading indicators

• [ ] Party members in the header
• [ ] individual guilds

Equipment

• [ ] Sort by effective stats (see old client for how it's implemented: main problem is that items are immutable so adding extra props isn't easy)
• [ ] Drag and Drop
• [ ] Use proper icon for items' badge not unicode character
• [ ] Redo the "equip an item" experience moving away from the badge (needs designs)

Inventory Items

• [ ] Quests
• [ ] Remaining special Items
• [ ] Quests
• [x] Sorting options: quantity and A-Z
  • [ ] A-Z sorting slow due to extra call to .text()? Cache!
• [ ] On click actions
• [ ] Hatching flow

Main Menu

• [x] Update icons (gems, gold, user, notifications)
• [x] Hover effect for user dropdown
• [x] Adapt to version with no small avatar
• [x] Notifications dropdown (needs design)
• [x] Add inbox route back
• [x] Sync button

Header

• [ ] Sticky option
• [x] Update colors for EXP and MP bars
• [x] Avatars for party members
  • [x] When there's only you in the party show the text like there's no party at all or a different one?
  • [x] Battle monsters with friends buttons should open the party creation / invitation page
• [x] Start a party text when not in a party
• [x] Open member modal on click
• [x] Clicking View party should open the members modal
• [x] Character flyout on hover
• [x] No scrolling (view party button if too many members)
• [ ] Mystic hourglasses

Guilds

• [x] Challenges
• [x] Party
• [x] Tavern
• [x] Members
  • [x] Public fields for non party
  • [x] Invite Modal
• [x] Chat
• [x] Guild Fields
  • [x] Recommend reason
  • [x] Images
  • [x] categories
• [x] Guild size filters
• [x] Guild category filters
• [x] Sorting

Challenges

• [x] Get my challenges route/option
• [x] Add task counts
• [ ] tasks when they are done

Tavern

• [x] Add sleep when we implement user calls
• [x] A new image header when designers are done

User

• [x] Customize Avatar
• [x] Backgrounds
• [x] Stats
• [x] Achievements
• [x] Profile
• [x] Inbox
  • [x] Add user color component for conversations (should be a shared component or mixin)

Social

• [x] Hall of Heroes

Data

• [x] Data display tool (moved to settings)
• [x] Export Data (moved to settings)

Help

• [x] FAQ
• [x] Over for New Users
• [x] Report a Bug
• [x] Ask a Question
• [x] Request a Feature
• [x] Contribute To Habitica
• [x] Wiki

Settings

• [x] Logout
• [x] Site
• [x] Api
• [x] Promo Code
• [x] Subscriptions
• [x] Notifications

Misc

• Notification Menu
• Sounds
• Achievements
• Bailey
• [x] Meta Tags/Social/Etc

Register/Login

• Onboarding
  • [ ] SVG strokes
  • [x] Randomize button
  • [ ] Fix options padding when we remove spritesheets
  • [x] Check eyewear after costume is added

[khipkin]

https://help.github.com/articles/tracking-the-progress-of-your-work-with-projects/

[paglias]

@khipkin I think that for everyone's sanity it's better if I don't create a separate issue for each item in the list. It'll just create a lot of noise in the repo for things that we won't be able to fix for some time