$("*").each(function (index, element) {
  // 此元素被點選後執行
  $(this).click(function (e) {
    // 取得被點選元素的屬性：data-gt-target
    var target = $(this).attr("data-gt-target");
    var duration = $(this).attr("data-gt-duration");
    var offset = $(this).attr("data-gt-offset");

    // JS 語法：判斷式
    // if (條件) {程式區塊}
    // 當條件成立，會執行程式區塊

    // 如果 目標有資料 才會執行 { } 內的程式
    // 避免出現 undefine (未定義 - 不存在的資料)
    if (target) {
      //console.log("目標：" + target);
      //console.log("時間：" + duration);
      //console.log("位移：" + offset);

      // 上方位置 = 目標區塊.位移().上方位置
      var top = $(target).offset().top;
      //console.log("要前往元素的上方位置：" + top);

      // 網頁元素.停止().動畫({ 上方捲動：指定元素 - 位移}，持續時間)
      // parseInt() 將文字轉為數字

      $("html").stop().animate({
        scrollTop: top - offset
      }, parseInt(duration));
    }
  });
});

// 避免動畫與使用者滾輪衝突
// html 在滾動滾輪時 停止 html 所有效果
$("html").on("mousewheel", function () {
  $("html").stop();
});

// gotop下滑效果
$(".arrow").hide();
$(window).scroll(function () {
  var y = window.scrollY;

  if (y > 500) {
    $(".arrow").show();
  } else {
    $(".arrow").hide();
  }

});
console.log(28);
//  $('.nav-item2').click(function(){
// $(this).toggleClass('after-nav')
//  })


// function funcTest2() {
//   $.ajax({
//     method: "GET",
//     url: "designer4.json",
//     dataType: "json",
//   })

//     .done(function (msg) {
//       var desBanner = '';
//       var MobBanner = '';
//       var bodyBannerDes = '';
//       console.log(msg);
//       var res = msg.length;
//       console.log(res);
//       const limit = res;
//       var arrIndex = Math.floor(Math.random() * msg.length);
//       console.log(arrIndex);
//       console.log(msg[arrIndex].Designerimg);

//       desBanner += ' \
//               <div class="banner-des row vertical align-items-end px-0 mx-0">\
//                 <div class="banner-0 col-0 order-1 col-lg-5 order-1 pe-0">\
//                 <img class="img-fluid" src="./img/banner/bannertitle.png" alt="">\
//                 </div>\
//                 <div class="banner-1 col-5 order-3 col-lg-5 order-2 text-white text-end py-3">\
//                   <a style="text-decoration: none;color:#fff;" href="./about/index.html?id='+ msg[arrIndex].id + '"><div class="banner1-1" style="font-weight: 900;">' + msg[arrIndex].WorkName + '</div>\
//                     <p><span class="fs-5">'+ msg[arrIndex].DesignerName + '</span>設計師</p>\
//                   </a>\
//                   <button type="button" class="btn border border-white"><a target="_blank" href="tel: '+ msg[arrIndex].TollFreeCall + '"><img class="" src="img/002-phone-call.svg" alt=""></a>\</button>\
//               <button type="button" class="btn border border-white" data-bs-toggle="modal" data-bs-target="#exampleModal"><img class="" src="img/001-blogging.svg" alt=""></button>\
//                 </div>\
//                 <div class="banner-2 col-7 order-2 col-lg-2 order-3 px-0 mx-0">\
//                 <a class="desbutton" data-info="'+ msg[arrIndex].id + '" href="./about/index.html?id='+ msg[arrIndex].id + '"><img class="img-fluid" src="' + msg[arrIndex].Designerimg + '" alt=""></a>\
//                 </div>\
//             </div>';

