webogram-i2p/app/partials/head.html

<div class="tg_page_head">
  <div class="navbar navbar-static-top  navbar-inverse" role="navigation" ng-class="{navbar_peer_not_selected: !curDialog.peer, navbar_offline: offline}">
    <div class="container">

      <a class="navbar-peer-wrap" ng-click="showPeerInfo()">
        <img
          my-load-thumb
          thumb="historyPeer.photo"
        />
      </a>

      <div class="navbar-toggle-wrap dropdown">
        <a class="dropdown-toggle navbar-toggle">
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
        </a>
        <ul ng-if="!curDialog.peer &amp;&amp; isLoggedIn" class="dropdown-menu">
          <li><a ng-click="openGroup()">New Group</a></li>
          <li><a ng-click="importContact()">New Contact</a></li>
          <li><a ng-click="openContacts()">Contacts</a></li>
          <li><a ng-click="openSettings()">Settings</a></li>
          <li><a ng-click="logOut()">Log Out</a></li>
        </ul>
        <ul ng-if="curDialog.peer &amp;&amp; isLoggedIn" class="dropdown-menu">
          <li><a ng-click="showPeerInfo()" ng-switch="historyPeer.id > 0">
            <span ng-switch-when="true">Profile</span>
            <span ng-switch-default>Group info</span>
          </a></li>
          <li><a ng-click="toggleEdit()">Edit chat</a></li>
          <li ng-if="!historyFilter.mediaType" class="divider"></li>
          <li ng-if="!historyFilter.mediaType" class="dropdown-header">Media</li>
          <li ng-if="!historyFilter.mediaType"><a ng-click="toggleMedia('photos')">Photos</a></li>
          <li ng-if="!historyFilter.mediaType"><a ng-click="toggleMedia('video')">Videos</a></li>
          <li ng-if="!historyFilter.mediaType"><a ng-click="toggleMedia('documents')">Documents</a></li>
          <li ng-if="!historyFilter.mediaType"><a ng-click="toggleMedia('audio')">Voice messages</a></li>
        </ul>
        <ul ng-if="!isLoggedIn" class="dropdown-menu">
          <li><a href="https://github.com/zhukov/webogram" target="_blank">About</a></li>
        </ul>
      </div>

      <a ng-if="isLoggedIn" class="navbar-search-wrap" ng-click="toggleSearch()">
        <i class="icon-search"></i>
      </a>

      <div class="im_head_attach">
        <input type="file" class="im_media_attach_input" size="28" multiple="true" accept="image/*, video/*, audio/*" title="Send media"/>
        <i class="icon icon-paperclip"></i>
      </div>

      <div class="navbar-header">

        <a class="navbar-brand" href="{{isLoggedIn ? '#/im' : '#/'}}"><span class="tg_head_logo"></span><span class="tg_head_logo_text"></span></a>
        <div ng-show="curDialog.peer" ng-switch="curDialog.peer &amp;&amp; historyFilter.mediaType.length > 0">
          <ul ng-switch-when="true" class="nav navbar-nav navbar-quick-nav">
            <li>
              <a ng-click="toggleMedia()" class="navbar-quick-media-back" ng-switch="historyFilter.mediaType">
                <i class="icon icon-back"></i>
                <h4 ng-switch-when="photos">Photos</h4>
                <h4 ng-switch-when="video">Videos</h4>
                <h4 ng-switch-when="documents">Documents</h4>
                <h4 ng-switch-when="audio">Voice messages</h4>
              </a>
            </li>
          </ul>
          <ul ng-switch-default class="nav navbar-nav navbar-quick-nav" ng-switch="historyPeer.id > 0">
            <li ng-switch-when="true">
              <a href="#/im" class="navbar-quick-profile-back">
                <i class="icon icon-back"></i>
                <h4 ng-bind-html="historyPeer.data.rFullName"></h4>
                <small ng-bind="historyPeer.data | userStatus"></small>
              </a>
            </li>
            <li ng-switch-default>
              <a href="#/im" class="navbar-quick-group-back">
                <i class="icon icon-back"></i>
                <h4 ng-bind-html="historyPeer.data.rTitle"></h4>
                <small>
                  <ng-pluralize count="historyPeer.data.participants_count"
                                   when="{'0': 'No members', 'one': '1 member', 'other': '{} members'}">
                  </ng-pluralize>
                </small>
              </a>
            </li>
          </ul>
        </div>
      </div>

      <div class="navbar-menu" ng-switch="offline">

        <ul ng-switch-when="true" class="nav navbar-nav navbar-offline">
          <li ng-show="!offlineConnecting"><span class="navbar-offline-text">Waiting for network<span my-loading-dots></span></span></li>
          <li ng-show="!offlineConnecting"><a href="" ng-click="retryOnline()">Retry</a></li>
          <li ng-show="offlineConnecting"><span class="navbar-offline-text">Connecting<span my-loading-dots></span></span></li>
        </ul>

        <ul ng-switch-default class="nav navbar-nav navbar-right">
          <li ng-if="isLoggedIn &amp;&amp; !isEmpty.contacts"><a href="" ng-click="openContacts()">Contacts</a></li>
          <li ng-if="isLoggedIn"><a href="" ng-click="openSettings()">Settings</a></li>
          <li ng-if="isLoggedIn"><a href="" ng-click="logOut()">Log Out</a></li>
          <li ng-if="!isLoggedIn"><a href="https://github.com/zhukov/webogram" target="_blank">About</a></li>
        </ul>

      </div>

    </div>
  </div>
</div>