- Replaced color picker form control with a more robust version.
This commit is contained in:
JT Smith
parent
6fe068e42d
commit
6e0470771e
1193 changed files with 342 additions and 223 deletions
51
www/extras/extjs/examples/locale/create_languages_js.py
vendored
Normal file
51
www/extras/extjs/examples/locale/create_languages_js.py
vendored
Normal file
|
|
@ -0,0 +1,51 @@
|
|||
#!/usr/bin/env python
|
||||
|
||||
import sys, os, re
|
||||
|
||||
try:
|
||||
import chardet
|
||||
except ImportError:
|
||||
print "You need universal encoding detector for this script"
|
||||
print " http://chardet.feedparser.org or apt-get install python-chardet"
|
||||
sys.exit()
|
||||
|
||||
regexp_language = re.compile("\* +(.+) +translation", re.IGNORECASE)
|
||||
js_template = """/* This file is automaticly generated by create_language_js.py */
|
||||
|
||||
// some data used in the examples
|
||||
Ext.namespace('Ext.exampledata');
|
||||
|
||||
// TODO: complete and sort the list
|
||||
Ext.exampledata.languages = [
|
||||
%s
|
||||
];
|
||||
"""
|
||||
|
||||
def lang_name(file):
|
||||
language = os.path.basename(file)
|
||||
m = regexp_language.search(open(file).read(512))
|
||||
if m:
|
||||
language = m.groups()[0]
|
||||
return language
|
||||
|
||||
def main():
|
||||
base_dir = "../../src/locale"
|
||||
base_file = lambda f: os.path.join(base_dir, f)
|
||||
try:
|
||||
locales = os.listdir(base_dir)
|
||||
except IOError:
|
||||
print "Cannot find source locale directory: %s ... exiting" % base_dir
|
||||
sys.exit()
|
||||
|
||||
valid_file = lambda e: e.endswith(".js") and e.startswith("ext-lang-")
|
||||
char_set = lambda f: chardet.detect(open(f).read())['encoding']
|
||||
lang_code = lambda f: f[9:f.rfind(".js")]
|
||||
info_set = lambda f: (lang_name(base_file(f)), (lang_code(f), char_set(base_file(f))))
|
||||
locales = dict(info_set(file) for file in locales if valid_file(file))
|
||||
locale_strarray = ',\n'.join(["\t[%r, %r, %r]" % (code, name, charset) \
|
||||
for name, (code, charset) in sorted(locales.items())])
|
||||
# create languages.js
|
||||
open("languages.js", "w").write(js_template % locale_strarray)
|
||||
|
||||
if __name__=="__main__":
|
||||
main()
|
||||
41
www/extras/extjs/examples/locale/dutch-form.html
vendored
Normal file
41
www/extras/extjs/examples/locale/dutch-form.html
vendored
Normal file
|
|
@ -0,0 +1,41 @@
|
|||
<!--<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">-->
|
||||
<html lang="nl">
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
|
||||
<title>Dutch Form</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css" />
|
||||
|
||||
<!-- GC --> <!-- LIBS --> <script type="text/javascript" src="../../adapter/yui/yui-utilities.js"></script> <script type="text/javascript" src="../../adapter/yui/ext-yui-adapter.js"></script> <!-- ENDLIBS -->
|
||||
<script type="text/javascript" src="../../ext-all.js"></script>
|
||||
|
||||
<!-- include the locale file -->
|
||||
<script type="text/javascript" src="../../source/locale/ext-lang-nl.js"></script>
|
||||
|
||||
<script type="text/javascript" src="dutch-provinces.js"></script>
|
||||
<script type="text/javascript" src="dutch-form.js"></script>
|
||||
|
||||
<!-- Common Styles for the examples -->
|
||||
<link rel="stylesheet" type="text/css" href="../examples.css" />
|
||||
</head>
|
||||
<body>
|
||||
<script type="text/javascript" src="../examples.js"></script><!-- EXAMPLES -->
|
||||
<h1>Localization with Ext</h1>
|
||||
<p>The js is not minified so it is readable. See <a href="dutch-form.js">dutch-form.js</a>.</p>
|
||||
|
||||
<p>
|
||||
This demonstrates a dutch location of Ext using the form component. It includes the localization
|
||||
file "ext-lang-nl.js" from the source/locale folder of the Ext download.
|
||||
</p>
|
||||
|
||||
<div style="width:360px;">
|
||||
<div class="x-box-tl"><div class="x-box-tr"><div class="x-box-tc"></div></div></div>
|
||||
<div class="x-box-ml"><div class="x-box-mr"><div class="x-box-mc">
|
||||
<h3>Persoons Gegevens</h3>
|
||||
<div id="form-ct">
|
||||
</div>
|
||||
</div></div></div>
|
||||
<div class="x-box-bl"><div class="x-box-br"><div class="x-box-bc"></div></div></div>
|
||||
</div>
|
||||
<div class="x-form-clear"></div>
|
||||
</body>
|
||||
</html>
|
||||
76
www/extras/extjs/examples/locale/dutch-form.js
vendored
Normal file
76
www/extras/extjs/examples/locale/dutch-form.js
vendored
Normal file
|
|
@ -0,0 +1,76 @@
|
|||
/*
|
||||
* Ext JS Library 1.0.1
|
||||
* Copyright(c) 2006-2007, Ext JS, LLC.
|
||||
* licensing@extjs.com
|
||||
*
|
||||
* http://www.extjs.com/license
|
||||
*/
|
||||
|
||||
Ext.onReady(function(){
|
||||
|
||||
Ext.QuickTips.init();
|
||||
|
||||
// turn on validation errors beside the field globally
|
||||
Ext.form.Field.prototype.msgTarget = 'side';
|
||||
|
||||
var fs = new Ext.form.Form({
|
||||
labelAlign: 'right',
|
||||
labelWidth: 95
|
||||
});
|
||||
|
||||
fs.fieldset(
|
||||
{legend:'Contact Informatie'},
|
||||
new Ext.form.TextField({
|
||||
fieldLabel: 'Voornaam',
|
||||
name: 'first',
|
||||
width:190
|
||||
}),
|
||||
|
||||
new Ext.form.TextField({
|
||||
fieldLabel: 'Achternaam',
|
||||
name: 'last',
|
||||
width:190
|
||||
}),
|
||||
|
||||
new Ext.form.TextField({
|
||||
fieldLabel: 'Bedrijf',
|
||||
name: 'company',
|
||||
width:190
|
||||
}),
|
||||
|
||||
new Ext.form.TextField({
|
||||
fieldLabel: 'E-mail',
|
||||
name: 'email',
|
||||
vtype:'email',
|
||||
width:190
|
||||
}),
|
||||
|
||||
new Ext.form.ComboBox({
|
||||
fieldLabel: 'Provincie',
|
||||
hiddenName: 'state',
|
||||
store: new Ext.data.SimpleStore({
|
||||
fields: ['province'],
|
||||
data : Ext.exampledata.dutch_provinces // from dutch-provinces.js
|
||||
}),
|
||||
displayField: 'province',
|
||||
typeAhead: true,
|
||||
mode: 'local',
|
||||
triggerAction: 'all',
|
||||
emptyText:'Kies uw provincie...',
|
||||
selectOnFocus:true,
|
||||
width:190
|
||||
}),
|
||||
|
||||
new Ext.form.DateField({
|
||||
fieldLabel: 'Geboorte datum',
|
||||
name: 'dob',
|
||||
width:190,
|
||||
allowBlank:false
|
||||
})
|
||||
);
|
||||
|
||||
fs.addButton('Opslaan');
|
||||
fs.addButton('Annuleren');
|
||||
|
||||
fs.render('form-ct');
|
||||
});
|
||||
25
www/extras/extjs/examples/locale/dutch-provinces.js
vendored
Normal file
25
www/extras/extjs/examples/locale/dutch-provinces.js
vendored
Normal file
|
|
@ -0,0 +1,25 @@
|
|||
/*
|
||||
* Ext JS Library 1.0.1
|
||||
* Copyright(c) 2006-2007, Ext JS, LLC.
|
||||
* licensing@extjs.com
|
||||
*
|
||||
* http://www.extjs.com/license
|
||||
*/
|
||||
|
||||
// some data used in the examples
|
||||
Ext.namespace('Ext.exampledata');
|
||||
|
||||
Ext.exampledata.dutch_provinces = [
|
||||
['Drenthe'],
|
||||
['Flevoland'],
|
||||
['Friesland'],
|
||||
['Gelderland'],
|
||||
['Groningen'],
|
||||
['Limburg'],
|
||||
['Noord-Brabant'],
|
||||
['Noord-Holland'],
|
||||
['Overijsel'],
|
||||
['Utrecht'],
|
||||
['Zeeland'],
|
||||
['Zuid-Holland']
|
||||
];
|
||||
39
www/extras/extjs/examples/locale/languages.js
vendored
Normal file
39
www/extras/extjs/examples/locale/languages.js
vendored
Normal file
|
|
@ -0,0 +1,39 @@
|
|||
/*
|
||||
* Ext JS Library 1.0.1
|
||||
* Copyright(c) 2006-2007, Ext JS, LLC.
|
||||
* licensing@extjs.com
|
||||
*
|
||||
* http://www.extjs.com/license
|
||||
*/
|
||||
|
||||
/* This file is automaticly generated by create_language_js.py */
|
||||
|
||||
// some data used in the examples
|
||||
Ext.namespace('Ext.exampledata');
|
||||
|
||||
// TODO: complete and sort the list
|
||||
Ext.exampledata.languages = [
|
||||
['hr', 'Croatian', 'utf-8'],
|
||||
['da', 'Danish', 'utf-8'],
|
||||
['nl', 'Dutch', 'ascii'],
|
||||
['en', 'English', 'ascii'],
|
||||
['fr_CA', 'France (Canadian)', 'UTF-8'],
|
||||
['de', 'German', 'ISO-8859-7'],
|
||||
['hu', 'Hungarian', 'utf-8'],
|
||||
['it', 'Italian', 'ascii'],
|
||||
['ja', 'Japanese', 'utf-8'],
|
||||
['lv', 'Latvian', 'utf-8'],
|
||||
['mk', 'Macedonia', 'utf-8'],
|
||||
['no', 'Norwegian', 'utf-8'],
|
||||
['pl', 'Polish', 'utf-8'],
|
||||
['pt_br', 'Portuguese/Brazil', 'ISO-8859-2'],
|
||||
['ro', 'Romanian', 'utf-8'],
|
||||
['ru', 'Russian', 'utf-8'],
|
||||
['zh_CN', 'Simplified Chinese', 'UTF-8'],
|
||||
['sk', 'Slovak', 'windows-1251'],
|
||||
['sp', 'Spanish/Latin American', 'utf-8'],
|
||||
['sv_se', 'Swedish', 'UTF-8'],
|
||||
['zh_TW', 'Traditional Chinese', 'UTF-8'],
|
||||
['tr', 'Turkish', 'utf-8'],
|
||||
['vn', 'Vietnamese', 'UTF-8']
|
||||
];
|
||||
78
www/extras/extjs/examples/locale/multi-lang.html
vendored
Normal file
78
www/extras/extjs/examples/locale/multi-lang.html
vendored
Normal file
|
|
@ -0,0 +1,78 @@
|
|||
<!--<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">-->
|
||||
<html>
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf8">
|
||||
<title>Multiple Languages</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css" />
|
||||
<link rel="stylesheet" type="text/css" href="../../resources/css/ytheme-gray.css" />
|
||||
<!-- GC --> <!-- LIBS --> <script type="text/javascript" src="../../adapter/yui/yui-utilities.js"></script> <script type="text/javascript" src="../../adapter/yui/ext-yui-adapter.js"></script> <!-- ENDLIBS -->
|
||||
<script type="text/javascript" src="../../ext-all.js"></script>
|
||||
|
||||
<script type="text/javascript" src="languages.js"></script>
|
||||
|
||||
<!-- Common Styles for the examples -->
|
||||
<link rel="stylesheet" type="text/css" href="../examples.css" />
|
||||
</head>
|
||||
<body class="x-gray">
|
||||
<script type="text/javascript" src="../examples.js"></script><!-- EXAMPLES -->
|
||||
<script type="text/javascript">
|
||||
var params = Ext.urlDecode(window.location.search.substring(1));
|
||||
if (params.lang) {
|
||||
var s = document.createElement("script");
|
||||
s.type = 'text/javascript';
|
||||
s.src = "../../source/locale/ext-lang-"+params.lang+".js";
|
||||
s.charset = params.charset;
|
||||
document.getElementsByTagName("head")[0].appendChild(s);
|
||||
}
|
||||
</script>
|
||||
<script type="text/javascript" src="multi-lang.js"></script>
|
||||
|
||||
<h1>Localization with Extjs</h1>
|
||||
<p>The js is not minified so it is readable. See <a href="multi-lang.js">multi-lang.js</a>.</p>
|
||||
|
||||
<p>
|
||||
This demonstrates multiple language with some of the Ext components.<br/>
|
||||
Select a language from the combobox below (default is english) and try out the components in different languages.
|
||||
</p>
|
||||
|
||||
<div>
|
||||
<span style="float: left;">Language selector: </span>
|
||||
<input type="text" id="languages" size="20" />
|
||||
</div>
|
||||
<br/>
|
||||
<h2>Email Field</h2>
|
||||
<p></p>
|
||||
<div style="width:300px;">
|
||||
<div class="x-box-tl"><div class="x-box-tr"><div class="x-box-tc"></div></div></div>
|
||||
<div class="x-box-ml"><div class="x-box-mr"><div class="x-box-mc">
|
||||
<h3 style="margin-bottom:5px;">Localized Email Field</h3>
|
||||
<div id="form-ct"></div>
|
||||
</div></div></div>
|
||||
<div class="x-box-bl"><div class="x-box-br"><div class="x-box-bc"></div></div></div>
|
||||
</div>
|
||||
<br/>
|
||||
<h2>Datepicker</h2>
|
||||
<br/>
|
||||
<div style="width:300px;">
|
||||
<div class="x-box-tl"><div class="x-box-tr"><div class="x-box-tc"></div></div></div>
|
||||
<div class="x-box-ml"><div class="x-box-mr"><div class="x-box-mc">
|
||||
<h3 style="margin-bottom:5px;">Localized Datepicker</h3>
|
||||
<div id="form-ct2"></div>
|
||||
</div></div></div>
|
||||
<div class="x-box-bl"><div class="x-box-br"><div class="x-box-bc"></div></div></div>
|
||||
</div>
|
||||
<br/>
|
||||
<h2>Grid</h2>
|
||||
<br/>
|
||||
<div style="width:300px;">
|
||||
<div class="x-box-tl"><div class="x-box-tr"><div class="x-box-tc"></div></div></div>
|
||||
<div class="x-box-ml"><div class="x-box-mr"><div class="x-box-mc">
|
||||
<h3 style="margin-bottom:5px;">Localized Grid</h3>
|
||||
<div id="grid-panel" style="width:270px;height:178px;">
|
||||
<div id="editor-grid"></div>
|
||||
</div>
|
||||
</div></div></div>
|
||||
<div class="x-box-bl"><div class="x-box-br"><div class="x-box-bc"></div></div></div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
166
www/extras/extjs/examples/locale/multi-lang.js
vendored
Normal file
166
www/extras/extjs/examples/locale/multi-lang.js
vendored
Normal file
|
|
@ -0,0 +1,166 @@
|
|||
/*
|
||||
* Ext JS Library 1.0.1
|
||||
* Copyright(c) 2006-2007, Ext JS, LLC.
|
||||
* licensing@extjs.com
|
||||
*
|
||||
* http://www.extjs.com/license
|
||||
*/
|
||||
|
||||
/* Fix for Opera, which does not seem to include the map function on Array's */
|
||||
if(!Array.prototype.map){
|
||||
Array.prototype.map = function(fun){
|
||||
var len = this.length;
|
||||
if(typeof fun != "function"){
|
||||
throw new TypeError();
|
||||
}
|
||||
var res = new Array(len);
|
||||
var thisp = arguments[1];
|
||||
for(var i = 0; i < len; i++){
|
||||
if(i in this){
|
||||
res[i] = fun.call(thisp, this[i], i, this);
|
||||
}
|
||||
}
|
||||
return res;
|
||||
};
|
||||
}
|
||||
|
||||
/* Paging Memory Proxy, allows to use paging grid with in memory dataset */
|
||||
Ext.data.PagingMemoryProxy = function(data) {
|
||||
Ext.data.PagingMemoryProxy.superclass.constructor.call(this);
|
||||
this.data = data;
|
||||
};
|
||||
|
||||
Ext.extend(Ext.data.PagingMemoryProxy, Ext.data.MemoryProxy, {
|
||||
load : function(params, reader, callback, scope, arg) {
|
||||
params = params || {};
|
||||
var result;
|
||||
try {
|
||||
result = reader.readRecords(this.data);
|
||||
}catch(e){
|
||||
this.fireEvent("loadexception", this, arg, null, e);
|
||||
callback.call(scope, null, arg, false);
|
||||
return;
|
||||
}
|
||||
if ( (params.start!==undefined) && (params.limit!==undefined) ) {
|
||||
result.records = result.records.slice(params.start, params.start+params.limit);
|
||||
}
|
||||
callback.call(scope, result, arg, true);
|
||||
}
|
||||
});
|
||||
|
||||
/* multi-lang.js extscript */
|
||||
Ext.onReady(function(){
|
||||
Ext.QuickTips.init();
|
||||
Ext.form.Field.prototype.msgTarget = 'side';
|
||||
|
||||
/* Language chooser combobox */
|
||||
var store = new Ext.data.SimpleStore({
|
||||
fields: ['code', 'language', 'charset'],
|
||||
data : Ext.exampledata.languages // from languages.js
|
||||
});
|
||||
var combo = new Ext.form.ComboBox({
|
||||
store: store,
|
||||
displayField:'language',
|
||||
typeAhead: true,
|
||||
mode: 'local',
|
||||
triggerAction: 'all',
|
||||
emptyText:'Select a language...',
|
||||
selectOnFocus:true,
|
||||
onSelect: function(record) {
|
||||
window.location.search = Ext.urlEncode({"lang":record.get("code"),"charset":record.get("charset")});
|
||||
}
|
||||
});
|
||||
combo.applyTo('languages');
|
||||
|
||||
// get the selected language code parameter from url (if exists)
|
||||
var params = Ext.urlDecode(window.location.search.substring(1));
|
||||
if (params.lang) {
|
||||
// check if there's really a language with that language code
|
||||
record = store.data.find(function(item, key) {
|
||||
if (item.data.code==params.lang){
|
||||
return true;
|
||||
}
|
||||
});
|
||||
// if language was found in store assign it as current value in combobox
|
||||
if (record) {
|
||||
combo.setValue(record.data.language);
|
||||
}
|
||||
}
|
||||
|
||||
/* Email field */
|
||||
var efield = new Ext.form.Form({ labelWidth: 75 });
|
||||
efield.add(new Ext.form.TextField({
|
||||
fieldLabel: 'Email',
|
||||
name: 'email',
|
||||
vtype: 'email',
|
||||
width: 175
|
||||
}));
|
||||
efield.render('form-ct');
|
||||
|
||||
/* Datepicker */
|
||||
var efield = new Ext.form.Form({ labelWidth: 75 });
|
||||
efield.add(new Ext.form.DateField({
|
||||
fieldLabel: 'Date',
|
||||
name: 'date',
|
||||
width: 175
|
||||
}));
|
||||
efield.render('form-ct2');
|
||||
});
|
||||
|
||||
Ext.onReady(function(){
|
||||
// shorthand alias
|
||||
var fm = Ext.form, Ed = Ext.grid.GridEditor;
|
||||
// the column model has information about grid columns
|
||||
// dataIndex maps the column to the specific data field in
|
||||
// the data store (created below)
|
||||
var cm = new Ext.grid.ColumnModel([{
|
||||
header: "Months of the year",
|
||||
dataIndex: 'month',
|
||||
editor: new Ed(new fm.TextField({
|
||||
allowBlank: false
|
||||
})),
|
||||
width: 240
|
||||
}]);
|
||||
|
||||
// by default columns are sortable
|
||||
cm.defaultSortable = true;
|
||||
|
||||
var monthArray = Date.monthNames.map(function (e) { return [e]; });
|
||||
|
||||
// create the Data Store
|
||||
var ds = new Ext.data.Store({
|
||||
proxy: new Ext.data.PagingMemoryProxy(monthArray),
|
||||
reader: new Ext.data.ArrayReader({}, [
|
||||
{name: 'month'}
|
||||
])
|
||||
});
|
||||
|
||||
// create the editor grid
|
||||
var grid = new Ext.grid.EditorGrid('editor-grid', {
|
||||
ds: ds,
|
||||
cm: cm,
|
||||
selModel: new Ext.grid.RowSelectionModel(),
|
||||
enableColLock:false
|
||||
});
|
||||
|
||||
var layout = Ext.BorderLayout.create({
|
||||
center: {
|
||||
margins:{left:3,top:3,right:3,bottom:3},
|
||||
panels: [new Ext.GridPanel(grid)]
|
||||
}
|
||||
}, 'grid-panel');
|
||||
|
||||
// render it
|
||||
grid.render();
|
||||
|
||||
var gridFoot = grid.getView().getFooterPanel(true);
|
||||
|
||||
// add a paging toolbar to the grid's footer
|
||||
var paging = new Ext.PagingToolbar(gridFoot, ds, {
|
||||
pageSize: 6,
|
||||
displayInfo: false
|
||||
});
|
||||
|
||||
// trigger the data store load
|
||||
ds.load({params:{start:0, limit:6}});
|
||||
});
|
||||
Loading…
Add table
Add a link
Reference in a new issue