refactor(bs3): inventory & misc

This commit is contained in:
Matteo Pagliazzi 2014-02-09 12:32:12 +01:00
parent c5b2d28ef9
commit 5874941b94
7 changed files with 92 additions and 128 deletions

View file

@ -19,29 +19,8 @@
display: inline-block
vertical-align: middle
// pets (this will all change when pet system is overhauled)
.pet-grid
padding-top: 1.5em
border-top: rgba(0,0,0,0.1)
table
width: 100%
td
padding: 0.5em
//width: 25%
&.active-pet
background-color: $bad
outline: 1px solid rgba(0,0,0,0.1)
outline-offset: -1px
&:hover, &:focus
background-color: darken($better, 10%)
> div
margin:auto
margin-bottom:.5em
p
text-align:center
width:6.5em
height:2.5em
.stable .static-popover
max-width: 550px
menu.pets div
display: inline-block

View file

@ -13,11 +13,6 @@ html(ng-app="habitrpg", ng-controller="RootCtrl", ng-class='{"applying-action":a
script(type='text/javascript').
window.env = !{JSON.stringify(env)};
style.
[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak {
display: none;
}
!= env.getManifestFiles("app")
//webfonts

View file

@ -16,7 +16,7 @@
span.glyphicon.glyphicon-trash
a(ng-hide='_editing', ng-click='toggleFilter(tag)')
span.glyphicon.glyphicon-bullhorn(bo-if="tag.challenge")
markdown(ng-model='tag.name',style='display: inline-block')
markdown(ng-model='tag.name')
li
form.form-inline(ng-show='_editing', ng-submit='createTag(_newTag)')
.input-group

View file

@ -13,9 +13,10 @@ script(type='text/ng-template', id='partials/options.inventory.equipment.html')
h3.equipment-title=env.t('costume')
 
i.icon-question-sign(popover-trigger='mouseenter', popover-placement='right', popover=env.t('costumeText'))
label.checkbox.inline(style="margin-left: 20px;")
input(type="checkbox", ng-model="user.preferences.costume", ng-click='set({"preferences.costume":!user.preferences.costume})')
=env.t('useCostume')
.checkbox
label
input(type="checkbox", ng-model="user.preferences.costume", ng-click='set({"preferences.costume":!user.preferences.costume})')
=env.t('useCostume')
li.customize-menu(ng-if='user.preferences.costume')
menu.pets-menu(label='{{label}}', ng-repeat='(klass,label) in {base:"Base", warrior:"Warrior", wizard:"Mage", rogue:"Rogue", healer:"Healer", special:"Special"}', ng-show='gear[klass]')
div(ng-repeat='item in gear[klass]')

View file

@ -1,92 +1,90 @@
script(type='text/ng-template', id='partials/options.inventory.mounts.html')
.container-fluid
.stable.row
table
tr
td(style='width:144px')
.npc_matt
td
.popover.static-popover.fade.right.in(style='max-width: 550px; margin-left: 10px;')
.arrow
h3.popover-title
a(target='_blank', href='http://www.kickstarter.com/profile/mattboch')=env.t('mattBoch')
.popover-content
p=env.t('mattShall', {name: "{{user.profile.name}}"})
h4= '{{Shared.countMounts(null,User.user.items.mounts)}} / {{totalMounts}} ' + env.t('mountsTamed')
menu.pets(type='list')
li.customize-menu(ng-repeat='egg in Content.eggs')
menu
div(ng-repeat='potion in Content.hatchingPotions', popover-trigger='mouseenter', popover='{{potion.text}} {{egg.mountText}}', popover-placement='bottom', ng-init='mount = egg.key+"-"+potion.key')
button(class="pet-button Mount_Head_{{mount}}", ng-show='user.items.mounts[mount]', ng-class='{active: user.items.currentMount == mount}', ng-click='chooseMount(egg.key, potion.key)')
//div(class='Mount_Head_{{mount}}')
button(class="pet-button pet-not-owned", ng-hide='user.items.mounts[mount]')
.PixelPaw
h4=env.t('rareMounts')
menu
div
button(ng-if='user.items.mounts["BearCub-Polar"]', class="pet-button Mount_Head_BearCub-Polar", ng-class='{active: user.items.currentMount == "BearCub-Polar"}', ng-click='chooseMount("BearCub", "Polar")', popover=env.t('polarBear'), popover-trigger='mouseenter', popover-placement='bottom')
//.Mount_Head_BearCub-Polar
button(ng-if='user.items.mounts["LionCub-Ethereal"]', class="pet-button Mount_Head_LionCub-Ethereal", ng-class='{active: user.items.currentMount == "LionCub-Ethereal"}', ng-click='chooseMount("LionCub", "Ethereal")', popover=env.t('etherealLion'), popover-trigger='mouseenter', popover-placement='bottom')
//.Mount_Head_LionCub-Ethereal
.col-md-2
.npc_matt
.col-md-10
.popover.static-popover.fade.right.in
.arrow
h3.popover-title
a(target='_blank', href='http://www.kickstarter.com/profile/mattboch')=env.t('mattBoch')
.popover-content
p=env.t('mattShall', {name: "{{user.profile.name}}"})
h4= '{{Shared.countMounts(null,User.user.items.mounts) || 0}} / {{totalMounts}} ' + env.t('mountsTamed')
.col-md-12
menu.pets(type='list')
li.customize-menu(ng-repeat='egg in Content.eggs')
menu
div(ng-repeat='potion in Content.hatchingPotions', popover-trigger='mouseenter', popover='{{potion.text}} {{egg.mountText}}', popover-placement='bottom', ng-init='mount = egg.key+"-"+potion.key')
button(class="pet-button Mount_Head_{{mount}}", ng-show='user.items.mounts[mount]', ng-class='{active: user.items.currentMount == mount}', ng-click='chooseMount(egg.key, potion.key)')
//div(class='Mount_Head_{{mount}}')
button(class="pet-button pet-not-owned", ng-hide='user.items.mounts[mount]')
.PixelPaw
.col-md-12
h4=env.t('rareMounts')
menu
div
button(ng-if='user.items.mounts["BearCub-Polar"]', class="pet-button Mount_Head_BearCub-Polar", ng-class='{active: user.items.currentMount == "BearCub-Polar"}', ng-click='chooseMount("BearCub", "Polar")', popover=env.t('polarBear'), popover-trigger='mouseenter', popover-placement='bottom')
//.Mount_Head_BearCub-Polar
button(ng-if='user.items.mounts["LionCub-Ethereal"]', class="pet-button Mount_Head_LionCub-Ethereal", ng-class='{active: user.items.currentMount == "LionCub-Ethereal"}', ng-click='chooseMount("LionCub", "Ethereal")', popover=env.t('etherealLion'), popover-trigger='mouseenter', popover-placement='bottom')
//.Mount_Head_LionCub-Ethereal
script(type='text/ng-template', id='partials/options.inventory.pets.html')
.container-fluid
.stable.row
table
tr
td(style='width:144px')
.npc_matt
td
.popover.static-popover.fade.right.in(style='max-width: 550px; margin-left: 10px;')
.arrow
h3.popover-title
a(target='_blank', href='http://www.kickstarter.com/profile/mattboch')=env.t('mattBoch')
.popover-content
p
=env.t('mattBochText1') + ' '
| <a target='_blank' href='https://f.cloud.github.com/assets/2374703/164631/3ed5fa6c-78cd-11e2-8743-f65ac477b55e.png'>
=env.t('mattBochText2')
| </a>
= ' ' + env.t('mattBochText3')
h4= env.t('beastmasterProgress') + ': {{petCount}} / {{totalPets}} ' + env.t('petsFound')
.col-md-2
.npc_matt
.col-md-10
.popover.static-popover.fade.right.in
.arrow
h3.popover-title
a(target='_blank', href='http://www.kickstarter.com/profile/mattboch')=env.t('mattBoch')
.popover-content
p
=env.t('mattBochText1') + ' '
| <a target='_blank' href='https://f.cloud.github.com/assets/2374703/164631/3ed5fa6c-78cd-11e2-8743-f65ac477b55e.png'>
=env.t('mattBochText2')
| </a>
= ' ' + env.t('mattBochText3')
h4= env.t('beastmasterProgress') + ': {{petCount}} / {{totalPets}} ' + env.t('petsFound')
menu.pets(type='list')
li.customize-menu(ng-repeat='egg in Content.dropEggs')
menu
div(ng-repeat='potion in Content.hatchingPotions', popover-trigger='mouseenter', popover='{{potion.text}} {{egg.text}}', popover-placement='bottom', ng-init='pet = egg.key+"-"+potion.key')
button(class="pet-button Pet-{{pet}}", ng-if='user.items.pets[pet]>0', ng-class='{active: user.items.currentPet == pet, selectableInventory: selectedFood}', ng-click='choosePet(egg.key, potion.key)')
.progress(ng-show='!user.items.mounts[pet]')
.progress-bar.progress-bar-success(style="width:{{user.items.pets[pet]/.5}}%")
button(class="pet-button pet-not-owned", ng-if='!user.items.pets[pet]')
.PixelPaw
button(class="pet-button Pet-{{pet}}" ng-if='user.items.pets[pet]<0',style='opacity:0.1;filter:alpha(opacity=10)')
//if this could be changed to the opacity talked about? can't figure it out
.col-md-12
menu.pets(type='list')
li.customize-menu(ng-repeat='egg in Content.dropEggs')
menu
div(ng-repeat='potion in Content.hatchingPotions', popover-trigger='mouseenter', popover='{{potion.text}} {{egg.text}}', popover-placement='bottom', ng-init='pet = egg.key+"-"+potion.key')
button(class="pet-button Pet-{{pet}}", ng-if='user.items.pets[pet]>0', ng-class='{active: user.items.currentPet == pet, selectableInventory: selectedFood}', ng-click='choosePet(egg.key, potion.key)')
.progress(ng-show='!user.items.mounts[pet]')
.progress-bar.progress-bar-success(style="width:{{user.items.pets[pet]/.5}}%")
button(class="pet-button pet-not-owned", ng-if='!user.items.pets[pet]')
.PixelPaw
button(class="pet-button Pet-{{pet}}" ng-if='user.items.pets[pet]<0',style='opacity:0.1;filter:alpha(opacity=10)')
//if this could be changed to the opacity talked about? can't figure it out
.col-md-12
h4=env.t('questPets')
menu.pets(type='list')
li.customize-menu(ng-repeat='egg in Content.questEggs')
menu
div(ng-repeat='potion in Content.hatchingPotions', popover-trigger='mouseenter', popover='{{potion.text}} {{egg.text}}', popover-placement='bottom', ng-init='pet = egg.key+"-"+potion.key')
button(class="pet-button Pet-{{pet}}", ng-if='user.items.pets[pet]>0', ng-class='{active: user.items.currentPet == pet, selectableInventory: selectedFood}', ng-click='choosePet(egg.key, potion.key)')
.progress(ng-show='!user.items.mounts[pet]')
.progress-bar.progress-bar-success(style="width:{{user.items.pets[pet]/.5}}%")
button(class="pet-button pet-not-owned", ng-if='!user.items.pets[pet]')
.PixelPaw
button(class="pet-button Pet-{{pet}}" ng-if='user.items.pets[pet]<0',style='opacity:0.1;filter:alpha(opacity=10)')
h4=env.t('questPets')
menu.pets(type='list')
li.customize-menu(ng-repeat='egg in Content.questEggs')
menu
div(ng-repeat='potion in Content.hatchingPotions', popover-trigger='mouseenter', popover='{{potion.text}} {{egg.text}}', popover-placement='bottom', ng-init='pet = egg.key+"-"+potion.key')
button(class="pet-button Pet-{{pet}}", ng-if='user.items.pets[pet]>0', ng-class='{active: user.items.currentPet == pet, selectableInventory: selectedFood}', ng-click='choosePet(egg.key, potion.key)')
.progress(ng-show='!user.items.mounts[pet]')
.progress-bar.progress-bar-success(style="width:{{user.items.pets[pet]/.5}}%")
button(class="pet-button pet-not-owned", ng-if='!user.items.pets[pet]')
.PixelPaw
button(class="pet-button Pet-{{pet}}" ng-if='user.items.pets[pet]<0',style='opacity:0.1;filter:alpha(opacity=10)')
h4=env.t('rarePets')
menu
div
button(ng-if='user.items.pets["Wolf-Veteran"]', class="pet-button Pet-Wolf-Veteran", ng-class='{active: user.items.currentPet == "Wolf-Veteran"}', ng-click='choosePet("Wolf", "Veteran")', popover=env.t('veteranWolf'), popover-trigger='mouseenter', popover-placement='bottom')
button(ng-if='user.items.pets["Wolf-Cerberus"]', class="pet-button Pet-Wolf-Cerberus", ng-class='{active: user.items.currentPet == "Wolf-Cerberus"}', ng-click='choosePet("Wolf", "Cerberus")', popover=env.t('cerberusPup'), popover-trigger='mouseenter', popover-placement='bottom')
button(ng-if='user.items.pets["Turkey-Base"]', class="pet-button Pet-Turkey-Base", ng-class='{active: user.items.currentPet == "Turkey-Base"}', ng-click='choosePet("Turkey", "Base")', popover=env.t('turkey'), popover-trigger='mouseenter', popover-placement='bottom')
button(ng-if='user.items.pets["BearCub-Polar"]', class="pet-button Pet-BearCub-Polar", ng-class='{active: user.items.currentPet == "BearCub-Polar"}', ng-click='choosePet("BearCub", "Polar")', popover=env.t('polarBearPup'), popover-trigger='mouseenter', popover-placement='bottom')
button(ng-if='user.items.pets["Dragon-Hydra"]', class="pet-button Pet-Dragon-Hydra", ng-class='{active: user.items.currentPet == "Dragon-Hydra"}', ng-click='choosePet("Dragon", "Hydra")', popover=env.t('hydra'), popover-trigger='mouseenter', popover-placement='bottom')
a(target='_blank', href='http://habitrpg.wikia.com/wiki/Contributing_to_HabitRPG')
button(ng-if='!user.items.pets["Dragon-Hydra"]', class="pet-button pet-not-owned", popover-trigger='mouseenter', popover-placement='right', popover=env.t('rarePetPop1'), popover-title=env.t('rarePetPop2'))
.PixelPaw-Gold
.col-md-12
h4=env.t('rarePets')
menu
div
button(ng-if='user.items.pets["Wolf-Veteran"]', class="pet-button Pet-Wolf-Veteran", ng-class='{active: user.items.currentPet == "Wolf-Veteran"}', ng-click='choosePet("Wolf", "Veteran")', popover=env.t('veteranWolf'), popover-trigger='mouseenter', popover-placement='bottom')
button(ng-if='user.items.pets["Wolf-Cerberus"]', class="pet-button Pet-Wolf-Cerberus", ng-class='{active: user.items.currentPet == "Wolf-Cerberus"}', ng-click='choosePet("Wolf", "Cerberus")', popover=env.t('cerberusPup'), popover-trigger='mouseenter', popover-placement='bottom')
button(ng-if='user.items.pets["Turkey-Base"]', class="pet-button Pet-Turkey-Base", ng-class='{active: user.items.currentPet == "Turkey-Base"}', ng-click='choosePet("Turkey", "Base")', popover=env.t('turkey'), popover-trigger='mouseenter', popover-placement='bottom')
button(ng-if='user.items.pets["BearCub-Polar"]', class="pet-button Pet-BearCub-Polar", ng-class='{active: user.items.currentPet == "BearCub-Polar"}', ng-click='choosePet("BearCub", "Polar")', popover=env.t('polarBearPup'), popover-trigger='mouseenter', popover-placement='bottom')
button(ng-if='user.items.pets["Dragon-Hydra"]', class="pet-button Pet-Dragon-Hydra", ng-class='{active: user.items.currentPet == "Dragon-Hydra"}', ng-click='choosePet("Dragon", "Hydra")', popover=env.t('hydra'), popover-trigger='mouseenter', popover-placement='bottom')
a(target='_blank', href='http://habitrpg.wikia.com/wiki/Contributing_to_HabitRPG')
button(ng-if='!user.items.pets["Dragon-Hydra"]', class="pet-button pet-not-owned", popover-trigger='mouseenter', popover-placement='right', popover=env.t('rarePetPop1'), popover-title=env.t('rarePetPop2'))
.PixelPaw-Gold
.well.food-tray
p(ng-show='foodCount < 1')=env.t('noFood')

View file

@ -48,7 +48,7 @@ footer.footer(ng-controller='FooterCtrl')
li
a(target='_blank', href='http://www.reddit.com/r/habitrpg/')=env.t('communityReddit')
.col-sm-3
if (env.NODE_ENV=='production')
if (env.NODE_ENV=='production' && !env.IS_MOBILE)
h4=env.t('footerSocial')
.addthis_toolbox.addthis_default_style(addthis:url='https://habitrpg.com', addthis:title=env.t('socialTitle'))
table
@ -59,21 +59,17 @@ footer.footer(ng-controller='FooterCtrl')
td
a.addthis_button_tweet(tw:via='habitrpg')
tr
td(align='left')
td
iframe(src='/bower_components/github-buttons/github-btn.html?user=lefnire&repo=habitrpg&type=watch&count=true', allowtransparency='true', frameborder='0', scrolling='0', width='85px', height='20px')
tr
td
a.addthis_button_google_plusone(g:plusone:size='medium')
else if(!env.isFrontPage)
h4 Debug
ul.list-unstyled
li
a.btn.btn-default(ng-click='addMissedDay()') +1 Missed Day
li
a.btn.btn-default(ng-click='addTenGems()') +10 Gems
li
a.btn.btn-default(ng-click='addLevelsAndGold()') +Exp +GP
li
a.btn.btn-default(ng-click='addOneLevel()') +1 Level
.btn-group-vertical
a.btn.btn-default(ng-click='addMissedDay()') +1 Missed Day
a.btn.btn-default(ng-click='addTenGems()') +10 Gems
a.btn.btn-default(ng-click='addLevelsAndGold()') +Exp +GP
a.btn.btn-default(ng-click='addOneLevel()') +1 Level
div(ng-init='deferredScripts()')

View file

@ -15,11 +15,6 @@ html(ng-app='habitrpgStatic')
meta(charset='utf-8')
meta(name='viewport', content='width=device-width, initial-scale=1.0')
style.
[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak {
display: none;
}
!= env.getManifestFiles("static")
body