fomantic-ui 2.9.0-beta.317 → 2.9.0-beta.319

package/dist/semantic.js

@@ -1,5 +1,5 @@
 /*
- * # Fomantic UI - 2.9.0-beta.317+6a18b84
+ * # Fomantic UI - 2.9.0-beta.319+0740de8
  * https://github.com/fomantic/Fomantic-UI
  * http://fomantic-ui.com/
  *
@@ -9,7 +9,7 @@
  *
  */
 /*!
- * # Fomantic-UI 2.9.0-beta.317+6a18b84 - Site
+ * # Fomantic-UI 2.9.0-beta.319+0740de8 - Site
  * http://github.com/fomantic/Fomantic-UI/
  *
  *
@@ -503,7 +503,7 @@ $.extend($.expr[ ":" ], {
 })( jQuery, window, document );
 
 /*!
- * # Fomantic-UI 2.9.0-beta.317+6a18b84 - Form Validation
+ * # Fomantic-UI 2.9.0-beta.319+0740de8 - Form Validation
  * http://github.com/fomantic/Fomantic-UI/
  *
  *
@@ -2579,7 +2579,7 @@ $.fn.form.settings = {
 })( jQuery, window, document );
 
 /*!
- * # Fomantic-UI 2.9.0-beta.317+6a18b84 - Accordion
+ * # Fomantic-UI 2.9.0-beta.319+0740de8 - Accordion
  * http://github.com/fomantic/Fomantic-UI/
  *
  *
@@ -3204,7 +3204,7 @@ $.extend( $.easing, {
 
 
 /*!
- * # Fomantic-UI 2.9.0-beta.317+6a18b84 - Calendar
+ * # Fomantic-UI 2.9.0-beta.319+0740de8 - Calendar
  * http://github.com/fomantic/Fomantic-UI/
  *
  *
@@ -5095,7 +5095,7 @@ $.fn.calendar.settings = {
 })(jQuery, window, document);
 
 /*!
- * # Fomantic-UI 2.9.0-beta.317+6a18b84 - Checkbox
+ * # Fomantic-UI 2.9.0-beta.319+0740de8 - Checkbox
  * http://github.com/fomantic/Fomantic-UI/
  *
  *
@@ -5979,7 +5979,7 @@ $.fn.checkbox.settings = {
 })( jQuery, window, document );
 
 /*!
- * # Fomantic-UI 2.9.0-beta.317+6a18b84 - Dimmer
+ * # Fomantic-UI 2.9.0-beta.319+0740de8 - Dimmer
  * http://github.com/fomantic/Fomantic-UI/
  *
  *
@@ -6745,7 +6745,7 @@ $.fn.dimmer.settings = {
 })( jQuery, window, document );
 
 /*!
- * # Fomantic-UI 2.9.0-beta.317+6a18b84 - Dropdown
+ * # Fomantic-UI 2.9.0-beta.319+0740de8 - Dropdown
  * http://github.com/fomantic/Fomantic-UI/
  *
  *
@@ -11101,7 +11101,7 @@ $.fn.dropdown.settings.templates = {
 })( jQuery, window, document );
 
 /*!
- * # Fomantic-UI 2.9.0-beta.317+6a18b84 - Embed
+ * # Fomantic-UI 2.9.0-beta.319+0740de8 - Embed
  * http://github.com/fomantic/Fomantic-UI/
  *
  *
@@ -11815,7 +11815,7 @@ $.fn.embed.settings = {
 })( jQuery, window, document );
 
 /*!
- * # Fomantic-UI 2.9.0-beta.317+6a18b84 - Flyout
+ * # Fomantic-UI 2.9.0-beta.319+0740de8 - Flyout
  * http://github.com/fomantic/Fomantic-UI/
  *
  *
@@ -11839,7 +11839,7 @@ window = (typeof window != 'undefined' && window.Math == Math)
     : Function('return this')()
 ;
 
-$.fn.flyout = function(parameters) {
+$.flyout = $.fn.flyout = function(parameters) {
   var
     $allModules     = $(this),
     $window         = $(window),
@@ -11884,15 +11884,19 @@ $.fn.flyout = function(parameters) {
         moduleNamespace      = 'module-' + namespace,
 
         $module              = $(this),
-        $context             = [window,document].indexOf(settings.context) < 0 ? $(document).find(settings.context) : $body,
-        $close               = $module.find(selector.close),
+        $context             = [window,document].indexOf(settings.context) < 0 ? $document.find(settings.context) : $body,
+        $closeIcon           = $module.find(selector.close),
+        $inputs,
+        $focusedElement,
 
         $flyouts             = $module.children(selector.flyout),
         $pusher              = $context.children(selector.pusher),
         $style,
 
+        isFlyoutComponent    = $module.hasClass('flyout'),
+
         element              = this,
-        instance             = $module.hasClass(namespace) ? $module.data(moduleNamespace) : undefined,
+        instance             = isFlyoutComponent ? $module.data(moduleNamespace) : undefined,
 
         ignoreRepeatedEvents = false,
         isBody               = $context[0] === $body[0],
@@ -11902,6 +11906,7 @@ $.fn.flyout = function(parameters) {
 
         elementNamespace,
         id,
+        observer,
         currentScroll,
         transitionEvent,
 
@@ -11913,7 +11918,8 @@ $.fn.flyout = function(parameters) {
         initialize: function() {
           module.debug('Initializing flyout', parameters);
 
-          if(!$module.hasClass(namespace)) {
+          module.create.id();
+          if(!isFlyoutComponent) {
             module.create.flyout();
             if(!$.isFunction(settings.onHidden)) {
               settings.onHidden = function () {
@@ -11921,6 +11927,9 @@ $.fn.flyout = function(parameters) {
                 $module.remove();
               };
             }
+            if(!settings.autoShow) {
+              settings.autoShow = true;
+            }
           }
           $module.addClass(settings.class);
           if (settings.title !== '') {
@@ -11938,13 +11947,14 @@ $.fn.flyout = function(parameters) {
             }
             settings.actions.forEach(function (el) {
               var
-                icon = el[fields.icon] ? '<i class="' + module.helpers.deQuote(el[fields.icon]) + ' icon"></i>' : '',
+                icon = el[fields.icon] ? '<i '+(el[fields.text] ? 'aria-hidden="true"' : '')+' class="' + module.helpers.deQuote(el[fields.icon]) + ' icon"></i>' : '',
                 text = module.helpers.escape(el[fields.text] || '', settings.preserveHTML),
                 cls = module.helpers.deQuote(el[fields.class] || ''),
                 click = el[fields.click] && $.isFunction(el[fields.click]) ? el[fields.click] : function () {}
               ;
               $actions.append($('<button/>', {
                 html: icon + text,
+                'aria-label': (el[fields.text] || el[fields.icon] || '').replace(/<[^>]+(>|$)/g,''),
                 class: className.button + ' ' + cls,
                 click: function () {
                   if (click.call(element, $module) === false) {
@@ -11956,8 +11966,6 @@ $.fn.flyout = function(parameters) {
             });
           }
 
-          module.create.id();
-
           transitionEvent = module.get.transitionEvent();
 
           // avoids locking rendering if initialized in onReady
@@ -11976,6 +11984,9 @@ $.fn.flyout = function(parameters) {
             module.setup.heights();
             module.bind.resize();
           }
+          module.refreshInputs();
+          module.bind.events();
+          module.observeChanges();
           module.instantiate();
 
           if(settings.autoShow){
@@ -11994,30 +12005,37 @@ $.fn.flyout = function(parameters) {
         create: {
           flyout: function() {
             module.verbose('Programmaticaly create flyout', $context);
-            $module = $('<div/>', {class: className.flyout});
+            $module = $('<div/>', {class: className.flyout, role: 'dialog', 'aria-modal': settings.dimPage});
             if (settings.closeIcon) {
-              $close = $('<i/>', {class: className.close})
-              $module.append($close);
+              $closeIcon = $('<i/>', {class: className.close, role: 'button', tabindex: 0, 'aria-label': settings.text.close})
+              $module.append($closeIcon);
             }
             if (settings.title !== '') {
-              $('<div/>', {class: className.header}).appendTo($module);
+              var titleId = '_' + module.get.id() + 'title';
+              $module.attr('aria-labelledby', titleId);
+              $('<div/>', {class: className.header, id: titleId}).appendTo($module);
             }
             if (settings.content !== '') {
-              $('<div/>', {class: className.content}).appendTo($module);
+              var descId = '_' + module.get.id() + 'desc';
+              $module.attr('aria-describedby', descId);
+              $('<div/>', {class: className.content, id: descId}).appendTo($module);
             }
             if (module.has.configActions()) {
               $('<div/>', {class: className.actions}).appendTo($module);
             }
-            $context.append($module);
+            $module.prependTo($context);
           },
           id: function() {
-            id = (Math.random().toString(16) + '000000000').substr(2,8);
+            id = (Math.random().toString(16) + '000000000').slice(2, 10);
             elementNamespace = '.' + id;
             module.verbose('Creating unique id for element', id);
           }
         },
 
         destroy: function() {
+          if (observer) {
+            observer.disconnect();
+          }
           module.verbose('Destroying previous module for', $module);
           $module
             .off(eventNamespace)
@@ -12026,6 +12044,10 @@ $.fn.flyout = function(parameters) {
           if(module.is.ios()) {
             module.remove.ios();
           }
+          $closeIcon.off(elementNamespace);
+          if($inputs) {
+            $inputs.off(elementNamespace);
+          }
           // bound by uuid
           $context.off(elementNamespace);
           $window.off(elementNamespace);
@@ -12033,6 +12055,21 @@ $.fn.flyout = function(parameters) {
         },
 
         event: {
+          keyboard: function(event) {
+            var
+                keyCode   = event.which
+            ;
+            if(keyCode === settings.keys.escape) {
+              if(settings.closable) {
+                module.debug('Escape key pressed hiding flyout');
+                module.hide();
+              }
+              else {
+                module.debug('Escape key pressed, but closable is set to false');
+              }
+              event.preventDefault();
+            }
+          },
           resize: function() {
             module.setup.heights();
           },
@@ -12055,6 +12092,34 @@ $.fn.flyout = function(parameters) {
           close: function(event) {
             module.hide();
           },
+          closeKeyUp: function(event){
+            var
+                keyCode   = event.which
+            ;
+            if (keyCode === settings.keys.enter || keyCode === settings.keys.space) {
+              module.hide();
+            }
+          },
+          inputKeyDown: {
+            first: function(event) {
+              var
+                  keyCode = event.which
+              ;
+              if (keyCode === settings.keys.tab && event.shiftKey) {
+                $inputs.last().focus();
+                event.preventDefault();
+              }
+            },
+            last: function(event) {
+              var
+                  keyCode = event.which
+              ;
+              if (keyCode === settings.keys.tab && !event.shiftKey) {
+                $inputs.first().focus();
+                event.preventDefault();
+              }
+            }
+          },
           approve: function(event) {
             if (ignoreRepeatedEvents || settings.onApprove.call(module.element, $(this)) === false) {
               module.verbose('Approve callback returned false cancelling close');
@@ -12098,16 +12163,23 @@ $.fn.flyout = function(parameters) {
             module.verbose('Adding resize event to window', $window);
             $window.on('resize' + elementNamespace, module.event.resize);
           },
+          events: function() {
+            module.verbose('Attaching events');
+            $module
+                .on('click' + eventNamespace, selector.close, module.event.close)
+                .on('click' + eventNamespace, selector.approve, module.event.approve)
+                .on('click' + eventNamespace, selector.deny, module.event.deny)
+            ;
+            $closeIcon
+                .on('keyup' + elementNamespace, module.event.closeKeyUp)
+            ;
+          },
           clickaway: function() {
             module.verbose('Adding clickaway events to context', $context);
             $context
               .on('click'    + elementNamespace, module.event.clickaway)
               .on('touchend' + elementNamespace, module.event.clickaway)
             ;
-
-            $module.on('click' + elementNamespace, settings.selector.close, module.event.close);
-            $module.on('click' + elementNamespace, settings.selector.approve, module.event.approve);
-            $module.on('click' + elementNamespace, settings.selector.deny, module.event.deny);
           },
           scrollLock: function() {
             if(settings.scrollLock) {
@@ -12194,7 +12266,7 @@ $.fn.flyout = function(parameters) {
               if(direction === 'left' || direction === 'right') {
                 module.debug('Adding CSS rules for animation distance', width);
                 style  += ''
-                  + ' body.pushable > .ui.visible.' + direction + '.flyout ~ .pusher:after {'
+                  + ' body.pushable > .ui.visible.' + direction + '.flyout ~ .pusher::after {'
                   + '   -webkit-transform: translate3d('+ distance[direction] + 'px, 0, 0);'
                   + '           transform: translate3d('+ distance[direction] + 'px, 0, 0);'
                   + ' }'
@@ -12202,7 +12274,7 @@ $.fn.flyout = function(parameters) {
               }
               else if(direction === 'top' || direction == 'bottom') {
                 style  += ''
-                  + ' body.pushable > .ui.visible.' + direction + '.flyout ~ .pusher:after {'
+                  + ' body.pushable > .ui.visible.' + direction + '.flyout ~ .pusher::after {'
                   + '   -webkit-transform: translate3d(0, ' + distance[direction] + 'px, 0);'
                   + '           transform: translate3d(0, ' + distance[direction] + 'px, 0);'
                   + ' }'
@@ -12210,8 +12282,8 @@ $.fn.flyout = function(parameters) {
               }
               /* opposite sides visible forces content overlay */
               style += ''
