Skip to content

Commit

Permalink
Fixed autoplay issue for iOS
Browse files Browse the repository at this point in the history
  • Loading branch information
Philipp committed Oct 29, 2019
1 parent 74ed86f commit 973b9cc
Show file tree
Hide file tree
Showing 6 changed files with 124 additions and 103 deletions.
2 changes: 1 addition & 1 deletion demo/public/js/app.js

Large diffs are not rendered by default.

107 changes: 57 additions & 50 deletions dist/index.common.js
Original file line number Diff line number Diff line change
Expand Up @@ -1489,6 +1489,17 @@ module.exports = function (bitmap, value) {
};


/***/ }),

/***/ "6094":
/***/ (function(module, __webpack_exports__, __webpack_require__) {

"use strict";
/* harmony import */ var _node_modules_vue_style_loader_index_js_ref_6_oneOf_1_0_node_modules_css_loader_index_js_ref_6_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_6_oneOf_1_2_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_lib_index_js_vue_loader_options_VideoPlayer_vue_vue_type_style_index_0_id_fc38aede_scoped_true_lang_css___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("d2b2");
/* harmony import */ var _node_modules_vue_style_loader_index_js_ref_6_oneOf_1_0_node_modules_css_loader_index_js_ref_6_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_6_oneOf_1_2_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_lib_index_js_vue_loader_options_VideoPlayer_vue_vue_type_style_index_0_id_fc38aede_scoped_true_lang_css___WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_vue_style_loader_index_js_ref_6_oneOf_1_0_node_modules_css_loader_index_js_ref_6_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_6_oneOf_1_2_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_lib_index_js_vue_loader_options_VideoPlayer_vue_vue_type_style_index_0_id_fc38aede_scoped_true_lang_css___WEBPACK_IMPORTED_MODULE_0__);
/* unused harmony reexport * */
/* unused harmony default export */ var _unused_webpack_default_export = (_node_modules_vue_style_loader_index_js_ref_6_oneOf_1_0_node_modules_css_loader_index_js_ref_6_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_6_oneOf_1_2_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_lib_index_js_vue_loader_options_VideoPlayer_vue_vue_type_style_index_0_id_fc38aede_scoped_true_lang_css___WEBPACK_IMPORTED_MODULE_0___default.a);

/***/ }),

/***/ "60ae":
Expand Down Expand Up @@ -1813,17 +1824,6 @@ module.exports = function (NAME) {
module.exports = {};


/***/ }),

/***/ "76ae":
/***/ (function(module, __webpack_exports__, __webpack_require__) {

"use strict";
/* harmony import */ var _node_modules_vue_style_loader_index_js_ref_6_oneOf_1_0_node_modules_css_loader_index_js_ref_6_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_6_oneOf_1_2_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_lib_index_js_vue_loader_options_VideoPlayer_vue_vue_type_style_index_0_id_5eaa139b_scoped_true_lang_css___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("d66b");
/* harmony import */ var _node_modules_vue_style_loader_index_js_ref_6_oneOf_1_0_node_modules_css_loader_index_js_ref_6_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_6_oneOf_1_2_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_lib_index_js_vue_loader_options_VideoPlayer_vue_vue_type_style_index_0_id_5eaa139b_scoped_true_lang_css___WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_vue_style_loader_index_js_ref_6_oneOf_1_0_node_modules_css_loader_index_js_ref_6_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_6_oneOf_1_2_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_lib_index_js_vue_loader_options_VideoPlayer_vue_vue_type_style_index_0_id_5eaa139b_scoped_true_lang_css___WEBPACK_IMPORTED_MODULE_0__);
/* unused harmony reexport * */
/* unused harmony default export */ var _unused_webpack_default_export = (_node_modules_vue_style_loader_index_js_ref_6_oneOf_1_0_node_modules_css_loader_index_js_ref_6_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_6_oneOf_1_2_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_lib_index_js_vue_loader_options_VideoPlayer_vue_vue_type_style_index_0_id_5eaa139b_scoped_true_lang_css___WEBPACK_IMPORTED_MODULE_0___default.a);

/***/ }),

