unpoly-rails 2.0.0.pre.rc10 → 2.1.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 7bd5baa3c26dc137e7944861528cbacbd458d842c20ed3864e07840161a62662
-  data.tar.gz: cbcf34505f475b8cbd062ab16081f49b98d904c027d0dfbd7c2a50c1871e0a09
+  metadata.gz: 498fefa239aae0cf36380af1a27d56a032a5fe3732268fdadc9961dd144af2d0
+  data.tar.gz: 21a984c788247f8bc5f68fc752ef18f48e5eb226a5c85d079473879f49791559
 SHA512:
-  metadata.gz: f679fc7972c6149277d204609026039daa94a4f802dfc5fbb2ec5f4926c926b2f9befa524a3e6b5fc7c1c8b63388733a230b0e7059eea172dc9b5afeea2add21
-  data.tar.gz: 122e0706cee0950c164dc5bf6aefc693edffa0e40218ae95037a13dacb7a1f911a9a5c04871c2e05b739a1cc47c958598ae384ed57a75bffad3c05124f872252
+  metadata.gz: 3ae83c5e9224620e5b594730b6baa488b5891dc2ec14351b071b079abfcab5e3eb01ffa2d0a288e984b7d1d20a00bdab19353a6f87120673682c0033dd21276e
+  data.tar.gz: 030fc977340f6979e7f25727ad91d0d4aeae773b8aeeb54ccbed4f946ffd1b1017a7c22c6d1496fc42a1a69d150949c2356d1c236d4e9827238b975c942173ef

data/CHANGELOG.md

@@ -3,67 +3,163 @@ Changelog
 
 Changes to this project will be documented in this file.
 
+If you're upgrading from an older Unpoly version you should load [`unpoly-migrate.js`](https://unpoly.com/changes/upgrading) to enable deprecated APIs.
+
 You may browse a formatted and hyperlinked version of this file at <https://unpoly.com/changes>.
 
 
