/* ----------------------------------------------------------
 init
---------------------------------------------------------- */

$(function () {
  "use strict";
  chkScreenSize();
  pageScroll();
  headerScroll();
  modalMenu();
  setCurrentNavigation();
  footerBreadcrumb();
  localNavAccodion();
  js_navG();
  js_tabs();
  js_faq();
  js_anchor_select();
  js_fontSize();
  js_changeLanguage();
  js_add_txt_category();
  js_toolTips();
  checkTel();
  modalInquiry();
  modalCommon();
  linkAccordion();
  bgGenerate();
  setMatchHeight();
});

$(window).on("resize", function(){
  "use strict";
  chkScreenSize();
});

$(window).on('load', function () {
  "use strict";
  headerScroll();
});

$(window).on('scroll', function () {
  "use strict";
  headerScroll();
});

/* ----------------------------------------------------------
 global var
---------------------------------------------------------- */
var scrollDisable = false;
/* ----------------------------------------------------------
 chkScreenSize
---------------------------------------------------------- */

var $MQ = "PC";
var oldMQ = $MQ;

var chkScreenSize = function() {
  var mWidth = $("body").css("min-width");
  switch(mWidth) {
    case "1px":
      $MQ = "SP";
      break;
    default:
      $MQ = "PC";
  }
   // trigger custom event when breakpoint change
  if (oldMQ !== $MQ) {
    oldMQ = $MQ;
    $(window).trigger("breakpointChange");
  }
}

