RubyGems - upjs-rails - Versions diffs - 0.3.0 → 0.3.2 - Mend

upjs-rails 0.3.0 → 0.3.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (24) hide show

checksums.yaml +4 -4
data/dist/up.css +5 -1
data/dist/up.js +239 -95
data/dist/up.min.css +1 -1
data/dist/up.min.js +1 -1
data/lib/assets/javascripts/up.js.coffee +6 -2
data/lib/assets/javascripts/up/browser.js.coffee +52 -0
data/lib/assets/javascripts/up/flow.js.coffee +9 -2
data/lib/assets/javascripts/up/form.js.coffee +4 -0
data/lib/assets/javascripts/up/history.js.coffee +10 -6
data/lib/assets/javascripts/up/magic.js.coffee +4 -0
data/lib/assets/javascripts/up/marker.js.coffee +4 -2
data/lib/assets/javascripts/up/modal.js.coffee +1 -1
data/lib/assets/javascripts/up/motion.js.coffee +28 -26
data/lib/assets/javascripts/up/popup.js.coffee +1 -1
data/lib/assets/javascripts/up/util.js.coffee +99 -38
data/lib/assets/stylesheets/up/modal.css.sass +7 -2
data/lib/upjs/rails/version.rb +1 -1
data/spec_app/spec/javascripts/helpers/reset_path.js.coffee +1 -1
data/spec_app/spec/javascripts/up/flow_spec.js.coffee +90 -68
data/spec_app/spec/javascripts/up/form_spec.js.coffee +90 -77
data/spec_app/spec/javascripts/up/link_spec.js.coffee +35 -24
data/spec_app/spec/javascripts/up/navigation_spec.js.coffee +52 -50
metadata +2 -2

checksums.yaml CHANGED Viewed

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: 58b9bda1086a0ac50783289b009de30dd0ffa228
-  data.tar.gz: 83901a4346b18ede730a146b6409e0b50fc7d4d5
+  metadata.gz: f2bd908d4b8ae9ccc80617aab947a39f49e91cd6
+  data.tar.gz: 3d82e0f710813f128f9e8ae4aa48311b0990c04f
 SHA512:
-  metadata.gz: 948fc5f12e782d99b428761a381cb8ea61ea5158d47fb1c6ac3820863bd57614a8cd6a89afe89bc408ea71307656824ac65966350247d834869adb1c74c98d99
-  data.tar.gz: 364e9d0048c8d594f2de7786ee7d4f559179683e71fe4de6dafe7e084cc263e814f8cadf3bcae9911e34073be32c916bebe015375390c016115729b15bf69b78
+  metadata.gz: 8eac37753503ff8163ff92fc7e37b34c3a8c20a1d76033e0f5784ed6077f52cd4b4bb8e84cc3584c68e83d559f9e7f5a2d62eb9a89f292408de556428a1bfbe3
+  data.tar.gz: e8fe7e337a8c754f45b5fe0b5e849ed79d60a8bb95b819a33236a4d98178ddaa4d228489cd48f854099692b31f2f8e21b757e85c2cf03e0ff7afa5f6fd31a4c5

data/dist/up.css CHANGED Viewed

@@ -16,6 +16,8 @@
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
+  -ms-transform: translate(-50%, -50%);
+  -webkit-transform: translate(-50%, -50%);
   max-width: 100%;
   max-height: 100%;
   background-color: #fff;
@@ -35,7 +37,9 @@
   font-weight: bold;
   text-transform: uppercase;
   cursor: pointer;
