refining focused-schema to accept overflowing tag and limit bubble placement
All checks were successful
continuous-integration/drone/push Build is passing
All checks were successful
continuous-integration/drone/push Build is passing
This commit is contained in:
parent
93a1a29b93
commit
0c828ee44d
|
|
@ -21,12 +21,32 @@
|
|||
"attribute": "alt",
|
||||
"default": ""
|
||||
},
|
||||
"showDescription": {
|
||||
"type": "boolean",
|
||||
"default": false
|
||||
},
|
||||
"showLegend": {
|
||||
"type": "boolean",
|
||||
"default": false
|
||||
},
|
||||
"coverUrl": {
|
||||
"type": "string",
|
||||
"source": "attribute",
|
||||
"selector": "img",
|
||||
"attribute": "src"
|
||||
},
|
||||
"coverDescription": {
|
||||
"type": "string",
|
||||
"source": "attribute",
|
||||
"selector": "img",
|
||||
"attribute": "data-description"
|
||||
},
|
||||
"coverLegend": {
|
||||
"type": "string",
|
||||
"source": "attribute",
|
||||
"selector": "img",
|
||||
"attribute": "data-legend"
|
||||
},
|
||||
"focusBullets": {
|
||||
"type": "array",
|
||||
"default": []
|
||||
|
|
|
|||
|
|
@ -1 +1 @@
|
|||
<?php return array('dependencies' => array('wp-block-editor', 'wp-blocks', 'wp-components', 'wp-element', 'wp-i18n'), 'version' => '03f0f2272eca0b9ca8ee');
|
||||
<?php return array('dependencies' => array('react', 'wp-block-editor', 'wp-blocks', 'wp-components', 'wp-i18n'), 'version' => '34caa5ee1bac3c842041');
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
/*!****************************************************************************************************************************************************************************************************************************************************!*\
|
||||
!*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[4].use[3]!./src/focus-point/editor.scss ***!
|
||||
\****************************************************************************************************************************************************************************************************************************************************/
|
||||
/*!***********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
|
||||
!*** css ./node_modules/.pnpm/css-loader@6.10.0_webpack@5.90.3/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!./node_modules/.pnpm/postcss-loader@6.2.1_postcss@8.4.35_webpack@5.90.3/node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!./node_modules/.pnpm/sass-loader@12.6.0_sass@1.71.1_webpack@5.90.3/node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[4].use[3]!./src/focus-point/editor.scss ***!
|
||||
\***********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
|
||||
|
||||
|
|
|
|||
|
|
@ -12,8 +12,8 @@ __webpack_require__.r(__webpack_exports__);
|
|||
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
||||
/* harmony export */ "default": () => (/* binding */ Edit)
|
||||
/* harmony export */ });
|
||||
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
|
||||
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
|
||||
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
|
||||
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
|
||||
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
|
||||
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__);
|
||||
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
|
||||
|
|
@ -42,6 +42,19 @@ function Edit({
|
|||
focusIndex
|
||||
} = attributes;
|
||||
function handleChangeFocusPosition(focusPosition) {
|
||||
console.log(focusPosition);
|
||||
if (focusPosition.x < 0.05) {
|
||||
focusPosition.x = 0.05;
|
||||
}
|
||||
if (focusPosition.x > 0.95) {
|
||||
focusPosition.x = 0.95;
|
||||
}
|
||||
if (focusPosition.y < 0.02) {
|
||||
focusPosition.y = 0.02;
|
||||
}
|
||||
if (focusPosition.y > 0.98) {
|
||||
focusPosition.y = 0.98;
|
||||
}
|
||||
setAttributes({
|
||||
focusPosition
|
||||
});
|
||||
|
|
@ -56,12 +69,12 @@ function Edit({
|
|||
focusCaptionDescription
|
||||
});
|
||||
}
|
||||
return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_2__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.PanelBody, {
|
||||
return (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(react__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_2__.InspectorControls, null, (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.PanelBody, {
|
||||
className: "focus-point-modification-pannel",
|
||||
title: "Gestion du points de focus"
|
||||
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
|
||||
}, (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
|
||||
className: "homegrade-blocks-focus-point-bullet"
|
||||
}, focusIndex), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.TextControl, {
|
||||
}, focusIndex), (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.TextControl, {
|
||||
placeholder: "Ins\xE9rer le titre de votre point focus",
|
||||
label: "Titre du point focus",
|
||||
value: focusTitle !== "Légende Sans titre" ? focusTitle : null,
|
||||
|
|
@ -69,14 +82,14 @@ function Edit({
|
|||
onChange: value => {
|
||||
handleChangeTitle(value);
|
||||
}
|
||||
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.TextareaControl, {
|
||||
}), (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.TextareaControl, {
|
||||
label: "Description du point focus",
|
||||
value: focusCaptionDescription,
|
||||
rows: 3,
|
||||
onChange: description => {
|
||||
handleChangeCaptionDescription(description);
|
||||
}
|
||||
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.FocalPointPicker, {
|
||||
}), (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.FocalPointPicker, {
|
||||
url: coverUrl !== null && coverUrl !== void 0 ? coverUrl : null,
|
||||
dimensions: {
|
||||
width: 400,
|
||||
|
|
@ -86,18 +99,18 @@ function Edit({
|
|||
onChange: focalPoint => {
|
||||
handleChangeFocusPosition(focalPoint);
|
||||
}
|
||||
}))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("li", {
|
||||
}))), (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("li", {
|
||||
...(0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_2__.useBlockProps)({
|
||||
className: `homegrade-blocks-focus-point-caption`
|
||||
})
|
||||
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_2__.RichText, {
|
||||
}, (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_2__.RichText, {
|
||||
tagName: "span",
|
||||
className: "focus-point-title",
|
||||
value: focusTitle,
|
||||
onChange: value => {
|
||||
handleChangeTitle(value);
|
||||
}
|
||||
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_2__.RichText, {
|
||||
}), (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_2__.RichText, {
|
||||
tagName: "span",
|
||||
value: focusCaptionDescription,
|
||||
onChange: handleChangeCaptionDescription
|
||||
|
|
@ -113,8 +126,8 @@ function Edit({
|
|||
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
||||
|
||||
__webpack_require__.r(__webpack_exports__);
|
||||
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
|
||||
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
|
||||
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
|
||||
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
|
||||
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
|
||||
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__);
|
||||
/* harmony import */ var _style_scss__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./style.scss */ "./src/focus-point/style.scss");
|
||||
|
|
@ -131,20 +144,20 @@ __webpack_require__.r(__webpack_exports__);
|
|||
title: _block_json__WEBPACK_IMPORTED_MODULE_3__.title,
|
||||
icon: {
|
||||
foreground: "#DF1E1E",
|
||||
src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
|
||||
src: (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
|
||||
id: "Capa_1",
|
||||
"enable-background": "new 0 0 512 512",
|
||||
height: "512",
|
||||
viewBox: "0 0 512 512",
|
||||
width: "512",
|
||||
xmlns: "http://www.w3.org/2000/svg"
|
||||
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("g", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
|
||||
}, (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("g", null, (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
|
||||
d: "m100.001 255.776c0-80.958 61.992-147.702 140.999-155.275v-100.277c-62.739 3.601-121.221 29.734-166.02 74.533-48.351 48.352-74.98 112.64-74.98 181.019 0 43.893 10.989 86.092 31.636 123.48l85.806-51.86c-11.138-21.46-17.441-45.817-17.441-71.62z"
|
||||
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
|
||||
}), (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
|
||||
d: "m256 411.776c-49.473 0-93.636-23.154-122.236-59.189l-86.098 52.037c8.139 11.341 17.249 22.106 27.315 32.173 48.352 48.352 112.64 74.98 181.02 74.98s132.667-26.629 181.02-74.98c11.293-11.293 21.384-23.465 30.245-36.346l-87.133-50.306c-28.524 37.426-73.552 61.631-124.133 61.631z"
|
||||
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
|
||||
}), (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
|
||||
d: "m411.999 255.776c0 24.704-5.781 48.08-16.048 68.86l86.835 50.134c19.084-36.263 29.214-76.848 29.214-118.994 0-68.38-26.629-132.667-74.98-181.02-44.799-44.798-103.281-70.931-166.02-74.532v100.278c79.007 7.573 140.999 74.316 140.999 155.274z"
|
||||
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
|
||||
}), (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
|
||||
cx: "256",
|
||||
cy: "255.776",
|
||||
r: "103.902"
|
||||
|
|
@ -168,8 +181,8 @@ __webpack_require__.r(__webpack_exports__);
|
|||
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
||||
/* harmony export */ "default": () => (/* binding */ save)
|
||||
/* harmony export */ });
|
||||
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
|
||||
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
|
||||
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
|
||||
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
|
||||
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
|
||||
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__);
|
||||
|
||||
|
|
@ -181,15 +194,15 @@ function save({
|
|||
focusCaptionDescription,
|
||||
focusTitle
|
||||
} = attributes;
|
||||
return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("li", {
|
||||
return (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("li", {
|
||||
..._wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__.useBlockProps.save({
|
||||
className: `homegrade-blocks-focus-point-caption`
|
||||
})
|
||||
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__.RichText.Content, {
|
||||
}, (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__.RichText.Content, {
|
||||
tagName: "span",
|
||||
className: "focus-point-title",
|
||||
value: focusTitle
|
||||
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__.RichText.Content, {
|
||||
}), (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__.RichText.Content, {
|
||||
tagName: "span",
|
||||
value: focusCaptionDescription
|
||||
}));
|
||||
|
|
@ -219,6 +232,16 @@ __webpack_require__.r(__webpack_exports__);
|
|||
// extracted by mini-css-extract-plugin
|
||||
|
||||
|
||||
/***/ }),
|
||||
|
||||
/***/ "react":
|
||||
/*!************************!*\
|
||||
!*** external "React" ***!
|
||||
\************************/
|
||||
/***/ ((module) => {
|
||||
|
||||
module.exports = window["React"];
|
||||
|
||||
/***/ }),
|
||||
|
||||
/***/ "@wordpress/block-editor":
|
||||
|
|
@ -251,16 +274,6 @@ module.exports = window["wp"]["components"];
|
|||
|
||||
/***/ }),
|
||||
|
||||
/***/ "@wordpress/element":
|
||||
/*!*********************************!*\
|
||||
!*** external ["wp","element"] ***!
|
||||
\*********************************/
|
||||
/***/ ((module) => {
|
||||
|
||||
module.exports = window["wp"]["element"];
|
||||
|
||||
/***/ }),
|
||||
|
||||
/***/ "@wordpress/i18n":
|
||||
/*!******************************!*\
|
||||
!*** external ["wp","i18n"] ***!
|
||||
|
|
@ -277,7 +290,7 @@ module.exports = window["wp"]["i18n"];
|
|||
\************************************/
|
||||
/***/ ((module) => {
|
||||
|
||||
module.exports = JSON.parse('{"$schema":"https://schemas.wp.org/trunk/block.json","apiVersion":2,"name":"homegrade-content-blocks/focus-point","version":"0.1.0","title":"Point de légende ","category":"homegrade-blocks","description":"Point de légende pour titrer ou décrire un point de légende spécifique sur un Schéma ","supports":{"html":false},"textdomain":"focus-point","editorScript":"file:./index.js","editorStyle":"file:./index.css","style":"file:./style-index.css","attributes":{"focusTitle":{"type":"string","default":"Légende Sans titre"},"focusCaptionDescription":{"type":"string"},"focusIndex":{"type":"number","default":0},"focusPosition":{"type":"object","default":{"x":0.5,"y":0.5}}}}');
|
||||
module.exports = /*#__PURE__*/JSON.parse('{"$schema":"https://schemas.wp.org/trunk/block.json","apiVersion":2,"name":"homegrade-content-blocks/focus-point","version":"0.1.0","title":"Point de légende ","category":"homegrade-blocks","description":"Point de légende pour titrer ou décrire un point de légende spécifique sur un Schéma ","supports":{"html":false},"textdomain":"focus-point","editorScript":"file:./index.js","editorStyle":"file:./index.css","style":"file:./style-index.css","attributes":{"focusTitle":{"type":"string","default":"Légende Sans titre"},"focusCaptionDescription":{"type":"string"},"focusIndex":{"type":"number","default":0},"focusPosition":{"type":"object","default":{"x":0.5,"y":0.5}}}}');
|
||||
|
||||
/***/ })
|
||||
|
||||
|
|
@ -323,9 +336,7 @@ module.exports = JSON.parse('{"$schema":"https://schemas.wp.org/trunk/block.json
|
|||
/******/ }
|
||||
/******/ var notFulfilled = Infinity;
|
||||
/******/ for (var i = 0; i < deferred.length; i++) {
|
||||
/******/ var chunkIds = deferred[i][0];
|
||||
/******/ var fn = deferred[i][1];
|
||||
/******/ var priority = deferred[i][2];
|
||||
/******/ var [chunkIds, fn, priority] = deferred[i];
|
||||
/******/ var fulfilled = true;
|
||||
/******/ for (var j = 0; j < chunkIds.length; j++) {
|
||||
/******/ if ((priority & 1 === 0 || notFulfilled >= priority) && Object.keys(__webpack_require__.O).every((key) => (__webpack_require__.O[key](chunkIds[j])))) {
|
||||
|
|
@ -411,9 +422,7 @@ module.exports = JSON.parse('{"$schema":"https://schemas.wp.org/trunk/block.json
|
|||
/******/
|
||||
/******/ // install a JSONP callback for chunk loading
|
||||
/******/ var webpackJsonpCallback = (parentChunkLoadingFunction, data) => {
|
||||
/******/ var chunkIds = data[0];
|
||||
/******/ var moreModules = data[1];
|
||||
/******/ var runtime = data[2];
|
||||
/******/ var [chunkIds, moreModules, runtime] = data;
|
||||
/******/ // add "moreModules" to the modules object,
|
||||
/******/ // then flag all "chunkIds" as loaded and fire callback
|
||||
/******/ var moduleId, chunkId, i = 0;
|
||||
|
|
@ -436,7 +445,7 @@ module.exports = JSON.parse('{"$schema":"https://schemas.wp.org/trunk/block.json
|
|||
/******/ return __webpack_require__.O(result);
|
||||
/******/ }
|
||||
/******/
|
||||
/******/ var chunkLoadingGlobal = self["webpackChunkmultiblocks"] = self["webpackChunkmultiblocks"] || [];
|
||||
/******/ var chunkLoadingGlobal = globalThis["webpackChunkmultiblocks"] = globalThis["webpackChunkmultiblocks"] || [];
|
||||
/******/ chunkLoadingGlobal.forEach(webpackJsonpCallback.bind(null, 0));
|
||||
/******/ chunkLoadingGlobal.push = webpackJsonpCallback.bind(null, chunkLoadingGlobal.push.bind(chunkLoadingGlobal));
|
||||
/******/ })();
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
4
blocks/focused-schema/build/focus-point/style-index.css
Normal file
4
blocks/focused-schema/build/focus-point/style-index.css
Normal file
|
|
@ -0,0 +1,4 @@
|
|||
/*!**********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
|
||||
!*** css ./node_modules/.pnpm/css-loader@6.10.0_webpack@5.90.3/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!./node_modules/.pnpm/postcss-loader@6.2.1_postcss@8.4.35_webpack@5.90.3/node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!./node_modules/.pnpm/sass-loader@12.6.0_sass@1.71.1_webpack@5.90.3/node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[4].use[3]!./src/focus-point/style.scss ***!
|
||||
\**********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
|
||||
|
||||
|
|
@ -1 +1 @@
|
|||
<?php return array('dependencies' => array('wp-blob', 'wp-block-editor', 'wp-blocks', 'wp-components', 'wp-data', 'wp-element', 'wp-i18n'), 'version' => '75fb291b951b2d937a72');
|
||||
<?php return array('dependencies' => array('react', 'wp-blob', 'wp-block-editor', 'wp-blocks', 'wp-components', 'wp-data', 'wp-element', 'wp-i18n', 'wp-primitives'), 'version' => '6a19cdd4e70537544dfe');
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
/*!****************************************************************************************************************************************************************************************************************************************!*\
|
||||
!*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[4].use[3]!./src/editor.scss ***!
|
||||
\****************************************************************************************************************************************************************************************************************************************/
|
||||
/*!***********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
|
||||
!*** css ./node_modules/.pnpm/css-loader@6.10.0_webpack@5.90.3/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!./node_modules/.pnpm/postcss-loader@6.2.1_postcss@8.4.35_webpack@5.90.3/node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!./node_modules/.pnpm/sass-loader@12.6.0_sass@1.71.1_webpack@5.90.3/node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[4].use[3]!./src/editor.scss ***!
|
||||
\***********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
|
||||
.homegrade-blocks-focused-schema .block-editor-block-list__layout,
|
||||
.homegrade-blocks-focused-schema .block-editor-block-list__block {
|
||||
position: unset;
|
||||
|
|
@ -34,9 +34,9 @@
|
|||
margin-top: -16px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
/*!****************************************************************************************************************************************************************************************************************************************************!*\
|
||||
!*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[4].use[3]!./src/focus-point/editor.scss ***!
|
||||
\****************************************************************************************************************************************************************************************************************************************************/
|
||||
/*!***********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
|
||||
!*** css ./node_modules/.pnpm/css-loader@6.10.0_webpack@5.90.3/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!./node_modules/.pnpm/postcss-loader@6.2.1_postcss@8.4.35_webpack@5.90.3/node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!./node_modules/.pnpm/sass-loader@12.6.0_sass@1.71.1_webpack@5.90.3/node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[4].use[3]!./src/focus-point/editor.scss ***!
|
||||
\***********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
|
||||
|
||||
|
||||
/*# sourceMappingURL=index.css.map*/
|
||||
|
|
@ -12,22 +12,25 @@ __webpack_require__.r(__webpack_exports__);
|
|||
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
||||
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
|
||||
/* harmony export */ });
|
||||
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
|
||||
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
|
||||
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
|
||||
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
|
||||
/* harmony import */ var _editor_scss__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./editor.scss */ "./src/editor.scss");
|
||||
/* harmony import */ var _focus_point__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./focus-point */ "./src/focus-point/index.js");
|
||||
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
|
||||
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__);
|
||||
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
|
||||
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_4__);
|
||||
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
|
||||
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_5__);
|
||||
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
|
||||
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_6__);
|
||||
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
|
||||
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__);
|
||||
/* harmony import */ var _wordpress_blob__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @wordpress/blob */ "@wordpress/blob");
|
||||
/* harmony import */ var _wordpress_blob__WEBPACK_IMPORTED_MODULE_8___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blob__WEBPACK_IMPORTED_MODULE_8__);
|
||||
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
|
||||
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_5__);
|
||||
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
|
||||
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_6__);
|
||||
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
|
||||
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__);
|
||||
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
|
||||
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_8___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__);
|
||||
/* harmony import */ var _wordpress_blob__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! @wordpress/blob */ "@wordpress/blob");
|
||||
/* harmony import */ var _wordpress_blob__WEBPACK_IMPORTED_MODULE_9___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blob__WEBPACK_IMPORTED_MODULE_9__);
|
||||
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! @wordpress/icons */ "../../node_modules/@wordpress/icons/build-module/library/trash.js");
|
||||
|
||||
|
||||
|
||||
|
|
@ -52,9 +55,14 @@ function Edit({
|
|||
coverUrl,
|
||||
coverId,
|
||||
coverAlt,
|
||||
showLegend,
|
||||
coverLegend,
|
||||
showDescription,
|
||||
coverDescription,
|
||||
focusBullets
|
||||
} = attributes;
|
||||
const [blobUrl, setBlobUrl] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)();
|
||||
console.log(coverLegend);
|
||||
const [blobUrl, setBlobUrl] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_5__.useState)();
|
||||
const currentBlockDatas = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_4__.useSelect)(select => {
|
||||
return select("core/block-editor").getBlocksByClientId(clientId)[0];
|
||||
});
|
||||
|
|
@ -67,14 +75,18 @@ function Edit({
|
|||
setAttributes({
|
||||
coverUrl: undefined,
|
||||
coverId: undefined,
|
||||
coverDescription: "",
|
||||
coverLegend: "",
|
||||
coverAlt: ""
|
||||
});
|
||||
}
|
||||
function updateImage(image) {
|
||||
function updateCover(image) {
|
||||
if (!image || !image.url) {
|
||||
setAttributes({
|
||||
coverUrl: undefined,
|
||||
coverId: undefined,
|
||||
coverDescription: "",
|
||||
coverLegend: "",
|
||||
coverAlt: ""
|
||||
});
|
||||
return;
|
||||
|
|
@ -82,7 +94,9 @@ function Edit({
|
|||
setAttributes({
|
||||
coverUrl: image.url,
|
||||
coverId: image.id,
|
||||
coverAlt: image.alt
|
||||
coverAlt: image.alt,
|
||||
coverDescription: image.description,
|
||||
coverLegend: image.caption
|
||||
});
|
||||
}
|
||||
function passCoverUrlToChildren() {
|
||||
|
|
@ -119,7 +133,7 @@ function Edit({
|
|||
}
|
||||
function insertFocusPointBlock() {
|
||||
const index = children && children.length ? children.length : 0;
|
||||
const newBlock = (0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_5__.createBlock)("homegrade-content-blocks/focus-point", {});
|
||||
const newBlock = (0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_6__.createBlock)("homegrade-content-blocks/focus-point", {});
|
||||
(0,_wordpress_data__WEBPACK_IMPORTED_MODULE_4__.dispatch)("core/block-editor").insertBlocks(newBlock, index, clientId);
|
||||
}
|
||||
function handleBulletClick(index) {
|
||||
|
|
@ -128,8 +142,18 @@ function Edit({
|
|||
(0,_wordpress_data__WEBPACK_IMPORTED_MODULE_4__.dispatch)("core/block-editor").selectBlock(currentBlockDatas.innerBlocks[index].clientId);
|
||||
}
|
||||
}
|
||||
function handleShowDescription() {
|
||||
setAttributes({
|
||||
showDescription: !showDescription
|
||||
});
|
||||
}
|
||||
function handleShowLegend() {
|
||||
setAttributes({
|
||||
showLegend: !showLegend
|
||||
});
|
||||
}
|
||||
const renderedFocusPointBullets = focusBullets.map((focusBullet, index) => {
|
||||
return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
|
||||
return (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
|
||||
"data-focus-bullet-title": focusBullet.title,
|
||||
className: "homegrade-blocks-focus-point-bullet",
|
||||
style: {
|
||||
|
|
@ -137,87 +161,111 @@ function Edit({
|
|||
left: `${focusBullet.x * 100}%`
|
||||
},
|
||||
onClick: () => handleBulletClick(index)
|
||||
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
|
||||
}, (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
|
||||
className: "homegrade-blocks-focus-point-bullet__index"
|
||||
}, index + 1));
|
||||
});
|
||||
(0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
|
||||
(0,_wordpress_element__WEBPACK_IMPORTED_MODULE_5__.useEffect)(() => {
|
||||
updateFocusPointBullets();
|
||||
if (!coverId && (0,_wordpress_blob__WEBPACK_IMPORTED_MODULE_8__.isBlobURL)(coverUrl)) {
|
||||
if (!coverId && (0,_wordpress_blob__WEBPACK_IMPORTED_MODULE_9__.isBlobURL)(coverUrl)) {
|
||||
setAttributes({
|
||||
coverUrl: undefined,
|
||||
coverAlt: ""
|
||||
});
|
||||
}
|
||||
}, []);
|
||||
(0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
|
||||
(0,_wordpress_element__WEBPACK_IMPORTED_MODULE_5__.useEffect)(() => {
|
||||
// Fonction de clean du BLOB URL qui se lance à chaque changement de coverUrl
|
||||
if ((0,_wordpress_blob__WEBPACK_IMPORTED_MODULE_8__.isBlobURL)(coverUrl)) {
|
||||
if ((0,_wordpress_blob__WEBPACK_IMPORTED_MODULE_9__.isBlobURL)(coverUrl)) {
|
||||
// Si la cover est une blob, c'est que ça upload donc on met cette url dans le state
|
||||
setBlobUrl(coverUrl);
|
||||
} else {
|
||||
// Si la cover en'est plus une blob, c'est que l'upload est terminé, on revoke la blob et on clean le state
|
||||
(0,_wordpress_blob__WEBPACK_IMPORTED_MODULE_8__.revokeBlobURL)(blobUrl); // On utilise la valeur stocké dans le state pour revoke l'url
|
||||
(0,_wordpress_blob__WEBPACK_IMPORTED_MODULE_9__.revokeBlobURL)(blobUrl); // On utilise la valeur stocké dans le state pour revoke l'url
|
||||
setBlobUrl();
|
||||
}
|
||||
passCoverUrlToChildren();
|
||||
}, [coverUrl]);
|
||||
(0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
|
||||
(0,_wordpress_element__WEBPACK_IMPORTED_MODULE_5__.useEffect)(() => {
|
||||
updateFocusPointBullets();
|
||||
passCoverUrlToChildren();
|
||||
}, [children]);
|
||||
(0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
|
||||
(0,_wordpress_element__WEBPACK_IMPORTED_MODULE_5__.useEffect)(() => {
|
||||
passIndexToChildren();
|
||||
}, [currentBlockDatas]);
|
||||
return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_6__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.Button, {
|
||||
return (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(react__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.InspectorControls, null, (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
|
||||
title: "Points de l\xE9gende"
|
||||
}, (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.Button, {
|
||||
variant: "primary",
|
||||
onClick: () => {
|
||||
insertFocusPointBlock();
|
||||
}
|
||||
}, "Ajouter un point L\xE9gende"))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_6__.BlockControls, null, coverUrl && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_6__.MediaReplaceFlow, {
|
||||
group: "inline",
|
||||
name: "Remplacer l'image",
|
||||
disableMediaButtons: coverUrl,
|
||||
icon: "trash",
|
||||
onSelect: updateImage,
|
||||
onError: onUploadError,
|
||||
accept: "image/*" // On upload Allow only images
|
||||
,
|
||||
allowedTypes: ["image"] // Onlibrary Allow only images
|
||||
,
|
||||
notices: noticeUI // En cas d'erreur d'upload
|
||||
,
|
||||
mediaId: coverId,
|
||||
mediaURL: coverUrl,
|
||||
className: "media-button-replacer"
|
||||
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.ToolbarButton, {
|
||||
icon: "trash",
|
||||
title: "Supprimer l'image",
|
||||
onClick: removeCoverImg
|
||||
}))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_6__.MediaPlaceholder, {
|
||||
disableMediaButtons: coverUrl,
|
||||
icon: "admin-appearance",
|
||||
onSelect: updateImage,
|
||||
onError: onUploadError,
|
||||
accept: "image/*" // On upload Allow only images
|
||||
,
|
||||
allowedTypes: ["image"] // Onlibrary Allow only images
|
||||
,
|
||||
notices: noticeUI // En cas d'erreur d'upload
|
||||
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("section", {
|
||||
...(0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_6__.useBlockProps)({
|
||||
className: `homegrade-blocks-focused-schema`
|
||||
})
|
||||
}, coverUrl && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("figure", {
|
||||
className: `picture-container ${(0,_wordpress_blob__WEBPACK_IMPORTED_MODULE_8__.isBlobURL)(coverUrl) ? "is-loading" : ""}`
|
||||
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", {
|
||||
}, "Ajouter un point L\xE9gende")), (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
|
||||
title: "Source de l'image / Sch\xE9ma",
|
||||
className: "homegrade-blocks-components-image__panel-body "
|
||||
}, coverUrl && (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", {
|
||||
src: coverUrl,
|
||||
alt: coverAlt
|
||||
}), renderedFocusPointBullets, (0,_wordpress_blob__WEBPACK_IMPORTED_MODULE_8__.isBlobURL)(coverUrl) && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.Spinner, null)), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("figcaption", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("ol", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_6__.InnerBlocks, {
|
||||
}), (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
|
||||
className: "media-replace-container"
|
||||
}, (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.MediaReplaceFlow, {
|
||||
mediaId: coverId,
|
||||
mediaUrl: coverUrl,
|
||||
allowedTypes: ["image"],
|
||||
accept: "image/*",
|
||||
onSelect: updateCover,
|
||||
name: !coverUrl ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Ajouter", "homegrade-blocks__texte-backoffice") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Remplacer", "homegrade-blocks__texte-backoffice")
|
||||
}), coverUrl && (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.Button, {
|
||||
className: "custom-flow-button",
|
||||
variant: "primary",
|
||||
icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_10__["default"],
|
||||
label: "Supprimer",
|
||||
onClick: removeCoverImg
|
||||
})))), (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
|
||||
title: "Param\xE8tres",
|
||||
className: "homegrade-blocks-components-image__panel-body "
|
||||
}, (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.ToggleControl, {
|
||||
label: "Afficher la description",
|
||||
checked: showDescription,
|
||||
onChange: handleShowDescription,
|
||||
help: "Coch\xE9, la description sera ajout\xE9 sous l'image"
|
||||
}), (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.ToggleControl, {
|
||||
label: "Afficher la l\xE9gende",
|
||||
checked: showLegend,
|
||||
onChange: handleShowLegend,
|
||||
help: "Coch\xE9, la l\xE9gende (caption) sera ajout\xE9 sous l'image"
|
||||
}))), (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.MediaPlaceholder, {
|
||||
disableMediaButtons: coverUrl,
|
||||
icon: "admin-appearance",
|
||||
onSelect: updateCover,
|
||||
onError: onUploadError,
|
||||
accept: "image/*" // On upload Allow only images
|
||||
,
|
||||
allowedTypes: ["image"] // Onlibrary Allow only images
|
||||
,
|
||||
notices: noticeUI // En cas d'erreur d'upload
|
||||
}), (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("section", {
|
||||
...(0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useBlockProps)({
|
||||
className: `homegrade-blocks-focused-schema`
|
||||
})
|
||||
}, coverUrl && (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("figure", {
|
||||
className: `picture-container ${(0,_wordpress_blob__WEBPACK_IMPORTED_MODULE_9__.isBlobURL)(coverUrl) ? "is-loading" : ""}`
|
||||
}, (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", {
|
||||
src: coverUrl,
|
||||
alt: coverAlt,
|
||||
"data-description": coverDescription,
|
||||
"data-legend": coverLegend
|
||||
}), renderedFocusPointBullets, (0,_wordpress_blob__WEBPACK_IMPORTED_MODULE_9__.isBlobURL)(coverUrl) && (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.Spinner, null)), (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("figcaption", null, (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
|
||||
className: "description-legend"
|
||||
}, showLegend && coverLegend && (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
|
||||
className: "legend"
|
||||
}, coverLegend), showDescription && coverDescription && (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
|
||||
className: "description"
|
||||
}, coverDescription)), (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("ol", null, (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.InnerBlocks, {
|
||||
allowedBlocks: ["homegrade-content-blocks/focus-point"]
|
||||
})))));
|
||||
}
|
||||
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = ((0,_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.withNotices)(Edit));
|
||||
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = ((0,_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.withNotices)(Edit));
|
||||
|
||||
/***/ }),
|
||||
|
||||
|
|
@ -231,8 +279,8 @@ __webpack_require__.r(__webpack_exports__);
|
|||
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
||||
/* harmony export */ "default": () => (/* binding */ Edit)
|
||||
/* harmony export */ });
|
||||
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
|
||||
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
|
||||
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
|
||||
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
|
||||
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
|
||||
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__);
|
||||
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
|
||||
|
|
@ -261,6 +309,19 @@ function Edit({
|
|||
focusIndex
|
||||
} = attributes;
|
||||
function handleChangeFocusPosition(focusPosition) {
|
||||
console.log(focusPosition);
|
||||
if (focusPosition.x < 0.05) {
|
||||
focusPosition.x = 0.05;
|
||||
}
|
||||
if (focusPosition.x > 0.95) {
|
||||
focusPosition.x = 0.95;
|
||||
}
|
||||
if (focusPosition.y < 0.02) {
|
||||
focusPosition.y = 0.02;
|
||||
}
|
||||
if (focusPosition.y > 0.98) {
|
||||
focusPosition.y = 0.98;
|
||||
}
|
||||
setAttributes({
|
||||
focusPosition
|
||||
});
|
||||
|
|
@ -275,12 +336,12 @@ function Edit({
|
|||
focusCaptionDescription
|
||||
});
|
||||
}
|
||||
return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_2__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.PanelBody, {
|
||||
return (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(react__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_2__.InspectorControls, null, (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.PanelBody, {
|
||||
className: "focus-point-modification-pannel",
|
||||
title: "Gestion du points de focus"
|
||||
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
|
||||
}, (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
|
||||
className: "homegrade-blocks-focus-point-bullet"
|
||||
}, focusIndex), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.TextControl, {
|
||||
}, focusIndex), (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.TextControl, {
|
||||
placeholder: "Ins\xE9rer le titre de votre point focus",
|
||||
label: "Titre du point focus",
|
||||
value: focusTitle !== "Légende Sans titre" ? focusTitle : null,
|
||||
|
|
@ -288,14 +349,14 @@ function Edit({
|
|||
onChange: value => {
|
||||
handleChangeTitle(value);
|
||||
}
|
||||
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.TextareaControl, {
|
||||
}), (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.TextareaControl, {
|
||||
label: "Description du point focus",
|
||||
value: focusCaptionDescription,
|
||||
rows: 3,
|
||||
onChange: description => {
|
||||
handleChangeCaptionDescription(description);
|
||||
}
|
||||
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.FocalPointPicker, {
|
||||
}), (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.FocalPointPicker, {
|
||||
url: coverUrl !== null && coverUrl !== void 0 ? coverUrl : null,
|
||||
dimensions: {
|
||||
width: 400,
|
||||
|
|
@ -305,18 +366,18 @@ function Edit({
|
|||
onChange: focalPoint => {
|
||||
handleChangeFocusPosition(focalPoint);
|
||||
}
|
||||
}))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("li", {
|
||||
}))), (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("li", {
|
||||
...(0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_2__.useBlockProps)({
|
||||
className: `homegrade-blocks-focus-point-caption`
|
||||
})
|
||||
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_2__.RichText, {
|
||||
}, (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_2__.RichText, {
|
||||
tagName: "span",
|
||||
className: "focus-point-title",
|
||||
value: focusTitle,
|
||||
onChange: value => {
|
||||
handleChangeTitle(value);
|
||||
}
|
||||
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_2__.RichText, {
|
||||
}), (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_2__.RichText, {
|
||||
tagName: "span",
|
||||
value: focusCaptionDescription,
|
||||
onChange: handleChangeCaptionDescription
|
||||
|
|
@ -332,8 +393,8 @@ function Edit({
|
|||
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
||||
|
||||
__webpack_require__.r(__webpack_exports__);
|
||||
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
|
||||
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
|
||||
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
|
||||
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
|
||||
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
|
||||
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__);
|
||||
/* harmony import */ var _style_scss__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./style.scss */ "./src/focus-point/style.scss");
|
||||
|
|
@ -350,20 +411,20 @@ __webpack_require__.r(__webpack_exports__);
|
|||
title: _block_json__WEBPACK_IMPORTED_MODULE_3__.title,
|
||||
icon: {
|
||||
foreground: "#DF1E1E",
|
||||
src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
|
||||
src: (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
|
||||
id: "Capa_1",
|
||||
"enable-background": "new 0 0 512 512",
|
||||
height: "512",
|
||||
viewBox: "0 0 512 512",
|
||||
width: "512",
|
||||
xmlns: "http://www.w3.org/2000/svg"
|
||||
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("g", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
|
||||
}, (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("g", null, (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
|
||||
d: "m100.001 255.776c0-80.958 61.992-147.702 140.999-155.275v-100.277c-62.739 3.601-121.221 29.734-166.02 74.533-48.351 48.352-74.98 112.64-74.98 181.019 0 43.893 10.989 86.092 31.636 123.48l85.806-51.86c-11.138-21.46-17.441-45.817-17.441-71.62z"
|
||||
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
|
||||
}), (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
|
||||
d: "m256 411.776c-49.473 0-93.636-23.154-122.236-59.189l-86.098 52.037c8.139 11.341 17.249 22.106 27.315 32.173 48.352 48.352 112.64 74.98 181.02 74.98s132.667-26.629 181.02-74.98c11.293-11.293 21.384-23.465 30.245-36.346l-87.133-50.306c-28.524 37.426-73.552 61.631-124.133 61.631z"
|
||||
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
|
||||
}), (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
|
||||
d: "m411.999 255.776c0 24.704-5.781 48.08-16.048 68.86l86.835 50.134c19.084-36.263 29.214-76.848 29.214-118.994 0-68.38-26.629-132.667-74.98-181.02-44.799-44.798-103.281-70.931-166.02-74.532v100.278c79.007 7.573 140.999 74.316 140.999 155.274z"
|
||||
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
|
||||
}), (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
|
||||
cx: "256",
|
||||
cy: "255.776",
|
||||
r: "103.902"
|
||||
|
|
@ -387,8 +448,8 @@ __webpack_require__.r(__webpack_exports__);
|
|||
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
||||
/* harmony export */ "default": () => (/* binding */ save)
|
||||
/* harmony export */ });
|
||||
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
|
||||
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
|
||||
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
|
||||
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
|
||||
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
|
||||
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__);
|
||||
|
||||
|
|
@ -400,15 +461,15 @@ function save({
|
|||
focusCaptionDescription,
|
||||
focusTitle
|
||||
} = attributes;
|
||||
return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("li", {
|
||||
return (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("li", {
|
||||
..._wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__.useBlockProps.save({
|
||||
className: `homegrade-blocks-focus-point-caption`
|
||||
})
|
||||
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__.RichText.Content, {
|
||||
}, (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__.RichText.Content, {
|
||||
tagName: "span",
|
||||
className: "focus-point-title",
|
||||
value: focusTitle
|
||||
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__.RichText.Content, {
|
||||
}), (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__.RichText.Content, {
|
||||
tagName: "span",
|
||||
value: focusCaptionDescription
|
||||
}));
|
||||
|
|
@ -423,8 +484,8 @@ function save({
|
|||
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
||||
|
||||
__webpack_require__.r(__webpack_exports__);
|
||||
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
|
||||
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
|
||||
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
|
||||
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
|
||||
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
|
||||
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__);
|
||||
/* harmony import */ var _style_scss__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./style.scss */ "./src/style.scss");
|
||||
|
|
@ -439,19 +500,19 @@ __webpack_require__.r(__webpack_exports__);
|
|||
|
||||
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.registerBlockType)(_block_json__WEBPACK_IMPORTED_MODULE_5__.name, {
|
||||
icon: {
|
||||
src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
|
||||
src: (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
|
||||
id: "Capa_1",
|
||||
height: "512",
|
||||
viewBox: "0 0 512 512",
|
||||
width: "512",
|
||||
xmlns: "http://www.w3.org/2000/svg"
|
||||
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("g", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
|
||||
}, (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("g", null, (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
|
||||
d: "m443.093 324.907c0-103.163-83.93-187.092-187.093-187.092s-187.093 83.929-187.093 187.092c0 42.261 14.092 81.289 37.814 112.647-6.216-16.99-9.611-35.328-9.611-54.444 0-87.612 71.277-158.89 158.89-158.89s158.89 71.277 158.89 158.89c0 19.116-3.395 37.454-9.611 54.444 23.722-31.358 37.814-70.386 37.814-112.647z"
|
||||
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
|
||||
}), (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
|
||||
d: "m384.89 383.11c0-71.07-57.819-128.89-128.89-128.89s-128.89 57.82-128.89 128.89c0 41.62 19.834 78.688 50.541 102.268-2.706-8.157-4.192-16.865-4.192-25.919 0-45.514 37.027-82.542 82.541-82.542s82.541 37.028 82.541 82.542c0 9.054-1.486 17.762-4.192 25.919 30.706-23.58 50.541-60.648 50.541-102.268z"
|
||||
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
|
||||
}), (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
|
||||
d: "m308.541 459.459c0-28.972-23.569-52.542-52.541-52.542s-52.541 23.57-52.541 52.542 23.569 52.541 52.541 52.541 52.541-23.569 52.541-52.541z"
|
||||
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
|
||||
}), (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
|
||||
d: "m512 256c0-68.38-26.629-132.667-74.98-181.02-48.353-48.351-112.64-74.98-181.02-74.98s-132.667 26.629-181.02 74.98c-48.351 48.353-74.98 112.64-74.98 181.02 0 62.294 22.108 121.187 62.599 167.734-15.483-30.22-23.692-63.891-23.692-98.827 0-57.987 22.582-112.504 63.585-153.507 41.004-41.004 95.521-63.585 153.508-63.585s112.504 22.581 153.508 63.585c41.003 41.003 63.585 95.52 63.585 153.507 0 34.936-8.208 68.606-23.692 98.827 40.491-46.547 62.599-105.44 62.599-167.734z"
|
||||
}))),
|
||||
foreground: "#DF1E1E"
|
||||
|
|
@ -472,8 +533,8 @@ __webpack_require__.r(__webpack_exports__);
|
|||
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
||||
/* harmony export */ "default": () => (/* binding */ save)
|
||||
/* harmony export */ });
|
||||
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
|
||||
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
|
||||
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
|
||||
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
|
||||
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
|
||||
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__);
|
||||
|
||||
|
|
@ -486,10 +547,14 @@ function save({
|
|||
coverUrl,
|
||||
coverId,
|
||||
coverAlt,
|
||||
showDescription,
|
||||
coverDescription,
|
||||
showLegend,
|
||||
coverLegend,
|
||||
focusBullets
|
||||
} = attributes;
|
||||
const renderedFocusPointBullets = focusBullets.map((focusBullet, index) => {
|
||||
return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
|
||||
return (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
|
||||
"data-focus-bullet-title": focusBullet.title,
|
||||
className: "homegrade-blocks-focus-point-bullet",
|
||||
"aria-hidden": "true",
|
||||
|
|
@ -499,21 +564,29 @@ function save({
|
|||
},
|
||||
"data-postion-x": focusBullet.x * 100,
|
||||
"data-postion-y": focusBullet.y * 100
|
||||
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
|
||||
}, (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
|
||||
className: "homegrade-blocks-focus-point-bullet__index"
|
||||
}, index + 1));
|
||||
});
|
||||
return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("section", {
|
||||
return (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("section", {
|
||||
..._wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__.useBlockProps.save({
|
||||
className: `homegrade-blocks-focused-schema`
|
||||
})
|
||||
}, coverUrl && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("figure", {
|
||||
}, coverUrl && (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("figure", {
|
||||
className: `picture-container`
|
||||
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", {
|
||||
}, (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", {
|
||||
src: coverUrl,
|
||||
alt: coverAlt,
|
||||
className: `wp-image-${coverId}`
|
||||
}), renderedFocusPointBullets), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("figcaption", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("ol", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__.InnerBlocks.Content, null))));
|
||||
className: `wp-image-${coverId}`,
|
||||
"data-description": coverDescription,
|
||||
"data-legend": coverLegend
|
||||
}), renderedFocusPointBullets), (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("figcaption", null, (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
|
||||
className: "description-legend"
|
||||
}, showLegend && coverLegend && (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
|
||||
className: "legend"
|
||||
}, coverLegend), showDescription && coverDescription && (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
|
||||
className: "description"
|
||||
}, coverDescription)), (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("ol", null, (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__.InnerBlocks.Content, null))));
|
||||
}
|
||||
|
||||
/***/ }),
|
||||
|
|
@ -564,6 +637,47 @@ __webpack_require__.r(__webpack_exports__);
|
|||
// extracted by mini-css-extract-plugin
|
||||
|
||||
|
||||
/***/ }),
|
||||
|
||||
/***/ "../../node_modules/@wordpress/icons/build-module/library/trash.js":
|
||||
/*!*************************************************************************!*\
|
||||
!*** ../../node_modules/@wordpress/icons/build-module/library/trash.js ***!
|
||||
\*************************************************************************/
|
||||
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
||||
|
||||
__webpack_require__.r(__webpack_exports__);
|
||||
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
||||
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
|
||||
/* harmony export */ });
|
||||
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
|
||||
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
|
||||
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/primitives */ "@wordpress/primitives");
|
||||
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__);
|
||||
|
||||
|
||||
/**
|
||||
* WordPress dependencies
|
||||
*/
|
||||
|
||||
const trash = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.SVG, {
|
||||
xmlns: "http://www.w3.org/2000/svg",
|
||||
viewBox: "0 0 24 24"
|
||||
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
|
||||
d: "M20 5h-5.7c0-1.3-1-2.3-2.3-2.3S9.7 3.7 9.7 5H4v2h1.5v.3l1.7 11.1c.1 1 1 1.7 2 1.7h5.7c1 0 1.8-.7 2-1.7l1.7-11.1V7H20V5zm-3.2 2l-1.7 11.1c0 .1-.1.2-.3.2H9.1c-.1 0-.3-.1-.3-.2L7.2 7h9.6z"
|
||||
}));
|
||||
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (trash);
|
||||
//# sourceMappingURL=trash.js.map
|
||||
|
||||
/***/ }),
|
||||
|
||||
/***/ "react":
|
||||
/*!************************!*\
|
||||
!*** external "React" ***!
|
||||
\************************/
|
||||
/***/ ((module) => {
|
||||
|
||||
module.exports = window["React"];
|
||||
|
||||
/***/ }),
|
||||
|
||||
/***/ "@wordpress/blob":
|
||||
|
|
@ -636,13 +750,23 @@ module.exports = window["wp"]["i18n"];
|
|||
|
||||
/***/ }),
|
||||
|
||||
/***/ "@wordpress/primitives":
|
||||
/*!************************************!*\
|
||||
!*** external ["wp","primitives"] ***!
|
||||
\************************************/
|
||||
/***/ ((module) => {
|
||||
|
||||
module.exports = window["wp"]["primitives"];
|
||||
|
||||
/***/ }),
|
||||
|
||||
/***/ "./src/block.json":
|
||||
/*!************************!*\
|
||||
!*** ./src/block.json ***!
|
||||
\************************/
|
||||
/***/ ((module) => {
|
||||
|
||||
module.exports = JSON.parse('{"$schema":"https://schemas.wp.org/trunk/block.json","apiVersion":2,"name":"homegrade-content-blocks/focused-schema","version":"0.1.0","title":"Schéma + Légende","category":"homegrade-blocks","description":"Bloc de Gestion schéma. Insérer un schéma et insérez-y la légende nécéssaire à l\'aide de points de focus.","supports":{"html":false,"reusable":false},"attributes":{"coverId":{"type":"number"},"coverAlt":{"type":"string","source":"attribute","selector":"img","attribute":"alt","default":""},"coverUrl":{"type":"string","source":"attribute","selector":"img","attribute":"src"},"focusBullets":{"type":"array","default":[]}},"textdomain":"homegrade-theme__bloks-texte-fonctionnel","editorScript":"file:./index.js","editorStyle":"file:./index.css","style":"file:./style-index.css"}');
|
||||
module.exports = /*#__PURE__*/JSON.parse('{"$schema":"https://schemas.wp.org/trunk/block.json","apiVersion":2,"name":"homegrade-content-blocks/focused-schema","version":"0.1.0","title":"Schéma + Légende","category":"homegrade-blocks","description":"Bloc de Gestion schéma. Insérer un schéma et insérez-y la légende nécéssaire à l\'aide de points de focus.","supports":{"html":false,"reusable":false},"attributes":{"coverId":{"type":"number"},"coverAlt":{"type":"string","source":"attribute","selector":"img","attribute":"alt","default":""},"showDescription":{"type":"boolean","default":false},"showLegend":{"type":"boolean","default":false},"coverUrl":{"type":"string","source":"attribute","selector":"img","attribute":"src"},"coverDescription":{"type":"string","source":"attribute","selector":"img","attribute":"data-description"},"coverLegend":{"type":"string","source":"attribute","selector":"img","attribute":"data-legend"},"focusBullets":{"type":"array","default":[]}},"textdomain":"homegrade-theme__bloks-texte-fonctionnel","editorScript":"file:./index.js","editorStyle":"file:./index.css","style":"file:./style-index.css"}');
|
||||
|
||||
/***/ }),
|
||||
|
||||
|
|
@ -652,7 +776,7 @@ module.exports = JSON.parse('{"$schema":"https://schemas.wp.org/trunk/block.json
|
|||
\************************************/
|
||||
/***/ ((module) => {
|
||||
|
||||
module.exports = JSON.parse('{"$schema":"https://schemas.wp.org/trunk/block.json","apiVersion":2,"name":"homegrade-content-blocks/focus-point","version":"0.1.0","title":"Point de légende ","category":"homegrade-blocks","description":"Point de légende pour titrer ou décrire un point de légende spécifique sur un Schéma ","supports":{"html":false},"textdomain":"focus-point","editorScript":"file:./index.js","editorStyle":"file:./index.css","style":"file:./style-index.css","attributes":{"focusTitle":{"type":"string","default":"Légende Sans titre"},"focusCaptionDescription":{"type":"string"},"focusIndex":{"type":"number","default":0},"focusPosition":{"type":"object","default":{"x":0.5,"y":0.5}}}}');
|
||||
module.exports = /*#__PURE__*/JSON.parse('{"$schema":"https://schemas.wp.org/trunk/block.json","apiVersion":2,"name":"homegrade-content-blocks/focus-point","version":"0.1.0","title":"Point de légende ","category":"homegrade-blocks","description":"Point de légende pour titrer ou décrire un point de légende spécifique sur un Schéma ","supports":{"html":false},"textdomain":"focus-point","editorScript":"file:./index.js","editorStyle":"file:./index.css","style":"file:./style-index.css","attributes":{"focusTitle":{"type":"string","default":"Légende Sans titre"},"focusCaptionDescription":{"type":"string"},"focusIndex":{"type":"number","default":0},"focusPosition":{"type":"object","default":{"x":0.5,"y":0.5}}}}');
|
||||
|
||||
/***/ })
|
||||
|
||||
|
|
@ -698,9 +822,7 @@ module.exports = JSON.parse('{"$schema":"https://schemas.wp.org/trunk/block.json
|
|||
/******/ }
|
||||
/******/ var notFulfilled = Infinity;
|
||||
/******/ for (var i = 0; i < deferred.length; i++) {
|
||||
/******/ var chunkIds = deferred[i][0];
|
||||
/******/ var fn = deferred[i][1];
|
||||
/******/ var priority = deferred[i][2];
|
||||
/******/ var [chunkIds, fn, priority] = deferred[i];
|
||||
/******/ var fulfilled = true;
|
||||
/******/ for (var j = 0; j < chunkIds.length; j++) {
|
||||
/******/ if ((priority & 1 === 0 || notFulfilled >= priority) && Object.keys(__webpack_require__.O).every((key) => (__webpack_require__.O[key](chunkIds[j])))) {
|
||||
|
|
@ -786,9 +908,7 @@ module.exports = JSON.parse('{"$schema":"https://schemas.wp.org/trunk/block.json
|
|||
/******/
|
||||
/******/ // install a JSONP callback for chunk loading
|
||||
/******/ var webpackJsonpCallback = (parentChunkLoadingFunction, data) => {
|
||||
/******/ var chunkIds = data[0];
|
||||
/******/ var moreModules = data[1];
|
||||
/******/ var runtime = data[2];
|
||||
/******/ var [chunkIds, moreModules, runtime] = data;
|
||||
/******/ // add "moreModules" to the modules object,
|
||||
/******/ // then flag all "chunkIds" as loaded and fire callback
|
||||
/******/ var moduleId, chunkId, i = 0;
|
||||
|
|
@ -811,7 +931,7 @@ module.exports = JSON.parse('{"$schema":"https://schemas.wp.org/trunk/block.json
|
|||
/******/ return __webpack_require__.O(result);
|
||||
/******/ }
|
||||
/******/
|
||||
/******/ var chunkLoadingGlobal = self["webpackChunkmultiblocks"] = self["webpackChunkmultiblocks"] || [];
|
||||
/******/ var chunkLoadingGlobal = globalThis["webpackChunkmultiblocks"] = globalThis["webpackChunkmultiblocks"] || [];
|
||||
/******/ chunkLoadingGlobal.forEach(webpackJsonpCallback.bind(null, 0));
|
||||
/******/ chunkLoadingGlobal.push = webpackJsonpCallback.bind(null, chunkLoadingGlobal.push.bind(chunkLoadingGlobal));
|
||||
/******/ })();
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -1,6 +1,7 @@
|
|||
/*!***************************************************************************************************************************************************************************************************************************************!*\
|
||||
!*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[4].use[3]!./src/style.scss ***!
|
||||
\***************************************************************************************************************************************************************************************************************************************/
|
||||
/*!**********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
|
||||
!*** css ./node_modules/.pnpm/css-loader@6.10.0_webpack@5.90.3/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!./node_modules/.pnpm/postcss-loader@6.2.1_postcss@8.4.35_webpack@5.90.3/node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!./node_modules/.pnpm/sass-loader@12.6.0_sass@1.71.1_webpack@5.90.3/node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[4].use[3]!./src/style.scss ***!
|
||||
\**********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
|
||||
@charset "UTF-8";
|
||||
/**
|
||||
* The following styles get applied both on the front of your site
|
||||
* and in the editor.
|
||||
|
|
@ -10,6 +11,12 @@
|
|||
.homegrade-blocks-focused-schema figure {
|
||||
position: relative;
|
||||
}
|
||||
.homegrade-blocks-focused-schema figcaption .legend + .description:before {
|
||||
content: "—";
|
||||
margin: 0 5px;
|
||||
display: inline-block;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.homegrade-blocks-focused-schema figcaption ol {
|
||||
padding-top: 20px;
|
||||
counter-reset: myOrderedListItemsCounter;
|
||||
|
|
@ -109,9 +116,9 @@
|
|||
font-weight: bold;
|
||||
margin-right: 6px;
|
||||
}
|
||||
/*!***************************************************************************************************************************************************************************************************************************************************!*\
|
||||
!*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[4].use[3]!./src/focus-point/style.scss ***!
|
||||
\***************************************************************************************************************************************************************************************************************************************************/
|
||||
/*!**********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
|
||||
!*** css ./node_modules/.pnpm/css-loader@6.10.0_webpack@5.90.3/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!./node_modules/.pnpm/postcss-loader@6.2.1_postcss@8.4.35_webpack@5.90.3/node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!./node_modules/.pnpm/sass-loader@12.6.0_sass@1.71.1_webpack@5.90.3/node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[4].use[3]!./src/focus-point/style.scss ***!
|
||||
\**********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
|
||||
|
||||
|
||||
/*# sourceMappingURL=style-index.css.map*/
|
||||
|
|
@ -1 +1 @@
|
|||
{"version":3,"file":"./style-index.css","mappings":";;;AAAA;;;;;EAAA;AAQC;EACC;AADF;AAKE;EACC;EACA;AAHH;AAKG;EACC;EACA;EACA;EACA;EACA;AAHJ;AAKG;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AAHJ;AAQC;EACC;EACA;EACA;EACA;EACA;AANF;AAQE;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AANH;AAUC;EACC;EACA;EACA;AARF;AAUE;EAEC;AATH;AAYC;EACC;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EAEA;EAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AAZF;AAcE;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AAZH;AAqBC;EACC;AAnBF;;AAyBA;EACC;EACA;AAtBD,C","sources":["webpack://multiblocks/./src/style.scss"],"sourcesContent":["/**\n * The following styles get applied both on the front of your site\n * and in the editor.\n *\n * Replace them with your own styles or remove the file completely.\n */\n\n.homegrade-blocks-focused-schema {\n\tfigure {\n\t\tposition: relative;\n\t}\n\n\tfigcaption {\n\t\tol {\n\t\t\tpadding-top: 20px;\n\t\t\tcounter-reset: myOrderedListItemsCounter;\n\n\t\t\tli {\n\t\t\t\tline-height: 1.3;\n\t\t\t\tlist-style-type: none;\n\t\t\t\tposition: relative;\n\t\t\t\tpadding: 8px;\n\t\t\t\tpadding-left: 50px;\n\t\t\t}\n\t\t\tli:before {\n\t\t\t\tcontent: \"\";\n\t\t\t\tleft: 0;\n\t\t\t\ttop: 0;\n\t\t\t\ttransform: translateY(3px);\n\t\t\t\tposition: absolute;\n\t\t\t\twidth: 30px;\n\t\t\t\theight: 30px;\n\t\t\t\tdisplay: flex;\n\t\t\t\tjustify-content: center;\n\t\t\t\talign-items: center;\n\t\t\t\tbackground-color: red;\n\t\t\t\tcolor: white;\n\t\t\t\tborder-radius: 50%;\n\t\t\t\tcounter-increment: myOrderedListItemsCounter;\n\t\t\t\tcontent: counter(myOrderedListItemsCounter);\n\t\t\t\tmargin-right: 0.5em;\n\t\t\t\tfont-weight: 700;\n\t\t\t}\n\t\t}\n\t}\n\n\t.homegrade-blocks-focus-point-bullet {\n\t\tposition: absolute !important;\n\t\tborder-radius: 50%;\n\t\ttransition: scale 0.2s ease-in-out;\n\t\tz-index: 1;\n\t\ttransform: translateX(-50%);\n\n\t\t&__index {\n\t\t\tfont-weight: 700;\n\t\t\twidth: 20px;\n\t\t\theight: 20px;\n\t\t\ttop: 0;\n\t\t\tleft: 0;\n\t\t\tposition: relative;\n\t\t\tcolor: white;\n\t\t\tdisplay: flex;\n\t\t\tjustify-content: center;\n\t\t\talign-items: center;\n\t\t\tpadding: 16px;\n\t\t}\n\t}\n\n\t.homegrade-blocks-focus-point-bullet:hover {\n\t\tscale: 1.2;\n\t\tfilter: brightness(1.2) hue-rotate(10deg);\n\t\tz-index: 1;\n\n\t\t& + .homegrade-blocks-focus-point-bullet__tooltip-container {\n\t\t\t// background-color: red;\n\t\t\tdisplay: flex;\n\t\t}\n\t}\n\t.homegrade-blocks-focus-point-bullet__tooltip-container {\n\t\tz-index: 999;\n\t\tposition: absolute;\n\t\tleft: calc(44%);\n\t\ttop: 25%;\n\t\ttransform: translate(-50%, calc(-100%));\n\n\t\tbackground-color: white;\n\t\tborder-radius: 14px;\n\t\tpadding: 10px;\n\n\t\twidth: max-content;\n\t\tmin-width: 70px;\n\t\tmax-width: 220px;\n\t\ttext-align: center;\n\t\tdisplay: none;\n\t\tjustify-content: center;\n\t\talign-items: center;\n\t\tbox-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2);\n\t\t--bullet-x-position: 50%;\n\n\t\t&:after {\n\t\t\tcontent: \"\";\n\t\t\tdisplay: block;\n\t\t\tbackground-color: white;\n\t\t\tposition: absolute;\n\t\t\ttop: 100%;\n\t\t\tleft: var(--bullet-x-position);\n\t\t\twidth: 10px;\n\t\t\theight: 10px;\n\t\t\ttransform: translate(-50%, -50%) rotate(45deg);\n\t\t\tbox-shadow: 4px 4px 4px rgba(0, 0, 0, 0.04);\n\t\t\tz-index: 999;\n\t\t}\n\t\t// &__tooltip-container {\n\t\t// \t&__title {\n\t\t// \t\twidth: auto;\n\t\t// \t\tmin-width: 100px;\n\t\t// \t}\n\t\t// }\n\t}\n\t.homegrade-blocks-focus-point-bullet__tooltip-container:hover {\n\t\tdisplay: flex;\n\t}\n}\n\n//***** TOOLTIP\n\n.tooltip-title {\n\tfont-weight: bold;\n\tmargin-right: 6px;\n}\n"],"names":[],"sourceRoot":""}
|
||||
{"version":3,"file":"./style-index.css","mappings":";;;AAAA,gBAAgB;AAAhB;;;;;EAAA;AAQC;EACC;AAAF;AAKG;EACC;EACA;EACA;EACA;AAHJ;AAME;EACC;EACA;AAJH;AAMG;EACC;EACA;EACA;EACA;EACA;AAJJ;AAMG;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AAJJ;AASC;EACC;EACA;EACA;EACA;EACA;AAPF;AASE;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AAPH;AAWC;EACC;EACA;EACA;AATF;AAWE;EAEC;AAVH;AAaC;EACC;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EAEA;EAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AAbF;AAeE;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AAbH;AAsBC;EACC;AApBF;;AA0BA;EACC;EACA;AAvBD,C","sources":["webpack://multiblocks/./src/style.scss"],"sourcesContent":["/**\n * The following styles get applied both on the front of your site\n * and in the editor.\n *\n * Replace them with your own styles or remove the file completely.\n */\n\n.homegrade-blocks-focused-schema {\n\tfigure {\n\t\tposition: relative;\n\t}\n\n\tfigcaption {\n\t\t.legend + .description {\n\t\t\t&:before {\n\t\t\t\tcontent: \"—\";\n\t\t\t\tmargin: 0 5px;\n\t\t\t\tdisplay: inline-block;\n\t\t\t\tmargin-bottom: 10px;\n\t\t\t}\n\t\t}\n\t\tol {\n\t\t\tpadding-top: 20px;\n\t\t\tcounter-reset: myOrderedListItemsCounter;\n\n\t\t\tli {\n\t\t\t\tline-height: 1.3;\n\t\t\t\tlist-style-type: none;\n\t\t\t\tposition: relative;\n\t\t\t\tpadding: 8px;\n\t\t\t\tpadding-left: 50px;\n\t\t\t}\n\t\t\tli:before {\n\t\t\t\tcontent: \"\";\n\t\t\t\tleft: 0;\n\t\t\t\ttop: 0;\n\t\t\t\ttransform: translateY(3px);\n\t\t\t\tposition: absolute;\n\t\t\t\twidth: 30px;\n\t\t\t\theight: 30px;\n\t\t\t\tdisplay: flex;\n\t\t\t\tjustify-content: center;\n\t\t\t\talign-items: center;\n\t\t\t\tbackground-color: red;\n\t\t\t\tcolor: white;\n\t\t\t\tborder-radius: 50%;\n\t\t\t\tcounter-increment: myOrderedListItemsCounter;\n\t\t\t\tcontent: counter(myOrderedListItemsCounter);\n\t\t\t\tmargin-right: 0.5em;\n\t\t\t\tfont-weight: 700;\n\t\t\t}\n\t\t}\n\t}\n\n\t.homegrade-blocks-focus-point-bullet {\n\t\tposition: absolute !important;\n\t\tborder-radius: 50%;\n\t\ttransition: scale 0.2s ease-in-out;\n\t\tz-index: 1;\n\t\ttransform: translateX(-50%);\n\n\t\t&__index {\n\t\t\tfont-weight: 700;\n\t\t\twidth: 20px;\n\t\t\theight: 20px;\n\t\t\ttop: 0;\n\t\t\tleft: 0;\n\t\t\tposition: relative;\n\t\t\tcolor: white;\n\t\t\tdisplay: flex;\n\t\t\tjustify-content: center;\n\t\t\talign-items: center;\n\t\t\tpadding: 16px;\n\t\t}\n\t}\n\n\t.homegrade-blocks-focus-point-bullet:hover {\n\t\tscale: 1.2;\n\t\tfilter: brightness(1.2) hue-rotate(10deg);\n\t\tz-index: 1;\n\n\t\t& + .homegrade-blocks-focus-point-bullet__tooltip-container {\n\t\t\t// background-color: red;\n\t\t\tdisplay: flex;\n\t\t}\n\t}\n\t.homegrade-blocks-focus-point-bullet__tooltip-container {\n\t\tz-index: 999;\n\t\tposition: absolute;\n\t\tleft: calc(44%);\n\t\ttop: 25%;\n\t\ttransform: translate(-50%, calc(-100%));\n\n\t\tbackground-color: white;\n\t\tborder-radius: 14px;\n\t\tpadding: 10px;\n\n\t\twidth: max-content;\n\t\tmin-width: 70px;\n\t\tmax-width: 220px;\n\t\ttext-align: center;\n\t\tdisplay: none;\n\t\tjustify-content: center;\n\t\talign-items: center;\n\t\tbox-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2);\n\t\t--bullet-x-position: 50%;\n\n\t\t&:after {\n\t\t\tcontent: \"\";\n\t\t\tdisplay: block;\n\t\t\tbackground-color: white;\n\t\t\tposition: absolute;\n\t\t\ttop: 100%;\n\t\t\tleft: var(--bullet-x-position);\n\t\t\twidth: 10px;\n\t\t\theight: 10px;\n\t\t\ttransform: translate(-50%, -50%) rotate(45deg);\n\t\t\tbox-shadow: 4px 4px 4px rgba(0, 0, 0, 0.04);\n\t\t\tz-index: 999;\n\t\t}\n\t\t// &__tooltip-container {\n\t\t// \t&__title {\n\t\t// \t\twidth: auto;\n\t\t// \t\tmin-width: 100px;\n\t\t// \t}\n\t\t// }\n\t}\n\t.homegrade-blocks-focus-point-bullet__tooltip-container:hover {\n\t\tdisplay: flex;\n\t}\n}\n\n//***** TOOLTIP\n\n.tooltip-title {\n\tfont-weight: bold;\n\tmargin-right: 6px;\n}\n"],"names":[],"sourceRoot":""}
|
||||
|
|
@ -1,33 +0,0 @@
|
|||
window.addEventListener("DOMContentLoaded", (event) => {
|
||||
// alert("Hello from frontend.js");
|
||||
const focusBulletPoints = document.querySelectorAll(
|
||||
".homegrade-blocks-focus-point-bullet",
|
||||
);
|
||||
focusBulletPoints.forEach((focusPoint) => {
|
||||
const focusPointsContainer = focusPoint.parentElement;
|
||||
|
||||
focusPoint.addEventListener("mouseover", (event) => {
|
||||
const aleradyHoveredFocusPoint = document.querySelector("[data-hovered]");
|
||||
|
||||
const focusTitle = focusPoint.getAttribute("data-focus-bullet-title");
|
||||
|
||||
const focusPointPopupContainer = document.createElement("div");
|
||||
focusPointPopupContainer.className = "focus-point-popup-container";
|
||||
|
||||
const focusPointPopupTitle = document.createElement("h4");
|
||||
focusPointPopupTitle.textContent = focusTitle;
|
||||
focusPointPopupTitle.className = "focus-point-popup-container__title";
|
||||
|
||||
focusPointPopupContainer.appendChild(focusPointPopupTitle);
|
||||
focusPoint.appendChild(focusPointPopupContainer);
|
||||
focusPoint.setAttribute("data-hovered", "");
|
||||
});
|
||||
|
||||
focusPoint.addEventListener("mouseout", function () {
|
||||
const focusPointPopupContainer = focusPoint.querySelector(
|
||||
".focus-point-popup-container",
|
||||
);
|
||||
focusPointPopupContainer.remove();
|
||||
});
|
||||
});
|
||||
});
|
||||
|
|
@ -21,12 +21,32 @@
|
|||
"attribute": "alt",
|
||||
"default": ""
|
||||
},
|
||||
"showDescription": {
|
||||
"type": "boolean",
|
||||
"default": false
|
||||
},
|
||||
"showLegend": {
|
||||
"type": "boolean",
|
||||
"default": false
|
||||
},
|
||||
"coverUrl": {
|
||||
"type": "string",
|
||||
"source": "attribute",
|
||||
"selector": "img",
|
||||
"attribute": "src"
|
||||
},
|
||||
"coverDescription": {
|
||||
"type": "string",
|
||||
"source": "attribute",
|
||||
"selector": "img",
|
||||
"attribute": "data-description"
|
||||
},
|
||||
"coverLegend": {
|
||||
"type": "string",
|
||||
"source": "attribute",
|
||||
"selector": "img",
|
||||
"attribute": "data-legend"
|
||||
},
|
||||
"focusBullets": {
|
||||
"type": "array",
|
||||
"default": []
|
||||
|
|
|
|||
|
|
@ -7,6 +7,7 @@ import { useEffect, useState } from "@wordpress/element";
|
|||
import { createBlock } from "@wordpress/blocks";
|
||||
|
||||
import {
|
||||
InnerBlocks,
|
||||
useBlockProps,
|
||||
MediaPlaceholder,
|
||||
BlockControls,
|
||||
|
|
@ -14,15 +15,17 @@ import {
|
|||
InspectorControls,
|
||||
} from "@wordpress/block-editor";
|
||||
import {
|
||||
ToggleControl,
|
||||
ToolbarButton,
|
||||
Spinner,
|
||||
withNotices,
|
||||
Button,
|
||||
PanelBody,
|
||||
Tip,
|
||||
} from "@wordpress/components";
|
||||
import { InnerBlocks } from "@wordpress/block-editor";
|
||||
|
||||
import { isBlobURL, revokeBlobURL } from "@wordpress/blob";
|
||||
import { cover, handle, trash } from "@wordpress/icons";
|
||||
|
||||
function Edit({
|
||||
attributes,
|
||||
|
|
@ -33,7 +36,17 @@ function Edit({
|
|||
clientId,
|
||||
...props
|
||||
}) {
|
||||
const { coverUrl, coverId, coverAlt, focusBullets } = attributes;
|
||||
const {
|
||||
coverUrl,
|
||||
coverId,
|
||||
coverAlt,
|
||||
showLegend,
|
||||
coverLegend,
|
||||
showDescription,
|
||||
coverDescription,
|
||||
focusBullets,
|
||||
} = attributes;
|
||||
console.log(coverLegend);
|
||||
const [blobUrl, setBlobUrl] = useState();
|
||||
const currentBlockDatas = useSelect((select) => {
|
||||
return select("core/block-editor").getBlocksByClientId(clientId)[0];
|
||||
|
|
@ -41,7 +54,7 @@ function Edit({
|
|||
|
||||
let children = useSelect(
|
||||
(select) =>
|
||||
select("core/block-editor").getBlocksByClientId(clientId)[0].innerBlocks
|
||||
select("core/block-editor").getBlocksByClientId(clientId)[0].innerBlocks,
|
||||
);
|
||||
|
||||
function onUploadError(message) {
|
||||
|
|
@ -53,15 +66,19 @@ function Edit({
|
|||
setAttributes({
|
||||
coverUrl: undefined,
|
||||
coverId: undefined,
|
||||
coverDescription: "",
|
||||
coverLegend: "",
|
||||
coverAlt: "",
|
||||
});
|
||||
}
|
||||
|
||||
function updateImage(image) {
|
||||
function updateCover(image) {
|
||||
if (!image || !image.url) {
|
||||
setAttributes({
|
||||
coverUrl: undefined,
|
||||
coverId: undefined,
|
||||
coverDescription: "",
|
||||
coverLegend: "",
|
||||
coverAlt: "",
|
||||
});
|
||||
return;
|
||||
|
|
@ -70,6 +87,8 @@ function Edit({
|
|||
coverUrl: image.url,
|
||||
coverId: image.id,
|
||||
coverAlt: image.alt,
|
||||
coverDescription: image.description,
|
||||
coverLegend: image.caption,
|
||||
});
|
||||
}
|
||||
|
||||
|
|
@ -117,11 +136,18 @@ function Edit({
|
|||
if (currentBlockDatas && currentBlockDatas.innerBlocks) {
|
||||
console.log(currentBlockDatas.innerBlocks[index].clientId);
|
||||
dispatch("core/block-editor").selectBlock(
|
||||
currentBlockDatas.innerBlocks[index].clientId
|
||||
currentBlockDatas.innerBlocks[index].clientId,
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
function handleShowDescription() {
|
||||
setAttributes({ showDescription: !showDescription });
|
||||
}
|
||||
function handleShowLegend() {
|
||||
setAttributes({ showLegend: !showLegend });
|
||||
}
|
||||
|
||||
const renderedFocusPointBullets = focusBullets.map((focusBullet, index) => {
|
||||
return (
|
||||
<div
|
||||
|
|
@ -170,7 +196,7 @@ function Edit({
|
|||
return (
|
||||
<>
|
||||
<InspectorControls>
|
||||
<PanelBody>
|
||||
<PanelBody title="Points de légende">
|
||||
<Button
|
||||
variant="primary"
|
||||
onClick={() => {
|
||||
|
|
@ -180,36 +206,61 @@ function Edit({
|
|||
Ajouter un point Légende
|
||||
</Button>
|
||||
</PanelBody>
|
||||
</InspectorControls>
|
||||
<BlockControls>
|
||||
{coverUrl && (
|
||||
<>
|
||||
<PanelBody
|
||||
title="Source de l'image / Schéma"
|
||||
className="homegrade-blocks-components-image__panel-body "
|
||||
>
|
||||
{coverUrl && <img src={coverUrl} alt={coverAlt} />}
|
||||
<div className="media-replace-container">
|
||||
<MediaReplaceFlow
|
||||
group="inline"
|
||||
name="Remplacer l'image"
|
||||
disableMediaButtons={coverUrl}
|
||||
icon="trash"
|
||||
onSelect={updateImage}
|
||||
onError={onUploadError}
|
||||
accept="image/*" // On upload Allow only images
|
||||
allowedTypes={["image"]} // Onlibrary Allow only images
|
||||
notices={noticeUI} // En cas d'erreur d'upload
|
||||
mediaId={coverId}
|
||||
mediaURL={coverUrl}
|
||||
className="media-button-replacer"
|
||||
mediaUrl={coverUrl}
|
||||
allowedTypes={["image"]}
|
||||
accept="image/*"
|
||||
onSelect={updateCover}
|
||||
name={
|
||||
!coverUrl
|
||||
? __("Ajouter", "homegrade-blocks__texte-backoffice")
|
||||
: __("Remplacer", "homegrade-blocks__texte-backoffice")
|
||||
}
|
||||
/>
|
||||
<ToolbarButton
|
||||
icon={"trash"}
|
||||
title="Supprimer l'image"
|
||||
onClick={removeCoverImg}
|
||||
/>
|
||||
</>
|
||||
)}
|
||||
</BlockControls>
|
||||
{coverUrl && (
|
||||
<div>
|
||||
<Button
|
||||
className="custom-flow-button"
|
||||
variant="primary"
|
||||
icon={trash}
|
||||
label="Supprimer"
|
||||
onClick={removeCoverImg}
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</PanelBody>
|
||||
|
||||
<PanelBody
|
||||
title="Paramètres"
|
||||
className="homegrade-blocks-components-image__panel-body "
|
||||
>
|
||||
<ToggleControl
|
||||
label="Afficher la description"
|
||||
checked={showDescription}
|
||||
onChange={handleShowDescription}
|
||||
help="Coché, la description sera ajouté sous l'image"
|
||||
/>
|
||||
<ToggleControl
|
||||
label="Afficher la légende"
|
||||
checked={showLegend}
|
||||
onChange={handleShowLegend}
|
||||
help="Coché, la légende (caption) sera ajouté sous l'image"
|
||||
/>
|
||||
</PanelBody>
|
||||
</InspectorControls>
|
||||
|
||||
<MediaPlaceholder
|
||||
disableMediaButtons={coverUrl}
|
||||
icon="admin-appearance"
|
||||
onSelect={updateImage}
|
||||
onSelect={updateCover}
|
||||
onError={onUploadError}
|
||||
accept="image/*" // On upload Allow only images
|
||||
allowedTypes={["image"]} // Onlibrary Allow only images
|
||||
|
|
@ -226,13 +277,26 @@ function Edit({
|
|||
isBlobURL(coverUrl) ? "is-loading" : ""
|
||||
}`}
|
||||
>
|
||||
<img src={coverUrl} alt={coverAlt} />
|
||||
<img
|
||||
src={coverUrl}
|
||||
alt={coverAlt}
|
||||
data-description={coverDescription}
|
||||
data-legend={coverLegend}
|
||||
/>
|
||||
{renderedFocusPointBullets}
|
||||
{isBlobURL(coverUrl) && <Spinner />}
|
||||
</figure>
|
||||
)}
|
||||
|
||||
<figcaption>
|
||||
<p className="description-legend">
|
||||
{showLegend && coverLegend && (
|
||||
<span className="legend">{coverLegend}</span>
|
||||
)}
|
||||
{showDescription && coverDescription && (
|
||||
<span className="description">{coverDescription}</span>
|
||||
)}
|
||||
</p>
|
||||
<ol>
|
||||
<InnerBlocks
|
||||
allowedBlocks={["homegrade-content-blocks/focus-point"]}
|
||||
|
|
|
|||
|
|
@ -25,6 +25,20 @@ export default function Edit({
|
|||
} = attributes;
|
||||
|
||||
function handleChangeFocusPosition(focusPosition) {
|
||||
console.log(focusPosition);
|
||||
if (focusPosition.x < 0.05) {
|
||||
focusPosition.x = 0.05;
|
||||
}
|
||||
if (focusPosition.x > 0.95) {
|
||||
focusPosition.x = 0.95;
|
||||
}
|
||||
|
||||
if (focusPosition.y < 0.02) {
|
||||
focusPosition.y = 0.02;
|
||||
}
|
||||
if (focusPosition.y > 0.98) {
|
||||
focusPosition.y = 0.98;
|
||||
}
|
||||
setAttributes({ focusPosition });
|
||||
}
|
||||
function handleChangeTitle(focusTitle) {
|
||||
|
|
|
|||
|
|
@ -1,13 +0,0 @@
|
|||
<?php
|
||||
// $relatedPostId = $attributes['relatedPostId'] ?? null;
|
||||
// write_log($attributes);
|
||||
$blocks = parse_blocks($content);
|
||||
|
||||
// echo '<pre>';
|
||||
// print_r($attributes);
|
||||
// print_r($blocks[0]);
|
||||
// echo '</pre>';
|
||||
?>
|
||||
|
||||
<h2>Salut</h2>
|
||||
<?php echo $content ?>
|
||||
|
|
@ -8,7 +8,16 @@ import {
|
|||
import { InnerBlocks } from "@wordpress/block-editor";
|
||||
|
||||
export default function save({ attributes }) {
|
||||
const { coverUrl, coverId, coverAlt, focusBullets } = attributes;
|
||||
const {
|
||||
coverUrl,
|
||||
coverId,
|
||||
coverAlt,
|
||||
showDescription,
|
||||
coverDescription,
|
||||
showLegend,
|
||||
coverLegend,
|
||||
focusBullets,
|
||||
} = attributes;
|
||||
const renderedFocusPointBullets = focusBullets.map((focusBullet, index) => {
|
||||
return (
|
||||
<div
|
||||
|
|
@ -40,11 +49,22 @@ export default function save({ attributes }) {
|
|||
src={coverUrl}
|
||||
alt={coverAlt}
|
||||
className={`wp-image-${coverId}`}
|
||||
data-description={coverDescription}
|
||||
data-legend={coverLegend}
|
||||
/>
|
||||
{renderedFocusPointBullets}
|
||||
</figure>
|
||||
)}
|
||||
<figcaption>
|
||||
<p className="description-legend">
|
||||
{showLegend && coverLegend && (
|
||||
<span className="legend">{coverLegend}</span>
|
||||
)}
|
||||
{showDescription && coverDescription && (
|
||||
<span className="description">{coverDescription}</span>
|
||||
)}
|
||||
</p>
|
||||
|
||||
<ol>
|
||||
<InnerBlocks.Content />
|
||||
</ol>
|
||||
|
|
|
|||
|
|
@ -11,6 +11,14 @@
|
|||
}
|
||||
|
||||
figcaption {
|
||||
.legend + .description {
|
||||
&:before {
|
||||
content: "—";
|
||||
margin: 0 5px;
|
||||
display: inline-block;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
}
|
||||
ol {
|
||||
padding-top: 20px;
|
||||
counter-reset: myOrderedListItemsCounter;
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user