krikkert/habitica
1
0
Fork 0
mirror of https://github.com/HabitRPG/habitica.git synced 2025-12-18 07:07:35 +01:00
Code Issues Packages Projects Releases Wiki Activity

progress bars using bootstrap

Browse Source
This commit is contained in:
Tyler Renelle
2012-06-20 18:34:15 -04:00
parent 9e9823c10f
commit 541ab5c656
2 changed files with 17 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
src/app/index.coffee
View File

@@ -33,7 +33,6 @@ newUser = (model, userId) ->
0: {id: 0, type: 'reward', text: '1 TV episode', notes: '', price: 20 } 0: {id: 0, type: 'reward', text: '1 TV episode', notes: '', price: 20 }
rewardIds: [0] rewardIds: [0]
get '/', (page, model) -> get '/', (page, model) ->
# Render page if a userId is already stored in session data # Render page if a userId is already stored in session data
userId = model.get '_session.userId' userId = model.get '_session.userId'
@@ -61,14 +60,18 @@ view.fn 'taskClasses', (type, completed) ->
classes += " completed" if completed classes += " completed" if completed
return classes return classes
view.fn "percent", (x, y) ->
x=1 if x==0
Math.round(x/y*100)
view.fn "round", (num) -> view.fn "round", (num) ->
Math.round num Math.round num
view.fn "gold", (num) -> view.fn "gold", (num) ->
num.toFixed(1).split('.')[0] num.toFixed(1).split('.')[0] if num
view.fn "silver", (num) -> view.fn "silver", (num) ->
num.toFixed(1).split('.')[1] num.toFixed(1).split('.')[1] if num
## CONTROLLER FUNCTIONS ## ## CONTROLLER FUNCTIONS ##

15
views/app/index.html
View File

@@ -64,11 +64,18 @@
<b><div id="lvl">Lvl: {_user.lvl}</div></b> <b><div id="lvl">Lvl: {_user.lvl}</div></b>
</td> </td>
<td id="bars"> <td id="bars">
<div id="hp-bar" style="width:400px;"> <div class="progress progress-danger">
<span id="hp">HP: {round(_user.hp)}</span> <div class="bar" style="width: {percent(_user.hp,50)}%;">
<span id="hp">HP: {round(_user.hp)} / 50</span>
</div>
</div> </div>
<div id="tnl-bar" style="width:400px;">
<span id="tnl">Exp: {round(_user.exp)} / {_tnl}</span> <div class="progress progress-warning">
<div class="bar" style="width: {percent(_user.exp,_tnl)}%;">
<span id="tnl">Exp: {round(_user.exp)} / {_tnl}</span>
</div>
</div>
</div> </div>
</td> </td>
</tr> </tr>