{% verbatim %}
<div id="title-area">
    <p class="page-header">User details</p>
</div>
<div id="layout-area" class="hero-well">
    <div class="row">
        <form enctype="multipart/form-data" method="post" class="form-horizontal" id="id-new-user-form">
            <input type="hidden" name="id" value="<%= id %>"/>
            <fieldset>
                <div class="col-md-5">
                    <div class="clearfix control-group" id="div_display_name">
                        <label class="control-label" for="display_name">Display name</label>

                        <div class="controls">
                            <input type="text" maxlength="75" name="display_name" class="col-xs-10"
                                   id="display_name"
                                   value="<%= display_name %>">
                        </div>
                    </div>
                    <div class="clearfix control-group" id="div_slug">
                        <label class="control-label" for="slug">Profile Slug</label>

                        <div class="controls">
                            <input type="text" maxlength="75" name="slug" class="col-xs-10"
                                   id="slug"
                                   value="<%= slug %>">
                        </div>
                    </div>
                    <div class="clearfix control-group" id="div_email">
                        <label class="control-label" for="email">E-mail address</label>

                        <div class="controls">
                            <input type="text" maxlength="75" name="email" class="col-xs-10" id="email"
                                   value="<%= email %>">
                        </div>
                    </div>
                    <div class="clearfix control-group" id="div_avatar_image_select">
                        <label class="control-label requiredField" for="avatar_image_select_0">Avatar Image
                            <span class="asteriskField">*</span></label>

                        <div class="controls">
                            <label class="radio">
                                Use gravatar image.
                                <input type="radio" id='avatar_gravatar' value='gravatar' name="avatar_type"/>
                            </label>
                            <label class="radio">
                                Use Twitter/Facebook image.
                                <input type="radio" id='avatar_social' value='social' name="avatar_type"/>
                            </label>
                            <label class="radio">
                                Use custom image.
                                <input type="radio" id='avatar_custom' value='custom' name="avatar_type"/>
                            </label>
                        </div>
                    </div>
                    <p id="custom_avatar_helptext" class="text-warning bigger-110 orange">
                        <i class="fa fa-warning-sign"></i>
                        Choose your custom image in your Profile Page
                    </p>
                </div>
                <div class="col-md-7">
                    <div class="row">
                        <p>
                        <h5>What can we share about you?</h5>
                        </p>
                        <div class="col-md-5 pull-left">
                            <h5>Share this activity</h5>
                            <table class="table dss-option-table table-condensed table-bordered">
                                <tbody>
                                <tr class="info">
                                    <td>Likes</td>
                                    <td>Favourites</td>
                                    <td>Comments</td>
                                </tr>
                                <tr>
                                    <td>
                                        <input type="checkbox" name="activity_sharing_likes"
                                               id="activity_sharing_likes" <%= renderCheckbox(activity_sharing_likes)
                                        %>>
                                    </td>
                                    <td>
                                        <input type="checkbox" name="activity_sharing_favourites"
                                               id="activity_sharing_favourites"
                                               <%= renderCheckbox(activity_sharing_favourites) %>>
                                    </td>
                                    <td>
                                        <input type="checkbox" name="activity_sharing_comments"
                                               id="activity_sharing_comments"
                                               <%= renderCheckbox(activity_sharing_comments) %>>
                                    </td>
                                </tr>
                                </tbody>
                            </table>
                        </div>
                        <div class="col-md-5 pull-right">
                            <h5>On these networks</h5>
                            <table class="table dss-option-table table-condensed table-bordered">
                                <tbody>
                                <tr class="info">
                                    <td>Facebook</td>
                                    <td>Twitter</td>
                                </tr>
                                <tr>
                                    <td style="text-align: center;  vertical-align: middle">
                                        <input type="checkbox" name="activity_sharing_networks_facebook"
                                                <%= renderCheckbox(activity_sharing_networks_facebook) %>>
                                    </td>
                                    <td>
                                        <input type="checkbox" name="activity_sharing_networks_twitter"
                                                <%= renderCheckbox(activity_sharing_networks_twitter) %>>
                                    </td>
                                </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </fieldset>
        </form>
    </div>
    <div class="row">
        <div class="form-actions">
            <button id="save-changes" class="btn">Save changes</button>
        </div>
    </div>
</div>
{% endverbatim %}