add @Pandoro's new sprites to /styl, clean up

This commit is contained in:
Tyler Renelle 2013-02-08 13:04:31 -05:00
parent e062b7bc50
commit 5160595354
7 changed files with 232 additions and 120 deletions

View file

@ -128,36 +128,11 @@ module.exports.app = (appExports, model) ->
###
module.exports.updateStore = updateStore = (model) ->
obj = model.get('_user')
[nextWeapon, nextArmor, nextHead, nextShield] = [null, null, null, null]
i = parseInt(obj.items.weapon) + 1
nextWeapon = if (i == _.size items.weapon) then {hide:true} else items.weapon[i]
model.set '_view.items.weapon',
i = parseInt(obj?.items?.armor || 0) + 1
if i == _.size items.armor
nextArmor = {hide:true}
else
nextArmor = items.armor[i]
nextArmor.classes = obj.preferences.gender + "_armor_#{i}"
model.set '_view.items.armor', nextArmor
i = parseInt(parseInt(obj?.items?.head || 0) + 1)
if i == _.size items.armor
nextHead = {hide:true}
else
nextHead = items.head[i]
nextHead.classes = obj.preferences.gender + "_head_#{i}"
nextHead.classes += "_#{obj.preferences.armorSet}" if obj.preferences.gender == 'f'
model.set '_view.items.head', nextHead
i = parseInt(obj?.items?.shield || 0) + 1
if i == _.size items.shield
nextShield = {hide:true}
else
nextShield = items.shield[i]
nextShield.classes = obj.preferences.gender + "_" + nextShield.classes
model.set '_vie.items.shield', nextShield
_.each ['weapon', 'armor', 'shield', 'head'], (type) ->
i = parseInt(obj?.items?[type] || 0) + 1
nextItem = if (i == _.size items[type]) then {hide:true} else items[type][i]
model.set "_view.items.#{type}", nextItem
model.set '_view.items.potion', items.potion
model.set '_view.items.reroll', items.reroll

View file

@ -0,0 +1,78 @@
.f_weapon_6,
.f_weapon_5,
.f_weapon_4,
.f_weapon_3,
.f_weapon_2,
.f_weapon_1,
.f_weapon_0,
.f_shield_5,
.f_shield_4,
.f_shield_3,
.f_shield_2,
.f_shield_1,
.f_head_5_v2,
.f_head_5_v1,
.f_head_4_v2,
.f_head_4_v1,
.f_head_3_v2,
.f_head_3_v1,
.f_head_2_v2,
.f_head_2_v1,
.f_head_1,
.f_head_0,
.f_hair_white,
.f_hair_brown,
.f_hair_black,
.f_hair_blond,
.f_armor_5,
.f_armor_4,
.f_armor_3,
.f_armor_2,
.f_armor_1,
.f_armor_0_v2,
.f_armor_0_v1,
.f_skin_dead,
.f_skin_orc,
.f_skin_asian,
.f_skin_black,
.f_skin_white
background: url("img/BrowserQuest/habitrpg_mods/female_sprites.png") no-repeat
.f_weapon_6 {background-position: 0 0; width: 90px; height: 90px}
.f_weapon_5 {background-position: -90px 0; width: 90px; height: 90px}
.f_weapon_4 {background-position: -180px 0; width: 90px; height: 90px}
.f_weapon_3 {background-position: -270px 0; width: 90px; height: 90px}
.f_weapon_2 {background-position: -360px 0; width: 90px; height: 90px}
.f_weapon_1 {background-position: -450px 0; width: 90px; height: 90px}
.f_weapon_0 {background-position: -540px 0; width: 90px; height: 90px}
.f_shield_5 {background-position: -630px 0; width: 90px; height: 90px}
.f_shield_4 {background-position: -720px 0; width: 90px; height: 90px}
.f_shield_3 {background-position: -810px 0; width: 90px; height: 90px}
.f_shield_2 {background-position: -900px 0; width: 90px; height: 90px}
.f_shield_1 {background-position: -990px 0; width: 90px; height: 90px}
.f_head_5_v2 {background-position: -1080px 0; width: 90px; height: 90px}
.f_head_5_v1 {background-position: -1170px 0; width: 90px; height: 90px}
.f_head_4_v2 {background-position: -1260px 0; width: 90px; height: 90px}
.f_head_4_v1 {background-position: -1350px 0; width: 90px; height: 90px}
.f_head_3_v2 {background-position: -1440px 0; width: 90px; height: 90px}
.f_head_3_v1 {background-position: -1530px 0; width: 90px; height: 90px}
.f_head_2_v2 {background-position: -1620px 0; width: 90px; height: 90px}
.f_head_2_v1 {background-position: -1710px 0; width: 90px; height: 90px}
.f_head_1 {background-position: -1800px 0; width: 90px; height: 90px}
.f_head_0 {background-position: -1890px 0; width: 90px; height: 90px}
.f_hair_white {background-position: -1980px 0; width: 90px; height: 90px}
.f_hair_brown {background-position: -2070px 0; width: 90px; height: 90px}
.f_hair_black {background-position: -2160px 0; width: 90px; height: 90px}
.f_hair_blond {background-position: -2250px 0; width: 90px; height: 90px}
.f_armor_5 {background-position: -2340px 0; width: 90px; height: 90px}
.f_armor_4 {background-position: -2430px 0; width: 90px; height: 90px}
.f_armor_3 {background-position: -2520px 0; width: 90px; height: 90px}
.f_armor_2 {background-position: -2610px 0; width: 90px; height: 90px}
.f_armor_1 {background-position: -2700px 0; width: 90px; height: 90px}
.f_armor_0_v2 {background-position: -2790px 0; width: 90px; height: 90px}
.f_armor_0_v1 {background-position: -2880px 0; width: 90px; height: 90px}
.f_skin_dead {background-position: -2970px 0; width: 90px; height: 90px}
.f_skin_orc {background-position: -3060px 0; width: 90px; height: 90px}
.f_skin_asian {background-position: -3150px 0; width: 90px; height: 90px}
.f_skin_black {background-position: -3240px 0; width: 90px; height: 90px}
.f_skin_white {background-position: -3330px 0; width: 90px; height: 90px}

