<div class="cn-metabar js-cn-metabar qa-cn-metabar flex flex--verticalCenter flex--nowrap mg-b-3">
  <div class="cn-metabar__title js-cn-metabar__title qa-cn-metabar__title card card--row card--sm flex__item flex__item--grow mg-r-1 cn-card">
    <div class="card__layout">
      {{#if vodModel.game}}
        {{#link-to-game vodModel.game data-tt_medium='twitch_vod' data-tt_content='current_game'}}
          <figure class="card__img card__img--boxart">
            <img src={{boxArt}}>
          </figure>
        {{/link-to-game}}
      {{/if}}
      <div class="card__body">
        <h3 class="card__title js-card__title qa-card__title cn-card__title">
          {{vodModel.title}}
          <span class='cn-metabar__timeago js-cn-metabar__timeago qa-cn-metabar__timeago'> &bull; {{relative-time date=vodModel.recordedDate relativeDayCutoff="Infinity"}}</span>
        </h3>
        <p class="card__info js-card__info qa-card__info cn-card__info">
          {{#if isCreative}}
            {{#link-to "directory.creative" data-tt_medium='twitch_vod' data-tt_content='current_game'}}{{i18n 'Creative'}}{{/link-to}}
          {{else if vodModel.game}}
            {{#link-to-game vodModel.game data-tt_medium='twitch_vod' data-tt_content='current_game'}}{{vodModel.game}}{{/link-to-game}}
          {{/if}}
        </p>
      </div>
    </div>
  </div>

  <div class="cn-metabar__more flex flex__item flex--verticalCenter flex__item--noShrink">
    <div class="cn-metabar__viewcount js-cn-metabar__viewcount qa-cn-metabar__viewcount flex__item mg-l-1 mg-r-1">
      <div class="balloon-wrapper">
        <figure class="icon cn-metabar__icon">
          {{partial 'svg/glyph-views'}}
        </figure>
        {{commatized vodModel.views}}
        <div class="balloon balloon--tooltip balloon--down balloon--center">
          {{t 'general.Twitch.totalViews'}}
        </div>
      </div>
    </div>
    {{#if isEditable}}
      <button {{action "openEditModal"}} class='cn-edit-link js-cn-edit-link qa-cn-edit-link button button--text button--icon'>
        <figure class='icon'>{{partial 'svg/edit'}}</figure>
        {{t 'general.forms.edit'}}
      </button>
      {{#common/modal-dialog
        showModal=isEditing
        onClose=(action 'closeEditModal')
        size='containerMd'}}
        {{manager/video-uploads/form
              video=vodModel
              inVideoManager=false
              onComplete=(action 'closeEditModal')}}
      {{/common/modal-dialog}}
    {{/if}}
    {{share-box
      content=vodModel
      type="video"
      label=(t 'general.forms.share')
    }}
    {{channel-options channel=channel video=vodModel}}
  </div>

</div>
