<detailheader
  breadcrumbitems="$ctrl.breadcrumbitems" editmode="false"
  headertitle="{{$ctrl.title}}" taskstatusreadonly="true"
  taskstatus="$ctrl.chapter.status">
</detailheader>

<div class="detail-content-no-header-subtitle">
  <div class="container full-height">
    <div class="row">
      <div class="col-xs-6 col-sm-4 col-md-4 col-lg-3">
        <card cardid="'reason'" cardtitle="jsp.chapter.thumbnail.reason.title"
          dimension="normal"
          dndenabled="false"
          family="chapterinfo"
          selectfunction="$ctrl.selectChapterInfo(id)"
          text="jsp.chapter.thumbnail.reason.description"
          status="$ctrl.chapter.reason.status"></card>
      </div>
      <div class="col-sm-4 col-md-4 col-lg-3">
        <card cardid="'notes'" cardtitle="common_notes_title"
          dimension="normal"
          dndenabled="false"
          family="chapterinfo"
          selectfunction="$ctrl.selectChapterInfo(id)"
          text="common_notes_description"></card>
      </div>
    </div>
  </div>
</div>

<!-- SCENES -->
<div class="container">
  <cardgrid
    carddimension="normal"
    dndenabled="true"
    dropfunction="$ctrl.moveScene(draggedObjectId, destinationObjectId)"
    family="scenes"
    emptylisttext="jsp.chapter.bibiscoEmptyThumbnailListBox.text"
    emptylistbuttonlabel="jsp.chapter.a.createFirstScene"
    emptylistbuttonfunction="$ctrl.createScene()"
    emptylistbuttontooltip="{{'scene_firstcreate_tooltip'+$root.os}}"
    items="$ctrl.scenescardgriditems"
    pageheaderbuttonhotkey="$ctrl.hotkeys"
    pageheaderbuttonlabel="jsp.chapter.a.createScene"
    pageheaderbuttonfunction="$ctrl.createScene()"
    pageheaderbuttontooltip="{{'scene_create_tooltip'+$root.os}}"
    pageheadertitle="jsp.chapter.scene.h2"
    pageheadertipcode="scenesdndTip"
    selectfunction="$ctrl.selectScene(id)"
    type="half-bottom-detail">
  </cardgrid>
</div>

<div class="detail-footer bibiscoNotSelectableText">
  <div class="container">
    <div class="row detail-footer-top">
      <span class="pull-left">
        <span class="label label-primary">{{"tag.bibiscoRichTextEditor.span.lastsave" | translate}}: {{'timestamp_format' | translate:{date:$ctrl.chapter.lastsave} }}</span>
      </span>
      <span class="pull-right">
        <span class="label label-info">{{"common_words" | translate}}: {{$ctrl.chapter.words}}</span>
        <span class="label label-info">{{"jsp.common.span.characters" | translate}}: {{$ctrl.chapter.characters}}</span>
      </span>
    </div>
    <div class="row">
      <hr />
    </div>
    <div class="row">
      <span class="pull-right">
        <dropdownmenu buttonlabel="jsp.common.button.more" 
          items="$ctrl.actionitems" open="up" visible="true">
        </dropdownmenu>
        <buttonback fixedpath="$ctrl.backpath"></buttonback>
      </span>
    </div>
  </div>
</div>