/**
* jQuery custom checkboxes
*
* Copyright (c) 2008 Khavilo Dmitry (http://widowmaker.kiev.ua/checkbox/)
* Licensed under the MIT License:
* http://www.opensource.org/licenses/mit-license.php
*
* @version 1.3.0 Beta 1
* @author Khavilo Dmitry
* @mailto wm.morgun@gmail.com
**/
(function($){
/* Little trick to remove event bubbling that causes events recursion */
var CB = function(e)
{
if (!e) var e = window.event;
e.cancelBubble = true;
if (e.stopPropagation) e.stopPropagation();
};
$.fn.checkbox = function(options) {
/* IE6 background flicker fix */
try { document.execCommand('BackgroundImageCache', false, true); } catch (e) {}
/* Default settings */
var settings = {
cls: 'jquery-checkbox', /* checkbox */
empty: 'empty.png' /* checkbox */
};
/* Processing settings */
settings = $.extend(settings, options || {});
/* Adds check/uncheck & disable/enable events */
var addEvents = function(object)
{
var checked = object.checked;
var disabled = object.disabled;
var $object = $(object);
if ( object.stateInterval )
clearInterval(object.stateInterval);
object.stateInterval = setInterval(
function()
{
if ( object.disabled != disabled )
$object.trigger( (disabled = !!object.disabled) ? 'disable' : 'enable');
if ( object.checked != checked )
$object.trigger( (checked = !!object.checked) ? 'check' : 'uncheck');
},
10 /* in miliseconds. Low numbers this can decrease performance on slow computers, high will increase responce time */
);
return $object;
};
//try { console.log(this); } catch(e) {}
/* Wrapping all passed elements */
return this.each(function()
{
var ch = this; /* Reference to DOM Element*/
var $ch = addEvents(ch); /* Adds custom events and returns, jQuery enclosed object */
/* Removing wrapper if already applied */
if (ch.wrapper) ch.wrapper.remove();
/* Creating wrapper for checkbox and assigning "hover" event */
ch.wrapper = $('');
ch.wrapperInner = ch.wrapper.children('span:eq(0)');
ch.wrapper.hover(
function(e) { ch.wrapperInner.addClass(settings.cls + '-hover');CB(e); },
function(e) { ch.wrapperInner.removeClass(settings.cls + '-hover');CB(e); }
);
/* Wrapping checkbox */
$ch.css({position: 'absolute', zIndex: -1, visibility: 'hidden'}).after(ch.wrapper);
/* Ttying to find "our" label */
var label = false;
if ($ch.attr('id'))
{
label = $('label[for='+$ch.attr('id')+']');
if (!label.length) label = false;
}
if (!label)
{
/* Trying to utilize "closest()" from jQuery 1.3+ */
label = $ch.closest ? $ch.closest('label') : $ch.parents('label:eq(0)');
if (!label.length) label = false;
}
/* Labe found, applying event hanlers */
if (label)
{
label.hover(
function(e) { ch.wrapper.trigger('mouseover', [e]); },
function(e) { ch.wrapper.trigger('mouseout', [e]); }
);
label.click(function(e) { $ch.trigger('click',[e]); CB(e); return false;});
}
ch.wrapper.click(function(e) { $ch.trigger('click',[e]); CB(e); return false;});
$ch.click(function(e) { CB(e); });
$ch.bind('disable', function() { ch.wrapperInner.addClass(settings.cls+'-disabled');}).bind('enable', function() { ch.wrapperInner.removeClass(settings.cls+'-disabled');});
$ch.bind('check', function() { ch.wrapper.addClass(settings.cls+'-checked' );}).bind('uncheck', function() { ch.wrapper.removeClass(settings.cls+'-checked' );});
/* Disable image drag-n-drop for IE */
$('img', ch.wrapper).bind('dragstart', function () {return false;}).bind('mousedown', function () {return false;});
/* Firefox antiselection hack */
if ( window.getSelection )
ch.wrapper.css('MozUserSelect', 'none');
/* Applying checkbox state */
if ( ch.checked )
ch.wrapper.addClass(settings.cls + '-checked');
if ( ch.disabled )
ch.wrapperInner.addClass(settings.cls + '-disabled');
});
}
})(jQuery);
/**
* Boxy 0.1.4 - Facebook-style dialog, with frills
*
* (c) 2008 Jason Frame
* Licensed under the MIT License (LICENSE)
*/
/*
* jQuery plugin
*
* Options:
* message: confirmation message for form submit hook (default: "Please confirm:")
*
* Any other options - e.g. 'clone' - will be passed onto the boxy constructor (or
* Boxy.load for AJAX operations)
*/
jQuery.fn.boxy = function(options) {
options = options || {};
return this.each(function() {
var node = this.nodeName.toLowerCase(), self = this;
if (node == 'a') {
jQuery(this).click(function() {
var active = Boxy.linkedTo(this),
href = this.getAttribute('href'),
localOptions = jQuery.extend({actuator: this, title: this.title}, options);
if (active) {
active.show();
} else if (href.indexOf('#') >= 0) {
var content = jQuery(href.substr(href.indexOf('#'))),
newContent = content.clone(true);
content.remove();
localOptions.unloadOnHide = false;
new Boxy(newContent, localOptions);
} else { // fall back to AJAX; could do with a same-origin check
if (!localOptions.cache) localOptions.unloadOnHide = true;
Boxy.load(this.href, localOptions);
}
return false;
});
} else if (node == 'form') {
jQuery(this).bind('submit.boxy', function() {
Boxy.confirm(options.message || 'Please confirm:', function() {
jQuery(self).unbind('submit.boxy').submit();
});
return false;
});
}
});
};
//
// Boxy Class
function Boxy(element, options) {
this.boxy = jQuery(Boxy.WRAPPER);
jQuery.data(this.boxy[0], 'boxy', this);
this.visible = false;
this.options = jQuery.extend({}, Boxy.DEFAULTS, options || {});
if (this.options.modal) {
this.options = jQuery.extend(this.options, {center: true, draggable: false});
}
// options.actuator == DOM element that opened this boxy
// association will be automatically deleted when this boxy is remove()d
if (this.options.actuator) {
jQuery.data(this.options.actuator, 'active.boxy', this);
}
this.setContent(element || "");
this._setupTitleBar();
this.boxy.css('display', 'none').appendTo(document.body);
this.toTop();
if (this.options.fixed) {
if (jQuery.browser.msie && jQuery.browser.version < 7) {
this.options.fixed = false; // IE6 doesn't support fixed positioning
} else {
this.boxy.addClass('fixed');
}
}
if (this.options.center && Boxy._u(this.options.x, this.options.y)) {
this.center();
} else {
this.moveTo(
Boxy._u(this.options.x) ? this.options.x : Boxy.DEFAULT_X,
Boxy._u(this.options.y) ? this.options.y : Boxy.DEFAULT_Y
);
}
if (this.options.show) this.show();
};
Boxy.EF = function() {};
jQuery.extend(Boxy, {
WRAPPER: "
" +
"
" +
"
" +
"
" +
"
",
DEFAULTS: {
title: null, // titlebar text. titlebar will not be visible if not set.
closeable: true, // display close link in titlebar?
draggable: true, // can this dialog be dragged?
clone: false, // clone content prior to insertion into dialog?
actuator: null, // element which opened this dialog
center: true, // center dialog in viewport?
show: true, // show dialog immediately?
modal: false, // make dialog modal?
fixed: true, // use fixed positioning, if supported? absolute positioning used otherwise
closeText: '[close]', // text to use for default close link
unloadOnHide: false, // should this dialog be removed from the DOM after being hidden?
clickToFront: false, // bring dialog to foreground on any click (not just titlebar)?
behaviours: Boxy.EF, // function used to apply behaviours to all content embedded in dialog.
afterDrop: Boxy.EF, // callback fired after dialog is dropped. executes in context of Boxy instance.
afterShow: Boxy.EF, // callback fired after dialog becomes visible. executes in context of Boxy instance.
afterHide: Boxy.EF, // callback fired after dialog is hidden. executed in context of Boxy instance.
beforeUnload: Boxy.EF // callback fired after dialog is unloaded. executed in context of Boxy instance.
},
DEFAULT_X: 50,
DEFAULT_Y: 50,
zIndex: 1337,
dragConfigured: false, // only set up one drag handler for all boxys
resizeConfigured: false,
dragging: null,
// load a URL and display in boxy
// url - url to load
// options keys (any not listed below are passed to boxy constructor)
// type: HTTP method, default: GET
// cache: cache retrieved content? default: false
// filter: jQuery selector used to filter remote content
load: function(url, options) {
options = options || {};
var ajax = {
url: url, type: 'GET', dataType: 'html', cache: false, success: function(html) {
html = jQuery(html);
if (options.filter) html = jQuery(options.filter, html);
new Boxy(html, options);
}
};
jQuery.each(['type', 'cache'], function() {
if (this in options) {
ajax[this] = options[this];
delete options[this];
}
});
jQuery.ajax(ajax);
},
// allows you to get a handle to the containing boxy instance of any element
// e.g. inspect!.
// this returns the actual instance of the boxy 'class', not just a DOM element.
// Boxy.get(this).hide() would be valid, for instance.
get: function(ele) {
var p = jQuery(ele).parents('.boxy-wrapper');
return p.length ? jQuery.data(p[0], 'boxy') : null;
},
// returns the boxy instance which has been linked to a given element via the
// 'actuator' constructor option.
linkedTo: function(ele) {
return jQuery.data(ele, 'active.boxy');
},
// displays an alert box with a given message, calling optional callback
// after dismissal.
alert: function(message, callback, options) {
return Boxy.ask(message, ['确定'], callback, options);
},
// displays an alert box with a given message, calling after callback iff
// user selects OK.
confirm: function(message, after, options) {
return Boxy.ask(message, ['确定', '取消'], function(response) {
if (response == '确定') after();
}, options);
},
// asks a question with multiple responses presented as buttons
// selected item is returned to a callback method.
// answers may be either an array or a hash. if it's an array, the
// the callback will received the selected value. if it's a hash,
// you'll get the corresponding key.
ask: function(question, answers, callback, options) {
options = jQuery.extend({modal: true, closeable: false},
options || {},
{show: true, unloadOnHide: true});
var body = jQuery('').append(jQuery('').html(question));
// ick
var map = {}, answerStrings = [];
if (answers instanceof Array) {
for (var i = 0; i < answers.length; i++) {
map[answers[i]] = answers[i];
answerStrings.push(answers[i]);
}
} else {
for (var k in answers) {
map[answers[k]] = k;
answerStrings.push(answers[k]);
}
}
var buttons = jQuery('');
buttons.html(jQuery.map(answerStrings, function(v) {
return "";
}).join(' '));
jQuery('input[type=button]', buttons).click(function() {
var clicked = this;
Boxy.get(this).hide(function() {
if (callback) callback(map[clicked.value]);
});
});
body.append(buttons);
new Boxy(body, options);
},
// returns true if a modal boxy is visible, false otherwise
isModalVisible: function() {
return jQuery('.boxy-modal-blackout').length > 0;
},
_u: function() {
for (var i = 0; i < arguments.length; i++)
if (typeof arguments[i] != 'undefined') return false;
return true;
},
_handleResize: function(evt) {
var d = jQuery(document);
jQuery('.boxy-modal-blackout').css('display', 'none').css({
width: d.width(), height: d.height()
}).css('display', 'block');
},
_handleDrag: function(evt) {
var d;
if (d = Boxy.dragging) {
d[0].boxy.css({left: evt.pageX - d[1], top: evt.pageY - d[2]});
}
},
_nextZ: function() {
return Boxy.zIndex++;
},
_viewport: function() {
var d = document.documentElement, b = document.body, w = window;
return jQuery.extend(
jQuery.browser.msie ?
{ left: b.scrollLeft || d.scrollLeft, top: b.scrollTop || d.scrollTop } :
{ left: w.pageXOffset, top: w.pageYOffset },
!Boxy._u(w.innerWidth) ?
{ width: w.innerWidth, height: w.innerHeight } :
(!Boxy._u(d) && !Boxy._u(d.clientWidth) && d.clientWidth != 0 ?
{ width: d.clientWidth, height: d.clientHeight } :
{ width: b.clientWidth, height: b.clientHeight }) );
}
});
Boxy.prototype = {
// Returns the size of this boxy instance without displaying it.
// Do not use this method if boxy is already visible, use getSize() instead.
estimateSize: function() {
this.boxy.css({visibility: 'hidden', display: 'block'});
var dims = this.getSize();
this.boxy.css('display', 'none').css('visibility', 'visible');
return dims;
},
// Returns the dimensions of the entire boxy dialog as [width,height]
getSize: function() {
return [this.boxy.width(), this.boxy.height()];
},
getWidth: function() {
return this.boxy.width();
},
getHeight: function() {
return this.boxy.height();
},
// Returns the dimensions of the content region as [width,height]
getContentSize: function() {
var c = this.getContent();
return [c.width(), c.height()];
},
// Returns the position of this dialog as [x,y]
getPosition: function() {
var b = this.boxy[0];
return [b.offsetLeft, b.offsetTop];
},
// Returns the center point of this dialog as [x,y]
getCenter: function() {
var p = this.getPosition();
var s = this.getSize();
return [Math.floor(p[0] + s[0] / 2), Math.floor(p[1] + s[1] / 2)];
},
// Returns a jQuery object wrapping the inner boxy region.
// Not much reason to use this, you're probably more interested in getContent()
getInner: function() {
return jQuery('.boxy-inner', this.boxy);
},
// Returns a jQuery object wrapping the boxy content region.
// This is the user-editable content area (i.e. excludes titlebar)
getContent: function() {
return jQuery('.boxy-content', this.boxy);
},
// Replace dialog content
setContent: function(newContent) {
newContent = jQuery(newContent).css({display: 'block'}).addClass('boxy-content');
if (this.options.clone) newContent = newContent.clone(true);
this.getContent().remove();
this.getInner().append(newContent);
this._setupDefaultBehaviours(newContent);
this.options.behaviours.call(this, newContent);
return this;
},
// Move this dialog to some position, funnily enough
moveTo: function(x, y) {
this.moveToX(x).moveToY(y);
return this;
},
// Move this dialog (x-coord only)
moveToX: function(x) {
if (typeof x == 'number') this.boxy.css({left: x});
else this.centerX();
return this;
},
// Move this dialog (y-coord only)
moveToY: function(y) {
if (typeof y == 'number') this.boxy.css({top: y});
else this.centerY();
return this;
},
// Move this dialog so that it is centered at (x,y)
centerAt: function(x, y) {
var s = this[this.visible ? 'getSize' : 'estimateSize']();
if (typeof x == 'number') this.moveToX(x - s[0] / 2);
if (typeof y == 'number') this.moveToY(y - s[1] / 2);
return this;
},
centerAtX: function(x) {
return this.centerAt(x, null);
},
centerAtY: function(y) {
return this.centerAt(null, y);
},
// Center this dialog in the viewport
// axis is optional, can be 'x', 'y'.
center: function(axis) {
var v = Boxy._viewport();
var o = this.options.fixed ? [0, 0] : [v.left, v.top];
if (!axis || axis == 'x') this.centerAt(o[0] + v.width / 2, null);
if (!axis || axis == 'y') this.centerAt(null, o[1] + v.height / 2);
return this;
},
// Center this dialog in the viewport (x-coord only)
centerX: function() {
return this.center('x');
},
// Center this dialog in the viewport (y-coord only)
centerY: function() {
return this.center('y');
},
// Resize the content region to a specific size
resize: function(width, height, after) {
if (!this.visible) return;
var bounds = this._getBoundsForResize(width, height);
this.boxy.css({left: bounds[0], top: bounds[1]});
this.getContent().css({width: bounds[2], height: bounds[3]});
if (after) after(this);
return this;
},
// Tween the content region to a specific size
tween: function(width, height, after) {
if (!this.visible) return;
var bounds = this._getBoundsForResize(width, height);
var self = this;
this.boxy.stop().animate({left: bounds[0], top: bounds[1]});
this.getContent().stop().animate({width: bounds[2], height: bounds[3]}, function() {
if (after) after(self);
});
return this;
},
// Returns true if this dialog is visible, false otherwise
isVisible: function() {
return this.visible;
},
// Make this boxy instance visible
show: function() {
if (this.visible) return;
if (this.options.modal) {
var self = this;
if (!Boxy.resizeConfigured) {
Boxy.resizeConfigured = true;
jQuery(window).resize(function() { Boxy._handleResize(); });
}
this.modalBlackout = jQuery('')
.css({zIndex: Boxy._nextZ(),
opacity: 0.2,
width: jQuery(document).width(),
height: jQuery(document).height()})
.appendTo(document.body);
this.toTop();
if (this.options.closeable) {
jQuery(document.body).bind('keypress.boxy', function(evt) {
var key = evt.which || evt.keyCode;
if (key == 27) {
self.hide();
jQuery(document.body).unbind('keypress.boxy');
}
});
}
}
this.boxy.stop().css({opacity: 1}).show();
this.visible = true;
this._fire('afterShow');
return this;
},
// Hide this boxy instance
hide: function(after) {
if (!this.visible) return;
var self = this;
if (this.options.modal) {
jQuery(document.body).unbind('keypress.boxy');
this.modalBlackout.animate({opacity: 0}, function() {
jQuery(this).remove();
});
}
this.boxy.stop().animate({opacity: 0}, 300, function() {
self.boxy.css({display: 'none'});
self.visible = false;
self._fire('afterHide');
if (after) after(self);
if (self.options.unloadOnHide) self.unload();
});
return this;
},
toggle: function() {
this[this.visible ? 'hide' : 'show']();
return this;
},
hideAndUnload: function(after) {
this.options.unloadOnHide = true;
this.hide(after);
return this;
},
unload: function() {
this._fire('beforeUnload');
this.boxy.remove();
if (this.options.actuator) {
jQuery.data(this.options.actuator, 'active.boxy', false);
}
},
// Move this dialog box above all other boxy instances
toTop: function() {
this.boxy.css({zIndex: Boxy._nextZ()});
return this;
},
// Returns the title of this dialog
getTitle: function() {
return jQuery('> .title-bar h2', this.getInner()).html();
},
// Sets the title of this dialog
setTitle: function(t) {
jQuery('> .title-bar h2', this.getInner()).html(t);
return this;
},
//
// Don't touch these privates
_getBoundsForResize: function(width, height) {
var csize = this.getContentSize();
var delta = [width - csize[0], height - csize[1]];
var p = this.getPosition();
return [Math.max(p[0] - delta[0] / 2, 0),
Math.max(p[1] - delta[1] / 2, 0), width, height];
},
_setupTitleBar: function() {
if (this.options.title) {
var self = this;
var tb = jQuery("").html("
" + this.options.title + "
");
if (this.options.closeable) {
tb.append(jQuery("").html(this.options.closeText));
}
if (this.options.draggable) {
tb[0].onselectstart = function() { return false; }
tb[0].unselectable = 'on';
tb[0].style.MozUserSelect = 'none';
if (!Boxy.dragConfigured) {
jQuery(document).mousemove(Boxy._handleDrag);
Boxy.dragConfigured = true;
}
tb.mousedown(function(evt) {
self.toTop();
Boxy.dragging = [self, evt.pageX - self.boxy[0].offsetLeft, evt.pageY - self.boxy[0].offsetTop];
jQuery(this).addClass('dragging');
}).mouseup(function() {
jQuery(this).removeClass('dragging');
Boxy.dragging = null;
self._fire('afterDrop');
});
}
this.getInner().prepend(tb);
this._setupDefaultBehaviours(tb);
}
},
_setupDefaultBehaviours: function(root) {
var self = this;
if (this.options.clickToFront) {
root.click(function() { self.toTop(); });
}
jQuery('.close', root).click(function() {
self.hide();
return false;
}).mousedown(function(evt) { evt.stopPropagation(); });
},
_fire: function(event) {
this.options[event].call(this);
}
};
/*
* Copyright 2010 akquinet
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
/**
* This JQuery Plugin will help you in showing some nice Toast-Message like notification messages. The behavior is
* similar to the android Toast class.
* You have 4 different toast types you can show. Each type comes with its own icon and colored border. The types are:
* - notice
* - success
* - warning
* - error
*
* The following methods will display a toast message:
*
* $().toastmessage('showNoticeToast', 'some message here');
* $().toastmessage('showSuccessToast', "some message here");
* $().toastmessage('showWarningToast', "some message here");
* $().toastmessage('showErrorToast', "some message here");
*
* // user configured toastmessage:
* $().toastmessage('showToast', {
* text : 'Hello World',
* sticky : true,
* position : 'top-right',
* type : 'success',
* close : function () {console.log("toast is closed ...");}
* });
*
* To see some more examples please have a look into the Tests in src/test/javascript/ToastmessageTest.js
*
* For further style configuration please see corresponding css file: jquery-toastmessage.css
*
* This plugin is based on the jquery-notice (http://sandbox.timbenniks.com/projects/jquery-notice/)
* but is enhanced in several ways:
*
* configurable positioning
* convenience methods for different message types
* callback functionality when closing the toast
* included some nice free icons
* reimplemented to follow jquery plugin good practices rules
*
* Author: Daniel Bremer-Tonn
**/
(function($)
{
var settings = {
inEffect: {opacity: 'show'}, // in effect
inEffectDuration: 600, // in effect duration in miliseconds
stayTime: 3000, // time in miliseconds before the item has to disappear
text: '', // content of the item. Might be a string or a jQuery object. Be aware that any jQuery object which is acting as a message will be deleted when the toast is fading away.
sticky: false, // should the toast item sticky or not?
type: 'notice', // notice, warning, error, success
position: 'top-right', // top-left, top-center, top-right, middle-left, middle-center, middle-right ... Position of the toast container holding different toast. Position can be set only once at the very first call, changing the position after the first call does nothing
closeText: '', // text which will be shown as close button, set to '' when you want to introduce an image via css
close: null // callback function when the toastmessage is closed
};
var methods = {
init : function(options)
{
if (options) {
$.extend( settings, options );
}
},
showToast : function(options)
{
var localSettings = {};
$.extend(localSettings, settings, options);
// declare variables
var toastWrapAll, toastItemOuter, toastItemInner, toastItemClose, toastItemImage;
toastWrapAll = (!$('.toast-container').length) ? $('').addClass('toast-container').addClass('toast-position-' + localSettings.position).appendTo('body') : $('.toast-container');
toastItemOuter = $('').addClass('toast-item-wrapper');
toastItemInner = $('').hide().addClass('toast-item toast-type-' + localSettings.type).appendTo(toastWrapAll).html($('
').addClass('toast-item-close').prependTo(toastItemInner).html(localSettings.closeText).click(function() { $().toastmessage('removeToast',toastItemInner, localSettings) });
toastItemImage = $('').addClass('toast-item-image').addClass('toast-item-image-' + localSettings.type).prependTo(toastItemInner);
// add by twm
var width = $('.toast-container').width();
var screen_width = $('body').width();
var left = (screen_width/2) - (width/2);
$('.toast-position-middle-center').css('left', left + 'px');
// add end
if(navigator.userAgent.match(/MSIE 6/i))
{
toastWrapAll.css({top: document.documentElement.scrollTop});
}
if(!localSettings.sticky)
{
setTimeout(function()
{
$().toastmessage('removeToast', toastItemInner, localSettings);
},
localSettings.stayTime);
}
return toastItemInner;
},
showNoticeToast : function (message)
{
var options = {text : message, type : 'notice'};
return $().toastmessage('showToast', options);
},
showSuccessToast : function (message)
{
var options = {text : message, type : 'success'};
return $().toastmessage('showToast', options);
},
showErrorToast : function (message)
{
var options = {text : message, type : 'error'};
return $().toastmessage('showToast', options);
},
showWarningToast : function (message)
{
var options = {text : message, type : 'warning'};
return $().toastmessage('showToast', options);
},
removeToast: function(obj, options)
{
obj.animate({opacity: '0'}, 600, function()
{
obj.parent().animate({height: '0px'}, 300, function()
{
obj.parent().remove();
});
});
// callback
if (options && options.close !== null)
{
options.close();
}
}
};
$.fn.toastmessage = function( method ) {
// Method calling logic
if ( methods[method] ) {
return methods[ method ].apply( this, Array.prototype.slice.call( arguments, 1 ));
} else if ( typeof method === 'object' || ! method ) {
return methods.init.apply( this, arguments );
} else {
$.error( 'Method ' + method + ' does not exist on jQuery.toastmessage' );
}
};
})(jQuery);
/*!
* Autogrow Textarea Plugin Version v2.0
* http://www.technoreply.com/autogrow-textarea-plugin-version-2-0
*
* Copyright 2011, Jevin O. Sewaruth
*
* Date: March 13, 2011
*/
jQuery.fn.autoGrow = function(){
return this.each(function(){
// Variables
var colsDefault = this.cols;
var rowsDefault = this.rows;
//Functions
var grow = function() {
growByRef(this);
}
var growByRef = function(obj) {
var linesCount = 0;
var lines = obj.value.split('\n');
for (var i=lines.length-1; i>=0; --i)
{
linesCount += Math.floor((lines[i].length / colsDefault) + 1);
}
if (linesCount >= rowsDefault)
obj.rows = linesCount;
else
obj.rows = rowsDefault;
}
var characterWidth = function (obj){
var characterWidth = 0;
var temp1 = 0;
var temp2 = 0;
var tempCols = obj.cols;
obj.cols = 1;
temp1 = obj.offsetWidth;
obj.cols = 2;
temp2 = obj.offsetWidth;
characterWidth = temp2 - temp1;
obj.cols = tempCols;
return characterWidth;
}
// Manipulations
this.style.width = "auto";
this.style.height = "auto";
this.style.overflow = "hidden";
this.style.width = ((characterWidth(this) * this.cols) + 6) + "px";
this.onkeyup = grow;
this.onfocus = grow;
this.onblur = grow;
growByRef(this);
});
};
/*
Watermark plugin for jQuery
Version: 3.1.3
http://jquery-watermark.googlecode.com/
Copyright (c) 2009-2011 Todd Northrop
http://www.speednet.biz/
March 22, 2011
Requires: jQuery 1.2.3+
Dual licensed under the MIT or GPL Version 2 licenses.
See mit-license.txt and gpl2-license.txt in the project root for details.
------------------------------------------------------*/
(function ($, window, undefined) {
var
// String constants for data names
dataFlag = "watermark",
dataClass = "watermarkClass",
dataFocus = "watermarkFocus",
dataFormSubmit = "watermarkSubmit",
dataMaxLen = "watermarkMaxLength",
dataPassword = "watermarkPassword",
dataText = "watermarkText",
// Copy of native jQuery regex use to strip return characters from element value
rreturn = /\r/g,
// Includes only elements with watermark defined
selWatermarkDefined = "input:data(" + dataFlag + "),textarea:data(" + dataFlag + ")",
// Includes only elements capable of having watermark
selWatermarkAble = "input:text,input:password,input[type=search],input:not([type]),textarea",
// triggerFns:
// Array of function names to look for in the global namespace.
// Any such functions found will be hijacked to trigger a call to
// hideAll() any time they are called. The default value is the
// ASP.NET function that validates the controls on the page
// prior to a postback.
//
// Am I missing other important trigger function(s) to look for?
// Please leave me feedback:
// http://code.google.com/p/jquery-watermark/issues/list
triggerFns = [
"Page_ClientValidate"
],
// Holds a value of true if a watermark was displayed since the last
// hideAll() was executed. Avoids repeatedly calling hideAll().
pageDirty = false,
// Detects if the browser can handle native placeholders
hasNativePlaceholder = ("placeholder" in document.createElement("input"));
// Best practice: this plugin adds only one method to the jQuery object.
// Also ensures that the watermark code is only added once.
$.watermark = $.watermark || {
// Current version number of the plugin
version: "3.1.3",
runOnce: true,
// Default options used when watermarks are instantiated.
// Can be changed to affect the default behavior for all
// new or updated watermarks.
options: {
// Default class name for all watermarks
className: "watermark",
// If true, plugin will detect and use native browser support for
// watermarks, if available. (e.g., WebKit's placeholder attribute.)
useNative: true,
// If true, all watermarks will be hidden during the window's
// beforeunload event. This is done mainly because WebKit
// browsers remember the watermark text during navigation
// and try to restore the watermark text after the user clicks
// the Back button. We can avoid this by hiding the text before
// the browser has a chance to save it. The regular unload event
// was tried, but it seems the browser saves the text before
// that event kicks off, because it didn't work.
hideBeforeUnload: true
},
// Hide one or more watermarks by specifying any selector type
// i.e., DOM element, string selector, jQuery matched set, etc.
hide: function (selector) {
$(selector).filter(selWatermarkDefined).each(
function () {
$.watermark._hide($(this));
}
);
},
// Internal use only.
_hide: function ($input, focus) {
var elem = $input[0],
inputVal = (elem.value || "").replace(rreturn, ""),
inputWm = $input.data(dataText) || "",
maxLen = $input.data(dataMaxLen) || 0,
className = $input.data(dataClass);
if ((inputWm.length) && (inputVal == inputWm)) {
elem.value = "";
// Password type?
if ($input.data(dataPassword)) {
if (($input.attr("type") || "") === "text") {
var $pwd = $input.data(dataPassword) || [],
$wrap = $input.parent() || [];
if (($pwd.length) && ($wrap.length)) {
$wrap[0].removeChild($input[0]); // Can't use jQuery methods, because they destroy data
$wrap[0].appendChild($pwd[0]);
$input = $pwd;
}
}
}
if (maxLen) {
$input.attr("maxLength", maxLen);
$input.removeData(dataMaxLen);
}
if (focus) {
$input.attr("autocomplete", "off"); // Avoid NS_ERROR_XPC_JS_THREW_STRING error in Firefox
window.setTimeout(
function () {
$input.select(); // Fix missing cursor in IE
}
, 1);
}
}
className && $input.removeClass(className);
},
// Display one or more watermarks by specifying any selector type
// i.e., DOM element, string selector, jQuery matched set, etc.
// If conditions are not right for displaying a watermark, ensures that watermark is not shown.
show: function (selector) {
$(selector).filter(selWatermarkDefined).each(
function () {
$.watermark._show($(this));
}
);
},
// Internal use only.
_show: function ($input) {
var elem = $input[0],
val = (elem.value || "").replace(rreturn, ""),
text = $input.data(dataText) || "",
type = $input.attr("type") || "",
className = $input.data(dataClass);
if (((val.length == 0) || (val == text)) && (!$input.data(dataFocus))) {
pageDirty = true;
// Password type?
if ($input.data(dataPassword)) {
if (type === "password") {
var $pwd = $input.data(dataPassword) || [],
$wrap = $input.parent() || [];
if (($pwd.length) && ($wrap.length)) {
$wrap[0].removeChild($input[0]); // Can't use jQuery methods, because they destroy data
$wrap[0].appendChild($pwd[0]);
$input = $pwd;
$input.attr("maxLength", text.length);
elem = $input[0];
}
}
}
// Ensure maxLength big enough to hold watermark (input of type="text" or type="search" only)
if ((type === "text") || (type === "search")) {
var maxLen = $input.attr("maxLength") || 0;
if ((maxLen > 0) && (text.length > maxLen)) {
$input.data(dataMaxLen, maxLen);
$input.attr("maxLength", text.length);
}
}
className && $input.addClass(className);
elem.value = text;
}
else {
$.watermark._hide($input);
}
},
// Hides all watermarks on the current page.
hideAll: function () {
if (pageDirty) {
$.watermark.hide(selWatermarkAble);
pageDirty = false;
}
},
// Displays all watermarks on the current page.
showAll: function () {
$.watermark.show(selWatermarkAble);
}
};
$.fn.watermark = $.fn.watermark || function (text, options) {
///
/// Set watermark text and class name on all input elements of type="text/password/search" and
/// textareas within the matched set. If className is not specified in options, the default is
/// "watermark". Within the matched set, only input elements with type="text/password/search"
/// and textareas are affected; all other elements are ignored.
///
///
/// Returns the original jQuery matched set (not just the input and texarea elements).
///
///
/// Text to display as a watermark when the input or textarea element has an empty value and does not
/// have focus. The first time watermark() is called on an element, if this argument is empty (or not
/// a String type), then the watermark will have the net effect of only changing the class name when
/// the input or textarea element's value is empty and it does not have focus.
///
///
/// Provides the ability to override the default watermark options ($.watermark.options). For backward
/// compatibility, if a string value is supplied, it is used as the class name that overrides the class
/// name in $.watermark.options.className. Properties include:
/// className: When the watermark is visible, the element will be styled using this class name.
/// useNative (Boolean or Function): Specifies if native browser support for watermarks will supersede
/// plugin functionality. If useNative is a function, the return value from the function will
/// determine if native support is used. The function is passed one argument -- a jQuery object
/// containing the element being tested as the only element in its matched set -- and the DOM
/// element being tested is the object on which the function is invoked (the value of "this").
///
///
/// The effect of changing the text and class name on an input element is called a watermark because
/// typically light gray text is used to provide a hint as to what type of input is required. However,
/// the appearance of the watermark can be something completely different: simply change the CSS style
/// pertaining to the supplied class name.
///
/// The first time watermark() is called on an element, the watermark text and class name are initialized,
/// and the focus and blur events are hooked in order to control the display of the watermark. Also, as
/// of version 3.0, drag and drop events are hooked to guard against dropped text being appended to the
/// watermark. If native watermark support is provided by the browser, it is detected and used, unless
/// the useNative option is set to false.
///
/// Subsequently, watermark() can be called again on an element in order to change the watermark text
/// and/or class name, and it can also be called without any arguments in order to refresh the display.
///
/// For example, after changing the value of the input or textarea element programmatically, watermark()
/// should be called without any arguments to refresh the display, because the change event is only
/// triggered by user actions, not by programmatic changes to an input or textarea element's value.
///
/// The one exception to programmatic updates is for password input elements: you are strongly cautioned
/// against changing the value of a password input element programmatically (after the page loads).
/// The reason is that some fairly hairy code is required behind the scenes to make the watermarks bypass
/// IE security and switch back and forth between clear text (for watermarks) and obscured text (for
/// passwords). It is *possible* to make programmatic changes, but it must be done in a certain way, and
/// overall it is not recommended.
///
if (!this.length) {
return this;
}
var hasClass = false,
hasText = (typeof(text) === "string");
if (hasText) {
text = text.replace(rreturn, "");
}
if (typeof(options) === "object") {
hasClass = (typeof(options.className) === "string");
options = $.extend({}, $.watermark.options, options);
}
else if (typeof(options) === "string") {
hasClass = true;
options = $.extend({}, $.watermark.options, {className: options});
}
else {
options = $.watermark.options;
}
if (typeof(options.useNative) !== "function") {
options.useNative = options.useNative? function () { return true; } : function () { return false; };
}
return this.each(
function () {
var $input = $(this);
if (!$input.is(selWatermarkAble)) {
return;
}
// Watermark already initialized?
if ($input.data(dataFlag)) {
// If re-defining text or class, first remove existing watermark, then make changes
if (hasText || hasClass) {
$.watermark._hide($input);
if (hasText) {
$input.data(dataText, text);
}
if (hasClass) {
$input.data(dataClass, options.className);
}
}
}
else {
// Detect and use native browser support, if enabled in options
if (
(hasNativePlaceholder)
&& (options.useNative.call(this, $input))
&& (($input.attr("tagName") || "") !== "TEXTAREA")
) {
// className is not set because current placeholder standard doesn't
// have a separate class name property for placeholders (watermarks).
if (hasText) {
$input.attr("placeholder", text);
}
// Only set data flag for non-native watermarks
// [purposely commented-out] -> $input.data(dataFlag, 1);
return;
}
$input.data(dataText, hasText? text : "");
$input.data(dataClass, options.className);
$input.data(dataFlag, 1); // Flag indicates watermark was initialized
// Special processing for password type
if (($input.attr("type") || "") === "password") {
var $wrap = $input.wrap("").parent(),
$wm = $($wrap.html().replace(/type=["']?password["']?/i, 'type="text"'));
$wm.data(dataText, $input.data(dataText));
$wm.data(dataClass, $input.data(dataClass));
$wm.data(dataFlag, 1);
$wm.attr("maxLength", text.length);
$wm.focus(
function () {
$.watermark._hide($wm, true);
}
).bind("dragenter",
function () {
$.watermark._hide($wm);
}
).bind("dragend",
function () {
window.setTimeout(function () { $wm.blur(); }, 1);
}
);
$input.blur(
function () {
$.watermark._show($input);
}
).bind("dragleave",
function () {
$.watermark._show($input);
}
);
$wm.data(dataPassword, $input);
$input.data(dataPassword, $wm);
}
else {
$input.focus(
function () {
$input.data(dataFocus, 1);
$.watermark._hide($input, true);
}
).blur(
function () {
$input.data(dataFocus, 0);
$.watermark._show($input);
}
).bind("dragenter",
function () {
$.watermark._hide($input);
}
).bind("dragleave",
function () {
$.watermark._show($input);
}
).bind("dragend",
function () {
window.setTimeout(function () { $.watermark._show($input); }, 1);
}
).bind("drop",
// Firefox makes this lovely function necessary because the dropped text
// is merged with the watermark before the drop event is called.
function (evt) {
var elem = $input[0],
dropText = evt.originalEvent.dataTransfer.getData("Text");
if ((elem.value || "").replace(rreturn, "").replace(dropText, "") === $input.data(dataText)) {
elem.value = dropText;
}
$input.focus();
}
);
}
// In order to reliably clear all watermarks before form submission,
// we need to replace the form's submit function with our own
// function. Otherwise watermarks won't be cleared when the form
// is submitted programmatically.
if (this.form) {
var form = this.form,
$form = $(form);
if (!$form.data(dataFormSubmit)) {
$form.submit($.watermark.hideAll);
// form.submit exists for all browsers except Google Chrome
// (see "else" below for explanation)
if (form.submit) {
$form.data(dataFormSubmit, form.submit);
form.submit = (function (f, $f) {
return function () {
var nativeSubmit = $f.data(dataFormSubmit);
$.watermark.hideAll();
if (nativeSubmit.apply) {
nativeSubmit.apply(f, Array.prototype.slice.call(arguments));
}
else {
nativeSubmit();
}
};
})(form, $form);
}
else {
$form.data(dataFormSubmit, 1);
// This strangeness is due to the fact that Google Chrome's
// form.submit function is not visible to JavaScript (identifies
// as "undefined"). I had to invent a solution here because hours
// of Googling (ironically) for an answer did not turn up anything
// useful. Within my own form.submit function I delete the form's
// submit function, and then call the non-existent function --
// which, in the world of Google Chrome, still exists.
form.submit = (function (f) {
return function () {
$.watermark.hideAll();
delete f.submit;
f.submit();
};
})(form);
}
}
}
}
$.watermark._show($input);
}
);
};
// The code included within the following if structure is guaranteed to only run once,
// even if the watermark script file is included multiple times in the page.
if ($.watermark.runOnce) {
$.watermark.runOnce = false;
$.extend($.expr[":"], {
// Extends jQuery with a custom selector - ":data(...)"
// :data() Includes elements that have a specific name defined in the jQuery data
// collection. (Only the existence of the name is checked; the value is ignored.)
// A more sophisticated version of the :data() custom selector originally part of this plugin
// was removed for compatibility with jQuery UI. The original code can be found in the SVN
// source listing in the file, "jquery.data.js".
data: function( elem, i, match ) {
return !!$.data( elem, match[ 3 ] );
}
});
// Overloads the jQuery .val() function to return the underlying input value on
// watermarked input elements. When .val() is being used to set values, this
// function ensures watermarks are properly set/removed after the values are set.
// Uses self-executing function to override the default jQuery function.
(function (valOld) {
$.fn.val = function () {
// Best practice: return immediately if empty matched set
if ( !this.length ) {
return arguments.length? this : undefined;
}
// If no args, then we're getting the value of the first element;
// otherwise we're setting values for all elements in matched set
if ( !arguments.length ) {
// If element is watermarked, get the underlying value;
// otherwise use native jQuery .val()
if ( this.data(dataFlag) ) {
var v = (this[0].value || "").replace(rreturn, "");
return (v === (this.data(dataText) || ""))? "" : v;
}
else {
return valOld.apply( this, arguments );
}
}
else {
valOld.apply( this, arguments );
$.watermark.show(this);
return this;
}
};
})($.fn.val);
// Hijack any functions found in the triggerFns list
if (triggerFns.length) {
// Wait until DOM is ready before searching
$(function () {
var i, name, fn;
for (i=triggerFns.length-1; i>=0; i--) {
name = triggerFns[i];
fn = window[name];
if (typeof(fn) === "function") {
window[name] = (function (origFn) {
return function () {
$.watermark.hideAll();
return origFn.apply(null, Array.prototype.slice.call(arguments));
};
})(fn);
}
}
});
}
$(window).bind("beforeunload", function () {
if ($.watermark.options.hideBeforeUnload) {
$.watermark.hideAll();
}
});
}
})(jQuery, window);
/**
* jQuery.ScrollTo
* Copyright (c) 2007-2009 Ariel Flesler - aflesler(at)gmail(dot)com | http://flesler.blogspot.com
* Dual licensed under MIT and GPL.
* Date: 5/25/2009
*
* @projectDescription Easy element scrolling using jQuery.
* http://flesler.blogspot.com/2007/10/jqueryscrollto.html
* Works with jQuery +1.2.6. Tested on FF 2/3, IE 6/7/8, Opera 9.5/6, Safari 3, Chrome 1 on WinXP.
*
* @author Ariel Flesler
* @version 1.4.2
*
* @id jQuery.scrollTo
* @id jQuery.fn.scrollTo
* @param {String, Number, DOMElement, jQuery, Object} target Where to scroll the matched elements.
* The different options for target are:
* - A number position (will be applied to all axes).
* - A string position ('44', '100px', '+=90', etc ) will be applied to all axes
* - A jQuery/DOM element ( logically, child of the element to scroll )
* - A string selector, that will be relative to the element to scroll ( 'li:eq(2)', etc )
* - A hash { top:x, left:y }, x and y can be any kind of number/string like above.
* - A percentage of the container's dimension/s, for example: 50% to go to the middle.
* - The string 'max' for go-to-end.
* @param {Number} duration The OVERALL length of the animation, this argument can be the settings object instead.
* @param {Object,Function} settings Optional set of settings or the onAfter callback.
* @option {String} axis Which axis must be scrolled, use 'x', 'y', 'xy' or 'yx'.
* @option {Number} duration The OVERALL length of the animation.
* @option {String} easing The easing method for the animation.
* @option {Boolean} margin If true, the margin of the target element will be deducted from the final position.
* @option {Object, Number} offset Add/deduct from the end position. One number for both axes or { top:x, left:y }.
* @option {Object, Number} over Add/deduct the height/width multiplied by 'over', can be { top:x, left:y } when using both axes.
* @option {Boolean} queue If true, and both axis are given, the 2nd axis will only be animated after the first one ends.
* @option {Function} onAfter Function to be called after the scrolling ends.
* @option {Function} onAfterFirst If queuing is activated, this function will be called after the first scrolling ends.
* @return {jQuery} Returns the same jQuery object, for chaining.
*
* @desc Scroll to a fixed position
* @example $('div').scrollTo( 340 );
*
* @desc Scroll relatively to the actual position
* @example $('div').scrollTo( '+=340px', { axis:'y' } );
*
* @dec Scroll using a selector (relative to the scrolled element)
* @example $('div').scrollTo( 'p.paragraph:eq(2)', 500, { easing:'swing', queue:true, axis:'xy' } );
*
* @ Scroll to a DOM element (same for jQuery object)
* @example var second_child = document.getElementById('container').firstChild.nextSibling;
* $('#container').scrollTo( second_child, { duration:500, axis:'x', onAfter:function(){
* alert('scrolled!!');
* }});
*
* @desc Scroll on both axes, to different values
* @example $('div').scrollTo( { top: 300, left:'+=200' }, { axis:'xy', offset:-20 } );
*/
;(function( $ ){
var $scrollTo = $.scrollTo = function( target, duration, settings ){
$(window).scrollTo( target, duration, settings );
};
$scrollTo.defaults = {
axis:'xy',
duration: parseFloat($.fn.jquery) >= 1.3 ? 0 : 1
};
// Returns the element that needs to be animated to scroll the window.
// Kept for backwards compatibility (specially for localScroll & serialScroll)
$scrollTo.window = function( scope ){
return $(window)._scrollable();
};
// Hack, hack, hack :)
// Returns the real elements to scroll (supports window/iframes, documents and regular nodes)
$.fn._scrollable = function(){
return this.map(function(){
var elem = this,
isWin = !elem.nodeName || $.inArray( elem.nodeName.toLowerCase(), ['iframe','#document','html','body'] ) != -1;
if( !isWin )
return elem;
var doc = (elem.contentWindow || elem).document || elem.ownerDocument || elem;
return $.browser.safari || doc.compatMode == 'BackCompat' ?
doc.body :
doc.documentElement;
});
};
$.fn.scrollTo = function( target, duration, settings ){
if( typeof duration == 'object' ){
settings = duration;
duration = 0;
}
if( typeof settings == 'function' )
settings = { onAfter:settings };
if( target == 'max' )
target = 9e9;
settings = $.extend( {}, $scrollTo.defaults, settings );
// Speed is still recognized for backwards compatibility
duration = duration || settings.speed || settings.duration;
// Make sure the settings are given right
settings.queue = settings.queue && settings.axis.length > 1;
if( settings.queue )
// Let's keep the overall duration
duration /= 2;
settings.offset = both( settings.offset );
settings.over = both( settings.over );
return this._scrollable().each(function(){
var elem = this,
$elem = $(elem),
targ = target, toff, attr = {},
win = $elem.is('html,body');
switch( typeof targ ){
// A number will pass the regex
case 'number':
case 'string':
if( /^([+-]=)?\d+(\.\d+)?(px|%)?$/.test(targ) ){
targ = both( targ );
// We are done
break;
}
// Relative selector, no break!
targ = $(targ,this);
case 'object':
// DOMElement / jQuery
if( targ.is || targ.style )
// Get the real position of the target
toff = (targ = $(targ)).offset();
}
$.each( settings.axis.split(''), function( i, axis ){
var Pos = axis == 'x' ? 'Left' : 'Top',
pos = Pos.toLowerCase(),
key = 'scroll' + Pos,
old = elem[key],
max = $scrollTo.max(elem, axis);
if( toff ){// jQuery / DOMElement
attr[key] = toff[pos] + ( win ? 0 : old - $elem.offset()[pos] );
// If it's a dom element, reduce the margin
if( settings.margin ){
attr[key] -= parseInt(targ.css('margin'+Pos)) || 0;
attr[key] -= parseInt(targ.css('border'+Pos+'Width')) || 0;
}
attr[key] += settings.offset[pos] || 0;
if( settings.over[pos] )
// Scroll to a fraction of its width/height
attr[key] += targ[axis=='x'?'width':'height']() * settings.over[pos];
}else{
var val = targ[pos];
// Handle percentage values
attr[key] = val.slice && val.slice(-1) == '%' ?
parseFloat(val) / 100 * max
: val;
}
// Number or 'number'
if( /^\d+$/.test(attr[key]) )
// Check the limits
attr[key] = attr[key] <= 0 ? 0 : Math.min( attr[key], max );
// Queueing axes
if( !i && settings.queue ){
// Don't waste time animating, if there's no need.
if( old != attr[key] )
// Intermediate animation
animate( settings.onAfterFirst );
// Don't animate this axis again in the next iteration.
delete attr[key];
}
});
animate( settings.onAfter );
function animate( callback ){
$elem.animate( attr, duration, settings.easing, callback && function(){
callback.call(this, target, settings);
});
};
}).end();
};
// Max scrolling position, works on quirks mode
// It only fails (not too badly) on IE, quirks mode.
$scrollTo.max = function( elem, axis ){
var Dim = axis == 'x' ? 'Width' : 'Height',
scroll = 'scroll'+Dim;
if( !$(elem).is('html,body') )
return elem[scroll] - $(elem)[Dim.toLowerCase()]();
var size = 'client' + Dim,
html = elem.ownerDocument.documentElement,
body = elem.ownerDocument.body;
return Math.max( html[scroll], body[scroll] )
- Math.min( html[size] , body[size] );
};
function both( val ){
return typeof val == 'object' ? val : { top:val, left:val };
};
})( jQuery );
/*!
* jQuery Form Plugin
* version: 2.83 (11-JUL-2011)
* @requires jQuery v1.3.2 or later
*
* Examples and documentation at: http://malsup.com/jquery/form/
* Dual licensed under the MIT and GPL licenses:
* http://www.opensource.org/licenses/mit-license.php
* http://www.gnu.org/licenses/gpl.html
*/
;(function($) {
/*
Usage Note:
-----------
Do not use both ajaxSubmit and ajaxForm on the same form. These
functions are intended to be exclusive. Use ajaxSubmit if you want
to bind your own submit handler to the form. For example,
$(document).ready(function() {
$('#myForm').bind('submit', function(e) {
e.preventDefault(); // <-- important
$(this).ajaxSubmit({
target: '#output'
});
});
});
Use ajaxForm when you want the plugin to manage all the event binding
for you. For example,
$(document).ready(function() {
$('#myForm').ajaxForm({
target: '#output'
});
});
When using ajaxForm, the ajaxSubmit function will be invoked for you
at the appropriate time.
*/
/**
* ajaxSubmit() provides a mechanism for immediately submitting
* an HTML form using AJAX.
*/
$.fn.ajaxSubmit = function(options) {
// fast fail if nothing selected (http://dev.jquery.com/ticket/2752)
if (!this.length) {
log('ajaxSubmit: skipping submit process - no element selected');
return this;
}
var method, action, url, $form = this;
if (typeof options == 'function') {
options = { success: options };
}
method = this.attr('method');
action = this.attr('action');
url = (typeof action === 'string') ? $.trim(action) : '';
url = url || window.location.href || '';
if (url) {
// clean url (don't include hash vaue)
url = (url.match(/^([^#]+)/)||[])[1];
}
options = $.extend(true, {
url: url,
success: $.ajaxSettings.success,
type: method || 'GET',
iframeSrc: /^https/i.test(window.location.href || '') ? 'javascript:false' : 'about:blank'
}, options);
// hook for manipulating the form data before it is extracted;
// convenient for use with rich editors like tinyMCE or FCKEditor
var veto = {};
this.trigger('form-pre-serialize', [this, options, veto]);
if (veto.veto) {
log('ajaxSubmit: submit vetoed via form-pre-serialize trigger');
return this;
}
// provide opportunity to alter form data before it is serialized
if (options.beforeSerialize && options.beforeSerialize(this, options) === false) {
log('ajaxSubmit: submit aborted via beforeSerialize callback');
return this;
}
var n,v,a = this.formToArray(options.semantic);
if (options.data) {
options.extraData = options.data;
for (n in options.data) {
if(options.data[n] instanceof Array) {
for (var k in options.data[n]) {
a.push( { name: n, value: options.data[n][k] } );
}
}
else {
v = options.data[n];
v = $.isFunction(v) ? v() : v; // if value is fn, invoke it
a.push( { name: n, value: v } );
}
}
}
// give pre-submit callback an opportunity to abort the submit
if (options.beforeSubmit && options.beforeSubmit(a, this, options) === false) {
log('ajaxSubmit: submit aborted via beforeSubmit callback');
return this;
}
// fire vetoable 'validate' event
this.trigger('form-submit-validate', [a, this, options, veto]);
if (veto.veto) {
log('ajaxSubmit: submit vetoed via form-submit-validate trigger');
return this;
}
var q = $.param(a);
if (options.type.toUpperCase() == 'GET') {
options.url += (options.url.indexOf('?') >= 0 ? '&' : '?') + q;
options.data = null; // data is null for 'get'
}
else {
options.data = q; // data is the query string for 'post'
}
var callbacks = [];
if (options.resetForm) {
callbacks.push(function() { $form.resetForm(); });
}
if (options.clearForm) {
callbacks.push(function() { $form.clearForm(); });
}
// perform a load on the target only if dataType is not provided
if (!options.dataType && options.target) {
var oldSuccess = options.success || function(){};
callbacks.push(function(data) {
var fn = options.replaceTarget ? 'replaceWith' : 'html';
$(options.target)[fn](data).each(oldSuccess, arguments);
});
}
else if (options.success) {
callbacks.push(options.success);
}
options.success = function(data, status, xhr) { // jQuery 1.4+ passes xhr as 3rd arg
var context = options.context || options; // jQuery 1.4+ supports scope context
for (var i=0, max=callbacks.length; i < max; i++) {
callbacks[i].apply(context, [data, status, xhr || $form, $form]);
}
};
// are there files to upload?
var fileInputs = $('input:file', this).length > 0;
var mp = 'multipart/form-data';
var multipart = ($form.attr('enctype') == mp || $form.attr('encoding') == mp);
// options.iframe allows user to force iframe mode
// 06-NOV-09: now defaulting to iframe mode if file input is detected
if (options.iframe !== false && (fileInputs || options.iframe || multipart)) {
// hack to fix Safari hang (thanks to Tim Molendijk for this)
// see: http://groups.google.com/group/jquery-dev/browse_thread/thread/36395b7ab510dd5d
if (options.closeKeepAlive) {
$.get(options.closeKeepAlive, function() { fileUpload(a); });
}
else {
fileUpload(a);
}
}
else {
// IE7 massage (see issue 57)
if ($.browser.msie && method == 'get') {
var ieMeth = $form[0].getAttribute('method');
if (typeof ieMeth === 'string')
options.type = ieMeth;
}
$.ajax(options);
}
// fire 'notify' event
this.trigger('form-submit-notify', [this, options]);
return this;
// private function for handling file uploads (hat tip to YAHOO!)
function fileUpload(a) {
var form = $form[0], el, i, s, g, id, $io, io, xhr, sub, n, timedOut, timeoutHandle;
var useProp = !!$.fn.prop;
if (a) {
// ensure that every serialized input is still enabled
for (i=0; i < a.length; i++) {
el = $(form[a[i].name]);
el[ useProp ? 'prop' : 'attr' ]('disabled', false);
}
}
if ($(':input[name=submit],:input[id=submit]', form).length) {
// if there is an input with a name or id of 'submit' then we won't be
// able to invoke the submit fn on the form (at least not x-browser)
alert('Error: Form elements must not have name or id of "submit".');
return;
}
s = $.extend(true, {}, $.ajaxSettings, options);
s.context = s.context || s;
id = 'jqFormIO' + (new Date().getTime());
if (s.iframeTarget) {
$io = $(s.iframeTarget);
n = $io.attr('name');
if (n == null)
$io.attr('name', id);
else
id = n;
}
else {
$io = $('');
$io.css({ position: 'absolute', top: '-1000px', left: '-1000px' });
}
io = $io[0];
xhr = { // mock object
aborted: 0,
responseText: null,
responseXML: null,
status: 0,
statusText: 'n/a',
getAllResponseHeaders: function() {},
getResponseHeader: function() {},
setRequestHeader: function() {},
abort: function(status) {
var e = (status === 'timeout' ? 'timeout' : 'aborted');
log('aborting upload... ' + e);
this.aborted = 1;
$io.attr('src', s.iframeSrc); // abort op in progress
xhr.error = e;
s.error && s.error.call(s.context, xhr, e, status);
g && $.event.trigger("ajaxError", [xhr, s, e]);
s.complete && s.complete.call(s.context, xhr, e);
}
};
g = s.global;
// trigger ajax global events so that activity/block indicators work like normal
if (g && ! $.active++) {
$.event.trigger("ajaxStart");
}
if (g) {
$.event.trigger("ajaxSend", [xhr, s]);
}
if (s.beforeSend && s.beforeSend.call(s.context, xhr, s) === false) {
if (s.global) {
$.active--;
}
return;
}
if (xhr.aborted) {
return;
}
// add submitting element to data if we know it
sub = form.clk;
if (sub) {
n = sub.name;
if (n && !sub.disabled) {
s.extraData = s.extraData || {};
s.extraData[n] = sub.value;
if (sub.type == "image") {
s.extraData[n+'.x'] = form.clk_x;
s.extraData[n+'.y'] = form.clk_y;
}
}
}
var CLIENT_TIMEOUT_ABORT = 1;
var SERVER_ABORT = 2;
function getDoc(frame) {
var doc = frame.contentWindow ? frame.contentWindow.document : frame.contentDocument ? frame.contentDocument : frame.document;
return doc;
}
// take a breath so that pending repaints get some cpu time before the upload starts
function doSubmit() {
// make sure form attrs are set
var t = $form.attr('target'), a = $form.attr('action');
// update form attrs in IE friendly way
form.setAttribute('target',id);
if (!method) {
form.setAttribute('method', 'POST');
}
if (a != s.url) {
form.setAttribute('action', s.url);
}
// ie borks in some cases when setting encoding
if (! s.skipEncodingOverride && (!method || /post/i.test(method))) {
$form.attr({
encoding: 'multipart/form-data',
enctype: 'multipart/form-data'
});
}
// support timout
if (s.timeout) {
timeoutHandle = setTimeout(function() { timedOut = true; cb(CLIENT_TIMEOUT_ABORT); }, s.timeout);
}
// look for server aborts
function checkState() {
try {
var state = getDoc(io).readyState;
log('state = ' + state);
if (state.toLowerCase() == 'uninitialized')
setTimeout(checkState,50);
}
catch(e) {
log('Server abort: ' , e, ' (', e.name, ')');
cb(SERVER_ABORT);
timeoutHandle && clearTimeout(timeoutHandle);
timeoutHandle = undefined;
}
}
// add "extra" data to form if provided in options
var extraInputs = [];
try {
if (s.extraData) {
for (var n in s.extraData) {
extraInputs.push(
$('').attr('value',s.extraData[n])
.appendTo(form)[0]);
}
}
if (!s.iframeTarget) {
// add iframe to doc and submit the form
$io.appendTo('body');
io.attachEvent ? io.attachEvent('onload', cb) : io.addEventListener('load', cb, false);
}
setTimeout(checkState,15);
form.submit();
}
finally {
// reset attrs and remove "extra" input elements
form.setAttribute('action',a);
if(t) {
form.setAttribute('target', t);
} else {
$form.removeAttr('target');
}
$(extraInputs).remove();
}
}
if (s.forceSync) {
doSubmit();
}
else {
setTimeout(doSubmit, 10); // this lets dom updates render
}
var data, doc, domCheckCount = 50, callbackProcessed;
function cb(e) {
if (xhr.aborted || callbackProcessed) {
return;
}
try {
doc = getDoc(io);
}
catch(ex) {
log('cannot access response document: ', ex);
e = SERVER_ABORT;
}
if (e === CLIENT_TIMEOUT_ABORT && xhr) {
xhr.abort('timeout');
return;
}
else if (e == SERVER_ABORT && xhr) {
xhr.abort('server abort');
return;
}
if (!doc || doc.location.href == s.iframeSrc) {
// response not received yet
if (!timedOut)
return;
}
io.detachEvent ? io.detachEvent('onload', cb) : io.removeEventListener('load', cb, false);
var status = 'success', errMsg;
try {
if (timedOut) {
throw 'timeout';
}
var isXml = s.dataType == 'xml' || doc.XMLDocument || $.isXMLDoc(doc);
log('isXml='+isXml);
if (!isXml && window.opera && (doc.body == null || doc.body.innerHTML == '')) {
if (--domCheckCount) {
// in some browsers (Opera) the iframe DOM is not always traversable when
// the onload callback fires, so we loop a bit to accommodate
log('requeing onLoad callback, DOM not available');
setTimeout(cb, 250);
return;
}
// let this fall through because server response could be an empty document
//log('Could not access iframe DOM after mutiple tries.');
//throw 'DOMException: not available';
}
//log('response detected');
var docRoot = doc.body ? doc.body : doc.documentElement;
xhr.responseText = docRoot ? docRoot.innerHTML : null;
xhr.responseXML = doc.XMLDocument ? doc.XMLDocument : doc;
if (isXml)
s.dataType = 'xml';
xhr.getResponseHeader = function(header){
var headers = {'content-type': s.dataType};
return headers[header];
};
// support for XHR 'status' & 'statusText' emulation :
if (docRoot) {
xhr.status = Number( docRoot.getAttribute('status') ) || xhr.status;
xhr.statusText = docRoot.getAttribute('statusText') || xhr.statusText;
}
var dt = s.dataType || '';
var scr = /(json|script|text)/.test(dt.toLowerCase());
if (scr || s.textarea) {
// see if user embedded response in textarea
var ta = doc.getElementsByTagName('textarea')[0];
if (ta) {
xhr.responseText = ta.value;
// support for XHR 'status' & 'statusText' emulation :
xhr.status = Number( ta.getAttribute('status') ) || xhr.status;
xhr.statusText = ta.getAttribute('statusText') || xhr.statusText;
}
else if (scr) {
// account for browsers injecting pre around json response
var pre = doc.getElementsByTagName('pre')[0];
var b = doc.getElementsByTagName('body')[0];
if (pre) {
xhr.responseText = pre.textContent ? pre.textContent : pre.innerHTML;
}
else if (b) {
xhr.responseText = b.innerHTML;
}
}
}
else if (s.dataType == 'xml' && !xhr.responseXML && xhr.responseText != null) {
xhr.responseXML = toXml(xhr.responseText);
}
try {
data = httpData(xhr, s.dataType, s);
}
catch (e) {
status = 'parsererror';
xhr.error = errMsg = (e || status);
}
}
catch (e) {
log('error caught: ',e);
status = 'error';
xhr.error = errMsg = (e || status);
}
if (xhr.aborted) {
log('upload aborted');
status = null;
}
if (xhr.status) { // we've set xhr.status
status = (xhr.status >= 200 && xhr.status < 300 || xhr.status === 304) ? 'success' : 'error';
}
// ordering of these callbacks/triggers is odd, but that's how $.ajax does it
if (status === 'success') {
s.success && s.success.call(s.context, data, 'success', xhr);
g && $.event.trigger("ajaxSuccess", [xhr, s]);
}
else if (status) {
if (errMsg == undefined)
errMsg = xhr.statusText;
s.error && s.error.call(s.context, xhr, status, errMsg);
g && $.event.trigger("ajaxError", [xhr, s, errMsg]);
}
g && $.event.trigger("ajaxComplete", [xhr, s]);
if (g && ! --$.active) {
$.event.trigger("ajaxStop");
}
s.complete && s.complete.call(s.context, xhr, status);
callbackProcessed = true;
if (s.timeout)
clearTimeout(timeoutHandle);
// clean up
setTimeout(function() {
if (!s.iframeTarget)
$io.remove();
xhr.responseXML = null;
}, 100);
}
var toXml = $.parseXML || function(s, doc) { // use parseXML if available (jQuery 1.5+)
if (window.ActiveXObject) {
doc = new ActiveXObject('Microsoft.XMLDOM');
doc.async = 'false';
doc.loadXML(s);
}
else {
doc = (new DOMParser()).parseFromString(s, 'text/xml');
}
return (doc && doc.documentElement && doc.documentElement.nodeName != 'parsererror') ? doc : null;
};
var parseJSON = $.parseJSON || function(s) {
return window['eval']('(' + s + ')');
};
var httpData = function( xhr, type, s ) { // mostly lifted from jq1.4.4
var ct = xhr.getResponseHeader('content-type') || '',
xml = type === 'xml' || !type && ct.indexOf('xml') >= 0,
data = xml ? xhr.responseXML : xhr.responseText;
if (xml && data.documentElement.nodeName === 'parsererror') {
$.error && $.error('parsererror');
}
if (s && s.dataFilter) {
data = s.dataFilter(data, type);
}
if (typeof data === 'string') {
if (type === 'json' || !type && ct.indexOf('json') >= 0) {
data = parseJSON(data);
} else if (type === "script" || !type && ct.indexOf("javascript") >= 0) {
$.globalEval(data);
}
}
return data;
};
}
};
/**
* ajaxForm() provides a mechanism for fully automating form submission.
*
* The advantages of using this method instead of ajaxSubmit() are:
*
* 1: This method will include coordinates for elements (if the element
* is used to submit the form).
* 2. This method will include the submit element's name/value data (for the element that was
* used to submit the form).
* 3. This method binds the submit() method to the form for you.
*
* The options argument for ajaxForm works exactly as it does for ajaxSubmit. ajaxForm merely
* passes the options argument along after properly binding events for submit elements and
* the form itself.
*/
$.fn.ajaxForm = function(options) {
// in jQuery 1.3+ we can fix mistakes with the ready state
if (this.length === 0) {
var o = { s: this.selector, c: this.context };
if (!$.isReady && o.s) {
log('DOM not ready, queuing ajaxForm');
$(function() {
$(o.s,o.c).ajaxForm(options);
});
return this;
}
// is your DOM ready? http://docs.jquery.com/Tutorials:Introducing_$(document).ready()
log('terminating; zero elements found by selector' + ($.isReady ? '' : ' (DOM not ready)'));
return this;
}
return this.ajaxFormUnbind().bind('submit.form-plugin', function(e) {
if (!e.isDefaultPrevented()) { // if event has been canceled, don't proceed
e.preventDefault();
$(this).ajaxSubmit(options);
}
}).bind('click.form-plugin', function(e) {
var target = e.target;
var $el = $(target);
if (!($el.is(":submit,input:image"))) {
// is this a child element of the submit el? (ex: a span within a button)
var t = $el.closest(':submit');
if (t.length == 0) {
return;
}
target = t[0];
}
var form = this;
form.clk = target;
if (target.type == 'image') {
if (e.offsetX != undefined) {
form.clk_x = e.offsetX;
form.clk_y = e.offsetY;
} else if (typeof $.fn.offset == 'function') { // try to use dimensions plugin
var offset = $el.offset();
form.clk_x = e.pageX - offset.left;
form.clk_y = e.pageY - offset.top;
} else {
form.clk_x = e.pageX - target.offsetLeft;
form.clk_y = e.pageY - target.offsetTop;
}
}
// clear form vars
setTimeout(function() { form.clk = form.clk_x = form.clk_y = null; }, 100);
});
};
// ajaxFormUnbind unbinds the event handlers that were bound by ajaxForm
$.fn.ajaxFormUnbind = function() {
return this.unbind('submit.form-plugin click.form-plugin');
};
/**
* formToArray() gathers form element data into an array of objects that can
* be passed to any of the following ajax functions: $.get, $.post, or load.
* Each object in the array has both a 'name' and 'value' property. An example of
* an array for a simple login form might be:
*
* [ { name: 'username', value: 'jresig' }, { name: 'password', value: 'secret' } ]
*
* It is this array that is passed to pre-submit callback functions provided to the
* ajaxSubmit() and ajaxForm() methods.
*/
$.fn.formToArray = function(semantic) {
var a = [];
if (this.length === 0) {
return a;
}
var form = this[0];
var els = semantic ? form.getElementsByTagName('*') : form.elements;
if (!els) {
return a;
}
var i,j,n,v,el,max,jmax;
for(i=0, max=els.length; i < max; i++) {
el = els[i];
n = el.name;
if (!n) {
continue;
}
if (semantic && form.clk && el.type == "image") {
// handle image inputs on the fly when semantic == true
if(!el.disabled && form.clk == el) {
a.push({name: n, value: $(el).val()});
a.push({name: n+'.x', value: form.clk_x}, {name: n+'.y', value: form.clk_y});
}
continue;
}
v = $.fieldValue(el, true);
if (v && v.constructor == Array) {
for(j=0, jmax=v.length; j < jmax; j++) {
a.push({name: n, value: v[j]});
}
}
else if (v !== null && typeof v != 'undefined') {
a.push({name: n, value: v});
}
}
if (!semantic && form.clk) {
// input type=='image' are not found in elements array! handle it here
var $input = $(form.clk), input = $input[0];
n = input.name;
if (n && !input.disabled && input.type == 'image') {
a.push({name: n, value: $input.val()});
a.push({name: n+'.x', value: form.clk_x}, {name: n+'.y', value: form.clk_y});
}
}
return a;
};
/**
* Serializes form data into a 'submittable' string. This method will return a string
* in the format: name1=value1&name2=value2
*/
$.fn.formSerialize = function(semantic) {
//hand off to jQuery.param for proper encoding
return $.param(this.formToArray(semantic));
};
/**
* Serializes all field elements in the jQuery object into a query string.
* This method will return a string in the format: name1=value1&name2=value2
*/
$.fn.fieldSerialize = function(successful) {
var a = [];
this.each(function() {
var n = this.name;
if (!n) {
return;
}
var v = $.fieldValue(this, successful);
if (v && v.constructor == Array) {
for (var i=0,max=v.length; i < max; i++) {
a.push({name: n, value: v[i]});
}
}
else if (v !== null && typeof v != 'undefined') {
a.push({name: this.name, value: v});
}
});
//hand off to jQuery.param for proper encoding
return $.param(a);
};
/**
* Returns the value(s) of the element in the matched set. For example, consider the following form:
*
*
*
* var v = $(':text').fieldValue();
* // if no values are entered into the text inputs
* v == ['','']
* // if values entered into the text inputs are 'foo' and 'bar'
* v == ['foo','bar']
*
* var v = $(':checkbox').fieldValue();
* // if neither checkbox is checked
* v === undefined
* // if both checkboxes are checked
* v == ['B1', 'B2']
*
* var v = $(':radio').fieldValue();
* // if neither radio is checked
* v === undefined
* // if first radio is checked
* v == ['C1']
*
* The successful argument controls whether or not the field element must be 'successful'
* (per http://www.w3.org/TR/html4/interact/forms.html#successful-controls).
* The default value of the successful argument is true. If this value is false the value(s)
* for each element is returned.
*
* Note: This method *always* returns an array. If no valid value can be determined the
* array will be empty, otherwise it will contain one or more values.
*/
$.fn.fieldValue = function(successful) {
for (var val=[], i=0, max=this.length; i < max; i++) {
var el = this[i];
var v = $.fieldValue(el, successful);
if (v === null || typeof v == 'undefined' || (v.constructor == Array && !v.length)) {
continue;
}
v.constructor == Array ? $.merge(val, v) : val.push(v);
}
return val;
};
/**
* Returns the value of the field element.
*/
$.fieldValue = function(el, successful) {
var n = el.name, t = el.type, tag = el.tagName.toLowerCase();
if (successful === undefined) {
successful = true;
}
if (successful && (!n || el.disabled || t == 'reset' || t == 'button' ||
(t == 'checkbox' || t == 'radio') && !el.checked ||
(t == 'submit' || t == 'image') && el.form && el.form.clk != el ||
tag == 'select' && el.selectedIndex == -1)) {
return null;
}
if (tag == 'select') {
var index = el.selectedIndex;
if (index < 0) {
return null;
}
var a = [], ops = el.options;
var one = (t == 'select-one');
var max = (one ? index+1 : ops.length);
for(var i=(one ? index : 0); i < max; i++) {
var op = ops[i];
if (op.selected) {
var v = op.value;
if (!v) { // extra pain for IE...
v = (op.attributes && op.attributes['value'] && !(op.attributes['value'].specified)) ? op.text : op.value;
}
if (one) {
return v;
}
a.push(v);
}
}
return a;
}
return $(el).val();
};
/**
* Clears the form data. Takes the following actions on the form's input fields:
* - input text fields will have their 'value' property set to the empty string
* - select elements will have their 'selectedIndex' property set to -1
* - checkbox and radio inputs will have their 'checked' property set to false
* - inputs of type submit, button, reset, and hidden will *not* be effected
* - button elements will *not* be effected
*/
$.fn.clearForm = function() {
return this.each(function() {
$('input,select,textarea', this).clearFields();
});
};
/**
* Clears the selected form elements.
*/
$.fn.clearFields = $.fn.clearInputs = function() {
var re = /^(?:color|date|datetime|email|month|number|password|range|search|tel|text|time|url|week)$/i; // 'hidden' is not in this list
return this.each(function() {
var t = this.type, tag = this.tagName.toLowerCase();
if (re.test(t) || tag == 'textarea') {
this.value = '';
}
else if (t == 'checkbox' || t == 'radio') {
this.checked = false;
}
else if (tag == 'select') {
this.selectedIndex = -1;
}
});
};
/**
* Resets the form data. Causes all form elements to be reset to their original value.
*/
$.fn.resetForm = function() {
return this.each(function() {
// guard against an input with the name of 'reset'
// note that IE reports the reset function as an 'object'
if (typeof this.reset == 'function' || (typeof this.reset == 'object' && !this.reset.nodeType)) {
this.reset();
}
});
};
/**
* Enables or disables any matching elements.
*/
$.fn.enable = function(b) {
if (b === undefined) {
b = true;
}
return this.each(function() {
this.disabled = !b;
});
};
/**
* Checks/unchecks any matching checkboxes or radio buttons and
* selects/deselects and matching option elements.
*/
$.fn.selected = function(select) {
if (select === undefined) {
select = true;
}
return this.each(function() {
var t = this.type;
if (t == 'checkbox' || t == 'radio') {
this.checked = select;
}
else if (this.tagName.toLowerCase() == 'option') {
var $sel = $(this).parent('select');
if (select && $sel[0] && $sel[0].type == 'select-one') {
// deselect all other options
$sel.find('option').selected(false);
}
this.selected = select;
}
});
};
// helper fn for console logging
function log() {
var msg = '[jquery.form] ' + Array.prototype.join.call(arguments,'');
if (window.console && window.console.log) {
window.console.log(msg);
}
else if (window.opera && window.opera.postError) {
window.opera.postError(msg);
}
};
})(jQuery);
/*!
* jQuery blockUI plugin
* Version 2.39 (23-MAY-2011)
* @requires jQuery v1.2.3 or later
*
* Examples at: http://malsup.com/jquery/block/
* Copyright (c) 2007-2010 M. Alsup
* Dual licensed under the MIT and GPL licenses:
* http://www.opensource.org/licenses/mit-license.php
* http://www.gnu.org/licenses/gpl.html
*
* Thanks to Amir-Hossein Sobhi for some excellent contributions!
*/
;(function($) {
if (/1\.(0|1|2)\.(0|1|2)/.test($.fn.jquery) || /^1.1/.test($.fn.jquery)) {
alert('blockUI requires jQuery v1.2.3 or later! You are using v' + $.fn.jquery);
return;
}
$.fn._fadeIn = $.fn.fadeIn;
var noOp = function() {};
// this bit is to ensure we don't call setExpression when we shouldn't (with extra muscle to handle
// retarded userAgent strings on Vista)
var mode = document.documentMode || 0;
var setExpr = $.browser.msie && (($.browser.version < 8 && !mode) || mode < 8);
var ie6 = $.browser.msie && /MSIE 6.0/.test(navigator.userAgent) && !mode;
// global $ methods for blocking/unblocking the entire page
$.blockUI = function(opts) { install(window, opts); };
$.unblockUI = function(opts) { remove(window, opts); };
// convenience method for quick growl-like notifications (http://www.google.com/search?q=growl)
$.growlUI = function(title, message, timeout, onClose) {
var $m = $('');
if (title) $m.append('
'+title+'
');
if (message) $m.append('
'+message+'
');
if (timeout == undefined) timeout = 3000;
$.blockUI({
message: $m, fadeIn: 700, fadeOut: 1000, centerY: false,
timeout: timeout, showOverlay: false,
onUnblock: onClose,
css: $.blockUI.defaults.growlCSS
});
};
// plugin method for blocking element content
$.fn.block = function(opts) {
return this.unblock({ fadeOut: 0 }).each(function() {
if ($.css(this,'position') == 'static')
this.style.position = 'relative';
if ($.browser.msie)
this.style.zoom = 1; // force 'hasLayout'
install(this, opts);
});
};
// plugin method for unblocking element content
$.fn.unblock = function(opts) {
return this.each(function() {
remove(this, opts);
});
};
$.blockUI.version = 2.39; // 2nd generation blocking at no extra cost!
// override these in your code to change the default behavior and style
$.blockUI.defaults = {
// message displayed when blocking (use null for no message)
message: '
Please wait...
',
title: null, // title string; only used when theme == true
draggable: true, // only used when theme == true (requires jquery-ui.js to be loaded)
theme: false, // set to true to use with jQuery UI themes
// styles for the message when blocking; if you wish to disable
// these and use an external stylesheet then do this in your code:
// $.blockUI.defaults.css = {};
css: {
padding: 0,
margin: 0,
width: '30%',
top: '40%',
left: '35%',
textAlign: 'center',
color: '#000',
border: '3px solid #aaa',
backgroundColor:'#fff',
cursor: 'wait'
},
// minimal style set used when themes are used
themedCSS: {
width: '30%',
top: '40%',
left: '35%'
},
// styles for the overlay
overlayCSS: {
backgroundColor: '#000',
opacity: 0.6,
cursor: 'wait'
},
// styles applied when using $.growlUI
growlCSS: {
width: '350px',
top: '10px',
left: '',
right: '10px',
border: 'none',
padding: '5px',
opacity: 0.6,
cursor: 'default',
color: '#fff',
backgroundColor: '#000',
'-webkit-border-radius': '10px',
'-moz-border-radius': '10px',
'border-radius': '10px'
},
// IE issues: 'about:blank' fails on HTTPS and javascript:false is s-l-o-w
// (hat tip to Jorge H. N. de Vasconcelos)
iframeSrc: /^https/i.test(window.location.href || '') ? 'javascript:false' : 'about:blank',
// force usage of iframe in non-IE browsers (handy for blocking applets)
forceIframe: false,
// z-index for the blocking overlay
baseZ: 1000,
// set these to true to have the message automatically centered
centerX: true, // <-- only effects element blocking (page block controlled via css above)
centerY: true,
// allow body element to be stetched in ie6; this makes blocking look better
// on "short" pages. disable if you wish to prevent changes to the body height
allowBodyStretch: true,
// enable if you want key and mouse events to be disabled for content that is blocked
bindEvents: true,
// be default blockUI will supress tab navigation from leaving blocking content
// (if bindEvents is true)
constrainTabKey: true,
// fadeIn time in millis; set to 0 to disable fadeIn on block
fadeIn: 200,
// fadeOut time in millis; set to 0 to disable fadeOut on unblock
fadeOut: 400,
// time in millis to wait before auto-unblocking; set to 0 to disable auto-unblock
timeout: 0,
// disable if you don't want to show the overlay
showOverlay: true,
// if true, focus will be placed in the first available input field when
// page blocking
focusInput: true,
// suppresses the use of overlay styles on FF/Linux (due to performance issues with opacity)
applyPlatformOpacityRules: true,
// callback method invoked when fadeIn has completed and blocking message is visible
onBlock: null,
// callback method invoked when unblocking has completed; the callback is
// passed the element that has been unblocked (which is the window object for page
// blocks) and the options that were passed to the unblock call:
// onUnblock(element, options)
onUnblock: null,
// don't ask; if you really must know: http://groups.google.com/group/jquery-en/browse_thread/thread/36640a8730503595/2f6a79a77a78e493#2f6a79a77a78e493
quirksmodeOffsetHack: 4,
// class name of the message block
blockMsgClass: 'blockMsg'
};
// private data and functions follow...
var pageBlock = null;
var pageBlockEls = [];
function install(el, opts) {
var full = (el == window);
var msg = opts && opts.message !== undefined ? opts.message : undefined;
opts = $.extend({}, $.blockUI.defaults, opts || {});
opts.overlayCSS = $.extend({}, $.blockUI.defaults.overlayCSS, opts.overlayCSS || {});
var css = $.extend({}, $.blockUI.defaults.css, opts.css || {});
var themedCSS = $.extend({}, $.blockUI.defaults.themedCSS, opts.themedCSS || {});
msg = msg === undefined ? opts.message : msg;
// remove the current block (if there is one)
if (full && pageBlock)
remove(window, {fadeOut:0});
// if an existing element is being used as the blocking content then we capture
// its current place in the DOM (and current display style) so we can restore
// it when we unblock
if (msg && typeof msg != 'string' && (msg.parentNode || msg.jquery)) {
var node = msg.jquery ? msg[0] : msg;
var data = {};
$(el).data('blockUI.history', data);
data.el = node;
data.parent = node.parentNode;
data.display = node.style.display;
data.position = node.style.position;
if (data.parent)
data.parent.removeChild(node);
}
$(el).data('blockUI.onUnblock', opts.onUnblock);
var z = opts.baseZ;
// blockUI uses 3 layers for blocking, for simplicity they are all used on every platform;
// layer1 is the iframe layer which is used to supress bleed through of underlying content
// layer2 is the overlay layer which has opacity and a wait cursor (by default)
// layer3 is the message content that is displayed while blocking
var lyr1 = ($.browser.msie || opts.forceIframe)
? $('')
: $('');
var lyr2 = opts.theme
? $('')
: $('');
var lyr3, s;
if (opts.theme && full) {
s = '
' +
'
'+(opts.title || ' ')+'
' +
'' +
'
';
}
else if (opts.theme) {
s = '
' +
'
'+(opts.title || ' ')+'
' +
'' +
'
';
}
else if (full) {
s = '';
}
else {
s = '';
}
lyr3 = $(s);
// if we have a message, style it
if (msg) {
if (opts.theme) {
lyr3.css(themedCSS);
lyr3.addClass('ui-widget-content');
}
else
lyr3.css(css);
}
// style the overlay
if (!opts.theme && (!opts.applyPlatformOpacityRules || !($.browser.mozilla && /Linux/.test(navigator.platform))))
lyr2.css(opts.overlayCSS);
lyr2.css('position', full ? 'fixed' : 'absolute');
// make iframe layer transparent in IE
if ($.browser.msie || opts.forceIframe)
lyr1.css('opacity',0.0);
//$([lyr1[0],lyr2[0],lyr3[0]]).appendTo(full ? 'body' : el);
var layers = [lyr1,lyr2,lyr3], $par = full ? $('body') : $(el);
$.each(layers, function() {
this.appendTo($par);
});
if (opts.theme && opts.draggable && $.fn.draggable) {
lyr3.draggable({
handle: '.ui-dialog-titlebar',
cancel: 'li'
});
}
// ie7 must use absolute positioning in quirks mode and to account for activex issues (when scrolling)
var expr = setExpr && (!$.boxModel || $('object,embed', full ? null : el).length > 0);
if (ie6 || expr) {
// give body 100% height
if (full && opts.allowBodyStretch && $.boxModel)
$('html,body').css('height','100%');
// fix ie6 issue when blocked element has a border width
if ((ie6 || !$.boxModel) && !full) {
var t = sz(el,'borderTopWidth'), l = sz(el,'borderLeftWidth');
var fixT = t ? '(0 - '+t+')' : 0;
var fixL = l ? '(0 - '+l+')' : 0;
}
// simulate fixed position
$.each([lyr1,lyr2,lyr3], function(i,o) {
var s = o[0].style;
s.position = 'absolute';
if (i < 2) {
full ? s.setExpression('height','Math.max(document.body.scrollHeight, document.body.offsetHeight) - (jQuery.boxModel?0:'+opts.quirksmodeOffsetHack+') + "px"')
: s.setExpression('height','this.parentNode.offsetHeight + "px"');
full ? s.setExpression('width','jQuery.boxModel && document.documentElement.clientWidth || document.body.clientWidth + "px"')
: s.setExpression('width','this.parentNode.offsetWidth + "px"');
if (fixL) s.setExpression('left', fixL);
if (fixT) s.setExpression('top', fixT);
}
else if (opts.centerY) {
if (full) s.setExpression('top','(document.documentElement.clientHeight || document.body.clientHeight) / 2 - (this.offsetHeight / 2) + (blah = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop) + "px"');
s.marginTop = 0;
}
else if (!opts.centerY && full) {
var top = (opts.css && opts.css.top) ? parseInt(opts.css.top) : 0;
var expression = '((document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop) + '+top+') + "px"';
s.setExpression('top',expression);
}
});
}
// show the message
if (msg) {
if (opts.theme)
lyr3.find('.ui-widget-content').append(msg);
else
lyr3.append(msg);
if (msg.jquery || msg.nodeType)
$(msg).show();
}
if (($.browser.msie || opts.forceIframe) && opts.showOverlay)
lyr1.show(); // opacity is zero
if (opts.fadeIn) {
var cb = opts.onBlock ? opts.onBlock : noOp;
var cb1 = (opts.showOverlay && !msg) ? cb : noOp;
var cb2 = msg ? cb : noOp;
if (opts.showOverlay)
lyr2._fadeIn(opts.fadeIn, cb1);
if (msg)
lyr3._fadeIn(opts.fadeIn, cb2);
}
else {
if (opts.showOverlay)
lyr2.show();
if (msg)
lyr3.show();
if (opts.onBlock)
opts.onBlock();
}
// bind key and mouse events
bind(1, el, opts);
if (full) {
pageBlock = lyr3[0];
pageBlockEls = $(':input:enabled:visible',pageBlock);
if (opts.focusInput)
setTimeout(focus, 20);
}
else
center(lyr3[0], opts.centerX, opts.centerY);
if (opts.timeout) {
// auto-unblock
var to = setTimeout(function() {
full ? $.unblockUI(opts) : $(el).unblock(opts);
}, opts.timeout);
$(el).data('blockUI.timeout', to);
}
};
// remove the block
function remove(el, opts) {
var full = (el == window);
var $el = $(el);
var data = $el.data('blockUI.history');
var to = $el.data('blockUI.timeout');
if (to) {
clearTimeout(to);
$el.removeData('blockUI.timeout');
}
opts = $.extend({}, $.blockUI.defaults, opts || {});
bind(0, el, opts); // unbind events
if (opts.onUnblock === null) {
opts.onUnblock = $el.data('blockUI.onUnblock');
$el.removeData('blockUI.onUnblock');
}
var els;
if (full) // crazy selector to handle odd field errors in ie6/7
els = $('body').children().filter('.blockUI').add('body > .blockUI');
else
els = $('.blockUI', el);
if (full)
pageBlock = pageBlockEls = null;
if (opts.fadeOut) {
els.fadeOut(opts.fadeOut);
setTimeout(function() { reset(els,data,opts,el); }, opts.fadeOut);
}
else
reset(els, data, opts, el);
};
// move blocking element back into the DOM where it started
function reset(els,data,opts,el) {
els.each(function(i,o) {
// remove via DOM calls so we don't lose event handlers
if (this.parentNode)
this.parentNode.removeChild(this);
});
if (data && data.el) {
data.el.style.display = data.display;
data.el.style.position = data.position;
if (data.parent)
data.parent.appendChild(data.el);
$(el).removeData('blockUI.history');
}
if (typeof opts.onUnblock == 'function')
opts.onUnblock(el,opts);
};
// bind/unbind the handler
function bind(b, el, opts) {
var full = el == window, $el = $(el);
// don't bother unbinding if there is nothing to unbind
if (!b && (full && !pageBlock || !full && !$el.data('blockUI.isBlocked')))
return;
if (!full)
$el.data('blockUI.isBlocked', b);
// don't bind events when overlay is not in use or if bindEvents is false
if (!opts.bindEvents || (b && !opts.showOverlay))
return;
// bind anchors and inputs for mouse and key events
var events = 'mousedown mouseup keydown keypress';
b ? $(document).bind(events, opts, handler) : $(document).unbind(events, handler);
// former impl...
// var $e = $('a,:input');
// b ? $e.bind(events, opts, handler) : $e.unbind(events, handler);
};
// event handler to suppress keyboard/mouse events when blocking
function handler(e) {
// allow tab navigation (conditionally)
if (e.keyCode && e.keyCode == 9) {
if (pageBlock && e.data.constrainTabKey) {
var els = pageBlockEls;
var fwd = !e.shiftKey && e.target === els[els.length-1];
var back = e.shiftKey && e.target === els[0];
if (fwd || back) {
setTimeout(function(){focus(back)},10);
return false;
}
}
}
var opts = e.data;
// allow events within the message content
if ($(e.target).parents('div.' + opts.blockMsgClass).length > 0)
return true;
// allow events for content that is not being blocked
return $(e.target).parents().children().filter('div.blockUI').length == 0;
};
function focus(back) {
if (!pageBlockEls)
return;
var e = pageBlockEls[back===true ? pageBlockEls.length-1 : 0];
if (e)
e.focus();
};
function center(el, x, y) {
var p = el.parentNode, s = el.style;
var l = ((p.offsetWidth - el.offsetWidth)/2) - sz(p,'borderLeftWidth');
var t = ((p.offsetHeight - el.offsetHeight)/2) - sz(p,'borderTopWidth');
if (x) s.left = l > 0 ? (l+'px') : '0';
if (y) s.top = t > 0 ? (t+'px') : '0';
};
function sz(el, p) {
return parseInt($.css(el,p))||0;
};
})(jQuery);
(function($) {
$.fn.tipsy = function(options) {
options = $.extend({}, $.fn.tipsy.defaults, options);
return this.each(function() {
var opts = $.fn.tipsy.elementOptions(this, options);
$(this).hover(function() {
$.data(this, 'cancel.tipsy', true);
var tip = $.data(this, 'active.tipsy');
if (!tip) {
tip = $('
');
tip.css({position: 'absolute', zIndex: 100000});
$.data(this, 'active.tipsy', tip);
}
if ($(this).attr('title') || typeof($(this).attr('original-title')) != 'string') {
$(this).attr('original-title', $(this).attr('title') || '').removeAttr('title');
}
var title;
if (typeof opts.title == 'string') {
title = $(this).attr(opts.title == 'title' ? 'original-title' : opts.title);
} else if (typeof opts.title == 'function') {
title = opts.title.call(this);
}
tip.find('.tipsy-inner')[opts.html ? 'html' : 'text'](title || opts.fallback);
var pos = $.extend({}, $(this).offset(), {width: this.offsetWidth, height: this.offsetHeight});
tip.get(0).className = 'tipsy'; // reset classname in case of dynamic gravity
tip.remove().css({top: 0, left: 0, visibility: 'hidden', display: 'block'}).appendTo(document.body);
var actualWidth = tip[0].offsetWidth, actualHeight = tip[0].offsetHeight;
var gravity = (typeof opts.gravity == 'function') ? opts.gravity.call(this) : opts.gravity;
switch (gravity.charAt(0)) {
case 'n':
tip.css({top: pos.top + pos.height, left: pos.left + pos.width / 2 - actualWidth / 2}).addClass('tipsy-north');
break;
case 's':
tip.css({top: pos.top - actualHeight, left: pos.left + pos.width / 2 - actualWidth / 2}).addClass('tipsy-south');
break;
case 'e':
tip.css({top: pos.top + pos.height / 2 - actualHeight / 2, left: pos.left - actualWidth}).addClass('tipsy-east');
break;
case 'w':
tip.css({top: pos.top + pos.height / 2 - actualHeight / 2, left: pos.left + pos.width}).addClass('tipsy-west');
break;
}
if (opts.fade) {
tip.css({opacity: 0, display: 'block', visibility: 'visible'}).animate({opacity: 0.8});
} else {
tip.css({visibility: 'visible'});
}
}, function() {
$.data(this, 'cancel.tipsy', false);
var self = this;
setTimeout(function() {
if ($.data(this, 'cancel.tipsy')) return;
var tip = $.data(self, 'active.tipsy');
if (opts.fade) {
tip.stop().fadeOut(function() { $(this).remove(); });
} else {
if(typeof(tip) != "undefined") {
tip.remove();
}
}
}, 100);
});
});
};
// Overwrite this method to provide options on a per-element basis.
// For example, you could store the gravity in a 'tipsy-gravity' attribute:
// return $.extend({}, options, {gravity: $(ele).attr('tipsy-gravity') || 'n' });
// (remember - do not modify 'options' in place!)
$.fn.tipsy.elementOptions = function(ele, options) {
return $.metadata ? $.extend({}, options, $(ele).metadata()) : options;
};
$.fn.tipsy.defaults = {
fade: false,
fallback: '',
gravity: 'n',
html: false,
title: 'title'
};
$.fn.tipsy.autoNS = function() {
return $(this).offset().top > ($(document).scrollTop() + $(window).height() / 2) ? 's' : 'n';
};
$.fn.tipsy.autoWE = function() {
return $(this).offset().left > ($(document).scrollLeft() + $(window).width() / 2) ? 'e' : 'w';
};
})(jQuery);