View file

@ -1,6 +1,8 @@
@import "nib/vendor";
@import "../bootstrap-responsive.styl";
@import "../sprites.styl";
@import "./female_sprites.styl";
@import "./male_sprites.styl";
@import "./shop_sprites.styl";
html,body,p,h1,ul,li,table,tr,th,td
margin: 0
@ -232,3 +234,26 @@ li:hover .task-meta-controls .hover-show
margin-right: -1px;
top: 50%;
margin-top: -6px;
.avatar
position: relative
margin-top: -12px
width: 90px
height: 90px
.character-sprites
position: absolute
top: -15px
.lvl
position: absolute
bottom: 0px
right: 10px
.character-sprites span
position: absolute
.itemstore-icons
background-size: 50%

View file

@ -0,0 +1,68 @@
.m_weapon_6,
.m_weapon_5,
.m_weapon_4,
.m_weapon_3,
.m_weapon_2,
.m_weapon_1,
.m_weapon_0,
.m_shield_5,
.m_shield_4,
.m_shield_3,
.m_shield_2,
.m_shield_1,
.m_head_5,
.m_head_4,
.m_head_3,
.m_head_2,
.m_head_1,
.m_head_0,
.m_hair_blond,
.m_hair_black,
.m_hair_brown,
.m_hair_white,
.m_armor_5,
.m_armor_4,
.m_armor_3,
.m_armor_2,
.m_armor_1,
.m_armor_0,
.m_skin_dead,
.m_skin_orc,
.m_skin_asian,
.m_skin_black,
.m_skin_white
background: url("img/BrowserQuest/habitrpg_mods/male_sprites.png") no-repeat
.m_weapon_6 {background-position: 0 0; width: 90px; height: 90px}
.m_weapon_5 {background-position: -90px 0; width: 90px; height: 90px}
.m_weapon_4 {background-position: -180px 0; width: 90px; height: 90px}
.m_weapon_3 {background-position: -270px 0; width: 90px; height: 90px}
.m_weapon_2 {background-position: -360px 0; width: 90px; height: 90px}
.m_weapon_1 {background-position: -450px 0; width: 90px; height: 90px}
.m_weapon_0 {background-position: -540px 0; width: 90px; height: 90px}
.m_shield_5 {background-position: -630px 0; width: 90px; height: 90px}
.m_shield_4 {background-position: -720px 0; width: 90px; height: 90px}
.m_shield_3 {background-position: -810px 0; width: 90px; height: 90px}
.m_shield_2 {background-position: -900px 0; width: 90px; height: 90px}
.m_shield_1 {background-position: -990px 0; width: 90px; height: 90px}
.m_head_5 {background-position: -1080px 0; width: 90px; height: 90px}
.m_head_4 {background-position: -1170px 0; width: 90px; height: 90px}
.m_head_3 {background-position: -1260px 0; width: 90px; height: 90px}
.m_head_2 {background-position: -1350px 0; width: 90px; height: 90px}
.m_head_1 {background-position: -1440px 0; width: 90px; height: 90px}
.m_head_0 {background-position: -1530px 0; width: 90px; height: 90px}
.m_hair_blond {background-position: -1620px 0; width: 90px; height: 90px}
.m_hair_black {background-position: -1710px 0; width: 90px; height: 90px}
.m_hair_brown {background-position: -1800px 0; width: 90px; height: 90px}
.m_hair_white {background-position: -1890px 0; width: 90px; height: 90px}
.m_armor_5 {background-position: -1980px 0; width: 90px; height: 90px}
.m_armor_4 {background-position: -2070px 0; width: 90px; height: 90px}
.m_armor_3 {background-position: -2160px 0; width: 90px; height: 90px}
.m_armor_2 {background-position: -2250px 0; width: 90px; height: 90px}
.m_armor_1 {background-position: -2340px 0; width: 90px; height: 90px}
.m_armor_0 {background-position: -2430px 0; width: 90px; height: 90px}
.m_skin_dead {background-position: -2520px 0; width: 90px; height: 90px}
.m_skin_orc {background-position: -2610px 0; width: 90px; height: 90px}
.m_skin_asian {background-position: -2700px 0; width: 90px; height: 90px}
.m_skin_black {background-position: -2790px 0; width: 90px; height: 90px}
.m_skin_white {background-position: -2880px 0; width: 90px; height: 90px}