-                + ' body.pushable > .ui.visible.left.flyout ~ .ui.visible.right.flyout ~ .pusher:after,'
-                + ' body.pushable > .ui.visible.right.flyout ~ .ui.visible.left.flyout ~ .pusher:after {'
+                + ' body.pushable > .ui.visible.left.flyout ~ .ui.visible.right.flyout ~ .pusher::after,'
+                + ' body.pushable > .ui.visible.right.flyout ~ .ui.visible.left.flyout ~ .pusher::after {'
                 + '   -webkit-transform: translate3d(0, 0, 0);'
                 + '           transform: translate3d(0, 0, 0);'
                 + ' }'
@@ -12222,13 +12294,30 @@ $.fn.flyout = function(parameters) {
               .appendTo($head)
             ;
             module.debug('Adding sizing css to head', $style);
+          },
+          keyboardShortcuts: function() {
+            module.verbose('Adding keyboard shortcuts');
+            $document
+                .on('keydown' + eventNamespace, module.event.keyboard)
+            ;
+          }
+        },
+        observeChanges: function() {
+          if('MutationObserver' in window) {
+            observer = new MutationObserver(function(mutations) {
+              module.refreshInputs();
+            });
+            observer.observe(element, {
+              childList : true,
+              subtree   : true
+            });
+            module.debug('Setting up mutation observer', observer);
           }
         },
