(function(global){
  'use strict';

  // ——————————————————————————————————————
  // 데이터
  // ——————————————————————————————————————
  const delivery_table_info = {
    table_class : 'table is-striped is-hoverable is-fullwidth delivery',
    caption     : '배송 슬롯(투입구) 시간별 Open/Closed 상황',
    days        : ['월', '화', '수', '목', '금'],
    contents    : [
      { time: '09:00 - 10:00', content: ['Closed', 'Open', 'Open', 'Closed', 'Closed'] },
      { time: '10:00 - 11:00', content: ['Open', 'Open', 'Open', 'Open', 'Closed']     },
      { time: '11:00 - 12:00', content: ['Closed', 'Open', 'Open', 'Open', 'Open']     },
      { time: '13:00 - 14:00', content: ['Open', 'Open', 'Open', 'Open', 'Open']       },
    ]
  };

  // ——————————————————————————————————————
  // DOM 스크립팅
  // ——————————————————————————————————————
  const demo = document.querySelector('.demo');

  
  /// ES6 Template Literals(Strings)
  /// 백틱(`), 인터폴레이션(${})을 사용하여 HTML 템플릿 코드를 수정해봅니다.
  
  // 렌더 테이블 함수
  // HTML 템플릿 + 데이터 바인딩
  function renderTable(container, data) {
    let table_template = '\
      <table class="' + data.table_class + '">\
        <caption class="a11y-hidden">' + data.caption + '</caption>\
        <thead>\
          <tr>\
            <td>&nbsp;</td>\
    ';

    const days = data.days;
    for ( let i=0, l=days.length; i<l; i++ ) {
      table_template += '\
            <th scope="col">'+ days[i] + '</th>\
      ';
    }

    table_template += '\
          </tr>\
        </thead>\
        <tbody>\
    ';

    const contents = data.contents;
    for ( let i=0, l=contents.length; i<l; i++ ) {
      const context = contents[i];
      table_template += '\
          <tr>\
            <th scope="row">' + context.time + '</th>\
      ';
      const content = context.content;
      for ( let i=0, l=content.length; i<l; i++ ) {
        table_template += '\
            <td>' + content[i] + '</td>\
        ';
      }
      table_template += '\
          </tr>\
      ';
    }

    table_template += '\
        </tbody>\
      </table>\
    ';

    container.innerHTML = table_template;
  }

  // 함수 실행
  renderTable(demo, delivery_table_info);

})(window);