Antoine/lhoist-stay-safe__backend-theme
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

working on block

Browse Source
This commit is contained in:
Antoine M 2024-02-13 19:13:51 +01:00
parent 70650d7c55
commit 4e388d6a3a
31 changed files with 16626 additions and 4824 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
blocks/search-and-find/build/block.json
View File

@ -9,14 +9,32 @@
"foreground": "#299BD4",
"src": "table-row-delete"
},
"description": "Example block scaffolded with Create Block tool.",
"example": {},
"supports": {
"html": false
"html": false,
"reusable": false,
"multiple": false
},
"textdomain": "todo-list",
"attributes": {
"coverId": {
"type": "number"
},
"coverAlt": {
"type": "string",
"source": "attribute",
"selector": "img",
"attribute": "alt",
"default": ""
},
"coverUrl": {
"type": "string"
},
"focusBullets": {
"type": "array",
"default": []
}
},
"textdomain": "homegrade-theme__bloks-texte-fonctionnel",
"editorScript": "file:./index.js",
"editorStyle": "file:./index.css",
"style": "file:./style-index.css",
"viewScript": "file:./view.js"
"style": "file:./style-index.css"
}

54
blocks/search-and-find/build/focus-object/block.json Normal file
View File

@ -0,0 +1,54 @@
{
"$schema": "https://schemas.wp.org/trunk/block.json",
"apiVersion": 2,
"name": "lhoist-content-blocks/focus-object",
"version": "0.1.0",
"title": "Object Clickable",
"category": "lhoist-content-blocks",
"description": "Block pour insérer un objet dans le search and find",
"supports": {
"html": false
},
"textdomain": "focus-object",
"editorScript": "file:./index.js",
"editorStyle": "file:./index.css",
"style": "file:./style-index.css",
"attributes": {
"objectPictureUrl": {
"type": "string",
"default": ""
},
"objectPictureId": {
"type": "number"
},
"objectPictureAlt": {
"type": "string",
"default": ""
},
"behaviourType": {
"type": "string"
},
"focusTitle": {
"type": "string",
"default": "Légende Sans titre"
},
"objectBehaviourDescription": {
"type": "string"
},
"focusIndex": {
"type": "number",
"default": 0
},
"objectScale": {
"type": "number",
"default": 20
},
"objectPosition": {
"type": "object",
"default": {
"x": 0.5,
"y": 0.5
}
}
}
}

1
blocks/search-and-find/build/focus-object/index.asset.php Normal file
View File

@ -0,0 +1 @@
<?php return array('dependencies' => array('react', 'wp-block-editor', 'wp-blocks', 'wp-components', 'wp-element', 'wp-i18n', 'wp-primitives'), 'version' => 'cf77ee822bf6010cfa16');

4
blocks/search-and-find/build/focus-object/index.css Normal file
View File

@ -0,0 +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-object/editor.scss ***!
\*****************************************************************************************************************************************************************************************************************************************************/

573
blocks/search-and-find/build/focus-object/index.js Normal file
View File

