pageflow 12.2.0 → 12.3.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: a7ef59fab5de1f798ce8e9435e7581bb71ebd39a88104463fdc0d4b9f01effc1
-  data.tar.gz: e4915f75690ccb2c9edc4a9a61edeab57cb45f90cf6986054532a8846441aa01
+  metadata.gz: 325b406e4e3c6ecd287218fb90f8d816ecc38dcbbe61bd06f46ea2c425fc0d24
+  data.tar.gz: 2ba02a6102d47686e152c56eea3b341fa475d6caab3b75088c7347339416e99f
 SHA512:
-  metadata.gz: a003f4a6925960118ee8ed409f2b9d58279a5147cd00b8c72d3b922fbe7f22b0c9257da209fa02a9ea261720626f3603a0c1576bd57f0f7e8563785a13779bf8
-  data.tar.gz: a225941f0a98abfbee9bae57d74c655602c3ca0adfbc470f2b978d254c4831adb9926202a499c6d34a8b6e243029129682359bb8e886b1016b0d5fd5ca09b32d
+  metadata.gz: 5c3d6a1f7558d3049171d39999363b04ffd1c30c16828f55f7fc413e4ae4be60003ca95bd21d636c90b3bef17a4e158eb7a492092decfafd005c8ffcf5c9c633
+  data.tar.gz: 6b25b2cdc19febedf21b6b0deebe6b1f8b9718c38a3bb47ac62e05caa37fe7cb7885b67b6e099121f0b06b1b2ba2206da6bab32b1789562689c6eb258c466d8b

data/CHANGELOG.md

@@ -1,107 +1,54 @@
 # CHANGELOG
 
