/*!
 * jQuery.ellipsis
 * http://github.com/jjenzz/jquery.ellipsis
 * --------------------------------------------------------------------------
 * Copyright (c) 2013 J. Smith (@jjenzz)
 * Dual licensed under the MIT and GPL licenses:
 * http://www.opensource.org/licenses/mit-license.php
 * http://www.gnu.org/licenses/gpl.html
 *
 * adds a class to the last 'allowed' line of text so you can apply
 * text-overflow: ellipsis;
 */
(function(factory) {
  "use strict";

  if (typeof define === "function" && define.amd) {
    // AMD. register as an anonymous module
    define(["jquery"], factory);
  } else {
    // browser globals
    factory(jQuery);
  }
})(function($) {
  "use strict";

  var namespace = "ellipsis",
    span = '<span style="white-space: nowrap;">',
    defaults = {
      lines: "auto",
      ellipClass: "ellip",
      responsive: false
    };

  /**
   * Ellipsis()
   * --------------------------------------------------------------------------
   * @param {Node} el
   * @param {Object} opts
   */
  function Ellipsis(el, opts) {
    var base = this,
      currLine = 0,
      lines = [],
      setStartEllipAt,
      startEllipAt,
      resizeTimer,
      currOffset,
      lineHeight,
      contHeight,
      words,
      htmlEntities;

    // List of HTML entities for escaping.
    htmlEntities = {
      "&": "&amp;",
      "<": "&lt;",
      ">": "&gt;",
      '"': "&quot;",
      "'": "&#x27;",
      "`": "&#x60;",
      "/": "&#x2F;",
      "\\": "&#x5C;"
    };

    base.$cont = $(el);
    base.opts = $.extend({}, defaults, opts);

    /**
     * create() happens once when
     * instance is created
     */
    function create() {
      base.text = base.$cont.text();
      base.opts.ellipLineClass = base.opts.ellipClass + "-line";

      base.$el = $('<span class="' + base.opts.ellipClass + '" />');
      base.$el.text(base.text);

      base.$cont.empty().append(base.$el);

      init();
    }

    /**
     * init()
     */
    function init() {
      // if they only want one line just add
      // the class and do nothing else
      if (typeof base.opts.lines === "number" && base.opts.lines < 2) {
        base.$el.addClass(base.opts.ellipLineClass);
        return;
      }

      contHeight = base.$cont.height();

      // if they only want to ellipsis the overflow
      // then do nothing if there is no overflow
      if (
        base.opts.lines === "auto" &&
        base.$el.prop("scrollHeight") <= contHeight
      ) {
        return;
      }

      if (!setStartEllipAt) {
        return;
      }

      // create an array of words from our string
      words = $.trim(escapeText(base.text)).split(/\s+/);

      // wrap each word in a span and temporarily append to the DOM
      base.$el.html(span + words.join("</span> " + span) + "</span>");

      // loop through words to determine which word the
      // ellipsis container should start from (need to
      // re-query spans from DOM so we can get their offset)
      base.$el.find("span").each(setStartEllipAt);

      // startEllipAt could be 0 so make sure we're
      // checking undefined instead of falsey
      if (startEllipAt != null) {
        updateText(startEllipAt);
      }
    }

    /**
     * updateText() updates the text in the DOM
     * with a span around the line that needs
     * to be truncated
     *
     * @param {Number} i
     */
    function updateText(nth) {
      // add a span that wraps from nth
      // word to the end of the string
      words[nth] =
        '<span class="' + base.opts.ellipLineClass + '">' + words[nth];
      words.push("</span>");

      // update the DOM with
      // our new string/markup
      base.$el.html(words.join(" "));
    }

    function escapeText(text) {
      return String(text).replace(/[&<>"'``\/]/g, function(s) {
        return htmlEntities[s];
      });
    }

    // only define the method if it's required
    if (base.opts.lines === "auto") {
      /**
       * setStartEllipByHeight() sets the start
       * position to the first word in the last
       * line of the element that doesn't overflow
       *
       * @param {Number} i
       * @param {Node} word
       */
      var setStartEllipByHeight = function(i, word) {
        var $word = $(word),
          top = $word.position().top;

        lineHeight = lineHeight || $word.height();

        if (top === currOffset) {
          // if it's top matches currOffset
          // then it's on the same line
          // as the previous word
          lines[currLine].push($word);
        } else {
          // otherwise we're
          // on a new line
          currOffset = top;
          currLine += 1;
          lines[currLine] = [$word];
        }

        // if the bottom of the word is outside
        // the element (overflowing) then
        // stop looping and set startEllipAt to
        // the first word in the previous line
        if (top + lineHeight > contHeight) {
          startEllipAt = i - lines[currLine - 1].length;
          return false;
        }
      };

      setStartEllipAt = setStartEllipByHeight;
    }

    // only define the method if it's required
    if (typeof base.opts.lines === "number" && base.opts.lines > 1) {
      /**
       * setStartEllipByLine() sets the start
       * position to the first word in the line
       * that was passed to opts. This forces
       * the ellipsis on a specific line
       * regardless of overflow
       *
       * @param {Number} i
       * @param {Node} word
       */
      var setStartEllipByLine = function(i, word) {
        var $word = $(word),
          top = $word.position().top;

        // if top isn't currOfset
        // then we're on a new line
        if (top !== currOffset) {
          currOffset = top;
          currLine += 1;
        }

        // if the word's currLine is equal
        // to the line limit passed via options
        // then start ellip from this
        // word and stop looping
        if (currLine === base.opts.lines) {
          startEllipAt = i;
          return false;
        }
      };

      setStartEllipAt = setStartEllipByLine;
    }

    // only bind to window resize if required
    if (base.opts.responsive) {
      /**
       * resize() resets necessary vars
       * and content and then re-initialises
       * the Ellipsis script
       */
      var resize = function() {
        lines = [];
        currLine = 0;
        currOffset = null;
        startEllipAt = null;
        base.$el.html(escapeText(base.text));

        clearTimeout(resizeTimer);
        resizeTimer = setTimeout(init, 100);
      };

      $(window).on("resize." + namespace, resize);
    }

    // start 'er up
    create();
  }

  $.fn[namespace] = function(opts) {
    return this.each(function() {
      try {
        $(this).data(namespace, new Ellipsis(this, opts));
      } catch (err) {
        if (window.console) {
          console.error(namespace + ": " + err);
        }
      }
    });
  };
});

