michahell/pinbored-nwjs

<div class="row">

  <div class="bookmark-item-right link-item-toolbar">
    <div class="form-group">
      <div class="btn-toolbar">
        <div class="btn-group">
          <a class="btn btn-inverse btn-sm" ng-click="staleCheck(item)" stop-event 
          href="javascript: void(0)"><span class="fui-eye"></span></a>
          <a class="btn btn-inverse btn-sm" ng-click="toggleEdit()" stop-event
          href="javascript: void(0)"><span class="fui-new"></span></a>
          <a class="btn btn-inverse btn-sm" ng-click="delete()" stop-event
          href="javascript: void(0)"><span class="fui-cross"></span></a>
        </div>
      </div>
    </div>

    <div id="stale-indicator" class="clearfix">
      <div class="stale-indicator-container">
        <small>
          <!-- STALE ICON STATES -->
          <span class="label label-info" ng-show="item.status.staleness === 'unknown'"
          tooltip-placement="{{$first && ('left') || ('top')}}" uib-tooltip="bookmark health unknown">
            <span class="glyphicon glyphicon glyphicon-question-sign"></span>
          </span>
          <span class="label label-info" ng-show="item.status.staleness === 'checking'"
          tooltip-placement="{{$first && ('left') || ('top')}}" uib-tooltip="bookmark is being checked...">
            <span class="glyphicon glyphicon glyphicon-refresh"></span>
          </span>
          <span class="label label-success" ng-show="item.status.staleness === 'healthy'"
          tooltip-placement="{{$first && ('left') || ('top')}}" uib-tooltip="bookmark is healthy!">
            <span class="glyphicon glyphicon glyphicon-ok-sign"></span>
          </span>
          <span class="label label-danger" ng-show="item.status.staleness === 'dead'"
          tooltip-placement="{{$first && ('left') || ('top')}}" uib-tooltip="bookmark is (probably) stale">
            <span class="glyphicon glyphicon-exclamation-sign"></span>
          </span>
          <!-- STALE ICON STATES -->
          <span class="label label-success" ng-show="item.data.toread === 'yes'"
          tooltip-placement="{{$first && ('left') || ('top')}}" uib-tooltip="bookmark is 'to read'">
            <span class="glyphicon glyphicon-book"></span>
          </span>
          <span class="label" ng-class="{'label-success': item.data.shared === 'no', 'label-danger': item.data.shared === 'yes'}"
          tooltip-placement="{{$first && ('left') || ('top')}}" uib-tooltip="{{getSharedDescription()}}">
            <span class="glyphicon glyphicon-lock"></span>
          </span>
        </small>
      </div>
    </div>

  </div>

  <div class="bookmark-item-left">
    <div class="bookmark-item-inner">
      <small ng-bind-html="item.data.description | wordcut : true : 100 | highlight:filter.text" class="list-group-item-heading"></small>
      <br/>
      <small>
        <a class="" href="javascript: void(0)" 
        ng-click="openBookmark(item.data.href)" stop-event>{{item.data.href | limitTo : 90}}</a>
      </small>
      <br/>
      <div class="tagContainer">
        <small>
          <span ng-repeat="tag in tagsToArray()" ng-click="clickTag(tag)" stop-event
          class="label label-success clickabletag" ng-class="{'highlightedtag':checkTagHighlight(tag)}">{{tag}}</span>
        </small>
      </div>
    </div>
  </div>

  <div class="hiddenContent clearfix" ng-show="item.status.showEdit" stop-event>

    <div class="hiddenContentContainer" ng-show="item.status.showEdit" stop-event>

      <div class="row">
        <div class="col-xs-12">
          <div class="form-group">
            <input ng-model="item.data.description" class="form-control hiddeninputs input-sm col-xs-4" type="text" stop-event>
          </div>
        </div>
      </div>

      <div class="row">
        <div class="col-xs-12">
          <div class="form-group">
            <input ng-model="item.data.href" class="form-control hiddeninputs input-sm col-xs-4" type="text" stop-event>
          </div>
        </div>
      </div>

      <div class="row">
        <div class="col-xs-12">
          <div class="form-group">
            <textarea msd-elastic ng-model="item.data.extended" placeholder="no extended description." 
            class="form-control hiddeninputs input-sm col-xs-4" rows="2" stop-event>
            </textarea>
          </div>
        </div>
      </div>

      <div class="row">
        <div class="col-xs-12">
          <!-- <div class="form-group"> -->
            <tags-input ng-model="itemproxy.tags" ng-keyup="showItemproxyTags()" ng-click="showItemproxyTags()"
            on-tag-added="updateItemProxyTags($tag)" on-tag-removed="updateItemProxyTags($tag)" 
            placeholder="add a tag">
              <auto-complete source="loadTagItems($query)"></auto-complete>
            </tags-input>
          <!-- </div> -->
        </div>
      </div>

      <div class="row editbuttonbar">
        <div class="col-xs-4">

          <div class="btn-group">
            <button class="btn btn-primary btn-wide btn-sm" ng-model="itemproxy.shared" uib-btn-checkbox>
              shared <span class="btn-tip">{{itemproxy.shared === true ? 'YES' : 'NO'}}</span>
            </button>
            <button class="btn btn-primary btn-wide btn-sm" ng-model="itemproxy.toread" uib-btn-checkbox>
              to read <span class="btn-tip">{{itemproxy.toread === true ? 'YES' : 'NO'}}</span>
            </button>
          </div>

        </div>
        
        <div class="col-xs-4">
          
        </div>

        <div class="col-xs-4 pull-right">
          <a class="btn btn-success btn-wide btn-sm" ng-class="{disabled: item.status.hasChanged === false}" 
          ng-click="update()" href="javascript: void(0)" stop-event>update</a>
          <a class="btn btn-primary btn-wide btn-sm" ng-class="{disabled: item.status.hasChanged === false}"
          ng-click="reset()" href="javascript: void(0)" stop-event>reset</a>
        </div>

      </div>

    </div>

  </div>
  
</div>