jam-cloud/web/app/views/clients/_account.html.erb

<div class="content">
<!-- Account Summary Dialog -->
    <div layout="screen" layout-id="account" class="screen secondary">
        <!-- header -->
        <div class="content-head">
            <div class="content-icon">
                <%= image_tag "content/icon_account.png", {:height => 18, :width => 18} %>
            </div>
            <h1>my account</h1>
            <%= render "screen_navigation" %>
        </div>
        <!-- end header -->

        <div class="content-body">
            <!-- profile scrolling area -->
            <div id="account-content-scroller" class="content-body-scroller account-content-scroller">

            </div>
            <!-- end content scrolling area -->
        </div>
    </div>

    <script type="text/template" id="template-account-main">
      <!-- content wrapper -->
      <div class="content-wrapper account">
        <br />

        <div class="account-left">
          <h2>sessions: </h2>
        </div>
        <div class="account-mid sessions">
          {{data.session}}
        </div>
        <div class="right">
          <a id="account-scheduled-sessions-link" href="#" class="button-orange">VIEW</a>
        </div>
        <br clear="all" />
        <hr/>

        {% if (data.isNativeClient) { %}
          <div class="account-left">
            <h2>audio gear:</h2>
          </div>

          <div class="account-mid audio">
            <strong>Profiles:</strong> <span class="audio-profiles-short">{{data.validProfiles}}</span>
          </div>

          <div class="right">
            <a id="account-edit-audio-link" href="#" class="button-orange">UPDATE</a>
          </div>
          <br clear="all" />
          <hr />

        {% } %}

        <% if (Rails.application.config.video_available && Rails.application.config.video_available != "none") || (current_user && current_user.admin) %>

          <div class="account-left">
            <h2>video gear:</h2>
          </div>

          <div class="account-mid video">
            <strong>webcam:</strong> {{data.webcamName}}<br />
          </div>

          <div class="right">
            <a id="account-edit-video-link" href="#" class="button-orange">UPDATE</a>
          </div>
          <br clear="all" />
          <hr />
        <% end %>


        <div class="account-left">
          <h2>identity:</h2>
        </div>

        <div class="account-mid identity">
          <strong>Email:</strong> {{data.email}}<br />
          <strong>Password:</strong> &bull;&bull;&bull;&bull;&bull;&bull;&bull;&bull;&bull;&bull;&bull;
        </div>

        <div class="right">
          <a id="account-edit-identity-link" href="#" class="button-orange">UPDATE</a>
        </div>
        <br clear="all" />

        <hr />


        <div class="account-left">
          <div class="right small mr20" style="margin-top:4px;">
            <a href="#" class="avatar_large"><img src="{{data.photoUrl}}" id="profile-avatar" /></a>
          </div>
          <h2>profile:</h2>
        </div>

        <div class="account-mid profile">
          <div class="whitespace">
            <strong>Name:</strong> {{data.name}}<br />
            <strong>Location:</strong> {{data.location}}<br />
            <strong>Instruments:</strong> {{data.instruments}}
          </div>
        </div>

        <div class="right">
          <a href="#" class="account-edit-profile-link button-orange">UPDATE</a>
        </div>
        <br clear="all" />

        <hr />

        <div class="account-left">
          <h2>jamtracks:</h2>
        </div>

        <div class="account-mid subscriptions">
          <strong class="jamtrack-license-detail">
            {{data.licenseDetail}}
          </strong>
          <br clear="all" />
          <a href="/corp/terms#purchasing-jamtracks" rel="external" class="view-license" id="account-view-license-link">JamTracks License</a>
        </div>

        <div class="right">
          <a id="account-my-jamtracks-link" href="#" class="button-orange">VIEW</a>
        </div>
        <br clear="all" />

        {% if (data.musician) { %}
          <hr />

          <div class="account-left">
            <h2>payments:</h2>
          </div>

          <div class="account-mid payments">
            <div class="whitespace">
              {% if (data.sales_count == 0) { %}
                You have made no purchases.
              {% } else { %}
                You have made {{data.sales_count}} purchase{{data.sales_count == 1 ? '' : 's'}}.
              {% } %}
            </div>
          </div>

          <div class="right">
            <a id="account-payment-history-link" href="#" class="button-orange">VIEW</a>
          </div>
          <br clear="all" />

        {% } %}

          <hr />

          <div class="account-left">
            <h2>affiliate:</h2>
          </div>

          {% if (data.is_affiliate_partner) { %}
          <div class="account-mid affiliate">
            <div class="whitespace">
              <span class="user-referrals">You have referred {{ data.affiliate_referral_count }} users to date.</span>
              <br />
              <span class="affiliate-earnings">You have earned ${{ data.affiliate_earnings }} to date.</span>
            </div>
          </div>
          <div class="right">
            <a id="account-affiliate-partner-link" href="#" class="button-orange">VIEW</a>
          </div>
          {% } else { %}
          <div class="account-mid affiliate">
            <div class="whitespace">
              <span class="not-affiliated">You are not currently a JamKazam affiliate.</span>
              <br />
              <a href="/affiliateProgram" rel="external" class="learn-affiliate">Learn how you can earn cash simply by telling your friends and followers about JamKazam.</a>
            </div>
          </div>
          {% } %}
         <br clear="all" />

      </div>
      <!-- end content wrapper -->
    </script>
</div>