//       MobBanner += ' \
//               <div class="banner-m row vertical align-items-end px-0 mx-0">\
//               <div class="bannerm-0 col-12 my-5 px-0">\
//               <img class="img-fluid" src="./img/banner/banner-mobile.png" alt="">\
//               </div>\
//               <div class="bannerm-2 col-7 order-2 col-lg-2 order-3 px-0 mx-0">\
//               <a href="./about/index.html?id='+ msg[arrIndex].id + '"><img class="img-fluid" src="' + msg[arrIndex].Designerimg + '" alt=""></a>\
//               </div>\
//               <div class="bannerm-1 col-5 order-3 col-lg-5 order-2 text-white text-start pb-3">\
//               <a style="text-decoration: none;color:#fff;" href="./about/index.html?id='+ msg[arrIndex].id + '">\
//               <div class="banner1-1 pt-3 pb-4" style="font-weight: 900;">'+ msg[arrIndex].WorkName + '</div>\
//               <p class=""><span class="fs-5">'+ msg[arrIndex].DesignerName + '</span>設計師</p>\
//               </a>\
//               <button type="button" class="btn border border-white"><a target="_blank" href="tel: '+ msg[arrIndex].TollFreeCall + '"><img class="" src="img/002-phone-call.svg" alt=""></a>\</button>\
//               <button type="button" class="btn border border-white" data-bs-toggle="modal" data-bs-target="#exampleModal"><img class="" src="img/001-blogging.svg" alt=""></button>\
//               </div>\
//             </div > ';

//       bodyBannerDes += ' \
//             <img class="banner-img img-fluid" id="img_id"  src="'+ msg[arrIndex].workimg[0].img + '" alt="">\
//            ';



//       $('.banner-des').html(desBanner);
//       $('.banner-m').html(MobBanner);
//       $('#bannerdes-img').html(bodyBannerDes);
//       // var test = msg[0].newstext1;

//       // $('#jsontest').append(test);
//     });


// }
// window.onload = funcTest2();

// window.setInterval("funcTest2()", 1000 * 8);


// $(document).ready(function () {

//   $.ajax({
//     method: "GET",
//     url: "designer4.json",
//     dataType: "json",
//   })

//     .done(function (msg) {

//       var DesignerContent = '';
//       console.log(msg)
//       for (var i = 0; i < msg.length; i++) {
//         // new_des1.push(msg[msg.length].id);

//         DesignerContent += ' \
//               <div id="'+ msg[i].id + '" class="secimg col-4  col-lg-2 mx-0 px-0 border-0"><a  href="./about/index.html?id=' + msg[i].id + '"><img class="img-fluid"\
//                 src="'+ msg[i].Designerimg + '"\
//                 alt="">\
//                 <div class="sec02-p-m p-1 mt-1 text-center">\
//                 <p class="my-0">'+ msg[i].WorkName + '</p>\
//                 <p>'+ msg[i].DesignerName + '</p>\
//                 </div>\
//                 </a>\
//               </div>';

//       }
//       $('.sec01-designer').html(DesignerContent);
//       // var test = msg[0].newstext1;

//       // $('#jsontest').append(test);
//     });



// });



function funcTest5() {
  $.ajax({
    method: "GET",
    url: "designer4.json",
    dataType: "json",
    async: false,
  })
    .done(function (msg) {
      console.log(msg);
      function shuffleArray(inputArray) {
        inputArray.sort(() => Math.random() - 0.5);
      }
      shuffleArray(msg);
      console.log(msg.length);
      // temp初始化
      for (var i = 0; i < msg.length; i++) {
        temp[i] = msg[i].id
      }
      templength = temp.length;
    });


}

var templength = 0;
var des1 = [];
var des2 = [];
var temp = [];
var numb1 = [];
funcTest5();
funcTest4();