-  transform: translateY(-100%); }
+  transform: translateY(-100%);
+  -ms-transform: translateY(-100%);
+  -webkit-transform: translateY(-100%); }
 .up-modal-content {
   overflow-x: hidden;

data/dist/up.js CHANGED Viewed

@@ -25,7 +25,7 @@ If you use them in your own code, you will get hurt.
   var __slice = [].slice;
   up.util = (function() {
-    var $createElementFromSelector, ajax, castsToFalse, castsToTrue, clientSize, contains, copy, copyAttributes, createElement, createElementFromHtml, createSelectorFromElement, cssAnimate, detect, each, error, escapePressed, extend, findWithSelf, forceCompositing, get, ifGiven, isArray, isBlank, isDefined, isFunction, isGiven, isHash, isJQuery, isMissing, isNull, isObject, isPresent, isPromise, isStandardPort, isString, isUndefined, last, locationFromXhr, measure, merge, nextFrame, normalizeUrl, option, options, prependGhost, presence, presentAttr, select, temporaryCss, unwrap;
+    var $createElementFromSelector, ajax, castsToFalse, castsToTrue, clientSize, contains, copy, copyAttributes, createElement, createElementFromHtml, createSelectorFromElement, cssAnimate, detect, each, error, escapePressed, extend, findWithSelf, forceCompositing, get, ifGiven, isArray, isBlank, isDefined, isFunction, isGiven, isHash, isJQuery, isMissing, isNull, isObject, isPresent, isPromise, isStandardPort, isString, isUndefined, keys, last, locationFromXhr, measure, merge, nextFrame, normalizeUrl, only, option, options, prependGhost, presence, presentAttr, resolvedPromise, select, temporaryCss, trim, unwrap;
     get = function(url, options) {
       options = options || {};
       options.url = url;
@@ -126,7 +126,9 @@ If you use them in your own code, you will get hurt.
     createElement = function(tagName, html) {
       var element;
       element = document.createElement(tagName);
-      element.innerHTML = html;
+      if (isPresent(html)) {
+        element.innerHTML = html;
+      }
       return element;
     };
     error = function() {
@@ -153,17 +155,47 @@ If you use them in your own code, you will get hurt.
       return selector;
     };
     createElementFromHtml = function(html) {
-      var htmlElementPattern, innerHtml, match;
-      htmlElementPattern = /<html>((?:.|\n)*)<\/html>/i;
-      innerHtml = void 0;
-      if (match = html.match(htmlElementPattern)) {
-        innerHtml = match[1];
+      var anything, bodyElement, bodyMatch, bodyPattern, capture, closeTag, headElement, htmlElement, openTag, titleElement, titleMatch, titlePattern;
+      openTag = function(tag) {
+        return "<" + tag + "(?: [^>]*)?>";
+      };
+      closeTag = function(tag) {
+        return "</" + tag + ">";
+      };
+      anything = '(?:.|\\n)*?';
+      capture = function(pattern) {
+        return "(" + pattern + ")";
+      };
+      titlePattern = new RegExp(openTag('head') + anything + openTag('title') + capture(anything) + closeTag('title') + anything + closeTag('body'), 'i');
+      bodyPattern = new RegExp(openTag('body') + capture(anything) + closeTag('body'), 'i');
+      if (bodyMatch = html.match(bodyPattern)) {
+        htmlElement = document.createElement('html');
+        bodyElement = createElement('body', bodyMatch[1]);
+        htmlElement.appendChild(bodyElement);
+        if (titleMatch = html.match(titlePattern)) {
+          headElement = createElement('head');
+          htmlElement.appendChild(headElement);
+          titleElement = createElement('title', titleMatch[1]);
+          headElement.appendChild(titleElement);
+        }
+        return htmlElement;
       } else {
-        innerHtml = "<html><body>" + html + "</body></html>";
+        return createElement('div', html);
       }
-      return createElement('html', innerHtml);
     };
     extend = $.extend;
+    trim = $.trim;
+    keys = Object.keys || function(object) {
+      var key, result, _i, _len;
+      result = [];
+      for (_i = 0, _len = object.length; _i < _len; _i++) {
+        key = object[_i];
+        if (object.hasOwnProperty(key)) {
+          result.push(key);
+        }
+      }
+      return result;
+    };
     each = function(collection, block) {
       var index, item, _i, _len, _results;
       _results = [];
@@ -189,7 +221,7 @@ If you use them in your own code, you will get hurt.
       return !isMissing(object);
     };
     isBlank = function(object) {
-      return isMissing(object) || (isObject(object) && Object.keys(object).length === 0) || (object.length === 0);
+      return isMissing(object) || (isObject(object) && keys(object).length === 0) || (object.length === 0);
     };
     presence = function(object, checker) {
       if (checker == null) {
@@ -227,7 +259,9 @@ If you use them in your own code, you will get hurt.
         return object;
       }
     };
-    isArray = Array.isArray;
+    isArray = Array.isArray || function(object) {
+      return Object.prototype.toString.call(object) === '[object Array]';
+    };
     copy = function(object) {
       if (isArray(object)) {
         return object.slice();
@@ -274,35 +308,32 @@ If you use them in your own code, you will get hurt.
     @param {Array} args...
      */
     option = function() {
-      var args, match;
+      var arg, args, match, value, _i, _len;
       args = 1 <= arguments.length ? __slice.call(arguments, 0) : [];
       match = null;
-      args.every(function(arg) {
-        var value;
+      for (_i = 0, _len = args.length; _i < _len; _i++) {
+        arg = args[_i];
         value = arg;
         if (isFunction(value)) {
           value = value();
         }
         if (isPresent(value)) {
           match = value;
-          return false;
-        } else {
-          return true;
+          break;
         }
-      });
+      }
       return match;
     };
     detect = function(array, tester) {
-      var match;
+      var element, match, _i, _len;
       match = null;
-      array.every(function(element) {
+      for (_i = 0, _len = array.length; _i < _len; _i++) {
+        element = array[_i];
         if (tester(element)) {
           match = element;
-          return false;
-        } else {
-          return true;
+          break;
         }
-      });
+      }
       return match;
     };
     select = function(array, tester) {
@@ -345,7 +376,7 @@ If you use them in your own code, you will get hurt.
     };
     temporaryCss = function($element, css, block) {
       var memo, oldCss;
-      oldCss = $element.css(Object.keys(css));
+      oldCss = $element.css(keys(css));
       $element.css(css);
       memo = function() {
         return $element.css(oldCss);
@@ -395,28 +426,33 @@ If you use them in your own code, you will get hurt.
      */
     cssAnimate = function(elementOrSelector, lastFrame, opts) {
       var $element, deferred, transition, withoutCompositing, withoutTransition;
-      opts = options(opts, {
-        duration: 300,
-        delay: 0,
-        easing: 'ease'
-      });
       $element = $(elementOrSelector);
-      deferred = $.Deferred();
-      transition = {
-        'transition-property': Object.keys(lastFrame).join(', '),
-        'transition-duration': opts.duration + "ms",
-        'transition-delay': opts.delay + "ms",
-        'transition-timing-function': opts.easing
-      };
-      withoutCompositing = forceCompositing($element);
-      withoutTransition = temporaryCss($element, transition);
-      $element.css(lastFrame);
-      deferred.then(withoutCompositing);
-      deferred.then(withoutTransition);
-      setTimeout((function() {
-        return deferred.resolve();
-      }), opts.duration + opts.delay);
-      return deferred.promise();
+      if (up.browser.canCssAnimation()) {
+        opts = options(opts, {
+          duration: 300,
+          delay: 0,
+          easing: 'ease'
+        });
+        deferred = $.Deferred();
+        transition = {
+          'transition-property': keys(lastFrame).join(', '),
+          'transition-duration': opts.duration + "ms",
+          'transition-delay': opts.delay + "ms",
+          'transition-timing-function': opts.easing
+        };
+        withoutCompositing = forceCompositing($element);
+        withoutTransition = temporaryCss($element, transition);
+        $element.css(lastFrame);
+        deferred.then(withoutCompositing);
+        deferred.then(withoutTransition);
+        setTimeout((function() {
+          return deferred.resolve();
+        }), opts.duration + opts.delay);
+        return deferred.promise();
+      } else {
+        $element.css(lastFrame);
+        return resolvedPromise();
+      }
     };
     measure = function($element, options) {
       var box, coordinates, viewport;
@@ -488,6 +524,24 @@ If you use them in your own code, you will get hurt.
     locationFromXhr = function(xhr) {
       return xhr.getResponseHeader('X-Up-Current-Location');
     };
+    only = function() {
+      var filtered, key, keys, object, _i, _len;
+      object = arguments[0], keys = 2 <= arguments.length ? __slice.call(arguments, 1) : [];
+      filtered = {};
+      for (_i = 0, _len = keys.length; _i < _len; _i++) {
+        key = keys[_i];
+        if (object.hasOwnProperty(key)) {
+          filtered[key] = object[key];
+        }
+      }
+      return filtered;
+    };
+    resolvedPromise = function() {
+      var deferred;
+      deferred = $.Deferred();
+      deferred.resolve();
+      return deferred.promise();
+    };
     return {
       presentAttr: presentAttr,
       createElement: createElement,
@@ -537,7 +591,11 @@ If you use them in your own code, you will get hurt.
       castsToTrue: castsToTrue,
       castsToFalse: castsToFalse,
       locationFromXhr: locationFromXhr,
-      clientSize: clientSize
+      clientSize: clientSize,
+      only: only,
+      trim: trim,
+      keys: keys,
+      resolvedPromise: resolvedPromise
     };
   })();
@@ -551,13 +609,76 @@ Browser interface
  */
 (function() {
+  var __slice = [].slice;
   up.browser = (function() {
-    var url;
+    var canCssAnimation, canPushState, ensureConsoleExists, isSupported, loadPage, memoize, u, url;
+    u = up.util;
+    loadPage = function(url, options) {
+      var $form, csrfParam, csrfToken, metadataInput, method, target;
+      if (options == null) {
+        options = {};
+      }
+      method = u.option(options.method, 'get').toLowerCase();
+      if (method === 'get') {
+        return location.href = url;
+      } else if ($.rails) {
+        target = options.target;
+        csrfToken = $.rails.csrfToken();
+        csrfParam = $.rails.csrfParam();
+        $form = $("<form method='post' action='" + url + "'></form>");
+        metadataInput = "<input name='_method' value='" + method + "' type='hidden' />";
+        if (u.isDefined(csrfParam) && u.isDefined(csrfToken)) {
+          metadataInput += "<input name='" + csrfParam + "' value='" + csrfToken + "' type='hidden' />";
+        }
+        if (target) {
+          $form.attr('target', target);
+        }
+        $form.hide().append(metadataInput).appendTo('body');
+        return $form.submit();
+      } else {
+        return error("Can't fake a " + (method.toUpperCase()) + " request without Rails UJS");
+      }
+    };
     url = function() {
       return location.href;
     };
+    ensureConsoleExists = function() {
+      var _base;
+      window.console || (window.console = {});
+      return (_base = window.console).log || (_base.log = function() {});
+    };
+    memoize = function(func) {
+      var cache, cached;
+      cache = void 0;
+      cached = false;
+      return function() {
+        var args;
+        args = 1 <= arguments.length ? __slice.call(arguments, 0) : [];
+        if (cached) {
+          return cache;
+        } else {
+          cached = true;
+          return cache = func.apply(null, args);
+        }
+      };
+    };
+    canPushState = memoize(function() {
+      return u.isDefined(history.pushState);
+    });
+    canCssAnimation = memoize(function() {
+      return 'transition' in document.documentElement.style;
+    });
+    isSupported = memoize(function() {
+      return u.isDefined(document.addEventListener);
+    });
     return {
-      url: url
+      url: url,
+      ensureConsoleExists: ensureConsoleExists,
+      loadPage: loadPage,
+      canPushState: canPushState,
+      canCssAnimation: canCssAnimation,
+      isSupported: isSupported
     };
   })();
@@ -720,6 +841,7 @@ We need to work on this page:
     @param {String} url
       The URL to fetch from the server.
     @param {String} [options.title]
+    @param {String} [options.method='get']
     @param {String|Boolean} [options.history=true]
       If a `String` is given, it is used as the URL the browser's location bar and history.
       If omitted or true, the `url` argument will be used.
@@ -732,10 +854,14 @@ We need to work on this page:
       var selector;
       options = u.options(options);
       selector = u.presence(selectorOrElement) ? selectorOrElement : u.createSelectorFromElement($(selectorOrElement));
+      if (!up.browser.canPushState() && !u.castsToFalse(options.history)) {
+        up.browser.loadPage(url, u.only(options, 'method'));
+        return;
+      }
       return u.ajax({
         url: url,
         selector: selector
-      }).done(function(html, textStatus, xhr) {
+      }, u.only(options, 'method')).done(function(html, textStatus, xhr) {
         var currentLocation;
         if (currentLocation = u.locationFromXhr(xhr)) {
           url = currentLocation;
@@ -778,7 +904,7 @@ We need to work on this page:
       _results = [];
       for (_i = 0, _len = _ref1.length; _i < _len; _i++) {
         step = _ref1[_i];
-        $old = u.presence($(".up-popup " + step.selector)) || u.presence($(".up-modal " + step.selector)) || u.presence($(step.selector));
+        $old = u.presence($(".up-popup " + step.selector)) || u.presence($(".up-modal " + step.selector)) || u.presence($(step.selector)) || u.error("Could not find selector (" + step.selector + ") in current body HTML");
         if (fragment = htmlElement.querySelector(step.selector)) {
           $new = $(fragment);
           _results.push(swapElements($old, $new, step.pseudoClass, step.transition, options));
@@ -981,6 +1107,9 @@ We need to work on this page:
     defaultLiveDescriptions = null;
     live = function(events, selector, behavior) {
       var description, _ref;
+      if (!up.browser.isSupported()) {
+        return;
+      }
       description = [
         events, selector, function(event) {
           return behavior.apply(this, [event, $(this)]);
@@ -1014,6 +1143,9 @@ We need to work on this page:
     awaken = function() {
       var args, awakener, options, selector;
       selector = arguments[0], args = 2 <= arguments.length ? __slice.call(arguments, 1) : [];
+      if (!up.browser.isSupported()) {
+        return;
+      }
       awakener = args.pop();
       options = u.options(args[0], {
         batch: false
@@ -1194,10 +1326,14 @@ We need to work on this page:
       }
     };
     manipulate = function(method, url) {
-      method += "State";
-      return window.history[method]({
-        fromUp: true
-      }, '', url);
+      if (up.browser.canPushState()) {
+        method += "State";
+        return window.history[method]({
+          fromUp: true
+        }, '', url);
+      } else {
+        return u.error("This browser doesn't support history.pushState");
+      }
     };
     pop = function(event) {
       var state;
@@ -1212,12 +1348,14 @@ We need to work on this page:
         return console.log("strange state", state);
       }
     };
-    setTimeout((function() {
-      $(window).on("popstate", pop);
-      return replace(up.browser.url(), {
-        force: true
-      });
-    }), 200);
+    if (up.browser.canPushState()) {
+      setTimeout((function() {
+        $(window).on("popstate", pop);
+        return replace(up.browser.url(), {
+          force: true
+        });
+      }), 200);
+    }
     return {
       push: push,
       replace: replace
@@ -1380,25 +1518,29 @@ We need to work on this page:
      */
     morph = function(source, target, transitionOrName, options) {
       var $new, $old, animation, parts, transition;
-      options = u.options(config);
-      $old = $(source);
-      $new = $(target);
-      transition = u.presence(transitionOrName, u.isFunction) || transitions[transitionOrName];
-      if (transition) {
-        return withGhosts($old, $new, function($oldGhost, $newGhost) {
-          return assertIsPromise(transition($oldGhost, $newGhost, options), ["Transition did not return a promise", transitionOrName]);
-        });
-      } else if (animation = animations[transitionOrName]) {
-        $old.hide();
-        return animate($new, animation, options);
-      } else if (u.isString(transitionOrName) && transitionOrName.indexOf('/') >= 0) {
-        parts = transitionOrName.split('/');
-        transition = function($old, $new, options) {
-          return $.when(animate($old, parts[0], options), animate($new, parts[1], options));
-        };
-        return morph($old, $new, transition, options);
+      if (up.browser.canCssAnimation()) {
+        options = u.options(config);
+        $old = $(source);
+        $new = $(target);
+        transition = u.presence(transitionOrName, u.isFunction) || transitions[transitionOrName];
+        if (transition) {
+          return withGhosts($old, $new, function($oldGhost, $newGhost) {
+            return assertIsPromise(transition($oldGhost, $newGhost, options), ["Transition did not return a promise", transitionOrName]);
+          });
+        } else if (animation = animations[transitionOrName]) {
+          $old.hide();
+          return animate($new, animation, options);
+        } else if (u.isString(transitionOrName) && transitionOrName.indexOf('/') >= 0) {
+          parts = transitionOrName.split('/');
+          transition = function($old, $new, options) {
+            return $.when(animate($old, parts[0], options), animate($new, parts[1], options));
+          };
+          return morph($old, $new, transition, options);
+        } else {
+          return u.error("Unknown transition: " + transitionOrName);
+        }
       } else {
-        return u.error("Unknown transition: " + transitionOrName);
+        return u.resolvedPromise();
       }
     };
@@ -1440,12 +1582,7 @@ We need to work on this page:
     @return {Promise}
       A resolved promise
      */
-    none = function() {
-      var deferred;
-      deferred = $.Deferred();
-      deferred.resolve();
-      return deferred.promise();
-    };
+    none = u.resolvedPromise;
     animation('none', none);
     animation('fade-in', function($ghost, options) {
       $ghost.css({
@@ -1875,6 +2012,10 @@ We need to work on this page:
       httpMethod = u.option(options.method, $form.attr('up-method'), $form.attr('data-method'), $form.attr('method'), 'post').toUpperCase();
       url = u.option(options.url, $form.attr('action'), up.browser.url());
       $form.addClass('up-active');
+      if (!up.browser.canPushState() && !u.castsToFalse(historyOption)) {
+        $form.get(0).submit();
+        return;
+      }
       request = {
         url: url,
         type: httpMethod,
@@ -2180,7 +2321,7 @@ We need to work on this page:
       origin = u.option(options.origin, $link.attr('up-origin'), config.origin);
       animation = u.option(options.animation, $link.attr('up-animation'), config.openAnimation);
       sticky = u.option(options.sticky, $link.is('[up-sticky]'));
-      history = u.option(options.history, $link.attr('up-history'), false);
+      history = up.browser.canPushState() ? u.option(options.history, $link.attr('up-history'), false) : false;
       close();
       $popup = createHiddenPopup($link, selector, sticky);
       return up.replace(selector, url, {
@@ -2404,7 +2545,7 @@ We need to work on this page:
       height = u.option(options.height, $link.attr('up-height'), config.height);
       animation = u.option(options.animation, $link.attr('up-animation'), config.openAnimation);
       sticky = u.option(options.sticky, $link.is('[up-sticky]'));
-      history = u.option(options.history, $link.attr('up-history'), true);
+      history = up.browser.canPushState() ? u.option(options.history, $link.attr('up-history'), true) : false;
       close();
       $modal = createHiddenModal(selector, width, height, sticky);
       return up.replace(selector, url, {
@@ -2740,12 +2881,13 @@ TODO: Write some documentation
 (function() {
   up.marker = (function() {
-    var check, hasContent;
+    var check, hasContent, u;
+    u = up.util;
     hasContent = function($marker) {
-      return $marker.html().trim() !== '';
+      return u.trim($marker.html()) !== '';
     };
     check = function($element) {
-      return up.util.findWithSelf($element, '[up-marker]').each(function() {
+      return u.findWithSelf($element, '[up-marker]').each(function() {
         var $marker;
         $marker = $(this);
         if (!hasContent($marker)) {
@@ -2773,10 +2915,12 @@ TODO: Write some documentation
 }).call(this);
 (function() {
-  up.bus.emit('framework:ready');
-  $(document).on('ready', function() {
-    return up.bus.emit('app:ready');
-  });
+  if (up.browser.isSupported()) {
+    up.browser.ensureConsoleExists();
+    up.bus.emit('framework:ready');
+    $(document).on('ready', function() {
+      return up.bus.emit('app:ready');
+    });
+  }
 }).call(this);