View file

@ -0,0 +1,54 @@
.shop_weapon_6,
.shop_weapon_5,
.shop_weapon_4,
.shop_weapon_3,
.shop_weapon_2,
.shop_weapon_1,
.shop_shield_5,
.shop_shield_4,
.shop_shield_3,
.shop_shield_2,
.shop_shield_1,
.shop_head_5,
.shop_head_4,
.shop_head_3,
.shop_head_2,
.shop_head_1,
.shop_armor_5,
.shop_armor_4,
.shop_armor_3,
.shop_armor_2,
.shop_armor_1,
.shop_reroll,
.shop_potion,
.shop_copper,
.shop_silver,
.shop_gold
background: url("img/BrowserQuest/habitrpg_mods/shop_sprites.png") no-repeat
.shop_weapon_6 {background-position: 0 0; width: 40px; height: 40px}
.shop_weapon_5 {background-position: -40px 0; width: 40px; height: 40px}
.shop_weapon_4 {background-position: -80px 0; width: 40px; height: 40px}
.shop_weapon_3 {background-position: -120px 0; width: 40px; height: 40px}
.shop_weapon_2 {background-position: -160px 0; width: 40px; height: 40px}
.shop_weapon_1 {background-position: -200px 0; width: 40px; height: 40px}
.shop_shield_5 {background-position: -240px 0; width: 40px; height: 40px}
.shop_shield_4 {background-position: -280px 0; width: 40px; height: 40px}
.shop_shield_3 {background-position: -320px 0; width: 40px; height: 40px}
.shop_shield_2 {background-position: -360px 0; width: 40px; height: 40px}
.shop_shield_1 {background-position: -400px 0; width: 40px; height: 40px}
.shop_head_5 {background-position: -440px 0; width: 40px; height: 40px}
.shop_head_4 {background-position: -480px 0; width: 40px; height: 40px}
.shop_head_3 {background-position: -520px 0; width: 40px; height: 40px}
.shop_head_2 {background-position: -560px 0; width: 40px; height: 40px}
.shop_head_1 {background-position: -600px 0; width: 40px; height: 40px}
.shop_armor_5 {background-position: -640px 0; width: 40px; height: 40px}
.shop_armor_4 {background-position: -680px 0; width: 40px; height: 40px}
.shop_armor_3 {background-position: -720px 0; width: 40px; height: 40px}
.shop_armor_2 {background-position: -760px 0; width: 40px; height: 40px}
.shop_armor_1 {background-position: -800px 0; width: 40px; height: 40px}
.shop_reroll {background-position: -840px 0; width: 40px; height: 40px}
.shop_potion {background-position: -880px 0; width: 40px; height: 40px}
.shop_copper {background-position: -920px 0; width: 40px; height: 40px}
.shop_silver {background-position: -960px 0; width: 40px; height: 40px}
.shop_gold {background-position: -1000px 0; width: 40px; height: 40px}

