semantic-ui-sass 0.0.3 → 0.8.0.0

data/app/assets/javascripts/semantic-ui/modal.js

@@ -24,7 +24,7 @@ $.fn.modal = function(parameters) {
     methodInvoked   = (typeof query == 'string'),
     queryArguments  = [].slice.call(arguments, 1),
 
-    invokedResponse
+    returnedValue
   ;
 
 
@@ -33,7 +33,7 @@ $.fn.modal = function(parameters) {
       var
         settings    = ( $.isPlainObject(parameters) )
           ? $.extend(true, {}, $.fn.modal.settings, parameters)
-          : $.fn.modal.settings,
+          : $.extend({}, $.fn.modal.settings),
 
         selector        = settings.selector,
         className       = settings.className,
@@ -63,10 +63,20 @@ $.fn.modal = function(parameters) {
         initialize: function() {
           module.verbose('Initializing dimmer', $context);
 
+          if(typeof $.fn.dimmer === undefined) {
+            module.error(error.dimmer);
+            return;
+          }
+
           $dimmable = $context
+            .dimmer({
+              closable : false,
+              show     : settings.duration * 0.95,
+              hide     : settings.duration * 1.05
+            })
             .dimmer('add content', $module)
           ;
-          $dimmer = $context
+          $dimmer = $dimmable
             .dimmer('get dimmer')
           ;
 
@@ -93,8 +103,15 @@ $.fn.modal = function(parameters) {
         destroy: function() {
           module.verbose('Destroying previous modal');
           $module
+            .removeData(moduleNamespace)
             .off(eventNamespace)
           ;
+          $close
+            .off(eventNamespace)
+          ;
+          $context
+            .dimmer('destroy')
+          ;
         },
 
         refresh: function() {
@@ -126,8 +143,26 @@ $.fn.modal = function(parameters) {
 
         event: {
           close: function() {
-            module.verbose('Close button pressed');
-            module.hide();
+            module.verbose('Closing element pressed');
+            if( $(this).is(selector.approve) ) {
+              if($.proxy(settings.onApprove, element)()) {
+                module.hide();
+              }
+              else {
+                module.verbose('Approve callback returned false cancelling hide');
+              }
+            }
+            else if( $(this).is(selector.deny) ) {
+              if($.proxy(settings.onDeny, element)()) {
+                module.hide();
+              }
+              else {
+                module.verbose('Deny callback returned false cancelling hide');
+              }
+            }
+            else {
+              module.hide();
+            }
           },
           click: function(event) {
             module.verbose('Determining if event occured on dimmer', event);
@@ -146,8 +181,13 @@ $.fn.modal = function(parameters) {
               escapeKey = 27
             ;
             if(keyCode == escapeKey) {
-              module.debug('Escape key pressed hiding modal');
-              module.hide();
+              if(settings.closable) {
+                module.debug('Escape key pressed hiding modal');
+                module.hide();
+              }
+              else {
+                module.debug('Escape key pressed, but closable is set to false');
+              }
               event.preventDefault();
             }
           },
@@ -188,7 +228,6 @@ $.fn.modal = function(parameters) {
 
         showDimmer: function() {
           module.debug('Showing modal');
-          module.set.dimmerSettings();
           $dimmable.dimmer('show');
         },
 
@@ -260,7 +299,7 @@ $.fn.modal = function(parameters) {
 
         restore: {
           focus: function() {
-            if($focusedElement.size() > 0) {
+            if($focusedElement && $focusedElement.size() > 0) {
               $focusedElement.focus();
             }
           }
@@ -306,6 +345,7 @@ $.fn.modal = function(parameters) {
 
         set: {
           active: function() {
+            module.add.keyboardShortcuts();
             module.save.focus();
             module.set.type();
             $module
@@ -317,20 +357,6 @@ $.fn.modal = function(parameters) {
               ;
             }
           },
-          dimmerSettings: function() {
-            module.debug('Setting dimmer settings', $dimmable);
-            $dimmable
-              .dimmer('setting', 'closable', false)
-              .dimmer('setting', 'duration', {
-                show : settings.duration * 0.95,
-                hide : settings.duration * 1.05
-              })
-              .dimmer('setting', 'onShow' , module.add.keyboardShortcuts)
-              // destory after changing settings in order to reattach events
-              .dimmer('destroy')
-              .dimmer('initialize')
-            ;
-          },
           scrolling: function() {
             $dimmable.addClass(className.scrolling);
             $module.addClass(className.scrolling);
@@ -367,26 +393,22 @@ $.fn.modal = function(parameters) {
         },
 
         setting: function(name, value) {
-          if(value !== undefined) {
-            if( $.isPlainObject(name) ) {
-              $.extend(true, settings, name);
-            }
-            else {
-              settings[name] = value;
-            }
+          if( $.isPlainObject(name) ) {
+            $.extend(true, settings, name);
+          }
+          else if(value !== undefined) {
+            settings[name] = value;
           }
           else {
             return settings[name];
           }
         },
         internal: function(name, value) {
-          if(value !== undefined) {
-            if( $.isPlainObject(name) ) {
-              $.extend(true, module, name);
-            }
-            else {
-              module[name] = value;
-            }
+          if( $.isPlainObject(name) ) {
+            $.extend(true, module, name);
+          }
+          else if(value !== undefined) {
+            module[name] = value;
           }
           else {
             return module[name];
@@ -511,14 +533,14 @@ $.fn.modal = function(parameters) {
           else if(found !== undefined) {
             response = found;
           }
-          if($.isArray(invokedResponse)) {
-            invokedResponse.push(response);
+          if($.isArray(returnedValue)) {
+            returnedValue.push(response);
           }
-          else if(typeof invokedResponse == 'string') {
-            invokedResponse = [invokedResponse, response];
+          else if(returnedValue !== undefined) {
+            returnedValue = [returnedValue, response];
           }
           else if(response !== undefined) {
-            invokedResponse = response;
+            returnedValue = response;
           }
           return found;
         }
@@ -539,8 +561,8 @@ $.fn.modal = function(parameters) {
     })
   ;
 
-  return (invokedResponse !== undefined)
-    ? invokedResponse
+  return (returnedValue !== undefined)
+    ? returnedValue
     : this
   ;
 };
@@ -562,12 +584,17 @@ $.fn.modal.settings = {
 
   onShow      : function(){},
   onHide      : function(){},
+  onApprove   : function(){ return true; },
+  onDeny      : function(){ return true; },
 
   selector    : {
-    close : '.close, .actions .button'
+    close    : '.close, .actions .button',
+    approve  : '.actions .positive, .actions .approve',
+    deny     : '.actions .negative, .actions .cancel'
   },
   error : {
-    method : 'The method you called is not defined.'
+    dimmer    : 'UI Dimmer, a required component is not included in this page',
+    method    : 'The method you called is not defined.'
   },
   className : {
     active    : 'active',

data/app/assets/javascripts/semantic-ui/nag.js

@@ -22,7 +22,7 @@ $.fn.nag = function(parameters) {
     query           = arguments[0],
     methodInvoked   = (typeof query == 'string'),
     queryArguments  = [].slice.call(arguments, 1),
-    invokedResponse
+    returnedValue
   ;
   $(this)
     .each(function() {
@@ -299,14 +299,11 @@ $.fn.nag = function(parameters) {
           }
         },
         setting: function(name, value) {
-          module.debug('Changing setting', name, value);
-          if(value !== undefined) {
-            if( $.isPlainObject(name) ) {
-              $.extend(true, settings, name);
-            }
-            else {
-              settings[name] = value;
-            }
+          if( $.isPlainObject(name) ) {
+            $.extend(true, settings, name);
+          }
+          else if(value !== undefined) {
+            settings[name] = value;
           }
           else {
             return settings[name];
@@ -448,14 +445,14 @@ $.fn.nag = function(parameters) {
           else if(found !== undefined) {
             response = found;
           }
-          if($.isArray(invokedResponse)) {
-            invokedResponse.push(response);
+          if($.isArray(returnedValue)) {
+            returnedValue.push(response);
           }
-          else if(typeof invokedResponse == 'string') {
-            invokedResponse = [invokedResponse, response];
+          else if(returnedValue !== undefined) {
+            returnedValue = [returnedValue, response];
           }
           else if(response !== undefined) {
-            invokedResponse = response;
+            returnedValue = response;
           }
           return found;
         }
@@ -475,8 +472,8 @@ $.fn.nag = function(parameters) {
 
     })
   ;
-  return (invokedResponse !== undefined)
-    ? invokedResponse
+  return (returnedValue !== undefined)
+    ? returnedValue
     : this
   ;
 };

data/app/assets/javascripts/semantic-ui/popup.js

@@ -15,6 +15,7 @@ $.fn.popup = function(parameters) {
   var
     $allModules     = $(this),
     $document       = $(document),
+    $body           = $('body'),
 
     moduleSelector  = $allModules.selector || '',
 
@@ -25,14 +26,14 @@ $.fn.popup = function(parameters) {
     methodInvoked   = (typeof query == 'string'),
     queryArguments  = [].slice.call(arguments, 1),
 
-    invokedResponse
+    returnedValue
   ;
   $allModules
     .each(function() {
       var
         settings        = ( $.isPlainObject(parameters) )
           ? $.extend(true, {}, $.fn.popup.settings, parameters)
-          : $.fn.popup.settings,
+          : $.extend({}, $.fn.popup.settings),
 
         selector        = settings.selector,
         className       = settings.className,
@@ -41,14 +42,20 @@ $.fn.popup = function(parameters) {
         namespace       = settings.namespace,
 
         eventNamespace  = '.' + settings.namespace,
-        moduleNamespace = settings.namespace + '-module',
+        moduleNamespace = 'module-' + namespace,
 
         $module         = $(this),
+        $target         = (settings.target)
+          ? $(settings.target)
+          : $module,
 
         $window         = $(window),
-        $offsetParent   = $module.offsetParent(),
+
+        $offsetParent   = (settings.inline)
+          ? $target.offsetParent()
+          : $window,
         $popup          = (settings.inline)
-          ? $module.next(settings.selector.popup)
+          ? $target.next(settings.selector.popup)
           : $window.children(settings.selector.popup).last(),
 
         searchDepth     = 0,
@@ -63,17 +70,20 @@ $.fn.popup = function(parameters) {
         // binds events
         initialize: function() {
           module.debug('Initializing module', $module);
-          if(settings.on == 'hover') {
+          if(settings.on == 'click') {
             $module
-              .on('mouseenter' + eventNamespace, module.event.mouseenter)
-              .on('mouseleave' + eventNamespace, module.event.mouseleave)
+              .on('click', module.toggle)
             ;
           }
           else {
             $module
-              .on(settings.on + '' + eventNamespace, module.event[settings.on])
+              .on(module.get.startEvent() + eventNamespace, module.event.start)
+              .on(module.get.endEvent() + eventNamespace, module.event.end)
             ;
           }
+          if(settings.target) {
+            module.debug('Target set to element', $target);
+          }
           $window
             .on('resize' + eventNamespace, module.event.resize)
           ;
@@ -89,15 +99,24 @@ $.fn.popup = function(parameters) {
         },
 
         refresh: function() {
-          $popup        = (settings.inline)
-            ? $module.next(selector.popup)
-            : $window.children(selector.popup).last()
-          ;
-          $offsetParent = $module.offsetParent();
+          if(settings.inline) {
+            $popup = $target.next(selector.popup);
+            $offsetParent = $target.offsetParent();
+          }
+          else {
+            console.log('found by refresh');
+            $popup = $window.children(selector.popup).last();
+          }
         },
 
         destroy: function() {
           module.debug('Destroying previous module');
+          $window
+            .off(eventNamespace)
+          ;
+          $popup
+            .remove()
+          ;
           $module
             .off(eventNamespace)
             .removeData(moduleNamespace)
@@ -105,30 +124,22 @@ $.fn.popup = function(parameters) {
         },
 
         event: {
-          mouseenter:  function(event) {
-            var element = this;
+          start:  function(event) {
             module.timer = setTimeout(function() {
-              $.proxy(module.toggle, element)();
-              if( $(element).hasClass(className.visible) ) {
-                event.stopPropagation();
+              if( module.is.hidden() ) {
+                module.show();
               }
             }, settings.delay);
           },
-          mouseleave:  function() {
+          end:  function() {
             clearTimeout(module.timer);
-            if( $module.is(':visible') ) {
+            if( module.is.visible() ) {
               module.hide();
             }
           },
-          click: function(event) {
-            $.proxy(module.toggle, this)();
-            if( $(this).hasClass(className.visible) ) {
-              event.stopPropagation();
-            }
-          },
           resize: function() {
-            if( $popup.is(':visible') ) {
-              module.position();
+            if( module.is.visible() ) {
+              module.set.position();
             }
           }
         },
@@ -163,7 +174,7 @@ $.fn.popup = function(parameters) {
             else {
               module.verbose('Appending popup element to body', $popup);
               $popup
-                .appendTo( $('body') )
+                .appendTo( $body )
               ;
             }
             $.proxy(settings.onCreate, $popup)();
@@ -173,6 +184,66 @@ $.fn.popup = function(parameters) {
           }
         },
 
+        // determines popup state
+        toggle: function() {
+          module.debug('Toggling pop-up');
+          if( module.is.hidden() ) {
+            module.hideAll();
+            module.show();
+          }
+          else {
+            module.hide();
+          }
+        },
+
+        show: function(callback) {
+          callback = callback || function(){};
+          module.debug('Showing pop-up', settings.transition);
+          if(!settings.preserve) {
+            module.refresh();
+          }
+          if( !module.exists() ) {
+            module.create();
+          }
+          module.set.position();
+          module.animate.show(callback);
+        },
+
+
+        hide: function(callback) {
+          callback = callback || function(){};
+          $module
+            .removeClass(className.visible)
+          ;
+          module.unbind.close();
+          if( module.is.visible() ) {
+            module.animate.hide(callback);
+          }
+        },
+
+        hideAll: function() {
+          $(selector.popup)
+            .filter(':visible')
+              .popup('hide')
+          ;
+        },
+
+        hideGracefully: function(event) {
+          // don't close on clicks inside popup
+          if( $(event.target).closest(selector.popup).size() === 0) {
+            module.hide();
+          }
+        },
+
+        exists: function() {
+          if(settings.inline) {
+            return ( $popup.size() !== 0 );
+          }
+          else {
+            return ( $popup.parent($body).size() );
+          }
+        },
+
         remove: function() {
           module.debug('Removing popup');
           $popup
@@ -180,7 +251,72 @@ $.fn.popup = function(parameters) {
           ;
         },
 
+        animate: {
+          show: function(callback) {
+            callback = callback || function(){};
+            $module
+              .addClass(className.visible)
+            ;
+            if(settings.transition && $.fn.transition !== undefined) {
+              $popup
+                .transition(settings.transition + ' in', settings.duration, function() {
+                  module.bind.close();
+                  $.proxy(callback, element)();
+                })
+              ;
+            }
+            else {
+              $popup
+                .stop()
+                .fadeIn(settings.duration, settings.easing, function() {
+                  module.bind.close();
+                  $.proxy(callback, element)();
+                })
+              ;
+            }
+            $.proxy(settings.onShow, element)();
+          },
+          hide: function(callback) {
+            callback = callback || function(){};
+            module.debug('Hiding pop-up');
+            if(settings.transition && $.fn.transition !== undefined) {
+              $popup
+                .transition(settings.transition + ' out', settings.duration, function() {
+                  module.reset();
+                  callback();
+                })
+              ;
+            }
+            else {
+              $popup
+                .stop()
+                .fadeOut(settings.duration, settings.easing, function() {
+                  module.reset();
+                  callback();
+                })
+              ;
+            }
+            $.proxy(settings.onHide, element)();
+          }
+        },
+
         get: {
+          startEvent: function() {
+            if(settings.on == 'hover') {
+              return 'mouseenter';
+            }
+            else if(settings.on == 'focus') {
+              return 'focus';
+            }
+          },
+          endEvent: function() {
+            if(settings.on == 'hover') {
+              return 'mouseleave';
+            }
+            else if(settings.on == 'focus') {
+              return 'blur';
+            }
+          },
           offstagePosition: function() {
             var
               boundary  = {
@@ -248,250 +384,201 @@ $.fn.popup = function(parameters) {
           }
         },
 
-        // determines popup state
-        toggle: function() {
-          $module = $(this);
-          module.debug('Toggling pop-up');
-          // refresh state of module
-          module.refresh();
-          if( !$module.hasClass(className.visible) ) {
-            if(settings.on == 'click') {
-              module.hideAll();
-            }
-            module.show();
-          }
-          else {
-            // module.hide();
-          }
-        },
+        set: {
+          position: function(position, arrowOffset) {
+            var
+              windowWidth  = $(window).width(),
+              windowHeight = $(window).height(),
 
-        position: function(position, arrowOffset) {
-          var
-            windowWidth  = $(window).width(),
-            windowHeight = $(window).height(),
-            width        = $module.outerWidth(),
-            height       = $module.outerHeight(),
-            popupWidth   = $popup.width(),
-            popupHeight  = $popup.outerHeight(),
-
-            offset       = (settings.inline)
-              ? $module.position()
-              : $module.offset(),
-            parentWidth  = (settings.inline)
-              ? $offsetParent.outerWidth()
-              : $window.outerWidth(),
-            parentHeight = (settings.inline)
-              ? $offsetParent.outerHeight()
-              : $window.outerHeight(),
-
-            positioning,
-            offstagePosition
-          ;
-          position    = position    || $module.data(metadata.position)    || settings.position;
-          arrowOffset = arrowOffset || $module.data(metadata.arrowOffset) || settings.arrowOffset;
-          module.debug('Calculating offset for position', position);
-          switch(position) {
-            case 'top left':
-              positioning = {
-                bottom :  parentHeight - offset.top + settings.distanceAway,
-                right  :  parentWidth - offset.left - width - arrowOffset,
-                top    : 'auto',
-                left   : 'auto'
-              };
-            break;
-            case 'top center':
-              positioning = {
-                bottom :  parentHeight - offset.top + settings.distanceAway,
-                left   : offset.left + (width / 2) - (popupWidth / 2) + arrowOffset,
-                top    : 'auto',
-                right  : 'auto'
-              };
-            break;
-            case 'top right':
-              positioning = {
-                top    : 'auto',
-                bottom :  parentHeight - offset.top + settings.distanceAway,
-                left   : offset.left + arrowOffset
-              };
-            break;
-            case 'left center':
-              positioning = {
-                top    :  offset.top + (height / 2) - (popupHeight / 2),
-                right  : parentWidth - offset.left + settings.distanceAway - arrowOffset,
-                left   : 'auto',
-                bottom : 'auto'
-              };
-            break;
-            case 'right center':
-              positioning = {
-                top    :  offset.top + (height / 2) - (popupHeight / 2),
-                left   : offset.left + width + settings.distanceAway + arrowOffset,
-                bottom : 'auto',
-                right  : 'auto'
-              };
-            break;
-            case 'bottom left':
-              positioning = {
-                top    :  offset.top + height + settings.distanceAway,
-                right  : parentWidth - offset.left - width - arrowOffset,
-                left   : 'auto',
-                bottom : 'auto'
-              };
-            break;
-            case 'bottom center':
-              positioning = {
-                top    :  offset.top + height + settings.distanceAway,
-                left   : offset.left + (width / 2) - (popupWidth / 2) + arrowOffset,
-                bottom : 'auto',
-                right  : 'auto'
-              };
-            break;
-            case 'bottom right':
-              positioning = {
-                top    :  offset.top + height + settings.distanceAway,
-                left   : offset.left + arrowOffset,
-                bottom : 'auto',
-                right  : 'auto'
-              };
-            break;
-          }
-          // true width on popup, avoid rounding error
-          $.extend(positioning, {
-            width: $popup.width() + 1
-          });
-          // tentatively place on stage
-          $popup
-            .css(positioning)
-            .removeClass(className.position)
-            .addClass(position)
-          ;
-          // check if is offstage
-          offstagePosition = module.get.offstagePosition();
-          // recursively find new positioning
-          if(offstagePosition) {
-            module.debug('Element is outside boundaries ', offstagePosition);
-            if(searchDepth < settings.maxSearchDepth) {
-              position = module.get.nextPosition(position);
-              searchDepth++;
-              module.debug('Trying new position: ', position);
-              return module.position(position);
-            }
-            else {
-              module.error(error.recursion);
-              searchDepth = 0;
-              return false;
-            }
-          }
-          else {
-            module.debug('Position is on stage', position);
-            searchDepth = 0;
-            return true;
-          }
-        },
+              width        = $target.outerWidth(),
+              height       = $target.outerHeight(),
 
-        show: function() {
-          module.debug('Showing pop-up', settings.transition);
-          if($popup.size() === 0) {
-            module.create();
-          }
-          module.position();
-          $module
-            .addClass(className.visible)
-          ;
-          if(settings.transition && $.fn.transition !== undefined) {
-            $popup
-              .transition(settings.transition + ' in', settings.duration)
+              popupWidth   = $popup.width(),
+              popupHeight  = $popup.outerHeight(),
+
+              parentWidth  = $offsetParent.outerWidth(),
+              parentHeight = $offsetParent.outerHeight(),
+
+              distanceAway = settings.distanceAway,
+
+              offset       = (settings.inline)
+                ? $target.position()
+                : $target.offset(),
+
+              positioning,
+              offstagePosition
             ;
-          }
-          else {
+            position    = position    || $module.data(metadata.position)    || settings.position;
+            arrowOffset = arrowOffset || $module.data(metadata.offset)      || settings.offset;
+            // adjust for margin when inline
+            if(settings.inline) {
+              if(position == 'left center' || position == 'right center') {
+                arrowOffset  += parseInt( window.getComputedStyle(element).getPropertyValue('margin-top'), 10);
+                distanceAway += -parseInt( window.getComputedStyle(element).getPropertyValue('margin-left'), 10);
+              }
+              else {
+                arrowOffset  += parseInt( window.getComputedStyle(element).getPropertyValue('margin-left'), 10);
+                distanceAway += parseInt( window.getComputedStyle(element).getPropertyValue('margin-top'), 10);
+              }
+            }
+            module.debug('Calculating offset for position', position);
+            switch(position) {
+              case 'top left':
+                positioning = {
+                  bottom :  parentHeight - offset.top + distanceAway,
+                  right  :  parentWidth - offset.left - arrowOffset,
+                  top    : 'auto',
+                  left   : 'auto'
+                };
+              break;
+              case 'top center':
+                positioning = {
+                  bottom :  parentHeight - offset.top + distanceAway,
+                  left   : offset.left + (width / 2) - (popupWidth / 2) + arrowOffset,
+                  top    : 'auto',
+                  right  : 'auto'
+                };
+              break;
+              case 'top right':
+                positioning = {
+                  top    : 'auto',
+                  bottom :  parentHeight - offset.top + distanceAway,
+                  left   : offset.left + width + arrowOffset,
+                  right  : 'auto'
+                };
+              break;
+              case 'left center':
+                positioning = {
+                  top    :  offset.top + (height / 2) - (popupHeight / 2) + arrowOffset,
+                  right  : parentWidth - offset.left + distanceAway,
+                  left   : 'auto',
+                  bottom : 'auto'
+                };
+              break;
+              case 'right center':
+                positioning = {
+                  top    :  offset.top + (height / 2) - (popupHeight / 2) + arrowOffset,
+                  left   : offset.left + width + distanceAway,
+                  bottom : 'auto',
+                  right  : 'auto'
+                };
+              break;
+              case 'bottom left':
+                positioning = {
+                  top    :  offset.top + height + distanceAway,
+                  right  : parentWidth - offset.left - arrowOffset,
+                  left   : 'auto',
+                  bottom : 'auto'
+                };
+              break;
+              case 'bottom center':
+                positioning = {
+                  top    :  offset.top + height + distanceAway,
+                  left   : offset.left + (width / 2) - (popupWidth / 2) + arrowOffset,
+                  bottom : 'auto',
+                  right  : 'auto'
+                };
+              break;
+              case 'bottom right':
+                positioning = {
+                  top    :  offset.top + height + distanceAway,
+                  left   : offset.left + width + arrowOffset,
+                  bottom : 'auto',
+                  right  : 'auto'
+                };
+              break;
+            }
+            // tentatively place on stage
             $popup
-              .stop()
-              .fadeIn(settings.duration, settings.easing)
-            ;
-          }
-          if(settings.on == 'click' && settings.clicktoClose) {
-            module.debug('Binding popup close event');
-            $document
-              .on('click.' + namespace, module.gracefully.hide)
+              .css(positioning)
+              .removeClass(className.position)
+              .addClass(position)
             ;
+            // check if is offstage
+            offstagePosition = module.get.offstagePosition();
+
+            // recursively find new positioning
+            if(offstagePosition) {
+              module.debug('Element is outside boundaries', offstagePosition);
+              if(searchDepth < settings.maxSearchDepth) {
+                position = module.get.nextPosition(position);
+                searchDepth++;
+                module.debug('Trying new position', position);
+                return module.set.position(position);
+              }
+              else {
+                module.error(error.recursion);
+                searchDepth = 0;
+                return false;
+              }
+            }
+            else {
+              module.debug('Position is on stage', position);
+              searchDepth = 0;
+              return true;
+            }
           }
-          $.proxy(settings.onShow, $popup)();
-        },
 
-        hideAll: function() {
-          $(selector.popup)
-            .filter(':visible')
-              .popup('hide')
-          ;
         },
 
-        hide: function() {
-          $module
-            .removeClass(className.visible)
-          ;
-          if($popup.is(':visible') ) {
-            module.debug('Hiding pop-up');
-            if(settings.transition && $.fn.transition !== undefined) {
-              $popup
-                .transition(settings.transition + ' out', settings.duration, module.reset)
+        bind: {
+          close:function() {
+            if(settings.on == 'click' && settings.closable) {
+              module.verbose('Binding popup close event to document');
+              $document
+                .on('click' + eventNamespace, module.hideGracefully)
               ;
             }
-            else {
-              $popup
-                .stop()
-                .fadeOut(settings.duration, settings.easing, module.reset)
+          }
+        },
+
+        unbind: {
+          close: function() {
+            if(settings.on == 'click' && settings.closable) {
+              module.verbose('Removing close event from document');
+              $document
+                .off('click' + eventNamespace)
               ;
             }
           }
-          if(settings.on == 'click' && settings.clicktoClose) {
-            $document
-              .off('click.' + namespace)
-            ;
+        },
+
+        is: {
+          visible: function() {
+            return $popup.is(':visible');
+          },
+          hidden: function() {
+            return !module.is.visible();
           }
-          $.proxy(settings.onHide, $popup)();
         },
 
         reset: function() {
-          module.verbose('Resetting inline styles');
           $popup
             .attr('style', '')
             .removeAttr('style')
           ;
-          if(!settings.inline) {
+          if(!settings.preserve) {
             module.remove();
           }
         },
 
-        gracefully: {
-          hide: function(event) {
-            // don't close on clicks inside popup
-            if( $(event.target).closest(selector.popup).size() === 0) {
-              module.hide();
-            }
-          }
-        },
-
         setting: function(name, value) {
-          if(value !== undefined) {
-            if( $.isPlainObject(name) ) {
-              $.extend(true, settings, name);
-            }
-            else {
-              settings[name] = value;
-            }
+          if( $.isPlainObject(name) ) {
+            $.extend(true, settings, name);
+          }
+          else if(value !== undefined) {
+            settings[name] = value;
           }
           else {
             return settings[name];
           }
         },
         internal: function(name, value) {
-          if(value !== undefined) {
-            if( $.isPlainObject(name) ) {
-              $.extend(true, module, name);
-            }
-            else {
-              module[name] = value;
-            }
+          if( $.isPlainObject(name) ) {
+            $.extend(true, module, name);
+          }
+          else if(value !== undefined) {
+            module[name] = value;
           }
           else {
             return module[name];
@@ -605,7 +692,7 @@ $.fn.popup = function(parameters) {
                 return false;
               }
               else {
-                module.error(error.method);
+                module.error(error.method, query);
                 return false;
               }
             });
@@ -616,14 +703,14 @@ $.fn.popup = function(parameters) {
           else if(found !== undefined) {
             response = found;
           }
-          if($.isArray(invokedResponse)) {
-            invokedResponse.push(response);
+          if($.isArray(returnedValue)) {
+            returnedValue.push(response);
           }
-          else if(typeof invokedResponse == 'string') {
-            invokedResponse = [invokedResponse, response];
+          else if(returnedValue !== undefined) {
+            returnedValue = [returnedValue, response];
           }
           else if(response !== undefined) {
-            invokedResponse = response;
+            returnedValue = response;
           }
           return found;
         }
@@ -644,8 +731,8 @@ $.fn.popup = function(parameters) {
     })
   ;
 
-  return (invokedResponse !== undefined)
-    ? invokedResponse
+  return (returnedValue !== undefined)
+    ? returnedValue
     : this
   ;
 };
@@ -658,7 +745,7 @@ $.fn.popup.settings = {
   performance    : true,
   namespace      : 'popup',
 
-  onCreate         : function(){},
+  onCreate       : function(){},
   onShow         : function(){},
   onHide         : function(){},
 
@@ -668,18 +755,20 @@ $.fn.popup.settings = {
   title          : false,
 
   on             : 'hover',
-  clicktoClose   : true,
+  target         : false,
+  closable       : true,
 
   position       : 'top center',
   delay          : 150,
-  inline         : true,
+  inline         : false,
+  preserve       : false,
 
-  duration       : 150,
+  duration       : 250,
   easing         : 'easeOutQuint',
   transition     : 'scale',
 
   distanceAway   : 0,
-  arrowOffset    : 0,
+  offset         : 0,
   maxSearchDepth : 10,
 
   error: {
@@ -689,19 +778,19 @@ $.fn.popup.settings = {
   },
 
   metadata: {
-    arrowOffset : 'arrowOffset',
-    content     : 'content',
-    html        : 'html',
-    position    : 'position',
-    title       : 'title',
-    variation   : 'variation'
+    content   : 'content',
+    html      : 'html',
+    offset    : 'offset',
+    position  : 'position',
+    title     : 'title',
+    variation : 'variation'
   },
 
   className   : {
-    popup       : 'ui popup',
-    visible     : 'visible',
     loading     : 'loading',
-    position    : 'top left center bottom right'
+    popup       : 'ui popup',
+    position    : 'top left center bottom right',
+    visible     : 'visible'
   },
 
   selector    : {