Permalink
Browse files

Some cosmetic changes

  • Loading branch information...
cgst committed Jul 11, 2010
1 parent 5cea6ef commit 048c2721f867593b6eb0837ac0ef0a42f62f5c6b
Showing with 99 additions and 92 deletions.
  1. +99 −92 popover.js
View
@@ -1,92 +1,99 @@
-jQuery.fn.popover = function(a){
-
- openedPO = null;
- header = $(a.header).detach();
- content = $(a.content).detach();
- openEvent = a.open;
- closeEvent = a.close;
-
- hidePopover = function(content){
- content.removeClass("active");
- content.attr("style", "");
- if($.isFunction(closeEvent)) closeEvent();
- openedPO = null;
- $(document).unbind("click");
- return false;
- }
-
- this.each(function(){
- $(this).addClass("popover");
- $(this).append('<div class="floater"><div class="triangle"></div><div class="header"></div><div class="content"></div></div>');
- $(".header", this).append(header);
- $(".content", this).append(content);
-
- $(this).click(function(){
- button = $(this);
- content = $(".floater", this);
- //already opened
- if(openedPO === this){
- return true;
- }else if(openedPO != null){
- //Close the previous one
- openedContent = $(".floater", openedPO);
- hidePopover(openedContent);
- }
-
- triangle = $(".floater > .triangle", this);
- leftOff = 0;
- topOff = 0;
- docWidth = $(document).width();
- docHeight = $(document).height();
- triangleSize = parseInt(triangle.css("border-bottom-width"));
- contentWidth = content.outerWidth();
- contentHeight = content.outerHeight();
- buttonWidth = button.outerWidth();
- buttonHeight = button.outerHeight()
- offset = button.offset();
-
- //Calculate topOff
- topOff = offset.top + buttonHeight + triangleSize;
- diffHeight = docHeight - (topOff + contentHeight + triangleSize );
- if(diffHeight < 0){
- //resize the content
- content.height(content.height() + diffHeight);
- }
-
- //Calculate leftOff
- leftOff = offset.left + ( buttonWidth - contentWidth)/2;
- diffWidth = 0
- if(leftOff < 0){
- //out of the document at left
- diffWidth = -leftOff;
- }else if ( leftOff + contentWidth > docWidth){
- //left of the screen right
-
- diffWidth = leftOff + contentWidth - docWidth;
- }
-
- //position content
- triangle.css("left", contentWidth/2 - triangleSize + diffWidth);
-
- //resize the content for overflow
- content.children(".content").css("max-height", content.height() -parseInt(content.children(".header").css("height")) - 7);
-
- content.offset({
- top: topOff,
- left: leftOff - diffWidth
- });
-
- $(document).click(function(event){
- if ($(event.target).parents(".popover").length === 0){
- return hidePopover(content);
- }
- });
- content.show();
- //Timeout for webkit transitions to take effect
- window.setTimeout(function(){content.addClass("active");}, 0)
- if($.isFunction(openEvent)) openEvent();
- openedPO = this;
- return false;
- });
- });
-};
+(function($) {
+$.fn.popover = function(options) {
+ var defaults = {
+ openEvent: null,
+ closeEvent: null
+ };
+ var options = $.extend(defaults, options);
+
+ var openedPO = null;
+ var button = $(this);
+ var header = $(options.header).detach();
+ var content = $(options.content).detach();
+ var floater;
+
+ var hidePopover = function(content) {
+ content.removeClass("active");
+ content.attr("style", "");
+ if ($.isFunction(options.closeEvent)) options.closeEvent();
+ openedPO = null;
+ $(document).unbind("click");
+ return false;
+ }
+
+ var showPopover = function() {
+ //already opened
+ if (openedPO === this){
+ return true;
+ } else if(openedPO != null){
+ // Close the previous one
+ hidePopover($(".floater", openedPO));
+ }
+
+ triangle = $(".floater > .triangle", this);
+ leftOff = 0;
+ topOff = 0;
+ docWidth = $(document).width();
+ docHeight = $(document).height();
+ triangleSize = parseInt(triangle.css("border-bottom-width"));
+ contentWidth = floater.outerWidth();
+ contentHeight = floater.outerHeight();
+ buttonWidth = button.outerWidth();
+ buttonHeight = button.outerHeight()
+ offset = button.offset();
+
+ //Calculate topOff
+ topOff = offset.top + buttonHeight + triangleSize;
+ diffHeight = docHeight - (topOff + contentHeight + triangleSize );
+ if(diffHeight < 0){
+ //resize the floater
+ floater.height(floater.height() + diffHeight);
+ }
+
+ //Calculate leftOff
+ leftOff = offset.left + ( buttonWidth - contentWidth)/2;
+ diffWidth = 0
+ if(leftOff < 0){
+ //out of the document at left
+ diffWidth = -leftOff;
+ }else if ( leftOff + contentWidth > docWidth){
+ //left of the screen right
+
+ diffWidth = leftOff + contentWidth - docWidth;
+ }
+
+ //position floater
+ triangle.css("left", contentWidth/2 - triangleSize + diffWidth);
+
+ //resize the floater for overflow
+ floater.children(".content").css("max-height", floater.height() -parseInt(floater.children(".header").css("height")) - 7);
+
+ floater.offset({
+ top: topOff,
+ left: leftOff - diffWidth
+ });
+
+ $(document).click(function(event){
+ if ($(event.target).parents(".popover").length === 0){
+ return hidePopover(floater);
+ }
+ });
+ floater.show();
+ //Timeout for webkit transitions to take effect
+ window.setTimeout(function(){floater.addClass("active");}, 0)
+ if($.isFunction(options.openEvent)) options.openEvent();
+ openedPO = this;
+ return false;
+ }
+
+ this.each(function(){
+ $(this).addClass("popover");
+ floater = $('<div class="floater"><div class="triangle"></div>'
+ + '<div class="header"></div><div class="content"></div>'
+ + '</div>').appendTo(this);
+ $(".header", floater).append(header);
+ $(".content", floater).append(content);
+ $(this).click(showPopover);
+ });
+}
+})(jQuery);

0 comments on commit 048c272

Please sign in to comment.