Antoine/homegrade_blocks_production
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactoring and cleaning blocks

Browse Source
This commit is contained in:
Antoine M 2023-08-31 17:22:46 +02:00
parent 14071448dc
commit 4c8f206c59
47 changed files with 491 additions and 679 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
blocks/content-heading/build/index.asset.php
View File

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

13
blocks/content-heading/build/index.js
View File

@ -49,14 +49,6 @@ function Edit({
onClick: () => {
onChangeHeadingLevel("h3");
}
// label={
// !isActive
// ? "Ajouter un lien brochure"
// : "Supprimer le lien brochure"
// }
// onClick={() =>
// !isActive ? setIsPopoverOpen(!isPopoverOpen) : removeFormat()
// }
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_3__.ToolbarButton, {
isActive: headingLevel === "h4",
icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_6__["default"],
@ -70,7 +62,6 @@ function Edit({
onChangeHeadingLevel("h5");
}
}))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_2__.RichText, {
className: "wp-block-homegrade-content-blocks-content-heading",
onChange: value => setAttributes({
title: value
}),
@ -152,9 +143,7 @@ function save({
} = attributes;
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_1__.RichText.Content, {
tagName: headingLevel,
value: title
// className="homegrade-blocks-custom-heading"
,
value: title,
..._wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__.useBlockProps.save({
className: `homegrade-blocks-custom-heading`
})

2
blocks/content-heading/build/index.js.map
View File

File diff suppressed because one or more lines are too long

34
blocks/content-heading/src/edit.js
View File

@ -2,32 +2,11 @@ import { __ } from "@wordpress/i18n";
import {
useBlockProps,
HeadingLevelDropdown,
InnerBlocks,
RichText,
InspectorControls,
AlignmentToolbar,
BlockControls,
PanelColorSettings,
ContrastChecker,
} from "@wordpress/block-editor";
import {
ToolbarGroup,
ToolbarButton,
PanelBody,
ToggleControl,
TextControl,
ColorPalette,
ColorPicker,
} from "@wordpress/components";
import {
check,
trash,
headingLevel3,
headingLevel4,
headingLevel5,
heading,
} from "@wordpress/icons";
import { ToolbarGroup, ToolbarButton } from "@wordpress/components";
import { headingLevel3, headingLevel4, headingLevel5 } from "@wordpress/icons";
import "./editor.scss";
@ -48,14 +27,6 @@ export default function Edit({ attributes, setAttributes }) {
onClick={() => {
onChangeHeadingLevel("h3");
}}
// label={
// !isActive
// ? "Ajouter un lien brochure"
// : "Supprimer le lien brochure"
// }
// onClick={() =>
// !isActive ? setIsPopoverOpen(!isPopoverOpen) : removeFormat()
// }
/>
<ToolbarButton
isActive={headingLevel === "h4"}
@ -75,7 +46,6 @@ export default function Edit({ attributes, setAttributes }) {
</BlockControls>
<RichText
className="wp-block-homegrade-content-blocks-content-heading"
onChange={(value) => setAttributes({ title: value })}
value={title}
placeholder={__(

3
blocks/content-heading/src/save.js
View File

@ -1,4 +1,4 @@
import { useBlockProps, RichText, InnerBlocks } from "@wordpress/block-editor";
import { useBlockProps, RichText } from "@wordpress/block-editor";
export default function save({ attributes }) {
const { title, headingLevel } = attributes;
@ -8,7 +8,6 @@ export default function save({ attributes }) {
<RichText.Content
tagName={headingLevel}
value={title}
// className="homegrade-blocks-custom-heading"
{...useBlockProps.save({
className: `homegrade-blocks-custom-heading`,
})}

2
blocks/picture-banner/build/index.asset.php
View File

@ -1 +1 @@
<?php return array('dependencies' => array('wp-blob', 'wp-block-editor', 'wp-blocks', 'wp-components', 'wp-element', 'wp-i18n'), 'version' => '5d8a90ca5c5919d18241');
<?php return array('dependencies' => array('wp-blob', 'wp-block-editor', 'wp-blocks', 'wp-components', 'wp-element', 'wp-i18n'), 'version' => 'f073dc5f029a71961853');

75
blocks/picture-banner/build/index.js
View File

@ -46,18 +46,18 @@ function Edit({
imagePosition
} = attributes;
const [blobUrl, setBlobUrl] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)();
const onUploadError = message => {
noticeOperations.removeAllNotices(); // Remove all previous notices
function onUploadError(message) {
noticeOperations.removeAllNotices();
noticeOperations.createErrorNotice(message);
};
const removeCoverImg = () => {
}
function removeCoverImg() {
setAttributes({
coverUrl: undefined,
coverId: undefined,
coverAlt: ""
});
};
const updateImage = image => {
}
function updateCoverImage(image) {
if (!image || !image.url) {
setAttributes({
coverUrl: undefined,
@ -71,7 +71,9 @@ function Edit({
coverId: image.id,
coverAlt: image.alt
});
};
}
// Si l'upload s'est mal passé -> reset
(0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
if (!coverId && (0,_wordpress_blob__WEBPACK_IMPORTED_MODULE_5__.isBlobURL)(coverUrl)) {
setAttributes({
@ -80,6 +82,8 @@ function Edit({
});
}
}, []);
// Gestion de l'url temporaire
(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_5__.isBlobURL)(coverUrl)) {
@ -101,8 +105,6 @@ function Edit({
},
value: imagePosition,
onChange: focalPoint => {
// console.log("focalPoint");
// console.log(focalPoint);
setAttributes({
imagePosition: focalPoint
});
@ -126,7 +128,7 @@ function Edit({
name: "Remplacer l'image",
disableMediaButtons: coverUrl,
icon: "trash",
onSelect: updateImage,
onSelect: updateCoverImage,
onError: onUploadError,
accept: "image/*" // On upload Allow only images
,
@ -140,11 +142,11 @@ function Edit({
icon: "trash",
title: "Supprimer l'image",
onClick: removeCoverImg
}))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("section", {
...(0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_2__.useBlockProps)()
}, coverUrl && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
className: `picture-container ${(0,_wordpress_blob__WEBPACK_IMPORTED_MODULE_5__.isBlobURL)(coverUrl) ? "is-loading" : ""} ${heightFixed ? "fixed-height" : ""} `
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", {
}))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
...(0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_2__.useBlockProps)({
className: `homegrade-content-blocks-picture-banner ${(0,_wordpress_blob__WEBPACK_IMPORTED_MODULE_5__.isBlobURL)(coverUrl) ? "is-loading" : ""} ${heightFixed ? "fixed-height" : ""} `
})
}, 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)("img", {
src: coverUrl,
alt: coverAlt,
style: {
@ -153,7 +155,7 @@ function Edit({
}), (0,_wordpress_blob__WEBPACK_IMPORTED_MODULE_5__.isBlobURL)(coverUrl) && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_3__.Spinner, null)), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_2__.MediaPlaceholder, {
disableMediaButtons: coverUrl,
icon: "admin-appearance",
onSelect: updateImage,
onSelect: updateCoverImage,
onError: onUploadError,
accept: "image/*" // On upload Allow only images
,
@ -180,42 +182,13 @@ __webpack_require__.r(__webpack_exports__);
/* harmony import */ var _edit__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./edit */ "./src/edit.js");
/* harmony import */ var _save__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./save */ "./src/save.js");
/* harmony import */ var _block_json__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./block.json */ "./src/block.json");
/**
* Registers a new block provided a unique name and an object defining its behavior.
*
* @see https://developer.wordpress.org/block-editor/reference-guides/block-api/block-registration/
*/
/**
* Lets webpack process CSS, SASS or SCSS files referenced in JavaScript files.
* All files containing `style` keyword are bundled together. The code used
* gets applied both to the front of your site and to the editor.
*
* @see https://www.npmjs.com/package/@wordpress/scripts#using-css
*/
/**
* Internal dependencies
*/
/**
* Every block starts by registering a new block type definition.
*
* @see https://developer.wordpress.org/block-editor/reference-guides/block-api/block-registration/
*/
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_0__.registerBlockType)(_block_json__WEBPACK_IMPORTED_MODULE_4__.name, {
/**
* @see ./edit.js
*/
edit: _edit__WEBPACK_IMPORTED_MODULE_2__["default"],
/**
* @see ./save.js
*/
save: _save__WEBPACK_IMPORTED_MODULE_3__["default"]
});
@ -247,20 +220,18 @@ function save({
heightFixed,
imagePosition
} = attributes;
return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("section", {
return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
..._wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__.useBlockProps.save({
className: `homegrade-content-blocks-picture-banner`
className: `homegrade-content-blocks-picture-banner ${heightFixed ? "fixed-height" : ""}`
})
}, coverUrl && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
className: `picture-container ${heightFixed ? "fixed-height" : ""}`
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", {
}, coverUrl && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", {
src: coverUrl,
alt: coverAlt,
style: {
objectPosition: `${imagePosition.x * 100}% ${imagePosition.y * 100}%`
},
className: `wp-image-${coverId}`
})));
}));
}
/***/ }),

2
blocks/picture-banner/build/index.js.map
View File

File diff suppressed because one or more lines are too long

4
blocks/picture-banner/build/style-index.css
View File

@ -9,12 +9,10 @@
*/
.wp-block-homegrade-content-blocks-picture-banner {
margin-bottom: 20px;
}
.wp-block-homegrade-content-blocks-picture-banner .picture-container {
overflow: hidden;
border-radius: 22px;
}
.wp-block-homegrade-content-blocks-picture-banner .picture-container.fixed-height img {
.wp-block-homegrade-content-blocks-picture-banner.fixed-height img {
width: 100%;
height: 200px;
-o-object-fit: cover;

2
blocks/picture-banner/build/style-index.css.map
View File

@ -1 +1 @@
{"version":3,"file":"./style-index.css","mappings":";;;AAAA;;;;;EAAA;AAOA;EACC;AAAD;AACC;EACC;EACA;AACF;AACG;EACC;EACA;EACA;KAAA;EACA;KAAA;AACJ,C","sources":["webpack://multiblocks/./src/style.scss"],"sourcesContent":["/**\n * The following styles get applied both on the front of your site\n * and in the editor.\n *\n * Replace them with your own styles or remove the file completely.\n */\n\n.wp-block-homegrade-content-blocks-picture-banner {\n\tmargin-bottom: 20px;\n\t.picture-container {\n\t\toverflow: hidden;\n\t\tborder-radius: 22px;\n\t\t&.fixed-height {\n\t\t\timg {\n\t\t\t\twidth: 100%;\n\t\t\t\theight: 200px;\n\t\t\t\tobject-fit: cover;\n\t\t\t\tobject-position: center;\n\t\t\t}\n\t\t}\n\t}\n}\n"],"names":[],"sourceRoot":""}
{"version":3,"file":"./style-index.css","mappings":";;;AAAA;;;;;EAAA;AAOA;EACC;EACA;EACA;AAAD;AAEE;EACC;EACA;EACA;KAAA;EACA;KAAA;AAAH,C","sources":["webpack://multiblocks/./src/style.scss"],"sourcesContent":["/**\n * The following styles get applied both on the front of your site\n * and in the editor.\n *\n * Replace them with your own styles or remove the file completely.\n */\n\n.wp-block-homegrade-content-blocks-picture-banner {\n\tmargin-bottom: 20px;\n\toverflow: hidden;\n\tborder-radius: 22px;\n\t&.fixed-height {\n\t\timg {\n\t\t\twidth: 100%;\n\t\t\theight: 200px;\n\t\t\tobject-fit: cover;\n\t\t\tobject-position: center;\n\t\t}\n\t}\n}\n"],"names":[],"sourceRoot":""}

40
blocks/picture-banner/src/edit.js
View File

@ -10,7 +10,6 @@ import {
import {
ToolbarGroup,
ToolbarButton,
ToolbarDropdownMenu,
Spinner,
withNotices,
FocalPointPicker,
@ -31,19 +30,19 @@ function Edit({
attributes;
const [blobUrl, setBlobUrl] = useState();
const onUploadError = (message) => {
noticeOperations.removeAllNotices(); // Remove all previous notices
function onUploadError(message) {
noticeOperations.removeAllNotices();
noticeOperations.createErrorNotice(message);
};
const removeCoverImg = () => {
}
function removeCoverImg() {
setAttributes({
coverUrl: undefined,
coverId: undefined,
coverAlt: "",
});
};
}
const updateImage = (image) => {
function updateCoverImage(image) {
if (!image || !image.url) {
setAttributes({
coverUrl: undefined,
@ -57,12 +56,16 @@ function Edit({
coverId: image.id,
coverAlt: image.alt,
});
};
}
// Si l'upload s'est mal passé -> reset
useEffect(() => {
if (!coverId && isBlobURL(coverUrl)) {
setAttributes({ coverUrl: undefined, coverAlt: "" });
}
}, []);
// Gestion de l'url temporaire
useEffect(() => {
// Fonction de clean du BLOB URL qui se lance à chaque changement de coverUrl
if (isBlobURL(coverUrl)) {
@ -88,8 +91,6 @@ function Edit({
}}
value={imagePosition}
onChange={(focalPoint) => {
// console.log("focalPoint");
// console.log(focalPoint);
setAttributes({ imagePosition: focalPoint });
}}
/>
@ -118,7 +119,7 @@ function Edit({
name="Remplacer l'image"
disableMediaButtons={coverUrl}
icon="trash"
onSelect={updateImage}
onSelect={updateCoverImage}
onError={onUploadError}
accept="image/*" // On upload Allow only images
allowedTypes={["image"]} // Onlibrary Allow only images
@ -135,13 +136,15 @@ function Edit({
)}
</BlockControls>
<section {...useBlockProps()}>
{coverUrl && (
<div
className={`picture-container ${
{...useBlockProps({
className: `homegrade-content-blocks-picture-banner ${
isBlobURL(coverUrl) ? "is-loading" : ""
} ${heightFixed ? "fixed-height" : ""} `}
} ${heightFixed ? "fixed-height" : ""} `,
})}
>
{coverUrl && (
<>
<img
src={coverUrl}
alt={coverAlt}
@ -153,18 +156,19 @@ function Edit({
/>
{isBlobURL(coverUrl) && <Spinner />}
</div>
</>
)}
<MediaPlaceholder
disableMediaButtons={coverUrl}
icon="admin-appearance"
onSelect={updateImage}
onSelect={updateCoverImage}
onError={onUploadError}
accept="image/*" // On upload Allow only images
allowedTypes={["image"]} // Onlibrary Allow only images
notices={noticeUI} // En cas d'erreur d'upload
/>
</section>
</div>
</>
);
}

38
blocks/picture-banner/src/index.js
View File

@ -1,39 +1,11 @@
/**
* Registers a new block provided a unique name and an object defining its behavior.
*
* @see https://developer.wordpress.org/block-editor/reference-guides/block-api/block-registration/
*/
import { registerBlockType } from '@wordpress/blocks';
import { registerBlockType } from "@wordpress/blocks";
import "./style.scss";
/**
* Lets webpack process CSS, SASS or SCSS files referenced in JavaScript files.
* All files containing `style` keyword are bundled together. The code used
* gets applied both to the front of your site and to the editor.
*
* @see https://www.npmjs.com/package/@wordpress/scripts#using-css
*/
import './style.scss';
import Edit from "./edit";
import save from "./save";
import metadata from "./block.json";
/**
* Internal dependencies
*/
import Edit from './edit';
import save from './save';
import metadata from './block.json';
/**
* Every block starts by registering a new block type definition.
*
* @see https://developer.wordpress.org/block-editor/reference-guides/block-api/block-registration/
*/
registerBlockType(metadata.name, {
/**
* @see ./edit.js
*/
edit: Edit,
/**
* @see ./save.js
*/
save,
});

20
blocks/picture-banner/src/save.js
View File

@ -1,23 +1,16 @@
import {
useBlockProps,
MediaPlaceholder,
RichText,
BlockControls,
MediaReplaceFlow,
} from "@wordpress/block-editor";
import { useBlockProps } from "@wordpress/block-editor";
export default function save({ attributes }) {
const { coverUrl, coverId, coverAlt, heightFixed, imagePosition } =
attributes;
return (
<section
<div
{...useBlockProps.save({
className: `homegrade-content-blocks-picture-banner`,
className: `homegrade-content-blocks-picture-banner ${
heightFixed ? "fixed-height" : ""
}`,
})}
>
{coverUrl && (
<div
className={`picture-container ${heightFixed ? "fixed-height" : ""}`}
>
<img
src={coverUrl}
alt={coverAlt}
@ -28,8 +21,7 @@ export default function save({ attributes }) {
}}
className={`wp-image-${coverId}`}
/>
</div>
)}
</section>
</div>
);
}

2
blocks/picture-banner/src/style.scss
View File

@ -7,7 +7,6 @@
.wp-block-homegrade-content-blocks-picture-banner {
margin-bottom: 20px;
.picture-container {
overflow: hidden;
border-radius: 22px;
&.fixed-height {
@ -19,4 +18,3 @@
}
}
}
}

2
blocks/questions-container/build/index.asset.php
View File

@ -1 +1 @@
<?php return array('dependencies' => array('wp-block-editor', 'wp-blocks', 'wp-components', 'wp-data', 'wp-element', 'wp-html-entities', 'wp-i18n'), 'version' => '0b6b72dd5b7cf42b9c8a');
<?php return array('dependencies' => array('wp-block-editor', 'wp-blocks', 'wp-components', 'wp-data', 'wp-element', 'wp-html-entities', 'wp-i18n'), 'version' => 'd119409565df9cba01b5');

1
blocks/questions-container/build/index.js
View File

@ -107,7 +107,6 @@ function OptionsSelectControl({
return null;
});
(0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
console.log(relatedPossiblePages);
if (relatedPossiblePages) {
setRelatedQuestionPages(buildSelectOptions(relatedPossiblePages));
}

2
blocks/questions-container/build/index.js.map
View File

File diff suppressed because one or more lines are too long

1
blocks/questions-container/src/OptionsSelectControl.js
View File

@ -89,7 +89,6 @@ export default function OptionsSelectControl({ setAttributes, relatedPostId }) {
});
useEffect(() => {
console.log(relatedPossiblePages);
if (relatedPossiblePages) {
setRelatedQuestionPages(buildSelectOptions(relatedPossiblePages));
}

13
blocks/vocabulaire-summary/build/block.json
View File

@ -5,24 +5,25 @@
"version": "0.1.0",
"title": "Vocabulaire de la fiche",
"category": "homegrade-blocks",
"icon": "testimonial",
"icon": {
"foreground": "#DF1E1E",
"src": "testimonial"
},
"description": "Pour afficher tout le vocabulaire contenu dans la fiche",
"supports": {
"html": false
"html": false,
"multiple": false
},
"textdomain": "homegrade-blocks",
"editorScript": "file:./index.js",
"viewScript": "file:./frontend.js",
"editorStyle": "file:./index.css",
"style": "file:./style-index.css",
"render": "file:./render.php",
"attributes": {
"tooltipWords": {
"type": "array",
"default": []
},
"thematiqueName": {
"type": "string",
"default": ""
}
}
}

2
blocks/vocabulaire-summary/build/frontend.asset.php
View File

@ -1 +1 @@
<?php return array('dependencies' => array(), 'version' => '2e7c7fcf1637e390f7ca');
<?php return array('dependencies' => array(), 'version' => '2d7b588bd723edf3035b');

1
blocks/vocabulaire-summary/build/frontend.js
View File

@ -20,7 +20,6 @@ window.addEventListener("DOMContentLoaded", event => {
});
}
function closeAccordion(wordDetail) {
console.log("will close");
let contentDefinitionWrapper = wordDetail.querySelector(".homegrade-blocks-vocabulaire-summary__content-wrapper");
contentDefinitionWrapper.style.height = "0px";
setTimeout(() => {

2
blocks/vocabulaire-summary/build/frontend.js.map
View File

@ -1 +1 @@
{"version":3,"file":"frontend.js","mappings":";;;;;AAAAA,MAAM,CAACC,gBAAgB,CAAC,kBAAkB,EAAGC,KAAK,IAAK;EACtD;EACA,MAAMC,kBAAkB,GAAGC,QAAQ,CAACC,aAAa,CAChD,uCACD,CAAC;EACD,MAAMC,YAAY,GAAGH,kBAAkB,CAACI,gBAAgB,CAAC,SAAS,CAAC;EAEnE,SAASC,aAAaA,CAACC,UAAU,EAAE;IAClC,IAAIC,wBAAwB,GAAGD,UAAU,CAACJ,aAAa,CACtD,wDACD,CAAC;IACD,IAAIM,0BAA0B,GAAGF,UAAU,CAACJ,aAAa,CACxD,gDACD,CAAC;IACDI,UAAU,CAACG,YAAY,CAAC,MAAM,EAAE,MAAM,CAAC;IACvCH,UAAU,CAACG,YAAY,CAAC,YAAY,EAAE,EAAE,CAAC;IAEzCF,wBAAwB,CAACG,KAAK,CAACC,MAAM,GACpCH,0BAA0B,CAACI,YAAY,GAAG,IAAI;IAC/C;;IAEAN,UAAU,CAACR,gBAAgB,CAAC,eAAe,EAAE,MAAM;MAClDQ,UAAU,CAACO,eAAe,CAAC,YAAY,CAAC;IACzC,CAAC,CAAC;EACH;EACA,SAASC,cAAcA,CAACR,UAAU,EAAE;IACnCS,OAAO,CAACC,GAAG,CAAC,YAAY,CAAC;IACzB,IAAIT,wBAAwB,GAAGD,UAAU,CAACJ,aAAa,CACtD,wDACD,CAAC;IAEDK,wBAAwB,CAACG,KAAK,CAACC,MAAM,GAAG,KAAK;IAE7CM,UAAU,CAAC,MAAM;MAChBX,UAAU,CAACO,eAAe,CAAC,MAAM,CAAC;IACnC,CAAC,EAAE,GAAG,CAAC;EACR;EACA;EACA,SAASK,YAAYA,CAACZ,UAAU,EAAE;IACjC,IAAIa,MAAM,GAAGb,UAAU,CAACc,YAAY,CAAC,MAAM,CAAC;IAC5C,IAAIC,SAAS,GAAGf,UAAU,CAACc,YAAY,CAAC,YAAY,CAAC;IAErD,IAAID,MAAM,IAAI,IAAI,IAAIE,SAAS,IAAI,IAAI,EAAE;MACxChB,aAAa,CAACC,UAAU,CAAC;IAC1B;IACA,IAAIa,MAAM,IAAI,MAAM,EAAE;MACrBL,cAAc,CAACR,UAAU,CAAC;IAC3B;EACD;;EAEA;EACAgB,KAAK,CAACC,IAAI,CAACpB,YAAY,CAAC,CAACqB,OAAO,CAAElB,UAAU,IAAK;IAChDA,UAAU,CAACR,gBAAgB,CAAC,OAAO,EAAGC,KAAK,IAAK;MAC/CA,KAAK,CAAC0B,cAAc,CAAC,CAAC;MACtBP,YAAY,CAACZ,UAAU,CAAC;IACzB,CAAC,CAAC;EACH,CAAC,CAAC;AACH,CAAC,CAAC,C","sources":["webpack://vocabulaire-summary/./src/frontend.js"],"sourcesContent":["window.addEventListener(\"DOMContentLoaded\", (event) => {\r\n\t// GETTING ELEMENTS FROM THE DOM\r\n\tconst vocabulaireSummary = document.querySelector(\r\n\t\t\".homegrade-blocks-vocabulaire-summary\"\r\n\t);\r\n\tconst wordsDetails = vocabulaireSummary.querySelectorAll(\"details\");\r\n\r\n\tfunction openAccordion(wordDetail) {\r\n\t\tlet contentDefinitionWrapper = wordDetail.querySelector(\r\n\t\t\t\".homegrade-blocks-vocabulaire-summary__content-wrapper\"\r\n\t\t);\r\n\t\tlet contentDefinitionParagraph = wordDetail.querySelector(\r\n\t\t\t\".homegrade-blocks-vocabulaire-summary__content\"\r\n\t\t);\r\n\t\twordDetail.setAttribute(\"open\", \"true\");\r\n\t\twordDetail.setAttribute(\"is_opening\", \"\");\r\n\r\n\t\tcontentDefinitionWrapper.style.height =\r\n\t\t\tcontentDefinitionParagraph.offsetHeight + \"px\";\r\n\t\t// remove is opening after css transition\r\n\r\n\t\twordDetail.addEventListener(\"transitionend\", () => {\r\n\t\t\twordDetail.removeAttribute(\"is_opening\");\r\n\t\t});\r\n\t}\r\n\tfunction closeAccordion(wordDetail) {\r\n\t\tconsole.log(\"will close\");\r\n\t\tlet contentDefinitionWrapper = wordDetail.querySelector(\r\n\t\t\t\".homegrade-blocks-vocabulaire-summary__content-wrapper\"\r\n\t\t);\r\n\r\n\t\tcontentDefinitionWrapper.style.height = \"0px\";\r\n\r\n\t\tsetTimeout(() => {\r\n\t\t\twordDetail.removeAttribute(\"open\");\r\n\t\t}, 300);\r\n\t}\r\n\t// HANDLING CLICK\r\n\tfunction toggleActive(wordDetail) {\r\n\t\tlet isOpen = wordDetail.getAttribute(\"open\");\r\n\t\tlet isOpening = wordDetail.getAttribute(\"is_opening\");\r\n\r\n\t\tif (isOpen == null && isOpening == null) {\r\n\t\t\topenAccordion(wordDetail);\r\n\t\t}\r\n\t\tif (isOpen == \"true\") {\r\n\t\t\tcloseAccordion(wordDetail);\r\n\t\t}\r\n\t}\r\n\r\n\t// HANDLING CLICK\r\n\tArray.from(wordsDetails).forEach((wordDetail) => {\r\n\t\twordDetail.addEventListener(\"click\", (event) => {\r\n\t\t\tevent.preventDefault();\r\n\t\t\ttoggleActive(wordDetail);\r\n\t\t});\r\n\t});\r\n});\r\n"],"names":["window","addEventListener","event","vocabulaireSummary","document","querySelector","wordsDetails","querySelectorAll","openAccordion","wordDetail","contentDefinitionWrapper","contentDefinitionParagraph","setAttribute","style","height","offsetHeight","removeAttribute","closeAccordion","console","log","setTimeout","toggleActive","isOpen","getAttribute","isOpening","Array","from","forEach","preventDefault"],"sourceRoot":""}
{"version":3,"file":"frontend.js","mappings":";;;;;AAAAA,MAAM,CAACC,gBAAgB,CAAC,kBAAkB,EAAGC,KAAK,IAAK;EACtD;EACA,MAAMC,kBAAkB,GAAGC,QAAQ,CAACC,aAAa,CAChD,uCACD,CAAC;EACD,MAAMC,YAAY,GAAGH,kBAAkB,CAACI,gBAAgB,CAAC,SAAS,CAAC;EAEnE,SAASC,aAAaA,CAACC,UAAU,EAAE;IAClC,IAAIC,wBAAwB,GAAGD,UAAU,CAACJ,aAAa,CACtD,wDACD,CAAC;IACD,IAAIM,0BAA0B,GAAGF,UAAU,CAACJ,aAAa,CACxD,gDACD,CAAC;IACDI,UAAU,CAACG,YAAY,CAAC,MAAM,EAAE,MAAM,CAAC;IACvCH,UAAU,CAACG,YAAY,CAAC,YAAY,EAAE,EAAE,CAAC;IAEzCF,wBAAwB,CAACG,KAAK,CAACC,MAAM,GACpCH,0BAA0B,CAACI,YAAY,GAAG,IAAI;IAC/C;;IAEAN,UAAU,CAACR,gBAAgB,CAAC,eAAe,EAAE,MAAM;MAClDQ,UAAU,CAACO,eAAe,CAAC,YAAY,CAAC;IACzC,CAAC,CAAC;EACH;EACA,SAASC,cAAcA,CAACR,UAAU,EAAE;IACnC,IAAIC,wBAAwB,GAAGD,UAAU,CAACJ,aAAa,CACtD,wDACD,CAAC;IAEDK,wBAAwB,CAACG,KAAK,CAACC,MAAM,GAAG,KAAK;IAE7CI,UAAU,CAAC,MAAM;MAChBT,UAAU,CAACO,eAAe,CAAC,MAAM,CAAC;IACnC,CAAC,EAAE,GAAG,CAAC;EACR;EACA;EACA,SAASG,YAAYA,CAACV,UAAU,EAAE;IACjC,IAAIW,MAAM,GAAGX,UAAU,CAACY,YAAY,CAAC,MAAM,CAAC;IAC5C,IAAIC,SAAS,GAAGb,UAAU,CAACY,YAAY,CAAC,YAAY,CAAC;IAErD,IAAID,MAAM,IAAI,IAAI,IAAIE,SAAS,IAAI,IAAI,EAAE;MACxCd,aAAa,CAACC,UAAU,CAAC;IAC1B;IACA,IAAIW,MAAM,IAAI,MAAM,EAAE;MACrBH,cAAc,CAACR,UAAU,CAAC;IAC3B;EACD;;EAEA;EACAc,KAAK,CAACC,IAAI,CAAClB,YAAY,CAAC,CAACmB,OAAO,CAAEhB,UAAU,IAAK;IAChDA,UAAU,CAACR,gBAAgB,CAAC,OAAO,EAAGC,KAAK,IAAK;MAC/CA,KAAK,CAACwB,cAAc,CAAC,CAAC;MACtBP,YAAY,CAACV,UAAU,CAAC;IACzB,CAAC,CAAC;EACH,CAAC,CAAC;AACH,CAAC,CAAC,C","sources":["webpack://vocabulaire-summary/./src/frontend.js"],"sourcesContent":["window.addEventListener(\"DOMContentLoaded\", (event) => {\r\n\t// GETTING ELEMENTS FROM THE DOM\r\n\tconst vocabulaireSummary = document.querySelector(\r\n\t\t\".homegrade-blocks-vocabulaire-summary\"\r\n\t);\r\n\tconst wordsDetails = vocabulaireSummary.querySelectorAll(\"details\");\r\n\r\n\tfunction openAccordion(wordDetail) {\r\n\t\tlet contentDefinitionWrapper = wordDetail.querySelector(\r\n\t\t\t\".homegrade-blocks-vocabulaire-summary__content-wrapper\"\r\n\t\t);\r\n\t\tlet contentDefinitionParagraph = wordDetail.querySelector(\r\n\t\t\t\".homegrade-blocks-vocabulaire-summary__content\"\r\n\t\t);\r\n\t\twordDetail.setAttribute(\"open\", \"true\");\r\n\t\twordDetail.setAttribute(\"is_opening\", \"\");\r\n\r\n\t\tcontentDefinitionWrapper.style.height =\r\n\t\t\tcontentDefinitionParagraph.offsetHeight + \"px\";\r\n\t\t// remove is opening after css transition\r\n\r\n\t\twordDetail.addEventListener(\"transitionend\", () => {\r\n\t\t\twordDetail.removeAttribute(\"is_opening\");\r\n\t\t});\r\n\t}\r\n\tfunction closeAccordion(wordDetail) {\r\n\t\tlet contentDefinitionWrapper = wordDetail.querySelector(\r\n\t\t\t\".homegrade-blocks-vocabulaire-summary__content-wrapper\"\r\n\t\t);\r\n\r\n\t\tcontentDefinitionWrapper.style.height = \"0px\";\r\n\r\n\t\tsetTimeout(() => {\r\n\t\t\twordDetail.removeAttribute(\"open\");\r\n\t\t}, 300);\r\n\t}\r\n\t// HANDLING CLICK\r\n\tfunction toggleActive(wordDetail) {\r\n\t\tlet isOpen = wordDetail.getAttribute(\"open\");\r\n\t\tlet isOpening = wordDetail.getAttribute(\"is_opening\");\r\n\r\n\t\tif (isOpen == null && isOpening == null) {\r\n\t\t\topenAccordion(wordDetail);\r\n\t\t}\r\n\t\tif (isOpen == \"true\") {\r\n\t\t\tcloseAccordion(wordDetail);\r\n\t\t}\r\n\t}\r\n\r\n\t// HANDLING CLICK\r\n\tArray.from(wordsDetails).forEach((wordDetail) => {\r\n\t\twordDetail.addEventListener(\"click\", (event) => {\r\n\t\t\tevent.preventDefault();\r\n\t\t\ttoggleActive(wordDetail);\r\n\t\t});\r\n\t});\r\n});\r\n"],"names":["window","addEventListener","event","vocabulaireSummary","document","querySelector","wordsDetails","querySelectorAll","openAccordion","wordDetail","contentDefinitionWrapper","contentDefinitionParagraph","setAttribute","style","height","offsetHeight","removeAttribute","closeAccordion","setTimeout","toggleActive","isOpen","getAttribute","isOpening","Array","from","forEach","preventDefault"],"sourceRoot":""}

2
blocks/vocabulaire-summary/build/index.asset.php
View File

@ -1 +1 @@
<?php return array('dependencies' => array('react', 'wp-block-editor', 'wp-blocks', 'wp-core-data', 'wp-data', 'wp-element', 'wp-i18n'), 'version' => 'db2e165aea172016cf17');
<?php return array('dependencies' => array('react', 'wp-block-editor', 'wp-blocks', 'wp-core-data', 'wp-data', 'wp-element', 'wp-i18n'), 'version' => '4da44f9f4582d3fdcce4');

9
blocks/vocabulaire-summary/build/index.css
View File

@ -1,13 +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/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-multiblocks {
border: 1px dotted #f00;
}
/*# sourceMappingURL=index.css.map*/

120
blocks/vocabulaire-summary/build/index.js
View File

@ -70,6 +70,14 @@ __webpack_require__.r(__webpack_exports__);
function Edit({
attributes,
setAttributes
}) {
let {
tooltipWords
} = attributes;
let [hasFetchedDatas, setHasFetchedDatas] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(false);
function CurrentThematiqueDisplay({
id
}) {
@ -121,22 +129,10 @@ function buildTooltipWords(editorContent) {
});
return filteredTooltipWords;
}
function Edit({
attributes,
setAttributes
}) {
let {
tooltipWords,
thematiqueName
} = attributes;
let [hasFetchedDatas, setHasFetchedDatas] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(false);
const currentPost = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_5__.useSelect)(select => select("core/editor").getCurrentPost());
const currentTaxonomies = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_5__.useSelect)(select => select("core/editor").getCurrentPostAttribute("thematiques"));
let fetchedCurrentThematique = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_5__.useSelect)(select => select("core").getEntityRecord("taxonomy", "thematiques", currentTaxonomies[0] // or currentPost.thematiques[0] works as well
let currentThematique = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_5__.useSelect)(select => select("core").getEntityRecord("taxonomy", "thematiques", currentTaxonomies[0] // or currentPost.thematiques[0] works as well
), [currentTaxonomies]);
if (!currentPost || !currentPost.content) {
return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, "Loading...");
}
(0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
if (currentPost.content) {
let newTooltipWords = buildTooltipWords(currentPost.content);
@ -145,19 +141,13 @@ function Edit({
});
}
}, [currentPost]);
(0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
if (!fetchedCurrentThematique) return;
setAttributes({
thematiqueName: fetchedCurrentThematique.name
});
}, [fetchedCurrentThematique, currentPost]);
return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("section", {
...(0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_2__.useBlockProps)({
className: `homegrade-blocks-vocabulaire-summary`
})
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("h3", {
className: "homegrade-blocks-vocabulaire-summary__title"
}, "Vocabulaire \u2014 ", thematiqueName), tooltipWords && tooltipWords.map(elem => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("details", {
}, "Vocabulaire \u2014", " ", currentThematique && currentThematique.name ? currentThematique.name : "{...pas de thématique}"), tooltipWords && tooltipWords.map(elem => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("details", {
className: "question"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("summary", null, elem.tooltipText, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
className: "open-close-icon"
@ -185,98 +175,18 @@ __webpack_require__.r(__webpack_exports__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _style_scss__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./style.scss */ "./src/style.scss");
/* harmony import */ var _edit__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./edit */ "./src/edit.js");
/* harmony import */ var _save__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./save */ "./src/save.js");
/* harmony import */ var _block_json__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./block.json */ "./src/block.json");
/**
* Registers a new block provided a unique name and an object defining its behavior.
*
* @see https://developer.wordpress.org/block-editor/reference-guides/block-api/block-registration/
*/
/**
* Lets webpack process CSS, SASS or SCSS files referenced in JavaScript files.
* All files containing `style` keyword are bundled together. The code used
* gets applied both to the front of your site and to the editor.
*
* @see https://www.npmjs.com/package/@wordpress/scripts#using-css
*/
/**
* Internal dependencies
*/
/* harmony import */ var _block_json__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./block.json */ "./src/block.json");
// import save from "./save";
/**
* Every block starts by registering a new block type definition.
*
* @see https://developer.wordpress.org/block-editor/reference-guides/block-api/block-registration/
*/
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_0__.registerBlockType)(_block_json__WEBPACK_IMPORTED_MODULE_4__.name, {
/**
* @see ./edit.js
*/
edit: _edit__WEBPACK_IMPORTED_MODULE_2__["default"],
/**
* @see ./save.js
*/
save: _save__WEBPACK_IMPORTED_MODULE_3__["default"]
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_0__.registerBlockType)(_block_json__WEBPACK_IMPORTED_MODULE_3__.name, {
edit: _edit__WEBPACK_IMPORTED_MODULE_2__["default"]
});
/***/ }),
/***/ "./src/save.js":
/*!*********************!*\
!*** ./src/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__);
/* harmony import */ var _img_chevron_down_svg__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./img/chevron_down.svg */ "./src/img/chevron_down.svg");
function save({
attributes,
setAttributes
}) {
let {
tooltipWords,
thematiqueName
} = attributes;
return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("section", {
..._wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__.useBlockProps.save({
className: `homegrade-blocks-vocabulaire-summary`
})
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("h3", {
className: "homegrade-blocks-vocabulaire-summary__title"
}, "Vocabulaire \u2014 ", thematiqueName), " ", tooltipWords && tooltipWords.map(elem => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("details", {
className: "question"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("summary", null, elem.tooltipText, " ", (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
className: "open-close-icon"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", {
src: _img_chevron_down_svg__WEBPACK_IMPORTED_MODULE_2__["default"],
className: "open-close-cta",
alt: ""
}))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
className: "homegrade-blocks-vocabulaire-summary__content-wrapper"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
className: "homegrade-blocks-vocabulaire-summary__content"
}, elem.tooltipDefinition)))));
}
/***/ }),
/***/ "./src/editor.scss":
/*!*************************!*\
!*** ./src/editor.scss ***!
@ -377,7 +287,7 @@ module.exports = window["wp"]["i18n"];
\************************/
/***/ ((module) => {
module.exports = JSON.parse('{"$schema":"https://schemas.wp.org/trunk/block.json","apiVersion":2,"name":"homegrade-content-blocks/vocabulaire-summary","version":"0.1.0","title":"Vocabulaire de la fiche","category":"homegrade-blocks","icon":"testimonial","description":"Pour afficher tout le vocabulaire contenu dans la fiche","supports":{"html":false},"textdomain":"homegrade-blocks","editorScript":"file:./index.js","viewScript":"file:./frontend.js","editorStyle":"file:./index.css","style":"file:./style-index.css","attributes":{"tooltipWords":{"type":"array","default":[]},"thematiqueName":{"type":"string","default":""}}}');
module.exports = JSON.parse('{"$schema":"https://schemas.wp.org/trunk/block.json","apiVersion":2,"name":"homegrade-content-blocks/vocabulaire-summary","version":"0.1.0","title":"Vocabulaire de la fiche","category":"homegrade-blocks","icon":{"foreground":"#DF1E1E","src":"testimonial"},"description":"Pour afficher tout le vocabulaire contenu dans la fiche","supports":{"html":false,"multiple":false},"textdomain":"homegrade-blocks","editorScript":"file:./index.js","viewScript":"file:./frontend.js","editorStyle":"file:./index.css","style":"file:./style-index.css","render":"file:./render.php","attributes":{"tooltipWords":{"type":"array","default":[]}}}');
/***/ })

2
blocks/vocabulaire-summary/build/index.js.map
View File

File diff suppressed because one or more lines are too long

27
blocks/vocabulaire-summary/build/render.php Normal file
View File

@ -0,0 +1,27 @@
<?php
$tooltipWords = $attributes['tooltipWords'];
global $post;
$thematique = get_the_terms($post->ID, 'thematiques')[0];
?>
<section class="homegrade-blocks-vocabulaire-summary">
<h3 className="homegrade-blocks-vocabulaire-summary__title">
Vocabulaire <?php echo $thematique->name ? " — " . $thematique->name : ""; ?>
</h3>
<?php foreach ($tooltipWords as $word) : ?>
<details class="question">
<summary>
<?php echo $word['tooltipText']; ?>
<div class="open-close-icon">
<img src="<?php echo plugins_url('/', dirname(__FILE__)) . 'src/img/chevron_down.svg' ?>" class="open-close-cta" alt="" />
</div>
</summary>
<div class="homegrade-blocks-vocabulaire-summary__content-wrapper">
<p class="homegrade-blocks-vocabulaire-summary__content">
<?php echo $word['tooltipDefinition']; ?>
</p>
</div>
</details>
<?php endforeach; ?>
</section>

13
blocks/vocabulaire-summary/src/block.json
View File

@ -5,24 +5,25 @@
"version": "0.1.0",
"title": "Vocabulaire de la fiche",
"category": "homegrade-blocks",
"icon": "testimonial",
"icon": {
"foreground": "#DF1E1E",
"src": "testimonial"
},
"description": "Pour afficher tout le vocabulaire contenu dans la fiche",
"supports": {
"html": false
"html": false,
"multiple": false
},
"textdomain": "homegrade-blocks",
"editorScript": "file:./index.js",
"viewScript": "file:./frontend.js",
"editorStyle": "file:./index.css",
"style": "file:./style-index.css",
"render": "file:./render.php",
"attributes": {
"tooltipWords": {
"type": "array",
"default": []
},
"thematiqueName": {
"type": "string",
"default": ""
}
}
}

28
blocks/vocabulaire-summary/src/edit.js
View File

@ -7,6 +7,11 @@ import { useSelect, useDispatch } from "@wordpress/data";
import { useEffect } from "@wordpress/element";
import { useEntityProp } from "@wordpress/core-data";
import chevronDown from "./img/chevron_down.svg";
export default function Edit({ attributes, setAttributes }) {
let { tooltipWords } = attributes;
let [hasFetchedDatas, setHasFetchedDatas] = useState(false);
function CurrentThematiqueDisplay({ id }) {
const { record, isResolving } = useEntityRecord(
"taxonomy",
@ -37,7 +42,6 @@ function getCurrentThematique(id) {
}
return record;
}
function buildTooltipWords(editorContent) {
// Parsing Content
const parser = new DOMParser();
@ -69,17 +73,15 @@ function buildTooltipWords(editorContent) {
return filteredTooltipWords;
}
export default function Edit({ attributes, setAttributes }) {
let { tooltipWords, thematiqueName } = attributes;
let [hasFetchedDatas, setHasFetchedDatas] = useState(false);
const currentPost = useSelect((select) =>
select("core/editor").getCurrentPost()
);
const currentTaxonomies = useSelect((select) =>
select("core/editor").getCurrentPostAttribute("thematiques")
);
let fetchedCurrentThematique = useSelect(
let currentThematique = useSelect(
(select) =>
select("core").getEntityRecord(
"taxonomy",
@ -89,10 +91,6 @@ export default function Edit({ attributes, setAttributes }) {
[currentTaxonomies]
);
if (!currentPost || !currentPost.content) {
return <p>Loading...</p>;
}
useEffect(() => {
if (currentPost.content) {
let newTooltipWords = buildTooltipWords(currentPost.content);
@ -100,11 +98,6 @@ export default function Edit({ attributes, setAttributes }) {
}
}, [currentPost]);
useEffect(() => {
if (!fetchedCurrentThematique) return;
setAttributes({ thematiqueName: fetchedCurrentThematique.name });
}, [fetchedCurrentThematique, currentPost]);
return (
<section
{...useBlockProps({
@ -112,7 +105,10 @@ export default function Edit({ attributes, setAttributes }) {
})}
>
<h3 className="homegrade-blocks-vocabulaire-summary__title">
Vocabulaire — {thematiqueName}
Vocabulaire —{" "}
{currentThematique && currentThematique.name
? currentThematique.name
: "{...pas de thématique}"}
</h3>
{tooltipWords &&
tooltipWords.map((elem) => (

9
blocks/vocabulaire-summary/src/editor.scss
View File

@ -1,9 +0,0 @@
/**
* The following styles get applied inside the editor only.
*
* Replace them with your own styles or remove the file completely.
*/
.wp-block-create-block-multiblocks {
border: 1px dotted #f00;
}

1
blocks/vocabulaire-summary/src/frontend.js
View File

@ -24,7 +24,6 @@ window.addEventListener("DOMContentLoaded", (event) => {
});
}
function closeAccordion(wordDetail) {
console.log("will close");
let contentDefinitionWrapper = wordDetail.querySelector(
".homegrade-blocks-vocabulaire-summary__content-wrapper"
);

39
blocks/vocabulaire-summary/src/index.js
View File

@ -1,39 +1,10 @@
/**
* Registers a new block provided a unique name and an object defining its behavior.
*
* @see https://developer.wordpress.org/block-editor/reference-guides/block-api/block-registration/
*/
import { registerBlockType } from '@wordpress/blocks';
import { registerBlockType } from "@wordpress/blocks";
import "./style.scss";
/**
* Lets webpack process CSS, SASS or SCSS files referenced in JavaScript files.
* All files containing `style` keyword are bundled together. The code used
* gets applied both to the front of your site and to the editor.
*
* @see https://www.npmjs.com/package/@wordpress/scripts#using-css
*/
import './style.scss';
import Edit from "./edit";
// import save from "./save";
import metadata from "./block.json";
/**
* Internal dependencies
*/
import Edit from './edit';
import save from './save';
import metadata from './block.json';
/**
* Every block starts by registering a new block type definition.
*
* @see https://developer.wordpress.org/block-editor/reference-guides/block-api/block-registration/
*/
registerBlockType(metadata.name, {
/**
* @see ./edit.js
*/
edit: Edit,
/**
* @see ./save.js
*/
save,
});

27
blocks/vocabulaire-summary/src/render.php Normal file
View File

@ -0,0 +1,27 @@
<?php
$tooltipWords = $attributes['tooltipWords'];
global $post;
$thematique = get_the_terms($post->ID, 'thematiques')[0];
?>
<section class="homegrade-blocks-vocabulaire-summary">
<h3 className="homegrade-blocks-vocabulaire-summary__title">
Vocabulaire <?php echo $thematique->name ? " — " . $thematique->name : ""; ?>
</h3>
<?php foreach ($tooltipWords as $word) : ?>
<details class="question">
<summary>
<?php echo $word['tooltipText']; ?>
<div class="open-close-icon">
<img src="<?php echo plugins_url('/', dirname(__FILE__)) . 'src/img/chevron_down.svg' ?>" class="open-close-cta" alt="" />
</div>
</summary>
<div class="homegrade-blocks-vocabulaire-summary__content-wrapper">
<p class="homegrade-blocks-vocabulaire-summary__content">
<?php echo $word['tooltipDefinition']; ?>
</p>
</div>
</details>
<?php endforeach; ?>
</section>

34
blocks/vocabulaire-summary/src/save.js
View File

@ -1,34 +0,0 @@
import { useBlockProps } from "@wordpress/block-editor";
import chevronDown from "./img/chevron_down.svg";
export default function save({ attributes, setAttributes }) {
let { tooltipWords, thematiqueName } = attributes;
return (
<section
{...useBlockProps.save({
className: `homegrade-blocks-vocabulaire-summary`,
})}
>
<h3 className="homegrade-blocks-vocabulaire-summary__title">
Vocabulaire — {thematiqueName}
</h3>{" "}
{tooltipWords &&
tooltipWords.map((elem) => (
<details className="question">
<summary>
{elem.tooltipText}{" "}
<div className="open-close-icon">
<img src={chevronDown} className="open-close-cta" alt="" />
</div>
</summary>
<div className="homegrade-blocks-vocabulaire-summary__content-wrapper">
<p className="homegrade-blocks-vocabulaire-summary__content">
{elem.tooltipDefinition}
</p>
</div>
</details>
))}
</section>
);
}

2
build/index.asset.php
View File

@ -1 +1 @@
<?php return array('dependencies' => array('wp-block-editor', 'wp-components', 'wp-data', 'wp-element', 'wp-i18n', 'wp-primitives', 'wp-rich-text'), 'version' => '772a0f124214b8df6636');
<?php return array('dependencies' => array('wp-block-editor', 'wp-components', 'wp-data', 'wp-element', 'wp-i18n', 'wp-primitives', 'wp-rich-text'), 'version' => 'cb157be43098e220ac58');

40
build/index.css
View File

@ -1,13 +1,6 @@
/*!**********************************************************************************************************************************************************************************!*\
!*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[2].use[2]!./src/format-types/tooltip.css ***!
\**********************************************************************************************************************************************************************************/
.popover_tooltip_field {
.components-popover__content {
padding: 10px !important;
min-width: 200px;
}
}
/*!******************************************************************************************************************************************************************************************!*\
!*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[2].use[2]!./src/format-types/tooltip/tooltip.css ***!
\******************************************************************************************************************************************************************************************/
.tooltip-word {
padding-top: 12px;
position: relative;
@ -22,9 +15,12 @@
position: absolute;
top: -6px;
left: 50%;
text-align: center;
text-align: left;
transform: translate(-50%, -100%);
padding: 10px;
max-width: 300px;
width: -moz-max-content;
width: max-content;
}
.tooltip-popup:after {
content: "";
@ -38,13 +34,27 @@
transform: translate(-50%, -50%) rotate(45deg);
box-shadow: 4px 4px 4px rgba(0, 0, 0, 0.08);
}
.tooltip-popup p {
.tooltip-popup__title {
font-weight: bold;
color: black !important;
padding-bottom: 10px;
}
.tooltip-popup__definition {
color: black !important;
margin: 0 !important;
}
/*!***********************************************************************************************************************************************************************************!*\
!*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[2].use[2]!./src/format-types/brochure.css ***!
\***********************************************************************************************************************************************************************************/
/* FOR THE EDITOR */
.popover_tooltip_field {
.components-popover__content {
padding: 10px !important;
min-width: 200px;
}
}
/*!********************************************************************************************************************************************************************************************!*\
!*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[2].use[2]!./src/format-types/brochure/brochure.css ***!
\********************************************************************************************************************************************************************************************/
.brochure-download-icon {
margin: 0 0px 0 6px;
display: inline-block;

2
build/index.css.map
View File

@ -1 +1 @@
{"version":3,"file":"index.css","mappings":";;;AAAA;CACC;EACC,wBAAwB;EACxB,gBAAgB;CACjB;AACD;;AAEA;CACC,iBAAiB;CACjB,kBAAkB;CAClB,eAAe;CACf,0BAA0B;CAC1B,6BAA6B;CAC7B,0BAA0B;AAC3B;;AAEA;CACC,wBAAwB;CACxB,kBAAkB;CAClB,SAAS;CACT,SAAS;CACT,kBAAkB;CAClB,iCAAiC;CACjC,aAAa;AACd;AACA;CACC,WAAW;CACX,cAAc;CACd,uBAAuB;CACvB,kBAAkB;CAClB,SAAS;CACT,SAAS;CACT,WAAW;CACX,YAAY;CACZ,8CAA8C;CAC9C,2CAA2C;AAC5C;AACA;CACC,oBAAoB;AACrB;;;;;ACvCA;CACC,mBAAmB;CACnB,qBAAqB;CACrB,2BAA2B;AAC5B","sources":["webpack://multi-blocks/./src/format-types/tooltip.css","webpack://multi-blocks/./src/format-types/brochure.css"],"sourcesContent":[".popover_tooltip_field {\r\n\t.components-popover__content {\r\n\t\tpadding: 10px !important;\r\n\t\tmin-width: 200px;\r\n\t}\r\n}\r\n\r\n.tooltip-word {\r\n\tpadding-top: 12px;\r\n\tposition: relative;\r\n\tcursor: default;\r\n\ttext-underline-offset: 4px;\r\n\ttext-decoration-style: dashed;\r\n\ttext-decoration-color: red;\r\n}\r\n\r\n.tooltip-popup {\r\n\tbackground-color: yellow;\r\n\tposition: absolute;\r\n\ttop: -6px;\r\n\tleft: 50%;\r\n\ttext-align: center;\r\n\ttransform: translate(-50%, -100%);\r\n\tpadding: 10px;\r\n}\r\n.tooltip-popup:after {\r\n\tcontent: \"\";\r\n\tdisplay: block;\r\n\tbackground-color: white;\r\n\tposition: absolute;\r\n\ttop: 100%;\r\n\tleft: 50%;\r\n\twidth: 20px;\r\n\theight: 20px;\r\n\ttransform: translate(-50%, -50%) rotate(45deg);\r\n\tbox-shadow: 4px 4px 4px rgba(0, 0, 0, 0.08);\r\n}\r\n.tooltip-popup p {\r\n\tmargin: 0 !important;\r\n}\r\n",".brochure-download-icon {\r\n\tmargin: 0 0px 0 6px;\r\n\tdisplay: inline-block;\r\n\ttransform: translateY(-1px);\r\n}\r\n"],"names":[],"sourceRoot":""}
{"version":3,"file":"index.css","mappings":";;;AAAA;CACC,iBAAiB;CACjB,kBAAkB;CAClB,eAAe;CACf,0BAA0B;CAC1B,6BAA6B;CAC7B,0BAA0B;AAC3B;;AAEA;CACC,wBAAwB;CACxB,kBAAkB;CAClB,SAAS;CACT,SAAS;CACT,gBAAgB;CAChB,iCAAiC;CACjC,aAAa;CACb,gBAAgB;CAChB,uBAAkB;CAAlB,kBAAkB;AACnB;AACA;CACC,WAAW;CACX,cAAc;CACd,uBAAuB;CACvB,kBAAkB;CAClB,SAAS;CACT,SAAS;CACT,WAAW;CACX,YAAY;CACZ,8CAA8C;CAC9C,2CAA2C;AAC5C;AACA;CACC,iBAAiB;CACjB,uBAAuB;CACvB,oBAAoB;AACrB;AACA;CACC,uBAAuB;CACvB,oBAAoB;AACrB;;AAEA,mBAAmB;AACnB;CACC;EACC,wBAAwB;EACxB,gBAAgB;CACjB;AACD;;;;;AChDA;CACC,mBAAmB;CACnB,qBAAqB;CACrB,2BAA2B;AAC5B","sources":["webpack://multi-blocks/./src/format-types/tooltip/tooltip.css","webpack://multi-blocks/./src/format-types/brochure/brochure.css"],"sourcesContent":[".tooltip-word {\r\n\tpadding-top: 12px;\r\n\tposition: relative;\r\n\tcursor: default;\r\n\ttext-underline-offset: 4px;\r\n\ttext-decoration-style: dashed;\r\n\ttext-decoration-color: red;\r\n}\r\n\r\n.tooltip-popup {\r\n\tbackground-color: yellow;\r\n\tposition: absolute;\r\n\ttop: -6px;\r\n\tleft: 50%;\r\n\ttext-align: left;\r\n\ttransform: translate(-50%, -100%);\r\n\tpadding: 10px;\r\n\tmax-width: 300px;\r\n\twidth: max-content;\r\n}\r\n.tooltip-popup:after {\r\n\tcontent: \"\";\r\n\tdisplay: block;\r\n\tbackground-color: white;\r\n\tposition: absolute;\r\n\ttop: 100%;\r\n\tleft: 50%;\r\n\twidth: 20px;\r\n\theight: 20px;\r\n\ttransform: translate(-50%, -50%) rotate(45deg);\r\n\tbox-shadow: 4px 4px 4px rgba(0, 0, 0, 0.08);\r\n}\r\n.tooltip-popup__title {\r\n\tfont-weight: bold;\r\n\tcolor: black !important;\r\n\tpadding-bottom: 10px;\r\n}\r\n.tooltip-popup__definition {\r\n\tcolor: black !important;\r\n\tmargin: 0 !important;\r\n}\r\n\r\n/* FOR THE EDITOR */\r\n.popover_tooltip_field {\r\n\t.components-popover__content {\r\n\t\tpadding: 10px !important;\r\n\t\tmin-width: 200px;\r\n\t}\r\n}\r\n",".brochure-download-icon {\r\n\tmargin: 0 0px 0 6px;\r\n\tdisplay: inline-block;\r\n\ttransform: translateY(-1px);\r\n}\r\n"],"names":[],"sourceRoot":""}

129
build/index.js
View File

@ -98,10 +98,10 @@ function getThematiqueFamilySlug(thematique_slug) {
/***/ }),
/***/ "./src/format-types/brochure.js":
/*!**************************************!*\
!*** ./src/format-types/brochure.js ***!
\**************************************/
/***/ "./src/format-types/brochure/brochure.js":
/*!***********************************************!*\
!*** ./src/format-types/brochure/brochure.js ***!
\***********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
@ -125,6 +125,7 @@ __webpack_require__.r(__webpack_exports__);
const formatName = "homegrade-format/brochure-format";
const BrochureLinkFormatButton = props => {
const {
isActive,
@ -133,14 +134,11 @@ const BrochureLinkFormatButton = props => {
} = props;
const [isPopoverOpen, setIsPopoverOpen] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(false);
const [linkValue, setLinkValue] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)("");
const activeFormat = (0,_wordpress_rich_text__WEBPACK_IMPORTED_MODULE_1__.getActiveFormats)(props.value).filter(format => format.type === "homegrade-format/brochure-format")[0];
// console.log(activeFormat);
// console.log(getActiveFormats(props.value));
function handleFormat() {
const activeFormat = (0,_wordpress_rich_text__WEBPACK_IMPORTED_MODULE_1__.getActiveFormats)(value).filter(format => format.type === formatName)[0];
function setFormat() {
setIsPopoverOpen(!isPopoverOpen);
onChange((0,_wordpress_rich_text__WEBPACK_IMPORTED_MODULE_1__.toggleFormat)(value, {
type: "homegrade-format/brochure-format",
onChange((0,_wordpress_rich_text__WEBPACK_IMPORTED_MODULE_1__.applyFormat)(value, {
type: formatName,
attributes: {
href: linkValue.url,
target: "_blank",
@ -153,19 +151,21 @@ const BrochureLinkFormatButton = props => {
setIsPopoverOpen(false);
setLinkValue("");
onChange((0,_wordpress_rich_text__WEBPACK_IMPORTED_MODULE_1__.toggleFormat)(value, {
type: "homegrade-format/brochure-format"
type: formatName
}));
}
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__.BlockControls, null, isPopoverOpen && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.Popover, {
onClose: () => setIsPopoverOpen(false),
className: "popover_tooltip_field"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__.__experimentalLinkControl, {
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__.__experimentalLinkControl
// prefetch pdf attachment
, {
suggestionsQuery: {
type: "attachment"
type: "attachment",
subtype: "pdf"
},
value: linkValue,
onChange: value => {
// console.log(value);
setLinkValue(value);
}
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.Button, {
@ -173,9 +173,11 @@ const BrochureLinkFormatButton = props => {
variant: "primary",
onClick: () => {
setIsPopoverOpen(!isPopoverOpen);
handleFormat();
setFormat();
}
}, "Valider")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.ToolbarGroup, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.ToolbarButton, {
}, "Valider")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.ToolbarGroup, {
className: "test"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.ToolbarButton, {
isActive: isActive,
icon: !isActive ? "book" : _wordpress_icons__WEBPACK_IMPORTED_MODULE_6__["default"],
label: !isActive ? "Ajouter un lien brochure" : "Supprimer le lien brochure",
@ -183,7 +185,7 @@ const BrochureLinkFormatButton = props => {
}))));
};
(0,_wordpress_rich_text__WEBPACK_IMPORTED_MODULE_1__.registerFormatType)("homegrade-format/brochure-format", {
title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__.__)("Brochure", "homegrade-format"),
title: "Lien Brochure",
tagName: "a",
className: "brochure-link-format",
edit: BrochureLinkFormatButton
@ -191,10 +193,10 @@ const BrochureLinkFormatButton = props => {
/***/ }),
/***/ "./src/format-types/tooltip.js":
/*!*************************************!*\
!*** ./src/format-types/tooltip.js ***!
\*************************************/
/***/ "./src/format-types/tooltip/tooltip.js":
/*!*********************************************!*\
!*** ./src/format-types/tooltip/tooltip.js ***!
\*********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
@ -228,29 +230,24 @@ const Edit = props => {
onChange
} = props;
const [isPopoverOpen, setIsPopoverOpen] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(false);
const [popoverText, setPopoverText] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)("");
const [pendingDefinition, setPendingDefinition] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(false);
const activeFormat = (0,_wordpress_rich_text__WEBPACK_IMPORTED_MODULE_2__.getActiveFormats)(props.value).filter(format => format.type === formatName)[0];
// console.log(activeFormat);
// console.log(value);
const post = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_5__.useSelect)(select => {
if (activeFormat && activeFormat.attributes.definitionId) {
return select("core").getEntityRecord("postType", "vocabulaire", activeFormat.attributes.definitionId);
const activeFormat = (0,_wordpress_rich_text__WEBPACK_IMPORTED_MODULE_2__.getActiveFormats)(value).filter(format => format.type === formatName)[0];
const lang = getAdminLanguageFromCookie("wp-wpml_current_language");
function getAdminLanguageFromCookie(c_name) {
var c_value = document.cookie,
c_start = c_value.indexOf(" " + c_name + "=");
if (c_start == -1) c_start = c_value.indexOf(c_name + "=");
if (c_start == -1) {
c_value = null;
} else {
c_start = c_value.indexOf("=", c_start) + 1;
var c_end = c_value.indexOf(";", c_start);
if (c_end == -1) {
c_end = c_value.length;
}
});
if (post && pendingDefinition) {
// console.log("#### Retrieved Post");
// console.log(post);
onChange((0,_wordpress_rich_text__WEBPACK_IMPORTED_MODULE_2__.applyFormat)(value, {
type: formatName,
attributes: {
dataTooltipDefinition: post.acf.definition,
definitionId: activeFormat.attributes.definitionId,
dataTooltipWord: activeFormat.attributes.dataTooltipWord
c_value = unescape(c_value.substring(c_start, c_end));
}
}));
setPendingDefinition(false);
return c_value;
}
function removeFormat() {
setIsPopoverOpen(false);
@ -259,7 +256,6 @@ const Edit = props => {
}));
}
function setFormat(postDatas) {
// console.log(postDatas);
setPendingDefinition(true);
setIsPopoverOpen(false);
onChange((0,_wordpress_rich_text__WEBPACK_IMPORTED_MODULE_2__.applyFormat)(value, {
@ -270,6 +266,22 @@ const Edit = props => {
}
}));
}
const post = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_5__.useSelect)(select => {
if (activeFormat && activeFormat.attributes.definitionId) {
return select("core").getEntityRecord("postType", "vocabulaire", activeFormat.attributes.definitionId);
}
});
if (post && pendingDefinition) {
onChange((0,_wordpress_rich_text__WEBPACK_IMPORTED_MODULE_2__.applyFormat)(value, {
type: formatName,
attributes: {
dataTooltipDefinition: post.acf.definition,
definitionId: activeFormat.attributes.definitionId,
dataTooltipWord: activeFormat.attributes.dataTooltipWord
}
}));
setPendingDefinition(false);
}
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__.BlockControls, null, isPopoverOpen && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.Popover, {
onClose: () => setIsPopoverOpen(false),
className: "popover_tooltip_field"
@ -283,7 +295,8 @@ const Edit = props => {
} : "",
suggestionsQuery: {
type: "post",
subtype: "vocabulaire"
subtype: "vocabulaire",
lang: lang
},
isCollapsed: true,
onChange: postDatas => setFormat(postDatas)
@ -294,9 +307,7 @@ const Edit = props => {
onClick: () => {
setIsPopoverOpen(true);
}
}), isActive && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.ToolbarButton
// isActive={isActive}
, {
}), isActive && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.ToolbarButton, {
icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_6__["default"],
label: "Supprimer la tooltip",
onClick: () => {
@ -318,10 +329,10 @@ const Edit = props => {
/***/ }),
/***/ "./src/format-types/brochure.css":
/*!***************************************!*\
!*** ./src/format-types/brochure.css ***!
\***************************************/
/***/ "./src/format-types/brochure/brochure.css":
/*!************************************************!*\
!*** ./src/format-types/brochure/brochure.css ***!
\************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
@ -330,10 +341,10 @@ __webpack_require__.r(__webpack_exports__);
/***/ }),
/***/ "./src/format-types/tooltip.css":
/*!**************************************!*\
!*** ./src/format-types/tooltip.css ***!
\**************************************/
/***/ "./src/format-types/tooltip/tooltip.css":
/*!**********************************************!*\
!*** ./src/format-types/tooltip/tooltip.css ***!
\**********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
@ -487,11 +498,11 @@ var __webpack_exports__ = {};
!*** ./src/index.js ***!
\**********************/
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _format_types_tooltip_css__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./format-types/tooltip.css */ "./src/format-types/tooltip.css");
/* harmony import */ var _format_types_tooltip_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./format-types/tooltip.js */ "./src/format-types/tooltip.js");
/* harmony import */ var _format_types_tooltip_tooltip_css__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./format-types/tooltip/tooltip.css */ "./src/format-types/tooltip/tooltip.css");
/* harmony import */ var _format_types_tooltip_tooltip_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./format-types/tooltip/tooltip.js */ "./src/format-types/tooltip/tooltip.js");
/* harmony import */ var _blocks_utilities_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../blocks/utilities.js */ "./blocks/utilities.js");
/* harmony import */ var _format_types_brochure_css__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./format-types/brochure.css */ "./src/format-types/brochure.css");
/* harmony import */ var _format_types_brochure_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./format-types/brochure.js */ "./src/format-types/brochure.js");
/* harmony import */ var _format_types_brochure_brochure_css__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./format-types/brochure/brochure.css */ "./src/format-types/brochure/brochure.css");
/* harmony import */ var _format_types_brochure_brochure_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./format-types/brochure/brochure.js */ "./src/format-types/brochure/brochure.js");

2
build/index.js.map
View File

File diff suppressed because one or more lines are too long

8
index.php
View File

@ -79,10 +79,10 @@ add_action('enqueue_block_editor_assets', 'homegrade_blocks_enqueue_editor_asset
function blocks_course_plugin_enqueue_assets()
{
$asset_file = include(plugin_dir_path(__FILE__) . 'build/index.asset.php');
wp_enqueue_script('homegrade-blocks-tooltipjs', plugin_dir_url(__FILE__) . 'src/format-types/tooltip-front.js');
wp_enqueue_style('homegrade-blocks-tooltipcss', plugin_dir_url(__FILE__) . 'src/format-types/tooltip.css');
wp_enqueue_script('homegrade-blocks-brochurejs', plugin_dir_url(__FILE__) . 'src/format-types/brochure-front.js');
wp_enqueue_style('homegrade-blocks-brochurecss', plugin_dir_url(__FILE__) . 'src/format-types/brochure.css');
wp_enqueue_script('homegrade-blocks-tooltipjs', plugin_dir_url(__FILE__) . 'src/format-types/tooltip/tooltip-front.js');
wp_enqueue_style('homegrade-blocks-tooltipcss', plugin_dir_url(__FILE__) . 'src/format-types/tooltip/tooltip.css');
wp_enqueue_script('homegrade-blocks-brochurejs', plugin_dir_url(__FILE__) . 'src/format-types/brochure/brochure-front.js');
wp_enqueue_style('homegrade-blocks-brochurecss', plugin_dir_url(__FILE__) . 'src/format-types/brochure/brochure.css');
wp_localize_script('homegrade-blocks-brochurejs', 'img_path_datas', array(
'downloadIconPath' => plugin_dir_url(__FILE__) . '/src/img/icon_brochure_download.svg'

6
src/format-types/brochure-front.js → src/format-types/brochure/brochure-front.js
View File

@ -1,16 +1,10 @@
// import downloadBrochureIcon from "../img/icon_brochure_download.svg";
window.addEventListener("DOMContentLoaded", (event) => {
// let tooltips = document.querySelectorAll(".tooltip-word");
let brochureLinks = document.querySelectorAll(".brochure-link-format");
// console.log("SALUT");
// console.log(tooltips);
// alert("SALUT");
const iconSrc = img_path_datas.downloadIconPath;
brochureLinks.forEach((brochureLink) => {
// console.log(brochureLink);
const brochureLinkIcon = document.createElement("img");
brochureLinkIcon.src = iconSrc;
brochureLinkIcon.classList.add("brochure-download-icon");

0
src/format-types/brochure.css → src/format-types/brochure/brochure.css
View File

32
src/format-types/brochure.js → src/format-types/brochure/brochure.js
View File

@ -1,4 +1,4 @@
import { registerFormatType, toggleFormat, getActiveFormats } from "@wordpress/rich-text";
import { registerFormatType, toggleFormat, applyFormat, getActiveFormats } from "@wordpress/rich-text";
import { __ } from "@wordpress/i18n";
import { BlockControls, __experimentalLinkControl as LinkControl } from "@wordpress/block-editor";
import { Popover, Button } from "@wordpress/components";
@ -8,22 +8,20 @@ import { check, trash } from "@wordpress/icons";
import { useState } from "@wordpress/element";
const formatName = "homegrade-format/brochure-format";
const BrochureLinkFormatButton = (props) => {
const { isActive, value, onChange } = props;
const [isPopoverOpen, setIsPopoverOpen] = useState(false);
const [linkValue, setLinkValue] = useState("");
const activeFormat = getActiveFormats(props.value).filter(
(format) => format.type === "homegrade-format/brochure-format"
)[0];
const activeFormat = getActiveFormats(value).filter((format) => format.type === formatName)[0];
// console.log(activeFormat);
// console.log(getActiveFormats(props.value));
function handleFormat() {
function setFormat() {
setIsPopoverOpen(!isPopoverOpen);
onChange(
toggleFormat(value, {
type: "homegrade-format/brochure-format",
applyFormat(value, {
type: formatName,
attributes: {
href: linkValue.url,
target: "_blank",
@ -38,7 +36,7 @@ const BrochureLinkFormatButton = (props) => {
setLinkValue("");
onChange(
toggleFormat(value, {
type: "homegrade-format/brochure-format",
type: formatName,
})
);
}
@ -51,28 +49,34 @@ const BrochureLinkFormatButton = (props) => {
onClose={() => setIsPopoverOpen(false)}
className='popover_tooltip_field'>
<LinkControl
// prefetch pdf attachment
suggestionsQuery={{
type: "attachment",
subtype: "pdf",
}}
value={linkValue}
onChange={(value) => {
// console.log(value);
setLinkValue(value);
}}
/>
<Button
icon={check}
variant='primary'
onClick={() => {
setIsPopoverOpen(!isPopoverOpen);
handleFormat();
setFormat();
}}>
Valider
</Button>
</Popover>
)}
<ToolbarGroup>
<ToolbarGroup className='test'>
<ToolbarButton
isActive={isActive}
icon={!isActive ? "book" : trash}
@ -92,7 +96,7 @@ const BrochureLinkFormatButton = (props) => {
};
registerFormatType("homegrade-format/brochure-format", {
title: __("Brochure", "homegrade-format"),
title: "Lien Brochure",
tagName: "a",
className: "brochure-link-format",
edit: BrochureLinkFormatButton,

14
src/format-types/tooltip-front.js → src/format-types/tooltip/tooltip-front.js
View File

@ -1,5 +1,4 @@
window.addEventListener("DOMContentLoaded", (event) => {
// let tooltips = document.querySelectorAll(".tooltip-word");
let tooltipWords = document.querySelectorAll("[data-tooltip-definition]");
tooltipWords.forEach((tooltipWord) => {
@ -7,11 +6,16 @@ window.addEventListener("DOMContentLoaded", (event) => {
const tooltipPopup = document.createElement("div");
tooltipPopup.className = "tooltip-popup";
const tooltipContent = tooltipWord.getAttribute("data-tooltip-definition");
const tooltipContentParagraph = document.createElement("p");
tooltipContentParagraph.textContent = tooltipContent;
const tooltipDefinition = document.createElement("p");
tooltipDefinition.textContent = tooltipWord.getAttribute("data-tooltip-definition");
tooltipDefinition.className = "tooltip-popup__definition";
tooltipPopup.appendChild(tooltipContentParagraph);
const tooltipTitle = document.createElement("h5");
tooltipTitle.textContent = tooltipWord.getAttribute("data-tooltip-word");
tooltipTitle.className = "tooltip-popup__title";
tooltipPopup.appendChild(tooltipTitle);
tooltipPopup.appendChild(tooltipDefinition);
tooltipWord.appendChild(tooltipPopup);
});

27
src/format-types/tooltip.css → src/format-types/tooltip/tooltip.css
View File

@ -1,10 +1,3 @@
.popover_tooltip_field {
.components-popover__content {
padding: 10px !important;
min-width: 200px;
}
}
.tooltip-word {
padding-top: 12px;
position: relative;
@ -19,9 +12,11 @@
position: absolute;
top: -6px;
left: 50%;
text-align: center;
text-align: left;
transform: translate(-50%, -100%);
padding: 10px;
max-width: 300px;
width: max-content;
}
.tooltip-popup:after {
content: "";
@ -35,6 +30,20 @@
transform: translate(-50%, -50%) rotate(45deg);
box-shadow: 4px 4px 4px rgba(0, 0, 0, 0.08);
}
.tooltip-popup p {
.tooltip-popup__title {
font-weight: bold;
color: black !important;
padding-bottom: 10px;
}
.tooltip-popup__definition {
color: black !important;
margin: 0 !important;
}
/* FOR THE EDITOR */
.popover_tooltip_field {
.components-popover__content {
padding: 10px !important;
min-width: 200px;
}
}

74
src/format-types/tooltip.js → src/format-types/tooltip/tooltip.js
View File

@ -4,7 +4,7 @@ import { registerFormatType, toggleFormat, applyFormat, getActiveFormats } from
import { BlockControls, __experimentalLinkControl as LinkControl } from "@wordpress/block-editor";
import { Popover, ToolbarGroup, ToolbarButton } from "@wordpress/components";
import { trash } from "@wordpress/icons";
import { useState, useEffect } from "@wordpress/element";
import { useState } from "@wordpress/element";
import { useSelect } from "@wordpress/data"; // pour les querry
const formatName = "homegrade-format/tooltip";
@ -12,39 +12,26 @@ const formatName = "homegrade-format/tooltip";
const Edit = (props) => {
const { isActive, value, onChange } = props;
const [isPopoverOpen, setIsPopoverOpen] = useState(false);
const [popoverText, setPopoverText] = useState("");
const [pendingDefinition, setPendingDefinition] = useState(false);
const activeFormat = getActiveFormats(props.value).filter((format) => format.type === formatName)[0];
// console.log(activeFormat);
// console.log(value);
const post = useSelect((select) => {
if (activeFormat && activeFormat.attributes.definitionId) {
return select("core").getEntityRecord(
"postType",
"vocabulaire",
activeFormat.attributes.definitionId
);
const activeFormat = getActiveFormats(value).filter((format) => format.type === formatName)[0];
const lang = getAdminLanguageFromCookie("wp-wpml_current_language");
function getAdminLanguageFromCookie(c_name) {
var c_value = document.cookie,
c_start = c_value.indexOf(" " + c_name + "=");
if (c_start == -1) c_start = c_value.indexOf(c_name + "=");
if (c_start == -1) {
c_value = null;
} else {
c_start = c_value.indexOf("=", c_start) + 1;
var c_end = c_value.indexOf(";", c_start);
if (c_end == -1) {
c_end = c_value.length;
}
});
if (post && pendingDefinition) {
// console.log("#### Retrieved Post");
// console.log(post);
onChange(
applyFormat(value, {
type: formatName,
attributes: {
dataTooltipDefinition: post.acf.definition,
definitionId: activeFormat.attributes.definitionId,
dataTooltipWord: activeFormat.attributes.dataTooltipWord,
},
})
);
setPendingDefinition(false);
c_value = unescape(c_value.substring(c_start, c_end));
}
return c_value;
}
function removeFormat() {
setIsPopoverOpen(false);
onChange(
@ -54,7 +41,6 @@ const Edit = (props) => {
);
}
function setFormat(postDatas) {
// console.log(postDatas);
setPendingDefinition(true);
setIsPopoverOpen(false);
@ -69,6 +55,30 @@ const Edit = (props) => {
);
}
const post = useSelect((select) => {
if (activeFormat && activeFormat.attributes.definitionId) {
return select("core").getEntityRecord(
"postType",
"vocabulaire",
activeFormat.attributes.definitionId
);
}
});
if (post && pendingDefinition) {
onChange(
applyFormat(value, {
type: formatName,
attributes: {
dataTooltipDefinition: post.acf.definition,
definitionId: activeFormat.attributes.definitionId,
dataTooltipWord: activeFormat.attributes.dataTooltipWord,
},
})
);
setPendingDefinition(false);
}
return (
<>
<BlockControls>
@ -93,6 +103,7 @@ const Edit = (props) => {
suggestionsQuery={{
type: "post",
subtype: "vocabulaire",
lang: lang,
}}
isCollapsed={true}
onChange={(postDatas) => setFormat(postDatas)}
@ -111,7 +122,6 @@ const Edit = (props) => {
/>
{isActive && (
<ToolbarButton
// isActive={isActive}
icon={trash}
label={"Supprimer la tooltip"}
onClick={() => {

8
src/index.js
View File

@ -1,6 +1,6 @@
import "./format-types/tooltip.css";
import "./format-types/tooltip.js";
import "./format-types/tooltip/tooltip.css";
import "./format-types/tooltip/tooltip.js";
import "../blocks/utilities.js";
import "./format-types/brochure.css";
import "./format-types/brochure.js";
import "./format-types/brochure/brochure.css";
import "./format-types/brochure/brochure.js";