Commit | Line | Data |
---|---|---|
6a488035 TO |
1 | {* |
2 | +--------------------------------------------------------------------+ | |
819d0d41 | 3 | | CiviCRM version 4.5 | |
6a488035 | 4 | +--------------------------------------------------------------------+ |
819d0d41 | 5 | | Copyright CiviCRM LLC (c) 2004-2014 | |
6a488035 TO |
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 | {crmRegion name="billing-block"} | |
27 | {* Add 'required' marker to billing fields in this template for front-end / online contribution and event registration forms only. *} | |
28 | {if $context EQ 'front-end'} | |
29 | {assign var=reqMark value=' <span class="crm-marker" title="This field is required.">*</span>'} | |
30 | {else} | |
31 | {assign var=reqMark value=''} | |
32 | {/if} | |
33 | ||
34 | {if $form.credit_card_number or $form.bank_account_number} | |
35 | <div id="payment_information"> | |
36 | <fieldset class="billing_mode-group {if $paymentProcessor.payment_type & 2}direct_debit_info-group{else}credit_card_info-group{/if}"> | |
37 | <legend> | |
38 | {if $paymentProcessor.payment_type & 2} | |
39 | {ts}Direct Debit Information{/ts} | |
40 | {else} | |
41 | {ts}Credit Card Information{/ts} | |
42 | {/if} | |
43 | </legend> | |
44 | {if $paymentProcessor.billing_mode & 2 and !$hidePayPalExpress } | |
45 | <div class="crm-section no-label paypal_button_info-section"> | |
46 | <div class="content description"> | |
47 | {ts}If you have a PayPal account, you can click the PayPal button to continue. Otherwise, fill in the credit card and billing information on this form and click <strong>Continue</strong> at the bottom of the page.{/ts} | |
48 | </div> | |
49 | </div> | |
50 | <div class="crm-section no-label {$form.$expressButtonName.name}-section"> | |
51 | <div class="content description"> | |
52 | {$form.$expressButtonName.html} | |
53 | <div class="description">Save time. Checkout securely. Pay without sharing your financial information. </div> | |
54 | </div> | |
55 | </div> | |
56 | {/if} | |
57 | ||
58 | {if $paymentProcessor.billing_mode & 1} | |
59 | <div class="crm-section billing_mode-section {if $paymentProcessor.payment_type & 2}direct_debit_info-section{else}credit_card_info-section{/if}"> | |
60 | {if $paymentProcessor.payment_type & 2} | |
61 | <div class="crm-section {$form.account_holder.name}-section"> | |
62 | <div class="label">{$form.account_holder.label}</div> | |
63 | <div class="content">{$form.account_holder.html}</div> | |
64 | <div class="clear"></div> | |
65 | </div> | |
66 | <div class="crm-section {$form.bank_account_number.name}-section"> | |
67 | <div class="label">{$form.bank_account_number.label}</div> | |
68 | <div class="content">{$form.bank_account_number.html}</div> | |
69 | <div class="clear"></div> | |
70 | </div> | |
71 | <div class="crm-section {$form.bank_identification_number.name}-section"> | |
72 | <div class="label">{$form.bank_identification_number.label}</div> | |
73 | <div class="content">{$form.bank_identification_number.html}</div> | |
74 | <div class="clear"></div> | |
75 | </div> | |
76 | <div class="crm-section {$form.bank_name.name}-section"> | |
77 | <div class="label">{$form.bank_name.label}</div> | |
78 | <div class="content">{$form.bank_name.html}</div> | |
79 | <div class="clear"></div> | |
80 | </div> | |
81 | {else} | |
82 | <div class="crm-section {$form.credit_card_type.name}-section"> | |
83 | <div class="label">{$form.credit_card_type.label} {$reqMark}</div> | |
55a9a4f4 ML |
84 | <div class="content"> |
85 | {$form.credit_card_type.html} | |
222fa502 | 86 | <div class="crm-credit_card_type-icons"></div> |
55a9a4f4 | 87 | </div> |
6a488035 TO |
88 | <div class="clear"></div> |
89 | </div> | |
90 | <div class="crm-section {$form.credit_card_number.name}-section"> | |
91 | <div class="label">{$form.credit_card_number.label} {$reqMark}</div> | |
92 | <div class="content">{$form.credit_card_number.html|crmAddClass:creditcard}</div> | |
93 | <div class="clear"></div> | |
94 | </div> | |
95 | <div class="crm-section {$form.cvv2.name}-section"> | |
96 | <div class="label">{$form.cvv2.label} {$reqMark}</div> | |
97 | <div class="content"> | |
98 | {$form.cvv2.html} | |
4f7f49d5 | 99 | <span class="cvv2-icon" title="{ts}Usually the last 3-4 digits in the signature area on the back of the card.{/ts}"> </span> |
6a488035 TO |
100 | </div> |
101 | <div class="clear"></div> | |
102 | </div> | |
103 | <div class="crm-section {$form.credit_card_exp_date.name}-section"> | |
104 | <div class="label">{$form.credit_card_exp_date.label} {$reqMark}</div> | |
105 | <div class="content">{$form.credit_card_exp_date.html}</div> | |
106 | <div class="clear"></div> | |
107 | </div> | |
108 | {/if} | |
109 | </div> | |
110 | </fieldset> | |
8ae4d0d3 | 111 | {else} |
112 | </fieldset> | |
113 | {/if} | |
114 | {/if} | |
6a488035 TO |
115 | {if $profileAddressFields} |
116 | <input type="checkbox" id="billingcheckbox" value="0"> <label for="billingcheckbox">{ts}My billing address is the same as above{/ts}</label> | |
117 | {/if} | |
118 | <fieldset class="billing_name_address-group"> | |
119 | <legend>{ts}Billing Name and Address{/ts}</legend> | |
120 | <div class="crm-section billing_name_address-section"> | |
121 | <div class="crm-section {$form.billing_first_name.name}-section"> | |
122 | <div class="label">{$form.billing_first_name.label} {$reqMark}</div> | |
123 | <div class="content">{$form.billing_first_name.html}</div> | |
124 | <div class="clear"></div> | |
125 | </div> | |
126 | <div class="crm-section {$form.billing_middle_name.name}-section"> | |
127 | <div class="label">{$form.billing_middle_name.label}</div> | |
128 | <div class="content">{$form.billing_middle_name.html}</div> | |
129 | <div class="clear"></div> | |
130 | </div> | |
131 | <div class="crm-section {$form.billing_last_name.name}-section"> | |
132 | <div class="label">{$form.billing_last_name.label} {$reqMark}</div> | |
133 | <div class="content">{$form.billing_last_name.html}</div> | |
134 | <div class="clear"></div> | |
135 | </div> | |
136 | {assign var=n value=billing_street_address-$bltID} | |
137 | <div class="crm-section {$form.$n.name}-section"> | |
138 | <div class="label">{$form.$n.label} {$reqMark}</div> | |
139 | <div class="content">{$form.$n.html}</div> | |
140 | <div class="clear"></div> | |
141 | </div> | |
142 | {assign var=n value=billing_city-$bltID} | |
143 | <div class="crm-section {$form.$n.name}-section"> | |
144 | <div class="label">{$form.$n.label} {$reqMark}</div> | |
145 | <div class="content">{$form.$n.html}</div> | |
146 | <div class="clear"></div> | |
147 | </div> | |
148 | {assign var=n value=billing_country_id-$bltID} | |
149 | <div class="crm-section {$form.$n.name}-section"> | |
150 | <div class="label">{$form.$n.label} {$reqMark}</div> | |
151 | <div class="content">{$form.$n.html|crmAddClass:big}</div> | |
152 | <div class="clear"></div> | |
153 | </div> | |
154 | {assign var=n value=billing_state_province_id-$bltID} | |
155 | <div class="crm-section {$form.$n.name}-section"> | |
156 | <div class="label">{$form.$n.label} {$reqMark}</div> | |
157 | <div class="content">{$form.$n.html|crmAddClass:big}</div> | |
158 | <div class="clear"></div> | |
159 | </div> | |
160 | {assign var=n value=billing_postal_code-$bltID} | |
161 | <div class="crm-section {$form.$n.name}-section"> | |
162 | <div class="label">{$form.$n.label} {$reqMark}</div> | |
163 | <div class="content">{$form.$n.html}</div> | |
164 | <div class="clear"></div> | |
165 | </div> | |
166 | </div> | |
167 | </fieldset> | |
8ae4d0d3 | 168 | |
6a488035 TO |
169 | </div> |
170 | ||
171 | {if $profileAddressFields} | |
172 | <script type="text/javascript"> | |
173 | {literal} | |
174 | ||
3cc60a06 | 175 | CRM.$(function($) { |
6a488035 TO |
176 | // build list of ids to track changes on |
177 | var address_fields = {/literal}{$profileAddressFields|@json_encode}{literal}; | |
6641ce78 KJ |
178 | var input_ids = {}; |
179 | var select_ids = {}; | |
ae8f569f | 180 | var orig_id, field, field_name; |
6a488035 TO |
181 | |
182 | // build input ids | |
ae8f569f CW |
183 | $('.billing_name_address-section input').each(function(i){ |
184 | orig_id = $(this).attr('id'); | |
6a488035 TO |
185 | field = orig_id.split('-'); |
186 | field_name = field[0].replace('billing_', ''); | |
187 | if(field[1]) { | |
188 | if(address_fields[field_name]) { | |
189 | input_ids['#'+field_name+'-'+address_fields[field_name]] = '#'+orig_id; | |
190 | } | |
191 | } | |
192 | }); | |
ae8f569f | 193 | if($('#first_name').length) |
6a488035 | 194 | input_ids['#first_name'] = '#billing_first_name'; |
ae8f569f | 195 | if($('#middle_name').length) |
6a488035 | 196 | input_ids['#middle_name'] = '#billing_middle_name'; |
ae8f569f | 197 | if($('#last_name').length) |
6a488035 TO |
198 | input_ids['#last_name'] = '#billing_last_name'; |
199 | ||
200 | // build select ids | |
ae8f569f CW |
201 | $('.billing_name_address-section select').each(function(i){ |
202 | orig_id = $(this).attr('id'); | |
6a488035 TO |
203 | field = orig_id.split('-'); |
204 | field_name = field[0].replace('billing_', '').replace('_id', ''); | |
205 | if(field[1]) { | |
206 | if(address_fields[field_name]) { | |
207 | select_ids['#'+field_name+'-'+address_fields[field_name]] = '#'+orig_id; | |
208 | } | |
209 | } | |
210 | }); | |
211 | ||
212 | // detect if billing checkbox should default to checked | |
213 | var checked = true; | |
214 | for(var id in input_ids) { | |
ae8f569f CW |
215 | orig_id = input_ids[id]; |
216 | if($(id).val() != $(orig_id).val()) { | |
6a488035 TO |
217 | checked = false; |
218 | break; | |
219 | } | |
220 | } | |
221 | for(var id in select_ids) { | |
ae8f569f CW |
222 | orig_id = select_ids[id]; |
223 | if($(id).val() != $(orig_id).val()) { | |
6a488035 TO |
224 | checked = false; |
225 | break; | |
226 | } | |
227 | } | |
228 | if(checked) { | |
ae8f569f | 229 | $('#billingcheckbox').prop('checked', true); |
1ad7255f DG |
230 | if (CRM.billing.billingProfileIsHideable) { |
231 | $('.billing_name_address-group').hide(); | |
232 | } | |
6a488035 TO |
233 | } |
234 | ||
235 | // onchange handlers for non-billing fields | |
236 | for(var id in input_ids) { | |
ae8f569f CW |
237 | orig_id = input_ids[id]; |
238 | $(id).change(function(){ | |
239 | var id = '#'+$(this).attr('id'); | |
6a488035 TO |
240 | var orig_id = input_ids[id]; |
241 | ||
242 | // if billing checkbox is active, copy other field into billing field | |
ae8f569f CW |
243 | if($('#billingcheckbox').prop('checked')) { |
244 | $(orig_id).val( $(id).val() ); | |
245 | } | |
6a488035 | 246 | }); |
ae8f569f | 247 | } |
6a488035 | 248 | for(var id in select_ids) { |
ae8f569f CW |
249 | orig_id = select_ids[id]; |
250 | $(id).change(function(){ | |
251 | var id = '#'+$(this).attr('id'); | |
6a488035 TO |
252 | var orig_id = select_ids[id]; |
253 | ||
254 | // if billing checkbox is active, copy other field into billing field | |
ae8f569f CW |
255 | if($('#billingcheckbox').prop('checked')) { |
256 | $(orig_id+' option').prop('selected', false); | |
257 | $(orig_id+' option[value="'+$(id).val()+'"]').prop('selected', true); | |
258 | } | |
6a488035 TO |
259 | |
260 | if(orig_id == '#billing_country_id-5') { | |
ae8f569f | 261 | $(orig_id).change(); |
6a488035 TO |
262 | } |
263 | }); | |
ae8f569f | 264 | } |
6a488035 TO |
265 | |
266 | ||
267 | // toggle show/hide | |
ae8f569f | 268 | $('#billingcheckbox').click(function(){ |
6a488035 | 269 | if(this.checked) { |
1ad7255f DG |
270 | if (CRM.billing.billingProfileIsHideable) { |
271 | $('.billing_name_address-group').hide(200); | |
272 | } | |
6a488035 TO |
273 | |
274 | // copy all values | |
275 | for(var id in input_ids) { | |
ae8f569f CW |
276 | orig_id = input_ids[id]; |
277 | $(orig_id).val( $(id).val() ); | |
278 | } | |
6a488035 | 279 | for(var id in select_ids) { |
ae8f569f CW |
280 | orig_id = select_ids[id]; |
281 | $(orig_id+' option').prop('selected', false); | |
282 | $(orig_id+' option[value="'+$(id).val()+'"]').prop('selected', true); | |
283 | } | |
6a488035 | 284 | } else { |
ae8f569f | 285 | $('.billing_name_address-group').show(200); |
6a488035 TO |
286 | } |
287 | }); | |
288 | ||
289 | // remove spaces, dashes from credit card number | |
ae8f569f CW |
290 | $('#credit_card_number').change(function(){ |
291 | var cc = $('#credit_card_number').val() | |
6a488035 TO |
292 | .replace(/ /g, '') |
293 | .replace(/-/g, ''); | |
ae8f569f | 294 | $('#credit_card_number').val(cc); |
6a488035 TO |
295 | }); |
296 | }); | |
297 | {/literal} | |
298 | </script> | |
299 | {/if} | |
8ae4d0d3 | 300 | |
6a488035 | 301 | {/crmRegion} |