module.meritbadges.js.html

<script>

  function showUserMeritBadgeScreen(){
    console.log(GLOBALS.user.thisUserData);
    $(".userMeritBadgeList").empty();
    $.each(GLOBALS.meritBadges.meritBadges, function(index, meritBadge){
      console.log("'"+meritBadge+"'");
      console.log(GLOBALS.user.thisUserData[meritBadge]);
      var checkElem = $("<li class='meritBadgeCheck hasMeritBadge'  data-hasMeritBadge='unknown' data-badgeName='"+meritBadge+"'><span class='hasNoHas'>dunno</span> <span class='meritBadgeText'>"+meritBadge+"</span></li>");
      if(GLOBALS.user.thisUserData[meritBadge] && GLOBALS.user.thisUserData[meritBadge].toLowerCase()== "yes"){
        $(checkElem).addClass("hasMeritBadge");
        $(checkElem).addClass("active");
        $(checkElem).data('hasMeritBadge', true);
        $(".hasNoHas",checkElem).text("Has");
      }else{
        $(checkElem).addClass("noHasMeritBadge");
        $(checkElem).addClass("inactive");
        
        $(checkElem).data('hasMeritBadge', false);
        $(".hasNoHas",checkElem).text("No Has");
      }
      $(".userMeritBadgeList").append(checkElem);
    });
    $(".meritBadgeCheck").click(function(evt){
        
      if(!GLOBALS.user.sessionUser || !GLOBALS.user.sessionUser.visitorEditPriv){
        return false;
      }
      console.log("clicked");
      console.log($(this).data("hasMeritBadge"));
      var meritBadge = $(".meritBadgeText", this).text().trim();
      console.log($(".meritBadgeText", this).text());
      if($(this).data("hasMeritBadge")){
        $(".hasNoHas", this).text("No Has");
        $(this).removeClass("hasMeritBadge");
        $(this).removeClass("active");
        $(this).addClass("noHasMeritBadge");
        $(this).addClass("inactive");
        $(this).data('hasMeritBadge', false);
        GLOBALS.user.thisUserData[meritBadge] = "No";
      }else{
        $(".hasNoHas", this).text("Has");
        $(this).removeClass("noHasMeritBadge");
        $(this).removeClass("inactive");
        $(this).addClass("hasMeritBadge");
        $(this).addClass("active");
        $(this).data('hasMeritBadge', true);
        GLOBALS.user.thisUserData[meritBadge] = "Yes";
      }
      // update table
      
      google.script.run
        .withFailureHandler(function(error){console.log(error);})
        .withSuccessHandler(function(data){
          console.log(data);
      }).updateUserData(GLOBALS.user.thisUserData.netid, GLOBALS.user.thisUserData);
        
      return false;
    });
  }
  
  function showMeritBadgeEdit(){
    $(".appSection").hide();
    $(".meritBadgeEdit").show();
  }


$(function() {

    $(".showMeritBadgeEdit").click(function(){      
    console.log("showMeritBadgeEdit");
      showUserMeritBadgeScreen();  
      showMeritBadgeEdit(); 
      return false;
    });
});

</script>