<div class="x_panel">
  <div class="x_title">
    <h2>{{ mt._('_common.generalinfo') }}</h2>
    <div class="clearfix"></div>
  </div>

  <div class="x_content">
    <div class="row" style="padding-bottom:10px">
      <div class="col-md-6">
        <div class="row">
          <label for="edit-cdcata" class="control-label col-md-4 col-sm-4 col-xs-12" style="text-align:right;margin-top:13px">
            {{ mt._('_common.catalog') }}
          </label>
          <div class="col-md-8 col-sm-8 col-xs-12">
            <input type="text" id="edit-cdcata" name="edit-cdcata" class="form-control" value="{{ lookbook.cdcata }}" disabled>
          </div>
        </div>
        <div class="row" style="padding-top:23px">
          <label for="edit-cdlkbk" class="control-label col-md-4 col-sm-4 col-xs-12" style="text-align:right;margin-top:13px">
            {{ mt._('_common.code') }}
          </label>
          <div class="col-md-8 col-sm-8 col-xs-12">
            <input type="text" id="edit-cdlkbk" name="edit-cdlkbk" class="form-control" value="{{ lookbook.cdlkbk }}" disabled>
          </div>
        </div>
        <div class="row" style="padding-top:23px">
          <label for="edit-dslkbk" class="control-label col-md-4 col-sm-4 col-xs-12" style="text-align:right;margin-top:13px">
            {{ mt._('_common.description') }}
          </label>
          <div class="col-md-8 col-sm-8 col-xs-12">
            <input type="text" id="edit-dslkbk" name="edit-dslkbk" class="form-control" value="{{ lookbook.dslkbk }}" maxlength="40" size="40">
          </div>
        </div>
      </div>
      <div class="col-md-2" style="text-align:center">
        <div style="font-weight:700">{{ mt._('_common.image.current') }}</div>
        <div style="width:100%" id="current-image">
          {% if img_exists(lookbook.filimg, "upload/" ~ lookbook.filimg) %}
          {{ image("upload/" ~ lookbook.filimg, 'width': 120) }}
          {% endif %}
        </div>
        {% if img_exists(lookbook.filimg, "upload/" ~ lookbook.filimg) %}
        <div style="font-weight:700"><a href="#" id="remove-current-image">{{ mt._('_common.remove') }}</a></div>
        {% endif %}
      </div>
      <div class="col-md-2 form-group">
        <form action="{{ url('admin/uploadImage') }}" class="dropzone" id="dropzone-edit-lookbook" style="width:160px"></form>
      </div>
    </div>

    <div class="row">
      <div class="col-md-6">
        <button type="button" class="btn btn-default btn-left add-page" style="width:30%">{{ mt._('admin.lookbook.addpage') }}</button>
      </div>
      <div class="col-md-6" style="text-align:right">
        <button type="button" class="btn btn-primary btn-right edit-lookbook" style="margin-right:0;width:30%"><a style="color:white">{{ mt._('_common.save') }}</a></button>
      </div>
    </div>

    <div class="row">
      <div class="col-md-12">
        <div class="msg-error">{{ mt._('_common.update.error') }}</div>
        <div class="msg-success">{{ mt._('_common.update.success') }}</div>
      </div>
    </div>

    <div class="spacer"></div>

    <div class="row" id="lookbook-pages">
      <div class="x_title">
        <h2>{{ mt._('_common.pages') }}</h2>
        <small style="clear:both;float:left">{{ mt._('admin.lookbook.edit.warning') }}</small>
        <div class="clearfix"></div>
      </div>
      <div class="x_content">
        <ul id="looks-sortable">
          {{ looksHtml }}
        </ul>
      </div>
    </div>

    <div class="spacer"></div>

    <div class="row">
      <div class="col-md-6">
        <button type="button" class="btn btn-default btn-left add-page" style="width:30%">{{ mt._('admin.lookbook.addpage') }}</button>
      </div>
      <div class="col-md-6" style="text-align:right">
        <button type="button" class="btn btn-primary btn-right edit-lookbook" style="margin-right:0;width:30%"><a style="color:white">{{ mt._('_common.save') }}</a></button>
      </div>
    </div>

    <div class="row">
      <div class="col-md-12">
        <div class="msg-error">{{ mt._('_common.update.error') }}</div>
        <div class="msg-success">{{ mt._('_common.update.success') }}</div>
      </div>
    </div>

  </div>

