mirror of
https://github.com/sudoxnym/habitica-self-host.git
synced 2026-08-03 04:29:40 +00:00
Redesign toolbar navigation and fix notification logic
This commit is contained in:
benmanley
parent
e343e70d8a
commit
0863215102
4 changed files with 269 additions and 302 deletions
|
|
@ -2,7 +2,7 @@
|
|||
-------------------- */
|
||||
.header-wrap
|
||||
width: 100% // this is for the sticky
|
||||
padding: 54px 0 0 0 // add padding-top when navbar is fixed
|
||||
padding: 50px 0 0 0 // add padding-top when navbar is fixed
|
||||
@media screen and (max-width:768px) // remove padding-top when navbar is static
|
||||
padding: 0
|
||||
z-index: 100
|
||||
|
|
|
|||
|
|
@ -1,148 +1,106 @@
|
|||
// Custom styles for the menu aka toolbar aka navbar
|
||||
.navbar
|
||||
.toolbar
|
||||
width:100%;
|
||||
top:0
|
||||
left:0
|
||||
z-index:998
|
||||
color: #222
|
||||
background-color: #f5f5f5
|
||||
border: none;
|
||||
border-bottom: 1px solid rgba(0,0,0,0.2)
|
||||
border-radius:0px
|
||||
margin-bottom:0px
|
||||
min-height:52px
|
||||
> div
|
||||
padding-left:8px
|
||||
.glyphicon
|
||||
color:#5d5d5d
|
||||
.caret
|
||||
color:#9d9d9d
|
||||
.gem-wallet
|
||||
padding-top:4px
|
||||
padding-bottom:8px
|
||||
height:52px
|
||||
.Pet_Currency_Gem2x.Gems
|
||||
position:relative
|
||||
top:8px
|
||||
.currency
|
||||
min-height:52px
|
||||
padding-top:16px
|
||||
padding-right:16px
|
||||
background-color: lighten($color-herobox, 60%)
|
||||
border-bottom: 1px solid darken($color-herobox, 12%)
|
||||
> ul > li
|
||||
display: inline-block
|
||||
// Mobile menu button
|
||||
.navbar-header
|
||||
position:absolute
|
||||
top:0
|
||||
right:45px
|
||||
button
|
||||
margin-right:0
|
||||
// Top level menu items: Tasks – Options
|
||||
.navbar-menu
|
||||
.toolbar-mobile-nav
|
||||
float:left
|
||||
@media screen and (min-width:768px)
|
||||
display: none
|
||||
.toolbar-mobile
|
||||
@extend $hrpg-button
|
||||
@extend $hrpg-modal-dropdown-right
|
||||
// Top level menu items: Tasks – User – Social – Inventory
|
||||
.toolbar-nav
|
||||
float:left;
|
||||
li
|
||||
display:inline-block
|
||||
height:52px
|
||||
a
|
||||
display:block
|
||||
padding: 10px
|
||||
@media screen and (max-width:768px)
|
||||
display: none
|
||||
> li
|
||||
//border-right: 1px solid #ccc
|
||||
margin-right: 10px
|
||||
.toolbar-button-dropdown
|
||||
@extend $hrpg-button-toggle
|
||||
@extend $hrpg-modal-dropdown-right
|
||||
.toolbar-button
|
||||
@extend $hrpg-button
|
||||
> a
|
||||
display:inline-block
|
||||
height:100%
|
||||
margin-left:8px
|
||||
padding-top:16px
|
||||
padding-left:8px
|
||||
padding-right:8px
|
||||
font-size:16px
|
||||
line-height:1
|
||||
text-decoration:none
|
||||
&:link,&:visited
|
||||
color: #222
|
||||
&:hover
|
||||
background-color:#eee
|
||||
background-color: #eee
|
||||
&:active
|
||||
color:#000
|
||||
.toolbar-toggle
|
||||
margin-left:0px
|
||||
padding-left:4px
|
||||
padding-right:4px
|
||||
font-size:12px
|
||||
.glyphicon
|
||||
color:#9d9d9d
|
||||
.glyphicon-chevron-down
|
||||
position:relative
|
||||
top:2px
|
||||
transition: all 0.26s linear
|
||||
.glyphicon-chevron-down.active
|
||||
top:0px
|
||||
transform: rotate(180deg)
|
||||
// Information bar: Bailey – notifs – currency – subscribe button
|
||||
.navbar-info
|
||||
float:right
|
||||
min-height:52px
|
||||
// padding-right:25px
|
||||
li
|
||||
display:inline-block
|
||||
button
|
||||
margin-top: 8px
|
||||
margin-bottom: 8px
|
||||
@media screen and (max-width:768px)
|
||||
.navbar-menu
|
||||
float:none
|
||||
.navbar-info
|
||||
width:100%
|
||||
.toolbar-sync
|
||||
margin-left:4px
|
||||
a
|
||||
padding:8px !important
|
||||
// Navigation submenu
|
||||
@media screen and (max-width:768px)
|
||||
padding: 10px 8px
|
||||
.toolbar-submenu
|
||||
background-color:#eee
|
||||
border-top: 1px solid rgba(0,0,0,0.2)
|
||||
> li
|
||||
ul
|
||||
padding-left: 0px !important
|
||||
li
|
||||
margin-right: 16px
|
||||
display:inline-block
|
||||
vertical-align:top
|
||||
margin-top:16px
|
||||
margin-left:16px
|
||||
margin-bottom:8px
|
||||
line-height:1.618
|
||||
ul
|
||||
list-style:none
|
||||
li
|
||||
padding-left:22px
|
||||
.glyphicon
|
||||
margin-right:8px
|
||||
color:#9d9d9d
|
||||
@media screen and (min-width:768px)
|
||||
.navbar
|
||||
position:fixed
|
||||
color:#ccc
|
||||
// Information bar: Bailey – notifs – currency – subscribe button
|
||||
.toolbar-bailey, .toolbar-wallet, .toolbar-options
|
||||
float:right
|
||||
padding: 10px 10px 10px 0
|
||||
.toolbar-wallet
|
||||
.gem-wallet
|
||||
margin-left:8px
|
||||
.Gems
|
||||
margin-top: 3px
|
||||
span
|
||||
display:inline-block
|
||||
vertical-align:top
|
||||
padding-top:5px
|
||||
.toolbar-currency
|
||||
margin-left:16px
|
||||
padding: 5px 8px !important
|
||||
margin:0px
|
||||
vertical-align:top
|
||||
@media screen and (max-width:768px)
|
||||
.navbar-info.inactive
|
||||
display:none;
|
||||
|
||||
.toolbar
|
||||
> ul
|
||||
float: none
|
||||
margin: 0px 4px 4px 4px
|
||||
.toolbar-bailey
|
||||
float:right
|
||||
.toolbar-options
|
||||
> li
|
||||
margin-left: 8px
|
||||
.toolbar-sync, .toolbar-settings
|
||||
@extend $hrpg-button
|
||||
.toolbar-subscribe
|
||||
@extend $hrpg-button-call-to-action
|
||||
@media screen and (min-width:768px)
|
||||
.toolbar
|
||||
position:fixed
|
||||
// Notifications icon and dropdown
|
||||
.toolbar-notifs
|
||||
position: relative
|
||||
z-index:11000
|
||||
@extend $hrpg-button
|
||||
@extend $hrpg-modal-dropdown-left-heading
|
||||
> a span.inactive
|
||||
opacity: 0.236 !important
|
||||
div
|
||||
position: absolute
|
||||
top: 54px
|
||||
left:-128px
|
||||
width:300px
|
||||
border:1px solid #b5b5b5
|
||||
border-radius:4px
|
||||
background-color:#fff
|
||||
h4
|
||||
font-size: 16px
|
||||
margin:0px
|
||||
border-radius:4px 4px 0px 0px
|
||||
background-color: #f7f7f7
|
||||
border-bottom:1px solid #ccc
|
||||
h4, ul
|
||||
padding: 10px 16px
|
||||
@media screen and (max-width:768px)
|
||||
width:96%
|
||||
.toolbar-notifs-notifs
|
||||
padding-bottom:16px
|
||||
max-height: 63vh
|
||||
overflow: auto
|
||||
max-height: 63%
|
||||
li
|
||||
display: block
|
||||
position: relative
|
||||
margin-bottom:10px
|
||||
.glyphicon
|
||||
margin-right: 10px
|
||||
height: 100%
|
||||
|
|
@ -157,54 +115,14 @@
|
|||
margin-right: 0px
|
||||
color:#9d9d9d
|
||||
&:after
|
||||
content:''
|
||||
position:absolute
|
||||
top:-9px
|
||||
left:142px
|
||||
z-index:2
|
||||
width:16px
|
||||
height:16px
|
||||
border-top:1px solid #b5b5b5
|
||||
border-left:1px solid #b5b5b5
|
||||
background-color: #f7f7f7
|
||||
transform: rotate(45deg)
|
||||
|
||||
.toolbar-notifs-controls
|
||||
text-align: right
|
||||
border-top:1px solid #ccc
|
||||
border-radius:0px 0px 4px 4px
|
||||
background-color: #fff
|
||||
right:26px
|
||||
// Settings dropdown
|
||||
.toolbar-settings
|
||||
@extend $hrpg-modal-dropdown-left-heading
|
||||
.toolbar-controls
|
||||
@extend $hrpg-modal-controls
|
||||
li
|
||||
margin-left: 10px
|
||||
a
|
||||
display: block
|
||||
padding: 2px 4px
|
||||
border: 1px solid #ccc
|
||||
border-radius: 4px
|
||||
text-decoration:none
|
||||
color:#222
|
||||
a:active
|
||||
background-color: #eee
|
||||
@media screen and (min-width:768px)
|
||||
a:hover
|
||||
background-color: #f5f5f5
|
||||
|
||||
@media screen and (max-width:768px)
|
||||
.toolbar-notifs
|
||||
div
|
||||
position:fixed
|
||||
overflow: auto
|
||||
z-index: 2000
|
||||
top: 2vh
|
||||
left: 2vw
|
||||
width: 96vw
|
||||
height: 96vh
|
||||
box-shadow:
|
||||
0 0 0 30px rgba(0,0,0,0.63)
|
||||
&:after
|
||||
display: none
|
||||
.toolbar-notifs-controls
|
||||
width: 100%
|
||||
position: absolute
|
||||
bottom:0
|
||||
right:0
|
||||
@extend $hrpg-button
|
||||
.toolbar-settings .toolbar-controls
|
||||
@media screen and (min-width:768px)
|
||||
display:none
|
||||
|
|
@ -6,13 +6,13 @@
|
|||
|
||||
.toolbar-bailey-container
|
||||
width:55px
|
||||
margin-right:8px
|
||||
margin-right:16px
|
||||
position:relative
|
||||
.npc_bailey
|
||||
float:left
|
||||
.npc_bailey_head
|
||||
position: absolute
|
||||
top: -24px
|
||||
top: -18px
|
||||
height:45px !important
|
||||
cursor: pointer
|
||||
|
||||
|
|
|
|||
|
|
@ -1,134 +1,183 @@
|
|||
nav.navbar(ng-controller='AuthCtrl')
|
||||
ul.navbar-menu
|
||||
li
|
||||
nav.toolbar(ng-controller='AuthCtrl')
|
||||
ul.toolbar-mobile-nav
|
||||
li.toolbar-mobile
|
||||
a(ng-click='user.preferences.mobileMenuExpanded = !user.preferences.mobileMenuExpanded', ng-class='{active: user.preferences.mobileMenuExpanded}')
|
||||
span ☰
|
||||
div(ng-if='user.preferences.mobileMenuExpanded')
|
||||
h4
|
||||
span=env.t('options')
|
||||
ul.toolbar-submenu
|
||||
li
|
||||
span.glyphicon.glyphicon-check
|
||||
span=env.t('tasks')
|
||||
ul
|
||||
li
|
||||
a(ui-sref='tasks', ng-click='set({"preferences.menuExpanded":false})')=env.t('tasks')
|
||||
li
|
||||
span.glyphicon.glyphicon-user
|
||||
span=env.t('user')
|
||||
ul
|
||||
li
|
||||
a(ui-sref='options.profile.avatar', ng-click='set({"preferences.menuExpanded":false})')=env.t('avatar')
|
||||
li
|
||||
a(ui-sref='options.profile.stats', ng-click='set({"preferences.menuExpanded":false})')=env.t('stats')
|
||||
li
|
||||
a(ui-sref='options.profile.profile', ng-click='set({"preferences.menuExpanded":false})')=env.t('profile')
|
||||
li
|
||||
span.glyphicon.glyphicon-heart
|
||||
span=env.t('social')
|
||||
ul
|
||||
li
|
||||
a(ui-sref='options.social.tavern', ng-click='set({"preferences.menuExpanded":false})')=env.t('tavern')
|
||||
li
|
||||
a(ui-sref='options.social.party', ng-click='set({"preferences.menuExpanded":false})')=env.t('party')
|
||||
li
|
||||
a(ui-sref='options.social.guilds', ng-click='set({"preferences.menuExpanded":false})')=env.t('guilds')
|
||||
li
|
||||
a(ui-sref='options.social.challenges', ng-click='set({"preferences.menuExpanded":false})')=env.t('challenges')
|
||||
li
|
||||
a(ui-sref='options.social.hall', ng-click='set({"preferences.menuExpanded":false})')=env.t('hall')
|
||||
li
|
||||
span.glyphicon.glyphicon-gift
|
||||
span=env.t('inventory')
|
||||
ul
|
||||
li
|
||||
a(ui-sref='options.inventory.drops', ng-click='set({"preferences.menuExpanded":false})')=env.t('market')
|
||||
li
|
||||
a(ui-sref='options.inventory.pets', ng-click='set({"preferences.menuExpanded":false})')=env.t('pets')
|
||||
li
|
||||
a(ui-sref='options.inventory.mounts', ng-click='set({"preferences.menuExpanded":false})')=env.t('mounts')
|
||||
li
|
||||
a(ui-sref='options.inventory.equipment', ng-click='set({"preferences.menuExpanded":false})')=env.t('equipment')
|
||||
ul.toolbar-controls
|
||||
li
|
||||
a(ng-click='set({"preferences.mobileMenuExpanded":false})')
|
||||
| X
|
||||
ul.toolbar-nav
|
||||
li.toolbar-button
|
||||
a(ui-sref='tasks')
|
||||
span=env.t('tasks')
|
||||
li
|
||||
li.toolbar-button-dropdown
|
||||
a(ui-sref='options.profile.avatar')
|
||||
span=env.t('options')
|
||||
li
|
||||
a.toolbar-toggle(ng-click='user.preferences.menuExpanded = !user.preferences.menuExpanded')
|
||||
span.glyphicon.glyphicon-chevron-down(ng-class='{active: user.preferences.menuExpanded}')
|
||||
.collapse.navbar-collapse(collapse="isNavbarCollapsed")
|
||||
ul.nav.navbar-info(ng-class='{inactive: !user.preferences.menuExpanded}')
|
||||
li.toolbar-bailey-container(ng-if='user.flags.newStuff')
|
||||
.npc_bailey.npc_bailey_head(popover=env.t('psst'), popover-trigger='mouseenter', popover-placement='right', ng-click='openModal("newStuff")')
|
||||
// Invitations
|
||||
//-li(ng-if='user.invitations.party.id')
|
||||
//-a(ui-sref='options.social.party')
|
||||
//-span.glyphicon.glyphicon-user(popover=env.t('invitedTo', {name: '{{user.invitations.party.name}}'}),popover-placement='bottom',popover-trigger='mouseenter',popover-append-to-body='true')
|
||||
//-li(ng-repeat='guild in user.invitations.guilds')
|
||||
//-a(ui-sref='options.social.guilds')
|
||||
//-span.glyphicon.glyphicon-user(popover=env.t('invitedTo', {name: '{{guild.name}}'}),popover-placement='bottom',popover-trigger='mouseenter',popover-append-to-body='true')
|
||||
// Mystery Item
|
||||
li(ng-if='user.purchased.plan.mysteryItems.length')
|
||||
a(ng-click='$state.go("options.inventory.drops")')
|
||||
span.glyphicon.glyphicon-gift(popover=env.t('newSubscriberItem'),popover-placement='bottom',popover-trigger='mouseenter',popover-append-to-body='true')
|
||||
// Notifications
|
||||
li.toolbar-notifs
|
||||
a(ng-click='user.preferences.isNotifsExpanded = !user.preferences.isNotifsExpanded')
|
||||
span.glyphicon.glyphicon-comment
|
||||
div(ng-if='user.preferences.isNotifsExpanded')
|
||||
h4 Notifs
|
||||
ul.toolbar-notifs-notifs
|
||||
li(ng-if='user.invitations.party.id')
|
||||
a(ui-sref='options.social.party', ng-click='user.preferences.isNotifsExpanded = !user.preferences.isNotifsExpanded; user.preferences.menuExpanded = !user.preferences.menuExpanded')
|
||||
span.glyphicon.glyphicon-user
|
||||
span=env.t('invitedTo', {name: '{{user.invitations.party.name}}'})
|
||||
li(ng-repeat='guild in user.invitations.guilds')
|
||||
a(ui-sref='options.social.guilds', ng-click='user.preferences.isNotifsExpanded = !user.preferences.isNotifsExpanded; user.preferences.menuExpanded = !user.preferences.menuExpanded')
|
||||
span.glyphicon.glyphicon-user
|
||||
span=env.t('invitedTo', {name: '{{guild.name}}'})
|
||||
li(ng-repeat='(k,v) in user.newMessages', ng-if='v.value')
|
||||
a(ng-click='k==party._id ? $state.go("options.social.party") : $state.go("options.social.guilds.detail",{gid:k}); user.preferences.isNotifsExpanded = !user.preferences.isNotifsExpanded; user.preferences.menuExpanded = !user.preferences.menuExpanded')
|
||||
span.glyphicon.glyphicon-comment
|
||||
span {{v.name}}
|
||||
a(ng-click='')
|
||||
span.glyphicon.glyphicon-remove-circle(popover=env.t('clear'),popover-placement='right',popover-trigger='mouseenter',popover-append-to-body='true')
|
||||
ul.toolbar-notifs-controls
|
||||
li
|
||||
a(ng-click='') Clear all
|
||||
li
|
||||
a(ng-click='user.preferences.isNotifsExpanded = !user.preferences.isNotifsExpanded')=env.t('close')
|
||||
li
|
||||
a.gem-wallet(ng-click='openModal("buyGems",{track:"Gems > Toolbar"})', popover-trigger='mouseenter', popover-title=env.t('gems'), popover=env.t('gemsWhatFor'), popover-placement='bottom',popover-append-to-body='true')
|
||||
//-span.task-action-btn.tile.flush.bright.add-gems-btn ＋
|
||||
span
|
||||
.Pet_Currency_Gem2x.Gems
|
||||
| {{user.balance * 4 | number:0}}
|
||||
li.currency(popover=env.t('gold'), popover-placement='bottom',popover-trigger='mouseenter')
|
||||
span
|
||||
.shop_gold
|
||||
| {{Shared.gold(user.stats.gp)}}
|
||||
li.currency(popover=env.t('silver'), popover-placement='bottom',popover-trigger='mouseenter')
|
||||
span
|
||||
.shop_silver
|
||||
| {{Shared.silver(user.stats.gp)}}
|
||||
li
|
||||
button.btn.btn-primary(ng-if='!user.purchased.plan.customerId',ui-sref='options.settings.subscription',popover-trigger='mouseenter',popover-placement='bottom',popover-title=env.t('subscriptions'),popover=env.t('subDescription'),popover-append-to-body='true')=env.t('subscribe')
|
||||
button.btn.btn-default(ng-if='user.purchased.plan.customerId',ui-sref='options.settings.subscription',popover-trigger='mouseenter',popover-placement='bottom',popover=env.t('manageSub'),popover-append-to-body='true')=env.t('subscribed')
|
||||
li.toolbar-sync
|
||||
a(ng-click='User.sync()',popover=env.t('sync'),popover-placement='bottom',popover-trigger='mouseenter')
|
||||
span.glyphicon.glyphicon-refresh
|
||||
ul.nav.toolbar-submenu(ng-if='user.preferences.menuExpanded')
|
||||
li
|
||||
span.glyphicon.glyphicon-user
|
||||
span=env.t('user')
|
||||
ul
|
||||
li
|
||||
a(ui-sref='options.profile.avatar', ng-click='set({"preferences.menuExpanded":false})')=env.t('avatar')
|
||||
li
|
||||
a(ui-sref='options.profile.stats', ng-click='set({"preferences.menuExpanded":false})')=env.t('stats')
|
||||
li
|
||||
a(ui-sref='options.profile.profile', ng-click='set({"preferences.menuExpanded":false})')=env.t('profile')
|
||||
li
|
||||
a(ng-click='logout()')
|
||||
span=env.t('logout')
|
||||
li
|
||||
span.glyphicon.glyphicon-heart
|
||||
span=env.t('social')
|
||||
ul
|
||||
li
|
||||
a(ui-sref='options.social.tavern', ng-click='set({"preferences.menuExpanded":false})')=env.t('tavern')
|
||||
li
|
||||
a(ui-sref='options.social.party', ng-click='set({"preferences.menuExpanded":false})')=env.t('party')
|
||||
li
|
||||
a(ui-sref='options.social.guilds', ng-click='set({"preferences.menuExpanded":false})')=env.t('guilds')
|
||||
li
|
||||
a(ui-sref='options.social.challenges', ng-click='set({"preferences.menuExpanded":false})')=env.t('challenges')
|
||||
li
|
||||
a(ui-sref='options.social.hall', ng-click='set({"preferences.menuExpanded":false})')=env.t('hall')
|
||||
li
|
||||
span.glyphicon.glyphicon-gift
|
||||
span=env.t('inventory')
|
||||
ul
|
||||
li
|
||||
a(ui-sref='options.inventory.drops', ng-click='set({"preferences.menuExpanded":false})')=env.t('market')
|
||||
li
|
||||
a(ui-sref='options.inventory.pets', ng-click='set({"preferences.menuExpanded":false})')=env.t('pets')
|
||||
li
|
||||
a(ui-sref='options.inventory.mounts', ng-click='set({"preferences.menuExpanded":false})')=env.t('mounts')
|
||||
li
|
||||
a(ui-sref='options.inventory.equipment', ng-click='set({"preferences.menuExpanded":false})')=env.t('equipment')
|
||||
li
|
||||
span.glyphicon.glyphicon-wrench
|
||||
span=env.t('settings')
|
||||
ul
|
||||
li
|
||||
a(ui-sref='options.settings.settings', ng-click='set({"preferences.menuExpanded":false})')=env.t('site')
|
||||
li
|
||||
a(ui-sref='options.settings.api', ng-click='set({"preferences.menuExpanded":false})')=env.t('API')
|
||||
li
|
||||
a(ui-sref='options.settings.export', ng-click='set({"preferences.menuExpanded":false})')=env.t('export')
|
||||
li
|
||||
a(ui-sref='options.settings.subscription', ng-click='set({"preferences.menuExpanded":false})')=env.t('subscription')
|
||||
li
|
||||
span.glyphicon.glyphicon-question-sign
|
||||
span=env.t('help')
|
||||
ul
|
||||
li
|
||||
a(href="http://habitrpg.wikia.com/wiki/FAQ", target='_blank', ng-click='set({"preferences.menuExpanded":false})')
|
||||
span=env.t('FAQ')
|
||||
li
|
||||
a(href="https://vimeo.com/57654086", target='_blank', ng-click='set({"preferences.menuExpanded":false})')
|
||||
span=env.t('tutorials')
|
||||
span=env.t('user')
|
||||
a(ng-click='user.preferences.avatarMenuExpanded = !user.preferences.avatarMenuExpanded', ng-class='{active: user.preferences.avatarMenuExpanded}')
|
||||
span ☰
|
||||
div(ng-if='user.preferences.avatarMenuExpanded')
|
||||
ul.toolbar-submenu
|
||||
li
|
||||
a(ui-sref='options.profile.avatar', ng-click='set({"preferences.menuExpanded":false})')=env.t('avatar')
|
||||
li
|
||||
a(ui-sref='options.profile.stats', ng-click='set({"preferences.menuExpanded":false})')=env.t('stats')
|
||||
li
|
||||
a(ui-sref='options.profile.profile', ng-click='set({"preferences.menuExpanded":false})')=env.t('profile')
|
||||
li.toolbar-button-dropdown
|
||||
a(ui-sref='options.social.tavern')
|
||||
span=env.t('social')
|
||||
a(ng-click='user.preferences.socialMenuExpanded = !user.preferences.socialMenuExpanded', ng-class='{active: user.preferences.socialMenuExpanded}')
|
||||
span ☰
|
||||
div(ng-if='user.preferences.socialMenuExpanded')
|
||||
ul.toolbar-submenu
|
||||
li
|
||||
a(ui-sref='options.social.tavern', ng-click='set({"preferences.menuExpanded":false})')=env.t('tavern')
|
||||
li
|
||||
a(ui-sref='options.social.party', ng-click='set({"preferences.menuExpanded":false})')=env.t('party')
|
||||
li
|
||||
a(ui-sref='options.social.guilds', ng-click='set({"preferences.menuExpanded":false})')=env.t('guilds')
|
||||
li
|
||||
a(ui-sref='options.social.challenges', ng-click='set({"preferences.menuExpanded":false})')=env.t('challenges')
|
||||
li
|
||||
a(ui-sref='options.social.hall', ng-click='set({"preferences.menuExpanded":false})')=env.t('hall')
|
||||
li.toolbar-button-dropdown
|
||||
a(ui-sref='options.inventory.drops')
|
||||
span=env.t('inventory')
|
||||
a(ng-click='user.preferences.inventoryMenuExpanded = !user.preferences.inventoryMenuExpanded', ng-class='{active: user.preferences.inventoryMenuExpanded}')
|
||||
span ☰
|
||||
div(ng-if='user.preferences.inventoryMenuExpanded')
|
||||
ul.toolbar-submenu
|
||||
li
|
||||
a(ui-sref='options.inventory.drops', ng-click='set({"preferences.menuExpanded":false})')=env.t('market')
|
||||
li
|
||||
a(ui-sref='options.inventory.pets', ng-click='set({"preferences.menuExpanded":false})')=env.t('pets')
|
||||
li
|
||||
a(ui-sref='options.inventory.mounts', ng-click='set({"preferences.menuExpanded":false})')=env.t('mounts')
|
||||
li
|
||||
a(ui-sref='options.inventory.equipment', ng-click='set({"preferences.menuExpanded":false})')=env.t('equipment')
|
||||
ul.toolbar-options
|
||||
li.toolbar-notifs
|
||||
a(ng-click='user.preferences.isNotifsExpanded = !user.preferences.isNotifsExpanded')
|
||||
span.glyphicon.glyphicon-comment(ng-if='!user.invitations.party.id && !user.purchased.plan.mysteryItems.length && user.invitations.guilds.length === 0', ng-class='{inactive: _.isEmpty(user.newMessages)}')
|
||||
span.glyphicon.glyphicon-user(ng-if='!user.purchased.plan.mysteryItems.length && (user.invitations.party.id || user.invitations.guilds.length > 0)')
|
||||
span.glyphicon.glyphicon-gift(ng-if='user.purchased.plan.mysteryItems.length')
|
||||
div(ng-if='user.preferences.isNotifsExpanded')
|
||||
h4 Notifications
|
||||
ul.toolbar-notifs-notifs
|
||||
li(ng-if='user.purchased.plan.mysteryItems.length')
|
||||
a(ng-click='$state.go("options.inventory.drops"); user.preferences.isNotifsExpanded = !user.preferences.isNotifsExpanded; set({"preferences.menuExpanded":false})')
|
||||
span.glyphicon.glyphicon-gift
|
||||
span=env.t('newSubscriberItem')
|
||||
li(ng-if='user.invitations.party.id')
|
||||
a(ui-sref='options.social.party', ng-click='user.preferences.isNotifsExpanded = !user.preferences.isNotifsExpanded; set({"preferences.menuExpanded":false})')
|
||||
span.glyphicon.glyphicon-user
|
||||
span=env.t('invitedTo', {name: '{{user.invitations.party.name}}'})
|
||||
li(ng-repeat='guild in user.invitations.guilds')
|
||||
a(ui-sref='options.social.guilds', ng-click='user.preferences.isNotifsExpanded = !user.preferences.isNotifsExpanded; set({"preferences.menuExpanded":false})')
|
||||
span.glyphicon.glyphicon-user
|
||||
span=env.t('invitedTo', {name: '{{guild.name}}'})
|
||||
li(ng-repeat='(k,v) in user.newMessages', ng-if='v.value')
|
||||
a(ng-click='k==party._id ? $state.go("options.social.party") : $state.go("options.social.guilds.detail",{gid:k}); user.preferences.isNotifsExpanded = !user.preferences.isNotifsExpanded; set({"preferences.menuExpanded":false})')
|
||||
span.glyphicon.glyphicon-comment
|
||||
span {{v.name}}
|
||||
//-a(ng-click='')
|
||||
//-span.glyphicon.glyphicon-remove-circle(popover=env.t('clear'),popover-placement='right',popover-trigger='mouseenter',popover-append-to-body='true')
|
||||
//-ul.toolbar-controls
|
||||
//-li
|
||||
a(ng-click='') Clear all
|
||||
//-li
|
||||
//-a(ng-click='user.preferences.isNotifsExpanded = !user.preferences.isNotifsExpanded; set({"preferences.menuExpanded":false})')
|
||||
//-| X
|
||||
li.toolbar-sync
|
||||
a(ng-click='User.sync()', popover=env.t('sync'),popover-placement='bottom',popover-trigger='mouseenter')
|
||||
span.glyphicon.glyphicon-refresh
|
||||
li.toolbar-settings
|
||||
a(ng-click='user.preferences.isSettingsExpanded = !user.preferences.isSettingsExpanded')
|
||||
span.glyphicon.glyphicon-cog
|
||||
div(ng-if='user.preferences.isSettingsExpanded')
|
||||
h4=env.t('settings')
|
||||
ul
|
||||
li
|
||||
a(ng-click='logout()')
|
||||
span=env.t('logout')
|
||||
li
|
||||
a(ui-sref='options.settings.settings', ng-click='set({"preferences.isSettingsExpanded":false})')=env.t('site')
|
||||
li
|
||||
a(ui-sref='options.settings.api', ng-click='set({"preferences.isSettingsExpanded":false})')=env.t('API')
|
||||
li
|
||||
a(ui-sref='options.settings.export', ng-click='set({"preferences.isSettingsExpanded":false})')=env.t('export')
|
||||
li
|
||||
a(ui-sref='options.settings.subscription', ng-click='set({"preferences.isSettingsExpanded":false})')=env.t('subscription')
|
||||
li
|
||||
a(href="http://habitrpg.wikia.com/wiki/FAQ", target='_blank', ng-click='set({"preferences.menuExpanded":false})')
|
||||
span=env.t('FAQ')
|
||||
li
|
||||
a(href="https://vimeo.com/57654086", target='_blank', ng-click='set({"preferences.menuExpanded":false})')
|
||||
span=env.t('tutorials')
|
||||
ul.toolbar-controls
|
||||
li
|
||||
a(ng-click='set({"preferences.isSettingsExpanded":false})')=env.t('close')
|
||||
li.toolbar-subscribe
|
||||
button(ng-if='!user.purchased.plan.customerId',ui-sref='options.settings.subscription',popover-trigger='mouseenter',popover-placement='bottom',popover-title=env.t('subscriptions'),popover=env.t('subDescription'),popover-append-to-body='true')=env.t('subscribe')
|
||||
ul.toolbar-wallet
|
||||
li.toolbar-gems
|
||||
a.gem-wallet(ng-click='openModal("buyGems",{track:"Gems > Toolbar"})', popover-trigger='mouseenter', popover-title=env.t('gems'), popover=env.t('gemsWhatFor'), popover-placement='bottom',popover-append-to-body='true')
|
||||
//-span.task-action-btn.tile.flush.bright.add-gems-btn ＋
|
||||
span.Pet_Currency_Gem2x.Gems
|
||||
span.gem-text {{user.balance * 4 | number:0}}
|
||||
li.toolbar-currency(popover=env.t('gold'), popover-placement='bottom',popover-trigger='mouseenter')
|
||||
span.shop_gold
|
||||
span {{Shared.gold(user.stats.gp)}}
|
||||
li.toolbar-currency(popover=env.t('silver'), popover-placement='bottom',popover-trigger='mouseenter')
|
||||
span.shop_silver
|
||||
span {{Shared.silver(user.stats.gp)}}
|
||||
ul.toolbar-bailey(ng-class='{inactive: !user.preferences.menuExpanded}')
|
||||
li.toolbar-bailey-container(ng-if='user.flags.newStuff')
|
||||
.npc_bailey.npc_bailey_head(popover=env.t('psst'), popover-trigger='mouseenter', popover-placement='right', ng-click='openModal("newStuff")')
|
||||
Loading…
Reference in a new issue