(function() {
  $('#J_Slider').slider({
    speed: 300,
    autoplay: 2000,
    lazyLoad: true
  });

  var MenuList = ['西红柿','猪蹄','红烧肉','蛋炒饭','黄瓜']


  function getData() {
    get({
      url: '/query',
      data: {
        menu: MenuList[Math.floor(Math.random()*5)]
      },
      callback: function(res) {
        renderList(res)
      }
    })
  }


  function renderList (list) {
    list.data.forEach(val => {
      $('article').append(`<a class="list-item">
                              <div class="list-img">
                                  <img src="${val.albums[0]}">
                              </div>
                              <div class="list-mes">
                                  <h3 class="list-title">${val.title}</h3>
                                  <div class="list-mes-item">
                                      <div>
                                        <span class="list-del-price">${val.ingredients.substring(0,17)}...</span>
                                      </div>
                                  </div>
                              </div>
                          </a>`)
    });
    bindClick(list.data)
  }

  function bindClick (data) {
    $("article a").on('click', function() {
      localStorage.setItem("info", JSON.stringify(data[$(this).index()]))
      location.href="info.html"
    })
  }

  getData()


})()