bryce/mediawiki-extensions-UniversalLanguageSelector
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Updated webfonts example

Browse Source 
Change-Id: I4296fd973da66c000cb4acf3e1ee387dfaf4fbcb
This commit is contained in:
Santhosh Thottingal
2012-08-29 11:34:03 +05:30
parent 0d5ff00223
commit 93ed9a3ae3
1 changed files with 12 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
tests/webfonts.html
View File

@@ -31,21 +31,22 @@
var fonts = $webfonts.list();
var languages = $webfonts.languages();
// Also test system fonts.
$.merge( fonts, [ 'Sans', 'Serif' ] );
var $fontSelector = $( 'select#fontselector' );
var $langselector = $( 'select#language' );
function listFonts(fonts) {
$.merge( fonts, [ 'Sans', 'Serif' ] );
$fontSelector.find('option').remove();
$.each( fonts, function(key, font) {
$fontSelector.append( $( "<option></option>" ).attr(
"value", font ).text( font ) );
} );
$fontSelector.trigger( 'change' );
}
listFonts(fonts);
$.each( languages, function(lang, language) {
$langselector.append( $( "<option></option>" ).attr(
"value", language ).text(
"value", language ).text(language+ " - "+
$.uls.data.autonym( language ) ) );
} );
$fontSelector.on( 'change', function() {
@@ -56,6 +57,7 @@
var language = $langselector.find( 'option:selected' )
.val();
listFonts($webfonts.list(language));
$( '#webfonts-preview-area' ).text( $.uls.data.autonym( language ) );
} );
} )
</script>
@@ -77,6 +79,12 @@ div#webfonts-preview-area {
overflow: auto;
padding: 10px 5px;
text-align: left;
font-size: 16px;
}
select {
width: 200px;
height: 25px;
}
.langselector,.fontselector {
@@ -94,11 +102,11 @@ div#webfonts-preview-area {
<div id='container'>
<div id="webfonts-preview-toolbar">
<div class='langselector'>
Select Language: <select name="language" id="language">
Language: <select name="language" id="language">
</select>
</div>
<div class='fontselector'>
Select Font : <select id="fontselector"></select>
Font : <select id="fontselector"></select>
</div>
</div>
<div contenteditable="true" id="webfonts-preview-area">The quick brown fox jumps over the