r2416 - Initial plugin commit.
Author: powella
Date: Mon Mar 30 14:43:44 2009
New Revision: 2416
Added:
branches/dev/overlay/ui/ui.overlay.js
Log:
Initial plugin commit.
Added: branches/dev/overlay/ui/ui.overlay.js
==============================================================================
--- (empty file)
+++ branches/dev/overlay/ui/ui.overlay.js Mon Mar 30 14:43:44 2009
@@ -0,0 +1,220 @@
+/*
+ * jQuery UI Overlay @VERSION
+ *
+ * Copyright (c) 2009 AUTHORS.txt (http://jqueryui.com/about)
+ * Dual licensed under the MIT (MIT-LICENSE.txt)
+ * and GPL (GPL-LICENSE.txt) licenses.
+ *
+ * http://docs.jquery.com/UI/Overlay
+ *
+ * Depends:
+ * ui.core.js
+ */
+(function($) {
+
+$.widget("ui.overlay", {
+
+ _init: function() {
+
+ $.extend(this, {target: (this.element.get(0) == window ||
this.element.get(0) == document ? $(document.body) : this.element)});
+
+ if(this.options.disableScrolling){
+ this.prevOverflow = this.target.css('overflow');
+ this.target.css({overflow: 'hidden'});
+ }
+
+ var self = this,
+ options = this.options,
+ classes = $.ui.overlay.classes,
+ bounds = this.bounds(),
+ base = $('<div class="ui-widget ' + classes.base + '"/>')
+ .css({
+ zIndex: options.zIndex,
+ position: 'absolute',
+ width: bounds.width, height: bounds.height,
+ top: bounds.top, left: bounds.left
+ }),
+ back = $('<div class="ui-widget-overlay ' + classes.back
+ '"/>').appendTo(base)
+ .css({width: bounds.width, height: bounds.height});
+
+ $.extend(this, { base: base, back: back });
+
+ if(options.showMessage){
+ var fore = $('<div class="' + classes.fore + '"/>')
+ .css({width: bounds.width, height: bounds.height})
+ .appendTo(this.base),
+ content = $('<div class="ui-state-highlight ui-corner-all ' +
classes.content + '"/>').appendTo(fore),
+ icon = (options.icon ? $('<div class="ui-icon ui-icon-info ' +
classes.icon + '"/>').appendTo(content) : null),
+ text = (options.text && options.text.length ? $('<div class="' +
classes.text + '"/>').appendTo(content).html(options.text) : null);
+ $.extend(this, { fore: fore, content: content, icon: icon, text: text
});
+ }
+
+ if(this.target.css('position') == 'static'){
this.target.css({position: 'relative'}); }
+ if($.browser.msie){ this.target.style.zoom = 1; } // force 'hasLayout'
+
+ options.show && this.show();
+
+ },
+
+ _setData: function(key, value) {
+
+ switch (key) {
+ case 'zIndex':
+ this.base.css({zIndex: value});
+ break;
+ }
+
+ $.widget.prototype._setData.apply(this, arguments);
+ },
+
+ destroy: function() {
+ this.hide();
+ this.base.remove();
+ },
+
+ show: function(){
+ var self = this, options = this.options;
+
+ if(this.visible){ return; }
+ $.extend(this, {visible: true});
+
+ options.hideOnClick && this.base.bind('click.overlay', function(){
self.hide(); });
+ if(options.hideOnEsc){
+ $(document).bind('keydown.overlay', function(event){
+ event.keyCode && (event.keyCode == $.ui.keyCode.ESCAPE) && self.hide();
+ });
+ }
+
+ this.base.appendTo(document.body).show();
+ this.positionMessage();
+ // apply bgiframe if available
+
+ $.fn.bgiframe && this.base.bgiframe();
+ },
+
+ hide: function(){
+ var options = this.options;
+
+ $.extend(this, {visible: false});
+ this.base.hide();
+
+ if(options.disableScrolling){
+ this.target.css({overflow: this.prevOverflow});
+ }
+
+ options.hideOnEsc && $(document).unbind('.overlay');
+
+ },
+
+ height: function(e) {
+
+ e = $(e ? e : this.target);
+ if ($.browser.msie && $.browser.version < 7 && (this.target.get(0) ==
document.body)){ // handle IE 6
+ var scrollHeight = Math.max(document.documentElement.scrollHeight,
document.body.scrollHeight);
+ var offsetHeight = Math.max(document.documentElement.offsetHeight,
document.body.offsetHeight);
+
+ if(scrollHeight < offsetHeight){
+ return $(window).height() + 'px';
+ }
+ else{
+ return scrollHeight + 'px';
+ }
+ }
+ else{ // handle "good" browsers
+ return e.height() + 'px';
+ }
+ },
+
+ width: function(e) {
+
+ e = $(e ? e : this.target);
+ if($.browser.msie && $.browser.version < 7 && (this.target.get(0) ==
document.body)){ // handle IE 6
+ var scrollWidth = Math.max(document.documentElement.scrollWidth,
document.body.scrollWidth);
+ var offsetWidth = Math.max(document.documentElement.offsetWidth,
document.body.offsetWidth);
+
+ if(scrollWidth < offsetWidth){
+ return $(window).width() + 'px';
+ }
+ else{
+ return scrollWidth + 'px';
+ }
+
+ } // handle "good" browsers
+ else{
+ return e.width() + 'px';
+ }
+ },
+
+ resize: function() {
+ var bounds = this.bounds();
+ this.base.css({ width: 0, height: 0 })
+ .css({
+ width: bounds.width,
+ height: bounds.height
+ });
+ this.positionMessage();
+ },
+
+ positionMessage: function(){
+ if(!this.options.showMessage){ return; }
+
+ var bounds = this.bounds(), content = this.content;
+
+ var contentBounds = this.bounds(content);
+ content.css({ marginTop: ((bounds.height - contentBounds.height)/2),
marginLeft: ((bounds.width - contentBounds.width)/2) });
+ },
+
+ bounds: function(e)
+ {
+ e = (e ? e : this.target).get(0);
+ if (!e) return;
+
+ var pos = {
+ width: Math.max(parseInt(this.width(e)), e.offsetWidth),
+ height: Math.max(parseInt(this.height(e)), e.offsetHeight),
+ left: 0, top: 0, right: 0, bottom: 0, x: 0, y: 0
+ };
+
+ // ie 5.0 counts the body as well with the full win width, so we need to
stop on body
+ while(e != null && e.nodeName != "BODY"){
+ pos.left += e.offsetLeft;
+ pos.top += e.offsetTop;
+ e = e.offsetParent;
+ }
+
+ //right and bottom
+ pos.right = (pos.left + pos.width);
+ pos.bottom = (pos.top + pos.height);
+ pos.x = pos.left;
+ pos.y = pos.top;
+
+ $.extend(pos, {toString: function(){ var t = this; return 'x: ' + t.x
+ ' y: ' + t.y + ' width: ' + t.width + ' height: ' + t.height + ' right: '
+ t.right + ' bottom: ' + t.bottom; }});
+
+ return pos;
+ }
+
+});
+
+$.extend($.ui.overlay, {
+ version: "@VERSION",
+ defaults: {
+ show: true,
+ showMessage: false,
+ disableScrolling: false,
+ hideOnEsc: false,
+ hideOnClick: false,
+ zIndex: 1000,
+ icon: '',
+ text: ''
+ },
+ classes: {
+ base: "ui-overlay",
+ back: "ui-overlay-back",
+ fore: "ui-overlay-fore",
+ content: "ui-overlay-fore-content",
+ icon: "ui-overlay-fore-icon",
+ text: "ui-overlay-fore-text"
+ }
+});
+
+})(jQuery);