/* ----------------------------------------------------------
 pageScroll
---------------------------------------------------------- */
var pageScroll = function(){
  var headerH;
  if ($MQ == "PC") {
    headerH = 85;
  } else {
    if (!$('.contents-sub').length) {
      headerH = 75;
    } else {
      headerH = 145;
    }
  }
  $('.js-scroll').on('click', function() {
    var speed = 800; // time
    var href= $(this).attr("href");
    var pathname = window.location.pathname;
    var targetHash = href.match(/#([a-zA-Z0-9])+/);
    var targetURL = href.replace(/#([a-zA-Z0-9])+/,"");
    var r = true;

    if (/^#/.test(href)) {
      scroll_inpage($(this));
      r = false;
    } else {
      if( targetURL == pathname) {
        href = targetHash[0];
        scroll_inpage($(this));
        r = false;
      } else {
        r = true;
      }
    }
    
    function scroll_inpage($this) {
      var target = $(href == "#" || href == "" ? 'html' : href);
      var position;
      if (target.length) {
        if($this.parents('.box-anchor-link-01').length) {
          if($('.box-anchor-link-01').hasClass('special')){
            var diff = $this.parents('.box-anchor-link-01').find('.txt-anchor-link-01').outerHeight() - $this.outerHeight();
            position = target.offset().top - (headerH + diff);
          }
          else {
            position = target.offset().top - headerH;
          }
        }
        else {
          position = target.offset().top - headerH;
        }
      }
      
      if(href == '#'){
        // リンク#のときはページの先頭へ
        $('body,html').stop().animate({scrollTop: 0}, speed, 'swing');
      } else {
        // それ以外は指定idへ
        $('body,html').stop().animate({scrollTop: position}, speed, 'swing');
      }
    }
    return r;
  });

  $(window).on('load', function(){
    var targetPos;
    if ($(window.location.hash).length) {
      targetPos = $(window.location.hash).offset().top - headerH;
    }
    
    if(window.location.hash) {
      scroll(0,0)
      $('html, body').animate({
          scrollTop: targetPos + 'px'
      }, 1000, 'swing');
    }
    
  });
};
/* ----------------------------------------------------------
 screen lock
---------------------------------------------------------- */
var lockTop = 0;
var screenLock = function () {
  scrollDisable = true;
  lockTop = $(window).scrollTop();
  $("html").addClass("is-screen-locked").css({ top : - lockTop });
};

/* ----------------------------------------------------------
 screen unlock
---------------------------------------------------------- */
var screenUnlock = function () {
  scrollDisable = false;
  $("html").removeClass("is-screen-locked").removeAttr("style");
  $(window).scrollTop(lockTop);
};

/* ----------------------------------------------------------
 header scroll
---------------------------------------------------------- */
var headerScroll = function () {
  var header = $('.header');

  if (!scrollDisable) {
    if ($(window).scrollTop() > 0) {
      header.addClass('is-fixed');
    } else {
      header.removeClass('is-fixed');
    }
  }
}

/* ----------------------------------------------------------
 open menu
---------------------------------------------------------- */
var modalMenu = function() {
  var $btnOpen  = $('#js-modal-open');
  var $btnClose = $('#js-modal-close');
  var $modal    = $('#modal-menu');
  $btnOpen.on('click', function() {
    if(!scrollDisable) {
      if(!$modal.hasClass('is-open')) {
        $modal.addClass('is-open').fadeIn();
        screenLock();
      }
    }
  });
  $btnClose.on('click', function(){
    $modal.removeClass('is-open').fadeOut();
    screenUnlock();
  });
  
  $(window).on('breakpointChange', function(){
    // for chinese top page.
    if($('body').hasClass('cn')) {
      $modal.removeClass('is-open').fadeOut();
      screenUnlock();
    }
  });
}

/* ----------------------------------------------------------
 open menu
---------------------------------------------------------- */
var js_navG = function(){
  var $btn = $('.js-nav-global');
  var $box = $('.list-nav-global-in');
  
  $btn.on('click', function(){
    if($MQ == "SP") {
      if(!$(this).hasClass('is-open')) {
        $btn.removeClass('is-open').next($box).slideUp();
        $(this).addClass('is-open').next($box).slideDown();
      }
    }
  });

  $btn.on('mouseover', function(e){
    if($MQ == "PC") {
      var dataNav = $(this).data('side-nav');
      $('.list-nav-global-02').find('.list-nav-global-in.is-active').removeClass('is-active');
      $('.list-images-menu').find('.item.is-active').removeClass('is-active');
      $('[data-side-image="'+ dataNav +'"]').addClass('is-active');
      $('[data-side-nav-pc="'+ dataNav +'"]').find('.list-nav-global-in').addClass('is-active');
      $btn.removeClass('is-active');
      $(this).addClass('is-active');
    }
  });
  
  $(window).on("breakpointChange", function() {
    $('.box-title').removeClass('is-open is-active');
    $('.list-nav-global-in').removeClass('is-active').removeAttr('style');
  });
}
/* ----------------------------------------------------------
 footer breadcrumb
---------------------------------------------------------- */
var footerBreadcrumb = function() {
  var arrBreadcrumb = [];
  var topBreadcrumb = $('.hero-cmn-01 .nav-breadcrumb');
  var outputBreadcrumb = $('.footer-breadcrumb ul')
  var defaultBreadcrumb = '<li><a href="https://www.nipponsteel.com/">HOME</a></li>';

  if (topBreadcrumb.length) {
    topBreadcrumb.find('li').each(function(){
      var breadcrumbHref = $(this).find('a').attr('href');
      var breadcrumbText = $(this).text();

      arrBreadcrumb.push({
        breadcrumbText: breadcrumbText,
        breadcrumbHref: breadcrumbHref,
      });

    });

    arrBreadcrumb.forEach(function(value, key) {
      var footerBreadcrumb = '<li>'
      if (value.breadcrumbText == '' || value.breadcrumbHref == undefined) {
        footerBreadcrumb += value.breadcrumbText
      } else {
        footerBreadcrumb += '<a href="' + value.breadcrumbHref + '">' + value.breadcrumbText + '</a>'
      }
      footerBreadcrumb += '</li>'
      outputBreadcrumb.append(footerBreadcrumb);
    });
  } else {
    outputBreadcrumb.append(defaultBreadcrumb)
  }
}

/* ----------------------------------------------------------
 local nav accodion
---------------------------------------------------------- */
var localNavAccodion = function () {
  var navL   = $('.nav-local');
  if (navL.length) {
    var $navHam = $('.nav-title-ham');
    var navCate   = $('.nav-category');
    var winW = $(window).outerWidth();
    var listSub = $('.list-sub-lv-01');
    var $btnAcd = $('.js-nav-accodion-btn');
    var $boxAcd = $('.js-nav-accodion-box');
    var navCateOff = (navCate.offset().top - $(window).scrollTop()) + 70;

    $btnAcd.on('click', function(e){
      if ($(this).next($boxAcd).length && !$(this).next($boxAcd).hasClass('is-open')) {
        $(this).addClass('is-open');
        $(this).next($boxAcd).addClass('is-open').stop().slideDown();
      } else {
        $(this).removeClass('is-open');
        $(this).next($boxAcd).removeClass('is-open').stop().slideUp();
      }
    
      if($(e.target).hasClass('txt-sub-lv-02')) {
        if($(this).hasClass('is-open')) {
          $(this).parent().addClass('is-active');
        } else {
          $(this).parent().removeClass('is-active');
        }
      }
    });
    
    $(window).on('scroll', function(){
      navCateOff = (navCate.offset().top - $(window).scrollTop()) + 70;
    });

    $(window).on('resize', function(){
      navCateOff = (navCate.offset().top - $(window).scrollTop()) + 70;
      winW = $(window).outerWidth();

      if(winW >= 1280) {
        $navHam.removeClass('is-open');
        listSub.removeAttr('style');
      }

      if (listSub.hasClass('is-normal-open')) {
        listSub.css('top' , navCateOff);
      } else {
        listSub.css('top' , '');
      }
    });
      
    $(window).on("orientationchange", function() {
      $navHam.removeClass('is-open');
      listSub.removeClass('is-sticky-open is-normal-open').removeAttr('style');
      if(scrollDisable) {
        screenUnlock();
      }
    });
    
    $navHam.on('click', function(){
      navCateOff = (navCate.offset().top - $(window).scrollTop()) + 70;
      winW = $(window).outerWidth();
      if(winW < 1280) {
        if(!$(this).hasClass('is-open')) {
          navL.addClass('is-open');
          $(this).addClass('is-open');
          if ($MQ == "SP") {
            (navL.hasClass('sticky')) ? listSub.addClass('is-sticky-open') : listSub.addClass('is-normal-open');
            screenLock();
          }
          listSub.stop().slideDown();
        } else {
          navL.removeClass('is-open');
          $(this).removeClass('is-open');
          if ($MQ == "SP") {
            listSub.stop().slideUp(function(){
              (navL.hasClass('sticky')) ? listSub.removeClass('is-sticky-open') : listSub.removeClass('is-normal-open');
            });
            screenUnlock();
          } else {
            listSub.stop().slideUp();
          }
        }
      }
      if (listSub.hasClass('is-normal-open')) {
        listSub.css('top' , navCateOff);
      } else {
        listSub.css('top' , '');
      }
    });
    
    $(window).on("breakpointChange", function () {
      navL.removeClass('is-open');
      $navHam.removeClass('is-open');
      listSub.removeClass('is-sticky-open is-normal-open').removeAttr('style');;
      screenUnlock();
    });
  }
}

/* ----------------------------------------------------------
 local nav scroll
---------------------------------------------------------- */
$(function () {
  var navL = $('.nav-local');
  var winW = $(window).outerWidth();
  var winH = $(window).outerHeight();
  var winTop;
  var targetPos;

  $(window).on('resize', function(){
    targetPos = $('.hero-cmn-01').height();
    if(winW <= 896 && $MQ == "SP") {
      if (!scrollDisable) {
        localSticky();
      }
    }
    if( winW > 896 && winH < winW) {
      navL.removeClass('sticky');
    }
  });

  $(window).on('load', function(){
    targetPos = $('.hero-cmn-01').height();
    winTop = $(window).scrollTop() + 70;
    if(winW <= 896 && $MQ == "SP") {
      if (!scrollDisable) {
        localSticky();
      }
    }
  });

  $(window).on('scroll', function(){
    targetPos = $('.hero-cmn-01').height();
    winW = $(window).outerWidth();
    winH = $(window).outerHeight();
    if(winW <= 896 && $MQ == "SP") {
      if (!scrollDisable) {
        localSticky();
      }
    }
  });

  function localSticky() {
    winTop = $(window).scrollTop() + 70;
    if (winTop > targetPos) {
      navL.addClass('sticky');
    } else {
      navL.removeClass('sticky');
    }
  }

  $(window).on("breakpointChange", function () {
    navL.removeClass('sticky');
  });
});
/* ----------------------------------------------------------
 js tabs
---------------------------------------------------------- */
var js_tabs = function() {
  var selectTab = $('.js-tab-select');
  var activeText = $('.row-btn-tab').find('.btn-tab.is-active').text();
  var winW = $(window).outerWidth();
  
  selectTab.text(activeText);

  selectTab.on('click', function() {
    var winW = $(window).outerWidth();
    var tabWrap = $(this).next('.list-btn-tab');
    if(winW < 1280) {
      if (!tabWrap.hasClass('is-open')) {
        tabWrap.addClass('is-open').stop().slideDown();
      } else {
        tabWrap.removeClass('is-open').stop().slideUp();
      }
    }
  });

  $(window).on("resize", function () {
    winW = $(window).outerWidth();
    if (winW > 1280) {
      $('.list-btn-tab').removeClass('is-open').removeAttr('style');
    }
  });

  $(window).on("breakpointChange", function () {
    $('.list-btn-tab').removeClass('is-open').removeAttr('style');
    selectTab.text(activeText);
  });
}
/* ----------------------------------------------------------
 js anchor link SP
---------------------------------------------------------- */
var js_anchor_select = function() {
  var output = $('.js-anchor-select');
  var anchor = $('.list-anchor-link-01');
  var anchorItem = anchor.find('li').length;
  var anchorH = anchor.outerHeight();
  var anchorBtn = $('.anchor-link');
  var winW = $(window).outerWidth();
  var anchorFirstText = $('.list-anchor-link-01 li:first-child .anchor-link').text();

  function setFn() {
    output.text(anchorFirstText);
    $('.box-anchor-link-01').addClass('special');
  }

  function resetFn() {
    $('.box-anchor-link-01').removeClass('special');
    $('.list-anchor-link-01').removeAttr('style');
  }

  if (anchorItem >= 7) {
    if( winW < 1527 ) {
      setFn();
    }
  } else {
    if( winW < 1281 ) {
      setFn();
    }
  }

  // if( winW < 1527 && anchorItem >= 7 ) {
  //   setFn();
  // }

  // if( winW < 1527 && anchorItem < 7 ) {
  //   setFn();
  // }

  $(window).on('resize', function(){
    winW    = $(window).outerWidth();
    anchorH = anchor.outerHeight();

    if($('.contents-container').hasClass('flex')) {
      if ( anchorItem >= 7 ) {
        if ( winW < 1527 ) {
          if(!$('.box-anchor-link-01').hasClass('special')) {
            setFn();
          }
        } else {
          resetFn();
        }
      } else {
        if ( winW < 1280 ) {
          if(!$('.box-anchor-link-01').hasClass('special')) {
            setFn();
          }
        } else {
          resetFn();
        }
      }
    } else {
      if ( winW < 1280 ) {
        if(!$('.box-anchor-link-01').hasClass('special')) {
          setFn();
        }
      } else {
        resetFn();
      }
    }
  });

  output.on('click', function(){
    if ($('.box-anchor-link-01').hasClass('special')) {
      var anchorWrap = $(this).next();
      if(!anchorWrap.hasClass('is-open')) {
        anchorWrap.addClass('is-open').stop().slideDown();
      } else {
        anchorWrap.removeClass('is-open').stop().slideUp();
      }
    }
  });

  anchorBtn.on('click', function(){
    if ($('.box-anchor-link-01').hasClass('special')) {
      var outputText = $(this).text();
      output.text(outputText);
      $(this).parents('.list-anchor-link-01').removeClass('is-open').stop().slideUp();
    }
  });

  $(window).on("breakpointChange", function () {
    $('.list-anchor-link-01').removeAttr('style');
  });
}
/* ----------------------------------------------------------
 js change font size
---------------------------------------------------------- */
var js_fontSize = function() {
  if($('.list-font-size-01').length) {
    var btn = $('.list-font-size-01 .box-font');
    
    btn.on('click', function(){
      var fontID = $(this).attr('id');

      btn.removeClass('is-active');
      $(this).addClass('is-active');
      $('html').removeClass (function (index, className) {
        return (className.match (/(^|\s)fz-\S+/g) || []).join(' ');
      });

      switch(fontID) {
        case "small":
          $('html').addClass('fz-sm');
          break;
        case "large":
          $('html').addClass('fz-lg');
          break;
        default:
          $('html').addClass('fz-md');
      }
    });
    $('#medium').trigger('click');
  }
}
/* ----------------------------------------------------------
 js change language
---------------------------------------------------------- */
var js_changeLanguage = function() {
  var bodyCls = $('body').attr('class') || 'jp';
  var selectLang = $('.lang-select');  

  selectLang.on('change', function(){
    var lang = $(this).val();
    selectLang.each(function(){
      $(this).val( lang );
      if(lang != "jp") {
        window.location = "/" + lang + "/index.html";
      }
      else if(lang == "jp") {
        window.location = "https://www.nipponsteel.com/index.html";
      }
      else {
        return false;
      }
    });
  });

  selectLang.each(function(){
    $(this).val(bodyCls);
  });
}

/* ----------------------------------------------------------
 js set current navigation
---------------------------------------------------------- */
function js_faq() {
  var question = $('.js-faq-question');
  var answer   = $('.js-faq-answer');
  var close    = $('.js-close-answer');

  question.on('click', function(){
    var boxAnswer = $(this).next('.js-faq-answer');
    $(this).toggleClass("is-active");
    if(!boxAnswer.hasClass('is-open')) {
      boxAnswer.addClass('is-open').stop().slideDown();
    } else {
      boxAnswer.removeClass('is-open').stop().slideUp();
    }
  });

  close.on('click', function(e){
    var boxAnswer = $(this).parents('.js-faq-answer');
    e.preventDefault();
    if(boxAnswer.hasClass('is-open')) {
      boxAnswer.removeClass('is-open').stop().slideUp();
    }
  });
}
/* ----------------------------------------------------------
 js set current navigation
---------------------------------------------------------- */
function setCurrentNavigation() {
	var gNavCurrent = $(".nav-global .list-nav-global-01 > .item .box-title");
	var headerCurrent = $(".header-utility .header-links .item .link");
	var url = window.location.pathname.split('https://www.nipponsteel.com/');
	var str = 'https://www.nipponsteel.com/';
  var arr = ['index.html'];
  var chkLang = ($('body').hasClass('en')) ? 2 : 1;
  
	for ( i = 0; i < url.length; i++) {
		if(url[i] != '' && url[i] != undefined) {
			if (url[i].indexOf(arr) == -1) {
				if (i < (url.length - 1)) {
					str += url[i] + '/';
				} else {
					str += url[i];
				}
			}
		}
  }

  gNavCurrent.each(function () {
    var id = $(this).attr('id');
    if ($('body').hasClass('en')) {
      if (id == url[2]) {
        $(this).addClass('is-current');
      }
    } else {
      if (id == url[1]) {
        $(this).addClass('is-current');
      }
    }
  });

  headerCurrent.each(function(){
    var href = $(this).attr('href');    
    if ($('body').hasClass('en')) {
      if (href == ('/' + url[1] + '/' + url[2] + '/')) {
        $(this).addClass('is-current');
      }
    } else {
      if (href == ('/' + url[1] + '/')) {
        $(this).addClass('is-current');
      }
    }
  });

  var imgCurrent = url[chkLang];
  switch(imgCurrent) {
    case "works":
      $('[data-side-image="1"]').addClass('is-active');
      break;
    case "tech":
      $('[data-side-image="2"]').addClass('is-active');
      break;
    case "company":
      $('[data-side-image="3"]').addClass('is-active');
      break;
    case "ir":
      $('[data-side-image="4"]').addClass('is-active');
      break;
    case "csr":
      $('[data-side-image="5"]').addClass('is-active');
      break;
    case "recruit":
      $('[data-side-image="6"]').addClass('is-active');
      break;
    default:
      $('[data-side-image="0"]').addClass('is-active');
  }
}
/* ----------------------------------------------------------
 js set txt category
---------------------------------------------------------- */
var js_add_txt_category = function() {
  var $listNews = $('.list-cmn-news-01');
  if ($listNews.length) {
      $listNews.find('li, .item').each(function() {
          var output = $(this).find('.box-text');
          var icoCat = $(this).find('.ico-category img');
          var txtAlt;
          if (icoCat.length) {
              for (var i = 0; i < icoCat.length; i++) {
                  txtAlt = icoCat[i].getAttribute("alt");
                  output.append('<p class="txt-category">' + txtAlt + '</p>');
                  if(i==2)break;
              }
          }
      });
  }
}

/* ----------------------------------------------------------
 Check telephone number in sp
---------------------------------------------------------- */
var checkTel = function(){
  if ($('.js-tel').length > 0){
		var ua = navigator.userAgent;
		if (ua.indexOf("iPhone") < 0 && ua.indexOf("Android") < 0) {
		 $('.js-tel').each(function () {
			 var str = $(this).text();
			 var cls = $(this).attr("class");
			 $(this).replaceWith( "<span class=\""+ cls +"\">"+ str + "</span>");
		 });
		}
	 }
};

/* ----------------------------------------------------------
 js set current navigation
---------------------------------------------------------- */
var js_toolTips = function() {
  var toolBox = $('.js-tooltip-box');
  var toolTxt = $('.js-tooltip-txt');

  toolBox.css({
		opacity  : "1",
    position : "absolute",
    zIndex   : "9",
		display  : "none"
  });

  toolTxt.each(function() {
    var target = $(this).next(toolBox);

    $(this).on('mouseover', function() {
      target.stop().fadeIn();
    }).on('mouseout', function() {
      target.stop().fadeOut();
  
    }).on('mousemove', function(event) {
      if($MQ == "PC") {
        target.css({
          "top"  : event.offsetY + 12 + "px",
          "left" : event.offsetX + 12 + "px"
        });
      } else {
        target.css({
          "top"  : event.offsetY + 12 + "px",
          "left" : "0px"
        });
      }
    });
  });
}

/* ----------------------------------------------------------
 matchHeight
---------------------------------------------------------- */
$(function() {
  if($('.box-text-images').length > 0) {
    $('.box-text-images > .text').matchHeight();
  }
});

/* ----------------------------------------------------------
 modal inquiry
---------------------------------------------------------- */
var modalInquiry = function() {
  var $btnClose = $('.modal-inquiry .modal-close');
  var $modal = $('.modal-inquiry');

  if ($('.modal-inquiry').length > 0) {
    screenLock();

    $btnClose.on('click', function(e) {
      e.preventDefault();
      $modal.fadeOut();
      screenUnlock();
    });
  }
}

/* ----------------------------------------------------------
 modal common
---------------------------------------------------------- */
var modalCommon = function() {
  var $btnOpen = $('.js-modal-button');
  var $btnClose = $('.modal-close');
  var $overlay = $('.bg-overlay');
  var $modal = $('.modal-contents');

  if (!$modal) return false

  $btnOpen.on('click', function (e) {
    $modal.removeClass('is-hide')
    $modal.addClass('is-show')
    e.preventDefault();
    $modal.fadeIn();
    screenLock();
  });

  $btnClose.on('click', function(e) {
    e.preventDefault();
    closeFunt()
  });

  $overlay.on('click', function(e) {
    e.preventDefault();
    closeFunt()
  });

  var closeFunt = function () {
    $modal.fadeOut(function () {
      $modal.removeClass('is-show')
      $modal.addClass('is-hide')
    });
    screenUnlock();
  }
}

/* ----------------------------------------------------------
 linkAccordion
---------------------------------------------------------- */
var linkAccordion = function() {
  if ($('.box-cmn-links-04').length > 0) {
    $('.box-cmn-links-04 .ttl-link').click(function() {
      if($MQ == "SP") {
        $(this).next('.list-link').stop().slideToggle();
      }
    });

    $(window).on("breakpointChange", function () {
      $('.box-cmn-links-04 .list-link').removeAttr('style');
    });
  }
}

/* ----------------------------------------------------------
  background generate
---------------------------------------------------------- */
var bgGenerate = function () {
  $('[data-bg-image]').each(function () {
    var bgPath = $(this).data('bg-image');
    $(this).css('background-image', 'url(' + bgPath + ')');
  });
};

/* ----------------------------------------------------------
 modalVideo
---------------------------------------------------------- */
$(function(){
  if($('.js-modal-video').length) {
    $('.js-modal-video').modalVideo();
  }
});

/* ----------------------------------------------------------
 setMatchHeight
---------------------------------------------------------- */
var setMatchHeight = function(){
  if($('.js-matchHeight-group').length){
    $('.js-matchHeight-group').each(function(){
      $(this).find('.js-matchHeight-target').matchHeight();

      if($(this).find('.js-matchHeight-target2').length){
        $(this).find('.js-matchHeight-target2').matchHeight();
      }
    });
  }
}