A searchable list for scenarios where users need to type/select a language (or more) as input. The list is made more compact by removing secondary aids from the ULS to focus on the input task.
67 lines
2.2 KiB
HTML
67 lines
2.2 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en" dir="ltr">
|
|
<head>
|
|
<meta charset="utf-8"/>
|
|
|
|
<!--
|
|
Always force latest IE rendering engine (even in intranet) & Chrome Frame
|
|
Remove this if you use the .htaccess
|
|
-->
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
|
|
|
|
<title>Universal Language Selector</title>
|
|
<!-- <link rel="shortcut icon" href="/favicon.ico"/> -->
|
|
<!-- <link rel="apple-touch-icon" href="/apple-touch-icon.png"/> -->
|
|
<!-- <meta name="description" content=""/> -->
|
|
<meta name="author" content="Santhosh Thottingal"/>
|
|
<link href="../css/jquery.uls.css" rel="stylesheet"/>
|
|
<link href="../css/jquery.uls.grid.css" rel="stylesheet"/>
|
|
<link href="../css/jquery.uls.lcd.css" rel="stylesheet"/>
|
|
<link href="../css/jquery.uls.compact.css" rel="stylesheet"/>
|
|
<!-- demo -->
|
|
<link href="resources/demo.css" rel="stylesheet"/>
|
|
<!-- Libs -->
|
|
<script src="resources/jquery.js"></script>
|
|
<!-- Source -->
|
|
<script src="../src/jquery.uls.data.js"></script>
|
|
<script src="../src/jquery.uls.data.utils.js"></script>
|
|
<script src="../src/jquery.uls.lcd.js"></script>
|
|
<script src="../src/jquery.uls.languagefilter.js"></script>
|
|
<script src="../src/jquery.uls.regionfilter.js"></script>
|
|
<script src="../src/jquery.uls.core.js"></script>
|
|
<script>
|
|
$( document ).ready( function() {
|
|
$( '.uls-trigger' ).uls( {
|
|
onSelect : function( language ) {
|
|
var languageName = $.uls.data.getAutonym( language );
|
|
$( '.uls-trigger' ).text( languageName );
|
|
},
|
|
quickList: ['en', 'hi', 'he', 'ml', 'ta', 'fr'] //FIXME
|
|
} );
|
|
$( '.uls-trigger' ).click( function () {
|
|
//Hacks to include optional classes and make the dialog close when clicking outside:
|
|
$( '.uls-menu' ).addClass( 'uls-compact' );
|
|
$('html').click(function() {
|
|
$('.uls-menu').hide();
|
|
});
|
|
|
|
$('.uls-menu').click(function(event){
|
|
event.stopPropagation();
|
|
});
|
|
});
|
|
} );
|
|
</script>
|
|
</head>
|
|
|
|
<body>
|
|
<div class="navbar navbar-fixed-top">
|
|
<span class="active uls-trigger">Select Language</span>
|
|
<h1>Universal Language Selector</h1>
|
|
<p>
|
|
Demonstration of jQuery plugin
|
|
</p>
|
|
</div>
|
|
<div class="container"></div>
|
|
</body>
|
|
</html>
|