/***/ "77b2":
Expand Down Expand Up @@ -2729,21 +2729,6 @@ module.exports = function (argument) {
};


/***/ }),

/***/ "a876":
/***/ (function(module, exports, __webpack_require__) {

exports = module.exports = __webpack_require__("2350")(false);
// imports


// module
exports.push([module.i, ".video-wrapper[data-v-5eaa139b]{display:flex;justify-content:center;align-items:center;width:100%;height:100%;position:absolute;overflow:hidden;z-index:0}.fade[data-v-5eaa139b]{backface-visibility:hidden}.fade-enter-active[data-v-5eaa139b],.fade-leave-active[data-v-5eaa139b]{transition:opacity 1s}.fade-enter[data-v-5eaa139b],.fade-leave-to[data-v-5eaa139b]{opacity:0}video[data-v-5eaa139b]{visibility:visible;pointer-events:none;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);height:100%;width:100%}", ""]);

// exports


/***/ }),

/***/ "ac1f":
Expand Down Expand Up @@ -3197,6 +3182,21 @@ exports.f = NASHORN_BUG ? function propertyIsEnumerable(V) {
} : nativePropertyIsEnumerable;


/***/ }),

/***/ "d2b2":
/***/ (function(module, exports, __webpack_require__) {

// style-loader: Adds some css to the DOM by adding a <style> tag

// load the styles
var content = __webpack_require__("f70c");
if(typeof content === 'string') content = [[module.i, content, '']];
if(content.locals) module.exports = content.locals;
// add the styles to the DOM
var add = __webpack_require__("499e").default
var update = add("62e8aa78", content, true, {"sourceMap":false,"shadowMode":false});

/***/ }),

/***/ "d44e":
Expand All @@ -3215,21 +3215,6 @@ module.exports = function (it, TAG, STATIC) {
};


/***/ }),

/***/ "d66b":
/***/ (function(module, exports, __webpack_require__) {

// style-loader: Adds some css to the DOM by adding a <style> tag

// load the styles
var content = __webpack_require__("a876");
if(typeof content === 'string') content = [[module.i, content, '']];
if(content.locals) module.exports = content.locals;
// add the styles to the DOM
var add = __webpack_require__("499e").default
var update = add("5a4848a4", content, true, {"sourceMap":false,"shadowMode":false});

/***/ }),

/***/ "d784":
Expand Down Expand Up @@ -3531,6 +3516,21 @@ module.exports = Array.isArray || function isArray(arg) {
})(document);


/***/ }),

/***/ "f70c":
/***/ (function(module, exports, __webpack_require__) {

exports = module.exports = __webpack_require__("2350")(false);
// imports


// module
exports.push([module.i, ".video-wrapper[data-v-fc38aede]{display:flex;justify-content:center;align-items:center;width:100%;height:100%;position:absolute;overflow:hidden;z-index:0}.fade[data-v-fc38aede]{backface-visibility:hidden}.fade-enter-active[data-v-fc38aede],.fade-leave-active[data-v-fc38aede]{transition:opacity 1s}.fade-enter[data-v-fc38aede],.fade-leave-to[data-v-fc38aede]{opacity:0}video[data-v-fc38aede]{visibility:visible;pointer-events:none;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);height:100%;width:100%}", ""]);

// exports


/***/ }),

