MediaWiki:DonationForm.js: Difference between revisions

Content deleted Content added
m Corrected amounts for Reactivation test (USD, EUR, GBP)
revamped currency formatting using Intl.NumberFormat for everything, including amount buttons
Line 8:
donationForm.loadedTime = Date.now();
donationForm.extraData = {};
 
donationForm.country = mw.util.getParamValue('country').toUpperCase();
try {
donationForm.currency = document.forms.donateForm.currency_code.value;
} catch (error) {
donationForm.currency = 'USD';
}
 
/**
* Make language and country into a standard javascript Intl locale identifier
*
* @param {string} language
* @param {string} country
* @return {string} locale identifier e.g. en-GB
*/
donationForm.getLocale = function( language, country ) {
if ( language === 'en-gb' ) {
language = 'en';
}
if ( language === 'es-419' ) {
language = 'es';
}
if ( language === 'pt-br' ) {
language = 'pt';
}
return language + '-' + country;
};
 
donationForm.locale = donationForm.getLocale( mw.config.get('wgPageContentLanguage'), donationForm.country );
 
 
// Don't offer recurring at all in these countries
Line 214 ⟶ 244:
'ZMK' : 5176,
'ZWD' : 373
};
 
/* Amount and currency formatting */
let formatters = {
// Amounts without currency symbol
amountFraction: new Intl.NumberFormat( donationForm.locale,
{ minimumFractionDigits: 2, maximumFractionDigits: 2 }
),
amountWhole: new Intl.NumberFormat( donationForm.locale,
{}
)
}
 
// currencyDisplay: 'narrowSymbol' fixes some issues like en-CO showing the ISO code
// but browser support is lacking, so wrap in a try/catch
try {
formatters.currencyFraction = new Intl.NumberFormat( donationForm.locale,
{ style: 'currency', currency: donationForm.currency, currencyDisplay: 'narrowSymbol' }
);
formatters.currencyWhole = new Intl.NumberFormat( donationForm.locale,
{ style: 'currency', currency: donationForm.currency, currencyDisplay: 'narrowSymbol', minimumFractionDigits: 0 }
);
} catch(e) {
formatters.currencyFraction = new Intl.NumberFormat( donationForm.locale,
{ style: 'currency', currency: donationForm.currency }
);
formatters.currencyWhole = new Intl.NumberFormat( donationForm.locale,
{ style: 'currency', currency: donationForm.currency, minimumFractionDigits: 0 }
);
}
 
donationForm.formatCurrency = function( amount ) {
if ( amount % 1 !== 0 ) { // Not a whole number
return formatters.currencyFraction.format( amount );
} else {
return formatters.currencyWhole.format( amount );
}
};
 
donationForm.formatAmount = function( amount ) {
var formatterOptions, output;
if ( amount % 1 !== 0 ) { // Not a whole number
return formatters.amountFraction.format( amount );
} else {
return formatters.amountWhole.format( amount );
}
};
 
Line 525 ⟶ 601:
appealAmountsData.NZD = appealAmountsData.USD;
appealAmountsData.EUR = appealAmountsData.USD;
 
var formats = {
"USD" : "$\t",
"EUR" : {
"en" : "€\t",
"cy" : "€\t",
"ga" : "€\t",
"mt" : "€\t",
"nl" : "€ \t",
"lv" : "€ \t",
"tr" : "€ \t",
"default" : "\t €"
},
"AUD" : "$\t",
"CAD" : {
"fr" : "\t $",
"default" : "$\t"
},
"GBP" : "£\t",
"NZD" : "$\t",
"JPY" : "¥\t",
"SEK" : "\t kr",
"BRL" : "R$\t"
};
 
var format;
if ( formats[currency] ) {
format = formats[currency][language] || formats[currency]['default'] || formats[currency];
} else {
format = '\t';
}
 
// Radio button amounts
Line 565 ⟶ 610:
var $label = $("label[for='input_amount_" + j + "']");
$radio.val( radioAmounts[j] );
$label.text( formatdonationForm.replaceformatCurrency('\t', radioAmounts[j] ) );
}
}
Line 572 ⟶ 617:
var appealAmounts = pickAmountArray( appealAmountsData, currency, hpc, hpcSet );
if ( appealAmounts.length ) {
var appealAmountString = appealAmounts.map( donationForm.formatCurrency ).join( ', ');
// Build string
var appealAmountString = '';
for( var k = 0; k < appealAmounts.length; k++ ) {
appealAmountString += format.replace('\t', appealAmounts[k]) + ', ';
}
appealAmountString = appealAmountString.trim();
 
$('.consider-amounts').html(appealAmountString);
}
Line 1,018 ⟶ 1,057:
feeText;
 
feeText = donationForm.formatAmountformatCurrency( feeAmount );
 
$('.ptf label span').text( feeText );
Line 1,112 ⟶ 1,151:
};
}
};
 
/**
* Make language and country into a standard javascript Intl locale identifier
*
* @param {string} language
* @param {string} country
* @return {string} locale identifier e.g. en-GB
*/
donationForm.getLocale = function( language, country ) {
if ( language === 'en-gb' ) {
language = 'en';
}
if ( language === 'es-419' ) {
language = 'es';
}
if ( language === 'pt-br' ) {
language = 'pt';
}
return language + '-' + country;
};
 
Line 1,152 ⟶ 1,171:
}
return false;
};
 
/**
* Format an amount for a given locale (default to donationForm.locale)
*
* 2 decimal places if it has a fractional part, 0 if not
* Note this doesn't include any currency symbol
*
* @param {number} amount
* @param {string} [locale=donationForm.locale] To determine correct separators
* @return {string}
*/
donationForm.formatAmount = function( amount, locale = donationForm.locale ) {
var formatterOptions, output;
if ( amount % 1 !== 0 ) { // Not a whole number
formatterOptions = { minimumFractionDigits: 2, maximumFractionDigits: 2 };
} else {
formatterOptions = {};
}
try {
output = amount.toLocaleString( locale, formatterOptions );
} catch(e) {
output = amount.toFixed(2);
}
return output;
};
 
Line 1,360 ⟶ 1,354:
 
var form = document.forms.donateForm;
 
// These get used in quite a few places
try {
donationForm.currency = form.currency_code.value;
} catch (error) {
donationForm.currency = 'USD';
}
donationForm.country = mw.util.getParamValue('country').toUpperCase();
donationForm.locale = donationForm.getLocale( mw.config.get('wgPageContentLanguage'), donationForm.country );
 
// Minimum amount is usually about 1 USD
Line 1,419 ⟶ 1,404:
$( '.paymentmethod-pp, .paymentmethod-pp-usd' ).addClass( 'not-monthly-capable' );
}
// Format amounts on buttons
$( '.amount-options li' ).each( function( index ) {
let amount = this.querySelector( 'input' ).value;
if ( amount !== 'Other' ) {
this.querySelector( 'label' ).innerText = donationForm.formatCurrency( amount );
}
});
 
addCardTypesClass( donationForm.country );