AOS.init();
if (jQuery("#gallery-wrapper").length > 0) {
  var viewer = new Viewer(document.getElementById("gallery-wrapper"), {
    url: "data-original"
  });
}
function openMenuOverlay() {
  document.getElementById("menu-overlay").style.height = "100%";
  jQuery("html, body").css({ overflow: "hidden" });
}
function closeMenuOverlay() {
  document.getElementById("menu-overlay").style.height = "0%";
  jQuery("html, body").css({ overflow: "auto" });
}
jQuery(".scroll-to").on("click", function() {
  jQuery(window).scrollTo(jQuery(".header"), 1000);
});

let thisstype = jQuery('input[name="stype"]:checked').val();
showSelectOption( thisstype );
jQuery('#stype-' + thisstype).selectric();
var thisSelectric = jQuery('#stype-' + thisstype).data('selectric');
console.log(thisSelectric);

jQuery('input[name="stype"]').click(function(){
  let thisstype = jQuery(this).val();
  thisSelectric.destroy();
  showSelectOption( thisstype );
  jQuery('#stype-' + thisstype).selectric();
  thisSelectric = jQuery('#stype-' + thisstype).data('selectric');
});

function showSelectOption( thisstype ) {
  jQuery('.stype').hide();
  jQuery('.stype').attr('disabled', 'disabled');
  jQuery('#stype-' + thisstype).show();
  jQuery('#stype-' + thisstype).removeAttr('disabled');
}

lightbox.option({
  alwaysShowNavOnTouchDevices: false,
  albumLabel: "",
  maxWidth: 992,
  maxHeight: 600,
  showImageNumberLabel: false
});

jQuery(".template-faq .accordion .title").click(function() {
  let $imgSwap = $(this)
    .find(".icon")
    .find("img")
    .attr("data-swap");
  let $imgMain = $(this)
    .find(".icon")
    .find("img")
    .attr("src");
  $(this)
    .find(".icon")
    .find("img")
    .attr("src", $imgSwap);
  $(this)
    .find(".icon")
    .find("img")
    .attr("data-swap", $imgMain);
});

jQuery('[data-toggle="datepicker"]').datepicker({
  inline: true,
  container: "#datepicker-block",
  language: "th-TH"
});

var selectMinDate = $("#defaultPicker").attr("data-mindate"),
  selectMaxDate = $("#defaultPicker").attr("data-maxdate"),
  selectDefaultDate = $("#defaultPicker").attr("data-default");
  if ( $("#defaultPicker").attr("data-language") == 'th' ) {
  var selectCalendar = $.calendars.instance("thai", "th");
  }
$("#defaultPicker").calendarsPicker({
  minDate: selectMinDate,
  maxDate: selectMaxDate,
  defaultDate: selectDefaultDate,
  calendar: selectCalendar,
  onSelect: updateSelected,
  onChangeMonthYear: updateSelectedMonthYear,
  nextText: ">>",
  prevText: "<<"
});

