bro.js

window.Questionnaire = (

  function init() {

    console.log('brororororororor');

    // forces the questionnaire and success page to show
    // only for development purposes
    var dev_mode = false;


    var $success_page = $('.template-suffix-questionnaire-success');

    // deal with the success page here
    if($success_page.length) {

      if(!dev_mode) {
        var value = localStorage.getItem('account_questions_answered');
        if(!value) {
          window.location.href = "/";
        } else {
          showSuccessPage();
        }
      } else {
        showSuccessPage();
      }
    }

    function showSuccessPage() {
      $success_page.show();
    }
  }



  // only run if:
  // 1: there is no .no-questionnaire-modal element on the page
  // 2: if a customer is NOT logged in
  // 3: if there is no instance of the #questionnaire element
  if($('.no-questionnaire-modal').length || $('body').hasClass('customer-logged-in') || !$('#questionnaire').length) return;

  // els
  var $body = $('body'),
      $el = $('#questionnaire'),
      $bg = $el.find('.bg'),
      $close = $el.find('.close'),
      $steps = $el.find('.step'),
      $questions = $el.find('.question'),
      $buttons = $el.find('.btn'),
      $btn1 = $el.find('.btn.step-1-complete'),
      storageKey = 'questionnaire_shown',
      selectedItems = [],
      tags = [];

  // if dev mode, always show the questionnaire
  // else set localStorage to only show it to new visitors
  if(!dev_mode) {

    var value = localStorage.getItem(storageKey);

    // if there's a value, then we know it's been shown
    // and set before, so get out of this code
    if(value) return;

    // else, this is the first time
    localStorage.setItem(storageKey, true);

    // if all passes, show the questionnaire
    showModal();

  } else {
    showModal();
  }


  // events
  $bg.on('click', closeModal);
  $close.on('click', closeModal);
  $buttons.on('click', btnClick);
  $questions.find('input').on('change', validate);

  function showModal(e) {
    $el.addClass('reveal');
  }

  function closeModal(e) {
    $el.removeClass('reveal');
  }

  function hideButton() {
    $btn1.addClass('disabled');
  }

  function showButton() {
    $btn1.removeClass('disabled');
  }

  function next() {
    $el.find('.step-1').removeClass('reveal');
    $el.find('.step-2').addClass('reveal');
    gatherTags();
  }

  function previous() {
    $el.find('.step-2').removeClass('reveal');
    $el.find('.step-1').addClass('reveal');
  }

  // button click
  function btnClick() {
    if($(this).hasClass('disabled')) return;
    if($(this).hasClass('step-1-complete')) next();
    if($(this).hasClass('back-to-step-1')) previous();
  };

  function validate() {

    var errors = [];

    selectedItems = [];

    $questions.each(function(i, el) {

      // zero the hit counter
      var hits = 0;

      // loop through and see if there's a check
      $(el).find('input').each(function(i, el) {
        if($(el).is(':checked')) {
          hits++;
          selectedItems.push($(el));
        }
      });

      // if nothings' checked, push an error for this $question
      if(hits == 0) errors.push('error');
    });

    // if errors, hide the button, else show the button
    if(errors.length) hideButton();
    else showButton();

  }

  // get all the tags from the corresponding inputs
  function gatherTags() {

    tags = [];

    // loop through selectedItems to pull out the tags
    for(var i = 0; i < selectedItems.length; i++) {
      var tag = selectedItems[i].data('tag');
      if(tag != 'no_tag') tags.push(tag);
    }

    if(tags.length > 0) searchForMatch();
    else alert('Something wen\'t wrong, please try again.');

  }

  // create the URL
  function massageTags() {
    var url = '';

    // if tags length == 1, then create and return
    // else loop through tags and build it
    if(tags.length == 1) {
      url = tags[0];
    } else {
      for(var i = 0; i < tags.length; i++) {
        url += tags[i];
        if(i < (tags.length -1)) url += '%20OR%20';
      }
    }

    return url;
  }

  // search for the best match using the shopify search API
  function searchForMatch() {

    var search_url = '/search?view=json&q=tag:' + massageTags() + '&type=product';

    //ajax to /search and pass params
    $.ajax({
      url: search_url,
      dataType: 'json',
      success: function(r) {
        parseMatches(r);
      },
      error: function(error) {
        alert('Something wen\'t wrong, please try again.');
      }
    });

  }

  // parse the matches and see which one rises to the top
  function parseMatches(data) {
    //localStorage.setItem('chosenProduct', data.results[0].handle);
    //window.location.href = '/products/' + data.results[0].handle + '?view=questionnaire-success'
  }


  return {
    init: init
  }
)();