Permalink
Browse files

- ui-djangoForm: added css styles to testproject, basic validation no…

…w works
  • Loading branch information...
1 parent 16d12c6 commit e80da59a409220dd34196120c754fad68e2853de haineault committed May 7, 2009
View
71 standalone/ui-djangoForm/testproject/media/css/ui.djangoForm.css
@@ -0,0 +1,71 @@
+.ui-djangoForm {
+ width:500px;
+ margin:20px;
+}
+/* form.as_p */
+.ui-djangoForm p {
+ margin: 0 0 8px 0; padding: 0; border: 0; outline: 0; line-height: 1.3; font-size: 100%; list-style: none;
+
+}
+.ui-djangoForm p label {
+ display:block;
+}
+.ui-djangoForm p label {
+ font-size:80%;
+}
+.ui-djangoForm p.ui-djangoForm-action {
+ text-align:right;
+ background:#f4f4f4;
+ border:1px solid #ddd;
+ padding:8px;
+}
+/* form.as_ul */
+.ui-djangoForm ul {
+ margin: 0; padding: 0; border: 0; outline: 0; line-height: 1.3; font-size: 100%; list-style: none;
+}
+.ui-djangoForm ul li {
+ margin: 0; border: 0; outline: 0; line-height: 1.3; font-size: 100%; list-style: none;
+ border-bottom:1px solid #ddd;
+ padding: 8px 0;
+}
+.ui-djangoForm ul li label {
+ display:block;
+ float:left;
+ text-align:right;
+ width:130px;
+ font-size:80%;
+ margin:3px 10px 0 0;
+}
+
+.ui-djangoForm ul li.ui-djangoForm-action {
+ text-align:right;
+ background:#f4f4f4;
+ border:1px solid #ddd;
+ border-width:0 1px 1px 1px;
+ padding:8px;
+}
+
+/* form.as_table */
+.ui-djangoForm table {}
+.ui-djangoForm table th {
+ margin: 0; border: 0; outline: 0; line-height: 1.3; font-size: 100%;
+ text-align:left;
+ font-weight:normal;
+ padding: 6px 3px;
+ background:#f4f4f4;
+ border-bottom:2px solid #fff;
+}
+.ui-djangoForm table td {
+ padding: 6px 3px;
+}
+.ui-djangoForm table th label {
+ font-size:80%;
+ margin-left:10px;
+}
+.ui-djangoForm table .ui-djangoForm-action {
+ text-align:right;
+ background:#f4f4f4;
+ border:1px solid #ddd;
+ padding:8px;
+}
+
View
290 standalone/ui-djangoForm/testproject/media/js/jquery.strings.js
@@ -0,0 +1,290 @@
+/*
+ jQuery strings - 0.3
+ http://code.google.com/p/jquery-utils/
+
+ (c) Maxime Haineault <haineault@gmail.com>
+ http://haineault.com
+
+ MIT License (http://www.opensource.org/licenses/mit-license.php)
+
+ Implementation of Python3K advanced string formatting
+ http://www.python.org/dev/peps/pep-3101/
+
+ Documentation: http://code.google.com/p/jquery-utils/wiki/StringFormat
+
+*/
+(function($){
+ var strings = {
+ strConversion: {
+ // tries to translate any objects type into string gracefully
+ __repr: function(i){
+ switch(this.__getType(i)) {
+ case 'array':case 'date':case 'number':
+ return i.toString();
+ case 'object':
+ var o = [];
+ for (x=0; x<i.length; i++) { o.push(i+': '+ this.__repr(i[x])); }
+ return o.join(', ');
+ case 'string':
+ return i;
+ default:
+ return i;
+ }
+ },
+ // like typeof but less vague
+ __getType: function(i) {
+ if (!i || !i.constructor) { return typeof(i); }
+ var match = i.constructor.toString().match(/Array|Number|String|Object|Date/);
+ return match && match[0].toLowerCase() || typeof(i);
+ },
+ //+ Jonas Raoni Soares Silva
+ //@ http://jsfromhell.com/string/pad [v1.0]
+ __pad: function(str, l, s, t){
+ var p = s || ' ';
+ var o = str;
+ if (l - str.length > 0) {
+ o = new Array(Math.ceil(l / p.length)).join(p).substr(0, t = !t ? l : t == 1 ? 0 : Math.ceil(l / 2)) + str + p.substr(0, l - t);
+ }
+ return o;
+ },
+ __getInput: function(arg, args) {
+ var key = arg.getKey();
+ switch(this.__getType(args)){
+ case 'object': // Thanks to Jonathan Works for the patch
+ var keys = key.split('.');
+ var obj = args;
+ for(var subkey = 0; subkey < keys.length; subkey++){
+ obj = obj[keys[subkey]];
+ }
+ if (typeof(obj) != 'undefined') {
+ if (strings.strConversion.__getType(obj) == 'array') {
+ return arg.getFormat().match(/\.\*/) && obj[1] || obj;
+ }
+ return obj;
+ }
+ else {
+ // TODO: try by numerical index
+ }
+ break;
+ case 'array':
+ key = parseInt(key, 10);
+ if (arg.getFormat().match(/\.\*/) && typeof args[key+1] != 'undefined') { return args[key+1]; }
+ else if (typeof args[key] != 'undefined') { return args[key]; }
+ else { return key; }
+ break;
+ }
+ return '{'+key+'}';
+ },
+ __formatToken: function(token, args) {
+ var arg = new Argument(token, args);
+ return strings.strConversion[arg.getFormat().slice(-1)](this.__getInput(arg, args), arg);
+ },
+
+ // Signed integer decimal.
+ d: function(input, arg){
+ var o = parseInt(input, 10); // enforce base 10
+ var p = arg.getPaddingLength();
+ if (p) { return this.__pad(o.toString(), p, arg.getPaddingString(), 0); }
+ else { return o; }
+ },
+ // Signed integer decimal.
+ i: function(input, args){
+ return this.d(input, args);
+ },
+ // Unsigned octal
+ o: function(input, arg){
+ var o = input.toString(8);
+ if (arg.isAlternate()) { o = this.__pad(o, o.length+1, '0', 0); }
+ return this.__pad(o, arg.getPaddingLength(), arg.getPaddingString(), 0);
+ },
+ // Unsigned decimal
+ u: function(input, args) {
+ return Math.abs(this.d(input, args));
+ },
+ // Unsigned hexadecimal (lowercase)
+ x: function(input, arg){
+ var o = parseInt(input, 10).toString(16);
+ o = this.__pad(o, arg.getPaddingLength(), arg.getPaddingString(),0);
+ return arg.isAlternate() ? '0x'+o : o;
+ },
+ // Unsigned hexadecimal (uppercase)
+ X: function(input, arg){
+ return this.x(input, arg).toUpperCase();
+ },
+ // Floating point exponential format (lowercase)
+ e: function(input, arg){
+ return parseFloat(input, 10).toExponential(arg.getPrecision());
+ },
+ // Floating point exponential format (uppercase)
+ E: function(input, arg){
+ return this.e(input, arg).toUpperCase();
+ },
+ // Floating point decimal format
+ f: function(input, arg){
+ return this.__pad(parseFloat(input, 10).toFixed(arg.getPrecision()), arg.getPaddingLength(), arg.getPaddingString(),0);
+ },
+ // Floating point decimal format (alias)
+ F: function(input, args){
+ return this.f(input, args);
+ },
+ // Floating point format. Uses exponential format if exponent is greater than -4 or less than precision, decimal format otherwise
+ g: function(input, arg){
+ var o = parseFloat(input, 10);
+ return (o.toString().length > 6) ? Math.round(o.toExponential(arg.getPrecision())): o;
+ },
+ // Floating point format. Uses exponential format if exponent is greater than -4 or less than precision, decimal format otherwise
+ G: function(input, args){
+ return this.g(input, args);
+ },
+ // Single character (accepts integer or single character string).
+ c: function(input, args) {
+ var match = input.match(/\w|\d/);
+ return match && match[0] || '';
+ },
+ // String (converts any JavaScript object to anotated format)
+ r: function(input, args) {
+ return this.__repr(input);
+ },
+ // String (converts any JavaScript object using object.toString())
+ s: function(input, args) {
+ return input.toString && input.toString() || ''+input;
+ }
+ },
+
+ format: function(str, args) {
+ var end = 0;
+ var start = 0;
+ var match = false;
+ var buffer = [];
+ var token = '';
+ var tmp = (str||'').split('');
+ for(start=0; start < tmp.length; start++) {
+ if (tmp[start] == '{' && tmp[start+1] !='{') {
+ end = str.indexOf('}', start);
+ token = tmp.slice(start+1, end).join('');
+ if (tmp[start-1] != '{' && tmp[end+1] != '}') {
+ var tokenArgs = (typeof arguments[1] != 'object')? arguments2Array(arguments, 2): args || [];
+ buffer.push(strings.strConversion.__formatToken(token, tokenArgs));
+ }
+ else {
+ buffer.push(token);
+ }
+ }
+ else if (start > end || buffer.length < 1) { buffer.push(tmp[start]); }
+ }
+ return (buffer.length > 1)? buffer.join(''): buffer[0];
+ },
+
+ calc: function(str, args) {
+ return eval(format(str, args));
+ },
+
+ repeat: function(s, n) {
+ return new Array(n+1).join(s);
+ },
+
+ UTF8encode: function(s) {
+ return unescape(encodeURIComponent(s));
+ },
+
+ UTF8decode: function(s) {
+ return decodeURIComponent(escape(s));
+ },
+
+ tpl: function() {
+ var out = '', render = true;
+ // Set
+ // $.tpl('ui.test', ['<span>', helloWorld ,'</span>']);
+ if (arguments.length == 2 && $.isArray(arguments[1])) {
+ this[arguments[0]] = arguments[1].join('');
+ return jQuery;
+ }
+ // $.tpl('ui.test', '<span>hello world</span>');
+ if (arguments.length == 2 && $.isString(arguments[1])) {
+ this[arguments[0]] = arguments[1];
+ return jQuery;
+ }
+ // Call
+ // $.tpl('ui.test');
+ if (arguments.length == 1) {
+ return $(this[arguments[0]]);
+ }
+ // $.tpl('ui.test', false);
+ if (arguments.length == 2 && arguments[1] == false) {
+ return this[arguments[0]];
+ }
+ // $.tpl('ui.test', {value:blah});
+ if (arguments.length == 2 && $.isObject(arguments[1])) {
+ return $($.format(this[arguments[0]], arguments[1]));
+ }
+ // $.tpl('ui.test', {value:blah}, false);
+ if (arguments.length == 3 && $.isObject(arguments[1])) {
+ return (arguments[2] == true)
+ ? $.format(this[arguments[0]], arguments[1])
+ : $($.format(this[arguments[0]], arguments[1]));
+ }
+ }
+ };
+
+ var Argument = function(arg, args) {
+ this.__arg = arg;
+ this.__args = args;
+ this.__max_precision = parseFloat('1.'+ (new Array(32)).join('1'), 10).toString().length-3;
+ this.__def_precision = 6;
+ this.getString = function(){
+ return this.__arg;
+ };
+ this.getKey = function(){
+ return this.__arg.split(':')[0];
+ };
+ this.getFormat = function(){
+ var match = this.getString().split(':');
+ return (match && match[1])? match[1]: 's';
+ };
+ this.getPrecision = function(){
+ var match = this.getFormat().match(/\.(\d+|\*)/g);
+ if (!match) { return this.__def_precision; }
+ else {
+ match = match[0].slice(1);
+ if (match != '*') { return parseInt(match, 10); }
+ else if(strings.strConversion.__getType(this.__args) == 'array') {
+ return this.__args[1] && this.__args[0] || this.__def_precision;
+ }
+ else if(strings.strConversion.__getType(this.__args) == 'object') {
+ return this.__args[this.getKey()] && this.__args[this.getKey()][0] || this.__def_precision;
+ }
+ else { return this.__def_precision; }
+ }
+ };
+ this.getPaddingLength = function(){
+ var match = false;
+ if (this.isAlternate()) {
+ match = this.getString().match(/0?#0?(\d+)/);
+ if (match && match[1]) { return parseInt(match[1], 10); }
+ }
+ match = this.getString().match(/(0|\.)(\d+|\*)/g);
+ return match && parseInt(match[0].slice(1), 10) || 0;
+ };
+ this.getPaddingString = function(){
+ var o = '';
+ if (this.isAlternate()) { o = ' '; }
+ // 0 take precedence on alternate format
+ if (this.getFormat().match(/#0|0#|^0|\.\d+/)) { o = '0'; }
+ return o;
+ };
+ this.getFlags = function(){
+ var match = this.getString().matc(/^(0|\#|\-|\+|\s)+/);
+ return match && match[0].split('') || [];
+ };
+ this.isAlternate = function() {
+ return !!this.getFormat().match(/^0?#/);
+ };
+ };
+
+ var arguments2Array = function(args, shift) {
+ var o = [];
+ for (l=args.length, x=(shift || 0)-1; x<l;x++) { o.push(args[x]); }
+ return o;
+ };
+ $.extend(strings);
+})(jQuery);
View
262 standalone/ui-djangoForm/testproject/media/js/jquery.utils.js
@@ -0,0 +1,262 @@
+/*
+ jQuery utils - @VERSION
+ http://code.google.com/p/jquery-utils/
+
+ (c) Maxime Haineault <haineault@gmail.com>
+ http://haineault.com
+
+ MIT License (http://www.opensource.org/licenses/mit-license.php
+
+*/
+
+(function($){
+ $.extend($.expr[':'], {
+ // case insensitive version of :contains
+ icontains: function(a,i,m){return (a.textContent||a.innerText||jQuery(a).text()||"").toLowerCase().indexOf(m[3].toLowerCase())>=0;}
+ });
+
+ $.iterators = {
+ getText: function() { return $(this).text(); },
+ parseInt: function(v){ return parseInt(v, 10); }
+ };
+
+ $.extend({
+
+ // Returns a range object
+ // Author: Matthias Miller
+ // Site: http://blog.outofhanwell.com/2006/03/29/javascript-range-function/
+ range: function() {
+ if (!arguments.length) { return []; }
+ var min, max, step;
+ if (arguments.length == 1) {
+ min = 0;
+ max = arguments[0]-1;
+ step = 1;
+ }
+ else {
+ // default step to 1 if it's zero or undefined
+ min = arguments[0];
+ max = arguments[1]-1;
+ step = arguments[2] || 1;
+ }
+ // convert negative steps to positive and reverse min/max
+ if (step < 0 && min >= max) {
+ step *= -1;
+ var tmp = min;
+ min = max;
+ max = tmp;
+ min += ((max-min) % step);
+ }
+ var a = [];
+ for (var i = min; i <= max; i += step) { a.push(i); }
+ return a;
+ },
+
+ // Taken from ui.core.js.
+ // Why are you keeping this gem for yourself guys ? :|
+ keyCode: {
+ BACKSPACE: 8, CAPS_LOCK: 20, COMMA: 188, CONTROL: 17, DELETE: 46, DOWN: 40,
+ END: 35, ENTER: 13, ESCAPE: 27, HOME: 36, INSERT: 45, LEFT: 37,
+ NUMPAD_ADD: 107, NUMPAD_DECIMAL: 110, NUMPAD_DIVIDE: 111, NUMPAD_ENTER: 108,
+ NUMPAD_MULTIPLY: 106, NUMPAD_SUBTRACT: 109, PAGE_DOWN: 34, PAGE_UP: 33,
+ PERIOD: 190, RIGHT: 39, SHIFT: 16, SPACE: 32, TAB: 9, UP: 38
+ },
+
+ // Takes a keyboard event and return true if the keycode match the specified keycode
+ keyIs: function(k, e) {
+ return parseInt($.keyCode[k.toUpperCase()], 10) == parseInt((typeof(e) == 'number' )? e: e.keyCode, 10);
+ },
+
+ // Returns the key of an array
+ keys: function(arr) {
+ var o = [];
+ for (k in arr) { o.push(k); }
+ return o;
+ },
+
+ // Redirect to a specified url
+ redirect: function(url) {
+ window.location.href = url;
+ return url;
+ },
+
+ // Stop event shorthand
+ stop: function(e, preventDefault, stopPropagation) {
+ if (preventDefault) { e.preventDefault(); }
+ if (stopPropagation) { e.stopPropagation(); }
+ return preventDefault && false || true;
+ },
+
+ // Returns the basename of a path
+ basename: function(path) {
+ var t = path.split('/');
+ return t[t.length] === '' && s || t.slice(0, t.length).join('/');
+ },
+
+ // Returns the filename of a path
+ filename: function(path) {
+ return path.split('/').pop();
+ },
+
+ // Returns a formated file size
+ filesizeformat: function(bytes, suffixes){
+ var b = parseInt(bytes, 10);
+ var s = suffixes || ['byte', 'bytes', 'KB', 'MB', 'GB'];
+ if (isNaN(b) || b === 0) { return '0 ' + s[0]; }
+ if (b == 1) { return '1 ' + s[0]; }
+ if (b < 1024) { return b.toFixed(2) + ' ' + s[1]; }
+ if (b < 1048576) { return (b / 1024).toFixed(2) + ' ' + s[2]; }
+ if (b < 1073741824) { return (b / 1048576).toFixed(2) + ' '+ s[3]; }
+ else { return (b / 1073741824).toFixed(2) + ' '+ s[4]; }
+ },
+
+ fileExtension: function(s) {
+ var tokens = s.split('.');
+ return tokens[tokens.length-1] || false;
+ },
+
+ // Returns true if an object is a String
+ isString: function(o) {
+ return typeof(o) == 'string' && true || false;
+ },
+
+ // Returns true if an object is a RegExp
+ isRegExp: function(o) {
+ return o && o.constructor.toString().indexOf('RegExp()') != -1 || false;
+ },
+
+ // Returns true if an object is an array
+ // Mark Miller - http://blog.360.yahoo.com/blog-TBPekxc1dLNy5DOloPfzVvFIVOWMB0li?p=916
+ isArray: function(o) {
+ return Object.prototype.toString.apply(o || false) === '[object Array]';
+ },
+
+ isObject: function(o) {
+ return (typeof(o) == 'object');
+ },
+
+ // Convert input to currency (two decimal fixed number)
+ toCurrency: function(i) {
+ i = parseFloat(i, 10).toFixed(2);
+ return (i=='NaN') ? '0.00' : i;
+ },
+
+ /*--------------------------------------------------------------------
+ * javascript method: "pxToEm"
+ * by:
+ Scott Jehl (scott@filamentgroup.com)
+ Maggie Wachs (maggie@filamentgroup.com)
+ http://www.filamentgroup.com
+ *
+ * Copyright (c) 2008 Filament Group
+ * Dual licensed under the MIT (filamentgroup.com/examples/mit-license.txt) and GPL (filamentgroup.com/examples/gpl-license.txt) licenses.
+ *
+ * Description: pxToEm converts a pixel value to ems depending on inherited font size.
+ * Article: http://www.filamentgroup.com/lab/retaining_scalable_interfaces_with_pixel_to_em_conversion/
+ * Demo: http://www.filamentgroup.com/examples/pxToEm/
+ *
+ * Options:
+ scope: string or jQuery selector for font-size scoping
+ reverse: Boolean, true reverses the conversion to em-px
+ * Dependencies: jQuery library
+ * Usage Example: myPixelValue.pxToEm(); or myPixelValue.pxToEm({'scope':'#navigation', reverse: true});
+ *
+ * Version: 2.1, 18.12.2008
+ * Changelog:
+ * 08.02.2007 initial Version 1.0
+ * 08.01.2008 - fixed font-size calculation for IE
+ * 18.12.2008 - removed native object prototyping to stay in jQuery's spirit, jsLinted (Maxime Haineault <haineault@gmail.com>)
+ --------------------------------------------------------------------*/
+
+ pxToEm: function(i, settings){
+ //set defaults
+ settings = jQuery.extend({
+ scope: 'body',
+ reverse: false
+ }, settings);
+
+ var pxVal = (i === '') ? 0 : parseFloat(i);
+ var scopeVal;
+ var getWindowWidth = function(){
+ var de = document.documentElement;
+ return self.innerWidth || (de && de.clientWidth) || document.body.clientWidth;
+ };
+
+ /* When a percentage-based font-size is set on the body, IE returns that percent of the window width as the font-size.
+ For example, if the body font-size is 62.5% and the window width is 1000px, IE will return 625px as the font-size.
+ When this happens, we calculate the correct body font-size (%) and multiply it by 16 (the standard browser font size)
+ to get an accurate em value. */
+
+ if (settings.scope == 'body' && $.browser.msie && (parseFloat($('body').css('font-size')) / getWindowWidth()).toFixed(1) > 0.0) {
+ var calcFontSize = function(){
+ return (parseFloat($('body').css('font-size'))/getWindowWidth()).toFixed(3) * 16;
+ };
+ scopeVal = calcFontSize();
+ }
+ else { scopeVal = parseFloat(jQuery(settings.scope).css("font-size")); }
+
+ var result = (settings.reverse === true) ? (pxVal * scopeVal).toFixed(2) + 'px' : (pxVal / scopeVal).toFixed(2) + 'em';
+ return result;
+ }
+ });
+
+ $.extend($.fn, {
+ // Select a text range in a textarea
+ selectRange: function(start, end){
+ // use only the first one since only one input can be focused
+ if ($(this).get(0).createTextRange) {
+ var range = $(this).get(0).createTextRange();
+ range.collapse(true);
+ range.moveEnd('character', end);
+ range.moveStart('character', start);
+ range.select();
+ }
+ else if ($(this).get(0).setSelectionRange) {
+ $(this).bind('focus', function(e){
+ e.preventDefault();
+ }).get(0).setSelectionRange(start, end);
+ }
+ return $(this);
+ },
+
+ /*--------------------------------------------------------------------
+ * JQuery Plugin: "EqualHeights"
+ * by: Scott Jehl, Todd Parker, Maggie Costello Wachs (http://www.filamentgroup.com)
+ *
+ * Copyright (c) 2008 Filament Group
+ * Licensed under GPL (http://www.opensource.org/licenses/gpl-license.php)
+ *
+ * Description: Compares the heights or widths of the top-level children of a provided element
+ and sets their min-height to the tallest height (or width to widest width). Sets in em units
+ by default if pxToEm() method is available.
+ * Dependencies: jQuery library, pxToEm method (article:
+ http://www.filamentgroup.com/lab/retaining_scalable_interfaces_with_pixel_to_em_conversion/)
+ * Usage Example: $(element).equalHeights();
+ Optional: to set min-height in px, pass a true argument: $(element).equalHeights(true);
+ * Version: 2.1, 18.12.2008
+ *
+ * Note: Changed pxToEm call to call $.pxToEm instead, jsLinted (Maxime Haineault <haineault@gmail.com>)
+ --------------------------------------------------------------------*/
+
+ equalHeights: function(px){
+ $(this).each(function(){
+ var currentTallest = 0;
+ $(this).children().each(function(i){
+ if ($(this).height() > currentTallest) { currentTallest = $(this).height(); }
+ });
+ if (!px || !$.pxToEm) { currentTallest = $.pxToEm(currentTallest); } //use ems unless px is specified
+ // for ie6, set height since min-height isn't supported
+ if ($.browser.msie && $.browser.version == 6.0) { $(this).children().css({'height': currentTallest}); }
+ $(this).children().css({'min-height': currentTallest});
+ });
+ return this;
+ },
+
+ // Copyright (c) 2009 James Padolsey
+ // http://james.padolsey.com/javascript/jquery-delay-plugin/
+ delay: function(time, callback){
+ jQuery.fx.step.delay = function(){};
+ return this.animate({delay:1}, time, callback);
+ }
+ });
+})(jQuery);
View
131 standalone/ui-djangoForm/testproject/media/js/ui.djangoForm.js
@@ -0,0 +1,131 @@
+/* jQuery ui.djangoForm.js - 0.1
+ *
+ * (c) Maxime Haineault <haineault@gmail.com>
+ * http://haineault.com
+ *
+ * MIT License (http://www.opensource.org/licenses/mit-license.php)
+ *
+ * */
+
+$.widget('ui.djangoForm', {
+ _init: function(fields) {
+ var ui = this;
+
+ ui.element = $(ui.element).eq(0).bind('submit', function(e){
+ $(this).removeClass('ui-djangoForm-error').find('ul.'+ ui.options.errorListClass).remove();
+ $.each(ui.options.fields, function(name, field){
+ ui._applyRules(field, true);
+ });
+ return false;
+ return !ui._hasErrors; // don't submit if it has errors
+ });
+
+ $.each(ui.options.fields, function(name, field){
+ var id = $.format('#{0:s}{1:s}', ui.options.idPrefix, name);
+ field.id = id;
+ field.name = name;
+ field.element = $(id).data('validation.field', field);
+ if (field.required) {
+ field.element.parent().andSelf().addClass(ui.options.requiredClass);
+ }
+ });
+ },
+ _applyRules: function(field, applyRequired) {
+ for (x in $.ui.djangoForm.defaults.rules) {
+ field.rule = x; // I know.. it's ugly.
+ if (field.rules[x] && (applyRequired || (!applyRequired && x != 'required' && field[x]))) {
+ try {
+ console.log(x, field.rules[x])
+ $.ui.djangoForm.defaults.rules[x].apply(this, [field]);
+ } catch(e){};
+ }
+ };
+ },
+ _error: function(field, data) {
+ var data = data || {};
+ var msg = this.getErrorMessage(field, data);
+ this._hasErrors = true;
+ this.options.error.apply(this, [field, msg, data]);
+ this.element.addClass('ui-djangoForm-error');
+ },
+ getErrorMessage: function(field, tokens) {
+ return !field.msgs[field.rule] && ''
+ || $.format(field.msgs[field.rule].replace(/%\((\w+)\)(\w)/g, '{$1:$2}'), tokens || {});
+ },
+});
+
+$.tpl('djangoForm.errorList', '<ul></ul>');
+$.tpl('djangoForm.error', '<li></li>');
+
+$.ui.djangoForm.defaults = {
+ rules: {},
+ layout: 'table',
+ requiredClass: 'ui-djangoForm-required',
+ errorListClass: 'errorlist', // use the same as Django by default
+ idPrefix: 'id_',
+ error: function(field, message, data) {
+ if (!field.element.next().is('ul')) {
+ $.tpl('djangoForm.errorList')
+ .addClass(this.options.errorListClass)
+ .insertAfter(field.element);
+ }
+ $.tpl('djangoForm.error')
+ .appendTo(field.element.next())
+ .text(message);
+ }
+};
+
+$.extend($.ui.djangoForm.defaults.rules, {
+
+ required: function(field) {
+ if (field.element.val() == '') {
+ this._error(field);
+ }
+ },
+
+ max_length: function(field) {
+ var cl = field.element.val().length;
+ var ml = field.rules.max_length || false;
+ if (ml <= cl) {
+ this._error(field, { max: ml, length: cl });
+ }
+ },
+
+ min_length: function(field) {
+ var cl = field.element.val().length;
+ var ml = field.rules.min_length || false;
+ if (ml >= cl) {
+ this._error(field, { min: ml, length: cl });
+ }
+ },
+
+ decimal_length: function(field) {
+
+ var value = field.element.val();
+ var match = /^[-\s0]*(\d*).?(\d*)\s*$/.exec(value);
+ console.log('aaa',match);
+ /*
+ if (match) {
+ var max_digits = field.rules.max_digits;
+ if (max_digits !== null && (match[1].length + match[2].length) > max_digits) {
+ this._error(field, {max_digits: max_digits}, 'max_digits');
+ }
+
+ var max_decimal_places = field.rules.max_decimal_places;
+ if (max_decimal_places !== null && match[2].length > max_decimal_places) {
+ this._error(field, {max_decimal_places: max_decimal_places}, 'max_decimal_places');
+ }
+
+ if (max_digits !== null && max_decimal_places !== null) {
+ var max_whole_digits = max_digits - max_decimal_places;
+ if (match[1].length > max_whole_digits) {
+ this._error(field, {max_whole_digits: max_digits}, 'max_whole_digits');
+ }
+ }
+ }
+ */
+ }
+
+});
+
+
View
62 standalone/ui-djangoForm/testproject/setup.py
@@ -0,0 +1,62 @@
+#!/usr/bin/python
+# -*- coding: utf-8 -*-
+
+from optparse import OptionParser
+from glob import glob
+import os
+import shutil
+import sys
+import commands
+
+LOG = True
+SVNREV = ''
+
+LOGS = {
+ 'list': ' - %s',
+ 'build': '\n [\x1b\x5b1;31mB\x1b\x5b0;0m] %s',
+ 'dependency': ' [\x1b\x5b01;34mD\x1b\x5b0;0m] - %s',
+ 'minify': '\n [\x1b\x5b01;33mM\x1b\x5b0;0m] %s',
+ 'zip': '\n [\x1b\x5b01;32mZ\x1b\x5b0;0m] %s',
+ 'gzip': '\n [\x1b\x5b01;32mG\x1b\x5b0;0m] %s',
+ 'merge': '\n [\x1b\x5b1;36mM\x1b\x5b0;0m] %s',
+ 'copy': '\n [\x1b\x5b1;36mC\x1b\x5b0;0m] %s',
+ 'link': '\n [\x1b\x5b1;36mC\x1b\x5b0;0m] %s',
+ 'error': 'Error: %s',
+}
+
+def log(msg, log_type=False):
+ if LOG:
+ print LOGS.get(log_type, '%s') % msg
+
+def legend():
+ for k in LOGS:
+ if k not in ('list', 'error'):
+ print LOGS[k] % k
+
+def create_dir_if_not_exists(path):
+ if not os.path.exists(path):
+ log("creating directory: %s/" % path, 'list')
+ os.mkdir(path)
+ return path
+
+if __name__ == '__main__':
+ usage = "usage: %prog [options] <module>"
+ parser = OptionParser(usage=usage)
+ parser.add_option('-q', '--quiet', dest='quiet',
+ help='Not console output',
+ action='store_true', default=False)
+ (options, args) = parser.parse_args()
+
+ if options.legend:
+ legend()
+ else:
+ DEST = 'testproject/media/js/ui-djangoForm/'
+ CMD = '%s -> %s' % ('src/', DEST)
+ create_dir_if_not_exists(DEST)
+ log(CMD, 'link')
+ try:
+ print commands.getoutput(CMD)
+ except (IOError, OSError):
+ log('Error %s to %s' % (src, dest), 'error')
+
+ print '\n Done.\n'
View
13 standalone/ui-djangoForm/testproject/templates/base.html
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<head>
+ <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
+ <title>jQuery djangoForm</title>
+ <meta name="author" content="Maxime Haineault" />
+ {% block head.css %}{% endblock %}
+ {% block head.js %}{% endblock %}
+</head>
+<body id="themeroller">
+ {% block body.content %}{% endblock %}
+</body>
+</html>
+
View
86 standalone/ui-djangoForm/testproject/templates/test/edit.html
@@ -1,6 +1,19 @@
+{% extends "base.html" %}
{# http://www.scribd.com/doc/265680/Best-Practices-For-Form-Design #}
{% load ajax_form_utils %}
+{% block head.css %}
+<link rel="stylesheet" href="{{ MEDIA_URL }}css/ui.djangoForm.css" type="text/css" media="screen" />
+{% endblock %}
+{% block head.js %}
+<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js" type="text/javascript"></script>
+<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7/jquery-ui.js" type="text/javascript"></script>
+<script src="{{ MEDIA_URL }}js/jquery.utils.js" type="text/javascript"></script>
+<script src="{{ MEDIA_URL }}js/jquery.strings.js" type="text/javascript"></script>
+<script src="{{ MEDIA_URL }}js/ui.djangoForm.js" type="text/javascript"></script>
+{% endblock %}
+
+{% block body.content %}
<script>
$(function(){
$('form.ui-djangoForm').djangoForm({
@@ -11,78 +24,6 @@
});
});
</script>
-<style>
-.ui-djangoForm {
- width:500px;
- margin:20px;
-}
-/* form.as_p */
-.ui-djangoForm p {
- margin: 0 0 8px 0; padding: 0; border: 0; outline: 0; line-height: 1.3; font-size: 100%; list-style: none;
-
-}
-.ui-djangoForm p label {
- display:block;
-}
-.ui-djangoForm p label {
- font-size:80%;
-}
-.ui-djangoForm p.ui-djangoForm-action {
- text-align:right;
- background:#f4f4f4;
- border:1px solid #ddd;
- padding:8px;
-}
-/* form.as_ul */
-.ui-djangoForm ul {
- margin: 0; padding: 0; border: 0; outline: 0; line-height: 1.3; font-size: 100%; list-style: none;
-}
-.ui-djangoForm ul li {
- margin: 0; border: 0; outline: 0; line-height: 1.3; font-size: 100%; list-style: none;
- border-bottom:1px solid #ddd;
- padding: 8px 0;
-}
-.ui-djangoForm ul li label {
- display:block;
- float:left;
- text-align:right;
- width:130px;
- font-size:80%;
- margin:3px 10px 0 0;
-}
-
-.ui-djangoForm ul li.ui-djangoForm-action {
- text-align:right;
- background:#f4f4f4;
- border:1px solid #ddd;
- border-width:0 1px 1px 1px;
- padding:8px;
-}
-
-/* form.as_table */
-.ui-djangoForm table {}
-.ui-djangoForm table th {
- margin: 0; border: 0; outline: 0; line-height: 1.3; font-size: 100%;
- text-align:left;
- font-weight:normal;
- padding: 6px 3px;
- background:#f4f4f4;
- border-bottom:2px solid #fff;
-}
-.ui-djangoForm table td {
- padding: 6px 3px;
-}
-.ui-djangoForm table th label {
- font-size:80%;
- margin-left:10px;
-}
-.ui-djangoForm table .ui-djangoForm-action {
- text-align:right;
- background:#f4f4f4;
- border:1px solid #ddd;
- padding:8px;
-}
-</style>
<h1>jQuery.djangoForm</h1>
<h2>form.as_ul</h2>
<form class="ui-djangoForm" method="post" action="">
@@ -121,3 +62,4 @@
</th>
</tr>
</form>
+{% endblock %}
View
23 standalone/ui-djangoForm/testproject/testapp/forms.py
@@ -5,17 +5,18 @@
from testproject.testapp.models import *
class TestForm(forms.Form):
- name = forms.CharField(label=u"Name", required=True, max_length=50)
- phone = forms.CharField(label=u"Phone", required=False, max_length=50)
- fax = forms.CharField(label=u"Fax", required=False, max_length=50)
- email = forms.EmailField(label=u"Email", required=False, max_length=75)
- website = forms.URLField(label=u"Website", required=False, max_length=200)
- notes = forms.CharField(label=u"Notes", required=False, widget=forms.Textarea)
- address = forms.CharField(label=u"Address", required=False, max_length=200)
- city = forms.CharField(label=u"City", required=False, max_length=100)
- state = forms.CharField(label=u"State/Province", required=False, max_length=100)
- country = forms.CharField(label=u"Country", required=False, max_length=100)
- zipcode = forms.CharField(label=u"Postal/Zip code", required=False, max_length=10)
+ boolean = forms.BooleanField(label=u"Boolean")
+ char = forms.CharField(label=u"Char field", required=True, max_length=50, min_length=3, help_text="required, max length: 50, min length: 3")
+ date = forms.DateField(label="Date")
+ datetime = forms.DateTimeField(label="DateTime")
+ decimal = forms.DecimalField(label="Decimal", decimal_places=3, max_digits=3, help_text="Decimal places: 3, max digits: 3")
+ email = forms.EmailField(label=u"Email (max 75)")
+ float = forms.FloatField(label="Float")
+ integer = forms.IntegerField(label="Integer")
+ ipAddress = forms.IPAddressField(label="IP address")
+ slug = forms.CharField(label="Slug", max_length=15, help_text="Max length: 15")
+ time = forms.TimeField(label="Time")
+ url = forms.URLField(label=u"URL")
def clean_name(self):
if not self.cleaned_data['name'][0].isalnum():
View
15 standalone/ui-djangoForm/testproject/testapp/models.py
@@ -1,25 +1,18 @@
from django.db import models
class Test(models.Model):
-
- charRequired = models.CharField(u"Char field (required)", blank=False, max_length=200)
- charRequired = models.CharField(u"Char field (optional)", blank=True, max_length=200)
- charMaxlength = models.CharField(u"Char field (max 10)", max_length=10)
boolean = models.BooleanField(u"Boolean")
- csif = models.CommaSeparatedIntegerField(max_length=200)
+ char = models.CharField(u"Char field (required)", blank=False, max_length=200)
date = models.DateField()
datetime = models.DateTimeField()
decimal = models.DecimalField(decimal_places=3, max_digits=3)
- emailMaxlength = models.EmailField(u"Email (max 75)", max_length=75)
- floatfield = models.FloatField()
+ email = models.EmailField(u"Email (max 75)", max_length=75)
+ float = models.FloatField()
integer = models.IntegerField()
- psif = models.PositiveSmallIntegerField()
+ ipAddress = models.IPAddressField()
slug = models.SlugField()
- sif = models.SmallIntegerField()
- textfield = models.TextField(u"Notes")
time = models.TimeField()
url = models.URLField(u"URL (max 200)")
- xml = models.URLField(u"XML")
class Meta:
verbose_name = u'Test'
View
9 standalone/ui-djangoForm/testproject/urls.py
@@ -1,9 +1,18 @@
from django.conf.urls.defaults import *
from django.contrib import admin
+from django.conf import settings
admin.autodiscover()
urlpatterns = patterns('',
(r'^$', include('testproject.testapp.urls')),
(r'^admin/(.*)', admin.site.root),
)
+
+# Serving static content in development mode.
+if settings.DEBUG:
+ urlpatterns += patterns(
+ '',
+ (r'^media/(.*)$', 'django.views.static.serve', {'document_root': 'media'}),
+ )
+

0 comments on commit e80da59

Please sign in to comment.