function funcTest4() {
  for (var j = 0; j < templength; j++) {
    des1[j] = temp[j]
  }
  console.log(des1)
  for (var j = 0; j < des1.length - 1; j++) {
    des2[j] = des1[j]
  }
  numb1[0] = des1[des1.length - 1];
  for (var j = 0; j < des1.length - 1; j++) {
    numb1[j + 1] = des2[j];
  }

  for (var j = 0; j < numb1.length; j++) {
    temp[j] = numb1[j];
  }
  console.log(temp);


  var desBanner = '';
  var MobBanner = '';
  var bodyBannerDes = '';
  var DesignerContent = '';
  for (var i = 0; i < temp.length; i++) {
    var deslist = 0;
    var deslist2 = 0;
    deslist = get_data(temp[i]);
    deslist2 = get_data(temp[0]);
    DesignerContent += ' \
            <div id="'+ deslist.id + '" class="secimg col-4  col-lg-2 mx-0 px-0 border-0"><a  href="./about/index.html?id=' + deslist.id + '"><img class="img-fluid"\
              src="'+ deslist.Designerimg + '"\
              alt="">\
              <div class="sec02-p-m p-1 mt-1 text-center">\
              <p class="my-0">'+ deslist.WorkName + '</p>\
              <p>'+ deslist.DesignerName + '</p>\
              </div>\
              </a>\
            </div>';





  }
  desBanner += ' \
          <div class="banner-des row vertical align-items-end px-0 mx-0">\
            <div class="banner-0 col-0 order-1 col-lg-5 order-1 pe-0">\
            <img class="img-fluid" src="./img/banner/bannertitle.png" alt="">\
            </div>\
            <div class="banner-1 col-5 order-3 col-lg-5 order-2 text-white text-end py-3">\
              <a style="text-decoration: none;color:#fff;" href="./about/index.html?id='+ deslist2.id + '"><div class="banner1-1" style="font-weight: 900;">' + deslist2.WorkName + '</div>\
                <p><span class="fs-5">'+ deslist2.DesignerName + '</span>設計師</p>\
              </a>\
              <button type="button" class="btn border border-white"><a target="_blank" href="tel: '+ deslist2.TollFreeCall + '"><img class="" src="img/002-phone-call.svg" alt=""></a>\</button>\
              <button type="button" id="'+ deslist2.id + '" data-info="' + deslist2.id + '" class="mesg btn border border-white" data-bs-toggle="modal" data-bs-target="#exampleModal"><img class="" src="img/001-blogging.svg" alt=""></button>\
            </div>\
            <div class="banner-2 col-7 order-2 col-lg-2 order-3 px-0 mx-0">\
            <a class="desbutton" data-info="'+ deslist2.id + '" href="./about/index.html?id=' + deslist2.id + '"><img class="img-fluid" src="' + deslist2.Designerimg + '" alt=""></a>\
            </div>\
        </div>';


  MobBanner += ' \
          <div class="banner-m row vertical align-items-end px-0 mx-0">\
          <div class="bannerm-0 col-12 my-5 px-0">\
          <img class="img-fluid" src="./img/banner/banner-mobile.png" alt="">\
          </div>\
          <div class="bannerm-2 col-7 order-2 col-lg-2 order-3 px-0 mx-0">\
          <a href="./about/index.html?id='+ deslist2.id + '"><img class="img-fluid" src="' + deslist2.Designerimg + '" alt=""></a>\
          </div>\
          <div class="bannerm-1 col-5 order-3 col-lg-5 order-2 text-white text-start pb-3">\
          <a style="text-decoration: none;color:#fff;" href="./about/index.html?id='+ deslist2.id + '">\
          <div class="banner1-1 pt-3 pb-1" style="font-weight: 900;">'+ deslist2.WorkName + '</div>\
          <p class=""><span class="fs-5">'+ deslist2.DesignerName + '</span>設計師</p>\
          </a>\
          <button type="button" class="btn border border-white"><a target="_blank" href="tel: '+ deslist2.TollFreeCall + '"><img class="" src="img/002-phone-call.svg" alt=""></a>\</button>\
          <button type="button" id="'+ deslist2.id + '" class="btn border border-white" data-bs-toggle="modal" data-bs-target="#exampleModal"><img class="" src="img/001-blogging.svg" alt=""></button>\
          </div>\
        </div > ';

  bodyBannerDes += ' \
        <img class="banner-img img-fluid" id="img_id"  src="'+ deslist2.workimg[0].img + '" alt="">\
       ';

  $('.banner-des').html(desBanner);
  $('.banner-m').html(MobBanner);
  $('#bannerdes-img').html(bodyBannerDes);
  $('.sec01-designer').html(DesignerContent);
  console.log(deslist2);


}