/***/ "f772":
Expand Down Expand Up @@ -3775,12 +3775,12 @@ var exists = function exists(obj, key) {
"default": ''
}
}, playerProps));
// CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"2dd602f9-vue-loader-template"}!./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/components/VideoPlayer.vue?vue&type=template&id=5eaa139b&scoped=true&
var VideoPlayervue_type_template_id_5eaa139b_scoped_true_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('transition',{attrs:{"name":"fade"}},[_c('div',{directives:[{name:"show",rawName:"v-show",value:(_vm.showVideo),expression:"showVideo"}],staticClass:"video-wrapper"},[_c('video',{ref:"video",style:(_vm.styleObject),attrs:{"playsinline":"","loop":_vm.loop,"preload":_vm.preload},domProps:{"muted":_vm.muted}},[_c('source',{attrs:{"src":_vm.src,"type":_vm.getMediaType(_vm.src)}})])])])}
var VideoPlayervue_type_template_id_5eaa139b_scoped_true_staticRenderFns = []
// CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"2dd602f9-vue-loader-template"}!./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/components/VideoPlayer.vue?vue&type=template&id=fc38aede&scoped=true&
var VideoPlayervue_type_template_id_fc38aede_scoped_true_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('transition',{attrs:{"name":"fade"}},[_c('div',{directives:[{name:"show",rawName:"v-show",value:(_vm.showVideo),expression:"showVideo"}],staticClass:"video-wrapper"},[_c('video',{ref:"video",style:(_vm.styleObject),attrs:{"autoplay":"","playsinline":"","loop":_vm.loop,"preload":_vm.preload},domProps:{"muted":_vm.muted}},[_c('source',{attrs:{"src":_vm.src,"type":_vm.getMediaType(_vm.src)}})])])])}
var VideoPlayervue_type_template_id_fc38aede_scoped_true_staticRenderFns = []


// CONCATENATED MODULE: ./src/components/VideoPlayer.vue?vue&type=template&id=5eaa139b&scoped=true&
// CONCATENATED MODULE: ./src/components/VideoPlayer.vue?vue&type=template&id=fc38aede&scoped=true&

// EXTERNAL MODULE: ./node_modules/core-js/modules/es.regexp.exec.js
var es_regexp_exec = __webpack_require__("ac1f");
Expand Down Expand Up @@ -3819,6 +3819,7 @@ var web_timers = __webpack_require__("4795");
//
//
//
//

/* harmony default export */ var VideoPlayervue_type_script_lang_js_ = ({
props: playerProps,
Expand All @@ -3844,6 +3845,9 @@ var web_timers = __webpack_require__("4795");
}
},
methods: {
pause: function pause() {
this.$refs.video.pause();
},
load: function load() {
var _this = this;

Expand Down Expand Up @@ -3873,6 +3877,9 @@ var web_timers = __webpack_require__("4795");
return !!this.$refs.video.canPlayType;
},
videoReady: function videoReady() {
// Unfortunately we have the iOS bug, that we need to set autoplay always to true.
// That means we need to first pause the video, and later check if we want to autoplay or not
this.pause();
this.$emit('ready');
},
videoError: function videoError() {
Expand All @@ -3892,8 +3899,8 @@ var web_timers = __webpack_require__("4795");
});
// CONCATENATED MODULE: ./src/components/VideoPlayer.vue?vue&type=script&lang=js&
/* harmony default export */ var components_VideoPlayervue_type_script_lang_js_ = (VideoPlayervue_type_script_lang_js_);
// EXTERNAL MODULE: ./src/components/VideoPlayer.vue?vue&type=style&index=0&id=5eaa139b&scoped=true&lang=css&
var VideoPlayervue_type_style_index_0_id_5eaa139b_scoped_true_lang_css_ = __webpack_require__("76ae");
// EXTERNAL MODULE: ./src/components/VideoPlayer.vue?vue&type=style&index=0&id=fc38aede&scoped=true&lang=css&
var VideoPlayervue_type_style_index_0_id_fc38aede_scoped_true_lang_css_ = __webpack_require__("6094");

// CONCATENATED MODULE: ./node_modules/vue-loader/lib/runtime/componentNormalizer.js
/* globals __VUE_SSR_CONTEXT__ */
Expand Down Expand Up @@ -4001,11 +4008,11 @@ function normalizeComponent (

var component = normalizeComponent(
components_VideoPlayervue_type_script_lang_js_,
VideoPlayervue_type_template_id_5eaa139b_scoped_true_render,
VideoPlayervue_type_template_id_5eaa139b_scoped_true_staticRenderFns,
VideoPlayervue_type_template_id_fc38aede_scoped_true_render,
VideoPlayervue_type_template_id_fc38aede_scoped_true_staticRenderFns,
false,
null,
"5eaa139b",
"fc38aede",
null

)
Expand Down
Loading

0 comments on commit 973b9cc

Please sign in to comment.