$("#selectedMonth, #selectedYear").change(function() {
  $("#defaultPicker").calendarsPicker(
    "setDate",
    calendar.newDate($("#selectedYear").val(), $("#selectedMonth").val())
  );
});

function updateSelected(dates) {
  console.log(dates.length);
  console.log(dates[0]);

  $("#input-datepicker").val(dates[0].day());
  $("#input-monthpicker").val(dates[0].month());
  $("#input-yearpicker").val(dates[0].year());

  $("#search-from-date").submit();
}

function updateSelectedMonthYear(year, month) {
  $("#input-monthpicker").val(month);
  $("#input-yearpicker").val(year);
}

$(".royal-item a").click(function(event) {
  var selectDay = $(this).attr("data-day"),
    selectMonth = $(this).attr("data-month"),
    selectYear = $(this).attr("data-year");

  $("#input-datepicker").val(selectDay);
  $("#input-monthpicker").val(selectMonth);
  $("#input-yearpicker").val(selectYear);

  $("#search-from-date").submit();
});

jQuery(".tv-channel-list .tv-channel-item a").click(function(event) {
  event.preventDefault();
  var videoFile = $(this).attr("data-video");
  var posterFile = $(this).attr("data-poster");
  $(".tv-channel-list .tv-channel-item a").removeClass("active");
  $(this).addClass("active");
  var videoHTML =
    '<video controls width="960" poster="' +
    posterFile +
    '" src="' +
    videoFile +
    '"><p>Your browser doesn\'t support HTML5 video. Here is a <a href="' +
    videoFile +
    '">link to the video</a> instead.</p></video>';
  $("#video-player").html(videoHTML);
});

$(".date-dropdown select, .search-document-form select, .search-volunteer-form select, .advanced-search .date-select, .advanced-search .month-select, .advanced-search .year-select").selectric();

$(".royal-list .showall").click(function(event) {
  $(".hide-block").show();
  $(this).remove();
});

$('.font-size-action a').click(function(event){
  event.preventDefault();
  console.log('click');
  $('.font-size-action a').removeClass('active');
  $(this).addClass('active');
  var fontSize = $('body').attr('data-fontsize');
  console.log(fontSize);

  if ( $(this).hasClass('smaller-size') ) {

    switch ( fontSize ) {
      case '1':
        removeAllFontSizeClass();
        $('body').addClass('step-0');
        fontSize = 0;
        break;
      case '2':
        removeAllFontSizeClass();
        $('body').addClass('step-1');
        fontSize = 1;
        break;
      case '3':
        removeAllFontSizeClass();
        $('body').addClass('step-2');
        fontSize = 2;
        break;
      case '4':
        removeAllFontSizeClass();
        fontSize = 3;
        break;
      case '5':
        removeAllFontSizeClass();
        $('body').addClass('step-4');
        fontSize = 4;
        break;
      case '6':
        removeAllFontSizeClass();
        $('body').addClass('step-5');
        fontSize = 5;
        break;
      default:
        console.log('default');
        break;
    }

  } else if ( $(this).hasClass('bigger-size') ) {

    switch ( fontSize ) {
      case '0':
        removeAllFontSizeClass();
        $('body').addClass('step-1');
        fontSize = 1;
        break;
      case '1':
        removeAllFontSizeClass();
        $('body').addClass('step-2');
        fontSize = 2;
        break;
      case '2':
        removeAllFontSizeClass();
        fontSize = 3;
        break;
      case '3':
        removeAllFontSizeClass();
        $('body').addClass('step-4');
        fontSize = 4;
        break;
      case '4':
        removeAllFontSizeClass();
        $('body').addClass('step-5');
        fontSize = 5;
        break;
      case '5':
        removeAllFontSizeClass();
        $('body').addClass('step-6');
        fontSize = 6;
        break;
      default:
        
        break;
    }

  } else {
    fontSize = 3;
    removeAllFontSizeClass();
  }

  $('body').attr('data-fontsize', fontSize);

});

function removeAllFontSizeClass() 
{
  $('body').removeClass('step-0');
  $('body').removeClass('step-1');
  $('body').removeClass('step-2');
  $('body').removeClass('step-4');
  $('body').removeClass('step-5');
  $('body').removeClass('step-6');
}

$('.advanced-search').slideUp();
$('.show-advanced-search a').click(function(event){
  event.preventDefault();

  $(this).find('.fa').toggleClass('fa-chevron-up');
  $('.advanced-search').slideToggle('slow');
});