FEATURE Handling a black and white version
All checks were successful
continuous-integration/drone/push Build is passing
All checks were successful
continuous-integration/drone/push Build is passing
This commit is contained in:
parent
f487c95751
commit
2659311e7a
|
|
@ -37,6 +37,10 @@
|
|||
},
|
||||
"coverAlt": {
|
||||
"type": "string"
|
||||
},
|
||||
"blackWhiteCoverFilter": {
|
||||
"type": "boolean",
|
||||
"default": true
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -42,6 +42,10 @@ return array(
|
|||
),
|
||||
'coverAlt' => array(
|
||||
'type' => 'string'
|
||||
),
|
||||
'blackWhiteCoverFilter' => array(
|
||||
'type' => 'boolean',
|
||||
'default' => true
|
||||
)
|
||||
)
|
||||
)
|
||||
|
|
|
|||
|
|
@ -1 +1 @@
|
|||
<?php return array('dependencies' => array('react-jsx-runtime', 'wp-block-editor', 'wp-blocks', 'wp-components', 'wp-i18n', 'wp-primitives'), 'version' => '5e9d2c0b3f418fe8c996');
|
||||
<?php return array('dependencies' => array('react-jsx-runtime', 'wp-block-editor', 'wp-blocks', 'wp-components', 'wp-i18n', 'wp-primitives'), 'version' => 'f9b21b66fbfc32799aca');
|
||||
|
|
|
|||
|
|
@ -79,7 +79,7 @@ function Cover({
|
|||
\************************/
|
||||
/***/ ((module) => {
|
||||
|
||||
module.exports = /*#__PURE__*/JSON.parse('{"$schema":"https://schemas.wp.org/trunk/block.json","apiVersion":3,"name":"carhop-blocks/narrative-card","version":"0.1.0","title":"Carte narrative","category":"carhop-blocks","icon":"smiley","description":"Une carte narrative","example":{},"supports":{"html":false},"textdomain":"carhop-blocks","editorScript":"file:./index.js","editorStyle":"file:./index.css","style":"file:./style-index.css","viewScript":"file:./view.js","attributes":{"hasCover":{"type":"boolean","default":true},"coverPosition":{"type":"string","default":"right","enum":["left","right"]},"coverId":{"type":"number"},"coverUrl":{"type":"string"},"coverAlt":{"type":"string"}}}');
|
||||
module.exports = /*#__PURE__*/JSON.parse('{"$schema":"https://schemas.wp.org/trunk/block.json","apiVersion":3,"name":"carhop-blocks/narrative-card","version":"0.1.0","title":"Carte narrative","category":"carhop-blocks","icon":"smiley","description":"Une carte narrative","example":{},"supports":{"html":false},"textdomain":"carhop-blocks","editorScript":"file:./index.js","editorStyle":"file:./index.css","style":"file:./style-index.css","viewScript":"file:./view.js","attributes":{"hasCover":{"type":"boolean","default":true},"coverPosition":{"type":"string","default":"right","enum":["left","right"]},"coverId":{"type":"number"},"coverUrl":{"type":"string"},"coverAlt":{"type":"string"},"blackWhiteCoverFilter":{"type":"boolean","default":true}}}');
|
||||
|
||||
/***/ }),
|
||||
|
||||
|
|
@ -120,9 +120,11 @@ function Edit({
|
|||
coverUrl,
|
||||
coverAlt,
|
||||
coverPosition,
|
||||
hasCover
|
||||
hasCover,
|
||||
blackWhiteCoverFilter
|
||||
} = attributes;
|
||||
const colors = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__.useSetting)("color.palette.theme");
|
||||
console.log(blackWhiteCoverFilter);
|
||||
function setCoverAttributes(cover) {
|
||||
setAttributes({
|
||||
coverId: cover.id,
|
||||
|
|
@ -187,12 +189,30 @@ function Edit({
|
|||
label: "Droite",
|
||||
value: "right"
|
||||
})]
|
||||
}), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.__experimentalToggleGroupControl, {
|
||||
className: "deligraph-blocks__variant",
|
||||
isBlock: true,
|
||||
label: "Filtre",
|
||||
onChange: value => {
|
||||
console.log(value);
|
||||
setAttributes({
|
||||
blackWhiteCoverFilter: value === "true"
|
||||
});
|
||||
},
|
||||
value: blackWhiteCoverFilter ? "true" : "false",
|
||||
children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.__experimentalToggleGroupControlOption, {
|
||||
label: "Noir et blanc",
|
||||
value: "true"
|
||||
}), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.__experimentalToggleGroupControlOption, {
|
||||
label: "Aucun",
|
||||
value: "false"
|
||||
})]
|
||||
})]
|
||||
})]
|
||||
})
|
||||
}), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("div", {
|
||||
...(0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__.useBlockProps)({
|
||||
className: `narrative-card ${hasCover ? `narrative-card--has-cover narrative-card--has-cover--${coverPosition}` : ""}`
|
||||
className: `narrative-card ${hasCover ? `narrative-card--has-cover narrative-card--has-cover--${coverPosition} ${blackWhiteCoverFilter ? "narrative-card--black-white-cover-filter" : ""}` : ""}`
|
||||
}),
|
||||
children: [shouldShowCoverLeft && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_Cover__WEBPACK_IMPORTED_MODULE_4__["default"], {
|
||||
coverUrl: coverUrl,
|
||||
|
|
@ -293,11 +313,12 @@ function save({
|
|||
hasCover,
|
||||
coverUrl,
|
||||
coverAlt,
|
||||
coverPosition
|
||||
coverPosition,
|
||||
blackWhiteCoverFilter
|
||||
} = attributes;
|
||||
return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)("div", {
|
||||
..._wordpress_block_editor__WEBPACK_IMPORTED_MODULE_0__.useBlockProps.save({
|
||||
className: `narrative-card ${hasCover ? `narrative-card--has-cover narrative-card--has-cover--${coverPosition}` : ""}`
|
||||
className: `narrative-card ${hasCover ? `narrative-card--has-cover narrative-card--has-cover--${coverPosition} ${blackWhiteCoverFilter ? "narrative-card--black-white-cover-filter" : ""}` : ""}`
|
||||
}),
|
||||
children: [hasCover && coverPosition === "left" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)("div", {
|
||||
className: "narrative-card__cover",
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -37,6 +37,10 @@
|
|||
},
|
||||
"coverAlt": {
|
||||
"type": "string"
|
||||
},
|
||||
"blackWhiteCoverFilter": {
|
||||
"type": "boolean",
|
||||
"default": true
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -21,8 +21,16 @@ import { lock, trash } from "@wordpress/icons";
|
|||
import CoverImage from "./Cover";
|
||||
|
||||
export default function Edit({ attributes, setAttributes }) {
|
||||
const { coverId, coverUrl, coverAlt, coverPosition, hasCover } = attributes;
|
||||
const {
|
||||
coverId,
|
||||
coverUrl,
|
||||
coverAlt,
|
||||
coverPosition,
|
||||
hasCover,
|
||||
blackWhiteCoverFilter,
|
||||
} = attributes;
|
||||
const colors = useSetting("color.palette.theme");
|
||||
console.log(blackWhiteCoverFilter);
|
||||
|
||||
function setCoverAttributes(cover) {
|
||||
setAttributes({
|
||||
|
|
@ -93,6 +101,20 @@ export default function Edit({ attributes, setAttributes }) {
|
|||
<ToggleGroupControlOption label="Gauche" value="left" />
|
||||
<ToggleGroupControlOption label="Droite" value="right" />
|
||||
</ToggleGroupControl>
|
||||
|
||||
<ToggleGroupControl
|
||||
className="deligraph-blocks__variant"
|
||||
isBlock
|
||||
label="Filtre"
|
||||
onChange={(value) => {
|
||||
console.log(value);
|
||||
setAttributes({ blackWhiteCoverFilter: value === "true" });
|
||||
}}
|
||||
value={blackWhiteCoverFilter ? "true" : "false"}
|
||||
>
|
||||
<ToggleGroupControlOption label="Noir et blanc" value="true" />
|
||||
<ToggleGroupControlOption label="Aucun" value="false" />
|
||||
</ToggleGroupControl>
|
||||
</div>
|
||||
)}
|
||||
</PanelBody>
|
||||
|
|
@ -101,7 +123,11 @@ export default function Edit({ attributes, setAttributes }) {
|
|||
{...useBlockProps({
|
||||
className: `narrative-card ${
|
||||
hasCover
|
||||
? `narrative-card--has-cover narrative-card--has-cover--${coverPosition}`
|
||||
? `narrative-card--has-cover narrative-card--has-cover--${coverPosition} ${
|
||||
blackWhiteCoverFilter
|
||||
? "narrative-card--black-white-cover-filter"
|
||||
: ""
|
||||
}`
|
||||
: ""
|
||||
}`,
|
||||
})}
|
||||
|
|
|
|||
|
|
@ -2,14 +2,19 @@ import { useBlockProps } from "@wordpress/block-editor";
|
|||
import { InnerBlocks } from "@wordpress/block-editor";
|
||||
|
||||
export default function save({ attributes }) {
|
||||
const { hasCover, coverUrl, coverAlt, coverPosition } = attributes;
|
||||
const { hasCover, coverUrl, coverAlt, coverPosition, blackWhiteCoverFilter } =
|
||||
attributes;
|
||||
|
||||
return (
|
||||
<div
|
||||
{...useBlockProps.save({
|
||||
className: `narrative-card ${
|
||||
hasCover
|
||||
? `narrative-card--has-cover narrative-card--has-cover--${coverPosition}`
|
||||
? `narrative-card--has-cover narrative-card--has-cover--${coverPosition} ${
|
||||
blackWhiteCoverFilter
|
||||
? "narrative-card--black-white-cover-filter"
|
||||
: ""
|
||||
}`
|
||||
: ""
|
||||
}`,
|
||||
})}
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user