function get_data(id) {
  var A = [];
  $.ajax({
    method: "GET",
    url: "../designer4.json",
    dataType: "json",
    async: false,
  })
    .done(function (msg) {
      for (var i = 0; i < msg.length; i++) {
        if (msg[i].id == id) {
          A = msg[i]
        }
      }
    });

  return A
}



setInterval("funcTest4()", 1000 * 10);







// if (msg[i].id == id) {
//   console.log()
// }
// setInterval("funcTest5()", 5000);

// 點選該設計師，導至其對應id的參數網址

// $('#278').click(function () {
//   console.log(1);
//   window.location.href = `./about/index.html?id=278`;
// });
// $('#507').click(function () {
//   console.log(2);
//   window.location.href = `./about/index.html?id=507`;
// });


// $('#423').click(function () {
//   console.log(3);
//   window.location.href = `./about/index.html?id=423`;
// });

// $('#594').click(function () {
//   console.log(4);
//   window.location.href = `./about/index.html?id=594`;
// });

// $('#364').click(function () {
//   console.log(5);
//   window.location.href = `./about/index.html?id=364`;
// });
// $('#500').click(function () {
//   console.log(6);
//   window.location.href = `./about/index.html?id=500`;
// });

// $('#651').click(function () {
//   console.log(7);
//   window.location.href = `./about/index.html?id=651`;
// });

// $('#347').click(function () {
//   console.log(8);
//   window.location.href = `./about/index.html?id=347`;
// });

// $('#363').click(function () {
//   console.log(9);
//   window.location.href = `./about/index.html?id=363`;
// });

// $('#555').click(function () {
//   console.log(10);
//   window.location.href = `./about/index.html?id=555`;
// });

// $('#79').click(function () {
//   console.log(11);
//   window.location.href = `./about/index.html?id=79`;
// });
// $('#158').click(function () {
//   console.log(12);
//   window.location.href = `./about/index.html?id=158`;
// });

// $('#301').click(function () {
//   console.log(13);
//   window.location.href = `./about/index.html?id=301`;
// });

// $('#402').click(function () {
//   console.log(14);
//   window.location.href = `./about/index.html?id=402`;
// });

// $('#131').click(function () {
//   console.log(15);
//   window.location.href = `./about/index.html?id=131`;
// });

// $('#28').click(function () {
//   console.log(16);
//   window.location.href = `./about/index.html?id=28`;
// });

// $('#65').click(function () {
//   console.log(17);
//   window.location.href = `./about/index.html?id=65`;
// });
// $('#672').click(function () {
//   console.log(9);
//   window.location.href = `./about/index.html?id=672`;
// });
// $('#438').click(function () {
//   console.log(9);
//   window.location.href = `./about/index.html?id=438`;
// });
// $('#291').click(function () {
//   console.log(9);
//   window.location.href = `./about/index.html?id=291`;
// });
// $('#465').click(function () {
//   console.log(9);
//   window.location.href = `./about/index.html?id=465`;
// });
// $('#436').click(function () {
//   console.log(9);
//   window.location.href = `./about/index.html?id=436`;
// });
// $('#279').click(function () {
//   console.log(9);
//   window.location.href = `./about/index.html?id=279`;
// });
// $('#418').click(function () {
//   console.log(9);
//   window.location.href = `./about/index.html?id=418`;
// });
// $('#385').click(function () {
//   console.log(9);
//   window.location.href = `./about/index.html?id=385`;
// });
// $('#688').click(function () {
//   console.log(9);
//   window.location.href = `./about/index.html?id=688`;
// });
// $('#474').click(function () {
//   console.log(9);
//   window.location.href = `./about/index.html?id=474`;
// });
// $('#505').click(function () {
//   console.log(9);
//   window.location.href = `./about/index.html?id=505`;
// });
// $('#712').click(function () {
//   console.log(9);
//   window.location.href = `./about/index.html?id=712`;
// });
// $('#680').click(function () {
//   console.log(9);
//   window.location.href = `./about/index.html?id=680`;
// });
// $('#705').click(function () {
//   console.log(9);
//   window.location.href = `./about/index.html?id=705`;
// });
// $('#23').click(function () {
//   console.log(9);
//   window.location.href = `./about/index.html?id=23`;
// });

