Files
dss/templates/views/UserProfileView.html
2014-02-08 23:43:30 +00:00

157 lines
8.1 KiB
HTML

<div class="row">
<div class="col-xs-12">
<div class="hr dotted clearfix"></div>
<div id="user-profile-1" class="user-profile row">
<div class="col-xs-12 col-sm-3 center">
<div>
<span class="profile-picture">
<img id="avatar"
class="editable img-responsive image-user-profile"
alt="Avatar Image"
src="<%= avatar_image %>">
</span>
<div class="space-4"></div>
<div class="width-80 label label-info label-xlg arrowed-in arrowed-in-right">
<div class="inline position-relative">
<a href="#" class="user-title-label dropdown-toggle" data-toggle="dropdown">
<i class="fa fa-circle light-green middle"></i>
&nbsp;
<span class="white"><%= display_name %></span>
</a>
<ul class="align-left dropdown-menu dropdown-caret dropdown-lighter">
<li class="dropdown-header"> Change Status</li>
<li>
<a href="#">
<i class="fa fa-circle green"></i>
&nbsp;
<span class="green">Available</span>
</a>
</li>
<li>
<a href="#">
<i class="fa fa-circle red"></i>
&nbsp;
<span class="red">Busy</span>
</a>
</li>
<li>
<a href="#">
<i class="fa fa-circle grey"></i>
&nbsp;
<span class="grey">Invisible</span>
</a>
</li>
</ul>
</div>
</div>
</div>
<div class="space-6"></div>
<div class="profile-contact-info">
<div class="profile-contact-links align-left">
{% if user.is_authenticated %}
<a id="follow-button" class="btn btn-link <% if (is_following) { %> following-disabled <% } %>" data-bypass="true">
<i class="fa fa-plus-sign bigger-120 <% if (is_following) { %>red<% } else { %>green <%}%>"></i>
<% if (is_following) { %>Unfollow<% } else { %>Follow<%}%>
</a>
{% else %}
<a id="follow-button-login" class="btn btn-link" data-bypass="true">
<i class="fa fa-plus-sign bigger-120 green"></i>
Login to follow
</a>
{% endif %}
<br>
{% comment %}
<a class="btn btn-link" href="#">
<i class="fa fa-envelope bigger-120 pink"></i>
Send a message
</a>
{% endcomment %}
<a class="btn btn-link" href="<%= url %>">
<i class="fa fa-globe bigger-125 blue"></i>
Profile Link
</a>
</div>
<div class="space-6"></div>
{% comment %}
<div class="profile-social-links center">
<a href="#" class="tooltip-info" title="" data-original-title="Visit my Facebook">
<i class="middle fa fa-facebook-sign fa fa-2x blue"></i>
</a>
<a href="#" class="tooltip-info" title="" data-original-title="Visit my Twitter">
<i class="middle fa fa-twitter-sign fa fa-2x light-blue"></i>
</a>
<a href="#" class="tooltip-error" title="" data-original-title="Visit my Pinterest">
<i class="middle fa fa-pinterest-sign fa fa-2x red"></i>
</a>
</div>
{% endcomment %}
</div>
</div>
<div class="col-xs-12 col-sm-9">
<div class="center">
<a href="/user/<%= slug %>/mixes" class="btn btn-app btn-sm btn-pink">
<i class="fa fa-music bigger-230"></i>
<span class="smaller-90">Mixes</span>
<span class="badge badge-warning"><%= mix_count%></span>
</a>
<a href="/user/<%= slug %>/favourites" class="btn btn-app btn-sm btn-danger">
<i class="fa fa-star bigger-230"></i>
<span class="smaller-90">Favourites</span>
<span class="badge badge-warning"><%= favourite_count %></span>
</a>
<a href="/user/<%= slug %>/likes" class="btn btn-app btn-sm btn-purple">
<i class="fa fa-heart /bigger-230"></i>
<span class="smaller-90">Likes</span>
<span class="badge badge-warning"><%= like_count %></span>
</a>
<a href="/user/<%= slug %>/followers" class="btn btn-app btn-sm btn-default">
<i class="fa fa-check bigger-230"></i>
<span class="smaller-90">Followers</span>
<span class="badge badge-warning"><%= followers.length %></span>
</a>
<a href="/user/<%= slug %>/following" class="btn btn-app btn-sm btn-warning">
<i class="fa fa-share bigger-230"></i>
<span class="smaller-90">Following</span>
<span class="badge badge-warning"><%= following.length %></span>
</a>
</div>
<div class="space-12"></div>
<div class="profile-user-info profile-user-info-striped">
<div class="profile-info-row">
<div class="profile-info-name"> Location</div>
<div class="profile-info-value">
<i class="fa fa-map-marker light-orange bigger-110"></i>
<span class="usereditable" id="city" style="display: inline;"><%= city %></span>
<span class="usereditable" id="country" style="display: inline;"><%= country %></span>
</div>
</div>
<div class="profile-info-row">
<div class="profile-info-name"> Joined</div>
<div class="profile-info-value">
<span id="signup" style="display: inline;"><%= humanise(date_joined) %></span>
</div>
</div>
<div class="profile-info-row">
<div class="profile-info-name"> Last Online</div>
<div class="profile-info-value">
<span id="login" style="display: inline; background-color: rgba(0, 0, 0, 0);"><%= humanise(last_login) %></span>
</div>
</div>
<div class="profile-info-row">
<div class="profile-info-name"> About Me</div>
<div class="profile-info-value">
<div class="usereditable" id="about" style="display: inline; white-space:pre-wrap;"><%= description %></div>
</div>
</div>
</div>
<div class="space-20"></div>
</div>
</div>
</div>
</div>