habitica/views/options/inventory/stable.jade

script(type='text/ng-template', id='partials/options.inventory.mounts.html')
  .container-fluid
    .stable.row
      .col-md-2
        div(class="#{env.worldDmg.stable ? 'npc_matt_broken' : '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')
          each egg in env.Content.eggs
            li.customize-menu
              menu
                each potion in env.Content.hatchingPotions
                  - mount = egg.key+"-"+potion.key
                  div(popover-trigger='mouseenter', popover=env.t('mountName', {potion: potion.text(env.language.code), mount: egg.mountText(env.language.code)}), popover-placement='bottom')
                    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
            each t,k in env.Content.specialMounts
              - var animal = k.split('-')[0], color = k.split('-')[1]
              button(ng-if='user.items.mounts["#{animal}-#{color}"]', class="pet-button Mount_Head_#{animal}-#{color}", ng-class='{active: user.items.currentMount == "#{animal}-#{color}"}', ng-click='chooseMount("#{animal}", "#{color}")', popover=env.t(t), popover-trigger='mouseenter', popover-placement='bottom')

mixin petList(source)
  menu.pets(type='list')
    each egg in source
      li.customize-menu
        menu
          each potion in env.Content.hatchingPotions
            - pet = egg.key+"-"+potion.key
            div(popover-trigger='mouseenter', popover=env.t('petName', {potion: potion.text(env.language.code), egg: egg.text(env.language.code)}), popover-placement='bottom')
              button(class="pet-button Pet-#{pet}", ng-if='user.items.pets["#{pet}"]>0', ng-class='{active: user.items.currentPet == "#{pet}", selectableInventory: selectedFood && !user.items.mounts["#{pet}"]}', ng-click='choosePet("#{egg.key}", "#{potion.key}")')
                .progress(ng-show='!user.items.mounts["#{pet}"] && "#{egg.key}"!="Egg"')
                  .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-evolved pet-button Pet-#{pet}", ng-if='user.items.pets["#{pet}"]<0')

script(type='text/ng-template', id='partials/options.inventory.pets.html')
  .container-fluid
    .stable.row
      .col-md-2
        div(class="#{env.worldDmg.stables ? 'npc_matt_broken' : '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')

      .col-md-12
        +petList(env.Content.dropEggs)
      .col-md-12
        h4=env.t('questPets')
        +petList(env.Content.questEggs)

      .col-md-12
        h4=env.t('rarePets')
        menu
          div
            each t,k in env.Content.specialPets
              - var egg = k.split('-')[0], pot = k.split('-')[1]
              button(ng-if='user.items.pets["#{egg}-#{pot}"]', class="pet-button Pet-#{egg}-#{pot}", ng-class='{active: user.items.currentPet == "#{egg}-#{pot}"}', ng-click='choosePet("#{egg}", "#{pot}")', popover=env.t(t), 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')
      menu.inventory-list(type='list', ng-if='foodCount > 0')
        li.customize-menu
          menu.pets-menu(label=env.t('food'))
            div(ng-repeat='(food,points) in ownedItems(user.items.food)')
              button.customize-option(popover-append-to-body='true', popover='{{:: Content.food[food].notes()}}', popover-title='{{:: Content.food[food].text()}}', popover-trigger='mouseenter', popover-placement='left', ng-click='chooseFood(food)', class='Pet_Food_{{::food}}')
                .badge.badge-info.stack-count {{points}}
              // Remove this once we have images in
              p {{:: Content.food[food].text()}}