// $('#33').click(function () {
//   console.log(9);
//   window.location.href = `./about/index.html?id=33`;
// });

// $('#491').click(function () {
//   console.log(9);
//   window.location.href = `./about/index.html?id=491`;
// });



// function funcTest() {
//   $("div.sec01-designer div").sort(function () {
//     return Math.random() * 10 > 5 ? 1 : -1;
//   }).each(function () {
//     var $t = $(this),
//       color = $t.attr("");
//     $t.css({ backgroundColor: color }).appendTo($t.parent());
//   });

// }
// window.setInterval("funcTest()", 1000 * 10);
// window.onload = funcTest();
$.fn.serializeObject = function () {
  var o = {};
  var a = this.serializeArray();
  o["id"] = 0;
  o["time_stamp"] = "";
  $.each(a, function () {
    if (o[this.name]) {
      if (!o[this.name].push) {
        o[this.name] = [o[this.name]];
      }
      o[this.name].push(this.value || '');
    } else {
      o[this.name] = this.value || '';
    }
  });

  return o;
};

$(".contact-form1").submit(function (e) {
  /*	var formRef = $('#form1').serializeArray();
    var jsonString = JSON.stringify(formRef);*/
  var jsonInfo = $('.contact-form1').serializeObject();
  var jsonString = JSON.stringify(jsonInfo);
  console.log(jsonString);
  $.ajax({
    type: 'POST',
    url: 'https://go.hhh.com.tw:8002/deco_request_detail',
    data: jsonString,
    dataType: 'json',

    success: function (data) {
      console.log('送出成功: ' + data);
      if (data == 0) {
        alert("送出成功");
      } else if (data == 1) {
        alert("此email已填過表單");
      } else if (data == 2) {
        alert("此phone已填過表單");
      } else if (data == 3) {
        alert("此email、phone已填過表單");
      }
      location.href = "./index_complete_line.html";
    },

    beforeSend: function () {
      console.log('beforeSend');
    },
    complete: function () {
      console.log('complete');

    },

    error: function (jqXHR, textStatus, errorThrown) {
      console.log(JSON.stringify(jqXHR));
      console.log("AJAX errr: " + textStatus + ' : ' + errorThrown);
      console.log('送出失敗: ' + jqXHR.responseText);
      alert("送出失敗");
    }
  });

  return false;
});
$(function () {
  var dateToday = new Date();
  //jQuery datepicker 設定限制日期最小最大 minDate maxDate hideIfNoPrevNext
  $(".datepicker").datepicker({
    //顯示上個月日期 及下個月日期 ，但是不可選的。
    //default:false
    showOtherMonths: true,
    // 設置當沒有上一個/下一個可選擇的情況下，隱藏掉相應的按鈕。（默認為不可用）
    //配合有設定最大最小時使用
    //default:false
    hideIfNoPrevNext: true,

    minDate: dateToday,
    //  設置一個最大的可選日期。可以是Date對象，或者是數字（從今天算起，例如+7），
    //或者有效的字符串('y'代表年, 'm'代表月, 'w'代表周, 'd'代表日, 例如：'+1m +7d')。
  });
});

$(".mesg").click(function () {
  var desid =$(this).data("info");
  console.log(desid);
  // var desid2=String(desid);
  // console.log(desid2);
  $("#version").val(desid);
  // $("#version").html(desid);
});