 createLinkToStatusUpdate = (createDate, slug) ->
   content =
     """
-    <a href="#{uri.address}/#!/Activity/#{slug}">#{createDate}</a>
+    <a href="#{uri.address}/#!/Activity/#{slug}"><time class="kdview">#{createDate}</time></a>
     """
   return content
 

  if statusUpdate?.body?
    statusUpdateContent =
    """
    <li itemtype="http://schema.org/Comment" itemscope itemprop="comment">
        <span itemprop="commentText">#{statusUpdate.body}</span> -
        <span itemprop="commentTime"></span>
        at #{linkToStatusUpdate}
    </li>
    """
  return statusUpdateContent


    <title>#{nickname} - Koding</title>
    #{getGraphMeta()}
  </head>
    <body class='koding profile' itemscope itemtype="http://schema.org/WebPage">
      #{putContent(account, sUpdates)}
    </body>
  </html>
  """

getDock = ->
  """
  <header id="main-header" class="kdview">
      <div class="inner-container">
          <a id="koding-logo" href="/">
              <cite></cite>
          </a>
          <div id="dock" class="">
              <div id="main-nav" class="kdview kdlistview kdlistview-navigation">
                  <a class="kdview kdlistitemview kdlistitemview-main-nav activity kddraggable running" href="/Activity" style="left: 0px;">
                      <span class="icon"></span>
                      <cite>Activity</cite>
                  </a>
                  <a class="kdview kdlistitemview kdlistitemview-main-nav teamwork kddraggable" href="/Teamwork" style="left: 55px;">
                      <span class="icon"></span>
                      <cite>Teamwork</cite>
                  </a>
                  <a class="kdview kdlistitemview kdlistitemview-main-nav terminal kddraggable" href="/Terminal" style="left: 110px;">
                      <span class="icon"></span>
                      <cite>Terminal</cite>
                  </a>
                  <a class="kdview kdlistitemview kdlistitemview-main-nav editor kddraggable" href="/Ace" style="left: 165px;">
                      <span class="icon"></span>
                      <cite>Editor</cite>
                  </a>
                  <a class="kdview kdlistitemview kdlistitemview-main-nav apps kddraggable" href="/Apps" style="left: 220px;">
                      <span class="icon"></span>
                      <cite>Apps</cite>
                  </a>
              </div>
          </div>
      </div>
  </header>
  """

putContent = (account, sUpdates)->
  getGraphMeta  = require './graphmeta'
  {profile:{nickname, firstName, lastName, about}} = account if account
  nickname or= "A koding nickname"
  firstName or= "a koding "
  lastName or= "user"
  about    or= ""

  numberOfLikes = if account.counts.likes then account.counts.likes else "0"
  numberOfFollowers = if account.counts.followers then account.counts.followers else "0"
  numberOfFollowing = if account.counts.following then account.counts.following else "0"
  imgURL = "https://gravatar.com/avatar/#{account.profile.hash}?size=90&amp;d=https%3A%2F%2Fapi.koding.com%2Fimages%2Fdefaultavatar%2Fdefault.avatar.90.png"

     # <a href="#{uri.address}">Koding</a><br />
     #  <figure itemscope itemtype="http://schema.org/Person" title="#{firstName} #{lastName}">
     #      <h2 itemprop="name">
     #        <a href="#{uri.address}/#!/#{nickname}">#{nickname}</a>
     #      </h2>
     #      <figcaption>
     #        <img src="#{imgURL}" itemprop="image"/> <br>
     #        <a href="#{uri.address}/#!/#{nickname}">
     #          <span itemprop="givenName">#{firstName}</span>
     #          <span itemprop="familyName">#{lastName}</span>
     #        </a>
     #        <br>
     #        <span itemprop="interactionCount">#{numberOfLikes} likes.</span>
     #      </figcaption>
     #   </figure>
     #   #{sUpdates}


  content  =
    """
    <div id="kdmaincontainer" class="kdview">
      #{getDock()}
      <section id="main-panel-wrapper" class="kdview">
        <div id="main-tab-view" class="kdview kdscrollview kdtabview">
          <div class="kdview kdtabpaneview content-display clearfix content-display-wrapper content-page active">
            <div class="kdview member content-display" style="min-height: 735px;">
              <div class="kdview profilearea clearfix">
                <div class="users-profile clearfix">
                  <span class="avatarview" href="/#{nickname}" style="width: 81px; height: 81px; background-size: 81px; background-image: none;">
                    <img class="" width="81" height="81" src="#{imgURL}" style="opacity: 1;">
                  </span>
                  <h3 class="full-name">
                    <span class="kdview kdcontenteditableview firstName">#{firstName}</span>
                    <span class="kdview kdcontenteditableview lastName">#{lastName}</span>
                  </h3>
                  <div class="kdview kdcontenteditableview bio">#{about}</div>
                  <div class="profilestats">
                    <a class="kdview" href="/#"><span>#{numberOfFollowers}</span>Followers</a>
                    <a class="kdview" href="/#"><span>#{numberOfFollowing}</span>Following</a>
                    <a class="kdview" href="/#"><span>#{numberOfLikes}</span>Likes</a>
                  </div>
                </div>
              </div>
              <div class="extra-wide">
                <div class="kdview kdtabview feeder-tabs">
                  <div class="kdview kdtabpaneview statuses clearfix active">
                    <div class="kdview kdlistview kdlistview-statuses activity-related">
                      <div class="kdview kdlistitemview kdlistitemview-activity">
                        #{sUpdates}
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </section>
    </div>
    """