View file

@ -1,88 +0,0 @@
.avatar
position: relative
margin-top: -12px
width: 90px
height: 90px
.character-sprites
position: absolute
top: -15px
.lvl
position: absolute
bottom: 0px
right: 10px
.character-sprites span
position: absolute
.itemstore-icons
background-size: 50%
.weapon_6, .weapon_5, .weapon_4, .weapon_3, .weapon_2, .weapon_1, .weapon_0, .f_shield_5, .f_shield_4, .f_shield_3, .f_shield_2, .f_shield_1, .m_shield_5, .m_shield_4, .m_shield_3, .m_shield_2, .m_shield_1, .m_head_5, .m_head_4, .m_head_3, .m_head_2, .m_head_1, .m_head_0, .f_head_5_v2, .f_head_5_v1, .f_head_4_v2, .f_head_4_v1, .f_head_3_v2, .f_head_3_v1, .f_head_2_v2, .f_head_2_v1, .f_head_1, .f_head_0, .f_hair_white, .f_hair_brown, .f_hair_black, .f_hair_blond, .m_hair_blond, .m_hair_black, .m_hair_brown, .m_hair_white, .f_armor_5, .f_armor_4, .f_armor_3, .f_armor_2, .f_armor_1, .f_armor_0_v2, .f_armor_0_v1, .m_armor_5, .m_armor_4, .m_armor_3, .m_armor_2, .m_armor_1, .m_armor_0, .f_skin_dead, .f_skin_orc, .f_skin_asian, .f_skin_black, .f_skin_white, .m_skin_dead, .m_skin_orc, .m_skin_asian, .m_skin_black, .m_skin_white {
background: url("img/BrowserQuest/habitrpg_mods/css_sprite.png") no-repeat;
}
.weapon_6 {background-position: 0 0; width: 90px; height: 90px}
.weapon_5 {background-position: -90px 0; width: 90px; height: 90px}
.weapon_4 {background-position: -180px 0; width: 90px; height: 90px}
.weapon_3 {background-position: -270px 0; width: 90px; height: 90px}
.weapon_2 {background-position: -360px 0; width: 90px; height: 90px}
.weapon_1 {background-position: -450px 0; width: 90px; height: 90px}
.weapon_0 {background-position: -540px 0; width: 90px; height: 90px}
.f_shield_5 {background-position: -630px 0; width: 90px; height: 90px}
.f_shield_4 {background-position: -720px 0; width: 90px; height: 90px}
.f_shield_3 {background-position: -810px 0; width: 90px; height: 90px}
.f_shield_2 {background-position: -900px 0; width: 90px; height: 90px}
.f_shield_1 {background-position: -990px 0; width: 90px; height: 90px}
.m_shield_5 {background-position: -1080px 0; width: 90px; height: 90px}
.m_shield_4 {background-position: -1170px 0; width: 90px; height: 90px}
.m_shield_3 {background-position: -1260px 0; width: 90px; height: 90px}
.m_shield_2 {background-position: -1350px 0; width: 90px; height: 90px}
.m_shield_1 {background-position: -1440px 0; width: 90px; height: 90px}
.m_head_5 {background-position: -1530px 0; width: 90px; height: 90px}
.m_head_4 {background-position: -1620px 0; width: 90px; height: 90px}
.m_head_3 {background-position: -1710px 0; width: 90px; height: 90px}
.m_head_2 {background-position: -1800px 0; width: 90px; height: 90px}
.m_head_1 {background-position: -1890px 0; width: 90px; height: 90px}
.m_head_0 {background-position: -1980px 0; width: 90px; height: 90px}
.f_head_5_v2 {background-position: -2070px 0; width: 90px; height: 90px}
.f_head_5_v1 {background-position: -2160px 0; width: 90px; height: 90px}
.f_head_4_v2 {background-position: -2250px 0; width: 90px; height: 90px}
.f_head_4_v1 {background-position: -2340px 0; width: 90px; height: 90px}
.f_head_3_v2 {background-position: -2430px 0; width: 90px; height: 90px}
.f_head_3_v1 {background-position: -2520px 0; width: 90px; height: 90px}
.f_head_2_v2 {background-position: -2610px 0; width: 90px; height: 90px}
.f_head_2_v1 {background-position: -2700px 0; width: 90px; height: 90px}
.f_head_1 {background-position: -2790px 0; width: 90px; height: 90px}
.f_head_0 {background-position: -2880px 0; width: 90px; height: 90px}
.f_hair_white {background-position: -2970px 0; width: 90px; height: 90px}
.f_hair_brown {background-position: -3060px 0; width: 90px; height: 90px}
.f_hair_black {background-position: -3150px 0; width: 90px; height: 90px}
.f_hair_blond {background-position: -3240px 0; width: 90px; height: 90px}
.m_hair_blond {background-position: -3330px 0; width: 90px; height: 90px}
.m_hair_black {background-position: -3420px 0; width: 90px; height: 90px}
.m_hair_brown {background-position: -3510px 0; width: 90px; height: 90px}
.m_hair_white {background-position: -3600px 0; width: 90px; height: 90px}
.f_armor_5 {background-position: -3690px 0; width: 90px; height: 90px}
.f_armor_4 {background-position: -3780px 0; width: 90px; height: 90px}
.f_armor_3 {background-position: -3870px 0; width: 90px; height: 90px}
.f_armor_2 {background-position: -3960px 0; width: 90px; height: 90px}
.f_armor_1 {background-position: -4050px 0; width: 90px; height: 90px}
.f_armor_0_v2 {background-position: -4140px 0; width: 90px; height: 90px}
.f_armor_0_v1 {background-position: -4230px 0; width: 90px; height: 90px}
.m_armor_5 {background-position: -4320px 0; width: 90px; height: 90px}
.m_armor_4 {background-position: -4410px 0; width: 90px; height: 90px}
.m_armor_3 {background-position: -4500px 0; width: 90px; height: 90px}
.m_armor_2 {background-position: -4590px 0; width: 90px; height: 90px}
.m_armor_1 {background-position: -4680px 0; width: 90px; height: 90px}
.m_armor_0 {background-position: -4770px 0; width: 90px; height: 90px}
.f_skin_dead {background-position: -4860px 0; width: 90px; height: 90px}
.f_skin_orc {background-position: -4950px 0; width: 90px; height: 90px}
.f_skin_asian {background-position: -5040px 0; width: 90px; height: 90px}
.f_skin_black {background-position: -5130px 0; width: 90px; height: 90px}
.f_skin_white {background-position: -5220px 0; width: 90px; height: 90px}
.m_skin_dead {background-position: -5310px 0; width: 90px; height: 90px}
.m_skin_orc {background-position: -5400px 0; width: 90px; height: 90px}
.m_skin_asian {background-position: -5490px 0; width: 90px; height: 90px}
.m_skin_black {background-position: -5580px 0; width: 90px; height: 90px}
.m_skin_white {background-position: -5670px 0; width: 90px; height: 90px}

View file

@ -225,7 +225,7 @@
<span class="{equipped(_user, 'armor')}"></span>
<span class='{:p.gender}_shield_{_user.items.shield}'></span>
<span class="{equipped(_user, 'head')}"></span>
<span class='weapon_{_user.items.weapon}'></span>
<span class='{:p.gender}_weapon_{_user.items.weapon}'></span>
{/}
</div>
<div class="lvl"><span class="badge badge-info">Lvl {_user.stats.lvl}</span></div>
@ -545,7 +545,7 @@
{#if :item.icon}
<img src="/img/BrowserQuest/habitrpg_mods/{:item.icon}" />
{else}
<div class="{:item.classes} itemstore-icons"></div>
<div class="shop_{:item.classes}"></div>
{/}
{:item.text}
</div>