-### Version 12.2.0
-
-2018-07-27
-
-[Compare changes](https://github.com/codevise/pageflow/compare/12-1-stable...v12.2.0)
-
-##### Pubic Site
-
-- Mute background videos to fix autoplay on Safari 11
-  ([#960](https://github.com/codevise/pageflow/pull/960))
-- Add support for locales with right to left script
-  ([#954](https://github.com/codevise/pageflow/pull/954))
-- Improve content links to pages of entry
-  ([#953](https://github.com/codevise/pageflow/pull/953))
-- Fallback to page title in overview page description
-  ([#951](https://github.com/codevise/pageflow/pull/951))
-- Bug fix: Fix page transition effects in Chrome 66 and above
-  ([#971](https://github.com/codevise/pageflow/pull/971))
-- Bug fix: Improve tracking of visited pages
-  ([#965](https://github.com/codevise/pageflow/pull/965))
-- Bug fix: Fix "hide text" swipe gesture for react page types
-  ([#919](https://github.com/codevise/pageflow/pull/919))
-
-##### Admin
-
-- Bug fix: Extend user management permissions in single account mode
-  ([#934](https://github.com/codevise/pageflow/pull/934))
-- Bug fix: Fix filtering in searchable theming select in entry form
-  ([#947](https://github.com/codevise/pageflow/pull/947))
+### Version 12.3.0
+
+2018-10-30
+
+[Compare changes](https://github.com/codevise/pageflow/compare/12-2-stable...v12.3.0)
+
+##### Public Site
+
+- Allow displaying cookie notice
+  ([#998](https://github.com/codevise/pageflow/pull/998),
+   [#986](https://github.com/codevise/pageflow/pull/986))
+- Make video prebuffering less eager
+  ([#1056](https://github.com/codevise/pageflow/pull/1056),
+   [#1054](https://github.com/codevise/pageflow/pull/1054),
+   [#1000](https://github.com/codevise/pageflow/pull/1000))
+- Unmute button to enable autoplay background media
+  ([#1018](https://github.com/codevise/pageflow/pull/1018),
+   [#1015](https://github.com/codevise/pageflow/pull/1015))
+- Lazy web audio setup for Chrome 71
+  ([#1017](https://github.com/codevise/pageflow/pull/1017),
+   [#1016](https://github.com/codevise/pageflow/pull/1016))
+- Bug fix: Allow positioning of mobile video poster
+  ([#996](https://github.com/codevise/pageflow/pull/996))
+- Bug fix: Ensure mobile video poster is displayed on Android
+  ([#994](https://github.com/codevise/pageflow/pull/994))
+- Bug fix: Ignore invalid page perma id hash
+  ([#1058](https://github.com/codevise/pageflow/pull/1058))
 
 ##### Themes
 
-- New variable to determine size of glowing area
-  ([#921](https://github.com/codevise/pageflow/pull/921))
-- Move page padding from legacy styles to theme
-  ([#935](https://github.com/codevise/pageflow/pull/935))
-- Extract shadow and scroller styles from page theme
-  ([#972](https://github.com/codevise/pageflow/pull/972))
-- Variable for color of title on inverted pages
-  ([#969](https://github.com/codevise/pageflow/pull/969))
-- Typo variables for multimedia alert
-  ([#966](https://github.com/codevise/pageflow/pull/966))
-- Allow setting phone height on background image logo variant
-  ([#964](https://github.com/codevise/pageflow/pull/964))
-- Fixed wrong variable for page-header-title
-  ([#962](https://github.com/codevise/pageflow/pull/962))
-- Image variants for logo & loading spinner
-  ([#961](https://github.com/codevise/pageflow/pull/961))
-- Logo banner & logo svg option
-  ([#958](https://github.com/codevise/pageflow/pull/958))
-- Add logical layout mixins for borders and paddings
-  ([#956](https://github.com/codevise/pageflow/pull/956))
-- Variable for watermark logo opacity
-  ([#946](https://github.com/codevise/pageflow/pull/946))
+- Hyphenate narrow headers by default
+  ([#999](https://github.com/codevise/pageflow/pull/999))
 
-##### Rails Engine
+##### Admin
 
-- Allow registering admin attributes table rows
-  ([#928](https://github.com/codevise/pageflow/pull/928))
-- Add page split layout utility methods
-  ([#920](https://github.com/codevise/pageflow/pull/920))
-- Add dominos to pageflow-support to test admin features
-  ([#931](https://github.com/codevise/pageflow/pull/931))
-- Add color picker input view
-  ([#788](https://github.com/codevise/pageflow/pull/788))
-- Add defaultValueBinding option to color input view
-  ([#959](https://github.com/codevise/pageflow/pull/959))
-- Allow integrating with Krant app news
-  ([#918](https://github.com/codevise/pageflow/pull/918))
-- Developer console
-  ([#925](https://github.com/codevise/pageflow/pull/925))
-- Log rescued exceptions on debug level
-  ([#900](https://github.com/codevise/pageflow/pull/900))
+- Improve initial password workflow for invitations
+  ([#1001](https://github.com/codevise/pageflow/pull/1001))
 
-##### Documentation
+##### Edtior
 
-- Update page type and widget type creation guides
-  ([#917](https://github.com/codevise/pageflow/pull/917))
-- Update `setting_up_s3_bucket_policies.md`
-  ([#902](https://github.com/codevise/pageflow/pull/902))
-- Improve readme/add code of conduct
-  ([#936](https://github.com/codevise/pageflow/pull/936))
-- Typos fixed
-  ([#924](https://github.com/codevise/pageflow/pull/924))
+- Add percent inputs to background positioning view
+  ([#997](https://github.com/codevise/pageflow/pull/997))
 
 ##### Internal
 
-- Replace phantomjs with headless chrome
-  ([#952](https://github.com/codevise/pageflow/pull/952))
-- Remove rubygems 2.7.0 dummy app generation fix
-  ([#916](https://github.com/codevise/pageflow/pull/916))
-- Use teaspoon fork from pageflow branch
-  ([#927](https://github.com/codevise/pageflow/pull/927))
-- Update rubocop
-  ([#929](https://github.com/codevise/pageflow/pull/929))
-- Fix jquery error in node_package specs on travis
-  ([#948](https://github.com/codevise/pageflow/pull/948))
-- Remove unused domino and matcher methods
-  ([#945](https://github.com/codevise/pageflow/pull/945))
-- Remove todo comments
-  ([#937](https://github.com/codevise/pageflow/pull/937))
+- Decouple node package specs from pageflow.backgroundmedia
+  ([#1057](https://github.com/codevise/pageflow/pull/1057),
+   [#1052](https://github.com/codevise/pageflow/pull/1052))
 
 See
-[12-1-stable branch](https://github.com/codevise/pageflow/blob/12-1-stable/CHANGELOG.md)
+[12-2-stable branch](https://github.com/codevise/pageflow/blob/12-2-stable/CHANGELOG.md)
 for previous changes.

data/admins/pageflow/accounts.rb

@@ -140,6 +140,7 @@ module Pageflow
           :imprint_link_label,
           :copyright_link_url,
           :copyright_link_label,
+          :privacy_link_url,
           :home_url,
           :home_button_enabled_by_default,
           :default_author,

data/app/assets/javascripts/pageflow/asset_urls.js.erb

@@ -1,7 +1,7 @@
 pageflow.assetUrls = {
+  unmuteSound: '<%= asset_path("pageflow/unmute.mp3") %>',
   largeBandwidthProbe: '<%= Rails.env.test? ? asset_path("bandwidth_probe_large.png") : "//#{File.join(Pageflow.config.zencoder_options[:s3_host_alias], "bandwidth_probe_large.png")}" %>',
   smallBandwidthProbe: '<%= Rails.env.test? ? asset_path("bandwidth_probe_small.png") : "//#{File.join(Pageflow.config.zencoder_options[:s3_host_alias], "bandwidth_probe_small.png")}" %>',
-  audioSwf: '<%= asset_path "pageflow/audio5js.swf" %>',
   emptyMp4: '<%= asset_path "pageflow/empty.mp4" %>',
   emptyWebm: '<%= asset_path "pageflow/empty.webm" %>'
 };

data/app/assets/javascripts/pageflow/audio/multi_player.js

@@ -128,6 +128,10 @@ pageflow.Audio.MultiPlayer = function(pool, options) {
     that.listenTo(player, 'ended', function() {
       that.trigger('ended', {audioFileId: id});
     });
+
+    that.listenTo(player, 'playfailed', function() {
+      that.trigger('playfailed', {audioFileId: id});
+    });
   }
 
   function stopEventPropagation(player) {

data/app/assets/javascripts/pageflow/audio_player.js

@@ -40,7 +40,7 @@ pageflow.AudioPlayer = function(sources, options) {
     swf_path: pageflow.assetUrls.audioSwf,
     throw_errors: false,
     format_time: false,
-    codecs: ['vorbis', 'mp4', 'mp3'],
+    codecs: options.codecs || ['vorbis', 'mp4', 'mp3'],
     ready: ready.resolve,
     loop: options.loop
   });

data/app/assets/javascripts/pageflow/background_media.js

@@ -0,0 +1,22 @@
+/**
+ * Mute feature settings for background media (ATMO and background videos)
+ *
+ * @since 12.3
+ */
+pageflow.backgroundMedia = {
+  muted: false,
+
+  unmute: function() {
+    if (this.muted) {
+      this.muted = false;
+      pageflow.events.trigger('background_media:unmute');
+    }
+  },
+
+  mute: function() {
+    if (!this.muted) {
+      this.muted = true;
+      pageflow.events.trigger('background_media:mute');
+    }
+  }
+};

data/app/assets/javascripts/pageflow/base.js

@@ -10,9 +10,11 @@
 //= require_self
 
 //= require ./object
+//= require ./background_media
 //= require ./entry_data
 //= require ./seed_entry_data
 //= require ./cookies
+//= require ./cookie_notice
 //= require ./events
 //= require ./page_type
 //= require ./page_transitions

data/app/assets/javascripts/pageflow/browser/agent.js

@@ -2,83 +2,97 @@
  * Detect browser via user agent. Use only if feature detection is not
  * an option.
  */
-pageflow.browser.agent = {
-  matchesSilk: function() {
-    return navigator.userAgent.match(/\bSilk\b/);
-  },
-
-  matchesDesktopSafari9: function() {
-    return this.matchesSafari9() && !this.matchesMobilePlatform();
-  },
-
-  matchesDesktopSafari10: function() {
-    return this.matchesSafari10() && !this.matchesMobilePlatform();
-  },
-
-  matchesSafari9: function() {
-    return this.matchesSafari() &&
-      this._matches(/Version\/9/i);
-  },
-
-  matchesSafari10: function() {
-    return this.matchesSafari() &&
-      this._matches(/Version\/10/i);
-  },
-
-  matchesSafari11: function() {
-    return this.matchesSafari() &&
-      this._matches(/Version\/11/i);
-  },
-
-  matchesSafari: function() {
-    // - Chrome also reports to be a Safari
-    // - Safari does not report to be a Chrome
-    // - Edge also reports to be a Safari, but also reports to be Chrome
-    return this._matches(/Safari\//i) &&
-      !this._matches(/Chrome/i);
-  },
-
-  /**
-   * Returns true on iOS Safari.
-   * @return {boolean}
-   */
-  matchesMobileSafari: function() {
-    var matchers = [/iPod/i, /iPad/i, /iPhone/i];
-
-    return _.any(matchers, function(matcher) {
-      return navigator.userAgent.match(matcher);
-    });
-  },
-
-  /**
-   * Returns true on iOS or Android.
-   * @return {boolean}
-   */
-  matchesMobilePlatform: function() {
-    var matchers = [/iPod/i, /iPad/i, /iPhone/i, /Android/i, /Silk/i, /IEMobile/i];
-
-    return _.any(matchers, function(matcher) {
-      return navigator.userAgent.match(matcher);
-    });
-  },
-
-  /**
-   * Returns true on Internet Explorser version 9, 10 and 11.
-   * @return {boolean}
-   */
-  matchesIEUpTo11: function() {
-    return navigator.userAgent.match(/Trident\//);
-  },
-
-  /**
-   * Returns true in InApp browser of Facebook app.
-   * @return {boolean}
-   */
-  matchesFacebookInAppBrowser: function() {
-    return navigator.userAgent.match(/FBAN/) && navigator.userAgent.match(/FBAV/);
-  },
-
-  _matches: function(exp) {
-    return navigator.userAgent.match(exp);
+pageflow.browser.Agent = function(userAgent) {
+  return {
+    matchesSilk: function() {
+      return matches(/\bSilk\b/);
+    },
+
+    matchesDesktopSafari9: function() {
+      return this.matchesSafari9() && !this.matchesMobilePlatform();
+    },
+
+    matchesDesktopSafari10: function() {
+      return this.matchesSafari10() && !this.matchesMobilePlatform();
+    },
+
+    matchesSafari9: function() {
+      return this.matchesSafari() &&
+             matches(/Version\/9/i);
+    },
+
+    matchesSafari10: function() {
+      return this.matchesSafari() &&
+             matches(/Version\/10/i);
+    },
+
+    matchesSafari11: function() {
+      return this.matchesSafari() &&
+             matches(/Version\/11/i);
+    },
+
+    matchesSafari11AndAbove: function() {
+      return this.matchesSafari() &&
+             captureGroupGreaterOrEqual(/Version\/(\d+)/i, 11);
+    },
+
+    matchesSafari: function() {
+      // - Chrome also reports to be a Safari
+      // - Safari does not report to be a Chrome
+      // - Edge also reports to be a Safari, but also reports to be Chrome
+      return matches(/Safari\//i) &&
+             !matches(/Chrome/i);
+    },
+
+    /**
+     * Returns true on iOS Safari.
+     * @return {boolean}
+     */
+    matchesMobileSafari: function() {
+      var matchers = [/iPod/i, /iPad/i, /iPhone/i];
+
+      return _.any(matchers, function(matcher) {
+        return userAgent.match(matcher);
+      });
+    },
+
+    /**
+     * Returns true on iOS or Android.
+     * @return {boolean}
+     */
+    matchesMobilePlatform: function() {
+      var matchers = [/iPod/i, /iPad/i, /iPhone/i, /Android/i, /Silk/i, /IEMobile/i];
+
+      return _.any(matchers, function(matcher) {
+        return userAgent.match(matcher);
+      });
+    },
+
+    /**
+     * Returns true on Internet Explorser version 9, 10 and 11.
+     * @return {boolean}
+     */
+    matchesIEUpTo11: function() {
+      return userAgent.match(/Trident\//);
+    },
+
+    /**
+     * Returns true in InApp browser of Facebook app.
+     * @return {boolean}
+     */
+    matchesFacebookInAppBrowser: function() {
+      return userAgent.match(/FBAN/) && userAgent.match(/FBAV/);
+    }
+  };
+
+  function matches(exp) {
+    return !!userAgent.match(exp);
+  }
+
+  function captureGroupGreaterOrEqual(exp, version) {
+    var match = userAgent.match(exp);
+    return match && match[1] && parseInt(match[1], 10) >= version;
   }
 };
+
+pageflow.browser.agent = new pageflow.browser.Agent(navigator.userAgent);

data/app/assets/javascripts/pageflow/browser/autoplay_support.js

@@ -1,4 +1,4 @@
 pageflow.browser.feature('autoplay support', function(has) {
-  return !pageflow.browser.agent.matchesSafari11() &&
-    !pageflow.browser.agent.matchesMobilePlatform();
+  return !pageflow.browser.agent.matchesSafari11AndAbove() &&
+         !pageflow.browser.agent.matchesMobilePlatform();
 });

data/app/assets/javascripts/pageflow/cookie_notice.js

@@ -0,0 +1,7 @@
+pageflow.cookieNotice = {
+  request: function() {
+    pageflow.ready.then(function() {
+      pageflow.events.trigger('cookie_notice:request');
+    });
+  },
+};

data/app/assets/javascripts/pageflow/dist/react.js

@@ -8901,19 +8901,19 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _media = __webpack_require__(494);
 
-	var _interactivePageBackground = __webpack_require__(532);
+	var _interactivePageBackground = __webpack_require__(535);
 
 	var _pages = __webpack_require__(348);
 
-	var _registerPageType = __webpack_require__(537);
+	var _registerPageType = __webpack_require__(540);
 
 	var _registerPageType2 = _interopRequireDefault(_registerPageType);
 
-	var _registerPageTypeWithDefaultBackground = __webpack_require__(539);
+	var _registerPageTypeWithDefaultBackground = __webpack_require__(542);
 
 	var _registerPageTypeWithDefaultBackground2 = _interopRequireDefault(_registerPageTypeWithDefaultBackground);
 
-	var _registerWidgetType = __webpack_require__(540);
+	var _registerWidgetType = __webpack_require__(543);
 
 	var _registerWidgetType2 = _interopRequireDefault(_registerWidgetType);
 
@@ -8935,17 +8935,21 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _utils = __webpack_require__(339);
 
-	var _ServerSidePage = __webpack_require__(541);
+	var _ServerSidePage = __webpack_require__(544);
 
 	var _ServerSidePage2 = _interopRequireDefault(_ServerSidePage);
 
-	var _builtInPageTypes = __webpack_require__(571);
+	var _builtInPageTypes = __webpack_require__(586);
 
-	var _pageflow = __webpack_require__(577);
+	var _backgroundMedia = __webpack_require__(548);
+
+	var _cookieNotice = __webpack_require__(551);
+
+	var _pageflow = __webpack_require__(592);
 
 	var _pageflow2 = _interopRequireDefault(_pageflow);
 
-	var _boot = __webpack_require__(542);
+	var _boot = __webpack_require__(545);
 
 	var _boot2 = _interopRequireDefault(_boot);
 
@@ -8954,6 +8958,8 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } }
 
 	(0, _builtInPageTypes.register)();
+	(0, _cookieNotice.registerWidgetTypes)();
+	(0, _backgroundMedia.registerWidgetTypes)();
 
 	if (_pageflow2.default.events) {
 	  _pageflow2.default.events.on('seed:loaded', function () {
@@ -9766,7 +9772,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	Object.defineProperty(exports, "__esModule", {
 	  value: true
 	});
-	exports.preloadBackgroundImage = exports.has = exports.memoizedSelector = exports.combineSelectors = exports.combine = exports.isBlank = exports.camelize = undefined;
+	exports.preloadBackgroundImage = exports.preloadImage = exports.has = exports.memoizedSelector = exports.combineSelectors = exports.combine = exports.isBlank = exports.camelize = undefined;
 
 	var _isBlank = __webpack_require__(340);
 
@@ -9788,9 +9794,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _has2 = _interopRequireDefault(_has);
 
-	var _preloadBackgroundImage = __webpack_require__(347);
-
-	var _preloadBackgroundImage2 = _interopRequireDefault(_preloadBackgroundImage);
+	var _preload = __webpack_require__(347);
 
 	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
@@ -9800,7 +9804,8 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	exports.combineSelectors = _memoizedSelector.combine;
 	exports.memoizedSelector = _memoizedSelector2.default;
 	exports.has = _has2.default;
-	exports.preloadBackgroundImage = _preloadBackgroundImage2.default;
+	exports.preloadImage = _preload.preloadImage;
+	exports.preloadBackgroundImage = _preload.preloadBackgroundImage;
 
 /***/ }),
 /* 340 */
@@ -10389,15 +10394,28 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	Object.defineProperty(exports, "__esModule", {
 	  value: true
 	});
-	exports.default = preloadBackgroundImage;
+	exports.preloadBackgroundImage = preloadBackgroundImage;
+	exports.preloadImage = preloadImage;
 	function preloadBackgroundImage(element) {
 	  var propertyValue = window.getComputedStyle(element).getPropertyValue('background-image');
 
 	  if (propertyValue.match(/^url/)) {
-	    new Image().src = propertyValue.replace(/^url\(['"]?/, '').replace(/['"]?\)$/, '');
+	    var url = propertyValue.replace(/^url\(['"]?/, '').replace(/['"]?\)$/, '');
+	    return preloadImage(url);
 	  }
 	}
 
+	function preloadImage(url) {
+	  return new Promise(function (resolve) {
+	    var image = new Image();
+
+	    image.onload = resolve;
+	    image.onerror = resolve;
+
+	    image.src = url;
+	  });
+	}
+
 /***/ }),
 /* 348 */
 /***/ (function(module, exports, __webpack_require__) {
@@ -23486,7 +23504,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	Object.defineProperty(exports, "__esModule", {
 	  value: true
 	});
-	exports.widgetAttributes = exports.prop = exports.file = exports.setting = exports.t = exports.currentParentChapterAttributes = exports.currentParentPageAttributes = exports.pageIsPrepared = exports.pageIsActive = exports.pageAttributes = exports.pageAttribute = undefined;
+	exports.editingWidget = exports.widgetAttributes = exports.prop = exports.file = exports.setting = exports.t = exports.currentParentChapterAttributes = exports.currentParentPageAttributes = exports.pageIsPrepared = exports.pageIsActive = exports.pageAttributes = exports.pageAttribute = undefined;
 
 	var _selectors = __webpack_require__(375);
 
@@ -23513,6 +23531,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	exports.file = _selectors5.file;
 	exports.prop = _selectors6.prop;
 	exports.widgetAttributes = _selectors7.widgetAttributes;
+	exports.editingWidget = _selectors7.editingWidget;
 
 /***/ }),
 /* 489 */
@@ -23642,6 +23661,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  value: true
 	});
 	exports.widgetAttributes = widgetAttributes;
+	exports.editingWidget = editingWidget;
 
 	var _collections = __webpack_require__(376);
 
@@ -23657,6 +23677,14 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  });
 	}
 
+	function editingWidget(_ref2) {
+	  var role = _ref2.role;
+
+	  return (0, _utils.memoizedSelector)(selector({ id: role }), function (widget) {
+	    return !!widget.editing;
+	  });
+	}
+
 /***/ }),
 /* 494 */
 /***/ (function(module, exports, __webpack_require__) {
@@ -23673,46 +23701,50 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _Page2 = _interopRequireDefault(_Page);
 
-	var _PageVideoPlayer = __webpack_require__(502);
+	var _PageVideoPlayer = __webpack_require__(503);
 
 	var _PageVideoPlayer2 = _interopRequireDefault(_PageVideoPlayer);
 
-	var _MobilePageVideoPoster = __webpack_require__(516);
+	var _MobilePageVideoPoster = __webpack_require__(517);
 
 	var _MobilePageVideoPoster2 = _interopRequireDefault(_MobilePageVideoPoster);
 
-	var _PageBackgroundVideo = __webpack_require__(517);
+	var _PageBackgroundVideo = __webpack_require__(518);
 
 	var _PageBackgroundVideo2 = _interopRequireDefault(_PageBackgroundVideo);
 
-	var _PageBackgroundAsset = __webpack_require__(518);
+	var _PageBackgroundAsset = __webpack_require__(519);
 
 	var _PageBackgroundAsset2 = _interopRequireDefault(_PageBackgroundAsset);
 
-	var _PageBackground = __webpack_require__(519);
+	var _PageBackground = __webpack_require__(520);
 
 	var _PageBackground2 = _interopRequireDefault(_PageBackground);
 
-	var _PagePrintImage = __webpack_require__(520);
+	var _PagePrintImage = __webpack_require__(521);
 
 	var _PagePrintImage2 = _interopRequireDefault(_PagePrintImage);
 
-	var _createReducer = __webpack_require__(521);
+	var _createReducer = __webpack_require__(522);
 
 	var _createReducer2 = _interopRequireDefault(_createReducer);
 
-	var _sagas = __webpack_require__(523);
+	var _sagas = __webpack_require__(524);
 
 	var _sagas2 = _interopRequireDefault(_sagas);
 
-	var _fadeInWhenPageWillActivate = __webpack_require__(531);
+	var _fadeInWhenPageWillActivate = __webpack_require__(534);
 
 	var _fadeInWhenPageWillActivate2 = _interopRequireDefault(_fadeInWhenPageWillActivate);
 
-	var _fadeOutWhenPageWillDeactivate = __webpack_require__(529);
+	var _fadeOutWhenPageWillDeactivate = __webpack_require__(532);
 
 	var _fadeOutWhenPageWillDeactivate2 = _interopRequireDefault(_fadeOutWhenPageWillDeactivate);
 
+	var _muteBackgroundMediaOnPlayFailed = __webpack_require__(526);
+
+	var _muteBackgroundMediaOnPlayFailed2 = _interopRequireDefault(_muteBackgroundMediaOnPlayFailed);
+
 	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 	function reduxModule(options) {
@@ -23750,7 +23782,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	        switch (_context2.prev = _context2.next) {
 	          case 0:
 	            _context2.next = 2;
-	            return [(0, _fadeInWhenPageWillActivate2.default)({ scope: 'background' }), (0, _fadeOutWhenPageWillDeactivate2.default)({ scope: 'background' })];
+	            return [(0, _fadeInWhenPageWillActivate2.default)({ scope: 'background' }), (0, _fadeOutWhenPageWillDeactivate2.default)({ scope: 'background' }), (0, _muteBackgroundMediaOnPlayFailed2.default)()];
 
 	          case 2:
 	          case 'end':
@@ -23788,7 +23820,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _PlayerControls2 = _interopRequireDefault(_PlayerControls);
 
-	var _NonJsLinks = __webpack_require__(500);
+	var _NonJsLinks = __webpack_require__(501);
 
 	var _NonJsLinks2 = _interopRequireDefault(_NonJsLinks);
 
@@ -23861,12 +23893,16 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	    file: (0, _selectors.prop)('file'),
 	    defaultTextTrackFileId: (0, _selectors.prop)('page.defaultTextTrackFileId')
 	  }),
-	  hasAutoplaySupport: (0, _selectors.has)('autoplay support')
+	  hasAutoplaySupport: (0, _selectors.has)('autoplay support'),
+	  shouldAutoplay: (0, _selectors2.pageShouldAutoplay)({
+	    id: (0, _selectors.prop)('page.permaId'),
+	    autoplayWhenBackgroundMediaMuted: (0, _selectors.prop)('autoplayWhenBackgroundMediaMuted')
+	  })
 	}))(MediaPage);
 
 
 	function willAutoplay(props) {
-	  return props.page.autoplay !== false && props.hasAutoplaySupport;
+	  return props.shouldAutoplay && props.hasAutoplaySupport && !props.playerState.playFailed;
 	}
 
 	function pageWraperClassName(className, autoplay, textTracks, playerState) {
@@ -23877,6 +23913,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	    'is_control_bar_hovered': playerState.userHoveringControls,
 	    'is_control_bar_hidden': playerState.controlsHidden,
 	    'unplayed': playerState.unplayed && !autoplay,
+	    'should_play': playerState.shouldPlay,
 	    'has_played': playerState.hasPlayed
 	  });
 	}
@@ -24116,6 +24153,8 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	exports.playerActions = playerActions;
 	exports.textTracks = textTracks;
 	exports.videoQualitySetting = videoQualitySetting;
+	exports.pageShouldAutoplay = pageShouldAutoplay;
+	exports.pageHasAutoplayOption = pageHasAutoplayOption;
 
 	var _actions = __webpack_require__(499);
 
@@ -24127,6 +24166,8 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _selectors4 = __webpack_require__(486);
 
+	var _selectors5 = __webpack_require__(500);
+
 	var _utils = __webpack_require__(339);
 
 	var _redux = __webpack_require__(351);
@@ -24223,6 +24264,21 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  return (0, _selectors3.setting)({ property: 'videoQuality' });
 	}
 
+	function pageShouldAutoplay(_ref4) {
+	  var autoplayWhenBackgroundMediaMuted = _ref4.autoplayWhenBackgroundMediaMuted,
+	      id = _ref4.id;
+
+	  return (0, _utils.memoizedSelector)(autoplayWhenBackgroundMediaMuted, pageHasAutoplayOption({ id: id }), _selectors5.muted, function (autoplayWhenBackgroundMediaMuted, autoplayOption, isBackgroudMediaMuted) {
+	    return autoplayOption && (!isBackgroudMediaMuted || autoplayWhenBackgroundMediaMuted);
+	  });
+	}
+
+	function pageHasAutoplayOption(options) {
+	  return (0, _utils.memoizedSelector)((0, _selectors2.pageAttribute)('autoplay', options), function (autoplayOption) {
+	    return autoplayOption !== false;
+	  });
+	}
+
 /***/ }),
 /* 499 */
 /***/ (function(module, exports, __webpack_require__) {
@@ -24232,7 +24288,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	Object.defineProperty(exports, "__esModule", {
 	  value: true
 	});
-	exports.TOGGLE_INFO_BOX_DURING_PLAYBACK = exports.HIDE_INFO_BOX_DURING_PLAYBACK = exports.SHOW_INFO_BOX_DURING_PLAYBACK = exports.CONTROLS_HIDDEN = exports.FOCUS_LEFT_CONTROLS = exports.FOCUS_ENTERED_CONTROLS = exports.CONTROLS_LEFT = exports.CONTROLS_ENTERED = exports.USER_IDLE = exports.USER_INTERACTION = exports.HAS_NOT_BEEN_PLAYING_FOR_A_MOMENT = exports.WAITING = exports.SEEKED = exports.SEEKING = exports.ENDED = exports.TIME_UPDATE = exports.PAUSED = exports.PLAYING = exports.PROGRESS = exports.META_DATA_LOADED = exports.BUFFER_UNDERRUN_CONTINUE = exports.BUFFER_UNDERRUN = exports.ABORT_PREBUFFERING = exports.PREBUFFERED = exports.PREBUFFER = exports.SEEK_TO = exports.SCRUB_TO = exports.FADE_OUT_AND_PAUSE = exports.PAUSE = exports.PLAY_AND_FADE_IN = exports.PLAY = exports.TOGGLE_PLAYING = undefined;
+	exports.TOGGLE_INFO_BOX_DURING_PLAYBACK = exports.HIDE_INFO_BOX_DURING_PLAYBACK = exports.SHOW_INFO_BOX_DURING_PLAYBACK = exports.CONTROLS_HIDDEN = exports.FOCUS_LEFT_CONTROLS = exports.FOCUS_ENTERED_CONTROLS = exports.CONTROLS_LEFT = exports.CONTROLS_ENTERED = exports.USER_IDLE = exports.USER_INTERACTION = exports.HAS_NOT_BEEN_PLAYING_FOR_A_MOMENT = exports.WAITING = exports.SEEKED = exports.SEEKING = exports.ENDED = exports.TIME_UPDATE = exports.PAUSED = exports.PLAYING = exports.PROGRESS = exports.META_DATA_LOADED = exports.BUFFER_UNDERRUN_CONTINUE = exports.BUFFER_UNDERRUN = exports.ABORT_PREBUFFERING = exports.PREBUFFERED = exports.PREBUFFER = exports.SEEK_TO = exports.SCRUB_TO = exports.PLAY_MUTED = exports.PLAY_FAILED = exports.FADE_OUT_AND_PAUSE = exports.PAUSE = exports.PLAY_AND_FADE_IN = exports.PLAY = exports.TOGGLE_PLAYING = undefined;
 	exports.actionCreators = actionCreators;
 	exports.updateTextTrackSettings = updateTextTrackSettings;
 	exports.updateVideoQualitySetting = updateVideoQualitySetting;
@@ -24244,6 +24300,8 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	var PLAY_AND_FADE_IN = exports.PLAY_AND_FADE_IN = 'MEDIA_PLAY_AND_FADE_IN';
 	var PAUSE = exports.PAUSE = 'MEDIA_PAUSE';
 	var FADE_OUT_AND_PAUSE = exports.FADE_OUT_AND_PAUSE = 'MEDIA_FADE_OUT_AND_PAUSE';
+	var PLAY_FAILED = exports.PLAY_FAILED = 'MEDIA_PLAY_FAILED';
+	var PLAY_MUTED = exports.PLAY_MUTED = 'MEDIA_PLAY_MUTED';
 
 	var SCRUB_TO = exports.SCRUB_TO = 'MEDIA_SCRUB_TO';
 	var SEEK_TO = exports.SEEK_TO = 'MEDIA_SEEK_TO';
@@ -24311,6 +24369,12 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	        fadeDuration: fadeDuration
 	      });
 	    },
+	    playFailed: function playFailed() {
+	      return pageAction(PLAY_FAILED);
+	    },
+	    playMuted: function playMuted() {
+	      return pageAction(PLAY_MUTED);
+	    },
 	    scrubTo: function scrubTo(time) {
 	      return pageAction(SCRUB_TO, {
 	        time: time
@@ -24447,6 +24511,20 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 /***/ }),
 /* 500 */
+/***/ (function(module, exports) {
+
+	"use strict";
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+	exports.muted = muted;
+	function muted(state) {
+	  return state.backgroundMedia.muted;
+	}
+
+/***/ }),
+/* 501 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -24460,7 +24538,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _selectors = __webpack_require__(486);
 
-	var _selectors2 = __webpack_require__(501);
+	var _selectors2 = __webpack_require__(502);
 
 	var _reactRedux = __webpack_require__(397);
 
@@ -24502,7 +24580,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}))(NonJsLinks);
 
 /***/ }),
-/* 501 */
+/* 502 */
 /***/ (function(module, exports) {
 
 	"use strict";
@@ -24518,7 +24596,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 502 */
+/* 503 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -24527,19 +24605,24 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  value: true
 	});
 	exports.VideoPlayer = undefined;
+
+	var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
 	exports.default = PageVideoPlayer;
 
-	var _VideoFilePlayer = __webpack_require__(503);
+	var _VideoFilePlayer = __webpack_require__(504);
 
 	var _VideoFilePlayer2 = _interopRequireDefault(_VideoFilePlayer);
 
-	var _createPageFilePlayer = __webpack_require__(515);
+	var _PageFilePlayer = __webpack_require__(516);
 
-	var _createPageFilePlayer2 = _interopRequireDefault(_createPageFilePlayer);
+	var _PageFilePlayer2 = _interopRequireDefault(_PageFilePlayer);
 
-	var _selectors = __webpack_require__(442);
+	var _selectors = __webpack_require__(500);
 
-	var _selectors2 = __webpack_require__(488);
+	var _selectors2 = __webpack_require__(442);
+
+	var _selectors3 = __webpack_require__(488);
 
 	var _utils = __webpack_require__(339);
 
@@ -24547,10 +24630,21 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
+	function PageVideoFilePlayer(props) {
+	  return React.createElement(_PageFilePlayer2.default, _extends({}, props, {
+	    playerComponent: _VideoFilePlayer2.default,
+	    preloadComponent: _VideoFilePlayer.VideoFilePlayerPreload }));
+	}
+
 	var VideoPlayer = exports.VideoPlayer = (0, _reactRedux.connect)((0, _utils.combineSelectors)({
-	  file: (0, _selectors.file)('videoFiles', { id: (0, _selectors2.prop)('videoFileId') }),
-	  posterImageFile: (0, _selectors.file)('imageFiles', { id: (0, _selectors2.prop)('posterImageFileId') })
-	}))((0, _createPageFilePlayer2.default)(_VideoFilePlayer2.default));
+	  file: (0, _selectors2.file)('videoFiles', { id: (0, _selectors3.prop)('videoFileId') }),
+	  posterImageFile: (0, _selectors2.file)('imageFiles', { id: (0, _selectors3.prop)('posterImageFileId') }),
+	  muted: muted
+	}))(PageVideoFilePlayer);
+
+	function muted(state, props) {
+	  return props.muted || (0, _selectors.muted)(state);
+	}
 
 	function PageVideoPlayer(props) {
 	  var page = props.page;
@@ -24577,7 +24671,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	};
 
 /***/ }),
-/* 503 */
+/* 504 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -24585,12 +24679,49 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	Object.defineProperty(exports, "__esModule", {
 	  value: true
 	});
+	exports.VideoFilePlayerPreload = undefined;
 
-	exports.default = function (props) {
-	  return React.createElement(
+	var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+	exports.default = VideoFilePlayer;
+
+	var _react = __webpack_require__(333);
+
+	var _react2 = _interopRequireDefault(_react);
+
+	var _createFilePlayer = __webpack_require__(505);
+
+	var _createFilePlayer2 = _interopRequireDefault(_createFilePlayer);
+
+	var _Positioner = __webpack_require__(512);
+
+	var _Positioner2 = _interopRequireDefault(_Positioner);
+
+	var _sources = __webpack_require__(515);
+
+	var _sources2 = _interopRequireDefault(_sources);
+
+	var _utils = __webpack_require__(339);
+
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+	function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+	function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+	function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+	var FilePlayer = (0, _createFilePlayer2.default)({
+	  tagName: 'video',
+	  sources: _sources2.default,
+	  poster: poster
+	});
+
+	function VideoFilePlayer(props) {
+	  return _react2.default.createElement(
 	    _Positioner2.default,
 	    { videoFile: props.file, fit: props.fit, position: props.position },
-	    React.createElement(VideoFilePlayer, { file: props.file,
+	    _react2.default.createElement(FilePlayer, { file: props.file,
 	      posterImageFile: props.posterImageFile,
 	      playerState: props.playerState,
 	      playerActions: props.playerActions,
@@ -24601,35 +24732,52 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	      muted: props.muted,
 	      playsInline: props.playsInline })
 	  );
-	};
+	}
 
-	var _createFilePlayer = __webpack_require__(504);
+	var VideoFilePlayerPreload = exports.VideoFilePlayerPreload = function (_React$Component) {
+	  _inherits(VideoFilePlayerPreload, _React$Component);
 
-	var _createFilePlayer2 = _interopRequireDefault(_createFilePlayer);
+	  function VideoFilePlayerPreload() {
+	    _classCallCheck(this, VideoFilePlayerPreload);
 
-	var _Positioner = __webpack_require__(511);
+	    return _possibleConstructorReturn(this, (VideoFilePlayerPreload.__proto__ || Object.getPrototypeOf(VideoFilePlayerPreload)).apply(this, arguments));
+	  }
 
-	var _Positioner2 = _interopRequireDefault(_Positioner);
+	  _createClass(VideoFilePlayerPreload, [{
+	    key: 'componentDidMount',
+	    value: function componentDidMount() {
+	      var _props = this.props,
+	          file = _props.file,
+	          posterImageFile = _props.posterImageFile,
+	          preloadImage = _props.preloadImage;
 
-	var _sources = __webpack_require__(514);
+	      var posterUrl = poster(file, posterImageFile);
 
-	var _sources2 = _interopRequireDefault(_sources);
+	      if (posterUrl) {
+	        preloadImage(posterUrl);
+	      }
+	    }
+	  }, {
+	    key: 'render',
+	    value: function render() {
+	      return null;
+	    }
+	  }]);
 
-	var _utils = __webpack_require__(339);
+	  return VideoFilePlayerPreload;
+	}(_react2.default.Component);
 
-	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+	VideoFilePlayerPreload.defaultProps = {
+	  preloadImage: _utils.preloadImage
+	};
 
-	var VideoFilePlayer = (0, _createFilePlayer2.default)({
-	  tagName: 'video',
-	  sources: _sources2.default,
-	  poster: function poster(videoFile, posterImageFile) {
-	    var style = (0, _utils.has)('mobile platform') ? 'medium' : 'large';
-	    return posterImageFile ? posterImageFile.urls[style] : videoFile.urls['poster_' + style];
-	  }
-	});
+	function poster(videoFile, posterImageFile) {
+	  var style = (0, _utils.has)('mobile platform') ? 'medium' : 'large';
+	  return posterImageFile ? posterImageFile.urls[style] : videoFile.urls['poster_' + style];
+	}
 
 /***/ }),
-/* 504 */
+/* 505 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -24660,6 +24808,8 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	      _this.displaysTextTracksInNativePlayer = _this.props.hasNativeVideoPlayer && tagName == 'video';
 
+	      _this.initiallyMuted = _this.props.muted;
+
 	      _this.updateAtmoSettings();
 
 	      _this.setupMediaTag = function (element) {
@@ -24703,7 +24853,9 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	          return;
 	        }
 
-	        (0, _handlePlayerState.updatePlayer)(this.player, prevProps.playerState, this.props.playerState, this.props.playerActions, this.props.playsInline);
+	        updatePlayerMuted(this.player, prevProps.muted, this.props.muted);
+
+	        (0, _handlePlayerState.updatePlayer)(this.player, prevProps.playerState, this.props.playerState, this.props.playerActions);
 
 	        if (!this.displaysTextTracksInNativePlayer) {
 	          (0, _textTracks.updateTextTracks)(this.player, prevProps.textTracks.activeFileId, this.props.textTracks.activeFileId, this.props.textTrackPosition);
@@ -24726,7 +24878,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	          tracks: (0, _textTracks.textTracksFromFiles)(this.props.textTracks.files, this.props.textTracksEnabled),
 	          poster: poster(this.props.file, this.props.posterImageFile),
 	          loop: this.props.loop,
-	          muted: this.props.muted,
+	          muted: this.initiallyMuted,
 	          playsInline: this.props.playsInline,
 	          alt: this.props.file.alt,
 
@@ -24771,23 +24923,23 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  return result;
 	};
 
-	var _MediaTag = __webpack_require__(505);
+	var _MediaTag = __webpack_require__(506);
 
 	var _MediaTag2 = _interopRequireDefault(_MediaTag);
 
-	var _createPageflowPlayer = __webpack_require__(506);
+	var _createPageflowPlayer = __webpack_require__(507);
 
 	var _createPageflowPlayer2 = _interopRequireDefault(_createPageflowPlayer);
 
-	var _watchPlayer = __webpack_require__(507);
+	var _watchPlayer = __webpack_require__(508);
 
 	var _watchPlayer2 = _interopRequireDefault(_watchPlayer);
 
 	var _actions = __webpack_require__(499);
 
-	var _handlePlayerState = __webpack_require__(508);
+	var _handlePlayerState = __webpack_require__(509);
 
-	var _textTracks = __webpack_require__(509);
+	var _textTracks = __webpack_require__(510);
 
 	var _selectors = __webpack_require__(498);
 
@@ -24797,7 +24949,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _selectors4 = __webpack_require__(439);
 
-	var _selectors5 = __webpack_require__(510);
+	var _selectors5 = __webpack_require__(511);
 
 	var _react = __webpack_require__(333);
 
@@ -24832,8 +24984,14 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  }
 	}
 
+	function updatePlayerMuted(player, prevMuted, muted) {
+	  if (prevMuted !== muted) {
+	    player.muted(muted);
+	  }
+	}
+
 /***/ }),
-/* 505 */
+/* 506 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -25023,7 +25181,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 506 */
+/* 507 */
 /***/ (function(module, exports) {
 
 	'use strict';
@@ -25056,6 +25214,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	    bufferUnderrunWaiting: true,
 	    useSlimPlayerControlsDuringPhonePlayback: !playsInline && !isAudio,
 	    fullscreenDuringPhonePlayback: !playsInline && !isAudio,
+	    fallbackToMutedAutoplay: !isAudio,
 
 	    volumeFading: true,
 	    hooks: pageflow.atmo.createMediaPlayerHooks(atmoSettings),
@@ -25077,7 +25236,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 507 */
+/* 508 */
 /***/ (function(module, exports) {
 
 	'use strict';
@@ -25101,6 +25260,8 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  });
 
 	  player.on('play', actions.playing);
+	  player.on('playfailed', actions.playFailed);
+	  player.on('playmuted', actions.playMuted);
 	  player.on('pause', actions.paused);
 	  player.on('waiting', actions.waiting);
 	  player.on('seeking', actions.seeking);
@@ -25119,7 +25280,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	};
 
 /***/ }),
-/* 508 */
+/* 509 */
 /***/ (function(module, exports) {
 
 	'use strict';
@@ -25153,7 +25314,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  });
 	}
 
-	function updatePlayer(player, playerState, nextPlayerState, playerActions, playsInline) {
+	function updatePlayer(player, playerState, nextPlayerState, playerActions) {
 	  if (!playerState.shouldPrebuffer && nextPlayerState.shouldPrebuffer) {
 	    player.prebuffer().then(playerActions.prebuffered);
 	  }
@@ -25178,7 +25339,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 509 */
+/* 510 */
 /***/ (function(module, exports) {
 
 	'use strict';
@@ -25249,7 +25410,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 510 */
+/* 511 */
 /***/ (function(module, exports) {
 
 	"use strict";
@@ -25265,7 +25426,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 511 */
+/* 512 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -25278,11 +25439,11 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	exports.default = Positioner;
 
-	var _getDimensions = __webpack_require__(512);
+	var _getDimensions = __webpack_require__(513);
 
 	var _getDimensions2 = _interopRequireDefault(_getDimensions);
 
-	var _getCueOffsetClassName = __webpack_require__(513);
+	var _getCueOffsetClassName = __webpack_require__(514);
 
 	var _getCueOffsetClassName2 = _interopRequireDefault(_getCueOffsetClassName);
 
@@ -25333,7 +25494,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 512 */
+/* 513 */
 /***/ (function(module, exports) {
 
 	'use strict';
@@ -25387,7 +25548,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	};
 
 /***/ }),
-/* 513 */
+/* 514 */
 /***/ (function(module, exports) {
 
 	'use strict';
@@ -25410,7 +25571,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 514 */
+/* 515 */
 /***/ (function(module, exports) {
 
 	'use strict';
@@ -25457,7 +25618,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	};
 
 /***/ }),
-/* 515 */
+/* 516 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -25465,33 +25626,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	Object.defineProperty(exports, "__esModule", {
 	  value: true
 	});
-
-	exports.default = function (FilePlayer) {
-	  function PageFilePlayer(props) {
-	    if (props.file && props.file.isReady && props.pageIsPrepared) {
-	      return React.createElement(FilePlayer, { file: props.file,
-	        posterImageFile: props.posterImageFile,
-	        playerState: props.playerState,
-	        playerActions: props.playerActions,
-	        atmoDuringPlayback: props.atmoDuringPlayback,
-	        fit: props.fit,
-	        position: props.position,
-	        loop: props.loop,
-	        muted: props.muted,
-	        playsInline: props.playsInline,
-	        defaultTextTrackFileId: props.defaultTextTrackFileId,
-	        textTracksEnabled: props.textTracksEnabled });
-	    } else {
-	      return null;
-	    }
-	  }
-
-	  return (0, _pages.connectInPage)((0, _utils.combineSelectors)({
-	    pageIsPrepared: (0, _selectors.pageIsPrepared)(),
-	    atmoDuringPlayback: (0, _selectors.pageAttribute)('atmoDuringPlayback'),
-	    defaultTextTrackFileId: (0, _selectors.pageAttribute)('defaultTextTrackFileId')
-	  }))(PageFilePlayer);
-	};
+	exports.PageFilePlayer = PageFilePlayer;
 
 	var _pages = __webpack_require__(348);
 
@@ -25499,8 +25634,43 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _utils = __webpack_require__(339);
 
+	function PageFilePlayer(props) {
+	  var fileReady = props.file && props.file.isReady;
+
+	  if (fileReady && props.pageIsPrepared) {
+	    var FilePlayer = props.playerComponent;
+
+	    return React.createElement(FilePlayer, { file: props.file,
+	      posterImageFile: props.posterImageFile,
+	      playerState: props.playerState,
+	      playerActions: props.playerActions,
+	      atmoDuringPlayback: props.atmoDuringPlayback,
+	      fit: props.fit,
+	      position: props.position,
+	      loop: props.loop,
+	      muted: props.muted,
+	      playsInline: props.playsInline,
+	      defaultTextTrackFileId: props.defaultTextTrackFileId,
+	      textTracksEnabled: props.textTracksEnabled });
+	  } else if (props.preloadComponent && fileReady && props.pageIsPreloaded) {
+	    var Preload = props.preloadComponent;
+
+	    return React.createElement(Preload, { file: props.file,
+	      posterImageFile: props.posterImageFile });
+	  } else {
+	    return React.createElement('noscript', null);
+	  }
+	}
+
+	exports.default = (0, _pages.connectInPage)((0, _utils.combineSelectors)({
+	  pageIsPrepared: (0, _selectors.pageIsPrepared)(),
+	  pageIsPreloaded: (0, _selectors.pageIsPreloaded)(),
+	  atmoDuringPlayback: (0, _selectors.pageAttribute)('atmoDuringPlayback'),
+	  defaultTextTrackFileId: (0, _selectors.pageAttribute)('defaultTextTrackFileId')
+	}))(PageFilePlayer);
+
 /***/ }),
-/* 516 */
+/* 517 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -25554,7 +25724,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}))(MobilePageVideoPoster);
 
 /***/ }),
-/* 517 */
+/* 518 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -25567,11 +25737,11 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	exports.PageBackgroundVideo = PageBackgroundVideo;
 
-	var _PageVideoPlayer = __webpack_require__(502);
+	var _PageVideoPlayer = __webpack_require__(503);
 
 	var _PageVideoPlayer2 = _interopRequireDefault(_PageVideoPlayer);
 
-	var _MobilePageVideoPoster = __webpack_require__(516);
+	var _MobilePageVideoPoster = __webpack_require__(517);
 
 	var _MobilePageVideoPoster2 = _interopRequireDefault(_MobilePageVideoPoster);
 
@@ -25611,7 +25781,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}))(PageBackgroundVideo);
 
 /***/ }),
-/* 518 */
+/* 519 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -25623,7 +25793,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _components = __webpack_require__(331);
 
-	var _PageBackgroundVideo = __webpack_require__(517);
+	var _PageBackgroundVideo = __webpack_require__(518);
 
 	var _PageBackgroundVideo2 = _interopRequireDefault(_PageBackgroundVideo);
 
@@ -25665,7 +25835,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}))(PageBackgroundAsset);
 
 /***/ }),
-/* 519 */
+/* 520 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -25677,7 +25847,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _components = __webpack_require__(331);
 
-	var _PageBackgroundAsset = __webpack_require__(518);
+	var _PageBackgroundAsset = __webpack_require__(519);
 
 	var _PageBackgroundAsset2 = _interopRequireDefault(_PageBackgroundAsset);
 
@@ -25693,7 +25863,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 520 */
+/* 521 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -25761,7 +25931,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 521 */
+/* 522 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -25801,6 +25971,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	      case _actions.PLAY:
 	        return _extends({}, state, {
 	          shouldPlay: true,
+	          playFailed: false,
 	          hasBeenPlayingJustNow: true,
 	          unplayed: false,
 	          fadeDuration: null,
@@ -25810,6 +25981,15 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	        return _extends({}, state, {
 	          isPlaying: true
 	        });
+	      case _actions.PLAY_FAILED:
+	        return _extends({}, state, {
+	          shouldPlay: false,
+	          playFailed: true,
+	          hasBeenPlayingJustNow: false,
+	          unplayed: true,
+	          fadeDuration: null,
+	          isLoading: false
+	        });
 	      case _actions.PLAY_AND_FADE_IN:
 	        return _extends({}, state, {
 	          shouldPlay: true,
@@ -25967,12 +26147,12 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _actions = __webpack_require__(499);
 
-	var _actions2 = __webpack_require__(522);
+	var _actions2 = __webpack_require__(523);
 
 	var _actions3 = __webpack_require__(329);
 
 /***/ }),
-/* 522 */
+/* 523 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -26002,7 +26182,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 523 */
+/* 524 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -26010,33 +26190,40 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	Object.defineProperty(exports, "__esModule", {
 	  value: true
 	});
+
+	var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
 	exports.default = _callee;
 
-	var _togglePlaying = __webpack_require__(524);
+	var _togglePlaying = __webpack_require__(525);
 
 	var _togglePlaying2 = _interopRequireDefault(_togglePlaying);
 
-	var _handlePageDidActivate = __webpack_require__(525);
+	var _muteBackgroundMediaOnPlayFailed = __webpack_require__(526);
+
+	var _muteBackgroundMediaOnPlayFailed2 = _interopRequireDefault(_muteBackgroundMediaOnPlayFailed);
+
+	var _handlePageDidActivate = __webpack_require__(527);
 
 	var _handlePageDidActivate2 = _interopRequireDefault(_handlePageDidActivate);
 
-	var _disableScrollIndicatorDuringPlayback = __webpack_require__(526);
+	var _disableScrollIndicatorDuringPlayback = __webpack_require__(529);
 
 	var _disableScrollIndicatorDuringPlayback2 = _interopRequireDefault(_disableScrollIndicatorDuringPlayback);
 
-	var _hasNotBeenPlayingForAMoment = __webpack_require__(527);
+	var _hasNotBeenPlayingForAMoment = __webpack_require__(530);
 
 	var _hasNotBeenPlayingForAMoment2 = _interopRequireDefault(_hasNotBeenPlayingForAMoment);
 
-	var _idling = __webpack_require__(528);
+	var _idling = __webpack_require__(531);
 
 	var _idling2 = _interopRequireDefault(_idling);
 
-	var _fadeOutWhenPageWillDeactivate = __webpack_require__(529);
+	var _fadeOutWhenPageWillDeactivate = __webpack_require__(532);
 
 	var _fadeOutWhenPageWillDeactivate2 = _interopRequireDefault(_fadeOutWhenPageWillDeactivate);
 
-	var _goToNextPageOnEnd = __webpack_require__(530);
+	var _goToNextPageOnEnd = __webpack_require__(533);
 
 	var _goToNextPageOnEnd2 = _interopRequireDefault(_goToNextPageOnEnd);
 
@@ -26053,7 +26240,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	    while (1) {
 	      switch (_context.prev = _context.next) {
 	        case 0:
-	          sagas = [(0, _togglePlaying2.default)()];
+	          sagas = [(0, _togglePlaying2.default)(), (0, _muteBackgroundMediaOnPlayFailed2.default)()];
 
 
 	          if (!options.playsInNativePlayer || !options.playsInNativePlayer()) {
@@ -26061,7 +26248,9 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	          }
 
 	          if (!(0, _utils.has)('mobile platform')) {
-	            sagas.push([(0, _handlePageDidActivate2.default)()]);
+	            sagas.push([(0, _handlePageDidActivate2.default)(_extends({}, options, {
+	              canAutoplay: (0, _utils.has)('autoplay support')
+	            }))]);
 	          }
 
 	          if (options.hideControls) {
@@ -26080,7 +26269,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 524 */
+/* 525 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -26092,7 +26281,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _actions = __webpack_require__(499);
 
-	var _actions2 = __webpack_require__(522);
+	var _actions2 = __webpack_require__(523);
 
 	var _selectors = __webpack_require__(498);
 
@@ -26142,14 +26331,20 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	          return (0, _effects.put)(pause());
 
 	        case 6:
-	          _context2.next = 10;
+	          _context2.next = 12;
 	          break;
 
 	        case 8:
 	          _context2.next = 10;
-	          return (0, _effects.put)(play());
+	          return (0, _effects.call)(function () {
+	            return pageflow.backgroundMedia.unmute();
+	          });
 
 	        case 10:
+	          _context2.next = 12;
+	          return (0, _effects.put)(play());
+
+	        case 12:
 	        case 'end':
 	          return _context2.stop();
 	      }
@@ -26158,7 +26353,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 525 */
+/* 526 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -26166,106 +26361,271 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	Object.defineProperty(exports, "__esModule", {
 	  value: true
 	});
-	exports.default = _callee2;
+	exports.default = _callee;
+
+	var _actions = __webpack_require__(499);
 
 	var _reduxSaga = __webpack_require__(387);
 
 	var _effects = __webpack_require__(383);
 
-	var _actions = __webpack_require__(329);
-
-	var _actions2 = __webpack_require__(499);
-
-	var _selectors = __webpack_require__(375);
+	var _marked = /*#__PURE__*/regeneratorRuntime.mark(_callee),
+	    _marked2 = /*#__PURE__*/regeneratorRuntime.mark(muteBackgoundAudio);
 
-	var _marked = /*#__PURE__*/regeneratorRuntime.mark(_callee2),
-	    _marked2 = /*#__PURE__*/regeneratorRuntime.mark(prebufferAndPlay);
+	function _callee() {
+	  return regeneratorRuntime.wrap(function _callee$(_context) {
+	    while (1) {
+	      switch (_context.prev = _context.next) {
+	        case 0:
+	          _context.next = 2;
+	          return (0, _reduxSaga.takeEvery)([_actions.PLAY_FAILED, _actions.PLAY_MUTED], muteBackgoundAudio);
 
-	var _actionCreators = (0, _actions2.actionCreators)(),
-	    play = _actionCreators.play,
-	    prebuffer = _actionCreators.prebuffer,
-	    waiting = _actionCreators.waiting;
+	        case 2:
+	        case 'end':
+	          return _context.stop();
+	      }
+	    }
+	  }, _marked, this);
+	}
 
-	function _callee2() {
-	  return regeneratorRuntime.wrap(function _callee2$(_context2) {
+	function muteBackgoundAudio() {
+	  return regeneratorRuntime.wrap(function muteBackgoundAudio$(_context2) {
 	    while (1) {
 	      switch (_context2.prev = _context2.next) {
 	        case 0:
 	          _context2.next = 2;
-	          return (0, _reduxSaga.takeEvery)(_actions.PAGE_DID_ACTIVATE, /*#__PURE__*/regeneratorRuntime.mark(function _callee(action) {
-	            return regeneratorRuntime.wrap(function _callee$(_context) {
-	              while (1) {
-	                switch (_context.prev = _context.next) {
-	                  case 0:
-	                    _context.next = 2;
-	                    return (0, _effects.race)({
-	                      task: (0, _effects.call)(prebufferAndPlay),
-	                      cancel: (0, _effects.take)(_actions.PAGE_WILL_DEACTIVATE)
-	                    });
-
-	                  case 2:
-	                  case 'end':
-	                    return _context.stop();
-	                }
-	              }
-	            }, _callee, this);
-	          }));
+	          return (0, _effects.call)(function () {
+	            return pageflow.backgroundMedia.mute();
+	          });
 
 	        case 2:
 	        case 'end':
 	          return _context2.stop();
 	      }
 	    }
-	  }, _marked, this);
+	  }, _marked2, this);
 	}
 
-	function prebufferAndPlay() {
-	  var autoplay;
-	  return regeneratorRuntime.wrap(function prebufferAndPlay$(_context3) {
+/***/ }),
+/* 527 */
+/***/ (function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+	exports.default = _callee2;
+
+	var _reduxSaga = __webpack_require__(387);
+
+	var _effects = __webpack_require__(383);
+
+	var _actions = __webpack_require__(329);
+
+	var _actions2 = __webpack_require__(499);
+
+	var _actions3 = __webpack_require__(528);
+
+	var _selectors = __webpack_require__(498);
+
+	var _marked = /*#__PURE__*/regeneratorRuntime.mark(_callee2),
+	    _marked2 = /*#__PURE__*/regeneratorRuntime.mark(prebufferAndPlayOnUnmute),
+	    _marked3 = /*#__PURE__*/regeneratorRuntime.mark(prebufferAndPlay),
+	    _marked4 = /*#__PURE__*/regeneratorRuntime.mark(autoplayPage);
+
+	var _actionCreators = (0, _actions2.actionCreators)(),
+	    play = _actionCreators.play,
+	    prebuffer = _actionCreators.prebuffer,
+	    waiting = _actionCreators.waiting;
+
+	function _callee2(options) {
+	  return regeneratorRuntime.wrap(function _callee2$(_context2) {
 	    while (1) {
-	      switch (_context3.prev = _context3.next) {
+	      switch (_context2.prev = _context2.next) {
 	        case 0:
-	          _context3.next = 2;
-	          return (0, _effects.select)((0, _selectors.pageAttribute)('autoplay'));
+	          _context2.next = 2;
+	          return (0, _reduxSaga.takeEvery)(_actions.PAGE_DID_ACTIVATE, /*#__PURE__*/regeneratorRuntime.mark(function _callee(action) {
+	            return regeneratorRuntime.wrap(function _callee$(_context) {
+	              while (1) {
+	                switch (_context.prev = _context.next) {
+	                  case 0:
+	                    _context.next = 2;
+	                    return [(0, _effects.race)({
+	                      task: (0, _effects.call)(prebufferAndPlay, options),
+	                      cancel: (0, _effects.take)(_actions.PAGE_WILL_DEACTIVATE)
+	                    }), (0, _effects.race)({
+	                      task: (0, _effects.call)(prebufferAndPlayOnUnmute, options),
+	                      cancel: (0, _effects.take)(_actions.PAGE_WILL_DEACTIVATE)
+	                    })];
+
+	                  case 2:
+	                  case 'end':
+	                    return _context.stop();
+	                }
+	              }
+	            }, _callee, this);
+	          }));
 
 	        case 2:
-	          autoplay = _context3.sent;
+	        case 'end':
+	          return _context2.stop();
+	      }
+	    }
+	  }, _marked, this);
+	}
+
+	function prebufferAndPlayOnUnmute(options) {
+	  var _ref, unmute;
+
+	  return regeneratorRuntime.wrap(function prebufferAndPlayOnUnmute$(_context3) {
+	    while (1) {
+	      switch (_context3.prev = _context3.next) {
+	        case 0:
+	          _context3.t0 = options.retryOnUnmute;
 
-	          if (!(autoplay !== false)) {
-	            _context3.next = 6;
+	          if (!_context3.t0) {
+	            _context3.next = 5;
 	            break;
 	          }
 
-	          _context3.next = 6;
-	          return (0, _effects.put)(waiting());
+	          _context3.next = 4;
+	          return (0, _effects.select)((0, _selectors.pageHasAutoplayOption)());
+
+	        case 4:
+	          _context3.t0 = _context3.sent;
+
+	        case 5:
+	          if (!_context3.t0) {
+	            _context3.next = 12;
+	            break;
+	          }
 
-	        case 6:
 	          _context3.next = 8;
-	          return [(0, _effects.take)(_actions2.PREBUFFERED), (0, _effects.put)(prebuffer())];
+	          return (0, _effects.race)({
+	            unmute: (0, _effects.take)(_actions3.UNMUTE),
+	            cancel: (0, _effects.take)(_actions.PAGE_WILL_DEACTIVATE)
+	          });
 
 	        case 8:
-	          if (!(autoplay !== false)) {
-	            _context3.next = 13;
+	          _ref = _context3.sent;
+	          unmute = _ref.unmute;
+
+	          if (!unmute) {
+	            _context3.next = 12;
+	            break;
+	          }
+
+	          return _context3.delegateYield(prebufferAndPlay(options), 't1', 12);
+
+	        case 12:
+	        case 'end':
+	          return _context3.stop();
+	      }
+	    }
+	  }, _marked2, this);
+	}
+
+	function prebufferAndPlay(options) {
+	  var autoplay;
+	  return regeneratorRuntime.wrap(function prebufferAndPlay$(_context4) {
+	    while (1) {
+	      switch (_context4.prev = _context4.next) {
+	        case 0:
+	          return _context4.delegateYield(autoplayPage(options), 't0', 1);
+
+	        case 1:
+	          autoplay = _context4.t0;
+
+	          if (!autoplay) {
+	            _context4.next = 5;
+	            break;
+	          }
+
+	          _context4.next = 5;
+	          return (0, _effects.put)(waiting());
+
+	        case 5:
+	          _context4.next = 7;
+	          return [(0, _effects.take)(_actions2.PREBUFFERED), (0, _effects.put)(prebuffer())];
+
+	        case 7:
+	          if (!autoplay) {
+	            _context4.next = 12;
 	            break;
 	          }
 
-	          _context3.next = 11;
+	          _context4.next = 10;
 	          return (0, _effects.call)(_reduxSaga.delay, 1000);
 
-	        case 11:
-	          _context3.next = 13;
+	        case 10:
+	          _context4.next = 12;
 	          return (0, _effects.put)(play());
 
-	        case 13:
+	        case 12:
 	        case 'end':
-	          return _context3.stop();
+	          return _context4.stop();
 	      }
 	    }
-	  }, _marked2, this);
+	  }, _marked3, this);
+	}
+
+	function autoplayPage(_ref2) {
+	  var canAutoplay = _ref2.canAutoplay,
+	      _autoplayWhenBackgroundMediaMuted = _ref2.autoplayWhenBackgroundMediaMuted;
+	  var shouldAutoplay;
+	  return regeneratorRuntime.wrap(function autoplayPage$(_context5) {
+	    while (1) {
+	      switch (_context5.prev = _context5.next) {
+	        case 0:
+	          _context5.next = 2;
+	          return (0, _effects.select)((0, _selectors.pageShouldAutoplay)({
+	            autoplayWhenBackgroundMediaMuted: function autoplayWhenBackgroundMediaMuted() {
+	              return _autoplayWhenBackgroundMediaMuted;
+	            }
+	          }));
+
+	        case 2:
+	          shouldAutoplay = _context5.sent;
+	          return _context5.abrupt('return', shouldAutoplay && canAutoplay);
+
+	        case 4:
+	        case 'end':
+	          return _context5.stop();
+	      }
+	    }
+	  }, _marked4, this);
 	}
 
 /***/ }),
-/* 526 */
+/* 528 */
+/***/ (function(module, exports) {
+
+	'use strict';
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+	exports.mute = mute;
+	exports.unmute = unmute;
+	var MUTE = exports.MUTE = 'BACKGROUND_MEDIA_MUTE';
+
+	var UNMUTE = exports.UNMUTE = 'BACKGROUND_MEDIA_UNMUTE';
+
+	function mute() {
+	  return {
+	    type: MUTE
+	  };
+	}
+
+	function unmute() {
+	  return {
+	    type: UNMUTE
+	  };
+	}
+
+/***/ }),
+/* 529 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -26360,7 +26720,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 527 */
+/* 530 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -26433,7 +26793,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 528 */
+/* 531 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -26449,7 +26809,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _actions = __webpack_require__(499);
 
-	var _actions2 = __webpack_require__(522);
+	var _actions2 = __webpack_require__(523);
 
 	var _marked = /*#__PURE__*/regeneratorRuntime.mark(_callee),
 	    _marked2 = /*#__PURE__*/regeneratorRuntime.mark(putAfterDelay);
@@ -26494,7 +26854,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 529 */
+/* 532 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -26551,7 +26911,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 530 */
+/* 533 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -26623,7 +26983,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 531 */
+/* 534 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -26705,7 +27065,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 532 */
+/* 535 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -26715,11 +27075,11 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	});
 	exports.Page = exports.reduxModule = undefined;
 
-	var _Page = __webpack_require__(533);
+	var _Page = __webpack_require__(536);
 
 	var _Page2 = _interopRequireDefault(_Page);
 
-	var _reenableScrollIndicator = __webpack_require__(535);
+	var _reenableScrollIndicator = __webpack_require__(538);
 
 	var _reenableScrollIndicator2 = _interopRequireDefault(_reenableScrollIndicator);
 
@@ -26734,7 +27094,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	exports.Page = _Page2.default;
 
 /***/ }),
-/* 533 */
+/* 536 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -26755,7 +27115,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _components = __webpack_require__(331);
 
-	var _selectors = __webpack_require__(534);
+	var _selectors = __webpack_require__(537);
 
 	var _pages = __webpack_require__(348);
 
@@ -26874,7 +27234,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}))(PageWithInteractiveBackground);
 
 /***/ }),
-/* 534 */
+/* 537 */
 /***/ (function(module, exports) {
 
 	"use strict";
@@ -26893,7 +27253,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 535 */
+/* 538 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -26907,7 +27267,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _effects = __webpack_require__(383);
 
-	var _actions = __webpack_require__(536);
+	var _actions = __webpack_require__(539);
 
 	var _selectors = __webpack_require__(375);
 
@@ -26957,7 +27317,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 536 */
+/* 539 */
 /***/ (function(module, exports) {
 
 	'use strict';
@@ -26983,7 +27343,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 537 */
+/* 540 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -26993,7 +27353,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	});
 	exports.registry = undefined;
 
-	var _PageTypeRegistry = __webpack_require__(538);
+	var _PageTypeRegistry = __webpack_require__(541);
 
 	var _PageTypeRegistry2 = _interopRequireDefault(_PageTypeRegistry);
 
@@ -27004,7 +27364,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	exports.default = registry.register;
 
 /***/ }),
-/* 538 */
+/* 541 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -27106,7 +27466,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 539 */
+/* 542 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -27134,7 +27494,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  });
 	};
 
-	var _registerPageType = __webpack_require__(537);
+	var _registerPageType = __webpack_require__(540);
 
 	var _registerPageType2 = _interopRequireDefault(_registerPageType);
 
@@ -27143,7 +27503,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 /***/ }),
-/* 540 */
+/* 543 */
 /***/ (function(module, exports) {
 
 	"use strict";
@@ -27164,7 +27524,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	var registry = exports.registry = [];
 
 /***/ }),
-/* 541 */
+/* 544 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -27177,9 +27537,9 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _collections = __webpack_require__(376);
 
-	var _registerPageType = __webpack_require__(537);
+	var _registerPageType = __webpack_require__(540);
 
-	var _boot = __webpack_require__(542);
+	var _boot = __webpack_require__(545);
 
 	var _boot2 = _interopRequireDefault(_boot);
 
@@ -27237,7 +27597,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	exports.default = _class;
 
 /***/ }),
-/* 542 */
+/* 545 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -27267,21 +27627,24 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	    pageTypes: _registerPageType.registry,
 
+	    theming: seed.theming,
 	    files: collections.files || {},
 	    storylines: collections.storylines,
 	    chapters: collections.chapters,
 	    pages: collections.pages,
 	    widgets: isEditor ? pageflow.entry.widgets : seed.widgets,
 
+	    cookies: pageflow.cookies,
 	    hideText: pageflow.hideText,
 	    events: pageflow.events,
 	    settings: pageflow.settings,
 	    widgetsApi: pageflow.widgets,
+	    backgroundMedia: pageflow.backgroundMedia,
 
 	    window: isServerSide ? null : window
 	  };
 
-	  var store = (0, _createStore2.default)([_i18n2.default, _entry2.default, _current2.default, _storylines2.default, _chapters2.default, _pages2.default, _files2.default, _settings2.default, _hideText2.default, _widgets2.default, _widgetPresence2.default, _pageTypes2.default, _hotkeys2.default], options);
+	  var store = (0, _createStore2.default)([_backgroundMedia2.default, _cookieNotice2.default, _i18n2.default, _theming2.default, _entry2.default, _current2.default, _storylines2.default, _chapters2.default, _pages2.default, _files2.default, _settings2.default, _hideText2.default, _widgets2.default, _widgetPresence2.default, _pageTypes2.default, _hotkeys2.default], options);
 
 	  if (!isServerSide) {
 	    _registerPageType.registry.forEach(function (options) {
@@ -27301,19 +27664,31 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  return store;
 	};
 
-	var _registerPageType = __webpack_require__(537);
+	var _registerPageType = __webpack_require__(540);
 
-	var _registerWidgetType = __webpack_require__(540);
+	var _registerWidgetType = __webpack_require__(543);
 
-	var _createStore = __webpack_require__(543);
+	var _createStore = __webpack_require__(546);
 
 	var _createStore2 = _interopRequireDefault(_createStore);
 
-	var _storylines = __webpack_require__(545);
+	var _backgroundMedia = __webpack_require__(548);
+
+	var _backgroundMedia2 = _interopRequireDefault(_backgroundMedia);
+
+	var _cookieNotice = __webpack_require__(551);
+
+	var _cookieNotice2 = _interopRequireDefault(_cookieNotice);
+
+	var _theming = __webpack_require__(557);
+
+	var _theming2 = _interopRequireDefault(_theming);
+
+	var _storylines = __webpack_require__(560);
 
 	var _storylines2 = _interopRequireDefault(_storylines);
 
-	var _chapters = __webpack_require__(546);
+	var _chapters = __webpack_require__(561);
 
 	var _chapters2 = _interopRequireDefault(_chapters);
 
@@ -27321,50 +27696,50 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _pages2 = _interopRequireDefault(_pages);
 
-	var _pageTypes = __webpack_require__(547);
+	var _pageTypes = __webpack_require__(562);
 
 	var _pageTypes2 = _interopRequireDefault(_pageTypes);
 
-	var _current = __webpack_require__(550);
+	var _current = __webpack_require__(565);
 
 	var _current2 = _interopRequireDefault(_current);
 
-	var _files = __webpack_require__(554);
+	var _files = __webpack_require__(569);
 
 	var _files2 = _interopRequireDefault(_files);
 
-	var _settings = __webpack_require__(555);
+	var _settings = __webpack_require__(570);
 
 	var _settings2 = _interopRequireDefault(_settings);
 
-	var _i18n = __webpack_require__(557);
+	var _i18n = __webpack_require__(572);
 
 	var _i18n2 = _interopRequireDefault(_i18n);
 
-	var _entry = __webpack_require__(560);
+	var _entry = __webpack_require__(575);
 
 	var _entry2 = _interopRequireDefault(_entry);
 
-	var _hotkeys = __webpack_require__(563);
+	var _hotkeys = __webpack_require__(578);
 
 	var _hotkeys2 = _interopRequireDefault(_hotkeys);
 
-	var _hideText = __webpack_require__(564);
+	var _hideText = __webpack_require__(579);
 
 	var _hideText2 = _interopRequireDefault(_hideText);
 
-	var _widgets = __webpack_require__(567);
+	var _widgets = __webpack_require__(582);
 
 	var _widgets2 = _interopRequireDefault(_widgets);
 
-	var _widgetPresence = __webpack_require__(568);
+	var _widgetPresence = __webpack_require__(583);
 
 	var _widgetPresence2 = _interopRequireDefault(_widgetPresence);
 
 	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 /***/ }),
-/* 543 */
+/* 546 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	/* WEBPACK VAR INJECTION */(function(process) {'use strict';
@@ -27410,6 +27785,8 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  return store;
 	};
 
+	exports.createReducer = createReducer;
+
 	var _redux = __webpack_require__(351);
 
 	var _reduxSaga = __webpack_require__(387);
@@ -27471,10 +27848,10 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	    return enhancer;
 	  }
 	}
-	/* WEBPACK VAR INJECTION */}.call(exports, __webpack_require__(544)))
+	/* WEBPACK VAR INJECTION */}.call(exports, __webpack_require__(547)))
 
 /***/ }),
-/* 544 */
+/* 547 */
 /***/ (function(module, exports) {
 
 	// shim for using process in browser
@@ -27664,7 +28041,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 
 /***/ }),
-/* 545 */
+/* 548 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -27672,32 +28049,86 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	Object.defineProperty(exports, "__esModule", {
 	  value: true
 	});
+	exports.registerWidgetTypes = registerWidgetTypes;
 
-	var _collections = __webpack_require__(376);
+	var _reducer = __webpack_require__(549);
+
+	var _reducer2 = _interopRequireDefault(_reducer);
+
+	var _actions = __webpack_require__(528);
+
+	var _UnmuteButton = __webpack_require__(550);
+
+	var _reduxSaga = __webpack_require__(387);
+
+	var _effects = __webpack_require__(383);
+
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 	exports.default = {
 	  init: function init(_ref) {
-	    var storylines = _ref.storylines,
+	    var isServerSide = _ref.isServerSide,
+	        events = _ref.events,
 	        dispatch = _ref.dispatch;
 
-	    (0, _collections.watch)({
-	      collection: storylines,
-	      collectionName: 'storylines',
-	      dispatch: dispatch,
+	    if (!isServerSide) {
+	      events.on('background_media:mute', function (page) {
+	        return dispatch((0, _actions.mute)());
+	      });
 
-	      attributes: ['id'],
-	      includeConfiguration: true
-	    });
+	      events.on('background_media:unmute', function (page) {
+	        return dispatch((0, _actions.unmute)());
+	      });
+	    }
 	  },
 	  createReducers: function createReducers() {
-	    return {
-	      storylines: (0, _collections.createReducer)('storylines')
-	    };
+	    return { backgroundMedia: _reducer2.default };
+	  },
+
+
+	  createSaga: function createSaga(_ref2) {
+	    var backgroundMedia = _ref2.backgroundMedia;
+
+	    return (/*#__PURE__*/regeneratorRuntime.mark(function _callee2() {
+	        return regeneratorRuntime.wrap(function _callee2$(_context2) {
+	          while (1) {
+	            switch (_context2.prev = _context2.next) {
+	              case 0:
+	                _context2.next = 2;
+	                return (0, _reduxSaga.takeEvery)(_actions.UNMUTE, /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
+	                  return regeneratorRuntime.wrap(function _callee$(_context) {
+	                    while (1) {
+	                      switch (_context.prev = _context.next) {
+	                        case 0:
+	                          _context.next = 2;
+	                          return (0, _effects.call)(function () {
+	                            return backgroundMedia.unmute();
+	                          });
+
+	                        case 2:
+	                        case 'end':
+	                          return _context.stop();
+	                      }
+	                    }
+	                  }, _callee, this);
+	                }));
+
+	              case 2:
+	              case 'end':
+	                return _context2.stop();
+	            }
+	          }
+	        }, _callee2, this);
+	      })
+	    );
 	  }
 	};
+	function registerWidgetTypes() {
+	  (0, _UnmuteButton.register)();
+	}
 
 /***/ }),
-/* 546 */
+/* 549 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -27706,12 +28137,553 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  value: true
 	});
 
-	var _collections = __webpack_require__(376);
-
-	exports.default = {
-	  init: function init(_ref) {
-	    var chapters = _ref.chapters,
-	        dispatch = _ref.dispatch;
+	exports.default = function () {
+	  var state = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : initialState;
+	  var action = arguments[1];
+
+	  switch (action.type) {
+	    case _actions.MUTE:
+	      return {
+	        muted: true
+	      };
+	    case _actions.UNMUTE:
+	      return {
+	        muted: false
+	      };
+	    default:
+	      return state;
+	  }
+	};
+
+	var _actions = __webpack_require__(528);
+
+	var initialState = {
+	  muted: false
+	};
+
+/***/ }),
+/* 550 */
+/***/ (function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+	exports.register = register;
+
+	var _registerWidgetType = __webpack_require__(543);
+
+	var _registerWidgetType2 = _interopRequireDefault(_registerWidgetType);
+
+	var _selectors = __webpack_require__(500);
+
+	var _selectors2 = __webpack_require__(486);
+
+	var _actions = __webpack_require__(528);
+
+	var _utils = __webpack_require__(339);
+
+	var _react = __webpack_require__(333);
+
+	var _react2 = _interopRequireDefault(_react);
+
+	var _reactRedux = __webpack_require__(397);
+
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+	function UnmuteButton(props) {
+	  var t = props.t,
+	      muted = props.muted,
+	      unmute = props.unmute;
+
+
+	  if (muted) {
+	    return _react2.default.createElement(
+	      'div',
+	      { className: 'background_media_unmute_button' },
+	      _react2.default.createElement('a', { title: t('pageflow.public.mute_off'),
+	        onClick: function onClick() {
+	          playUnmuteSound();unmute();
+	        },
+	        href: '#' })
+	    );
+	  } else {
+	    return null;
+	  }
+	}
+
+	function playUnmuteSound() {
+	  new pageflow.AudioPlayer([{ src: pageflow.assetUrls.unmuteSound, type: 'audio/mpeg' }], { codecs: ['mp3'] }).play();
+	}
+
+	function register() {
+	  (0, _registerWidgetType2.default)('unmute_button', {
+	    component: (0, _reactRedux.connect)((0, _utils.combineSelectors)({
+	      t: _selectors2.t,
+	      muted: _selectors.muted
+	    }), {
+	      unmute: _actions.unmute
+	    })(UnmuteButton)
+	  });
+	}
+
+/***/ }),
+/* 551 */
+/***/ (function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+	exports.registerWidgetTypes = registerWidgetTypes;
+
+	var _CookieNoticeBar = __webpack_require__(552);
+
+	var _actions = __webpack_require__(555);
+
+	var _selectors = __webpack_require__(553);
+
+	var _createReducer = __webpack_require__(556);
+
+	var _createReducer2 = _interopRequireDefault(_createReducer);
+
+	var _reduxSaga = __webpack_require__(387);
+
+	var _effects = __webpack_require__(383);
+
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+	var COOKIE_KEY = 'cookie_notice_dismissed';
+
+	exports.default = {
+	  init: function init(_ref) {
+	    var isServerSide = _ref.isServerSide,
+	        events = _ref.events,
+	        dispatch = _ref.dispatch;
+
+	    if (!isServerSide) {
+	      events.on('cookie_notice:request', function () {
+	        return dispatch((0, _actions.request)());
+	      });
+	    }
+	  },
+	  createReducers: function createReducers(_ref2) {
+	    var cookies = _ref2.cookies;
+
+	    return {
+	      cookieNotice: (0, _createReducer2.default)({
+	        hasBeenDismissed: cookies && cookies.hasItem(COOKIE_KEY)
+	      })
+	    };
+	  },
+
+
+	  createSaga: function createSaga(_ref3) {
+	    var widgetsApi = _ref3.widgetsApi,
+	        cookies = _ref3.cookies;
+
+	    return (/*#__PURE__*/regeneratorRuntime.mark(function _callee3() {
+	        return regeneratorRuntime.wrap(function _callee3$(_context3) {
+	          while (1) {
+	            switch (_context3.prev = _context3.next) {
+	              case 0:
+	                _context3.next = 2;
+	                return (0, _reduxSaga.takeEvery)(_actions.REQUEST, /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
+	                  var resetWidgetMargin;
+	                  return regeneratorRuntime.wrap(function _callee$(_context) {
+	                    while (1) {
+	                      switch (_context.prev = _context.next) {
+	                        case 0:
+	                          _context.next = 2;
+	                          return (0, _effects.select)(_selectors.isCookieNoticeVisible);
+
+	                        case 2:
+	                          if (!_context.sent) {
+	                            _context.next = 10;
+	                            break;
+	                          }
+
+	                          _context.next = 5;
+	                          return (0, _effects.cps)(ensureWidgetMarginBottom, widgetsApi);
+
+	                        case 5:
+	                          resetWidgetMargin = _context.sent;
+	                          _context.next = 8;
+	                          return (0, _effects.take)(_actions.DISMISS);
+
+	                        case 8:
+	                          _context.next = 10;
+	                          return (0, _effects.call)(resetWidgetMargin);
+
+	                        case 10:
+	                        case 'end':
+	                          return _context.stop();
+	                      }
+	                    }
+	                  }, _callee, this);
+	                }));
+
+	              case 2:
+	                _context3.next = 4;
+	                return (0, _reduxSaga.takeEvery)(_actions.DISMISS, /*#__PURE__*/regeneratorRuntime.mark(function _callee2() {
+	                  return regeneratorRuntime.wrap(function _callee2$(_context2) {
+	                    while (1) {
+	                      switch (_context2.prev = _context2.next) {
+	                        case 0:
+	                          _context2.next = 2;
+	                          return (0, _effects.call)(function () {
+	                            cookies.setItem(COOKIE_KEY, true);
+	                          });
+
+	                        case 2:
+	                        case 'end':
+	                          return _context2.stop();
+	                      }
+	                    }
+	                  }, _callee2, this);
+	                }));
+
+	              case 4:
+	              case 'end':
+	                return _context3.stop();
+	            }
+	          }
+	        }, _callee3, this);
+	      })
+	    );
+	  }
+	};
+
+
+	function ensureWidgetMarginBottom(widgetsApi, callback) {
+	  widgetsApi.use({
+	    name: 'cookie_notice_bar_visible',
+	    insteadOf: 'cookie_notice_bar'
+	  }, function (reset) {
+	    return callback(null, reset);
+	  });
+	}
+
+	function registerWidgetTypes() {
+	  (0, _CookieNoticeBar.register)();
+	}
+
+/***/ }),
+/* 552 */
+/***/ (function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+	exports.register = register;
+
+	var _registerWidgetType = __webpack_require__(543);
+
+	var _registerWidgetType2 = _interopRequireDefault(_registerWidgetType);
+
+	var _selectors = __webpack_require__(553);
+
+	var _selectors2 = __webpack_require__(554);
+
+	var _selectors3 = __webpack_require__(493);
+
+	var _selectors4 = __webpack_require__(486);
+
+	var _actions = __webpack_require__(555);
+
+	var _utils = __webpack_require__(339);
+
+	var _react = __webpack_require__(333);
+
+	var _react2 = _interopRequireDefault(_react);
+
+	var _reactRedux = __webpack_require__(397);
+
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+	function CookieNoticeBar(props) {
+	  var isCookieNoticeVisible = props.isCookieNoticeVisible,
+	      editing = props.editing,
+	      t = props.t,
+	      dismiss = props.dismiss;
+
+
+	  if (isCookieNoticeVisible || editing) {
+	    return _react2.default.createElement(
+	      'div',
+	      { className: 'cookie_notice_bar' },
+	      _react2.default.createElement(
+	        'div',
+	        { className: 'cookie_notice_bar-content' },
+	        renderText(props),
+	        _react2.default.createElement(
+	          'a',
+	          { className: 'cookie_notice_bar-dismiss', onClick: dismiss },
+	          t('pageflow.public.dismiss_cookie_notice')
+	        )
+	      )
+	    );
+	  } else {
+	    return _react2.default.createElement('noscript', null);
+	  }
+	}
+
+	function renderText(_ref) {
+	  var privacyLinkUrl = _ref.privacyLinkUrl,
+	      t = _ref.t,
+	      locale = _ref.locale;
+
+	  var text = t('pageflow.public.cookie_notice_html', {
+	    privacyLinkUrl: privacyLinkUrl + '?lang=' + locale
+	  });
+
+	  return _react2.default.createElement('span', { className: 'cookie_notice_bar-text', dangerouslySetInnerHTML: {
+	      __html: text
+	    } });
+	}
+
+	function register() {
+	  (0, _registerWidgetType2.default)('cookie_notice_bar', {
+	    component: (0, _reactRedux.connect)((0, _utils.combineSelectors)({
+	      isCookieNoticeVisible: _selectors.isCookieNoticeVisible,
+	      privacyLinkUrl: _selectors2.privacyLinkUrl,
+	      editing: (0, _selectors3.editingWidget)({ role: 'cookie_notice' }),
+	      t: _selectors4.t,
+	      locale: _selectors4.locale
+	    }), {
+	      dismiss: _actions.dismiss
+	    })(CookieNoticeBar)
+	  });
+	}
+
+/***/ }),
+/* 553 */
+/***/ (function(module, exports) {
+
+	"use strict";
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+	exports.isCookieNoticeVisible = isCookieNoticeVisible;
+	function isCookieNoticeVisible(state) {
+	  return state.cookieNotice.visible;
+	}
+
+/***/ }),
+/* 554 */
+/***/ (function(module, exports) {
+
+	"use strict";
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+	exports.privacyLinkUrl = privacyLinkUrl;
+	function privacyLinkUrl(state) {
+	  return state.theming.privacy_link_url;
+	}
+
+/***/ }),
+/* 555 */
+/***/ (function(module, exports) {
+
+	'use strict';
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+	exports.request = request;
+	exports.dismiss = dismiss;
+	var REQUEST = exports.REQUEST = 'COOKIE_NOTICE_REQUEST';
+	var DISMISS = exports.DISMISS = 'COOKIE_NOTICE_DISMISS';
+
+	function request() {
+	  return {
+	    type: REQUEST
+	  };
+	}
+
+	function dismiss() {
+	  return {
+	    type: DISMISS
+	  };
+	}
+
+/***/ }),
+/* 556 */
+/***/ (function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+
+	var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+	exports.default = function (_ref) {
+	  var hasBeenDismissed = _ref.hasBeenDismissed;
+
+	  var initialState = {
+	    dismissed: hasBeenDismissed,
+	    visible: false
+	  };
+
+	  return function () {
+	    var state = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : initialState;
+	    var action = arguments[1];
+
+	    switch (action.type) {
+	      case _actions.REQUEST:
+	        if (!state.dismissed) {
+	          return _extends({}, state, {
+	            visible: true
+	          });
+	        }
+
+	        return state;
+	      case _actions.DISMISS:
+	        return {
+	          dismissed: true,
+	          visible: false
+	        };
+	      default:
+	        return state;
+	    }
+	  };
+	};
+
+	var _actions = __webpack_require__(555);
+
+/***/ }),
+/* 557 */
+/***/ (function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+
+	var _actions = __webpack_require__(558);
+
+	var _reducer = __webpack_require__(559);
+
+	var _reducer2 = _interopRequireDefault(_reducer);
+
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+	exports.default = {
+	  init: function init(_ref) {
+	    var theming = _ref.theming,
+	        dispatch = _ref.dispatch;
+
+	    dispatch((0, _actions.init)(theming));
+	  },
+	  createReducers: function createReducers() {
+	    return { theming: _reducer2.default };
+	  }
+	};
+
+/***/ }),
+/* 558 */
+/***/ (function(module, exports) {
+
+	'use strict';
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+	exports.init = init;
+	var INIT = exports.INIT = 'THEMING_INIT';
+
+	function init(theming) {
+	  return {
+	    type: INIT,
+	    payload: {
+	      theming: theming
+	    }
+	  };
+	}
+
+/***/ }),
+/* 559 */
+/***/ (function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+
+	exports.default = function () {
+	  var state = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+	  var action = arguments[1];
+
+	  switch (action.type) {
+	    case _actions.INIT:
+	      return action.payload.theming;
+	    default:
+	      return state;
+	  }
+	};
+
+	var _actions = __webpack_require__(558);
+
+/***/ }),
+/* 560 */
+/***/ (function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+
+	var _collections = __webpack_require__(376);
+
+	exports.default = {
+	  init: function init(_ref) {
+	    var storylines = _ref.storylines,
+	        dispatch = _ref.dispatch;
+
+	    (0, _collections.watch)({
+	      collection: storylines,
+	      collectionName: 'storylines',
+	      dispatch: dispatch,
+
+	      attributes: ['id'],
+	      includeConfiguration: true
+	    });
+	  },
+	  createReducers: function createReducers() {
+	    return {
+	      storylines: (0, _collections.createReducer)('storylines')
+	    };
+	  }
+	};
+
+/***/ }),
+/* 561 */
+/***/ (function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+
+	var _collections = __webpack_require__(376);
+
+	exports.default = {
+	  init: function init(_ref) {
+	    var chapters = _ref.chapters,
+	        dispatch = _ref.dispatch;
 
 	    (0, _collections.watch)({
 	      collection: chapters,
@@ -27729,7 +28701,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	};
 
 /***/ }),
-/* 547 */
+/* 562 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -27738,9 +28710,9 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  value: true
 	});
 
-	var _actions = __webpack_require__(548);
+	var _actions = __webpack_require__(563);
 
-	var _reducer = __webpack_require__(549);
+	var _reducer = __webpack_require__(564);
 
 	var _reducer2 = _interopRequireDefault(_reducer);
 
@@ -27761,7 +28733,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	};
 
 /***/ }),
-/* 548 */
+/* 563 */
 /***/ (function(module, exports) {
 
 	'use strict';
@@ -27784,7 +28756,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 549 */
+/* 564 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -27805,10 +28777,10 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  }
 	};
 
-	var _actions = __webpack_require__(548);
+	var _actions = __webpack_require__(563);
 
 /***/ }),
-/* 550 */
+/* 565 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -27818,11 +28790,11 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	});
 	exports.watch = exports.reducers = undefined;
 
-	var _reducer = __webpack_require__(551);
+	var _reducer = __webpack_require__(566);
 
 	var _reducer2 = _interopRequireDefault(_reducer);
 
-	var _watch = __webpack_require__(553);
+	var _watch = __webpack_require__(568);
 
 	var _watch2 = _interopRequireDefault(_watch);
 
@@ -27847,7 +28819,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	exports.watch = _watch2.default;
 
 /***/ }),
-/* 551 */
+/* 566 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -27868,10 +28840,10 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  }
 	};
 
-	var _actions = __webpack_require__(552);
+	var _actions = __webpack_require__(567);
 
 /***/ }),
-/* 552 */
+/* 567 */
 /***/ (function(module, exports) {
 
 	'use strict';
@@ -27894,7 +28866,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 553 */
+/* 568 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -27909,10 +28881,10 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  });
 	};
 
-	var _actions = __webpack_require__(552);
+	var _actions = __webpack_require__(567);
 
 /***/ }),
-/* 554 */
+/* 569 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -27971,7 +28943,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	};
 
 /***/ }),
-/* 555 */
+/* 570 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -27983,7 +28955,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	exports.createSaga = createSaga;
 	exports.watch = watch;
 
-	var _reducer = __webpack_require__(556);
+	var _reducer = __webpack_require__(571);
 
 	var _reducer2 = _interopRequireDefault(_reducer);
 
@@ -28089,7 +29061,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 556 */
+/* 571 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -28114,7 +29086,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	var _actions = __webpack_require__(330);
 
 /***/ }),
-/* 557 */
+/* 572 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -28123,9 +29095,9 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  value: true
 	});
 
-	var _actions = __webpack_require__(558);
+	var _actions = __webpack_require__(573);
 
-	var _reducer = __webpack_require__(559);
+	var _reducer = __webpack_require__(574);
 
 	var _reducer2 = _interopRequireDefault(_reducer);
 
@@ -28144,7 +29116,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	};
 
 /***/ }),
-/* 558 */
+/* 573 */
 /***/ (function(module, exports) {
 
 	'use strict';
@@ -28167,7 +29139,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 559 */
+/* 574 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -28188,10 +29160,10 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  }
 	};
 
-	var _actions = __webpack_require__(558);
+	var _actions = __webpack_require__(573);
 
 /***/ }),
-/* 560 */
+/* 575 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -28200,9 +29172,9 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  value: true
 	});
 
-	var _actions = __webpack_require__(561);
+	var _actions = __webpack_require__(576);
 
-	var _reducer = __webpack_require__(562);
+	var _reducer = __webpack_require__(577);
 
 	var _reducer2 = _interopRequireDefault(_reducer);
 
@@ -28221,7 +29193,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	};
 
 /***/ }),
-/* 561 */
+/* 576 */
 /***/ (function(module, exports) {
 
 	'use strict';
@@ -28244,7 +29216,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 562 */
+/* 577 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -28265,10 +29237,10 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  }
 	};
 
-	var _actions = __webpack_require__(561);
+	var _actions = __webpack_require__(576);
 
 /***/ }),
-/* 563 */
+/* 578 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -28279,7 +29251,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _keyCodes = __webpack_require__(479);
 
-	var _actions = __webpack_require__(522);
+	var _actions = __webpack_require__(523);
 
 	exports.default = {
 	  init: function init(_ref) {
@@ -28305,7 +29277,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	};
 
 /***/ }),
-/* 564 */
+/* 579 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -28315,11 +29287,11 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	});
 	exports.watch = exports.reducers = undefined;
 
-	var _watch = __webpack_require__(565);
+	var _watch = __webpack_require__(580);
 
 	var _watch2 = _interopRequireDefault(_watch);
 
-	var _reducer = __webpack_require__(566);
+	var _reducer = __webpack_require__(581);
 
 	var _reducer2 = _interopRequireDefault(_reducer);
 
@@ -28346,7 +29318,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	exports.watch = _watch2.default;
 
 /***/ }),
-/* 565 */
+/* 580 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -28365,10 +29337,10 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	            });
 	};
 
-	var _actions = __webpack_require__(536);
+	var _actions = __webpack_require__(539);
 
 /***/ }),
-/* 566 */
+/* 581 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -28402,9 +29374,9 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  }
 	};
 
-	var _actions = __webpack_require__(536);
+	var _actions = __webpack_require__(539);
 
-	var _actions2 = __webpack_require__(552);
+	var _actions2 = __webpack_require__(567);
 
 	var initialState = {
 	  isActive: false,
@@ -28412,7 +29384,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	};
 
 /***/ }),
-/* 567 */
+/* 582 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -28442,7 +29414,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	      collectionName: 'widgets',
 	      dispatch: dispatch,
 
-	      attributes: ['role', 'type_name'],
+	      attributes: ['role', 'type_name', 'editing'],
 	      includeConfiguration: true
 	    });
 	  },
@@ -28467,7 +29439,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 568 */
+/* 583 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -28476,11 +29448,11 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  value: true
 	});
 
-	var _reducer = __webpack_require__(569);
+	var _reducer = __webpack_require__(584);
 
 	var _reducer2 = _interopRequireDefault(_reducer);
 
-	var _actions = __webpack_require__(570);
+	var _actions = __webpack_require__(585);
 
 	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
@@ -28511,7 +29483,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	};
 
 /***/ }),
-/* 569 */
+/* 584 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -28533,10 +29505,10 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  }
 	};
 
-	var _actions = __webpack_require__(570);
+	var _actions = __webpack_require__(585);
 
 /***/ }),
-/* 570 */
+/* 585 */
 /***/ (function(module, exports) {
 
 	'use strict';
@@ -28559,7 +29531,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 571 */
+/* 586 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -28569,11 +29541,11 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	});
 	exports.register = register;
 
-	var _audio = __webpack_require__(572);
+	var _audio = __webpack_require__(587);
 
-	var _plain = __webpack_require__(575);
+	var _plain = __webpack_require__(590);
 
-	var _video = __webpack_require__(576);
+	var _video = __webpack_require__(591);
 
 	function register() {
 	  (0, _plain.register)();
@@ -28582,7 +29554,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 572 */
+/* 587 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -28594,11 +29566,11 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _media = __webpack_require__(494);
 
-	var _PageAudioFilePlayer = __webpack_require__(573);
+	var _PageAudioFilePlayer = __webpack_require__(588);
 
 	var _PageAudioFilePlayer2 = _interopRequireDefault(_PageAudioFilePlayer);
 
-	var _registerPageType = __webpack_require__(537);
+	var _registerPageType = __webpack_require__(540);
 
 	var _registerPageType2 = _interopRequireDefault(_registerPageType);
 
@@ -28624,7 +29596,8 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	      file: props.audioFile,
 	      playerState: props.playerState,
 	      playerActions: props.playerActions,
-	      controlBarText: props.t('pageflow.public.start_audio') },
+	      controlBarText: props.t('pageflow.public.start_audio'),
+	      autoplayWhenBackgroundMediaMuted: false },
 	    React.createElement(_media.PageBackgroundAsset, null),
 	    React.createElement(_PageAudioFilePlayer2.default, { file: props.audioFile,
 	      playerState: props.playerState,
@@ -28644,12 +29617,14 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	      playerActions: (0, _selectors.playerActions)()
 	    }))(AudioPage),
 
-	    reduxModules: [(0, _media.reduxModule)(), _media.pageBackgroundReduxModule]
+	    reduxModules: [(0, _media.reduxModule)({
+	      retryOnUnmute: true
+	    }), _media.pageBackgroundReduxModule]
 	  });
 	}
 
 /***/ }),
-/* 573 */
+/* 588 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -28658,20 +29633,26 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  value: true
 	});
 
-	var _createPageFilePlayer = __webpack_require__(515);
+	var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+	exports.default = PageAudioFilePlayer;
+
+	var _PageFilePlayer = __webpack_require__(516);
 
-	var _createPageFilePlayer2 = _interopRequireDefault(_createPageFilePlayer);
+	var _PageFilePlayer2 = _interopRequireDefault(_PageFilePlayer);
 
-	var _AudioFilePlayer = __webpack_require__(574);
+	var _AudioFilePlayer = __webpack_require__(589);
 
 	var _AudioFilePlayer2 = _interopRequireDefault(_AudioFilePlayer);
 
 	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-	exports.default = (0, _createPageFilePlayer2.default)(_AudioFilePlayer2.default);
+	function PageAudioFilePlayer(props) {
+	  return React.createElement(_PageFilePlayer2.default, _extends({}, props, { playerComponent: _AudioFilePlayer2.default }));
+	}
 
 /***/ }),
-/* 574 */
+/* 589 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -28680,7 +29661,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  value: true
 	});
 
-	var _createFilePlayer = __webpack_require__(504);
+	var _createFilePlayer = __webpack_require__(505);
 
 	var _createFilePlayer2 = _interopRequireDefault(_createFilePlayer);
 
@@ -28697,7 +29678,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	});
 
 /***/ }),
-/* 575 */
+/* 590 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -28711,7 +29692,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _media = __webpack_require__(494);
 
-	var _registerPageType = __webpack_require__(537);
+	var _registerPageType = __webpack_require__(540);
 
 	var _registerPageType2 = _interopRequireDefault(_registerPageType);
 
@@ -28755,7 +29736,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 576 */
+/* 591 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -28767,7 +29748,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _media = __webpack_require__(494);
 
-	var _registerPageType = __webpack_require__(537);
+	var _registerPageType = __webpack_require__(540);
 
 	var _registerPageType2 = _interopRequireDefault(_registerPageType);
 
@@ -28798,7 +29779,8 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	      qualities: qualities,
 	      playerState: props.playerState,
 	      playerActions: props.playerActions,
-	      controlBarText: props.t('pageflow.public.start_video') },
+	      controlBarText: props.t('pageflow.public.start_video'),
+	      autoplayWhenBackgroundMediaMuted: true },
 	    React.createElement(_media.PageVideoPlayer, { page: props.page,
 	      playerState: props.playerState,
 	      playerActions: props.playerActions }),
@@ -28820,13 +29802,14 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	    reduxModules: [(0, _media.reduxModule)({
 	      hideControls: true,
+	      autoplayWhenBackgroundMediaMuted: true,
 	      playsInNativePlayer: (0, _selectors5.has)('native video player')
 	    })]
 	  });
 	}
 
 /***/ }),
-/* 577 */
+/* 592 */
 /***/ (function(module, exports) {
 
 	module.exports = pageflow;