(function () {



function render_calendar (calendar) {
  if (!calendar.dom.calendar_cont) {
    const calendar_cont = document.createElement('div');
    calendar.dom.calendar_cont = calendar_cont;
  }

  calendar.dom.calendar_cont.innerHTML = '';

  if (!calendar.state.valid_dates || !calendar.state.valid_dates.length) {
    return;
  }

  const numDays = (new Date(calendar.year, calendar.month+1, 0)).getDate()
  const offset = ((new Date(calendar.year, calendar.month, 1)).getDay() - 1 + 7) % 7
  const days = new Array(35)
  const monday = (new Date(calendar.year, calendar.month, -offset)).getDate()
  for (let i=0; i<6 * 7; i++) {
    if (i < offset) {
      days[i] = {
        n: i + monday + 1,
        month: calendar.month - 1,
        year: (calendar.month === 1 ? calendar.year - 1 : calendar.year)
      }
    }
    else if (i < offset + numDays) {
      days[i] = {
        n: i - offset + 1,
        month: calendar.month,
        year: calendar.year
      }
    }
    else {
      days[i] = {
        n: i - offset - numDays + 1,
        month: calendar.month + 1,
        year: (calendar.month === 11 ? calendar.year + 1 : calendar.year)
      }
    }
    let d = days[i]
    //d.active = calendar.state.valid_dates.indexOf(d.year+'-'+(d.month < 9 ? '0' : '')+(d.month+1)+'-'+(d.n < 10 ? '0' : '')+d.n) !== -1
  }
  const now = new Date()

  const calendar_cont = document.createElement('div');
  calendar_cont.className = 'calendar selecta_h6';
  calendar.dom.dropdown_el.appendChild(calendar_cont);
  calendar.dom.calendar_cont = calendar_cont;

  const controls_el = document.createElement('div');
  controls_el.className = 'controls';
  calendar_cont.appendChild(controls_el);

  const left_button = document.createElement('div');
  left_button.className = 'left_button '+(calendar.month <= now.getMonth() && calendar.year <= now.getFullYear() ? 'disabled' : '');
  left_button.calendar = calendar;
  controls_el.appendChild(left_button);
  left_button.addEventListener('click', calendar_handle_left_click);

  const month_el = document.createElement('div');
  month_el.className = 'month';
  month_el.innerText = (new Date(calendar.year, calendar.month)).toLocaleString('en-us', { month: 'long' }) + ' ' + calendar.year;
  controls_el.appendChild(month_el);

  const right_button = document.createElement('div');
  right_button.className = 'right_button '+(calendar.month >= now.getMonth() && calendar.year > now.getFullYear() ? 'disabled' : '');
  right_button.calendar = calendar;
  controls_el.appendChild(right_button);
  right_button.addEventListener('click', calendar_handle_right_click);

  const day_labels = [
    'Mon',
    'Tue',
    'Wed',
    'Thu',
    'Fri',
    'Sat',
    'Sun',
  ]

  for (let i=0; i<day_labels.length; i++) {
    const day_label_el = document.createElement('div');
    day_label_el.className = 'day_label selecta_p2';
    day_label_el.innerText = day_labels[i];
    calendar_cont.appendChild(day_label_el);
  }

  for (let i=0; i<days.length; i++) {
    const {n, month, year} = days[i];

    let is_active = month == calendar.month;
    const day_el = document.createElement('div');
    day_el.className = 'day '+(is_active ? 'active' : '');
    day_el.innerText = n;
    day_el.date = (n < 10 ? '0' : '')+n+'-'+(month < 10 ? '0' : '')+(month+1)+'-'+year;
    day_el.calendar = calendar;
    calendar_cont.appendChild(day_el);
    if (is_active) {
      day_el.addEventListener('click', calendar_handle_date_click);
    }
  }
}


function calendar_handle_left_click (e) {
  e.stopPropagation();

  const calendar = e.currentTarget.calendar;

  const m = calendar.month;
  calendar.month = (calendar.month - 1 + 12) % 12;
  calendar.year = calendar.year - (m === 0 ? 1 : 0);

  render_calendar(calendar);
}


function calendar_handle_right_click (e) {
  e.stopPropagation();

  const calendar = e.currentTarget.calendar;

  const m = calendar.month;
  calendar.month = (calendar.month + 1) % 12;
  calendar.year = calendar.year + (m === 11 ? 1 : 0);

  render_calendar(calendar);
}


function calendar_handle_date_click (e) {
  const day_el = e.currentTarget;
  const date = day_el.date;
  const calendar = day_el.calendar;

  const d = new Date(date.split('-').reverse().join('-'))

  calendar.filter.value = date;
  calendar.filter.label = d.toLocaleString('en-au', { day: 'numeric', month: 'long' }) + ' ' + d.getFullYear();

  if (calendar.filter.static_dom) {
    calendar.filter.static_dom.label_el.innerText = calendar.filter.label;
  }

  for (let i=0; i<calendar.filter_conts.length; i++) {
    calendar.filter_conts[i].classList.remove('active');
  }

  calendar.filter.fetch_results();
}




function create_filter () {
  return {
    label: null,
    value: null,
    options: null,
    static_dom: {
      filter_cont: null,
      dropdown_el: null,
      label_el: null,
    },
    fetch_results: null,
  }
}


function handle_filter_current_click (e) {
  const current_el = e.currentTarget;
  const filter_cont = current_el.filter_cont;
  const filter_conts = current_el.filter_conts;

  filter_cont.classList.toggle('active');

  for (let i=0; i<filter_conts.length; i++) {
    if (filter_conts[i] == filter_cont) {
      continue;
    }
    filter_conts[i].classList.remove('active');
  }
}


function handle_option_click (e) {
  e.preventDefault();

  const option_el = e.currentTarget;

  const static_dom = option_el.filter.static_dom;
  const filter = option_el.filter;
  const value = option_el.value;
  const label = option_el.label;

  filter.value = value;
  filter.label = label;

  if (static_dom) {
    static_dom.filter_cont.classList.remove('active');
    static_dom.label_el.innerText = filter.label;
  }

  filter.fetch_results();
}


function render_filter (root_el, filter, title, filter_conts) {
  const filter_cont = document.createElement('div');
  filter_cont.className = 'filter_cont';
  root_el.appendChild(filter_cont);
  filter.filter_cont = filter_cont;
  filter_conts.push(filter_cont);

  const title_el = document.createElement('div');
  title_el.className = 'title';
  title_el.innerText = title;
  filter_cont.appendChild(title_el);

  const options_cont = document.createElement('div');
  options_cont.className = 'options';
  filter_cont.appendChild(options_cont);

  const current_el = document.createElement('div');
  current_el.className = 'current';
  current_el.filter_cont = filter_cont;
  current_el.filter_conts = filter_conts;
  options_cont.appendChild(current_el);
  current_el.addEventListener('click', handle_filter_current_click);

  const label_el = document.createElement('div');
  label_el.className = 'label';
  current_el.appendChild(label_el);
  filter.label_el = label_el;

  const navigate_down_cont = document.createElement('div');
  navigate_down_cont.className = 'navigate_down_cont';
  current_el.appendChild(navigate_down_cont);

  const navigate_down_el = document.createElement('div');
  navigate_down_el.className = 'navigate_down';
  navigate_down_cont.appendChild(navigate_down_el);

  const dropdown_el = document.createElement('div');
  dropdown_el.className = 'dropdown selecta_h5';
  options_cont.appendChild(dropdown_el);
  filter.dropdown_el = dropdown_el;
}


function update_filter (filter, dom) {
  if (!filter.options.length) {
    dom.filter_cont.style.display = 'none';
  }
  else {
    dom.filter_cont.style.display = '';
  }

  dom.label_el.innerText = filter.label;

  dom.dropdown_el.innerHTML = '';

  const dropdown_bg = document.createElement('div');
  dropdown_bg.className = 'dropdown_bg';
  dom.dropdown_el.appendChild(dropdown_bg);

  for (let i=0; i<filter.options.length; i++) {
    const option = filter.options[i];

    const cont = document.createElement('div');
    dom.dropdown_el.appendChild(cont);

    const option_el = document.createElement('a');
    option_el.className = 'option '+(option.enabled ? 'enabled' : '');
    option_el.href = '#';
    option_el.innerText = option.display;
    option_el.value = option.value;
    option_el.label = option.display;
    option_el.filter = filter;
    cont.appendChild(option_el);
    if (option.enabled) {
      option_el.addEventListener('click', handle_option_click);
    }
  }
}

window.render_calendar = render_calendar;
window.create_filter = create_filter;
window.render_filter = render_filter;
window.update_filter = update_filter;

})();