|
1 | 1 | $(document).ready(function(){ |
2 | | -letcheckboxesContainer=$('#benefits_container'); |
3 | | -letcostLabel=$("#cost_label"); |
4 | | -letcost=0; |
| 2 | +constSELECTORS={ |
| 3 | +checkboxesContainer:()=>$('#benefits_container'), |
| 4 | +costLabel:()=>$("#cost_label"), |
| 5 | +clearFormBtn:()=>$("#clear_form_btn"), |
| 6 | +packageInput:()=>$("input[name=package]"), |
| 7 | +applicationForm:()=>$("#application_form"), |
| 8 | +getPackageInfo:(packageId)=>$("#package_benefits_"+packageId), |
| 9 | +getPackageBenefits:(packageId)=>SELECTORS.getPackageInfo(packageId).children(), |
| 10 | +benefitsInputs:()=>$("input[id^=id_benefits_]"), |
| 11 | +getBenefitLabel:(benefitId)=>$('label[benefit_id='+benefitId+']'), |
| 12 | +getBenefitInput:(benefitId)=>SELECTORS.benefitsInputs().filter('[value='+benefitId+']'), |
| 13 | +getBenefitConflicts:(benefitId)=>$('#conflicts_with_'+benefitId).children(), |
| 14 | +getSelectedBenefits:()=>SELECTORS.benefitsInputs().filter(":checked"), |
| 15 | +} |
5 | 16 |
|
6 | | -$("#clear_form_btn").click(function(){ |
7 | | -$("#application_form").trigger("reset"); |
8 | | -$("#application_form [class=active]").removeClass("active"); |
9 | | -$("input[name=package]").prop("checked",false); |
10 | | -checkboxesContainer.find(':checkbox').each(function(){ |
| 17 | +displayPackageCost=(packageId)=>{ |
| 18 | +letpackageInfo=SELECTORS.getPackageInfo(packageId); |
| 19 | +letcost=packageInfo.attr("data-cost"); |
| 20 | +SELECTORS.costLabel().html('Sponsorship cost is $'+cost.toString().replace(/\B(?=(\d{3})+(?!\d))/g,",")+' USD') |
| 21 | +} |
| 22 | + |
| 23 | + |
| 24 | + |
| 25 | +SELECTORS.clearFormBtn().click(function(){ |
| 26 | +SELECTORS.applicationForm().trigger("reset"); |
| 27 | +SELECTORS.applicationForm().find("[class=active]").removeClass("active"); |
| 28 | +SELECTORS.packageInput().prop("checked",false); |
| 29 | +SELECTORS.checkboxesContainer().find(':checkbox').each(function(){ |
11 | 30 | $(this).prop('checked',false); |
12 | 31 | if($(this).attr("package_only"))$(this).attr("disabled",true); |
13 | 32 | }); |
14 | | -$("#cost_label").html(""); |
| 33 | +SELECTORS.costLabel().html(""); |
15 | 34 | }); |
16 | 35 |
|
17 | | -$("input[name=package]").change(function(){ |
| 36 | +SELECTORS.packageInput().change(function(){ |
18 | 37 | letpackage=this.value; |
19 | 38 | if(package.length==0)return; |
20 | 39 |
|
21 | | -costLabel.html("Updating cost...") |
| 40 | +SELECTORS.costLabel().html("Updating cost...") |
22 | 41 |
|
23 | | -checkboxesContainer.find(':checkbox').each(function(){ |
| 42 | +SELECTORS.checkboxesContainer().find(':checkbox').each(function(){ |
24 | 43 | $(this).prop('checked',false); |
25 | 44 | letpackageOnlyBenefit=$(this).attr("package_only"); |
26 | 45 | if(packageOnlyBenefit)$(this).attr("disabled",true); |
27 | 46 | }); |
28 | 47 |
|
29 | | -letpackageInfo=$("#package_benefits_"+package); |
30 | | -packageInfo.children().each(function(){ |
| 48 | +SELECTORS.getPackageBenefits(package).each(function(){ |
31 | 49 | letbenefit=$(this).html() |
32 | | -letbenefitInput=checkboxesContainer.find('[value='+benefit+']'); |
| 50 | +letbenefitInput=SELECTORS.getBenefitInput(benefit); |
33 | 51 | letpackageOnlyBenefit=benefitInput.attr("package_only"); |
34 | 52 | benefitInput.removeAttr("disabled"); |
35 | 53 | benefitInput.trigger("click"); |
36 | 54 | }); |
37 | | - |
38 | | -leturl=$("#cost_container").attr("calculate_cost_url"); |
39 | | -letdata=$("form").serialize(); |
40 | | - |
41 | | -letcost=packageInfo.attr("data-cost"); |
42 | | -costLabel.html('Sponsorship cost is $'+cost.toString().replace(/\B(?=(\d{3})+(?!\d))/g,",")+' USD') |
| 55 | +displayPackageCost(package); |
43 | 56 | }); |
44 | 57 |
|
45 | | -$("input[id^=id_benefits_]").change(function(){ |
| 58 | +SELECTORS.benefitsInputs().change(function(){ |
46 | 59 | letbenefit=this.value; |
47 | 60 | if(benefit.length==0)return; |
48 | | -if(costLabel.html()!="Updating cost...")costLabel.html("Please submit your customized sponsorship package application and we'll contact you within 2 business days."); |
49 | 61 |
|
50 | | -letactive=checkboxesContainer.find('[value='+benefit+']').prop("checked"); |
| 62 | +// display package cost if custom benefit change result matches with package's benefits list |
| 63 | +letisChangeFromPackageChange=SELECTORS.costLabel().html()=="Updating cost..." |
| 64 | +if(!isChangeFromPackageChange){ |
| 65 | +letselectedBenefits=SELECTORS.getSelectedBenefits(); |
| 66 | +selectedBenefits=$.map(selectedBenefits,(b)=>$(b).val()).sort(); |
| 67 | +letselectedPackageId=SELECTORS.packageInput().filter(":checked").val() |
| 68 | +letpackageBenefits=SELECTORS.getPackageBenefits(selectedPackageId); |
| 69 | +packageBenefits=$.map(packageBenefits,(b)=>$(b).text()).sort(); |
| 70 | + |
| 71 | +// check same num of benefits and join with string. if same string, both lists have the same benefits |
| 72 | +if(packageBenefits.length==selectedBenefits.length&&packageBenefits.join(',')===selectedBenefits.join(',')){ |
| 73 | +displayPackageCost(selectedPackageId); |
| 74 | +}else{ |
| 75 | +letmsg="Please submit your customized sponsorship package application and we'll contact you within 2 business days."; |
| 76 | +SELECTORS.costLabel().html(msg); |
| 77 | +} |
| 78 | +} |
| 79 | + |
| 80 | +// updates the input to be active if needed |
| 81 | +letactive=SELECTORS.getBenefitInput(benefit).prop("checked"); |
51 | 82 | if(!active){ |
52 | 83 | return; |
53 | 84 | }else{ |
54 | | -$('label[benefit_id='+benefit+']').addClass("active"); |
| 85 | +SELECTORS.getBenefitLabel(benefit).addClass("active"); |
55 | 86 | } |
56 | 87 |
|
57 | | - |
58 | | -$('#conflicts_with_'+benefit).children().each(function(){ |
| 88 | +// check and ensure conflicts constraints between checked benefits |
| 89 | +SELECTORS.getBenefitConflicts(benefit).each(function(){ |
59 | 90 | letconflictId=$(this).html(); |
60 | | -letconflictCheckbox=checkboxesContainer.find('[value='+conflictId+']'); |
61 | | -letchecked=conflictCheckbox.prop("checked"); |
| 91 | +letchecked=SELECTORS.getBenefitInput(conflictId).prop("checked"); |
62 | 92 | if(checked){ |
63 | 93 | conflictCheckbox.trigger("click"); |
64 | 94 | conflictCheckbox.parent().removeClass("active"); |
|