KingOfDog/block-renderer
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Update for lazy loading images

Browse Source
This commit is contained in:
KingOfDog 2020-10-20 18:42:43 +02:00
parent fcf12f7dcf
commit 945bef0523
11 changed files with 655 additions and 32 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

301
dist/block-renderer.common.js vendored
View File

@ -331,6 +331,49 @@ module.exports = function (R, S) {
/***/ }),
/***/ "159b":
/***/ (function(module, exports, __webpack_require__) {
var global = __webpack_require__("da84");
var DOMIterables = __webpack_require__("fdbc");
var forEach = __webpack_require__("17c2");
var createNonEnumerableProperty = __webpack_require__("9112");
for (var COLLECTION_NAME in DOMIterables) {
var Collection = global[COLLECTION_NAME];
var CollectionPrototype = Collection && Collection.prototype;
// some Chrome versions have non-configurable methods on DOMTokenList
if (CollectionPrototype && CollectionPrototype.forEach !== forEach) try {
createNonEnumerableProperty(CollectionPrototype, 'forEach', forEach);
} catch (error) {
CollectionPrototype.forEach = forEach;
}
}
/***/ }),
/***/ "17c2":
/***/ (function(module, exports, __webpack_require__) {
"use strict";
var $forEach = __webpack_require__("b727").forEach;
var arrayMethodIsStrict = __webpack_require__("a640");
var arrayMethodUsesToLength = __webpack_require__("ae40");
var STRICT_METHOD = arrayMethodIsStrict('forEach');
var USES_TO_LENGTH = arrayMethodUsesToLength('forEach');
// `Array.prototype.forEach` method implementation
// https://tc39.github.io/ecma262/#sec-array.prototype.foreach
module.exports = (!STRICT_METHOD || !USES_TO_LENGTH) ? function forEach(callbackfn /* , thisArg */) {
return $forEach(this, callbackfn, arguments.length > 1 ? arguments[1] : undefined);
} : [].forEach;
/***/ }),
/***/ "18a5":
@ -17845,6 +17888,23 @@ var katex_renderToHTMLTree = function renderToHTMLTree(expression, options) {
/******/ ])["default"];
});
/***/ }),
/***/ "4160":
/***/ (function(module, exports, __webpack_require__) {
"use strict";
var $ = __webpack_require__("23e7");
var forEach = __webpack_require__("17c2");
// `Array.prototype.forEach` method
// https://tc39.github.io/ecma262/#sec-array.prototype.foreach
$({ target: 'Array', proto: true, forced: [].forEach != forEach }, {
forEach: forEach
});
/***/ }),
/***/ "428f":
@ -18473,6 +18533,24 @@ module.exports = !fails(function () {
});
/***/ }),
/***/ "8418":
/***/ (function(module, exports, __webpack_require__) {
"use strict";
var toPrimitive = __webpack_require__("c04e");
var definePropertyModule = __webpack_require__("9bf2");
var createPropertyDescriptor = __webpack_require__("5c6c");
module.exports = function (object, key, value) {
var propertyKey = toPrimitive(key);
if (propertyKey in object) definePropertyModule.f(object, propertyKey, createPropertyDescriptor(0, value));
else object[propertyKey] = value;
};
/***/ }),
/***/ "857a":
@ -18795,6 +18873,74 @@ $({ target: 'String', proto: true, forced: forcedStringHTMLMethod('link') }, {
});
/***/ }),
/***/ "99af":
/***/ (function(module, exports, __webpack_require__) {
"use strict";
var $ = __webpack_require__("23e7");
var fails = __webpack_require__("d039");
var isArray = __webpack_require__("e8b5");
var isObject = __webpack_require__("861d");
var toObject = __webpack_require__("7b0b");
var toLength = __webpack_require__("50c4");
var createProperty = __webpack_require__("8418");
var arraySpeciesCreate = __webpack_require__("65f0");
var arrayMethodHasSpeciesSupport = __webpack_require__("1dde");
var wellKnownSymbol = __webpack_require__("b622");
var V8_VERSION = __webpack_require__("2d00");
var IS_CONCAT_SPREADABLE = wellKnownSymbol('isConcatSpreadable');
var MAX_SAFE_INTEGER = 0x1FFFFFFFFFFFFF;
var MAXIMUM_ALLOWED_INDEX_EXCEEDED = 'Maximum allowed index exceeded';
// We can't use this feature detection in V8 since it causes
// deoptimization and serious performance degradation
// https://github.com/zloirock/core-js/issues/679
var IS_CONCAT_SPREADABLE_SUPPORT = V8_VERSION >= 51 || !fails(function () {
var array = [];
array[IS_CONCAT_SPREADABLE] = false;
return array.concat()[0] !== array;
});
var SPECIES_SUPPORT = arrayMethodHasSpeciesSupport('concat');
var isConcatSpreadable = function (O) {
if (!isObject(O)) return false;
var spreadable = O[IS_CONCAT_SPREADABLE];
return spreadable !== undefined ? !!spreadable : isArray(O);
};
var FORCED = !IS_CONCAT_SPREADABLE_SUPPORT || !SPECIES_SUPPORT;
// `Array.prototype.concat` method
// https://tc39.github.io/ecma262/#sec-array.prototype.concat
// with adding support of @@isConcatSpreadable and @@species
$({ target: 'Array', proto: true, forced: FORCED }, {
concat: function concat(arg) { // eslint-disable-line no-unused-vars
var O = toObject(this);
var A = arraySpeciesCreate(O, 0);
var n = 0;
var i, k, length, len, E;
for (i = -1, length = arguments.length; i < length; i++) {
E = i === -1 ? O : arguments[i];
if (isConcatSpreadable(E)) {
len = toLength(E.length);
if (n + len > MAX_SAFE_INTEGER) throw TypeError(MAXIMUM_ALLOWED_INDEX_EXCEEDED);
for (k = 0; k < len; k++, n++) if (k in E) createProperty(A, n, E[k]);
} else {
if (n >= MAX_SAFE_INTEGER) throw TypeError(MAXIMUM_ALLOWED_INDEX_EXCEEDED);
createProperty(A, n++, E);
}
}
A.length = n;
return A;
}
});
/***/ }),
/***/ "9bf2":
@ -18853,6 +18999,24 @@ exports.BROKEN_CARET = fails(function () {
});
/***/ }),
/***/ "a640":
/***/ (function(module, exports, __webpack_require__) {
"use strict";
var fails = __webpack_require__("d039");
module.exports = function (METHOD_NAME, argument) {
var method = [][METHOD_NAME];
return !!method && fails(function () {
// eslint-disable-next-line no-useless-call,no-throw-literal
method.call(null, argument || function () { throw 1; }, 1);
});
};
/***/ }),
/***/ "a691":
@ -19495,6 +19659,7 @@ module.exports = function (key) {
__webpack_require__.r(__webpack_exports__);
// EXPORTS
__webpack_require__.d(__webpack_exports__, "install", function() { return /* reexport */ install; });
__webpack_require__.d(__webpack_exports__, "BlockContentRenderer", function() { return /* reexport */ BlockContentRenderer; });
// CONCATENATED MODULE: ./node_modules/@vue/cli-service/lib/commands/build/setPublicPath.js
@ -19521,12 +19686,12 @@ if (typeof window !== 'undefined') {
// Indicate to webpack that this file can be concatenated
/* harmony default export */ var setPublicPath = (null);
// CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"0e1ca7e0-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/BlockContentRenderer.vue?vue&type=template&id=7265d2b8&
// CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"0e1ca7e0-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/BlockContentRenderer.vue?vue&type=template&id=94edc506&
var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',_vm._l((_vm.blocks),function(block,index){return _c(block.component,{key:index,tag:"component",attrs:{"data":block.data}})}),1)}
var staticRenderFns = []
// CONCATENATED MODULE: ./src/components/BlockContentRenderer.vue?vue&type=template&id=7265d2b8&
// CONCATENATED MODULE: ./src/components/BlockContentRenderer.vue?vue&type=template&id=94edc506&
// EXTERNAL MODULE: ./node_modules/core-js/modules/es.array.map.js
var es_array_map = __webpack_require__("d81d");
@ -19874,14 +20039,65 @@ var HeaderBlock_component = normalizeComponent(
)
/* harmony default export */ var HeaderBlock = (HeaderBlock_component.exports);
// CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"0e1ca7e0-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/ImageBlock.vue?vue&type=template&id=681bb202&
var ImageBlockvue_type_template_id_681bb202_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('figure',[_c('img',{attrs:{"src":_vm.data.file.url}}),_c('figcaption',{domProps:{"innerHTML":_vm._s(_vm.data.caption)}})])}
var ImageBlockvue_type_template_id_681bb202_staticRenderFns = []
// CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"0e1ca7e0-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/ImageBlock.vue?vue&type=template&id=a3549484&
var ImageBlockvue_type_template_id_a3549484_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('figure',[_c('img',{directives:[{name:"lazyload",rawName:"v-lazyload"}],attrs:{"src":_vm.lowQualityUrl,"data-src":_vm.highQualityUrl}}),_c('figcaption',{domProps:{"innerHTML":_vm._s(_vm.data.caption)}})])}
var ImageBlockvue_type_template_id_a3549484_staticRenderFns = []
// CONCATENATED MODULE: ./src/components/ImageBlock.vue?vue&type=template&id=681bb202&
// CONCATENATED MODULE: ./src/components/ImageBlock.vue?vue&type=template&id=a3549484&
// EXTERNAL MODULE: ./node_modules/core-js/modules/es.array.concat.js
var es_array_concat = __webpack_require__("99af");
// EXTERNAL MODULE: ./node_modules/core-js/modules/es.array.for-each.js
var es_array_for_each = __webpack_require__("4160");
// EXTERNAL MODULE: ./node_modules/core-js/modules/web.dom-collections.for-each.js
var web_dom_collections_for_each = __webpack_require__("159b");
// CONCATENATED MODULE: ./src/directives/lazy-load-image.js
/* harmony default export */ var lazy_load_image = ({
inserted: function inserted(el) {
function loadImage() {
var image = new Image();
image.src = el.dataset.src;
image.onload = function () {
el.src = el.dataset.src;
};
}
function handleIntersect(entries, observer) {
entries.forEach(function (entry) {
if (!entry.isIntersecting) {
return;
}
loadImage();
observer.unobserve(el);
});
}
function createObserver() {
var options = {
root: null,
threshold: '0'
};
var observer = new IntersectionObserver(handleIntersect, options);
observer.observe(el);
}
if (!window.IntersectionObserver) {
loadImage();
} else {
createObserver();
}
}
});
// CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/components/ImageBlock.vue?vue&type=script&lang=js&
//
//
//
@ -19890,8 +20106,27 @@ var ImageBlockvue_type_template_id_681bb202_staticRenderFns = []
//
//
//
//
//
//
//
/* harmony default export */ var ImageBlockvue_type_script_lang_js_ = ({
props: ["data"]
directives: {
lazyload: lazy_load_image
},
props: ["data"],
computed: {
lowQualityUrl: function lowQualityUrl() {
return "".concat(this.$baseFileUrl, "/").concat(this.data.file.id, "?type=jpg&w=100&b=50");
},
highQualityUrl: function highQualityUrl() {
return "".concat(this.$baseFileUrl, "/").concat(this.data.file.id, "?w=1200");
}
},
mounted: function mounted() {
console.log("Hallo", this.$baseFileUrl);
}
});
// CONCATENATED MODULE: ./src/components/ImageBlock.vue?vue&type=script&lang=js&
/* harmony default export */ var components_ImageBlockvue_type_script_lang_js_ = (ImageBlockvue_type_script_lang_js_);
@ -19905,8 +20140,8 @@ var ImageBlockvue_type_template_id_681bb202_staticRenderFns = []
var ImageBlock_component = normalizeComponent(
components_ImageBlockvue_type_script_lang_js_,
ImageBlockvue_type_template_id_681bb202_render,
ImageBlockvue_type_template_id_681bb202_staticRenderFns,
ImageBlockvue_type_template_id_a3549484_render,
ImageBlockvue_type_template_id_a3549484_staticRenderFns,
false,
null,
null,
@ -20221,7 +20456,7 @@ var componentTypes = {
embed: EmbedBlock,
header: HeaderBlock,
image: ImageBlock,
link: LinkBlock,
linkEmbed: LinkBlock,
list: ListBlock,
math: MathBlock,
paragraph: ParagraphBlock,
@ -20287,6 +20522,10 @@ var BlockContentRenderer_component = normalizeComponent(
/* harmony default export */ var BlockContentRenderer = (BlockContentRenderer_component.exports);
// CONCATENATED MODULE: ./src/main.js
function install(Vue) {
console.log("Ill be executed hopefully");
Vue.protoype.$baseFileUrl = "";
}
/* harmony default export */ var main = (BlockContentRenderer);
// CONCATENATED MODULE: ./node_modules/@vue/cli-service/lib/commands/build/entry-lib.js
@ -20310,6 +20549,48 @@ module.exports = function (it) {
};
/***/ }),
/***/ "fdbc":
/***/ (function(module, exports) {
// iterable DOM collections
// flag - `iterable` interface - 'entries', 'keys', 'values', 'forEach' methods
module.exports = {
CSSRuleList: 0,
CSSStyleDeclaration: 0,
CSSValueList: 0,
ClientRectList: 0,
DOMRectList: 0,
DOMStringList: 0,
DOMTokenList: 1,
DataTransferItemList: 0,
FileList: 0,
HTMLAllCollection: 0,
HTMLCollection: 0,
HTMLFormElement: 0,
HTMLSelectElement: 0,
MediaList: 0,
MimeTypeArray: 0,
NamedNodeMap: 0,
NodeList: 1,
PaintRequestList: 0,
Plugin: 0,
PluginArray: 0,
SVGLengthList: 0,
SVGNumberList: 0,
SVGPathSegList: 0,
SVGPointList: 0,
SVGStringList: 0,
SVGTransformList: 0,
SourceBufferList: 0,
StyleSheetList: 0,
TextTrackCueList: 0,
TextTrackList: 0,
TouchList: 0
};
/***/ }),
/***/ "fdbf":

2
dist/block-renderer.common.js.map vendored
View File

File diff suppressed because one or more lines are too long

301
dist/block-renderer.umd.js vendored
View File

@ -340,6 +340,49 @@ module.exports = function (R, S) {
/***/ }),
/***/ "159b":
/***/ (function(module, exports, __webpack_require__) {
var global = __webpack_require__("da84");
var DOMIterables = __webpack_require__("fdbc");
var forEach = __webpack_require__("17c2");
var createNonEnumerableProperty = __webpack_require__("9112");
for (var COLLECTION_NAME in DOMIterables) {
var Collection = global[COLLECTION_NAME];
var CollectionPrototype = Collection && Collection.prototype;
// some Chrome versions have non-configurable methods on DOMTokenList
if (CollectionPrototype && CollectionPrototype.forEach !== forEach) try {
createNonEnumerableProperty(CollectionPrototype, 'forEach', forEach);
} catch (error) {
CollectionPrototype.forEach = forEach;
}
}
/***/ }),
/***/ "17c2":
/***/ (function(module, exports, __webpack_require__) {
"use strict";
var $forEach = __webpack_require__("b727").forEach;
var arrayMethodIsStrict = __webpack_require__("a640");
var arrayMethodUsesToLength = __webpack_require__("ae40");
var STRICT_METHOD = arrayMethodIsStrict('forEach');
var USES_TO_LENGTH = arrayMethodUsesToLength('forEach');
// `Array.prototype.forEach` method implementation
// https://tc39.github.io/ecma262/#sec-array.prototype.foreach
module.exports = (!STRICT_METHOD || !USES_TO_LENGTH) ? function forEach(callbackfn /* , thisArg */) {
return $forEach(this, callbackfn, arguments.length > 1 ? arguments[1] : undefined);
} : [].forEach;
/***/ }),
/***/ "18a5":
@ -17854,6 +17897,23 @@ var katex_renderToHTMLTree = function renderToHTMLTree(expression, options) {
/******/ ])["default"];
});
/***/ }),
/***/ "4160":
/***/ (function(module, exports, __webpack_require__) {
"use strict";
var $ = __webpack_require__("23e7");
var forEach = __webpack_require__("17c2");
// `Array.prototype.forEach` method
// https://tc39.github.io/ecma262/#sec-array.prototype.foreach
$({ target: 'Array', proto: true, forced: [].forEach != forEach }, {
forEach: forEach
});
/***/ }),
/***/ "428f":
@ -18482,6 +18542,24 @@ module.exports = !fails(function () {
});
/***/ }),
/***/ "8418":
/***/ (function(module, exports, __webpack_require__) {
"use strict";
var toPrimitive = __webpack_require__("c04e");
var definePropertyModule = __webpack_require__("9bf2");
var createPropertyDescriptor = __webpack_require__("5c6c");
module.exports = function (object, key, value) {
var propertyKey = toPrimitive(key);
if (propertyKey in object) definePropertyModule.f(object, propertyKey, createPropertyDescriptor(0, value));
else object[propertyKey] = value;
};
/***/ }),
/***/ "857a":
@ -18804,6 +18882,74 @@ $({ target: 'String', proto: true, forced: forcedStringHTMLMethod('link') }, {
});
/***/ }),
/***/ "99af":
/***/ (function(module, exports, __webpack_require__) {
"use strict";
var $ = __webpack_require__("23e7");
var fails = __webpack_require__("d039");
var isArray = __webpack_require__("e8b5");
var isObject = __webpack_require__("861d");
var toObject = __webpack_require__("7b0b");
var toLength = __webpack_require__("50c4");
var createProperty = __webpack_require__("8418");
var arraySpeciesCreate = __webpack_require__("65f0");
var arrayMethodHasSpeciesSupport = __webpack_require__("1dde");
var wellKnownSymbol = __webpack_require__("b622");
var V8_VERSION = __webpack_require__("2d00");
var IS_CONCAT_SPREADABLE = wellKnownSymbol('isConcatSpreadable');
var MAX_SAFE_INTEGER = 0x1FFFFFFFFFFFFF;
var MAXIMUM_ALLOWED_INDEX_EXCEEDED = 'Maximum allowed index exceeded';
// We can't use this feature detection in V8 since it causes
// deoptimization and serious performance degradation
// https://github.com/zloirock/core-js/issues/679
var IS_CONCAT_SPREADABLE_SUPPORT = V8_VERSION >= 51 || !fails(function () {
var array = [];
array[IS_CONCAT_SPREADABLE] = false;
return array.concat()[0] !== array;
});
var SPECIES_SUPPORT = arrayMethodHasSpeciesSupport('concat');
var isConcatSpreadable = function (O) {
if (!isObject(O)) return false;
var spreadable = O[IS_CONCAT_SPREADABLE];
return spreadable !== undefined ? !!spreadable : isArray(O);
};
var FORCED = !IS_CONCAT_SPREADABLE_SUPPORT || !SPECIES_SUPPORT;
// `Array.prototype.concat` method
// https://tc39.github.io/ecma262/#sec-array.prototype.concat
// with adding support of @@isConcatSpreadable and @@species
$({ target: 'Array', proto: true, forced: FORCED }, {
concat: function concat(arg) { // eslint-disable-line no-unused-vars
var O = toObject(this);
var A = arraySpeciesCreate(O, 0);
var n = 0;
var i, k, length, len, E;
for (i = -1, length = arguments.length; i < length; i++) {
E = i === -1 ? O : arguments[i];
if (isConcatSpreadable(E)) {
len = toLength(E.length);
if (n + len > MAX_SAFE_INTEGER) throw TypeError(MAXIMUM_ALLOWED_INDEX_EXCEEDED);
for (k = 0; k < len; k++, n++) if (k in E) createProperty(A, n, E[k]);
} else {
if (n >= MAX_SAFE_INTEGER) throw TypeError(MAXIMUM_ALLOWED_INDEX_EXCEEDED);
createProperty(A, n++, E);
}
}
A.length = n;
return A;
}
});
/***/ }),
/***/ "9bf2":
@ -18862,6 +19008,24 @@ exports.BROKEN_CARET = fails(function () {
});
/***/ }),
/***/ "a640":
/***/ (function(module, exports, __webpack_require__) {
"use strict";
var fails = __webpack_require__("d039");
module.exports = function (METHOD_NAME, argument) {
var method = [][METHOD_NAME];
return !!method && fails(function () {
// eslint-disable-next-line no-useless-call,no-throw-literal
method.call(null, argument || function () { throw 1; }, 1);
});
};
/***/ }),
/***/ "a691":
@ -19504,6 +19668,7 @@ module.exports = function (key) {
__webpack_require__.r(__webpack_exports__);
// EXPORTS
__webpack_require__.d(__webpack_exports__, "install", function() { return /* reexport */ install; });
__webpack_require__.d(__webpack_exports__, "BlockContentRenderer", function() { return /* reexport */ BlockContentRenderer; });
// CONCATENATED MODULE: ./node_modules/@vue/cli-service/lib/commands/build/setPublicPath.js
@ -19530,12 +19695,12 @@ if (typeof window !== 'undefined') {
// Indicate to webpack that this file can be concatenated
/* harmony default export */ var setPublicPath = (null);
// CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"0e1ca7e0-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/BlockContentRenderer.vue?vue&type=template&id=7265d2b8&
// CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"0e1ca7e0-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/BlockContentRenderer.vue?vue&type=template&id=94edc506&
var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',_vm._l((_vm.blocks),function(block,index){return _c(block.component,{key:index,tag:"component",attrs:{"data":block.data}})}),1)}
var staticRenderFns = []
// CONCATENATED MODULE: ./src/components/BlockContentRenderer.vue?vue&type=template&id=7265d2b8&
// CONCATENATED MODULE: ./src/components/BlockContentRenderer.vue?vue&type=template&id=94edc506&
// EXTERNAL MODULE: ./node_modules/core-js/modules/es.array.map.js
var es_array_map = __webpack_require__("d81d");
@ -19883,14 +20048,65 @@ var HeaderBlock_component = normalizeComponent(
)
/* harmony default export */ var HeaderBlock = (HeaderBlock_component.exports);
// CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"0e1ca7e0-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/ImageBlock.vue?vue&type=template&id=681bb202&
var ImageBlockvue_type_template_id_681bb202_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('figure',[_c('img',{attrs:{"src":_vm.data.file.url}}),_c('figcaption',{domProps:{"innerHTML":_vm._s(_vm.data.caption)}})])}
var ImageBlockvue_type_template_id_681bb202_staticRenderFns = []
// CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"0e1ca7e0-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/ImageBlock.vue?vue&type=template&id=a3549484&
var ImageBlockvue_type_template_id_a3549484_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('figure',[_c('img',{directives:[{name:"lazyload",rawName:"v-lazyload"}],attrs:{"src":_vm.lowQualityUrl,"data-src":_vm.highQualityUrl}}),_c('figcaption',{domProps:{"innerHTML":_vm._s(_vm.data.caption)}})])}
var ImageBlockvue_type_template_id_a3549484_staticRenderFns = []
// CONCATENATED MODULE: ./src/components/ImageBlock.vue?vue&type=template&id=681bb202&
// CONCATENATED MODULE: ./src/components/ImageBlock.vue?vue&type=template&id=a3549484&
// EXTERNAL MODULE: ./node_modules/core-js/modules/es.array.concat.js
var es_array_concat = __webpack_require__("99af");
// EXTERNAL MODULE: ./node_modules/core-js/modules/es.array.for-each.js
var es_array_for_each = __webpack_require__("4160");
// EXTERNAL MODULE: ./node_modules/core-js/modules/web.dom-collections.for-each.js
var web_dom_collections_for_each = __webpack_require__("159b");
// CONCATENATED MODULE: ./src/directives/lazy-load-image.js
/* harmony default export */ var lazy_load_image = ({
inserted: function inserted(el) {
function loadImage() {
var image = new Image();
image.src = el.dataset.src;
image.onload = function () {
el.src = el.dataset.src;
};
}
function handleIntersect(entries, observer) {
entries.forEach(function (entry) {
if (!entry.isIntersecting) {
return;
}
loadImage();
observer.unobserve(el);
});
}
function createObserver() {
var options = {
root: null,
threshold: '0'
};
var observer = new IntersectionObserver(handleIntersect, options);
observer.observe(el);
}
if (!window.IntersectionObserver) {
loadImage();
} else {
createObserver();
}
}
});
// CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/components/ImageBlock.vue?vue&type=script&lang=js&
//
//
//
@ -19899,8 +20115,27 @@ var ImageBlockvue_type_template_id_681bb202_staticRenderFns = []
//
//
//
//
//
//
//
/* harmony default export */ var ImageBlockvue_type_script_lang_js_ = ({
props: ["data"]
directives: {
lazyload: lazy_load_image
},
props: ["data"],
computed: {
lowQualityUrl: function lowQualityUrl() {
return "".concat(this.$baseFileUrl, "/").concat(this.data.file.id, "?type=jpg&w=100&b=50");
},
highQualityUrl: function highQualityUrl() {
return "".concat(this.$baseFileUrl, "/").concat(this.data.file.id, "?w=1200");
}
},
mounted: function mounted() {
console.log("Hallo", this.$baseFileUrl);
}
});
// CONCATENATED MODULE: ./src/components/ImageBlock.vue?vue&type=script&lang=js&
/* harmony default export */ var components_ImageBlockvue_type_script_lang_js_ = (ImageBlockvue_type_script_lang_js_);
@ -19914,8 +20149,8 @@ var ImageBlockvue_type_template_id_681bb202_staticRenderFns = []
var ImageBlock_component = normalizeComponent(
components_ImageBlockvue_type_script_lang_js_,
ImageBlockvue_type_template_id_681bb202_render,
ImageBlockvue_type_template_id_681bb202_staticRenderFns,
ImageBlockvue_type_template_id_a3549484_render,
ImageBlockvue_type_template_id_a3549484_staticRenderFns,
false,
null,
null,
@ -20230,7 +20465,7 @@ var componentTypes = {
embed: EmbedBlock,
header: HeaderBlock,
image: ImageBlock,
link: LinkBlock,
linkEmbed: LinkBlock,
list: ListBlock,
math: MathBlock,
paragraph: ParagraphBlock,
@ -20296,6 +20531,10 @@ var BlockContentRenderer_component = normalizeComponent(
/* harmony default export */ var BlockContentRenderer = (BlockContentRenderer_component.exports);
// CONCATENATED MODULE: ./src/main.js
function install(Vue) {
console.log("Ill be executed hopefully");
Vue.protoype.$baseFileUrl = "";
}
/* harmony default export */ var main = (BlockContentRenderer);
// CONCATENATED MODULE: ./node_modules/@vue/cli-service/lib/commands/build/entry-lib.js
@ -20319,6 +20558,48 @@ module.exports = function (it) {
};
/***/ }),
/***/ "fdbc":
/***/ (function(module, exports) {
// iterable DOM collections
// flag - `iterable` interface - 'entries', 'keys', 'values', 'forEach' methods
module.exports = {
CSSRuleList: 0,
CSSStyleDeclaration: 0,
CSSValueList: 0,
ClientRectList: 0,
DOMRectList: 0,
DOMStringList: 0,
DOMTokenList: 1,
DataTransferItemList: 0,
FileList: 0,
HTMLAllCollection: 0,
HTMLCollection: 0,
HTMLFormElement: 0,
HTMLSelectElement: 0,
MediaList: 0,
MimeTypeArray: 0,
NamedNodeMap: 0,
NodeList: 1,
PaintRequestList: 0,
Plugin: 0,
PluginArray: 0,
SVGLengthList: 0,
SVGNumberList: 0,
SVGPathSegList: 0,
SVGPointList: 0,
SVGStringList: 0,
SVGTransformList: 0,
SourceBufferList: 0,
StyleSheetList: 0,
TextTrackCueList: 0,
TextTrackList: 0,
TouchList: 0
};
/***/ }),
/***/ "fdbf":

2
dist/block-renderer.umd.js.map vendored
View File

File diff suppressed because one or more lines are too long

2
dist/block-renderer.umd.min.js vendored
View File

File diff suppressed because one or more lines are too long

2
dist/block-renderer.umd.min.js.map vendored
View File

File diff suppressed because one or more lines are too long

2
package.json
View File

@ -1,7 +1,7 @@
{
"name": "block-renderer",
"description": "Content renderer for JSON blocks from Editor.js",
"version": "0.2.2",
"version": "0.3.6",
"author": "KingOfDog <info@kingofdog.de>",
"repository": {
"type": "git",

2
src/components/BlockContentRenderer.vue
View File

@ -28,7 +28,7 @@ const componentTypes = {
embed: EmbedBlock,
header: HeaderBlock,
image: ImageBlock,
link: LinkBlock,
linkEmbed: LinkBlock,
list: ListBlock,
math: MathBlock,
paragraph: ParagraphBlock,

24
src/components/ImageBlock.vue
View File

@ -1,13 +1,33 @@
<template>
<figure>
<img :src="data.file.url" />
<img
v-lazyload
:src="lowQualityUrl"
:data-src="highQualityUrl"
/>
<figcaption v-html="data.caption"></figcaption>
</figure>
</template>
<script>
import LazyLoadImage from "@/directives/lazy-load-image";
export default {
props: ["data"]
directives: {
lazyload: LazyLoadImage
},
props: ["data"],
computed: {
lowQualityUrl() {
return `${this.$baseFileUrl}/${this.data.file.id}?type=jpg&w=100&b=50`;
},
highQualityUrl() {
return `${this.$baseFileUrl}/${this.data.file.id}?w=1200`;
}
},
mounted() {
console.log("Hallo", this.$baseFileUrl);
}
};
</script>

38
src/directives/lazy-load-image.js Normal file
View File

@ -0,0 +1,38 @@
export default {
inserted: (el) => {
function loadImage() {
const image = new Image();
image.src = el.dataset.src;
image.onload = () => {
el.src = el.dataset.src;
};
}
function handleIntersect(entries, observer) {
entries.forEach((entry) => {
if (!entry.isIntersecting) {
return;
}
loadImage();
observer.unobserve(el);
});
}
function createObserver() {
const options = {
root: null,
threshold: '0',
};
const observer = new IntersectionObserver(handleIntersect, options);
observer.observe(el);
}
if (!window.IntersectionObserver) {
loadImage();
} else {
createObserver();
}
},
};

11
src/main.js
View File

@ -1,6 +1,9 @@
import BlockContentRenderer from './components/BlockContentRenderer.vue';
import BlockContentRenderer from "./components/BlockContentRenderer.vue";
export function install(Vue) {
console.log("Ill be executed hopefully");
Vue.protoype.$baseFileUrl = "";
}
export default BlockContentRenderer;
export {
BlockContentRenderer
};
export { BlockContentRenderer };