@ -0,0 +1,573 @@
/******/ (() => { // webpackBootstrap
/******/ "use strict";
/******/ var __webpack_modules__ = ({
/***/ "./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 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_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,react__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,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
fillRule: "evenodd",
clipRule: "evenodd",
d: "M12 5.5A2.25 2.25 0 0 0 9.878 7h4.244A2.251 2.251 0 0 0 12 5.5ZM12 4a3.751 3.751 0 0 0-3.675 3H5v1.5h1.27l.818 8.997a2.75 2.75 0 0 0 2.739 2.501h4.347a2.75 2.75 0 0 0 2.738-2.5L17.73 8.5H19V7h-3.325A3.751 3.751 0 0 0 12 4Zm4.224 4.5H7.776l.806 8.861a1.25 1.25 0 0 0 1.245 1.137h4.347a1.25 1.25 0 0 0 1.245-1.137l.805-8.861Z"
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (trash);
//# sourceMappingURL=trash.js.map
/***/ }),
/***/ "./src/focus-object/edit.js":
/*!**********************************!*\
!*** ./src/focus-object/edit.js ***!
\**********************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__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 _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 _editor_scss__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./editor.scss */ "./src/focus-object/editor.scss");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/trash.js");
function Edit({
attributes,
setAttributes,
clientId,
...props
}) {
const {
focusTitle,
objectScale,
objectPictureUrl,
objectPictureAlt,
objectPictureId,
behaviourType,
objectPosition,
objectBehaviourDescription,
coverUrl,
focusIndex
} = attributes;
function handleChangeobjectPosition(objectPosition) {
setAttributes({
objectPosition
});
}
function handleChangeTitle(focusTitle) {
setAttributes({
focusTitle: focusTitle
});
}
function handleChangeCaptionDescription(objectBehaviourDescription) {
setAttributes({
objectBehaviourDescription
});
}
function setBehaviourType(behaviourType) {
setAttributes({
behaviourType
});
}
function setObjectPicture(image) {
if (!image || !image.url) {
setAttributes({
objectPictureUrl: undefined,
objectPictureId: undefined,
objectPictureAlt: ''
});
return;
}
setAttributes({
objectPictureUrl: image.url,
objectPictureId: image.id,
objectPictureAlt: image.alt
});
}
function setScale(objectScale) {
setAttributes({
objectScale
});
}
console.log(behaviourType, clientId);
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_3__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.PanelBody, {
className: "focus-point-modification-pannel",
title: "Object de comportement clickable"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.TextControl, {
placeholder: "Ins\xE9rer le titre de votre point focus",
label: "Nom du comportement",
value: focusTitle !== 'Légende Sans titre' ? focusTitle : null,
placeholder: "Ins\xE9rer le titre de votre point focus",
onChange: value => {
handleChangeTitle(value);
}
}), objectPictureUrl && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", {
className: "object-preview-image",
src: objectPictureUrl,
alt: objectPictureAlt
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
className: "media-replace-container"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__.MediaReplaceFlow, {
mediaId: objectPictureId,
mediaUrl: objectPictureUrl,
allowedTypes: ['image'],
accept: "image/*",
onSelect: setObjectPicture,
name: !objectPictureUrl ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('Ajouter un objet', 'lhoist-blocks') : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('Remplacer', 'lhoist-blocks')
}), objectPictureUrl && (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_components__WEBPACK_IMPORTED_MODULE_4__.Button, {
className: "custom-flow-button",
icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_5__["default"],
label: "Supprimer",
onClick: setObjectPicture
})))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.FocalPointPicker, {
url: coverUrl !== null && coverUrl !== void 0 ? coverUrl : null,
dimensions: {
width: 400,
height: 50
},
value: objectPosition,
onChange: focalPoint => {
handleChangeobjectPosition(focalPoint);
}
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.RangeControl, {
label: "Scale",
value: objectScale,
onChange: setScale,
min: 1,
max: 100
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.RadioControl, {
label: "Type de comportement",
selected: behaviourType ? behaviourType : 'unsafe',
required: true,
options: [{
label: 'Comportement sécurisé ',
value: 'safe'
}, {
label: 'Comportement à risque',
value: 'unsafe'
}],
onChange: value => setBehaviourType(value)
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.TextareaControl, {
label: "Description du comportement",
value: objectBehaviourDescription,
rows: 3,
onChange: description => {
handleChangeCaptionDescription(description);
}
}))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", {
...(0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__.useBlockProps)({
className: `lhoist-blocks-focus-object`
}),
style: {
height: `${objectScale}%`,
top: `${objectPosition.y * 100}%`,
left: `${objectPosition.x * 100}%`
},
src: objectPictureUrl,
alt: objectPictureAlt,
draggable: "false",
ondragstart: "return false;"
}));
}
/***/ }),
/***/ "./src/focus-object/index.js":
/*!***********************************!*\
!*** ./src/focus-object/index.js ***!
\***********************************/
/***/ ((__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 _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-object/style.scss");
/* harmony import */ var _block_json__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./block.json */ "./src/focus-object/block.json");
/* harmony import */ var _edit__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./edit */ "./src/focus-object/edit.js");
/* harmony import */ var _save__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./save */ "./src/focus-object/save.js");
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.registerBlockType)(_block_json__WEBPACK_IMPORTED_MODULE_3__.name, {
title: _block_json__WEBPACK_IMPORTED_MODULE_3__.title,
icon: {
foreground: '#299BD4',
src: (0,_wordpress_element__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", {
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", {
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", {
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", {
cx: "256",
cy: "255.776",
r: "103.902"
})))
},
supports: _block_json__WEBPACK_IMPORTED_MODULE_3__.supports,
attributes: _block_json__WEBPACK_IMPORTED_MODULE_3__.attributes,
edit: _edit__WEBPACK_IMPORTED_MODULE_4__["default"],
save: _save__WEBPACK_IMPORTED_MODULE_5__["default"]
});
/***/ }),
/***/ "./src/focus-object/save.js":
/*!**********************************!*\
!*** ./src/focus-object/save.js ***!
\**********************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__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 _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__);
function save({
attributes
}) {
const {
objectScale,
objectPictureUrl,
objectPictureAlt,
objectPosition
} = attributes;
return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", {
..._wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__.useBlockProps.save({
className: `lhoist-blocks-focus-object`
}),
style: {
height: `${objectScale}%`,
top: `${objectPosition.y * 100}%`,
left: `${objectPosition.x * 100}%`
},
src: objectPictureUrl,
alt: objectPictureAlt,
draggable: "false",
ondragstart: "return false;"
});
}
/***/ }),
/***/ "./src/focus-object/editor.scss":
/*!**************************************!*\
!*** ./src/focus-object/editor.scss ***!
\**************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
// extracted by mini-css-extract-plugin
/***/ }),
/***/ "./src/focus-object/style.scss":
/*!*************************************!*\
!*** ./src/focus-object/style.scss ***!
\*************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
// extracted by mini-css-extract-plugin
/***/ }),
/***/ "react":
/*!************************!*\
!*** external "React" ***!
\************************/
/***/ ((module) => {
module.exports = window["React"];
/***/ }),
/***/ "@wordpress/block-editor":
/*!*************************************!*\
!*** external ["wp","blockEditor"] ***!
\*************************************/
/***/ ((module) => {
module.exports = window["wp"]["blockEditor"];
/***/ }),
/***/ "@wordpress/blocks":
/*!********************************!*\
!*** external ["wp","blocks"] ***!
\********************************/
/***/ ((module) => {
module.exports = window["wp"]["blocks"];
/***/ }),
/***/ "@wordpress/components":
/*!************************************!*\
!*** external ["wp","components"] ***!
\************************************/
/***/ ((module) => {
module.exports = window["wp"]["components"];
/***/ }),
/***/ "@wordpress/element":
/*!*********************************!*\
!*** external ["wp","element"] ***!
\*********************************/
/***/ ((module) => {
module.exports = window["wp"]["element"];
/***/ }),
/***/ "@wordpress/i18n":
/*!******************************!*\
!*** external ["wp","i18n"] ***!
\******************************/
/***/ ((module) => {
module.exports = window["wp"]["i18n"];
/***/ }),
/***/ "@wordpress/primitives":
/*!************************************!*\
!*** external ["wp","primitives"] ***!
\************************************/
/***/ ((module) => {
module.exports = window["wp"]["primitives"];
/***/ }),
/***/ "./src/focus-object/block.json":
/*!*************************************!*\
!*** ./src/focus-object/block.json ***!
\*************************************/
/***/ ((module) => {
module.exports = JSON.parse('{"$schema":"https://schemas.wp.org/trunk/block.json","apiVersion":2,"name":"lhoist-content-blocks/focus-object","version":"0.1.0","title":"Object Clickable","category":"lhoist-content-blocks","description":"Block pour insérer un objet dans le search and find","supports":{"html":false},"textdomain":"focus-object","editorScript":"file:./index.js","editorStyle":"file:./index.css","style":"file:./style-index.css","attributes":{"objectPictureUrl":{"type":"string","default":""},"objectPictureId":{"type":"number"},"objectPictureAlt":{"type":"string","default":""},"behaviourType":{"type":"string"},"focusTitle":{"type":"string","default":"Légende Sans titre"},"objectBehaviourDescription":{"type":"string"},"focusIndex":{"type":"number","default":0},"objectScale":{"type":"number","default":20},"objectPosition":{"type":"object","default":{"x":0.5,"y":0.5}}}}');
/***/ })
/******/ });
/************************************************************************/
/******/ // The module cache
/******/ var __webpack_module_cache__ = {};
/******/
/******/ // The require function
/******/ function __webpack_require__(moduleId) {
/******/ // Check if module is in cache
/******/ var cachedModule = __webpack_module_cache__[moduleId];
/******/ if (cachedModule !== undefined) {
/******/ return cachedModule.exports;
/******/ }
/******/ // Create a new module (and put it into the cache)
/******/ var module = __webpack_module_cache__[moduleId] = {
/******/ // no module.id needed
/******/ // no module.loaded needed
/******/ exports: {}
/******/ };
/******/
/******/ // Execute the module function
/******/ __webpack_modules__[moduleId](module, module.exports, __webpack_require__);
/******/
/******/ // Return the exports of the module
/******/ return module.exports;
/******/ }
/******/
/******/ // expose the modules object (__webpack_modules__)
/******/ __webpack_require__.m = __webpack_modules__;
/******/
/************************************************************************/
/******/ /* webpack/runtime/chunk loaded */
/******/ (() => {
/******/ var deferred = [];
/******/ __webpack_require__.O = (result, chunkIds, fn, priority) => {
/******/ if(chunkIds) {
/******/ priority = priority || 0;
/******/ for(var i = deferred.length; i > 0 && deferred[i - 1][2] > priority; i--) deferred[i] = deferred[i - 1];
/******/ deferred[i] = [chunkIds, fn, priority];
/******/ return;
/******/ }
/******/ 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 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])))) {
/******/ chunkIds.splice(j--, 1);
/******/ } else {
/******/ fulfilled = false;
/******/ if(priority < notFulfilled) notFulfilled = priority;
/******/ }
/******/ }
/******/ if(fulfilled) {
/******/ deferred.splice(i--, 1)
/******/ var r = fn();
/******/ if (r !== undefined) result = r;
/******/ }
/******/ }
/******/ return result;
/******/ };
/******/ })();
/******/
/******/ /* webpack/runtime/compat get default export */
/******/ (() => {
/******/ // getDefaultExport function for compatibility with non-harmony modules
/******/ __webpack_require__.n = (module) => {
/******/ var getter = module && module.__esModule ?
/******/ () => (module['default']) :
/******/ () => (module);
/******/ __webpack_require__.d(getter, { a: getter });
/******/ return getter;
/******/ };
/******/ })();
/******/
/******/ /* webpack/runtime/define property getters */
/******/ (() => {
/******/ // define getter functions for harmony exports
/******/ __webpack_require__.d = (exports, definition) => {
/******/ for(var key in definition) {
/******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
/******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
/******/ }
/******/ }
/******/ };
/******/ })();
/******/
/******/ /* webpack/runtime/hasOwnProperty shorthand */
/******/ (() => {
/******/ __webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
/******/ })();
/******/
/******/ /* webpack/runtime/make namespace object */
/******/ (() => {
/******/ // define __esModule on exports
/******/ __webpack_require__.r = (exports) => {
/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
/******/ }
/******/ Object.defineProperty(exports, '__esModule', { value: true });
/******/ };
/******/ })();
/******/
/******/ /* webpack/runtime/jsonp chunk loading */
/******/ (() => {
/******/ // no baseURI
/******/
/******/ // object to store loaded and loading chunks
/******/ // undefined = chunk not loaded, null = chunk preloaded/prefetched
/******/ // [resolve, reject, Promise] = chunk loading, 0 = chunk loaded
/******/ var installedChunks = {
/******/ "focus-object/index": 0,
/******/ "./style-index": 0
/******/ };
/******/
/******/ // no chunk on demand loading
/******/
/******/ // no prefetching
/******/
/******/ // no preloaded
/******/
/******/ // no HMR
/******/
/******/ // no HMR manifest
/******/
/******/ __webpack_require__.O.j = (chunkId) => (installedChunks[chunkId] === 0);
/******/
/******/ // install a JSONP callback for chunk loading
/******/ var webpackJsonpCallback = (parentChunkLoadingFunction, data) => {
/******/ var chunkIds = data[0];
/******/ var moreModules = data[1];
/******/ var runtime = data[2];
/******/ // add "moreModules" to the modules object,
/******/ // then flag all "chunkIds" as loaded and fire callback
/******/ var moduleId, chunkId, i = 0;
/******/ if(chunkIds.some((id) => (installedChunks[id] !== 0))) {
/******/ for(moduleId in moreModules) {
/******/ if(__webpack_require__.o(moreModules, moduleId)) {
/******/ __webpack_require__.m[moduleId] = moreModules[moduleId];
/******/ }
/******/ }
/******/ if(runtime) var result = runtime(__webpack_require__);
/******/ }
/******/ if(parentChunkLoadingFunction) parentChunkLoadingFunction(data);
/******/ for(;i < chunkIds.length; i++) {
/******/ chunkId = chunkIds[i];
/******/ if(__webpack_require__.o(installedChunks, chunkId) && installedChunks[chunkId]) {
/******/ installedChunks[chunkId][0]();
/******/ }
/******/ installedChunks[chunkId] = 0;
/******/ }
/******/ return __webpack_require__.O(result);
/******/ }
/******/
/******/ var chunkLoadingGlobal = self["webpackChunkmultiblocks"] = self["webpackChunkmultiblocks"] || [];
/******/ chunkLoadingGlobal.forEach(webpackJsonpCallback.bind(null, 0));
/******/ chunkLoadingGlobal.push = webpackJsonpCallback.bind(null, chunkLoadingGlobal.push.bind(chunkLoadingGlobal));
/******/ })();
/******/
/************************************************************************/
/******/
/******/ // startup
/******/ // Load entry module and return exports
/******/ // This entry module depends on other loaded chunks and execution need to be delayed
/******/ var __webpack_exports__ = __webpack_require__.O(undefined, ["./style-index"], () => (__webpack_require__("./src/focus-object/index.js")))
/******/ __webpack_exports__ = __webpack_require__.O(__webpack_exports__);
/******/
/******/ })()
;
//# sourceMappingURL=index.js.map

