crm.fsf.org/20131203/files/sites/all/modules-new/civicrm/templates/CRM/Contribute/Form/Contribution/PremiumBlock.tpl

   1 {*
   2  +--------------------------------------------------------------------+
   3  | CiviCRM version 4.6                                                |
   4  +--------------------------------------------------------------------+
   5  | Copyright CiviCRM LLC (c) 2004-2015                                |
   6  +--------------------------------------------------------------------+
   7  | This file is a part of CiviCRM.                                    |
   8  |                                                                    |
   9  | CiviCRM is free software; you can copy, modify, and distribute it  |
  10  | under the terms of the GNU Affero General Public License           |
  11  | Version 3, 19 November 2007 and the CiviCRM Licensing Exception.   |
  12  |                                                                    |
  13  | CiviCRM is distributed in the hope that it will be useful, but     |
  14  | WITHOUT ANY WARRANTY; without even the implied warranty of         |
  15  | MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.               |
  16  | See the GNU Affero General Public License for more details.        |
  17  |                                                                    |
  18  | You should have received a copy of the GNU Affero General Public   |
  19  | License and the CiviCRM Licensing Exception along                  |
  20  | with this program; if not, contact CiviCRM LLC                     |
  21  | at info[AT]civicrm[DOT]org. If you have questions about the        |
  22  | GNU Affero General Public License or the licensing of CiviCRM,     |
  23  | see the CiviCRM license FAQ at http://civicrm.org/licensing        |
  24  +--------------------------------------------------------------------+
  25 *}
  26 {if $products}
  27   <div id="premiums" class="premiums-group">
  28     {if $context EQ "makeContribution"}
  29       <fieldset class="crm-group premiums_select-group">
  30       {if $premiumBlock.premiums_intro_title}
  31         <legend>{$premiumBlock.premiums_intro_title}</legend>
  32       {/if}
  33       {if $premiumBlock.premiums_intro_text}
  34         <div id="premiums-intro" class="crm-section premiums_intro-section">
  35           {$premiumBlock.premiums_intro_text}
  36         </div>
  37       {/if}
  38     {/if}
  39
  40     {if $context EQ "confirmContribution" OR $context EQ "thankContribution"}
  41     <div class="crm-group premium_display-group">
  42       <div class="header-dark">
  43         {if $premiumBlock.premiums_intro_title}
  44           {$premiumBlock.premiums_intro_title}
  45         {else}
  46           {ts}Your Premium Selection{/ts}
  47         {/if}
  48       </div>
  49     {/if}
  50
  51     {if $preview}
  52       {assign var="showSelectOptions" value="1"}
  53     {/if}
  54
  55     {strip}
  56       <div id="premiums-listings">
  57       {if $showPremium AND !$preview AND $premiumBlock.premiums_nothankyou_position EQ 1}
  58         <div class="premium premium-no_thanks" id="premium_id-no_thanks" min_contribution="0">
  59           <div class="premium-short">
  60             <input type="checkbox" disabled="disabled" /> {$premiumBlock.premiums_nothankyou_label}
  61           </div>
  62           <div class="premium-full">
  63             <input type="checkbox" checked="checked" disabled="disabled" /> {$premiumBlock.premiums_nothankyou_label}
  64           </div>
  65         </div>
  66       {/if}
  67       {foreach from=$products item=row}
  68         <div class="premium {if $showPremium}premium-selectable{/if}" id="premium_id-{$row.id}" min_contribution="{$row.min_contribution}">
  69           <div class="premium-short">
  70             {if $row.thumbnail}<div class="premium-short-thumbnail"><img src="{$row.thumbnail}" alt="{$row.name}" /></div>{/if}
  71             <div class="premium-short-content">{$row.name}</div>
  72             <div style="clear:both"></div>
  73           </div>
  74
  75           <div class="premium-full">
  76             <div class="premium-full-image">{if $row.image}<img src="{$row.image}" alt="{$row.name}" />{/if}</div>
  77             <div class="premium-full-content">
  78               <div class="premium-full-title">{$row.name}</div>
  79               <div class="premium-full-disabled">
  80                 {ts 1=$row.min_contribution|crmMoney}You must contribute at least %1 to get this item{/ts}<br/>
  81                 <input type="button" value="{ts 1=$row.min_contribution|crmMoney}Contribute %1 Instead{/ts}" amount="{$row.min_contribution}" />
  82               </div>
  83               <div class="premium-full-description">
  84                 {$row.description}
  85               </div>
  86               {if $showSelectOptions }
  87                 {assign var="pid" value="options_"|cat:$row.id}
  88                 {if $pid}
  89                   <div class="premium-full-options">
  90                     <p>{$form.$pid.html}</p>
  91                   </div>
  92                 {/if}
  93               {else}
  94                 <div class="premium-full-options">
  95                   <p><strong>{$row.options}</strong></p>
  96                 </div>
  97               {/if}
  98               {if ( ($premiumBlock.premiums_display_min_contribution AND $context EQ "makeContribution") OR $preview EQ 1) AND $row.min_contribution GT 0 }
  99                 <div class="premium-full-min">{ts 1=$row.min_contribution|crmMoney}Minimum: %1{/ts}</div>
 100               {/if}
 101             <div style="clear:both"></div>
 102             </div>
 103           </div>
 104           <div style="clear:both"></div>
 105         </div>
 106       {/foreach}
 107       {if $showPremium AND !$preview AND $premiumBlock.premiums_nothankyou_position EQ 2}
 108         <div class="premium premium-no_thanks" id="premium_id-no_thanks" min_contribution="0">
 109           <div class="premium-short">
 110             <input type="checkbox" disabled="disabled" /> {$premiumBlock.premiums_nothankyou_label}
 111           </div>
 112           <div class="premium-full">
 113             <input type="checkbox" checked="checked" disabled="disabled" /> {$premiumBlock.premiums_nothankyou_label}
 114           </div>
 115         </div>
 116       {/if}
 117       </div>
 118     {/strip}
 119
 120     {if $context EQ "makeContribution"}
 121       </fieldset>
 122     {elseif ! $preview} {* Close premium-display-group div for Confirm and Thank-you pages *}
 123       </div>
 124     {/if}
 125   </div>
 126
 127   {if $context EQ "makeContribution"}
 128     {literal}
 129     <script>
 130       CRM.$(function($) {
 131         var is_separate_payment = {/literal}{if $membershipBlock.is_separate_payment}{$membershipBlock.is_separate_payment}{else}0{/if}{literal};
 132
 133         // select a new premium
 134         function select_premium(premium_id) {
 135           if($(premium_id).length) {
 136             // hide other active premium
 137             $('.premium-full').hide();
 138             $('.premium-short').show();
 139             // show this one
 140             $('.premium-short', $(premium_id)).hide();
 141             $('.premium-full', $(premium_id)).show();
 142             // record this one
 143             var id_parts = premium_id.split('-');
 144             $('#selectProduct').val(id_parts[1]);
 145           }
 146         }
 147
 148         // click premium to select
 149         $('.premium-short').click(function(){
 150           select_premium( '#'+$($(this).parent()).attr('id') );
 151         });
 152
 153         // select the default premium
 154         var premium_id = $('#selectProduct').val();
 155         if(premium_id == '') premium_id = 'no_thanks';
 156         select_premium('#premium_id-'+premium_id);
 157
 158         // get the current amount
 159         function get_amount() {
 160           var amount;
 161
 162           if (typeof totalfee !== "undefined") {
 163             return totalfee;
 164           }
 165
 166           // see if other amount exists and has a value
 167           if($('.other_amount-content input').length) {
 168             amount = Number($('.other_amount-content input').val());
 169             if(isNaN(amount))
 170               amount = 0;
 171           }
 172
 173           function check_price_set(price_set_radio_buttons) {
 174             if (!amount) {
 175               $(price_set_radio_buttons).each(function(){
 176                 if ($(this).prop('checked')) {
 177                   amount = $(this).attr('data-amount');
 178                   if (typeof amount !== "undefined") {
 179                     amount = Number(amount);
 180                   }
 181                   else {
 182                     amount = 0;
 183                   }
 184                 }
 185               });
 186             }
 187           }
 188
 189           // check for additional contribution
 190           var additional_amount = 0;
 191           if(is_separate_payment) {
 192             additional_amount = amount;
 193             amount = 0;
 194           }
 195
 196           // next, check for contribution amount price sets
 197           check_price_set('.contribution_amount-content input[type="radio"]');
 198
 199           // next, check for membership level price set
 200           check_price_set('.membership_amount-content input[type="radio"]');
 201
 202           check_price_set(cj('.price-set-option-content input[type="radio"]'));
 203
 204           // make sure amount is a number at this point
 205           if(!amount) amount = 0;
 206
 207           // next, check for membership/contribution level price set
 208           check_price_set('#priceset input[type="radio"]');
 209
 210           // account for is_separate_payment
 211           if(is_separate_payment && additional_amount) {
 212             amount += additional_amount;
 213           }
 214
 215           return amount;
 216         }
 217
 218         // update premiums
 219         function update_premiums() {
 220           var amount = get_amount();
 221           console.log('amount:', amount);
 222
 223           $('.premium').each(function(){
 224             var min_contribution = $(this).attr('min_contribution');
 225             if(amount < min_contribution) {
 226               $(this).addClass('premium-disabled');
 227             } else {
 228               $(this).removeClass('premium-disabled');
 229             }
 230           });
 231         }
 232
 233         cj('.other_amount-content input').change(update_premiums);
 234         cj('.contribution_amount-content input[type="radio"]').click(update_premiums);
 235         cj('.membership_amount-content input[type="radio"]').click(update_premiums);
 236         cj('.price-set-option-content input[type="radio"]').click(update_premiums);
 237
 238         $('.other_amount-content input').change(update_premiums);
 239         $('input, #priceset').change(update_premiums);
 240
 241         update_premiums();
 242
 243         // build a list of price sets
 244         var amounts = [];
 245         var price_sets = {};
 246         $('input, #priceset  select,#priceset').each(function(){
 247           if (this.tagName == 'SELECT') {
 248             var selectID = $(this).attr('id');
 249             var selectvalues = JSON.parse($(this).attr('price'));
 250             Object.keys(selectvalues).forEach(function (key) {
 251               var option = selectvalues[key].split(optionSep);
 252               amount = Number(option[0]);
 253               price_sets[amount] = '#' + selectID + '-' + key;
 254               amounts.push(amount);
 255             });
 256           }
 257           else {
 258             var amount = Number($(this).attr('data-amount'));
 259             if (!isNaN(amount)) {
 260               amounts.push(amount);
 261
 262              var id = $(this).attr('id');
 263              price_sets[amount] = '#'+id;
 264             }
 265           }
 266         });
 267         amounts.sort(function(a,b){return a - b});
 268
 269         // make contribution instead buttons work
 270         $('.premium-full-disabled input').click(function(){
 271           var amount = Number($(this).attr('amount'));
 272           if (price_sets[amount]) {
 273             if (!$(price_sets[amount]).length) {
 274               var option =  price_sets[amount].split('-');
 275               $(option[0]).val(option[1]);
 276               $(option[0]).trigger('change');
 277             }
 278             else if ($(price_sets[amount]).attr('type') == 'checkbox') {
 279                $(price_sets[amount]).prop("checked",true);
 280                if ((typeof totalfee !== 'undefined') && (typeof display == 'function')) {
 281                  if (totalfee > 0) {
 282                    totalfee += amount;
 283                  }
 284                  else {
 285                    totalfee = amount;
 286                  }
 287                  display(totalfee);
 288                }
 289              }
 290              else {
 291                $(price_sets[amount]).click();
 292                $(price_sets[amount]).trigger('click');
 293              }
 294           } else {
 295             // is there an other amount input box?
 296             if($('.other_amount-section input').length) {
 297               // is this a membership form with separate payment?
 298               if(is_separate_payment) {
 299                 var current_amount = 0;
 300                 if($('#priceset input[type="radio"]:checked').length) {
 301                   current_amount = Number($('#priceset input[type="radio"]:checked').attr('data-amount'));
 302                   if(!current_amount) current_amount = 0;
 303                 }
 304                 var new_amount = amount - current_amount;
 305                 $('.other_amount-section input').val(new_amount.toFixed(2));
 306               } else {
 307                 $('.other_amount-section input').click();
 308                 $('.other_amount-section input').val($(this).attr('amount'));
 309               }
 310             } else {
 311               // find the next best price set
 312               var selected_price_set = false;
 313               for(var i in amounts) {
 314                 if(amounts[i] >= amount) {
 315                   selected_price_set = amounts[i];
 316                   break;
 317                 }
 318               }
 319               if(!selected_price_set) {
 320                 selected_price_set = amounts[amounts.length-1];
 321               }
 322
 323               if (!$(price_sets[selected_price_set]).length) {
 324                 var option =  price_sets[selected_price_set].split('-');
 325                 $(option[0]).val(option[1]);
 326                 $(option[0]).trigger('change');
 327               }
 328               else if ($(price_sets[selected_price_set]).attr('type') == 'checkbox') {
 329                 $(price_sets[selected_price_set]).prop("checked",true);
 330                 if ((typeof totalfee !== 'undefined') && (typeof display == 'function')) {
 331                   if (totalfee > 0) {
 332                     totalfee += amount;
 333                   }
 334                   else {
 335                     totalfee = amount;
 336                   }
 337                   display(totalfee);
 338                 }
 339              }
 340              else {
 341                $(price_sets[selected_price_set]).click();
 342                $(price_sets[selected_price_set]).trigger('click');
 343              }
 344             }
 345           }
 346           update_premiums();
 347         });
 348
 349         // validation of premiums
 350         var error_message = '{/literal}{ts escape="js"}You must contribute more to get that item{/ts}{literal}';
 351         $.validator.addMethod('premiums', function(value, element, params){
 352           var premium_id = $('#selectProduct').val();
 353           var premium$ = $('#premium_id-'+premium_id);
 354           if(premium$.length) {
 355             if(premium$.hasClass('premium-disabled')) {
 356               return false;
 357             }
 358           }
 359           return true;
 360         }, error_message);
 361
 362         // add validation rules
 363         CRM.validate.functions.push(function(){
 364           $('#selectProduct').rules('add', 'premiums');
 365         });
 366
 367         // need to use jquery validate's ignore option, so that it will not ignore hidden fields
 368         CRM.validate.params['ignore'] = '.ignore';
 369       });
 370     </script>
 371     {/literal}
 372
 373   {else}
 374     {literal}
 375     <script>
 376       CRM.$(function($) {
 377         cj('.premium-short').hide();
 378         cj('.premium-full').show();
 379       });
 380     </script>
 381     {/literal}
 382   {/if}
 383 {/if}
 384