-
         refresh: function() {
           module.verbose('Refreshing selector cache');
-          $context  = [window,document].indexOf(settings.context) < 0 ? $(document).find(settings.context) : $(settings.context);
-          $flyouts = $context.children(selector.flyout);
+          $context  = [window,document].indexOf(settings.context) < 0 ? $document.find(settings.context) : $body;
+          module.refreshFlyouts();
           $pusher   = $context.children(selector.pusher);
           module.clear.cache();
         },
@@ -12238,11 +12327,24 @@ $.fn.flyout = function(parameters) {
           $flyouts = $context.children(selector.flyout);
         },
 
-        repaint: function() {
-          module.verbose('Forcing repaint event');
-          element.style.display = 'none';
-          element.scrollTop = element.scrollTop;
-          element.style.display = '';
+        refreshInputs: function(){
+          if($inputs){
+            $inputs
+                .off('keydown' + elementNamespace)
+            ;
+          }
+          if(!settings.dimPage){
+            return;
+          }
+          $inputs    = $module.find('[tabindex], :input').filter(':visible').filter(function() {
+            return $(this).closest('.disabled').length === 0;
+          });
+          $inputs.first()
+              .on('keydown' + elementNamespace, module.event.inputKeyDown.first)
+          ;
+          $inputs.last()
+              .on('keydown' + elementNamespace, module.event.inputKeyDown.last)
+          ;
         },
 
         setup: {
@@ -12314,7 +12416,10 @@ $.fn.flyout = function(parameters) {
             : function(){}
           ;
           if(module.is.hidden()) {
-            module.refreshFlyouts();
+            if(settings.onShow.call(element) === false) {
+              module.verbose('Show callback returned false cancelling show');
+              return;
+            }
             module.refresh();
             if(module.othersActive()) {
               module.debug('Other flyouts currently visible');
@@ -12324,12 +12429,19 @@ $.fn.flyout = function(parameters) {
                 ignoreRepeatedEvents = false;
               }
             }
+            module.set.dimmerStyles();
             module.pushPage(function() {
               callback.call(element);
-              settings.onShow.call(element);
+              settings.onVisible.call(element);
+              if(settings.keyboardShortcuts) {
+                module.add.keyboardShortcuts();
+              }
+              module.save.focus();
+              if(settings.autofocus) {
+                module.set.autofocus();
+              }
             });
             settings.onChange.call(element);
-            settings.onVisible.call(element);
           }
           else {
             module.debug('Flyout is already visible');
@@ -12354,6 +12466,7 @@ $.fn.flyout = function(parameters) {
               if($.isFunction(settings.onHidden)) {
                 settings.onHidden.call(element);
               }
+              module.restore.focus();
             });
             settings.onChange.call(element);
           }
@@ -12407,7 +12520,6 @@ $.fn.flyout = function(parameters) {
             : function(){}
           ;
           module.set.overlay();
-          module.repaint();
           if(settings.returnScroll) {
             currentScroll = (isBody ? $window : $context).scrollTop();
           }
@@ -12450,18 +12562,25 @@ $.fn.flyout = function(parameters) {
           module.unbind.clickaway();
           if(!module.othersActive()) {
             module.unbind.scrollLock();
+            if( settings.keyboardShortcuts ) {
+              module.remove.keyboardShortcuts();
+            }
           }
 
+
           animate = function() {
             module.set.overlay();
             module.set.animating();
+            if(settings.dimPage && !module.othersVisible()) {
+              module.set.closing();
+            }
             module.remove.visible();
-            
           };
           transitionEnd = function(event) {
             if( event.target == $module[0] ) {
               $module.off(transitionEvent + elementNamespace, transitionEnd);
               module.remove.animating();
+              module.remove.closing();
               module.remove.overlay();
               module.remove.inlineCSS();
               if(settings.returnScroll) {
@@ -12497,6 +12616,25 @@ $.fn.flyout = function(parameters) {
         },
 
         set: {
+          autofocus: function() {
+            var
+                $autofocus = $inputs.filter('[autofocus]'),
+                $input     = ($autofocus.length > 0)
+                    ? $autofocus.first()
+                    : ($inputs.length > 1 ? $inputs.filter(':not(i.close)') : $inputs).first()
+            ;
+            if($input.length > 0) {
+              $input.focus();
+            }
+          },
+          dimmerStyles: function() {
+            if(settings.blurring) {
+              $pusher.addClass(className.blurring);
+            }
+            else {
+              $pusher.removeClass(className.blurring);
+            }
+          },
           bodyMargin: function() {
             var position = module.can.leftBodyScrollbar() ? 'left':'right';
             $context.css((isBody ? 'margin-':'padding-')+position, tempBodyMargin + 'px');
@@ -12534,6 +12672,9 @@ $.fn.flyout = function(parameters) {
           animating: function() {
             $module.addClass(className.animating);
           },
+          closing: function() {
+            $pusher.addClass(className.closing);
+          },
           direction: function(direction) {
             direction = direction || module.get.direction();
             $module.addClass(className[direction]);
@@ -12553,6 +12694,12 @@ $.fn.flyout = function(parameters) {
               $style.remove();
             }
           },
+          keyboardShortcuts: function() {
+            module.verbose('Removing keyboard shortcuts');
+            $document
+                .off('keydown' + eventNamespace)
+            ;
+          },
 
           // ios scroll on html not document
           ios: function() {
@@ -12574,6 +12721,9 @@ $.fn.flyout = function(parameters) {
           animating: function() {
             $module.removeClass(className.animating);
           },
+          closing: function() {
+            $pusher.removeClass(className.closing);
+          },
           direction: function(direction) {
             direction = direction || module.get.direction();
             $module.removeClass(className[direction]);
@@ -12587,7 +12737,6 @@ $.fn.flyout = function(parameters) {
         },
 
         get: {
-          
           direction: function() {
             if($module.hasClass(className.top)) {
               return className.top;
@@ -12617,6 +12766,12 @@ $.fn.flyout = function(parameters) {
               }
             }
           },
+          id: function() {
+            return id;
+          },
+          element: function() {
+            return $module;
+          },
           settings: function() {
             return settings;
           }
@@ -12632,6 +12787,15 @@ $.fn.flyout = function(parameters) {
         },
 
         save: {
+          focus: function() {
+            var
+                $activeElement = $(document.activeElement),
+                inCurrentFlyout = $activeElement.closest($module).length > 0
+            ;
+            if(!inCurrentFlyout) {
+              $focusedElement = $(document.activeElement).blur();
+            }
+          },
           bodyMargin: function() {
             initialBodyMargin = $context.css((isBody ? 'margin-':'padding-')+(module.can.leftBodyScrollbar() ? 'left':'right'));
             var bodyMarginRightPixel = parseInt(initialBodyMargin.replace(/[^\d.]/g, '')),
@@ -12727,6 +12891,11 @@ $.fn.flyout = function(parameters) {
         },
 
         restore: {
+          focus: function() {
+            if($focusedElement && $focusedElement.length > 0 && settings.restoreFocus) {
+              $focusedElement.focus();
+            }
+          },
           bodyMargin: function() {
             var position = module.can.leftBodyScrollbar() ? 'left':'right';
             $context.css((isBody ? 'margin-':'padding-')+position, initialBodyMargin);
@@ -12762,7 +12931,7 @@ $.fn.flyout = function(parameters) {
                 }
             ;
             if(shouldEscape.test(string)) {
-              string = string.replace(/&(?![a-z0-9#]{1,6};)/, "&amp;");
+              string = string.replace(/&(?![a-z0-9#]{1,12};)/gi, "&amp;");
               return string.replace(badChars, escapedChar);
             }
             return string;
@@ -12980,12 +13149,16 @@ $.fn.flyout.settings = {
   context      : 'body',
   exclusive    : false,
   closable     : true,
+  autofocus    : true,
+  restoreFocus : true,
   dimPage      : true,
   scrollLock   : false,
   returnScroll : false,
   delaySetup   : false,
   autoShow     : false,
 
+  keyboardShortcuts: true,
+
   //dynamic content
   title        : '',
   content      : '',
@@ -13014,6 +13187,13 @@ $.fn.flyout.settings = {
   onApprove    : function(){},
   onDeny       : function(){},
 
+  keys : {
+    space      : 32,
+    enter      : 13,
+    escape     : 27,
+    tab        :  9,
+  },
+
   className    : {
     flyout     : 'ui flyout',
     close      : 'close icon',
@@ -13022,6 +13202,8 @@ $.fn.flyout.settings = {
     actions    : 'actions',
     active     : 'active',
     animating  : 'animating',
+    blurring   : 'blurring',
+    closing    : 'closing',
     dimmed     : 'dimmed',
     ios        : 'ios',
     locked     : 'locked',
@@ -13070,7 +13252,8 @@ $.fn.flyout.settings = {
 
   text: {
     ok     : 'Ok',
-    cancel : 'Cancel'
+    cancel : 'Cancel',
+    close : 'Close'
   }
 };
 
@@ -13162,7 +13345,7 @@ $.fn.flyout.settings.templates = {
 })( jQuery, window, document );
 
 /*!
- * # Fomantic-UI 2.9.0-beta.317+6a18b84 - Modal
+ * # Fomantic-UI 2.9.0-beta.319+0740de8 - Modal
  * http://github.com/fomantic/Fomantic-UI/
  *
  *
@@ -14718,7 +14901,7 @@ $.fn.modal.settings.templates = {
 })( jQuery, window, document );
 
 /*!
- * # Fomantic-UI 2.9.0-beta.317+6a18b84 - Nag
+ * # Fomantic-UI 2.9.0-beta.319+0740de8 - Nag
  * http://github.com/fomantic/Fomantic-UI/
  *
  *
@@ -15277,7 +15460,7 @@ $.extend( $.easing, {
 })( jQuery, window, document );
 
 /*!
- * # Fomantic-UI 2.9.0-beta.317+6a18b84 - Popup
+ * # Fomantic-UI 2.9.0-beta.319+0740de8 - Popup
  * http://github.com/fomantic/Fomantic-UI/
  *
  *
@@ -16813,7 +16996,7 @@ $.fn.popup.settings = {
 })( jQuery, window, document );
 
 /*!
- * # Fomantic-UI 2.9.0-beta.317+6a18b84 - Progress
+ * # Fomantic-UI 2.9.0-beta.319+0740de8 - Progress
  * http://github.com/fomantic/Fomantic-UI/
  *
  *
@@ -17850,7 +18033,7 @@ $.fn.progress.settings = {
 })( jQuery, window, document );
 
 /*!
- * # Fomantic-UI 2.9.0-beta.317+6a18b84 - Slider
+ * # Fomantic-UI 2.9.0-beta.319+0740de8 - Slider
  * http://github.com/fomantic/Fomantic-UI/
  *
  *
@@ -19204,7 +19387,7 @@ $.fn.slider.settings = {
 })( jQuery, window, document );
 
 /*!
- * # Fomantic-UI 2.9.0-beta.317+6a18b84 - Rating
+ * # Fomantic-UI 2.9.0-beta.319+0740de8 - Rating
  * http://github.com/fomantic/Fomantic-UI/
  *
  *
@@ -19763,7 +19946,7 @@ $.fn.rating.settings = {
 })( jQuery, window, document );
 
 /*!
- * # Fomantic-UI 2.9.0-beta.317+6a18b84 - Search
+ * # Fomantic-UI 2.9.0-beta.319+0740de8 - Search
  * http://github.com/fomantic/Fomantic-UI/
  *
  *
@@ -21358,7 +21541,7 @@ $.extend($.easing, {
 })( jQuery, window, document );
 
 /*!
- * # Fomantic-UI 2.9.0-beta.317+6a18b84 - Shape
+ * # Fomantic-UI 2.9.0-beta.319+0740de8 - Shape
  * http://github.com/fomantic/Fomantic-UI/
  *
  *
@@ -22207,7 +22390,7 @@ $.fn.shape.settings = {
 })( jQuery, window, document );
 
 /*!
- * # Fomantic-UI 2.9.0-beta.317+6a18b84 - Sidebar
+ * # Fomantic-UI 2.9.0-beta.319+0740de8 - Sidebar
  * http://github.com/fomantic/Fomantic-UI/
  *
  *
@@ -22275,7 +22458,7 @@ $.fn.sidebar = function(parameters) {
         moduleNamespace = 'module-' + namespace,
 
         $module         = $(this),
-        $context        = [window,document].indexOf(settings.context) < 0 ? $(document).find(settings.context) : $body,
+        $context        = [window,document].indexOf(settings.context) < 0 ? $document.find(settings.context) : $body,
         isBody          = $context[0] === $body[0],
 
         $sidebars       = $module.children(selector.sidebar),
@@ -22513,8 +22696,8 @@ $.fn.sidebar = function(parameters) {
 
         refresh: function() {
           module.verbose('Refreshing selector cache');
-          $context  = [window,document].indexOf(settings.context) < 0 ? $(document).find(settings.context) : $(settings.context);
-          $sidebars = $context.children(selector.sidebar);
+          $context  = [window,document].indexOf(settings.context) < 0 ? $document.find(settings.context) : $body;
+          module.refreshSidebars();
           $pusher   = $context.children(selector.pusher);
           $fixed    = $context.children(selector.fixed);
           module.clear.cache();
@@ -22609,7 +22792,6 @@ $.fn.sidebar = function(parameters) {
               module.verbose('Show callback returned false cancelling show');
               return;
             }
-            module.refreshSidebars();
             if(settings.overlay)  {
               module.error(error.overlay);
               settings.transition = 'overlay';
@@ -22631,6 +22813,7 @@ $.fn.sidebar = function(parameters) {
                 settings.transition = 'overlay';
               }
             }
+            module.set.dimmerStyles();
             module.pushPage(function() {
               callback.call(element);
               settings.onVisible.call(element);
@@ -22763,20 +22946,24 @@ $.fn.sidebar = function(parameters) {
           animate = function() {
             module.set.transition(transition);
             module.set.animating();
-            module.remove.visible();
             if(settings.dimPage && !module.othersVisible()) {
-              $pusher.removeClass(className.dimmed);
+              module.set.closing();
             }
+            module.remove.visible();
           };
           transitionEnd = function(event) {
             if( event.target == $transition[0] ) {
               $transition.off(transitionEvent + elementNamespace, transitionEnd);
               module.remove.animating();
+              module.remove.closing();
               module.remove.transition();
               module.remove.inlineCSS();
               if(transition === 'scale down' || settings.returnScroll) {
                 module.scrollBack();
               }
+              if(settings.dimPage && !module.othersVisible()) {
+                $pusher.removeClass(className.dimmed);
+              }
               callback.call(element);
             }
           };
@@ -22814,6 +23001,14 @@ $.fn.sidebar = function(parameters) {
               el.css(attribute, 'calc(' + el.css(attribute) + ' + ' + tempBodyMargin + 'px)');
             });
           },
+          dimmerStyles: function() {
+            if(settings.blurring) {
+              $pusher.addClass(className.blurring);
+            }
+            else {
+              $pusher.removeClass(className.blurring);
+            }
+          },
           // ios only (scroll on html not document). This prevent auto-resize canvas/scroll in ios
           // (This is no longer necessary in latest iOS)
           ios: function() {
@@ -22840,6 +23035,9 @@ $.fn.sidebar = function(parameters) {
           animating: function() {
             $module.addClass(className.animating);
           },
+          closing: function() {
+            $pusher.addClass(className.closing);
+          },
           transition: function(transition) {
             transition = transition || module.get.transition();
             $module.addClass(transition);
@@ -22884,6 +23082,9 @@ $.fn.sidebar = function(parameters) {
           animating: function() {
             $module.removeClass(className.animating);
           },
+          closing: function() {
+            $pusher.removeClass(className.closing);
+          },
           transition: function(transition) {
             transition = transition || module.get.transition();
             $module.removeClass(transition);
@@ -23281,6 +23482,8 @@ $.fn.sidebar.settings = {
   className         : {
     active    : 'active',
     animating : 'animating',
+    blurring  : 'blurring',
+    closing   : 'closing',
     dimmed    : 'dimmed',
     ios       : 'ios',
     locked    : 'locked',
@@ -23321,7 +23524,7 @@ $.fn.sidebar.settings = {
 })( jQuery, window, document );
 
 /*!
- * # Fomantic-UI 2.9.0-beta.317+6a18b84 - Sticky
+ * # Fomantic-UI 2.9.0-beta.319+0740de8 - Sticky
  * http://github.com/fomantic/Fomantic-UI/
  *
  *
@@ -24272,7 +24475,7 @@ $.fn.sticky.settings = {
 })( jQuery, window, document );
 
 /*!
- * # Fomantic-UI 2.9.0-beta.317+6a18b84 - Tab
+ * # Fomantic-UI 2.9.0-beta.319+0740de8 - Tab
  * http://github.com/fomantic/Fomantic-UI/
  *
  *
@@ -25292,7 +25495,7 @@ $.fn.tab.settings = {
 })( jQuery, window, document );
 
 /*!
- * # Fomantic-UI 2.9.0-beta.317+6a18b84 - Toast
+ * # Fomantic-UI 2.9.0-beta.319+0740de8 - Toast
  * http://github.com/fomantic/Fomantic-UI/
  *
  *
@@ -26219,7 +26422,7 @@ $.extend( $.easing, {
 })( jQuery, window, document );
 
 /*!
- * # Fomantic-UI 2.9.0-beta.317+6a18b84 - Transition
+ * # Fomantic-UI 2.9.0-beta.319+0740de8 - Transition
  * http://github.com/fomantic/Fomantic-UI/
  *
  *
@@ -27334,7 +27537,7 @@ $.fn.transition.settings = {
 })( jQuery, window, document );
 
 /*!
- * # Fomantic-UI 2.9.0-beta.317+6a18b84 - API
+ * # Fomantic-UI 2.9.0-beta.319+0740de8 - API
  * http://github.com/fomantic/Fomantic-UI/
  *
  *
@@ -28571,7 +28774,7 @@ $.api.settings = {
 })( jQuery, window, document );
 
 /*!
- * # Fomantic-UI 2.9.0-beta.317+6a18b84 - State
+ * # Fomantic-UI 2.9.0-beta.319+0740de8 - State
  * http://github.com/fomantic/Fomantic-UI/
  *
  *
@@ -29283,7 +29486,7 @@ $.fn.state.settings = {
 })( jQuery, window, document );
 
 /*!
- * # Fomantic-UI 2.9.0-beta.317+6a18b84 - Visibility
+ * # Fomantic-UI 2.9.0-beta.319+0740de8 - Visibility
  * http://github.com/fomantic/Fomantic-UI/
  *
  *