1
blocks/search-and-find/build/focus-object/index.js.map Normal file
View File

File diff suppressed because one or more lines are too long

2
blocks/search-and-find/build/index.asset.php
View File

@ -1 +1 @@
<?php return array('dependencies' => array('react', 'wp-block-editor', 'wp-blocks', 'wp-i18n'), 'version' => '538059d2f77b85840beb');
<?php return array('dependencies' => array('react', 'wp-blob', 'wp-block-editor', 'wp-blocks', 'wp-components', 'wp-data', 'wp-element', 'wp-i18n', 'wp-primitives'), 'version' => '827526b833aac8a953d1');

34
blocks/search-and-find/build/index.css
View File

@ -1,13 +1,33 @@
/*!****************************************************************************************************************************************************************************************************************************************!*\
!*** 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 ***!
\****************************************************************************************************************************************************************************************************************************************/
/**
* The following styles get applied inside the editor only.
*
* Replace them with your own styles or remove the file completely.
*/
.wp-block-create-block-todo-list {
border: 1px dotted #f00;
.lhoist-blocks-search-and-find .block-editor-inner-blocks,
.lhoist-blocks-search-and-find .block-editor-block-list__layout,
.lhoist-blocks-search-and-find .block-editor-block-list__block {
width: 100%;
height: 100%;
position: unset;
}
.lhoist-blocks-search-and-find .block-editor-block-list__block {
@apply bg-purple-400;
}
.lhoist-blocks-search-and-find .lhoist-blocks-focus-object {
@apply bg-blue-600;
}
.lhoist-blocks-search-and-find .editor-styles-wrapper .wp-block {
max-width: unset !important;
@apply bg-green-400;
}
.lhoist-blocks-search-and-find .lhoist-blocks-search-and-find__background_picture {
height: unset !important;
}
.lhoist-blocks-search-and-find .lhoist-blocks-search-and-find__objects-container {
background-color: red;
width: 100%;
}
/*!*****************************************************************************************************************************************************************************************************************************************************!*\
!*** 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-object/editor.scss ***!
\*****************************************************************************************************************************************************************************************************************************************************/
/*# sourceMappingURL=index.css.map*/

2
blocks/search-and-find/build/index.css.map
View File

@ -1 +1 @@
{"version":3,"file":"index.css","mappings":";;;AAAA;;;;EAAA;AAMA;EACC;AAAD,C","sources":["webpack://todo-list/./src/editor.scss"],"sourcesContent":["/**\n * The following styles get applied inside the editor only.\n *\n * Replace them with your own styles or remove the file completely.\n */\n\n.wp-block-create-block-todo-list {\n\tborder: 1px dotted #f00;\n}\n"],"names":[],"sourceRoot":""}
{"version":3,"file":"index.css","mappings":";;;AACC;;;EAGC;EACA;EACA;AAAF;AAEC;EACC;AAAF;AAEC;EACC;AAAF;AAGC;EACC;EACA;AADF;AAGC;EACC;AADF;AAGC;EACC;EACA;AADF,C","sources":["webpack://multiblocks/./src/editor.scss"],"sourcesContent":[".lhoist-blocks-search-and-find {\n\t.block-editor-inner-blocks,\n\t.block-editor-block-list__layout,\n\t.block-editor-block-list__block {\n\t\twidth: 100%;\n\t\theight: 100%;\n\t\tposition: unset;\n\t}\n\t.block-editor-block-list__block {\n\t\t@apply bg-purple-400;\n\t}\n\t.lhoist-blocks-focus-object {\n\t\t@apply bg-blue-600;\n\t}\n\n\t.editor-styles-wrapper .wp-block {\n\t\tmax-width: unset !important;\n\t\t@apply bg-green-400;\n\t}\n\t.lhoist-blocks-search-and-find__background_picture {\n\t\theight: unset !important;\n\t}\n\t.lhoist-blocks-search-and-find__objects-container {\n\t\tbackground-color: red;\n\t\twidth: 100%;\n\t}\n}\n// .lhoist-blocks-focus-object {\n// \t@apply hidden;\n// }\n"],"names":[],"sourceRoot":""}

640
blocks/search-and-find/build/index.js
View File

@ -2,31 +2,513 @@
/******/ "use strict";
/******/ var __webpack_modules__ = ({
/***/ "./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 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_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,react__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,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
fillRule: "evenodd",
clipRule: "evenodd",
d: "M12 5.5A2.25 2.25 0 0 0 9.878 7h4.244A2.251 2.251 0 0 0 12 5.5ZM12 4a3.751 3.751 0 0 0-3.675 3H5v1.5h1.27l.818 8.997a2.75 2.75 0 0 0 2.739 2.501h4.347a2.75 2.75 0 0 0 2.738-2.5L17.73 8.5H19V7h-3.325A3.751 3.751 0 0 0 12 4Zm4.224 4.5H7.776l.806 8.861a1.25 1.25 0 0 0 1.245 1.137h4.347a1.25 1.25 0 0 0 1.245-1.137l.805-8.861Z"
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (trash);
//# sourceMappingURL=trash.js.map
/***/ }),
/***/ "./src/edit.js":
/*!*********************!*\
!*** ./src/edit.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 _editor_scss__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./editor.scss */ "./src/editor.scss");
/* harmony import */ var _focus_object__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./focus-object */ "./src/focus-object/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__);
function Edit({
attributes,
setAttributes,
noticeOperations,
noticeList,
noticeUI,
clientId,
...props
}) {
const {
coverUrl,
coverId,
coverAlt,
focusBullets
} = attributes;
const [blobUrl, setBlobUrl] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)();
const currentBlockDatas = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_4__.useSelect)(select => {
return select('core/block-editor').getBlocksByClientId(clientId)[0];
});
let children = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_4__.useSelect)(select => select('core/block-editor').getBlocksByClientId(clientId)[0].innerBlocks);
function onUploadError(message) {
noticeOperations.removeAllNotices(); // Remove all previous notices
noticeOperations.createErrorNotice(message);
}
function removeCoverImg() {
setAttributes({
coverUrl: undefined,
coverId: undefined,
coverAlt: ''
});
}
function updateImage(image) {
if (!image || !image.url) {
setAttributes({
coverUrl: undefined,
coverId: undefined,
coverAlt: ''
});
return;
}
setAttributes({
coverUrl: image.url,
coverId: image.id,
coverAlt: image.alt
});
}
function passCoverUrlToChildren() {
if (children && coverUrl) {
children.forEach(function (child) {
(0,_wordpress_data__WEBPACK_IMPORTED_MODULE_4__.dispatch)('core/block-editor').updateBlockAttributes(child.clientId, {
coverUrl: coverUrl
});
});
}
}
function passIndexToChildren() {
if (children) {
children.forEach((child, index) => {
(0,_wordpress_data__WEBPACK_IMPORTED_MODULE_4__.dispatch)('core/block-editor').updateBlockAttributes(child.clientId, {
focusIndex: index + 1
});
});
}
}
function updateFocusPointBullets() {
if (children) {
const focusBullets = children.map((child, index) => {
return {
title: child.attributes.focusTitle,
x: child.attributes.objectPosition.x,
y: child.attributes.objectPosition.y
};
});
setAttributes({
focusBullets
});
}
}
function insertFocusObjectBlock() {
const index = children && children.length ? children.length : 0;
const newBlock = (0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_5__.createBlock)('lhoist-content-blocks/focus-object', {
behaviourType: 'safe',
objectScale: 10,
objectPosition: {
x: 0.22,
y: 0.82
},
objectPictureUrl: null,
objectPictureAlt: "Texte alternatif de l'image",
objectBehaviourDescription: "Description du comportement de l'objet"
});
(0,_wordpress_data__WEBPACK_IMPORTED_MODULE_4__.dispatch)('core/block-editor').insertBlocks(newBlock, index, clientId);
}
function handleBulletClick(index) {
if (currentBlockDatas && currentBlockDatas.innerBlocks) {
console.log(currentBlockDatas.innerBlocks[index].clientId);
(0,_wordpress_data__WEBPACK_IMPORTED_MODULE_4__.dispatch)('core/block-editor').selectBlock(currentBlockDatas.innerBlocks[index].clientId);
}
}
(0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
updateFocusPointBullets();
if (!coverId && (0,_wordpress_blob__WEBPACK_IMPORTED_MODULE_8__.isBlobURL)(coverUrl)) {
setAttributes({
coverUrl: undefined,
coverAlt: ''
});
}
}, []);
(0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
// Fonction de clean du BLOB URL qui se lance à chaque changement de coverUrl
if ((0,_wordpress_blob__WEBPACK_IMPORTED_MODULE_8__.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
setBlobUrl();
}
passCoverUrlToChildren();
}, [coverUrl]);
(0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
updateFocusPointBullets();
passCoverUrlToChildren();
}, [children]);
(0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.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, {
variant: "primary",
onClick: () => {
insertFocusObjectBlock();
}
}, "Ajouter un objet"))), (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: `lhoist-blocks-search-and-find alignfull`
})
}, coverUrl && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (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)("div", {
className: "lhoist-blocks-search-and-find__objects-container"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", {
className: "lhoist-blocks-search-and-find__background_picture",
src: coverUrl,
alt: coverAlt
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_6__.InnerBlocks, {
allowedBlocks: ['lhoist-content-blocks/focus-object']
})))));
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = ((0,_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.withNotices)(Edit));
/***/ }),
/***/ "./src/focus-object/edit.js":
/*!**********************************!*\
!*** ./src/focus-object/edit.js ***!
\**********************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ Edit)
/* harmony export */ });
/* 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_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_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");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _editor_scss__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./editor.scss */ "./src/editor.scss");
/* harmony import */ var _editor_scss__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./editor.scss */ "./src/focus-object/editor.scss");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/trash.js");
function Edit() {
return (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
...(0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_2__.useBlockProps)()
}, (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('Todo List – hello from the editor!', 'todo-list'));
function Edit({
attributes,
setAttributes,
clientId,
...props
}) {
const {
focusTitle,
objectScale,
objectPictureUrl,
objectPictureAlt,
objectPictureId,
behaviourType,
objectPosition,
objectBehaviourDescription,
coverUrl,
focusIndex
} = attributes;
function handleChangeobjectPosition(objectPosition) {
setAttributes({
objectPosition
});
}
function handleChangeTitle(focusTitle) {
setAttributes({
focusTitle: focusTitle
});
}
function handleChangeCaptionDescription(objectBehaviourDescription) {
setAttributes({
objectBehaviourDescription
});
}
function setBehaviourType(behaviourType) {
setAttributes({
behaviourType
});
}
function setObjectPicture(image) {
if (!image || !image.url) {
setAttributes({
objectPictureUrl: undefined,
objectPictureId: undefined,
objectPictureAlt: ''
});
return;
}
setAttributes({
objectPictureUrl: image.url,
objectPictureId: image.id,
objectPictureAlt: image.alt
});
}
function setScale(objectScale) {
setAttributes({
objectScale
});
}
console.log(behaviourType, clientId);
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_3__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.PanelBody, {
className: "focus-point-modification-pannel",
title: "Object de comportement clickable"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.TextControl, {
placeholder: "Ins\xE9rer le titre de votre point focus",
label: "Nom du comportement",
value: focusTitle !== 'Légende Sans titre' ? focusTitle : null,
placeholder: "Ins\xE9rer le titre de votre point focus",
onChange: value => {
handleChangeTitle(value);
}
}), objectPictureUrl && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", {
className: "object-preview-image",
src: objectPictureUrl,
alt: objectPictureAlt
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
className: "media-replace-container"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__.MediaReplaceFlow, {
mediaId: objectPictureId,
mediaUrl: objectPictureUrl,
allowedTypes: ['image'],
accept: "image/*",
onSelect: setObjectPicture,
name: !objectPictureUrl ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('Ajouter un objet', 'lhoist-blocks') : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('Remplacer', 'lhoist-blocks')
}), objectPictureUrl && (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_components__WEBPACK_IMPORTED_MODULE_4__.Button, {
className: "custom-flow-button",
icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_5__["default"],
label: "Supprimer",
onClick: setObjectPicture
})))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.FocalPointPicker, {
url: coverUrl !== null && coverUrl !== void 0 ? coverUrl : null,
dimensions: {
width: 400,
height: 50
},
value: objectPosition,
onChange: focalPoint => {
handleChangeobjectPosition(focalPoint);
}
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.RangeControl, {
label: "Scale",
value: objectScale,
onChange: setScale,
min: 1,
max: 100
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.RadioControl, {
label: "Type de comportement",
selected: behaviourType ? behaviourType : 'unsafe',
required: true,
options: [{
label: 'Comportement sécurisé ',
value: 'safe'
}, {
label: 'Comportement à risque',
value: 'unsafe'
}],
onChange: value => setBehaviourType(value)
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.TextareaControl, {
label: "Description du comportement",
value: objectBehaviourDescription,
rows: 3,
onChange: description => {
handleChangeCaptionDescription(description);
}
}))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", {
...(0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__.useBlockProps)({
className: `lhoist-blocks-focus-object`
}),
style: {
height: `${objectScale}%`,
top: `${objectPosition.y * 100}%`,
left: `${objectPosition.x * 100}%`
},
src: objectPictureUrl,
alt: objectPictureAlt,
draggable: "false",
ondragstart: "return false;"
}));
}
/***/ }),
/***/ "./src/focus-object/index.js":
/*!***********************************!*\
!*** ./src/focus-object/index.js ***!
\***********************************/
/***/ ((__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 _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-object/style.scss");
/* harmony import */ var _block_json__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./block.json */ "./src/focus-object/block.json");
/* harmony import */ var _edit__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./edit */ "./src/focus-object/edit.js");
/* harmony import */ var _save__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./save */ "./src/focus-object/save.js");
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.registerBlockType)(_block_json__WEBPACK_IMPORTED_MODULE_3__.name, {
title: _block_json__WEBPACK_IMPORTED_MODULE_3__.title,
icon: {
foreground: '#299BD4',
src: (0,_wordpress_element__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", {
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", {
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", {
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", {
cx: "256",
cy: "255.776",
r: "103.902"
})))
},
supports: _block_json__WEBPACK_IMPORTED_MODULE_3__.supports,
attributes: _block_json__WEBPACK_IMPORTED_MODULE_3__.attributes,
edit: _edit__WEBPACK_IMPORTED_MODULE_4__["default"],
save: _save__WEBPACK_IMPORTED_MODULE_5__["default"]
});
/***/ }),
/***/ "./src/focus-object/save.js":
/*!**********************************!*\
!*** ./src/focus-object/save.js ***!
\**********************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__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 _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__);
function save({
attributes
}) {
const {
objectScale,
objectPictureUrl,
objectPictureAlt,
objectPosition
} = attributes;
return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", {
..._wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__.useBlockProps.save({
className: `lhoist-blocks-focus-object`
}),
style: {
height: `${objectScale}%`,
top: `${objectPosition.y * 100}%`,
left: `${objectPosition.x * 100}%`
},
src: objectPictureUrl,
alt: objectPictureAlt,
draggable: "false",
ondragstart: "return false;"
});
}
/***/ }),
@ -66,16 +548,48 @@ __webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ save)
/* harmony export */ });
/* 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_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_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__);
function save() {
return (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
..._wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__.useBlockProps.save()
}, 'Todo List – hello from the saved content!');
function save({
attributes
}) {
const {
coverUrl,
coverId,
coverAlt,
focusBullets
} = attributes;
const renderedFocusObjects = focusBullets.map((focusBullet, index) => {
return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
"data-focus-bullet-title": focusBullet.title,
className: "lhoist-blocks-focus-object",
"aria-hidden": "true",
style: {
top: `${focusBullet.y * 100}%`,
left: `${focusBullet.x * 100}%`
},
"data-postion-x": focusBullet.x * 100,
"data-postion-y": focusBullet.y * 100
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
className: "lhoist-blocks-focus-object__index"
}, index + 1));
});
return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("section", {
..._wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__.useBlockProps.save({
className: `lhoist-blocks-search-and-find`
})
}, 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)("div", {
className: "lhoist-blocks-search-and-find__objects-container"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", {
className: "lhoist-blocks-search-and-find__background_picture",
src: coverUrl,
alt: coverAlt
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__.InnerBlocks.Content, null))));
}
/***/ }),
@ -90,6 +604,30 @@ __webpack_require__.r(__webpack_exports__);
// extracted by mini-css-extract-plugin
/***/ }),
/***/ "./src/focus-object/editor.scss":
/*!**************************************!*\
!*** ./src/focus-object/editor.scss ***!
\**************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
// extracted by mini-css-extract-plugin
/***/ }),
/***/ "./src/focus-object/style.scss":
/*!*************************************!*\
!*** ./src/focus-object/style.scss ***!
\*************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
// extracted by mini-css-extract-plugin
/***/ }),
/***/ "./src/style.scss":
@ -114,6 +652,16 @@ module.exports = window["React"];
/***/ }),
/***/ "@wordpress/blob":
/*!******************************!*\
!*** external ["wp","blob"] ***!
\******************************/
/***/ ((module) => {
module.exports = window["wp"]["blob"];
/***/ }),
/***/ "@wordpress/block-editor":
/*!*************************************!*\
!*** external ["wp","blockEditor"] ***!
@ -134,6 +682,36 @@ module.exports = window["wp"]["blocks"];
/***/ }),
/***/ "@wordpress/components":
/*!************************************!*\
!*** external ["wp","components"] ***!
\************************************/
/***/ ((module) => {
module.exports = window["wp"]["components"];
/***/ }),
/***/ "@wordpress/data":
/*!******************************!*\
!*** external ["wp","data"] ***!
\******************************/
/***/ ((module) => {
module.exports = window["wp"]["data"];
/***/ }),
/***/ "@wordpress/element":
/*!*********************************!*\
!*** external ["wp","element"] ***!
\*********************************/
/***/ ((module) => {
module.exports = window["wp"]["element"];
/***/ }),
/***/ "@wordpress/i18n":
/*!******************************!*\
!*** external ["wp","i18n"] ***!
@ -144,13 +722,33 @@ 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 = /*#__PURE__*/JSON.parse('{"$schema":"https://schemas.wp.org/trunk/block.json","apiVersion":3,"name":"lhoist-blocks/search-and-find","version":"0.1.0","title":"Search and Find","category":"lhoist-content-blocks","icon":{"foreground":"#299BD4","src":"table-row-delete"},"description":"Example block scaffolded with Create Block tool.","example":{},"supports":{"html":false},"textdomain":"todo-list","editorScript":"file:./index.js","editorStyle":"file:./index.css","style":"file:./style-index.css","viewScript":"file:./view.js"}');
module.exports = JSON.parse('{"$schema":"https://schemas.wp.org/trunk/block.json","apiVersion":3,"name":"lhoist-blocks/search-and-find","version":"0.1.0","title":"Search and Find","category":"lhoist-content-blocks","icon":{"foreground":"#299BD4","src":"table-row-delete"},"supports":{"html":false,"reusable":false,"multiple":false},"attributes":{"coverId":{"type":"number"},"coverAlt":{"type":"string","source":"attribute","selector":"img","attribute":"alt","default":""},"coverUrl":{"type":"string"},"focusBullets":{"type":"array","default":[]}},"textdomain":"homegrade-theme__bloks-texte-fonctionnel","editorScript":"file:./index.js","editorStyle":"file:./index.css","style":"file:./style-index.css"}');
/***/ }),
/***/ "./src/focus-object/block.json":
/*!*************************************!*\
!*** ./src/focus-object/block.json ***!
\*************************************/
/***/ ((module) => {
module.exports = JSON.parse('{"$schema":"https://schemas.wp.org/trunk/block.json","apiVersion":2,"name":"lhoist-content-blocks/focus-object","version":"0.1.0","title":"Object Clickable","category":"lhoist-content-blocks","description":"Block pour insérer un objet dans le search and find","supports":{"html":false},"textdomain":"focus-object","editorScript":"file:./index.js","editorStyle":"file:./index.css","style":"file:./style-index.css","attributes":{"objectPictureUrl":{"type":"string","default":""},"objectPictureId":{"type":"number"},"objectPictureAlt":{"type":"string","default":""},"behaviourType":{"type":"string"},"focusTitle":{"type":"string","default":"Légende Sans titre"},"objectBehaviourDescription":{"type":"string"},"focusIndex":{"type":"number","default":0},"objectScale":{"type":"number","default":20},"objectPosition":{"type":"object","default":{"x":0.5,"y":0.5}}}}');
/***/ })
@ -196,7 +794,9 @@ module.exports = /*#__PURE__*/JSON.parse('{"$schema":"https://schemas.wp.org/tru
/******/ }
/******/ var notFulfilled = Infinity;
/******/ for (var i = 0; i < deferred.length; i++) {
/******/ var [chunkIds, fn, priority] = deferred[i];
/******/ var chunkIds = deferred[i][0];
/******/ var fn = deferred[i][1];
/******/ var priority = deferred[i][2];
/******/ 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])))) {
@ -282,7 +882,9 @@ module.exports = /*#__PURE__*/JSON.parse('{"$schema":"https://schemas.wp.org/tru
/******/
/******/ // install a JSONP callback for chunk loading
/******/ var webpackJsonpCallback = (parentChunkLoadingFunction, data) => {
/******/ var [chunkIds, moreModules, runtime] = data;
/******/ var chunkIds = data[0];
/******/ var moreModules = data[1];
/******/ var runtime = data[2];
/******/ // add "moreModules" to the modules object,
/******/ // then flag all "chunkIds" as loaded and fire callback
/******/ var moduleId, chunkId, i = 0;
@ -305,7 +907,7 @@ module.exports = /*#__PURE__*/JSON.parse('{"$schema":"https://schemas.wp.org/tru
/******/ return __webpack_require__.O(result);
/******/ }
/******/
/******/ var chunkLoadingGlobal = globalThis["webpackChunktodo_list"] = globalThis["webpackChunktodo_list"] || [];
/******/ var chunkLoadingGlobal = self["webpackChunkmultiblocks"] = self["webpackChunkmultiblocks"] || [];
/******/ chunkLoadingGlobal.forEach(webpackJsonpCallback.bind(null, 0));
/******/ chunkLoadingGlobal.push = webpackJsonpCallback.bind(null, chunkLoadingGlobal.push.bind(chunkLoadingGlobal));
/******/ })();

2
blocks/search-and-find/build/index.js.map
View File

File diff suppressed because one or more lines are too long

119
blocks/search-and-find/build/style-index.css
View File

@ -7,10 +7,121 @@
*
* Replace them with your own styles or remove the file completely.
*/
.wp-block-create-block-todo-list {
background-color: #21759b;
color: #fff;
padding: 2px;
.homegrade-blocks-focused-schema figure {
position: relative;
}
.homegrade-blocks-focused-schema figcaption ol {
padding-top: 20px;
counter-reset: myOrderedListItemsCounter;
}
.homegrade-blocks-focused-schema figcaption ol li {
line-height: 1.3;
list-style-type: none;
position: relative;
padding: 8px;
padding-left: 50px;
}
.homegrade-blocks-focused-schema figcaption ol li:before {
content: "";
left: 0;
top: 0;
transform: translateY(3px);
position: absolute;
width: 30px;
height: 30px;
display: flex;
justify-content: center;
align-items: center;
background-color: red;
color: white;
border-radius: 50%;
counter-increment: myOrderedListItemsCounter;
content: counter(myOrderedListItemsCounter);
margin-right: 0.5em;
font-weight: 700;
}
.homegrade-blocks-focused-schema .homegrade-blocks-focus-point-bullet {
position: absolute !important;
border-radius: 50%;
transition: scale 0.2s ease-in-out;
z-index: 1;
transform: translateX(-50%);
}
.homegrade-blocks-focused-schema .homegrade-blocks-focus-point-bullet__index {
font-weight: 700;
width: 20px;
height: 20px;
top: 0;
left: 0;
position: relative;
color: white;
display: flex;
justify-content: center;
align-items: center;
padding: 16px;
}
.homegrade-blocks-focused-schema .homegrade-blocks-focus-point-bullet:hover {
scale: 1.2;
filter: brightness(1.2) hue-rotate(10deg);
z-index: 1;
}
.homegrade-blocks-focused-schema .homegrade-blocks-focus-point-bullet:hover + .homegrade-blocks-focus-point-bullet__tooltip-container {
display: flex;
}
.homegrade-blocks-focused-schema .homegrade-blocks-focus-point-bullet__tooltip-container {
z-index: 999;
position: absolute;
left: 44%;
top: 25%;
transform: translate(-50%, -100%);
background-color: white;
border-radius: 14px;
padding: 10px;
width: -moz-max-content;
width: max-content;
min-width: 70px;
max-width: 220px;
text-align: center;
display: none;
justify-content: center;
align-items: center;
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2);
--bullet-x-position: 50%;
}
.homegrade-blocks-focused-schema .homegrade-blocks-focus-point-bullet__tooltip-container:after {
content: "";
display: block;
background-color: white;
position: absolute;
top: 100%;
left: var(--bullet-x-position);
width: 10px;
height: 10px;
transform: translate(-50%, -50%) rotate(45deg);
box-shadow: 4px 4px 4px rgba(0, 0, 0, 0.04);
z-index: 999;
}
.homegrade-blocks-focused-schema .homegrade-blocks-focus-point-bullet__tooltip-container:hover {
display: flex;
}
.tooltip-title {
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-object/style.scss ***!
\****************************************************************************************************************************************************************************************************************************************************/
.object-preview-image {
padding: 20px 0;
}
input[value=unsafe]:checked {
background-color: red !important;
}
input[value=safe]:checked {
background-color: green !important;
}
/*# sourceMappingURL=style-index.css.map*/

2
blocks/search-and-find/build/style-index.css.map
View File

@ -1 +1 @@
{"version":3,"file":"./style-index.css","mappings":";;;AAAA;;;;;EAAA;AAOA;EACC;EACA;EACA;AAAD,C","sources":["webpack://todo-list/./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.wp-block-create-block-todo-list {\n\tbackground-color: #21759b;\n\tcolor: #fff;\n\tpadding: 2px;\n}\n"],"names":[],"sourceRoot":""}
{"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;;;;AC1GA;EACC;AACD;;AAEA;EACC;AACD;;AAEA;EACC;AACD,C","sources":["webpack://multiblocks/./src/style.scss","webpack://multiblocks/./src/focus-object/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",".object-preview-image {\r\n\tpadding: 20px 0;\r\n}\r\n\r\ninput[value='unsafe']:checked {\r\n\tbackground-color: red !important;\r\n}\r\n\r\ninput[value='safe']:checked {\r\n\tbackground-color: green !important;\r\n}\r\n"],"names":[],"sourceRoot":""}

1
blocks/search-and-find/build/view.asset.php
View File

@ -1 +0,0 @@
<?php return array('dependencies' => array(), 'version' => '28f7e461eb9ab869c079');

33
blocks/search-and-find/build/view.js
View File

@ -1,33 +0,0 @@
/******/ (() => { // webpackBootstrap
var __webpack_exports__ = {};
/*!*********************!*\
!*** ./src/view.js ***!
\*********************/
/**
* Use this file for JavaScript code that you want to run in the front-end
* on posts/pages that contain this block.
*
* When this file is defined as the value of the `viewScript` property
* in `block.json` it will be enqueued on the front end of the site.
*
* Example:
*
* ```js
* {
* "viewScript": "file:./view.js"
* }
* ```
*
* If you're not making any changes to this file because your project doesn't need any
* JavaScript running in the front-end, then you should delete this file and remove
* the `viewScript` property from `block.json`.
*
* @see https://developer.wordpress.org/block-editor/reference-guides/block-api/block-metadata/#view-script
*/
/* eslint-disable no-console */
console.log('Hello World! (from create-block-todo-list block)');
/* eslint-enable no-console */
/******/ })()
;
//# sourceMappingURL=view.js.map

1
blocks/search-and-find/build/view.js.map
View File

@ -1 +0,0 @@
{"version":3,"file":"view.js","mappings":";;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACAA,OAAO,CAACC,GAAG,CAAE,kDAAmD,CAAC;AACjE,8B","sources":["webpack://todo-list/./src/view.js"],"sourcesContent":["/**\n * Use this file for JavaScript code that you want to run in the front-end\n * on posts/pages that contain this block.\n *\n * When this file is defined as the value of the `viewScript` property\n * in `block.json` it will be enqueued on the front end of the site.\n *\n * Example:\n *\n * ```js\n * {\n * \"viewScript\": \"file:./view.js\"\n * }\n * ```\n *\n * If you're not making any changes to this file because your project doesn't need any\n * JavaScript running in the front-end, then you should delete this file and remove\n * the `viewScript` property from `block.json`.\n *\n * @see https://developer.wordpress.org/block-editor/reference-guides/block-api/block-metadata/#view-script\n */\n\n/* eslint-disable no-console */\nconsole.log( 'Hello World! (from create-block-todo-list block)' );\n/* eslint-enable no-console */\n"],"names":["console","log"],"sourceRoot":""}

19062
blocks/search-and-find/package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

11
blocks/search-and-find/package.json
View File

@ -1,10 +1,14 @@
{
"name": "todo-list",
"name": "multiblocks",
"version": "0.1.0",
"description": "Example block scaffolded with Create Block tool.",
"author": "The WordPress Contributors",
"license": "GPL-2.0-or-later",
"main": "build/index.js",
"entry": {
"index": "./src/index.js",
"frontend": "./src/frontend.js"
},
"scripts": {
"build": "wp-scripts build",
"format": "wp-scripts format",
@ -15,6 +19,9 @@
"start": "wp-scripts start"
},
"devDependencies": {
"@wordpress/scripts": "^27.1.0"
"@wordpress/scripts": "^26.9.0"
},
"dependencies": {
"@wordpress/icons": "^9.41.0"
}
}

32
blocks/search-and-find/src/block.json
View File

@ -7,16 +7,34 @@
"category": "lhoist-content-blocks",
"icon": {
"foreground": "#299BD4",
"src": "table-row-delete",
"src": "table-row-delete"
},
"description": "Example block scaffolded with Create Block tool.",
"example": {},
"supports": {
"html": false
"html": false,
"reusable": false,
"multiple": false
},
"textdomain": "todo-list",
"attributes": {
"coverId": {
"type": "number"
},
"coverAlt": {
"type": "string",
"source": "attribute",
"selector": "img",
"attribute": "alt",
"default": ""
},
"coverUrl": {
"type": "string"
},
"focusBullets": {
"type": "array",
"default": []
}
},
"textdomain": "homegrade-theme__bloks-texte-fonctionnel",
"editorScript": "file:./index.js",
"editorStyle": "file:./index.css",
"style": "file:./style-index.css",
"viewScript": "file:./view.js"
"style": "file:./style-index.css"
}

267
blocks/search-and-find/src/edit.js
View File

@ -1,14 +1,263 @@
import { __ } from '@wordpress/i18n';
import { useBlockProps } from '@wordpress/block-editor';
import './editor.scss';
export default function Edit() {
import './focus-object';
import { __ } from '@wordpress/i18n';
import {
useSelect,
dispatch,
select,
} from '@wordpress/data';
import { useEffect, useState } from '@wordpress/element';
import { createBlock } from '@wordpress/blocks';
import {
useBlockProps,
MediaPlaceholder,
BlockControls,
MediaReplaceFlow,
InspectorControls,
} from '@wordpress/block-editor';
import {
ToolbarButton,
Spinner,
withNotices,
Button,
PanelBody,
} from '@wordpress/components';
import { InnerBlocks } from '@wordpress/block-editor';
import { isBlobURL, revokeBlobURL } from '@wordpress/blob';
function Edit({
attributes,
setAttributes,
noticeOperations,
noticeList,
noticeUI,
clientId,
...props
}) {
const { coverUrl, coverId, coverAlt, focusBullets } =
attributes;
const [blobUrl, setBlobUrl] = useState();
const currentBlockDatas = useSelect((select) => {
return select('core/block-editor').getBlocksByClientId(
clientId
)[0];
});
let children = useSelect(
(select) =>
select('core/block-editor').getBlocksByClientId(
clientId
)[0].innerBlocks
);
function onUploadError(message) {
noticeOperations.removeAllNotices(); // Remove all previous notices
noticeOperations.createErrorNotice(message);
}
function removeCoverImg() {
setAttributes({
coverUrl: undefined,
coverId: undefined,
coverAlt: '',
});
}
function updateImage(image) {
if (!image || !image.url) {
setAttributes({
coverUrl: undefined,
coverId: undefined,
coverAlt: '',
});
return;
}
setAttributes({
coverUrl: image.url,
coverId: image.id,
coverAlt: image.alt,
});
}
function passCoverUrlToChildren() {
if (children && coverUrl) {
children.forEach(function (child) {
dispatch('core/block-editor').updateBlockAttributes(
child.clientId,
{
coverUrl: coverUrl,
}
);
});
}
}
function passIndexToChildren() {
if (children) {
children.forEach((child, index) => {
dispatch('core/block-editor').updateBlockAttributes(
child.clientId,
{
focusIndex: index + 1,
}
);
});
}
}
function updateFocusPointBullets() {
if (children) {
const focusBullets = children.map((child, index) => {
return {
title: child.attributes.focusTitle,
x: child.attributes.objectPosition.x,
y: child.attributes.objectPosition.y,
};
});
setAttributes({ focusBullets });
}
}
function insertFocusObjectBlock() {
const index =
children && children.length ? children.length : 0;
const newBlock = createBlock(
'lhoist-content-blocks/focus-object',
{
behaviourType: 'safe',
objectScale: 10,
objectPosition: { x: 0.22, y: 0.82 },
objectPictureUrl: null,
objectPictureAlt: "Texte alternatif de l'image",
objectBehaviourDescription:
"Description du comportement de l'objet",
}
);
dispatch('core/block-editor').insertBlocks(
newBlock,
index,
clientId
);
}
function handleBulletClick(index) {
if (
currentBlockDatas &&
currentBlockDatas.innerBlocks
) {
console.log(
currentBlockDatas.innerBlocks[index].clientId
);
dispatch('core/block-editor').selectBlock(
currentBlockDatas.innerBlocks[index].clientId
);
}
}
useEffect(() => {
updateFocusPointBullets();
if (!coverId && isBlobURL(coverUrl)) {
setAttributes({ coverUrl: undefined, coverAlt: '' });
}
}, []);
useEffect(() => {
// Fonction de clean du BLOB URL qui se lance à chaque changement de coverUrl
if (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
revokeBlobURL(blobUrl); // On utilise la valeur stocké dans le state pour revoke l'url
setBlobUrl();
}
passCoverUrlToChildren();
}, [coverUrl]);
useEffect(() => {
updateFocusPointBullets();
passCoverUrlToChildren();
}, [children]);
useEffect(() => {
passIndexToChildren();
}, [currentBlockDatas]);
return (
<p {...useBlockProps()}>
{__(
'Todo List – hello from the editor!',
'todo-list',
<>
<InspectorControls>
<PanelBody>
<Button
variant="primary"
onClick={() => {
insertFocusObjectBlock();
}}
>
Ajouter un objet
</Button>
</PanelBody>
</InspectorControls>
<BlockControls>
{coverUrl && (
<>
<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"
/>
<ToolbarButton
icon={'trash'}
title="Supprimer l'image"
onClick={removeCoverImg}
/>
</>
)}
</p>
</BlockControls>
<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
/>
<section
{...useBlockProps({
className: `lhoist-blocks-search-and-find alignfull`,
})}
>
{coverUrl && (
<>
{isBlobURL(coverUrl) && <Spinner />}
<div className="lhoist-blocks-search-and-find__objects-container">
<img
className="lhoist-blocks-search-and-find__background_picture"
src={coverUrl}
alt={coverAlt}
/>
<InnerBlocks
allowedBlocks={[
'lhoist-content-blocks/focus-object',
]}
/>
</div>
</>
)}
</section>
</>
);
}
export default withNotices(Edit);

35
blocks/search-and-find/src/editor.scss
View File

@ -1,9 +1,30 @@
/**
* The following styles get applied inside the editor only.
*
* Replace them with your own styles or remove the file completely.
*/
.lhoist-blocks-search-and-find {
.block-editor-inner-blocks,
.block-editor-block-list__layout,
.block-editor-block-list__block {
width: 100%;
height: 100%;
position: unset;
}
.block-editor-block-list__block {
@apply bg-purple-400;
}
.lhoist-blocks-focus-object {
@apply bg-blue-600;
}
.wp-block-create-block-todo-list {
border: 1px dotted #f00;
.editor-styles-wrapper .wp-block {
max-width: unset !important;
@apply bg-green-400;
}
.lhoist-blocks-search-and-find__background_picture {
height: unset !important;
}
.lhoist-blocks-search-and-find__objects-container {
background-color: red;
width: 100%;
}
}
// .lhoist-blocks-focus-object {
// @apply hidden;
// }

54
blocks/search-and-find/src/focus-object/block.json Normal file
View File

@ -0,0 +1,54 @@
{
"$schema": "https://schemas.wp.org/trunk/block.json",
"apiVersion": 2,
"name": "lhoist-content-blocks/focus-object",
"version": "0.1.0",
"title": "Object Clickable",
"category": "lhoist-content-blocks",
"description": "Block pour insérer un objet dans le search and find",
"supports": {
"html": false
},
"textdomain": "focus-object",
"editorScript": "file:./index.js",
"editorStyle": "file:./index.css",
"style": "file:./style-index.css",
"attributes": {
"objectPictureUrl": {
"type": "string",
"default": ""
},
"objectPictureId": {
"type": "number"
},
"objectPictureAlt": {
"type": "string",
"default": ""
},
"behaviourType": {
"type": "string"
},
"focusTitle": {
"type": "string",
"default": "Légende Sans titre"
},
"objectBehaviourDescription": {
"type": "string"
},
"focusIndex": {
"type": "number",
"default": 0
},
"objectScale": {
"type": "number",
"default": 20
},
"objectPosition": {
"type": "object",
"default": {
"x": 0.5,
"y": 0.5
}
}
}
}

200
blocks/search-and-find/src/focus-object/edit.js Normal file
View File

@ -0,0 +1,200 @@
import { __ } from '@wordpress/i18n';
import './editor.scss';
import {
useBlockProps,
InspectorControls,
MediaReplaceFlow,
RichText,
} from '@wordpress/block-editor';
import {
PanelBody,
FocalPointPicker,
TextControl,
TextareaControl,
RadioControl,
Button,
RangeControl,
} from '@wordpress/components';
import { trash } from '@wordpress/icons';
export default function Edit({
attributes,
setAttributes,
clientId,
...props
}) {
const {
focusTitle,
objectScale,
objectPictureUrl,
objectPictureAlt,
objectPictureId,
behaviourType,
objectPosition,
objectBehaviourDescription,
coverUrl,
focusIndex,
} = attributes;
function handleChangeobjectPosition(objectPosition) {
setAttributes({ objectPosition });
}
function handleChangeTitle(focusTitle) {
setAttributes({ focusTitle: focusTitle });
}
function handleChangeCaptionDescription(
objectBehaviourDescription
) {
setAttributes({ objectBehaviourDescription });
}
function setBehaviourType(behaviourType) {
setAttributes({ behaviourType });
}
function setObjectPicture(image) {
if (!image || !image.url) {
setAttributes({
objectPictureUrl: undefined,
objectPictureId: undefined,
objectPictureAlt: '',
});
return;
}
setAttributes({
objectPictureUrl: image.url,
objectPictureId: image.id,
objectPictureAlt: image.alt,
});
}
function setScale(objectScale) {
setAttributes({ objectScale });
}
console.log(behaviourType, clientId);
return (
<>
<InspectorControls>
<PanelBody
className="focus-point-modification-pannel"
title="Object de comportement clickable"
>
{/* <div className="lhoist-content-blocks-object-bullet">
{focusIndex}
</div> */}
<TextControl
placeholder="Insérer le titre de votre point focus"
label="Nom du comportement"
value={
focusTitle !== 'Légende Sans titre'
? focusTitle
: null
}
placeholder="Insérer le titre de votre point focus"
onChange={(value) => {
handleChangeTitle(value);
}}
/>
{objectPictureUrl && (
<img
className="object-preview-image"
src={objectPictureUrl}
alt={objectPictureAlt}
/>
)}
<>
<div className="media-replace-container">
<MediaReplaceFlow
mediaId={objectPictureId}
mediaUrl={objectPictureUrl}
allowedTypes={['image']}
accept="image/*"
onSelect={setObjectPicture}
name={
!objectPictureUrl
? __(
'Ajouter un objet',
'lhoist-blocks'
)
: __('Remplacer', 'lhoist-blocks')
}
/>
{objectPictureUrl && (
<>
<Button
className="custom-flow-button"
icon={trash}
label="Supprimer"
onClick={setObjectPicture}
/>
</>
)}
</div>
</>
<FocalPointPicker
url={coverUrl ?? null}
dimensions={{
width: 400,
height: 50,
}}
value={objectPosition}
onChange={(focalPoint) => {
handleChangeobjectPosition(focalPoint);
}}
/>
<RangeControl
label="Scale"
value={objectScale}
onChange={setScale}
min={1}
max={100}
/>
<RadioControl
label="Type de comportement"
selected={
behaviourType ? behaviourType : 'unsafe'
}
required
options={[
{
label: 'Comportement sécurisé ',
value: 'safe',
},
{
label: 'Comportement à risque',
value: 'unsafe',
},
]}
onChange={(value) => setBehaviourType(value)}
/>
<TextareaControl
label="Description du comportement"
value={objectBehaviourDescription}
rows={3}
onChange={(description) => {
handleChangeCaptionDescription(description);
}}
/>
</PanelBody>
</InspectorControls>
<img
{...useBlockProps({
className: `lhoist-blocks-focus-object`,
})}
style={{
height: `${objectScale}%`,
top: `${objectPosition.y * 100}%`,
left: `${objectPosition.x * 100}%`,
}}
src={objectPictureUrl}
alt={objectPictureAlt}
draggable="false"
ondragstart="return false;"
/>
</>
);
}

0
blocks/search-and-find/src/focus-object/editor.scss Normal file
View File

36
blocks/search-and-find/src/focus-object/index.js Normal file
View File

@ -0,0 +1,36 @@
import { registerBlockType } from '@wordpress/blocks';
import './style.scss';
import metadata from './block.json';
import Edit from './edit';
import Save from './save';
registerBlockType(metadata.name, {
title: metadata.title,
icon: {
foreground: '#299BD4',
src: (
<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"
>
<g>
<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" />
<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" />
<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" />
<circle cx="256" cy="255.776" r="103.902" />
</g>
</svg>
),
},
supports: metadata.supports,
attributes: metadata.attributes,
edit: Edit,
save: Save,
});

30
blocks/search-and-find/src/focus-object/save.js Normal file
View File

@ -0,0 +1,30 @@
import {
useBlockProps,
RichText,
InnerBlocks,
} from '@wordpress/block-editor';
export default function save({ attributes }) {
const {
objectScale,
objectPictureUrl,
objectPictureAlt,
objectPosition,
} = attributes;
return (
<img
{...useBlockProps.save({
className: `lhoist-blocks-focus-object`,
})}
style={{
height: `${objectScale}%`,
top: `${objectPosition.y * 100}%`,
left: `${objectPosition.x * 100}%`,
}}
src={objectPictureUrl}
alt={objectPictureAlt}
draggable="false"
ondragstart="return false;"
/>
);
}

11
blocks/search-and-find/src/focus-object/style.scss Normal file
View File

@ -0,0 +1,11 @@
.object-preview-image {
padding: 20px 0;
}
input[value='unsafe']:checked {
background-color: red !important;
}
input[value='safe']:checked {
background-color: green !important;
}

13
blocks/search-and-find/src/render.php Normal file
View File

@ -0,0 +1,13 @@
<?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 ?>

47
blocks/search-and-find/src/save.js
View File

@ -1,9 +1,48 @@
import { useBlockProps } from '@wordpress/block-editor';
import { InnerBlocks } from '@wordpress/block-editor';
export default function save() {
export default function save({ attributes }) {
const { coverUrl, coverId, coverAlt, focusBullets } =
attributes;
const renderedFocusObjects = focusBullets.map(
(focusBullet, index) => {
return (
<p {...useBlockProps.save()}>
{'Todo List – hello from the saved content!'}
</p>
<div
data-focus-bullet-title={focusBullet.title}
className="lhoist-blocks-focus-object"
aria-hidden="true"
style={{
top: `${focusBullet.y * 100}%`,
left: `${focusBullet.x * 100}%`,
}}
data-postion-x={focusBullet.x * 100}
data-postion-y={focusBullet.y * 100}
>
<span className="lhoist-blocks-focus-object__index">
{index + 1}
</span>
</div>
);
}
);
return (
<section
{...useBlockProps.save({
className: `lhoist-blocks-search-and-find`,
})}
>
{coverUrl && (
<>
<div className="lhoist-blocks-search-and-find__objects-container">
<img
className="lhoist-blocks-search-and-find__background_picture"
src={coverUrl}
alt={coverAlt}
/>
<InnerBlocks.Content />
</div>
</>
)}
</section>
);
}

126
blocks/search-and-find/src/style.scss
View File

@ -5,8 +5,126 @@
* Replace them with your own styles or remove the file completely.
*/
.wp-block-create-block-todo-list {
background-color: #21759b;
color: #fff;
padding: 2px;
.homegrade-blocks-focused-schema {
figure {
position: relative;
}
figcaption {
ol {
padding-top: 20px;
counter-reset: myOrderedListItemsCounter;
li {
line-height: 1.3;
list-style-type: none;
position: relative;
padding: 8px;
padding-left: 50px;
}
li:before {
content: "";
left: 0;
top: 0;
transform: translateY(3px);
position: absolute;
width: 30px;
height: 30px;
display: flex;
justify-content: center;
align-items: center;
background-color: red;
color: white;
border-radius: 50%;
counter-increment: myOrderedListItemsCounter;
content: counter(myOrderedListItemsCounter);
margin-right: 0.5em;
font-weight: 700;
}
}
}
.homegrade-blocks-focus-point-bullet {
position: absolute !important;
border-radius: 50%;
transition: scale 0.2s ease-in-out;
z-index: 1;
transform: translateX(-50%);
&__index {
font-weight: 700;
width: 20px;
height: 20px;
top: 0;
left: 0;
position: relative;
color: white;
display: flex;
justify-content: center;
align-items: center;
padding: 16px;
}
}
.homegrade-blocks-focus-point-bullet:hover {
scale: 1.2;
filter: brightness(1.2) hue-rotate(10deg);
z-index: 1;
& + .homegrade-blocks-focus-point-bullet__tooltip-container {
// background-color: red;
display: flex;
}
}
.homegrade-blocks-focus-point-bullet__tooltip-container {
z-index: 999;
position: absolute;
left: calc(44%);
top: 25%;
transform: translate(-50%, calc(-100%));
background-color: white;
border-radius: 14px;
padding: 10px;
width: max-content;
min-width: 70px;
max-width: 220px;
text-align: center;
display: none;
justify-content: center;
align-items: center;
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2);
--bullet-x-position: 50%;
&:after {
content: "";
display: block;
background-color: white;
position: absolute;
top: 100%;
left: var(--bullet-x-position);
width: 10px;
height: 10px;
transform: translate(-50%, -50%) rotate(45deg);
box-shadow: 4px 4px 4px rgba(0, 0, 0, 0.04);
z-index: 999;
}
// &__tooltip-container {
// &__title {
// width: auto;
// min-width: 100px;
// }
// }
}
.homegrade-blocks-focus-point-bullet__tooltip-container:hover {
display: flex;
}
}
//***** TOOLTIP
.tooltip-title {
font-weight: bold;
margin-right: 6px;
}

25
blocks/search-and-find/src/view.js
View File

@ -1,25 +0,0 @@
/**
* Use this file for JavaScript code that you want to run in the front-end
* on posts/pages that contain this block.
*
* When this file is defined as the value of the `viewScript` property
* in `block.json` it will be enqueued on the front end of the site.
*
* Example:
*
* ```js
* {
* "viewScript": "file:./view.js"
* }
* ```
*
* If you're not making any changes to this file because your project doesn't need any
* JavaScript running in the front-end, then you should delete this file and remove
* the `viewScript` property from `block.json`.
*
* @see https://developer.wordpress.org/block-editor/reference-guides/block-api/block-metadata/#view-script
*/
/* eslint-disable no-console */
console.log( 'Hello World! (from create-block-todo-list block)' );
/* eslint-enable no-console */