Skip to content

Commit 01be5e2

Browse files
jeffharrelljeffharrell
committed
Fix for #31 to enable different environments
1 parent 2b4b891 commit 01be5e2

1 file changed

Lines changed: 42 additions & 40 deletions

File tree

‎src/paypal-button.js‎

Lines changed: 42 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -11,8 +11,8 @@ PAYPAL.apps = PAYPAL.apps || {};
1111

1212

1313
var app = {},
14-
paypalURL = 'https://www.paypal.com/cgi-bin/webscr',
15-
qrCodeURL = 'https://www.paypal.com/webapps/ppint/qrcode?data={url}&pattern={pattern}&height={size}',
14+
paypalURL = 'https://{env}.paypal.com/cgi-bin/webscr',
15+
qrCodeURL = 'https://{env}.paypal.com/webapps/ppint/qrcode?data={url}&pattern={pattern}&height={size}',
1616
bnCode = 'JavaScriptButton_{type}',
1717
prettyParams = {
1818
name: 'item_name',
@@ -118,6 +118,7 @@ PAYPAL.apps = PAYPAL.apps || {};
118118
// Add common data
119119
data.add('business', business);
120120
data.add('bn', bnCode.replace(/\{type\}/, type));
121+
data.add('env', data.items.env || 'www');
121122

122123
// Build the UI components
123124
if (type === 'qr') {
@@ -146,6 +147,43 @@ PAYPAL.apps = PAYPAL.apps || {};
146147
}
147148

148149

150+
/**
151+
* Injects button CSS in the <head>
152+
*
153+
* @return {void}
154+
*/
155+
function injectCSS() {
156+
var css, styleEl, paypalButton, paypalInput;
157+
158+
if (document.getElementById('paypal-button')) {
159+
return;
160+
}
161+
162+
css = '';
163+
styleEl = document.createElement('style');
164+
paypalButton = '.paypal-button';
165+
paypalInput = paypalButton + ' button';
166+
167+
css += paypalButton + ' { white-space: nowrap; }';
168+
css += paypalInput + ' { white-space: nowrap; overflow: hidden; border-radius: 13px; font-family: "Arial", bold, italic; font-weight: bold; font-style: italic; border: 1px solid #ffa823; color: #0E3168; background: #ffa823; position: relative; text-shadow: 0 1px 0 rgba(255,255,255,.5); cursor: pointer; z-index: 0; }';
169+
css += paypalInput + ':before { content: " "; position: absolute; width: 100%; height: 100%; border-radius: 11px; top: 0; left: 0; background: #ffa823; background: -webkit-linear-gradient(top, #FFAA00 0%,#FFAA00 80%,#FFF8FC 100%); background: -moz-linear-gradient(top, #FFAA00 0%,#FFAA00 80%,#FFF8FC 100%); background: -ms-linear-gradient(top, #FFAA00 0%,#FFAA00 80%,#FFF8FC 100%); background: linear-gradient(top, #FFAA00 0%,#FFAA00 80%,#FFF8FC 100%); z-index: -2; }';
170+
css += paypalInput + ':after { content: " "; position: absolute; width: 98%; height: 60%; border-radius: 40px 40px 38px 38px; top: 0; left: 0; background: -webkit-linear-gradient(top, #fefefe 0%, #fed994 100%); background: -moz-linear-gradient(top, #fefefe 0%, #fed994 100%); background: -ms-linear-gradient(top, #fefefe 0%, #fed994 100%); background: linear-gradient(top, #fefefe 0%, #fed994 100%); z-index: -1; -webkit-transform: translateX(1%);-moz-transform: translateX(1%); -ms-transform: translateX(1%); transform: translateX(1%); }';
171+
css += paypalInput + '.small { padding: 3px 15px; font-size: 12px; }';
172+
css += paypalInput + '.large { padding: 4px 19px; font-size: 14px; }';
173+
174+
styleEl.type = 'text/css';
175+
styleEl.id = 'paypal-button';
176+
177+
if (styleEl.styleSheet) {
178+
styleEl.styleSheet.cssText = css;
179+
} else {
180+
styleEl.appendChild(document.createTextNode(css));
181+
}
182+
183+
document.getElementsByTagName('head')[0].appendChild(styleEl);
184+
}
185+
186+
149187
/**
150188
* Builds the form DOM structure for a button
151189
*
@@ -161,7 +199,7 @@ PAYPAL.apps = PAYPAL.apps || {};
161199
item, child, label, input, key, size, locale, localeText;
162200

163201
form.method = 'post';
164-
form.action = paypalURL;
202+
form.action = paypalURL.replace('{env}', data.items.env);
165203
form.className = 'paypal-button';
166204
form.target = '_top';
167205

@@ -223,42 +261,6 @@ PAYPAL.apps = PAYPAL.apps || {};
223261
return form;
224262
}
225263

226-
/**
227-
* Injects button CSS in the <head>
228-
*
229-
* @return {void}
230-
*/
231-
function injectCSS() {
232-
var css, styleEl, paypalButton, paypalInput;
233-
234-
if (document.getElementById('paypal-button')) {
235-
return;
236-
}
237-
238-
css = '';
239-
styleEl = document.createElement('style');
240-
paypalButton = '.paypal-button';
241-
paypalInput = paypalButton + ' button';
242-
243-
css += paypalButton + ' { white-space: nowrap; }';
244-
css += paypalInput + ' { white-space: nowrap; overflow: hidden; border-radius: 13px; font-family: "Arial", bold, italic; font-weight: bold; font-style: italic; border: 1px solid #ffa823; color: #0E3168; background: #ffa823; position: relative; text-shadow: 0 1px 0 rgba(255,255,255,.5); cursor: pointer; z-index: 0; }';
245-
css += paypalInput + ':before { content: " "; position: absolute; width: 100%; height: 100%; border-radius: 11px; top: 0; left: 0; background: #ffa823; background: -webkit-linear-gradient(top, #FFAA00 0%,#FFAA00 80%,#FFF8FC 100%); background: -moz-linear-gradient(top, #FFAA00 0%,#FFAA00 80%,#FFF8FC 100%); background: -ms-linear-gradient(top, #FFAA00 0%,#FFAA00 80%,#FFF8FC 100%); background: linear-gradient(top, #FFAA00 0%,#FFAA00 80%,#FFF8FC 100%); z-index: -2; }';
246-
css += paypalInput + ':after { content: " "; position: absolute; width: 98%; height: 60%; border-radius: 40px 40px 38px 38px; top: 0; left: 0; background: -webkit-linear-gradient(top, #fefefe 0%, #fed994 100%); background: -moz-linear-gradient(top, #fefefe 0%, #fed994 100%); background: -ms-linear-gradient(top, #fefefe 0%, #fed994 100%); background: linear-gradient(top, #fefefe 0%, #fed994 100%); z-index: -1; -webkit-transform: translateX(1%);-moz-transform: translateX(1%); -ms-transform: translateX(1%); transform: translateX(1%); }';
247-
css += paypalInput + '.small { padding: 3px 15px; font-size: 12px; }';
248-
css += paypalInput + '.large { padding: 4px 19px; font-size: 14px; }';
249-
250-
styleEl.type = 'text/css';
251-
styleEl.id = 'paypal-button';
252-
253-
if (styleEl.styleSheet) {
254-
styleEl.styleSheet.cssText = css;
255-
} else {
256-
styleEl.appendChild(document.createTextNode(css));
257-
}
258-
259-
document.getElementsByTagName('head')[0].appendChild(styleEl);
260-
}
261-
262264

263265
/**
264266
* Builds the image for a QR code
@@ -283,7 +285,7 @@ PAYPAL.apps = PAYPAL.apps || {};
283285
}
284286

285287
url = encodeURIComponent(url);
286-
img.src = qrCodeURL.replace('{url}', url).replace('{pattern}', pattern).replace('{size}', size);
288+
img.src = qrCodeURL.replace('{env}', data.items.env).replace('{url}', url).replace('{pattern}', pattern).replace('{size}', size);
287289

288290
return img;
289291
}

0 commit comments

Comments
 (0)