+2.1.0
+-----
+
+- Unpoly now shows a [progress bar](/up.network.config#config.progressBar) that appears for [late requests](/up:request:late).
+- For new layers, the `[up-history-visible]` and `[up-history]` options have been unified into a single `[up-history]` option. This reverts to the old behavior of Unpoly 1.0. The separation into two options was introduced in Unpoly 2.0, but turned out to be confusing to users.
+- [Layer configuration](/up.layer.config) may now set mode-specific defaults for [`{ scroll }`](/scroll-option) and [`{ focus }`](/focus-option). These take precendence to defaults in [`up.fragment.config.navigateOptions`](/up.fragment.config#config.navigateOptions).
+- Links with an [`[up-instant]`](/a-up-instant) attribute are now followed automatically, even if they don't also have an [`[up-follow]`](/a-up-follow) attribute.
+
+
+1.0.1
+-----
+
+This is a maintenance release for Unpoly 1. Expect little to no additional changes for this legacy version. New features will only be added to Unpoly 2.
+
+- `up.request()` will now send Unpoly's version number as an `X-Up-Version` request header. Since `X-Up-Target` is optional in Unpoly 2, server-side integration libraries can look for `X-Up-Version` to reliably detect a fragment update for both Unpoly 1 and 2.
+- Fix a bug where the Unpoly banner would still be printed to the development console when `up.log.config.banner = false` is set. (fix by @adam12)
+
+
+2.0.1
+-----
+
+This bugfix release addresses some issues user reported when upgrading to Unpoly 2:
+
+- Fix a bug where [`unpoly-migrate.js`](https://unpoly.com/changes/upgrading) would crash when loaded.
+- Fix a bug where transitions would crash when some { scroll } options were also used (#187)
+- Users can now now change the spacing between a popup overlay and the opening link by giving `<up-popup>` a CSS margin.
+
+
 2.0.0
 -----
 
-[See Unpoly 2 slides](http://triskweline.de/unpoly2-slides/)
-
-TODO
-----
-
-This list is **far** from complete.
-
-- up.network.config.slowDelay is now 800 (up from 300)
-- up.network.config.cacheSize is now 50 (down from 70)
-- up.network.isBusy() / isIdle() takes preload events into account
--  up.observe() callback may return a promise that will prevent callback calls while running
-- `[aria-label]` attributes are no longer used to build a target selector
-- Options removed form modals: up-width, up-max-width, up-height. Use up-size or up-class.
-- Failed responses now change the URL
-- TODO ...
-- up.history.config.restoreScroll has been removed.
-- Feedback works when a layer has no history
-- Layer A11Y
-  - inert
-  - aria-hidden
-  - focus new
-  - focus return on close
-- up.nav sets [aria-current]
-- up.history.config.enabled
-- Requests sent by Unpoly no longer have a `X-Requested-With: XMLHttpRequest` header.
-  If you need that old behavior: up.on('up:request:load', function(event) { event.request.headers['X-Requested-With'] = 'XMLHttpRequest' })
-- up.network.config.requestMetaKeys
-- up:link:follow is no longer sent when preloading, up:link:preload still is
-- Preserve focus when validating forms; Add { focus } option for fragment update
-- up.Request.prototype.isFatalError() has been removed without replacement. Network errors now reject with an error, and not a response.
-- [up-main], [up-main=overlay], [up-main=modal]
-- parseSelector can parse attribute selectors with prefix, infix, suffix, space-separated, dash-separated
-- up.validate() may now be called with a form element
-- validating emits up:form:validate instead of up:form:submit
-- When a compiler throws an error, other compilers will now run anyway
-- When a destructor throws an error, other destructors will now run anyway
-- Bootstrap integration
-  - Minimal: active, nav, navbar
-  - Bootstrap modal styles are no longer used for Unpoly modals
-  - Now supports three major Bootstrap versions:
-    - unpoly-bootstrap3.js
-    - unpoly-bootstrap4.js
-    - unpoly-bootstrap5.js
-- Hungry elements no longer get the transition by default. You need to set [up-transition] on the hungry element.
-- Rejections are now shown if the log is enabled
-- up.on() can passive: true
-- Preloads on touchstart and mousedown
-- Digit groups separators (`60_000`) are a stage 3 ES6 feature and also supported in number attributes.
+Unpoly 2 ships with many new features and API improvements, unlocking many use cases that were not possible with Unpoly 1.
+
+For an in-depth guide to all changes, see our [Unpoly 2 presentation](http://triskweline.de/unpoly2-slides/) (150 slides).
+
+If you're upgrading from an older Unpoly version you should load [`unpoly-migrate.js`](https://unpoly.com/changes/upgrading) to enable deprecated APIs. Also see below for an [overview of breaking changes](#overview-of-breaking-changes).
+
+### Change overview
+
+#### Less need for boilerplate configuration
+
+- Fragment links often replace the primary content element of your application layout. For this purpose you can now define [default targets](/up-main) that are automatically updated when no target selector is given.
+- Unpoly can be configured to [handle all links and forms](/handling-everything), without any `[up-...]` attributes.
+- We have examined many real-world Unpoly apps for repetitive configuration and made these options the new default.
+
+#### New Layer API
+
+- A new [layer API](/up.layer) replaces modals and popups.
+- Layers can be stacked infinitely.
+- Layers are fully isolated, meaning a screen in one layer will not accidentally see elements or events from another layer. For instance, [fragment links](/up.link) will only update elements from the [current layer](/up.layer.current) unless you [explicitly target another layer](/layer-option).
+- A variety of [overlay modes](/layer-terminology) are supported, such as modal dialogs, popup overlays or drawers. You may [customize their appearance and behavior](/customizing-overlays).
+
+#### Subinteractions
+
+- Overlays allow you to break up a complex screen into [subinteractions](/subinteractions).
+- Subinteractions take place in overlays and may span one or many pages. The original screen remains open in the background.
+- Once the subinteraction is *done*, the overlay is [closed](/closing-overlays) and a result value is communicated back to the parent layer.
+
+#### Navigation intent
+
+- You can now define whether a framgent update constitutes a user navigation. Switching screens needs other defaults than updating a tiny box.
+- User navigation aborts earlier requests, fixing race conditions on slow connections.
+
+#### Accessibility
+
+- New overlays are focused automatically and trap focus in a cycle. Closing the overlay re-focuses the link that opened it.
+- Focus is automatically managed when rendering major new content. A new [`[up-focus]` attribute](/focus-option) allows
+  you to explicitely move the user's focus as you update fragments.
+- Keyboard navigation is supported everywhere.
+- Focus, selection and scroll positions are preserved within an updated fragment.
+
+#### Reworked Bootstrap integration
+
+- The Bootstrap integration is now minimal and as unopinionated as possible. Little to no Bootstrap CSS is overridden.
+- Bootstrap versions 3, 4 and 5 are now supported.
+
+#### Quality of live improvements
+
+- Unpoly now ships with a bandwidth-friendly [polling implementation](/up-poll) that handles many edge cases.
+- The position of a clicked link is considered when deciding which element to replace. If possible, Unpoly will update an selector in the vicinity of the link that triggered the fragment update. This helps with multiple self-contained components (with the same selector) on the same page.
+- The [log](/up.log) output is more much more compact and has a calmer formatting.
+- New fragments are no longer revealed by default. Instead Unpoly scrolls to the top when the [main target](/up-main) has changed, but does not scroll otherwise.
+- History is no longer changed by default. Instead Unpoly updates history only when a [main target](/up-main) has changed.
+- All scroll-related options have been unified in a single [`[up-scroll]` attribute](/scroll-option).
+- Many optimizations have been made to preserve bandwidth on slow connections. For example, Unpoly stops [preloading](/up-preload) and [polling](/up-poll) whenthe connection has high latency or low throughput.
+- The client-side cache can be carefully managed by both the client and server.
+- Unpoly 1 had many functions for updating fragments (`up.replace()`, `up.extract()`, `up.modal.extract()`, etc.). Unpoly 2 has unified these into a single function `up.render()`.
+- Event handlers to `up:link:follow`, `up:form:submit` etc. may change the render options for the coming fragment update.
+- Added more options to handle [unexpected server responses](/server-errors), including the new `up:fragment:loaded` event.
+
+#### Extended server protocol
+
+The optional server protocol has been extended with additional headers that the server may use to interact with the frontend. For example:
+
+- The server may [emit events on the frontend](/X-Up-Events).
+- The server may [close overlays](/X-Up-Accept).
+- The server may [change the render target](/X-Up-Target) for a fragment update.
+
+See `up.protocol` for a full list of features.
+
+If you are using Ruby on Rails, the new protocol is already implemented by the [`unpoly-rails`](https://rubygems.org/gems/unpoly-rails) gem.
+
+If you are using Elixir / Phoenix, the new protocol is already implemented by the [`ex_unpoly`](https://hex.pm/packages/ex_unpoly) package.
+
+
+### Overview of breaking changes
+
+Please use [`unpoly-migrate.js`](/changes/upgrading) for a very smooth upgrade process from Unpoly 0.x or 1.x to Unpoly 2.0.
+
+By loading <code>unpoly-migrate.js</code>, calls to most old APIs will be forwarded to the new version. A deprecation notice will be logged to your browser console. This way you can upgrade Unpoly, revive your application with a few changes, then replace deprecated API calls under green tests.
+
+There's a short list of changes that we cannot fix with aliases.
+
+#### Overlays (modals, popups) have different HTML
+
+But it's similar. E.g. `<div class="modal">` becomes `<up-modal>`.
+
+#### Unpoly only sees the current layer
+
+You can target other layers with `{ layer: 'any' }`.
+
+#### Async functions no longer wait for animations
+
+You might or might not notice. In cases where you absolutely do need to wait, an `{ onFinished }` callback can be used.
+
+#### Tooltips are no longer built-in
+
+But there are a million better libraries.
+
+
+### Unpoly 1 maintenance
+
+With the release of Unpoly we're ending maintenance of Unpoly 1. Expect little to no changes to Unpoly 1 in the future. GitHub issues that have been fixed in Unpoly 2 will be closed.
+
+The legacy documentation for Unpoly 1.x has been archived to <https://v1.unpoly.com>.
+
 
 
 1.0.0
 -----
 
-- TODO
+For six years Unpoly has been released under a 0.x version number. To establish the maturity and stability of the project, we're releasing today's version as 1.0.0.
+
+There are only three changes from 0.62.1:
+
+- Fix a bug where `up.util.escapeHTML()`` would not escape single quotes.
+- Unpoly will no longer wait a JavaScript execution task to boot after `DOMContentLoaded`. This may improve the stability of test suites that previously interacted with the page too soon.
+- You may now disable the Unpoly banner in the development console with `up.log.config.banner = false`. (change by @hfjallemark).
+
+This is the last release of the 0.x API line. We're tracking its code in the [`1.x-stable`](https://github.com/unpoly/unpoly/tree/1.x-stable), but expect little to no changes in the future.
 
+The next release will be [Unpoly 2](https://triskweline.de/unpoly2-slides). It will include major (but mostly backwards compatible) renovations to its API, unlocking many use cases that were not possible with Unpoly 1.
 
 
 0.62.1

data/README.md

@@ -14,7 +14,8 @@ If you're looking for the code of Unpoly 0.x or 1.0, use the [`1.x-stable`](http
 Getting started
 ---------------
 
-- See [unpoly.com](https://unpoly.com) for more information and JavaScript API documentation.
+- See [unpoly.com](https://unpoly.com) for guides and documentation.
+- See [installation instructions](https://unpoly.com/install) for many different package managers and languages.
 - See [`CHANGELOG.md`](https://github.com/unpoly/unpoly/blob/master/CHANGELOG.md) for notable changes.
 - See [`README_RAILS.md`](https://github.com/unpoly/unpoly/blob/master/README_RAILS.md) documentation of the Rails bindings.
 

data/dist/unpoly-migrate.js

@@ -73,7 +73,7 @@
       formattedMessage = u.sprintf.apply(u, [message].concat(slice.call(args)));
       if (!warnedMessages[formattedMessage]) {
         warnedMessages[formattedMessage] = true;
-        return (ref = up.log)[config.logLevel].apply(ref, ['DEPRECATION', message].concat(slice.call(args)));
+        return (ref = up.log)[config.logLevel].apply(ref, ['unpoly-migrate', message].concat(slice.call(args)));
       }
     };
     deprecated = function(deprecatedExpression, replacementExpression) {
@@ -300,6 +300,43 @@ Returns the first descendant element matching the given selector.
     return !event.defaultPrevented;
   };
 
+}).call(this);
+(function() {
+  var e, u;
+
+  u = up.util;
+
+  e = up.element;
+
+  up.migrate.postCompile = function(elements, compiler) {
+    var element, i, keepValue, len, results, value;
+    if (keepValue = compiler.keep) {
+      up.migrate.warn('The { keep: true } option for up.compiler() has been removed. Have the compiler set [up-keep] attribute instead.');
+      value = u.isString(keepValue) ? keepValue : '';
+      results = [];
+      for (i = 0, len = elements.length; i < len; i++) {
+        element = elements[i];
+        results.push(element.setAttribute('up-keep', value));
+      }
+      return results;
+    }
+  };
+
+  up.migrate.targetMacro = function(queryAttr, fixedResultAttrs, callback) {
+    return up.macro("[" + queryAttr + "]", function(link) {
+      var optionalTarget, resultAttrs;
+      resultAttrs = u.copy(fixedResultAttrs);
+      if (optionalTarget = link.getAttribute(queryAttr)) {
+        resultAttrs['up-target'] = optionalTarget;
+      } else {
+        resultAttrs['up-follow'] = '';
+      }
+      e.setMissingAttrs(link, resultAttrs);
+      link.removeAttribute(queryAttr);
+      return typeof callback === "function" ? callback() : void 0;
+    });
+  };
+
 }).call(this);
 
 /***
@@ -476,7 +513,7 @@ Returns the first descendant element matching the given selector.
     }
   };
 
-  up.migrate.handleRenderOptions = function(options) {
+  up.migrate.preprocessRenderOptions = function(options) {
     var i, len, prop, ref, results;
     up.migrate.handleHistoryOption(options);
     ref = ['target', 'origin'];
@@ -538,6 +575,11 @@ Returns the first descendant element matching the given selector.
   up.migrate.renamedProperty(up.feedback.config, 'navs', 'navSelectors');
 
 }).call(this);
+
+/***
+@module up.link
+ */
+
 (function() {
   up.migrate.parseFollowOptions = function(parser) {
     parser.string('flavor');
@@ -546,9 +588,46 @@ Returns the first descendant element matching the given selector.
     parser.boolean('closable');
     parser.booleanOrString('reveal');
     parser.boolean('resetScroll');
-    return parser.boolean('restoreScroll');
+    parser.boolean('restoreScroll');
+    return parser.booleanOrString('historyVisible');
   };
 
+
+  /***
+  [Follows](/up.follow) this link as fast as possible.
+  
+  This is done by:
+  
+  - [Following the link through AJAX](/a-up-follow) instead of a full page load
+  - [Preloading the link's destination URL](/a-up-preload)
+  - [Triggering the link on `mousedown`](/a-up-instant) instead of on `click`
+  
+  \#\#\# Example
+  
+  Use `[up-dash]` like this:
+  
+      <a href="/users" up-dash=".main">User list</a>
+  
+  This is shorthand for:
+  
+      <a href="/users" up-target=".main" up-instant up-preload>User list</a>
+  
+  @selector a[up-dash]
+  @param [up-dash='body']
+    The CSS selector to replace
+  
+    Inside the CSS selector you may refer to this link as `&` ([like in Sass](https://sass-lang.com/documentation/file.SASS_REFERENCE.html#parent-selector)).
+  @deprecated
+    To accelerate all links use `up.link.config.instantSelectors` and `up.link.config.preloadSelectors`.
+   */
+
+  up.migrate.targetMacro('up-dash', {
+    'up-preload': '',
+    'up-instant': ''
+  }, function() {
+    return up.migrate.deprecated('a[up-dash]', 'up.link.config.instantSelectors or up.link.config.preloadSelectors');
+  });
+
 }).call(this);
 
 /***
@@ -623,9 +702,14 @@ Returns the first descendant element matching the given selector.
   };
 
   up.migrate.handleLayerConfig = function(config) {
-    return up.migrate.fixKey(config, 'history', 'historyVisible');
+    return up.migrate.fixKey(config, 'historyVisible', 'history');
   };
 
+  up.util.getter(up.Layer.prototype, 'historyVisible', function() {
+    up.migrate.deprecated('up.Layer#historyVisible', 'up.Layer#history');
+    return this.history;
+  });
+
 }).call(this);
 
 /***
@@ -826,10 +910,10 @@ Returns the first descendant element matching the given selector.
   @param {string} up-modal
     The CSS selector that will be extracted from the response and displayed in a modal dialog.
   @deprecated
-    Use `a[up-layer=modal]` instead.
+    Use `a[up-layer="new modal"]` instead.
    */
 
-  up.link.targetMacro('up-modal', {
+  up.migrate.targetMacro('up-modal', {
     'up-layer': 'new modal'
   }, function() {
     return up.migrate.deprecated('a[up-modal]', 'a[up-layer="new modal"]');
@@ -846,16 +930,21 @@ Returns the first descendant element matching the given selector.
   @param {string} up-drawer
     The CSS selector that will be extracted from the response and displayed in a modal dialog.
   @deprecated
-    Use `a[up-layer=drawer]` instead.
+    Use `a[up-layer="new drawer"]` instead.
    */
 
-  up.link.targetMacro('up-drawer', {
+  up.migrate.targetMacro('up-drawer', {
     'up-layer': 'new drawer'
   }, function() {
     return up.migrate.deprecated('a[up-drawer]', 'a[up-layer="new drawer"]');
   });
 
 }).call(this);
+
+/***
+@module up.layer
+ */
+
 (function() {
   var e, u;
 
@@ -987,7 +1076,7 @@ Returns the first descendant element matching the given selector.
 
   up.migrate.renamedEvent('up:popup:closed', 'up:layer:dismissed');
 
-  up.link.targetMacro('up-popup', {
+  up.migrate.targetMacro('up-popup', {
     'up-layer': 'new popup'
   }, function() {
     return up.migrate.deprecated('[up-popup]', '[up-layer="new popup"]');
@@ -1015,7 +1104,7 @@ This feature is now deprecated.
 
 }).call(this);
 (function() {
-  var preloadDelayMoved, u,
+  var disableProgressBarIfCustomIndicator, mayHaveCustomIndicator, preloadDelayMoved, progressBarDefault, u,
     slice = [].slice;
 
   u = up.util;
@@ -1060,15 +1149,6 @@ This feature is now deprecated.
 
   up.migrate.renamedProperty(up.network.config, 'slowDelay', 'badResponseTime');
 
-  up.migrate.handleNetworkPreloadArgs = function() {
-    var args, ref;
-    args = 1 <= arguments.length ? slice.call(arguments, 0) : [];
-    if (u.isElementish(args[0])) {
-      up.migrate.warn('up.proxy.preload(link) has been renamed to up.link.preload(link)');
-      return (ref = up.link).preload.apply(ref, args);
-    }
-  };
-
   up.migrate.handleRequestOptions = function(options) {
     return up.migrate.fixKey(options, 'data', 'params');
   };
@@ -1081,11 +1161,13 @@ This feature is now deprecated.
   
   \#\#\# Example
   
-      up.request('/search', { params: { query: 'sunshine' } }).then(function(text) {
-        console.log('The response text is %o', text)
-      }).catch(function() {
-        console.error('The request failed')
-      })
+  ```
+  up.ajax('/search', { params: { query: 'sunshine' } }).then(function(text) {
+    console.log('The response text is %o', text)
+  }).catch(function() {
+    console.error('The request failed')
+  })
+  ```
   
   @function up.ajax
   @param {string} [url]
@@ -1124,6 +1206,13 @@ This feature is now deprecated.
     return up.cache.clear();
   };
 
+  up.network.preload = function() {
+    var args, ref;
+    args = 1 <= arguments.length ? slice.call(arguments, 0) : [];
+    up.migrate.deprecated('up.proxy.preload(link)', 'up.link.preload(link)');
+    return (ref = up.link).preload.apply(ref, args);
+  };
+
 
   /***
   @class up.Request
@@ -1169,6 +1258,31 @@ This feature is now deprecated.
     return !this.ok;
   };
 
+  mayHaveCustomIndicator = function() {
+    var listeners;
+    listeners = up.EventListener.allNonDefault(document);
+    return u.find(listeners, function(listener) {
+      return listener.eventType === 'up:request:late';
+    });
+  };
+
+  progressBarDefault = up.network.config.progressBar;
+
+  disableProgressBarIfCustomIndicator = function() {
+    return up.network.config.progressBar = function() {
+      if (mayHaveCustomIndicator()) {
+        up.migrate.warn('Disabled the default progress bar as may have built a custom loading indicator with your up:request:late listener. Please set up.network.config.progressBar to true or false.');
+        return false;
+      } else {
+        return progressBarDefault;
+      }
+    };
+  };
+
+  disableProgressBarIfCustomIndicator();
+
+  up.on('up:framework:reset', disableProgressBarIfCustomIndicator);
+
 }).call(this);
 
 /***