<!doctype html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org"
      xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout" layout:decorate="~{layout/base_layout}">
<body>

<section layout:fragment="contentFragment">
  <input type="hidden" th:name="${_csrf.parameterName}" th:value="${_csrf.token}">
  <div class="toast" role="alert" aria-live="assertive" aria-atomic="true" style="position: absolute; top: 0; left: 0;">
    <div class="toast-header">
      <strong class="mr-auto">알림</strong>
      <button type="button" class="btn-close" data-bs-dismiss="toast" aria-label="Close"></button>
    </div>
    <div class="toast-body">
    </div>
  </div>
  <div class="api-tester-layout">
    <div class="modal fade" id="new_load_test_modal" tabindex="-1" aria-labelledby="new_load_test_modal" aria-hidden="true">
      <div class="modal-dialog">
        <div class="modal-content">
          <div class="modal-header">
            <h5 class="modal-title">새로운 테스트 추가</h5>
            <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
          </div>
          <div class="modal-body">
            <input type="text" id="new_load_test_name" class="form-control" placeholder="이름을 입력하세요" aria-label="이름을 입력하세요" name="test_name" required/>
          </div>
          <div class="modal-footer">
            <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">닫기</button>
            <button type="button" class="btn btn-primary create_load_test">저장</button>
          </div>
        </div>
      </div>
    </div>
    <div class="modal fade" id="confirm_delete_modal" tabindex="-1" aria-labelledby="confirm_delete_load_test_modal" aria-hidden="true">
      <div class="modal-dialog">
        <div class="modal-content">
          <div class="modal-header">
            <h5 class="modal-title">테스트 삭제</h5>
            <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
          </div>
          <div class="modal-body">
            <div>삭제 하시겠습니까?</div>
          </div>
          <div class="modal-footer">
            <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">닫기</button>
            <button type="button" class="btn btn-primary confirm_delete_load_test">삭제</button>
          </div>
        </div>
      </div>
    </div>
    <div class="tester">
      <section class="d-flex flex-row" style="width: 100%">
        <div class="load-test-sidebar border" style="width: 200px; ">
          <div style="background: rgba(0,0,0,.03); padding: 2px;">
            테스트 목록
            <button type="button" class="btn btn-primary me-2" id="new_load_test"><i class="fa fa-plus"></i></button>
          </div>
          <div class="pt-links">
            <ul class="list-unstyled load_test_list" id="load_test_menubar">
            </ul>
          </div>
        </div>
        <div class="d-flex flex-column" style="flex: 1;">
          <div class="d-flex" style="width: 100%; height: 80px; background: rgba(0, 0, 0, .03); padding: 5px;" id="load-tester-view">
          </div>
          <div class="test-log d-flex flex-row" style="flex: 1" id="load-tester-result-view">
          </div>
        </div>
      </section>
    </div>
  </div>
</section>
</body>

<th:block layout:fragment="contentScript">
<!--  <link th:href="@{/css/goldenlayout-base.css}" rel="stylesheet"/>-->
<!--  <link th:href="@{/css/goldenlayout-light-theme.css}" rel="stylesheet"/>-->
  <script th:src="@{/plugins/apitestmanager/app.bundle.js}"></script>
  <script>

  </script>
  <script>
    $(document).ajaxError(function(event, jqxhr, settings, exception) {
      if (jqxhr.status === 401) {
        window.location.href = '[[@{/}]]';
      }
    });

    $(document).ready(function() {
      let options = {};
      options.contextPath = '[[@{/}]]';
      options.type = 'load';
      new APITestManager(options);

    });
  </script>
</th:block>
</html>