</div>

<!-- Modal for choosing models -->
<div class="modal fade bs-modal-choose-items" tabindex="-1" role="dialog" aria-hidden="true">
  <div class="modal-dialog modal-sm" style="width:85%">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="{{ mt._('_common.close') }}"><span aria-hidden="true">×</span></button>
        <h4 class="modal-title">{{ mt._('admin.lookbook.new') }}</h4>
      </div>
      <div class="modal-body">
        {% if lookType == 0 %}
        <div class="row" style="padding-bottom:10px">
          <div class="col-md-12"><select multiple="multiple" size="10" name="duallistbox_items"></select></div>
        </div>
        {% else %}
        <div class="modal-section" style="padding-bottom:10px">
          <div class="row">
            <div class="col-md-12 ui-sortable" id="current-items"></div>
          </div>
        </div>
        <div class="row center" style="padding-top:10px">
          <div class="col-md-4">
            <div>{{ mt._('_common.model') }}</div>
            <div style="padding-top:10px;height:44px">
              <input type="text" id="model-look-search" class="form-control"/>
            </div>
            <div id="model-results" style="padding-top:20px">

            </div>
          </div>
          <div class="col-md-4">
            <div>{{ mt._('_common.tissue') }}</div>
            <div id="model-selected" style="padding-top:10px;height:44px"></div>
            <input type="hidden" id="cdartn-selected"/>
            <div id="fabric-results" style="padding-top:20px">

            </div>
          </div>
          <div class="col-md-4">
            <div>{{ mt._('_common.color') }}</div>
            <div id="fabric-selected" style="padding-top:10px;height:44px"></div>
            <input type="hidden" id="cdpers-selected"/>
            <div id="color-results" style="padding-top:20px">

            </div>
          </div>
        </div>
        {% endif %}
      </div>
      <div class="modal-footer">
        <div class="row">
          <div class="col-md-6">
            <button type="button" class="btn btn-default left-btn" style="width:50%" data-dismiss="modal">{{ mt._('_common.close') }}</button>
          </div>
          <div class="col-md-6">
            <button type="button" class="btn btn-primary right-btn" id="save-items-look" style="width:50%">{{ mt._('_common.save') }}</button>
          </div>
        </div>
        <div class="row">
          <div class="col-md-12">
            <div class="msg-error">{{ mt._('_common.update.error') }}</div>
            <div class="msg-success">{{ mt._('_common.update.success') }}</div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

<!-- Modal for assign images -->
<div class="modal fade bs-modal-assign-images" tabindex="-1" role="dialog" aria-hidden="true">
  <div class="modal-dialog modal-lg" style="width:80%">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="{{ mt._('_common.close') }}"><span aria-hidden="true">×</span></button>
        <h4 class="modal-title">{{ mt._('_common.articles') }}</h4>
      </div>
      <input type="hidden" value="" id="edit-cdartn" />
      <input type="hidden" value="" id="position-cdartn" />
      <div class="modal-body">
        <div class="modal-edit-model-section">
          <div class="x_content assign-images-section">
            <div class="row" style="border-bottom:1px solid #e6e9ed;padding:10px 0">
              <div class="col-md-3">{{ mt._("_common.article") }}</div>
              <div class="col-md-3">{{ mt._("_common.tissue") }}</div>
              <div class="col-md-2">{{ mt._("_common.color") }}</div>
              <div class="col-md-4">{{ mt._("_common.image") }}</div>
            </div>
            <div id='table-modal-assign-images'>

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

      <div class="modal-footer">
        <div class="row">
          <div class="col-md-6">
            <button type="button" class="btn btn-default left-btn" style="width:50%" data-dismiss="modal">{{ mt._('_common.close') }}</button>
          </div>
          <div class="col-md-6">
            <button type="button" class="btn btn-primary right-btn" id="assign-images-articles" style="width:50%">{{ mt._('_common.save') }}</button>
          </div>
        </div>
        <div class="row">
          <div class="col-md-12">
            <div class="msg-error">{{ mt._('_common.update.error') }}</div>
            <div class="msg-success">{{ mt._('_common.update.success') }}</div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>
