From 7909796a531036bcd5c306b82104d49f8ff2453b Mon Sep 17 00:00:00 2001 From: osmdik Date: Thu, 28 Sep 2023 15:32:10 +0900 Subject: [PATCH 1/7] change --- package-lock.json | 175 +++++++++++----------- package.json | 5 +- src/ControlsPanel.js | 191 ++++++++++++++++++++++++ src/ControlsPanelHeader.js | 96 ++++++++++++ src/block.json | 128 +++++++++++----- src/editor.scss | 41 ++++++ src/index.js | 276 +++++++++-------------------------- src/index.php | 292 +++++++++++++++++++------------------ 8 files changed, 724 insertions(+), 480 deletions(-) create mode 100644 src/ControlsPanel.js create mode 100644 src/ControlsPanelHeader.js diff --git a/package-lock.json b/package-lock.json index 3313a57..e02abab 100644 --- a/package-lock.json +++ b/package-lock.json @@ -9,7 +9,8 @@ "version": "0.1.0", "license": "GPL-2.0-or-later", "dependencies": { - "@wordpress/env": "^5.15.0" + "@wordpress/env": "^5.15.0", + "@wordpress/icons": "^9.31.0" }, "devDependencies": { "@wordpress/scripts": "^26.1.0", @@ -1855,7 +1856,6 @@ "version": "7.21.0", "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.21.0.tgz", "integrity": "sha512-xwII0//EObnq89Ji5AKYQaRYiW/nZ3llSv29d49IuxPhKbtJoLP+9QUUZ4nVragQVtaVGeZrpB+ZtG/Pdy/POw==", - "dev": true, "dependencies": { "regenerator-runtime": "^0.13.11" }, @@ -3284,8 +3284,7 @@ "node_modules/@types/prop-types": { "version": "15.7.5", "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.5.tgz", - "integrity": "sha512-JCB8C6SnDoQf0cNycqd/35A7MjcnK+ZTqE7judS6o7utxUCg6imJg3QK2qzHKszlTjcj2cn+NwMB2i96ubpj7w==", - "dev": true + "integrity": "sha512-JCB8C6SnDoQf0cNycqd/35A7MjcnK+ZTqE7judS6o7utxUCg6imJg3QK2qzHKszlTjcj2cn+NwMB2i96ubpj7w==" }, "node_modules/@types/qs": { "version": "6.9.7", @@ -3303,7 +3302,6 @@ "version": "18.0.35", "resolved": "https://registry.npmjs.org/@types/react/-/react-18.0.35.tgz", "integrity": "sha512-6Laome31HpetaIUGFWl1VQ3mdSImwxtFZ39rh059a1MNnKGqBpC88J6NJ8n/Is3Qx7CefDGLgf/KhN/sYCf7ag==", - "dev": true, "dependencies": { "@types/prop-types": "*", "@types/scheduler": "*", @@ -3314,7 +3312,6 @@ "version": "18.0.11", "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-18.0.11.tgz", "integrity": "sha512-O38bPbI2CWtgw/OoQoY+BRelw7uysmXbWvw3nLWO21H1HSh+GOlqPuXshJfjmpNlKiiSDG9cc1JZAaMmVdcTlw==", - "dev": true, "dependencies": { "@types/react": "*" } @@ -3336,8 +3333,7 @@ "node_modules/@types/scheduler": { "version": "0.16.3", "resolved": "https://registry.npmjs.org/@types/scheduler/-/scheduler-0.16.3.tgz", - "integrity": "sha512-5cJ8CB4yAx7BH1oMvdU0Jh9lrEXyPkar6F9G/ERswkCuvP4KQZfZkSjcMbAICCpQTN4OuZn8tz0HiKv9TGZgrQ==", - "dev": true + "integrity": "sha512-5cJ8CB4yAx7BH1oMvdU0Jh9lrEXyPkar6F9G/ERswkCuvP4KQZfZkSjcMbAICCpQTN4OuZn8tz0HiKv9TGZgrQ==" }, "node_modules/@types/semver": { "version": "7.3.13", @@ -4031,15 +4027,14 @@ } }, "node_modules/@wordpress/element": { - "version": "5.7.0", - "resolved": "https://registry.npmjs.org/@wordpress/element/-/element-5.7.0.tgz", - "integrity": "sha512-sztnsbrmvsiZIxXGvvKx4D/xfhKIKEylDh15Y6PqUpxMqznmnf5/+fxLc9zeVAkV/c+Yd8xp3DxUH230tCAkpQ==", - "dev": true, + "version": "5.17.0", + "resolved": "https://registry.npmjs.org/@wordpress/element/-/element-5.17.0.tgz", + "integrity": "sha512-sVjVWlKnpzTM4kfwfTgT9TtCcqqb3MqII9cLzM3DCVDFIUrudEUlbqX9lUCnnSfWCjoQ/YPaWg4LikKrRVmPQw==", "dependencies": { "@babel/runtime": "^7.16.0", "@types/react": "^18.0.21", "@types/react-dom": "^18.0.6", - "@wordpress/escape-html": "^2.30.0", + "@wordpress/escape-html": "^2.40.0", "change-case": "^4.1.2", "is-plain-object": "^5.0.0", "react": "^18.2.0", @@ -4072,10 +4067,9 @@ } }, "node_modules/@wordpress/escape-html": { - "version": "2.30.0", - "resolved": "https://registry.npmjs.org/@wordpress/escape-html/-/escape-html-2.30.0.tgz", - "integrity": "sha512-A0FVcCPSfzCsuoLJOGCKOj3ygg6lWptugtyFcXoELG15AJ3ivfeJEeghZo77YpaWCmyCf0yTC56qbaAa2c48uw==", - "dev": true, + "version": "2.40.0", + "resolved": "https://registry.npmjs.org/@wordpress/escape-html/-/escape-html-2.40.0.tgz", + "integrity": "sha512-hWbtydaYHud/qbXauCNR1h5pfmXJQwzdKfdQUMqEjms2sqm2nQQXGxi/t8CLc2HjrNenzHqOZaonfQ/nx+1l1A==", "dependencies": { "@babel/runtime": "^7.16.0" }, @@ -4152,6 +4146,19 @@ "url": "https://github.com/sponsors/sindresorhus" } }, + "node_modules/@wordpress/icons": { + "version": "9.31.0", + "resolved": "https://registry.npmjs.org/@wordpress/icons/-/icons-9.31.0.tgz", + "integrity": "sha512-o8Yj3+BtsrwytN1tSRyINsAAXACdlgS+ELl6HnB3iE3K+qi2KzJGFVZPXS7vDZRPDxt6foNVk1LDp60hbEKvYQ==", + "dependencies": { + "@babel/runtime": "^7.16.0", + "@wordpress/element": "^5.17.0", + "@wordpress/primitives": "^3.38.0" + }, + "engines": { + "node": ">=12" + } + }, "node_modules/@wordpress/jest-console": { "version": "7.1.0", "resolved": "https://registry.npmjs.org/@wordpress/jest-console/-/jest-console-7.1.0.tgz", @@ -4225,6 +4232,19 @@ "prettier": ">=2" } }, + "node_modules/@wordpress/primitives": { + "version": "3.38.0", + "resolved": "https://registry.npmjs.org/@wordpress/primitives/-/primitives-3.38.0.tgz", + "integrity": "sha512-quRkAzZknTCqrBI/HvJ2Eas0x1irU6m2GbV/8opyZoE/2BAN+W07JgDhE8Aukd+3q03nfpKPeRJAO1dZ4/Vnuw==", + "dependencies": { + "@babel/runtime": "^7.16.0", + "@wordpress/element": "^5.17.0", + "classnames": "^2.3.1" + }, + "engines": { + "node": ">=12" + } + }, "node_modules/@wordpress/scripts": { "version": "26.1.0", "resolved": "https://registry.npmjs.org/@wordpress/scripts/-/scripts-26.1.0.tgz", @@ -5264,7 +5284,6 @@ "version": "4.1.2", "resolved": "https://registry.npmjs.org/camel-case/-/camel-case-4.1.2.tgz", "integrity": "sha512-gxGWBrTT1JuMx6R+o5PTXMmUnhnVzLQ9SNutD4YqKtI6ap897t3tKECYla6gCWEkplXnlNybEkZg9GEGxKFCgw==", - "dev": true, "dependencies": { "pascal-case": "^3.1.2", "tslib": "^2.0.3" @@ -5353,7 +5372,6 @@ "version": "1.0.4", "resolved": "https://registry.npmjs.org/capital-case/-/capital-case-1.0.4.tgz", "integrity": "sha512-ds37W8CytHgwnhGGTi88pcPyR15qoNkOpYwmMMfnWqqWgESapLqvDx6huFjQ5vqWSn2Z06173XNA7LtMOeUh1A==", - "dev": true, "dependencies": { "no-case": "^3.0.4", "tslib": "^2.0.3", @@ -5379,7 +5397,6 @@ "version": "4.1.2", "resolved": "https://registry.npmjs.org/change-case/-/change-case-4.1.2.tgz", "integrity": "sha512-bSxY2ws9OtviILG1EiY5K7NNxkqg/JnRnFxLtKQ96JaviiIxi7djMrSd0ECT9AC+lttClmYwKw53BWpOMblo7A==", - "dev": true, "dependencies": { "camel-case": "^4.1.2", "capital-case": "^1.0.4", @@ -5517,6 +5534,11 @@ "integrity": "sha512-cOU9usZw8/dXIXKtwa8pM0OTJQuJkxMN6w30csNRUerHfeQ5R6U3kkU/FtJeIf3M202OHfY2U8ccInBG7/xogA==", "dev": true }, + "node_modules/classnames": { + "version": "2.3.2", + "resolved": "https://registry.npmjs.org/classnames/-/classnames-2.3.2.tgz", + "integrity": "sha512-CSbhY4cFEJRe6/GQzIk5qXZ4Jeg5pcsP7b5peFSDpffpe1cqjASH/n9UTjBwOp6XpMSTwQ8Za2K5V02ueA7Tmw==" + }, "node_modules/clean-webpack-plugin": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/clean-webpack-plugin/-/clean-webpack-plugin-3.0.0.tgz", @@ -5786,7 +5808,6 @@ "version": "3.0.4", "resolved": "https://registry.npmjs.org/constant-case/-/constant-case-3.0.4.tgz", "integrity": "sha512-I2hSBi7Vvs7BEuJDr5dDHfzb/Ruj3FyvFyh7KLilAjNQw3Be+xgqUBA2W6scVEcL0hL1dwPRtIqEPVUCKkSsyQ==", - "dev": true, "dependencies": { "no-case": "^3.0.4", "tslib": "^2.0.3", @@ -6330,8 +6351,7 @@ "node_modules/csstype": { "version": "3.1.2", "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.2.tgz", - "integrity": "sha512-I7K1Uu0MBPzaFKg4nI5Q7Vs2t+3gWWW648spaF+Rg7pI9ds18Ugn+lvg4SHczUdKlHI5LWBXyqfS8+DufyBsgQ==", - "dev": true + "integrity": "sha512-I7K1Uu0MBPzaFKg4nI5Q7Vs2t+3gWWW648spaF+Rg7pI9ds18Ugn+lvg4SHczUdKlHI5LWBXyqfS8+DufyBsgQ==" }, "node_modules/cwd": { "version": "0.10.0", @@ -6831,7 +6851,6 @@ "version": "3.0.4", "resolved": "https://registry.npmjs.org/dot-case/-/dot-case-3.0.4.tgz", "integrity": "sha512-Kv5nKlh6yRrdrGvxeJ2e5y2eRUpkUosIW4A2AS38zwSz27zu7ufDwQPi5Jhs3XAlGNetl3bmnGhQsMtkKJnj3w==", - "dev": true, "dependencies": { "no-case": "^3.0.4", "tslib": "^2.0.3" @@ -8893,7 +8912,6 @@ "version": "2.0.4", "resolved": "https://registry.npmjs.org/header-case/-/header-case-2.0.4.tgz", "integrity": "sha512-H/vuk5TEEVZwrR0lp2zed9OCo1uAILMlx0JEMgC26rzyJJ3N1v6XkwHHXJQdR2doSjcGPM6OKPYoJgf0plJ11Q==", - "dev": true, "dependencies": { "capital-case": "^1.0.4", "tslib": "^2.0.3" @@ -9603,7 +9621,6 @@ "version": "5.0.0", "resolved": "https://registry.npmjs.org/is-plain-object/-/is-plain-object-5.0.0.tgz", "integrity": "sha512-VRSzKkbMm5jMDoKLbltAkFQ5Qr7VDiTFGXxYFXXowVj387GeGNOCsOH6Msy00SGZ3Fp84b1Naa1psqgcCIEP5Q==", - "dev": true, "engines": { "node": ">=0.10.0" } @@ -10522,8 +10539,7 @@ "node_modules/js-tokens": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz", - "integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==", - "dev": true + "integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==" }, "node_modules/js-yaml": { "version": "3.14.1", @@ -10944,7 +10960,6 @@ "version": "1.4.0", "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz", "integrity": "sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==", - "dev": true, "dependencies": { "js-tokens": "^3.0.0 || ^4.0.0" }, @@ -10956,7 +10971,6 @@ "version": "2.0.2", "resolved": "https://registry.npmjs.org/lower-case/-/lower-case-2.0.2.tgz", "integrity": "sha512-7fm3l3NAF9WfN6W3JOmf5drwpVqX78JtoGJ3A6W0a6ZnldM41w2fV5D490psKFTpMds8TJse/eHLFFsNHHjHgg==", - "dev": true, "dependencies": { "tslib": "^2.0.3" } @@ -11591,7 +11605,6 @@ "version": "3.0.4", "resolved": "https://registry.npmjs.org/no-case/-/no-case-3.0.4.tgz", "integrity": "sha512-fgAN3jGAh+RoxUGZHTSOLJIqUc2wmoBwGR4tbpNAKmmovFoWq0OdRkb0VkldReO2a2iBT/OEulG9XSUc10r3zg==", - "dev": true, "dependencies": { "lower-case": "^2.0.2", "tslib": "^2.0.3" @@ -12384,7 +12397,6 @@ "version": "3.0.4", "resolved": "https://registry.npmjs.org/param-case/-/param-case-3.0.4.tgz", "integrity": "sha512-RXlj7zCYokReqWpOPH9oYivUzLYZ5vAPIfEmCTNViosC78F8F0H9y7T7gG2M39ymgutxF5gcFEsyZQSph9Bp3A==", - "dev": true, "dependencies": { "dot-case": "^3.0.4", "tslib": "^2.0.3" @@ -12454,7 +12466,6 @@ "version": "3.1.2", "resolved": "https://registry.npmjs.org/pascal-case/-/pascal-case-3.1.2.tgz", "integrity": "sha512-uWlGT3YSnK9x3BQJaOdcZwrnV6hPpd8jFH1/ucpiLRPh/2zCVJKS19E4GvYHvaCcACn3foXZ0cLB9Wrx1KGe5g==", - "dev": true, "dependencies": { "no-case": "^3.0.4", "tslib": "^2.0.3" @@ -12464,7 +12475,6 @@ "version": "3.0.4", "resolved": "https://registry.npmjs.org/path-case/-/path-case-3.0.4.tgz", "integrity": "sha512-qO4qCFjXqVTrcbPt/hQfhTQ+VhFsqNKOPtytgNKkKxSoEp3XPUQ8ObFuePylOIok5gjn69ry8XiULxCwot3Wfg==", - "dev": true, "dependencies": { "dot-case": "^3.0.4", "tslib": "^2.0.3" @@ -13781,7 +13791,6 @@ "version": "18.2.0", "resolved": "https://registry.npmjs.org/react/-/react-18.2.0.tgz", "integrity": "sha512-/3IjMdb2L9QbBdWiW5e3P2/npwMBaU9mHCSCUzNln0ZCYbcfTsGbTJrU/kGemdH2IWmB2ioZ+zkxtmq6g09fGQ==", - "dev": true, "dependencies": { "loose-envify": "^1.1.0" }, @@ -13793,7 +13802,6 @@ "version": "18.2.0", "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.2.0.tgz", "integrity": "sha512-6IMTriUmvsjHUjNtEDudZfuDQUoWXVxKHhlEGSk81n4YFS+r/Kl99wXiwlVXtPBtJenozv2P+hxDsw9eA7Xo6g==", - "dev": true, "dependencies": { "loose-envify": "^1.1.0", "scheduler": "^0.23.0" @@ -14049,8 +14057,7 @@ "node_modules/regenerator-runtime": { "version": "0.13.11", "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.11.tgz", - "integrity": "sha512-kY1AZVr2Ra+t+piVaJ4gxaFaReZVH40AKNo7UCX6W+dEwBo/2oZJzqfuN1qLq1oL45o56cPaTXELwrTh8Fpggg==", - "dev": true + "integrity": "sha512-kY1AZVr2Ra+t+piVaJ4gxaFaReZVH40AKNo7UCX6W+dEwBo/2oZJzqfuN1qLq1oL45o56cPaTXELwrTh8Fpggg==" }, "node_modules/regenerator-transform": { "version": "0.15.1", @@ -14444,7 +14451,6 @@ "version": "0.23.0", "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.23.0.tgz", "integrity": "sha512-CtuThmgHNg7zIZWAXi3AsyIzA3n4xx7aNyjwC2VJldO2LMVDhFK+63xGqq6CsJH4rTAt6/M+N4GhZiDYPx9eUw==", - "dev": true, "dependencies": { "loose-envify": "^1.1.0" } @@ -14543,7 +14549,6 @@ "version": "3.0.4", "resolved": "https://registry.npmjs.org/sentence-case/-/sentence-case-3.0.4.tgz", "integrity": "sha512-8LS0JInaQMCRoQ7YUytAo/xUu5W2XnQxV2HI/6uM6U7CITS1RqPElr30V6uIqyMKM9lJGRVFy5/4CuzcixNYSg==", - "dev": true, "dependencies": { "no-case": "^3.0.4", "tslib": "^2.0.3", @@ -14807,7 +14812,6 @@ "version": "3.0.4", "resolved": "https://registry.npmjs.org/snake-case/-/snake-case-3.0.4.tgz", "integrity": "sha512-LAOh4z89bGQvl9pFfNF8V146i7o7/CqFPbqzYgP+yYzDIDeS9HaNFtXABamRW+AQzEVODcvE79ljJ+8a9YSdMg==", - "dev": true, "dependencies": { "dot-case": "^3.0.4", "tslib": "^2.0.3" @@ -15997,8 +16001,7 @@ "node_modules/tslib": { "version": "2.5.0", "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.5.0.tgz", - "integrity": "sha512-336iVw3rtn2BUK7ORdIAHTyxHGRIHVReokCR3XjbckJMK7ms8FysBfhLR8IXnAgy7T0PTPNBWKiH514FOW/WSg==", - "dev": true + "integrity": "sha512-336iVw3rtn2BUK7ORdIAHTyxHGRIHVReokCR3XjbckJMK7ms8FysBfhLR8IXnAgy7T0PTPNBWKiH514FOW/WSg==" }, "node_modules/tsutils": { "version": "3.21.0", @@ -16218,7 +16221,6 @@ "version": "2.0.2", "resolved": "https://registry.npmjs.org/upper-case/-/upper-case-2.0.2.tgz", "integrity": "sha512-KgdgDGJt2TpuwBUIjgG6lzw2GWFRCW9Qkfkiv0DxqHHLYJHmtmdUIKcZd8rHgFSjopVTlw6ggzCm1b8MFQwikg==", - "dev": true, "dependencies": { "tslib": "^2.0.3" } @@ -16227,7 +16229,6 @@ "version": "2.0.2", "resolved": "https://registry.npmjs.org/upper-case-first/-/upper-case-first-2.0.2.tgz", "integrity": "sha512-514ppYHBaKwfJRK/pNC6c/OxfGa0obSnAl106u97Ed0I625Nin96KAjttZF6ZL3e1XLtphxnqrOi9iWgm+u+bg==", - "dev": true, "dependencies": { "tslib": "^2.0.3" } @@ -18471,7 +18472,6 @@ "version": "7.21.0", "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.21.0.tgz", "integrity": "sha512-xwII0//EObnq89Ji5AKYQaRYiW/nZ3llSv29d49IuxPhKbtJoLP+9QUUZ4nVragQVtaVGeZrpB+ZtG/Pdy/POw==", - "dev": true, "requires": { "regenerator-runtime": "^0.13.11" } @@ -19563,8 +19563,7 @@ "@types/prop-types": { "version": "15.7.5", "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.5.tgz", - "integrity": "sha512-JCB8C6SnDoQf0cNycqd/35A7MjcnK+ZTqE7judS6o7utxUCg6imJg3QK2qzHKszlTjcj2cn+NwMB2i96ubpj7w==", - "dev": true + "integrity": "sha512-JCB8C6SnDoQf0cNycqd/35A7MjcnK+ZTqE7judS6o7utxUCg6imJg3QK2qzHKszlTjcj2cn+NwMB2i96ubpj7w==" }, "@types/qs": { "version": "6.9.7", @@ -19582,7 +19581,6 @@ "version": "18.0.35", "resolved": "https://registry.npmjs.org/@types/react/-/react-18.0.35.tgz", "integrity": "sha512-6Laome31HpetaIUGFWl1VQ3mdSImwxtFZ39rh059a1MNnKGqBpC88J6NJ8n/Is3Qx7CefDGLgf/KhN/sYCf7ag==", - "dev": true, "requires": { "@types/prop-types": "*", "@types/scheduler": "*", @@ -19593,7 +19591,6 @@ "version": "18.0.11", "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-18.0.11.tgz", "integrity": "sha512-O38bPbI2CWtgw/OoQoY+BRelw7uysmXbWvw3nLWO21H1HSh+GOlqPuXshJfjmpNlKiiSDG9cc1JZAaMmVdcTlw==", - "dev": true, "requires": { "@types/react": "*" } @@ -19615,8 +19612,7 @@ "@types/scheduler": { "version": "0.16.3", "resolved": "https://registry.npmjs.org/@types/scheduler/-/scheduler-0.16.3.tgz", - "integrity": "sha512-5cJ8CB4yAx7BH1oMvdU0Jh9lrEXyPkar6F9G/ERswkCuvP4KQZfZkSjcMbAICCpQTN4OuZn8tz0HiKv9TGZgrQ==", - "dev": true + "integrity": "sha512-5cJ8CB4yAx7BH1oMvdU0Jh9lrEXyPkar6F9G/ERswkCuvP4KQZfZkSjcMbAICCpQTN4OuZn8tz0HiKv9TGZgrQ==" }, "@types/semver": { "version": "7.3.13", @@ -20164,15 +20160,14 @@ } }, "@wordpress/element": { - "version": "5.7.0", - "resolved": "https://registry.npmjs.org/@wordpress/element/-/element-5.7.0.tgz", - "integrity": "sha512-sztnsbrmvsiZIxXGvvKx4D/xfhKIKEylDh15Y6PqUpxMqznmnf5/+fxLc9zeVAkV/c+Yd8xp3DxUH230tCAkpQ==", - "dev": true, + "version": "5.17.0", + "resolved": "https://registry.npmjs.org/@wordpress/element/-/element-5.17.0.tgz", + "integrity": "sha512-sVjVWlKnpzTM4kfwfTgT9TtCcqqb3MqII9cLzM3DCVDFIUrudEUlbqX9lUCnnSfWCjoQ/YPaWg4LikKrRVmPQw==", "requires": { "@babel/runtime": "^7.16.0", "@types/react": "^18.0.21", "@types/react-dom": "^18.0.6", - "@wordpress/escape-html": "^2.30.0", + "@wordpress/escape-html": "^2.40.0", "change-case": "^4.1.2", "is-plain-object": "^5.0.0", "react": "^18.2.0", @@ -20199,10 +20194,9 @@ } }, "@wordpress/escape-html": { - "version": "2.30.0", - "resolved": "https://registry.npmjs.org/@wordpress/escape-html/-/escape-html-2.30.0.tgz", - "integrity": "sha512-A0FVcCPSfzCsuoLJOGCKOj3ygg6lWptugtyFcXoELG15AJ3ivfeJEeghZo77YpaWCmyCf0yTC56qbaAa2c48uw==", - "dev": true, + "version": "2.40.0", + "resolved": "https://registry.npmjs.org/@wordpress/escape-html/-/escape-html-2.40.0.tgz", + "integrity": "sha512-hWbtydaYHud/qbXauCNR1h5pfmXJQwzdKfdQUMqEjms2sqm2nQQXGxi/t8CLc2HjrNenzHqOZaonfQ/nx+1l1A==", "requires": { "@babel/runtime": "^7.16.0" } @@ -20248,6 +20242,16 @@ } } }, + "@wordpress/icons": { + "version": "9.31.0", + "resolved": "https://registry.npmjs.org/@wordpress/icons/-/icons-9.31.0.tgz", + "integrity": "sha512-o8Yj3+BtsrwytN1tSRyINsAAXACdlgS+ELl6HnB3iE3K+qi2KzJGFVZPXS7vDZRPDxt6foNVk1LDp60hbEKvYQ==", + "requires": { + "@babel/runtime": "^7.16.0", + "@wordpress/element": "^5.17.0", + "@wordpress/primitives": "^3.38.0" + } + }, "@wordpress/jest-console": { "version": "7.1.0", "resolved": "https://registry.npmjs.org/@wordpress/jest-console/-/jest-console-7.1.0.tgz", @@ -20292,6 +20296,16 @@ "dev": true, "requires": {} }, + "@wordpress/primitives": { + "version": "3.38.0", + "resolved": "https://registry.npmjs.org/@wordpress/primitives/-/primitives-3.38.0.tgz", + "integrity": "sha512-quRkAzZknTCqrBI/HvJ2Eas0x1irU6m2GbV/8opyZoE/2BAN+W07JgDhE8Aukd+3q03nfpKPeRJAO1dZ4/Vnuw==", + "requires": { + "@babel/runtime": "^7.16.0", + "@wordpress/element": "^5.17.0", + "classnames": "^2.3.1" + } + }, "@wordpress/scripts": { "version": "26.1.0", "resolved": "https://registry.npmjs.org/@wordpress/scripts/-/scripts-26.1.0.tgz", @@ -21061,7 +21075,6 @@ "version": "4.1.2", "resolved": "https://registry.npmjs.org/camel-case/-/camel-case-4.1.2.tgz", "integrity": "sha512-gxGWBrTT1JuMx6R+o5PTXMmUnhnVzLQ9SNutD4YqKtI6ap897t3tKECYla6gCWEkplXnlNybEkZg9GEGxKFCgw==", - "dev": true, "requires": { "pascal-case": "^3.1.2", "tslib": "^2.0.3" @@ -21120,7 +21133,6 @@ "version": "1.0.4", "resolved": "https://registry.npmjs.org/capital-case/-/capital-case-1.0.4.tgz", "integrity": "sha512-ds37W8CytHgwnhGGTi88pcPyR15qoNkOpYwmMMfnWqqWgESapLqvDx6huFjQ5vqWSn2Z06173XNA7LtMOeUh1A==", - "dev": true, "requires": { "no-case": "^3.0.4", "tslib": "^2.0.3", @@ -21140,7 +21152,6 @@ "version": "4.1.2", "resolved": "https://registry.npmjs.org/change-case/-/change-case-4.1.2.tgz", "integrity": "sha512-bSxY2ws9OtviILG1EiY5K7NNxkqg/JnRnFxLtKQ96JaviiIxi7djMrSd0ECT9AC+lttClmYwKw53BWpOMblo7A==", - "dev": true, "requires": { "camel-case": "^4.1.2", "capital-case": "^1.0.4", @@ -21244,6 +21255,11 @@ "integrity": "sha512-cOU9usZw8/dXIXKtwa8pM0OTJQuJkxMN6w30csNRUerHfeQ5R6U3kkU/FtJeIf3M202OHfY2U8ccInBG7/xogA==", "dev": true }, + "classnames": { + "version": "2.3.2", + "resolved": "https://registry.npmjs.org/classnames/-/classnames-2.3.2.tgz", + "integrity": "sha512-CSbhY4cFEJRe6/GQzIk5qXZ4Jeg5pcsP7b5peFSDpffpe1cqjASH/n9UTjBwOp6XpMSTwQ8Za2K5V02ueA7Tmw==" + }, "clean-webpack-plugin": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/clean-webpack-plugin/-/clean-webpack-plugin-3.0.0.tgz", @@ -21456,7 +21472,6 @@ "version": "3.0.4", "resolved": "https://registry.npmjs.org/constant-case/-/constant-case-3.0.4.tgz", "integrity": "sha512-I2hSBi7Vvs7BEuJDr5dDHfzb/Ruj3FyvFyh7KLilAjNQw3Be+xgqUBA2W6scVEcL0hL1dwPRtIqEPVUCKkSsyQ==", - "dev": true, "requires": { "no-case": "^3.0.4", "tslib": "^2.0.3", @@ -21855,8 +21870,7 @@ "csstype": { "version": "3.1.2", "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.2.tgz", - "integrity": "sha512-I7K1Uu0MBPzaFKg4nI5Q7Vs2t+3gWWW648spaF+Rg7pI9ds18Ugn+lvg4SHczUdKlHI5LWBXyqfS8+DufyBsgQ==", - "dev": true + "integrity": "sha512-I7K1Uu0MBPzaFKg4nI5Q7Vs2t+3gWWW648spaF+Rg7pI9ds18Ugn+lvg4SHczUdKlHI5LWBXyqfS8+DufyBsgQ==" }, "cwd": { "version": "0.10.0", @@ -22231,7 +22245,6 @@ "version": "3.0.4", "resolved": "https://registry.npmjs.org/dot-case/-/dot-case-3.0.4.tgz", "integrity": "sha512-Kv5nKlh6yRrdrGvxeJ2e5y2eRUpkUosIW4A2AS38zwSz27zu7ufDwQPi5Jhs3XAlGNetl3bmnGhQsMtkKJnj3w==", - "dev": true, "requires": { "no-case": "^3.0.4", "tslib": "^2.0.3" @@ -23773,7 +23786,6 @@ "version": "2.0.4", "resolved": "https://registry.npmjs.org/header-case/-/header-case-2.0.4.tgz", "integrity": "sha512-H/vuk5TEEVZwrR0lp2zed9OCo1uAILMlx0JEMgC26rzyJJ3N1v6XkwHHXJQdR2doSjcGPM6OKPYoJgf0plJ11Q==", - "dev": true, "requires": { "capital-case": "^1.0.4", "tslib": "^2.0.3" @@ -24276,8 +24288,7 @@ "is-plain-object": { "version": "5.0.0", "resolved": "https://registry.npmjs.org/is-plain-object/-/is-plain-object-5.0.0.tgz", - "integrity": "sha512-VRSzKkbMm5jMDoKLbltAkFQ5Qr7VDiTFGXxYFXXowVj387GeGNOCsOH6Msy00SGZ3Fp84b1Naa1psqgcCIEP5Q==", - "dev": true + "integrity": "sha512-VRSzKkbMm5jMDoKLbltAkFQ5Qr7VDiTFGXxYFXXowVj387GeGNOCsOH6Msy00SGZ3Fp84b1Naa1psqgcCIEP5Q==" }, "is-potential-custom-element-name": { "version": "1.0.1", @@ -24970,8 +24981,7 @@ "js-tokens": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz", - "integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==", - "dev": true + "integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==" }, "js-yaml": { "version": "3.14.1", @@ -25309,7 +25319,6 @@ "version": "1.4.0", "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz", "integrity": "sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==", - "dev": true, "requires": { "js-tokens": "^3.0.0 || ^4.0.0" } @@ -25318,7 +25327,6 @@ "version": "2.0.2", "resolved": "https://registry.npmjs.org/lower-case/-/lower-case-2.0.2.tgz", "integrity": "sha512-7fm3l3NAF9WfN6W3JOmf5drwpVqX78JtoGJ3A6W0a6ZnldM41w2fV5D490psKFTpMds8TJse/eHLFFsNHHjHgg==", - "dev": true, "requires": { "tslib": "^2.0.3" } @@ -25799,7 +25807,6 @@ "version": "3.0.4", "resolved": "https://registry.npmjs.org/no-case/-/no-case-3.0.4.tgz", "integrity": "sha512-fgAN3jGAh+RoxUGZHTSOLJIqUc2wmoBwGR4tbpNAKmmovFoWq0OdRkb0VkldReO2a2iBT/OEulG9XSUc10r3zg==", - "dev": true, "requires": { "lower-case": "^2.0.2", "tslib": "^2.0.3" @@ -26395,7 +26402,6 @@ "version": "3.0.4", "resolved": "https://registry.npmjs.org/param-case/-/param-case-3.0.4.tgz", "integrity": "sha512-RXlj7zCYokReqWpOPH9oYivUzLYZ5vAPIfEmCTNViosC78F8F0H9y7T7gG2M39ymgutxF5gcFEsyZQSph9Bp3A==", - "dev": true, "requires": { "dot-case": "^3.0.4", "tslib": "^2.0.3" @@ -26447,7 +26453,6 @@ "version": "3.1.2", "resolved": "https://registry.npmjs.org/pascal-case/-/pascal-case-3.1.2.tgz", "integrity": "sha512-uWlGT3YSnK9x3BQJaOdcZwrnV6hPpd8jFH1/ucpiLRPh/2zCVJKS19E4GvYHvaCcACn3foXZ0cLB9Wrx1KGe5g==", - "dev": true, "requires": { "no-case": "^3.0.4", "tslib": "^2.0.3" @@ -26457,7 +26462,6 @@ "version": "3.0.4", "resolved": "https://registry.npmjs.org/path-case/-/path-case-3.0.4.tgz", "integrity": "sha512-qO4qCFjXqVTrcbPt/hQfhTQ+VhFsqNKOPtytgNKkKxSoEp3XPUQ8ObFuePylOIok5gjn69ry8XiULxCwot3Wfg==", - "dev": true, "requires": { "dot-case": "^3.0.4", "tslib": "^2.0.3" @@ -27327,7 +27331,6 @@ "version": "18.2.0", "resolved": "https://registry.npmjs.org/react/-/react-18.2.0.tgz", "integrity": "sha512-/3IjMdb2L9QbBdWiW5e3P2/npwMBaU9mHCSCUzNln0ZCYbcfTsGbTJrU/kGemdH2IWmB2ioZ+zkxtmq6g09fGQ==", - "dev": true, "requires": { "loose-envify": "^1.1.0" } @@ -27336,7 +27339,6 @@ "version": "18.2.0", "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.2.0.tgz", "integrity": "sha512-6IMTriUmvsjHUjNtEDudZfuDQUoWXVxKHhlEGSk81n4YFS+r/Kl99wXiwlVXtPBtJenozv2P+hxDsw9eA7Xo6g==", - "dev": true, "requires": { "loose-envify": "^1.1.0", "scheduler": "^0.23.0" @@ -27542,8 +27544,7 @@ "regenerator-runtime": { "version": "0.13.11", "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.11.tgz", - "integrity": "sha512-kY1AZVr2Ra+t+piVaJ4gxaFaReZVH40AKNo7UCX6W+dEwBo/2oZJzqfuN1qLq1oL45o56cPaTXELwrTh8Fpggg==", - "dev": true + "integrity": "sha512-kY1AZVr2Ra+t+piVaJ4gxaFaReZVH40AKNo7UCX6W+dEwBo/2oZJzqfuN1qLq1oL45o56cPaTXELwrTh8Fpggg==" }, "regenerator-transform": { "version": "0.15.1", @@ -27816,7 +27817,6 @@ "version": "0.23.0", "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.23.0.tgz", "integrity": "sha512-CtuThmgHNg7zIZWAXi3AsyIzA3n4xx7aNyjwC2VJldO2LMVDhFK+63xGqq6CsJH4rTAt6/M+N4GhZiDYPx9eUw==", - "dev": true, "requires": { "loose-envify": "^1.1.0" } @@ -27903,7 +27903,6 @@ "version": "3.0.4", "resolved": "https://registry.npmjs.org/sentence-case/-/sentence-case-3.0.4.tgz", "integrity": "sha512-8LS0JInaQMCRoQ7YUytAo/xUu5W2XnQxV2HI/6uM6U7CITS1RqPElr30V6uIqyMKM9lJGRVFy5/4CuzcixNYSg==", - "dev": true, "requires": { "no-case": "^3.0.4", "tslib": "^2.0.3", @@ -28119,7 +28118,6 @@ "version": "3.0.4", "resolved": "https://registry.npmjs.org/snake-case/-/snake-case-3.0.4.tgz", "integrity": "sha512-LAOh4z89bGQvl9pFfNF8V146i7o7/CqFPbqzYgP+yYzDIDeS9HaNFtXABamRW+AQzEVODcvE79ljJ+8a9YSdMg==", - "dev": true, "requires": { "dot-case": "^3.0.4", "tslib": "^2.0.3" @@ -29057,8 +29055,7 @@ "tslib": { "version": "2.5.0", "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.5.0.tgz", - "integrity": "sha512-336iVw3rtn2BUK7ORdIAHTyxHGRIHVReokCR3XjbckJMK7ms8FysBfhLR8IXnAgy7T0PTPNBWKiH514FOW/WSg==", - "dev": true + "integrity": "sha512-336iVw3rtn2BUK7ORdIAHTyxHGRIHVReokCR3XjbckJMK7ms8FysBfhLR8IXnAgy7T0PTPNBWKiH514FOW/WSg==" }, "tsutils": { "version": "3.21.0", @@ -29212,7 +29209,6 @@ "version": "2.0.2", "resolved": "https://registry.npmjs.org/upper-case/-/upper-case-2.0.2.tgz", "integrity": "sha512-KgdgDGJt2TpuwBUIjgG6lzw2GWFRCW9Qkfkiv0DxqHHLYJHmtmdUIKcZd8rHgFSjopVTlw6ggzCm1b8MFQwikg==", - "dev": true, "requires": { "tslib": "^2.0.3" } @@ -29221,7 +29217,6 @@ "version": "2.0.2", "resolved": "https://registry.npmjs.org/upper-case-first/-/upper-case-first-2.0.2.tgz", "integrity": "sha512-514ppYHBaKwfJRK/pNC6c/OxfGa0obSnAl106u97Ed0I625Nin96KAjttZF6ZL3e1XLtphxnqrOi9iWgm+u+bg==", - "dev": true, "requires": { "tslib": "^2.0.3" } diff --git a/package.json b/package.json index 49d91df..bf2a63c 100644 --- a/package.json +++ b/package.json @@ -25,7 +25,8 @@ "phpunit": "npm run build && wp-env run phpunit 'phpunit -c /var/www/html/wp-content/plugins/vk-dynamic-if-block/phpunit.xml --verbose'" }, "dependencies": { - "@wordpress/env": "^5.15.0" + "@wordpress/env": "^5.15.0", + "@wordpress/icons": "^9.31.0" }, "devDependencies": { "@wordpress/scripts": "^26.1.0", @@ -38,4 +39,4 @@ "node": "16.15.1", "npm": "8.12.1" } -} \ No newline at end of file +} diff --git a/src/ControlsPanel.js b/src/ControlsPanel.js new file mode 100644 index 0000000..5d3066b --- /dev/null +++ b/src/ControlsPanel.js @@ -0,0 +1,191 @@ +import { __ } from '@wordpress/i18n'; +import { + SelectControl, + TextControl, + ToggleControl, + CheckboxControl, + BaseControl, + __experimentalNumberControl as NumberControl, +} from '@wordpress/components'; +import ControlsPanelHeader from './ControlsPanelHeader'; + +const ControlsPanel = ({ attributes, setAttributes, ifPageTypes, userRoles }) => { + const { conditions, exclusion } = attributes; + + console.log("Current attributes: ", attributes); + + const updateConditions = (key, value) => { + const newConditions = { + ...conditions, + [key]: { + ...conditions[key], + properties: value, + }, + }; + setAttributes({ conditions: newConditions }); + }; + + const isAnyConditionEnabled = () => { + return Object.values(conditions).some(condition => condition.enable); + }; + + return ( + <> + + + {isAnyConditionEnabled() && ( + + + {conditions.conditionPageType.enable && ( + updateConditions('conditionPageType', { ifPageType: value })} + /> + )} + + {conditions.conditionPostType.enable && ( + updateConditions('conditionPostType', { ifPostType: value })} + /> + )} + + {conditions.conditionUserRole.enable && ( + + {userRoles.map((role, index) => ( + { + const newRoles = isChecked + ? [...conditions.conditionUserRole.properties.userRole, role.value] + : conditions.conditionUserRole.properties.userRole.filter((r) => r !== role.value); + updateConditions('conditionUserRole', { userRole: newRoles }); + }} + /> + ))} + + )} + + {conditions.conditionCustomField.enable && ( + <> + updateConditions('conditionCustomField', { ...conditions.conditionCustomField.properties, customFieldName: value })} + /> + {conditions.conditionCustomField.properties.customFieldName && ( + <> + updateConditions('conditionCustomField', { ...conditions.conditionCustomField.properties, customFieldRule: value })} + /> + {conditions.conditionCustomField.properties.customFieldRule === 'valueEquals' && ( + <> + updateConditions('conditionCustomField', { ...conditions.conditionCustomField.properties, customFieldValue: value })} + /> + + )} + + )} + + )} + + {conditions.conditionPeriodDisplay.enable && ( + <> + updateConditions('conditionPeriodDisplay', { ...conditions.conditionPeriodDisplay.properties, periodDisplaySetting: value })} + help={ + conditions.conditionPeriodDisplay.properties.periodDisplaySetting === 'deadline' + ? __('After the specified date, it is hidden.', 'vk-dynamic-if-block') + : conditions.conditionPeriodDisplay.properties.periodDisplaySetting === 'startline' + ? __('After the specified date, it is display.', 'vk-dynamic-if-block') + : conditions.conditionPeriodDisplay.properties.periodDisplaySetting === 'daysSincePublic' + ? __('After the specified number of days, it is hidden.', 'vk-dynamic-if-block') + : __('You can set the deadline or startline to be displayed, as well as the time period.', 'vk-dynamic-if-block') + } + /> + {conditions.conditionPeriodDisplay.properties.periodDisplaySetting !== 'none' && ( + <> + updateConditions('conditionPeriodDisplay', { ...conditions.conditionPeriodDisplay.properties, periodSpecificationMethod: value })} + /> + {conditions.conditionPeriodDisplay.properties.periodSpecificationMethod === 'direct' && ( + updateConditions('conditionPeriodDisplay', { ...conditions.conditionPeriodDisplay.properties, periodDisplayValue: value })} + /> + )} + {conditions.conditionPeriodDisplay.properties.periodSpecificationMethod === 'referCustomField' && ( + <> + updateConditions('conditionPeriodDisplay', { ...conditions.conditionPeriodDisplay.properties, periodReferCustomField: value })} + help={ + conditions.conditionPeriodDisplay.properties.periodDisplaySetting === 'daysSincePublic' + ? __('Save the value of the custom field as an integer.', 'vk-dynamic-if-block') + : __('Save the custom field values as Y-m-d H:i:s.', 'vk-dynamic-if-block') + } + className="vkdif__refer-cf-name" + /> + {!conditions.conditionPeriodDisplay.properties.periodReferCustomField && ( +
+ {__('Enter the name of the custom field you wish to reference.', 'vk-dynamic-if-block')} +
+ )} + + )} + + )} + + )} + + setAttributes({ exclusion: checked })} + /> + + )} + + ); +}; + +export default ControlsPanel; diff --git a/src/ControlsPanelHeader.js b/src/ControlsPanelHeader.js new file mode 100644 index 0000000..97f69b5 --- /dev/null +++ b/src/ControlsPanelHeader.js @@ -0,0 +1,96 @@ +import { __ } from '@wordpress/i18n'; +import { DropdownMenu, MenuItem } from '@wordpress/components'; +import { check, plus, moreVertical } from '@wordpress/icons'; + +const ControlsPanelHeader = ({ attributes, setAttributes }) => { + const conditionItems = [ + { key: 'conditionPageType', label: 'Page Type' }, + { key: 'conditionPostType', label: 'Post Type' }, + { key: 'conditionUserRole', label: 'User Role' }, + { key: 'conditionCustomField', label: 'Custom Field' }, + { key: 'conditionPeriodDisplay', label: 'Period Display' }, + ]; + + const defaultConditions = { + conditionPageType: { + properties: { + ifPageType: "none", + } + }, + conditionPostType: { + properties: { + ifPostType: "none", + } + }, + conditionUserRole: { + properties: { + userRole: [], + } + }, + conditionCustomField: { + properties: { + customFieldName: "", + customFieldRule: "valueExists", + customFieldValue: "", + } + }, + conditionPeriodDisplay: { + properties: { + periodDisplaySetting: "none", + periodSpecificationMethod: "direct", + periodDisplayValue: "", + periodReferCustomField: "", + } + }, + }; + + // 条件の有効/無効を切り替える関数 + const toggleCondition = (key) => { + // 既存の条件をディープコピー + const newConditions = JSON.parse(JSON.stringify(attributes.conditions)); + + // 指定されたキーに対応する条件の`enable`フラグをトグル + newConditions[key].enable = !newConditions[key].enable; + + // もし条件が無効になった場合、プロパティをデフォルトにリセット + if (!newConditions[key].enable) { + newConditions[key].properties = defaultConditions[key].properties; + } + + setAttributes({ conditions: newConditions }); + }; + + // どれかの条件がenable: trueであるかどうかを確認する関数 + const isAnyConditionEnabled = () => { + return conditionItems.some(item => attributes.conditions[item.key].enable); + }; + + return ( +
+

Display Conditions

+ + {({ onClose }) => ( + <> + {conditionItems.map((item) => ( + { + toggleCondition(item.key); + onClose(); + }} + icon={attributes.conditions[item.key].enable ? check : null} + > + {item.label} + + ))} + + )} + +
+ ); +}; + +export default ControlsPanelHeader; diff --git a/src/block.json b/src/block.json index 17fb400..d0bb066 100644 --- a/src/block.json +++ b/src/block.json @@ -5,49 +5,99 @@ "category": "theme", "textdomain": "vk-dynamic-if-block", "attributes": { - "ifPageType": { - "type": "string", - "default": "none" - }, - "ifPostType": { - "type": "string", - "default": "none" - }, - "userRole": { - "type": "array", - "default": [] - }, - "customFieldName": { - "type": "string", - "default": "" - }, - "customFieldRule": { - "type": "string", - "default": "valueExists" - }, - "customFieldValue": { - "type": "string", - "default": "" + "conditions": { + "type": "object", + "properties": { + "conditionPageType": { + "type": "object", + "enable": { + "type": "boolean", + "default": false + }, + "properties": { + "ifPageType": { + "type": "string", + "default": "none" + } + } + }, + "conditionPostType": { + "type": "object", + "enable": { + "type": "boolean", + "default": false + }, + "properties": { + "ifPostType": { + "type": "string", + "default": "none" + } + } + }, + "conditionUserRole": { + "type": "object", + "enable": { + "type": "boolean", + "default": false + }, + "properties": { + "userRole": { + "type": "array", + "default": [] + } + } + }, + "conditionCustomField": { + "type": "object", + "enable": { + "type": "boolean", + "default": false + }, + "properties": { + "customFieldName": { + "type": "string", + "default": "" + }, + "customFieldRule": { + "type": "string", + "default": "valueExists" + }, + "customFieldValue": { + "type": "string", + "default": "" + } + } + }, + "conditionPeriodDisplay": { + "type": "object", + "enable": { + "type": "boolean", + "default": false + }, + "properties": { + "periodDisplaySetting": { + "type": "string", + "default": "none" + }, + "periodSpecificationMethod": { + "type": "string", + "default": "direct" + }, + "periodDisplayValue": { + "type": "string", + "default": "" + }, + "periodReferCustomField": { + "type": "string", + "default": "" + } + } + } + } }, "exclusion": { "type": "boolean", "default": false - }, - "periodDisplaySetting": { - "type": "string", - "default": "none" - }, - "periodSpecificationMethod": { - "type": "string", - "default": "direct" - }, - "periodDisplayValue": { - "type": "string", - "default": "" - }, - "periodReferCustomField": { - "type": "string", - "default": "" } }, "supports": { diff --git a/src/editor.scss b/src/editor.scss index 670ac0f..d867bb4 100644 --- a/src/editor.scss +++ b/src/editor.scss @@ -57,3 +57,44 @@ } } } + +/** ============================== +UI・仕様変更用 +============================== */ +.vkdif__controls-panel { + border-top: 1px solid #dddddd; + display: grid; + gap: 16px; + margin-top: -1px; + padding: 16px; + .controls-panel-header { + align-items: center; + display: flex; + flex-direction: row; + gap: calc(8px); + grid-column: 1 / -1; + justify-content: space-between; + width: 100%; + -webkit-box-align: center; + -webkit-box-pack: justify; + + h2 { + font-weight: 500; + margin: 0; + } + + .controls-panel-header__dropdown-menus { + line-height: 0; + margin: -4px 0; + + .components-button { + padding: 0px; + min-width: 24px; + } + + .components-spinner { + margin: 0 4px; + } + } + } +} diff --git a/src/index.js b/src/index.js index ba5858d..868159b 100644 --- a/src/index.js +++ b/src/index.js @@ -1,17 +1,9 @@ import { __ } from '@wordpress/i18n'; import { registerBlockType } from '@wordpress/blocks'; import { useBlockProps, InnerBlocks, InspectorControls } from '@wordpress/block-editor'; -import { - PanelBody, - SelectControl, - TextControl, - ToggleControl, - CheckboxControl, - BaseControl, - __experimentalNumberControl as NumberControl, -} from '@wordpress/components'; import { ReactComponent as Icon } from './icon.svg'; import transforms from './transforms'; +import ControlsPanel from './ControlsPanel' registerBlockType('vk-blocks/dynamic-if', { apiVersion: 2, @@ -20,57 +12,70 @@ registerBlockType('vk-blocks/dynamic-if', { transforms, category: 'theme', attributes: { - ifPageType: { - type: 'string', - default: 'none', - }, - ifPostType: { - type: 'string', - default: 'none', - }, - userRole: { - type: 'array', - default: [], - }, - customFieldName: { - type: 'string', - "default": "" - }, - customFieldRule: { - type: 'string', - "default": "" - }, - customFieldValue: { - type: 'string', - "default": "" + conditions: { + type: "object", + default: { + conditionPageType: { + enable: false, + properties: { + ifPageType: "none", + } + }, + conditionPostType: { + enable: false, + properties: { + ifPostType: "none", + } + }, + conditionUserRole: { + enable: false, + properties: { + userRole: [], + } + }, + conditionCustomField: { + enable: false, + properties: { + customFieldName: "", + customFieldRule: "valueExists", + customFieldValue: "", + } + }, + conditionPeriodDisplay: { + enable: false, + properties: { + periodDisplaySetting: "none", + periodSpecificationMethod: "direct", + periodDisplayValue: "", + periodReferCustomField: "", + } + }, + } }, exclusion: { - type: 'boolian', + type: "boolean", default: false, }, - periodDisplaySetting: { - type: 'string', - "default": "none" - }, - periodSpecificationMethod: { - type: 'string', - "default": "direct" - }, - periodDisplayValue: { - type: 'string', - "default": "" - }, - periodReferCustomField: { - type: 'string', - "default": "" - }, }, supports: { html: false, innerBlocks: true, }, edit({ attributes, setAttributes }) { - const { ifPageType, ifPostType, userRole, customFieldName, customFieldRule, customFieldValue, exclusion, periodDisplaySetting, periodSpecificationMethod, periodDisplayValue, periodReferCustomField } = attributes; + const { + conditions: { + conditionPageType: { enable: enablePageType, properties: { ifPageType } }, + conditionPostType: { enable: enablePostType, properties: { ifPostType } }, + conditionUserRole: { enable: enableUserRole, properties: { userRole } }, + conditionCustomField: { enable: enableCustomField, properties: { customFieldName } }, + conditionPeriodDisplay: { enable: enablePeriodDisplay, properties: { periodDisplaySetting } }, + }, + } = attributes; + + const blockClassName = `vk-dynamic-if-block ifPageType-${ifPageType} ifPostType-${ifPostType}`; + const MY_TEMPLATE = [ + ['core/paragraph', {}], + ]; const ifPageTypes = [ { value: 'none', label: __('No restriction', 'vk-dynamic-if-block') }, @@ -92,11 +97,6 @@ registerBlockType('vk-blocks/dynamic-if', { { value: 'is_404', label: __('404', 'vk-dynamic-if-block') + ' ( is_404() )' }, ]; - const blockClassName = `vk-dynamic-if-block ifPageType-${ifPageType} ifPostType-${ifPostType}`; - const MY_TEMPLATE = [ - ['core/paragraph', {}], - ]; - const userRolesObj = vk_dynamic_if_block_localize_data.userRoles || {}; const userRoles = Object.keys(userRolesObj).map(key => ({ value: key, @@ -105,14 +105,13 @@ registerBlockType('vk-blocks/dynamic-if', { let labels = []; - if (ifPageType !== "none") { + if (enablePageType && ifPageType !== "none") { labels.push(ifPageType); } - - if (ifPostType !== "none") { + if (enablePostType && ifPostType !== "none") { labels.push(ifPostType); } - if (userRole.length > 0) { + if (enableUserRole && userRole.length > 0) { userRole.forEach((roleValue) => { const roleLabel = userRoles.find((role) => role.value === roleValue); if (roleLabel) { @@ -120,12 +119,10 @@ registerBlockType('vk-blocks/dynamic-if', { } }); } - - if (customFieldName) { + if (enableCustomField && customFieldName) { labels.push(customFieldName); } - - if (periodDisplaySetting !== "none") { + if (enablePeriodDisplay && periodDisplaySetting !== "none") { labels.push(periodDisplaySetting); } @@ -133,150 +130,15 @@ registerBlockType('vk-blocks/dynamic-if', { return (
- - - setAttributes({ ifPageType: value })} - /> - setAttributes({ ifPostType: value })} - /> - - {userRoles.map((role, index) => { - return ( - { - if (isChecked) { - setAttributes({ userRole: [...userRole, role.value] }); - } else { - setAttributes({ userRole: userRole.filter((r) => r !== role.value) }); - } - }} - /> - ); - })} - - - setAttributes({ customFieldName: value }) - } - /> - {customFieldName && ( - <> - setAttributes({ customFieldRule: value })} - /> - {customFieldRule === 'valueEquals' && ( - <> - - setAttributes({ customFieldValue: value }) - } - /> - - )} - - )} - - setAttributes({ periodDisplaySetting: value })} - help={ - periodDisplaySetting === 'deadline' - ? __('After the specified date, it is hidden.', 'vk-dynamic-if-block') - : periodDisplaySetting === 'startline' - ? __('After the specified date, it is display.', 'vk-dynamic-if-block') - : periodDisplaySetting === 'daysSincePublic' - ? __('After the specified number of days, it is hidden.', 'vk-dynamic-if-block') - : __('You can set the deadline or startline to be displayed, as well as the time period.', 'vk-dynamic-if-block') - } - /> - {periodDisplaySetting !== 'none' && ( - <> - setAttributes({ periodSpecificationMethod: value })} - /> - {periodSpecificationMethod === 'direct' && ( - - setAttributes({ periodDisplayValue: value }) - } - /> - )} - {periodSpecificationMethod === 'referCustomField' && ( - <> - - setAttributes({ periodReferCustomField: value }) - } - help={ - periodDisplaySetting === 'daysSincePublic' - ? __('Save the value of the custom field as an integer.', 'vk-dynamic-if-block') - : __('Save the custom field values as Y-m-d H:i:s.', 'vk-dynamic-if-block') - } - className="vkdif__refer-cf-name" - /> - {!periodReferCustomField && ( -
- {__('Enter the name of the custom field you wish to reference.', 'vk-dynamic-if-block')} -
- )} - - )} - - )} - - - setAttributes({ exclusion: checked })} - /> - + +
+ +
+ {/* setAttributes({ exclusion: checked })} + /> */}
{labels_string}
diff --git a/src/index.php b/src/index.php index dea9a50..d4d926e 100644 --- a/src/index.php +++ b/src/index.php @@ -16,19 +16,52 @@ */ function vk_dynamic_if_block_render( $attributes, $content ) { $attributes_default = array( - 'ifPageType' => 'none', - 'ifPostType' => 'none', - 'userRole' => array(), - 'customFieldName' => '', - 'customFieldRule' => 'valueExists', - 'customFieldValue' => '', - 'exclusion' => false, - 'periodDisplaySetting' => 'none', - 'periodSpecificationMethod' => 'direct', - 'periodDisplayValue' => '', - 'periodReferCustomField' => '', + 'conditions' => array( + 'properties' => array( + 'conditionPageType' => array( + 'enable' => false, + 'properties' => array( + 'ifPageType' => 'none' + ) + ), + 'conditionPostType' => array( + 'enable' => false, + 'properties' => array( + 'ifPostType' => 'none' + ) + ), + 'conditionUserRole' => array( + 'enable' => false, + 'properties' => array( + 'userRole' => array() + ) + ), + 'conditionCustomField' => array( + 'enable' => false, + 'properties' => array( + 'customFieldName' => '', + 'customFieldRule' => 'valueExists', + 'customFieldValue' => '' + ) + ), + 'conditionPeriodDisplay' => array( + 'enable' => false, + 'properties' => array( + 'periodDisplaySetting' => 'none', + 'periodSpecificationMethod' => 'direct', + 'periodDisplayValue' => '', + 'periodReferCustomField' => '' + ) + ), + ), + ), + 'exclusion' => false ); - $attributes = array_merge( $attributes_default, $attributes ); + + $attributes = array_merge($attributes_default, $attributes); + + // var_dump($attributes); + $display = false; @@ -36,24 +69,26 @@ function vk_dynamic_if_block_render( $attributes, $content ) { $display_by_page_type = false; + $ifPageType = $attributes['conditions']['conditionPageType']['properties']['ifPageType']; + if ( - is_front_page() && 'is_front_page' === $attributes['ifPageType'] || - is_single() && 'is_single' === $attributes['ifPageType'] || - is_page() && 'is_page' === $attributes['ifPageType'] || - is_singular() && 'is_singular' === $attributes['ifPageType'] || - is_home() && ! is_front_page() && 'is_home' === $attributes['ifPageType'] || - is_post_type_archive() && 'is_post_type_archive' === $attributes['ifPageType'] || - is_category() && 'is_category' === $attributes['ifPageType'] || - is_tag() && 'is_tag' === $attributes['ifPageType'] || - is_tax() && 'is_tax' === $attributes['ifPageType'] || - is_year() && 'is_year' === $attributes['ifPageType'] || - is_month() && 'is_month' === $attributes['ifPageType'] || - is_date() && 'is_date' === $attributes['ifPageType'] || - is_author() && 'is_author' === $attributes['ifPageType'] || - is_search() && 'is_search' === $attributes['ifPageType'] || - is_404() && 'is_404' === $attributes['ifPageType'] || - is_archive() && 'is_archive' === $attributes['ifPageType'] || - 'none' === $attributes['ifPageType'] + is_front_page() && 'is_front_page' === $ifPageType || + is_single() && 'is_single' === $ifPageType || + is_page() && 'is_page' === $ifPageType || + is_singular() && 'is_singular' === $ifPageType || + is_home() && ! is_front_page() && 'is_home' === $ifPageType || + is_post_type_archive() && 'is_post_type_archive' === $ifPageType || + is_category() && 'is_category' === $ifPageType || + is_tag() && 'is_tag' === $ifPageType || + is_tax() && 'is_tax' === $ifPageType || + is_year() && 'is_year' === $ifPageType || + is_month() && 'is_month' === $ifPageType || + is_date() && 'is_date' === $ifPageType || + is_author() && 'is_author' === $ifPageType || + is_search() && 'is_search' === $ifPageType || + is_404() && 'is_404' === $ifPageType || + is_archive() && 'is_archive' === $ifPageType || + 'none' === $ifPageType ) { $display_by_page_type = true; } @@ -71,9 +106,11 @@ function vk_dynamic_if_block_render( $attributes, $content ) { $post_type_slug = get_post_type(); } - if ( 'none' === $attributes['ifPostType'] ) { + $ifPostType = $attributes['conditions']['conditionPostType']['properties']['ifPostType']; + + if ( 'none' === $ifPostType ) { $display_by_post_type = true; - } elseif ( $post_type_slug === $attributes['ifPostType'] ) { + } elseif ( $post_type_slug === $ifPostType ) { $display_by_post_type = true; } else { $display_by_post_type = false; @@ -83,6 +120,8 @@ function vk_dynamic_if_block_render( $attributes, $content ) { $display_by_user_role = false; + $userRole = $attributes['conditions']['conditionUserRole']['properties']['userRole']; + // PHPUnit用のユーザーロール情報がある場合はそれを設定. if ( ! empty( $attributes['test_user_roles'] ) ) { $user_roles = $attributes['test_user_roles']; @@ -91,14 +130,13 @@ function vk_dynamic_if_block_render( $attributes, $content ) { $user_roles = (array) $current_user->roles; } - if ( ! isset( $attributes['userRole'] ) || empty( $attributes['userRole'] ) ) { + if ( ! isset( $userRole ) || empty( $userRole ) ) { $display_by_user_role = true; } else { if ( is_user_logged_in() || $user_roles ) { - // Check if any of the user's roles match the selected roles. foreach ( $user_roles as $role ) { - if ( in_array( $role, $attributes['userRole'] ) ) { + if ( in_array( $role, $userRole ) ) { $display_by_user_role = true; break; } @@ -112,20 +150,21 @@ function vk_dynamic_if_block_render( $attributes, $content ) { $display_by_custom_field = false; - if ( ! $attributes['customFieldName'] ) { - $display_by_custom_field = true; - } elseif ( $attributes['customFieldName'] ) { + $conditionCustomField = $attributes['conditions']['conditionCustomField']['properties']; + if ( ! $conditionCustomField['customFieldName'] ) { + $display_by_custom_field = true; + } elseif ( $conditionCustomField['customFieldName'] ) { if ( get_the_ID() ) { - $get_value = get_post_meta( get_the_ID(), $attributes['customFieldName'], true ); - if ( 'valueExists' === $attributes['customFieldRule'] || empty( $attributes['customFieldRule'] ) ) { + $get_value = get_post_meta( get_the_ID(), $conditionCustomField['customFieldName'], true ); + if ( 'valueExists' === $conditionCustomField['customFieldRule'] || empty( $conditionCustomField['customFieldRule'] ) ) { if ( $get_value || '0' === $get_value ) { $display_by_custom_field = true; } else { $display_by_custom_field = false; } - } elseif ( 'valueEquals' === $attributes['customFieldRule'] ) { - if ( $get_value === $attributes['customFieldValue'] ) { + } elseif ( 'valueEquals' === $conditionCustomField['customFieldRule'] ) { + if ( $get_value === $conditionCustomField['customFieldValue'] ) { $display_by_custom_field = true; } else { $display_by_custom_field = false; @@ -138,140 +177,109 @@ function vk_dynamic_if_block_render( $attributes, $content ) { $display_by_period = false; - if ( 'none' === $attributes['periodDisplaySetting'] ) { + $conditionPeriodDisplay = $attributes['conditions']['conditionPeriodDisplay']['properties']; + + $periodDisplaySetting = $conditionPeriodDisplay['periodDisplaySetting']; + $periodSpecificationMethod = $conditionPeriodDisplay['periodSpecificationMethod']; + $periodDisplayValue = $conditionPeriodDisplay['periodDisplayValue']; + $periodReferCustomField = $conditionPeriodDisplay['periodReferCustomField']; + + if ( 'none' === $periodDisplaySetting ) { $display_by_period = true; - } elseif ( 'deadline' === $attributes['periodDisplaySetting'] ) { - if ( 'direct' === $attributes['periodSpecificationMethod'] ) { + } elseif ( 'deadline' === $periodDisplaySetting ) { + if ( 'direct' === $periodSpecificationMethod ) { - // 時間指定がない場合(日付までで時間が入力されていない場合)に時間を自動指定. - if ( $attributes['periodDisplayValue'] === date( 'Y-m-d', strtotime( $attributes['periodDisplayValue'] ) ) ) { - $attributes['periodDisplayValue'] .= ' 23:59'; + // Adjust time if no specific time is set + if ($periodDisplayValue === date('Y-m-d', strtotime($periodDisplayValue))) { + $periodDisplayValue .= ' 23:59'; } - // 日付のフォーマットを Y-m-d H:i に指定. - if ( $attributes['periodDisplayValue'] !== date( 'Y-m-d H:i', strtotime( $attributes['periodDisplayValue'] ) ) ) { - $attributes['periodDisplayValue'] = date( 'Y-m-d H:i', strtotime( $attributes['periodDisplayValue'] ) ); + // Ensure the date format is consistent + if ($periodDisplayValue !== date('Y-m-d H:i', strtotime($periodDisplayValue))) { + $periodDisplayValue = date('Y-m-d H:i', strtotime($periodDisplayValue)); } - if ( $attributes['periodDisplayValue'] > current_time( 'Y-m-d H:i' ) ) { + if ($periodDisplayValue > current_time('Y-m-d H:i')) { $display_by_period = true; } else { $display_by_period = false; } - } elseif ( 'referCustomField' === $attributes['periodSpecificationMethod'] ) { - if ( ! empty( $attributes['periodReferCustomField'] ) ) { - $get_refer_value = get_post_meta( get_the_ID(), $attributes['periodReferCustomField'], true ); - - // Check if $get_refer_value matches the date format. - $check_date_ymd = DateTime::createFromFormat( 'Y-m-d', $get_refer_value ); - $check_date_ymd_hi = DateTime::createFromFormat( 'Y-m-d H:i', $get_refer_value ); - $check_date_ymd_his = DateTime::createFromFormat( 'Y-m-d H:i:s', $get_refer_value ); - - if ( $check_date_ymd || $check_date_ymd_hi || $check_date_ymd_his ) { - - if ( $check_date_ymd ) { - // If it's only 'Y-m-d' format, append the time as 23:59. - $get_refer_value .= ' 23:59:59'; - } - - if ( $check_date_ymd_hi ) { - // If it's only 'Y-m-d H:s' format, append the time as 23:59:59. - $get_refer_value .= ':59'; - } - - if ( $get_refer_value > current_time( 'Y-m-d H:i:s' ) ) { - $display_by_period = true; - } else { - $display_by_period = false; - } - } else { - // This means the value doesn't match either date formats + } elseif ('referCustomField' === $periodSpecificationMethod) { + $get_refer_value = get_post_meta(get_the_ID(), $periodReferCustomField, true); + $check_date_ymd = DateTime::createFromFormat('Y-m-d', $get_refer_value); + $check_date_ymd_hi = DateTime::createFromFormat('Y-m-d H:i', $get_refer_value); + $check_date_ymd_his = DateTime::createFromFormat('Y-m-d H:i:s', $get_refer_value); + + if ($check_date_ymd || $check_date_ymd_hi || $check_date_ymd_his) { + if ($check_date_ymd) { + $get_refer_value .= ' 23:59:59'; + } + if ($check_date_ymd_hi) { + $get_refer_value .= ':59'; + } + if ($get_refer_value > current_time('Y-m-d H:i:s')) { $display_by_period = true; + } else { + $display_by_period = false; } } else { $display_by_period = true; } } - } elseif ( 'startline' === $attributes['periodDisplaySetting'] ) { - if ( 'direct' === $attributes['periodSpecificationMethod'] ) { - - // 時間指定がない場合に時間を自動指定. - if ( $attributes['periodDisplayValue'] === date( 'Y-m-d', strtotime( $attributes['periodDisplayValue'] ) ) ) { - $attributes['periodDisplayValue'] .= ' 00:00'; + } elseif ('startline' === $periodDisplaySetting) { + if ('direct' === $periodSpecificationMethod) { + if ($periodDisplayValue === date('Y-m-d', strtotime($periodDisplayValue))) { + $periodDisplayValue .= ' 00:00'; } - - // 日付のフォーマットを Y-m-d H:i に指定. - if ( $attributes['periodDisplayValue'] !== date( 'Y-m-d H:i', strtotime( $attributes['periodDisplayValue'] ) ) ) { - $attributes['periodDisplayValue'] = date( 'Y-m-d H:i', strtotime( $attributes['periodDisplayValue'] ) ); + if ($periodDisplayValue !== date('Y-m-d H:i', strtotime($periodDisplayValue))) { + $periodDisplayValue = date('Y-m-d H:i', strtotime($periodDisplayValue)); } - - if ( $attributes['periodDisplayValue'] <= current_time( 'Y-m-d H:i' ) ) { + if ($periodDisplayValue <= current_time('Y-m-d H:i')) { $display_by_period = true; } else { $display_by_period = false; } - } elseif ( 'referCustomField' === $attributes['periodSpecificationMethod'] ) { - if ( ! empty( $attributes['periodReferCustomField'] ) ) { - $get_refer_value = get_post_meta( get_the_ID(), $attributes['periodReferCustomField'], true ); - - // Check if $get_refer_value matches the date format. - $check_date_ymd = DateTime::createFromFormat( 'Y-m-d', $get_refer_value ); - $check_date_ymd_hi = DateTime::createFromFormat( 'Y-m-d H:i', $get_refer_value ); - $check_date_ymd_his = DateTime::createFromFormat( 'Y-m-d H:i:s', $get_refer_value ); - - if ( $check_date_ymd || $check_date_ymd_hi || $check_date_ymd_his ) { - - if ( $check_date_ymd ) { - // If it's only 'Y-m-d' format, append the time as 00:00:00. - $get_refer_value .= ' 00:00:00'; - } - - if ( $check_date_ymd_hi ) { - // If it's only 'Y-m-d H:i' format, append the time as 00:00:00. - $get_refer_value .= ':00'; - } - - if ( $get_refer_value <= current_time( 'Y-m-d H:i:s' ) ) { - $display_by_period = true; - } else { - $display_by_period = false; - } - } else { - // This means the value doesn't match either date formats. + } elseif ('referCustomField' === $periodSpecificationMethod) { + $get_refer_value = get_post_meta(get_the_ID(), $periodReferCustomField, true); + $check_date_ymd = DateTime::createFromFormat('Y-m-d', $get_refer_value); + $check_date_ymd_hi = DateTime::createFromFormat('Y-m-d H:i', $get_refer_value); + $check_date_ymd_his = DateTime::createFromFormat('Y-m-d H:i:s', $get_refer_value); + + if ($check_date_ymd || $check_date_ymd_hi || $check_date_ymd_his) { + if ($check_date_ymd) { + $get_refer_value .= ' 00:00:00'; + } + if ($check_date_ymd_hi) { + $get_refer_value .= ':00'; + } + if ($get_refer_value <= current_time('Y-m-d H:i:s')) { $display_by_period = true; + } else { + $display_by_period = false; } } else { $display_by_period = true; } } - } elseif ( 'daysSincePublic' === $attributes['periodDisplaySetting'] ) { - if ( 'direct' === $attributes['periodSpecificationMethod'] ) { - $days_since_public = intval( $attributes['periodDisplayValue'] ); - $post_publish_date = get_post_time( 'U', true, get_the_ID() ); - $current_time = current_time( 'timestamp' ); - - if ( $current_time >= $post_publish_date + ( $days_since_public * 86400 ) ) { + } elseif ('daysSincePublic' === $periodDisplaySetting) { + if ('direct' === $periodSpecificationMethod) { + $days_since_public = intval($periodDisplayValue); + $post_publish_date = get_post_time('U', true, get_the_ID()); + $current_time = current_time('timestamp'); + if ($current_time >= $post_publish_date + ($days_since_public * 86400)) { $display_by_period = false; } else { $display_by_period = true; } - } elseif ( 'referCustomField' === $attributes['periodSpecificationMethod'] ) { - if ( ! empty( $attributes['periodReferCustomField'] ) ) { - $get_refer_value = get_post_meta( get_the_ID(), $attributes['periodReferCustomField'], true ); - - // Check if $get_refer_value is numeric. - if ( is_numeric( $get_refer_value ) ) { - $days_since_public = intval( $get_refer_value ); - $post_publish_date = get_post_time( 'U', true, get_the_ID() ); - $current_time = current_time( 'timestamp' ); - - if ( $current_time >= $post_publish_date + ( $days_since_public * 86400 ) ) { - $display_by_period = false; - } else { - $display_by_period = true; - } + } elseif ('referCustomField' === $periodSpecificationMethod) { + $get_refer_value = get_post_meta(get_the_ID(), $periodReferCustomField, true); + if (is_numeric($get_refer_value)) { + $days_since_public = intval($get_refer_value); + $post_publish_date = get_post_time('U', true, get_the_ID()); + $current_time = current_time('timestamp'); + if ($current_time >= $post_publish_date + ($days_since_public * 86400)) { + $display_by_period = false; } else { - // This means the value is not numeric. $display_by_period = true; } } else { From 8adda0c762510af0ed4ac5ac2eb68349df95ae60 Mon Sep 17 00:00:00 2001 From: osmdik Date: Mon, 2 Oct 2023 11:49:30 +0900 Subject: [PATCH 2/7] change : panel ui --- src/ControlsPanel.js | 191 ------------------------ src/ControlsPanelHeader.js | 96 ------------ src/block.json | 128 +++++----------- src/editor.scss | 56 ++----- src/index.js | 276 ++++++++++++++++++++++++++--------- src/index.php | 292 ++++++++++++++++++------------------- 6 files changed, 400 insertions(+), 639 deletions(-) delete mode 100644 src/ControlsPanel.js delete mode 100644 src/ControlsPanelHeader.js diff --git a/src/ControlsPanel.js b/src/ControlsPanel.js deleted file mode 100644 index 5d3066b..0000000 --- a/src/ControlsPanel.js +++ /dev/null @@ -1,191 +0,0 @@ -import { __ } from '@wordpress/i18n'; -import { - SelectControl, - TextControl, - ToggleControl, - CheckboxControl, - BaseControl, - __experimentalNumberControl as NumberControl, -} from '@wordpress/components'; -import ControlsPanelHeader from './ControlsPanelHeader'; - -const ControlsPanel = ({ attributes, setAttributes, ifPageTypes, userRoles }) => { - const { conditions, exclusion } = attributes; - - console.log("Current attributes: ", attributes); - - const updateConditions = (key, value) => { - const newConditions = { - ...conditions, - [key]: { - ...conditions[key], - properties: value, - }, - }; - setAttributes({ conditions: newConditions }); - }; - - const isAnyConditionEnabled = () => { - return Object.values(conditions).some(condition => condition.enable); - }; - - return ( - <> - - - {isAnyConditionEnabled() && ( - - - {conditions.conditionPageType.enable && ( - updateConditions('conditionPageType', { ifPageType: value })} - /> - )} - - {conditions.conditionPostType.enable && ( - updateConditions('conditionPostType', { ifPostType: value })} - /> - )} - - {conditions.conditionUserRole.enable && ( - - {userRoles.map((role, index) => ( - { - const newRoles = isChecked - ? [...conditions.conditionUserRole.properties.userRole, role.value] - : conditions.conditionUserRole.properties.userRole.filter((r) => r !== role.value); - updateConditions('conditionUserRole', { userRole: newRoles }); - }} - /> - ))} - - )} - - {conditions.conditionCustomField.enable && ( - <> - updateConditions('conditionCustomField', { ...conditions.conditionCustomField.properties, customFieldName: value })} - /> - {conditions.conditionCustomField.properties.customFieldName && ( - <> - updateConditions('conditionCustomField', { ...conditions.conditionCustomField.properties, customFieldRule: value })} - /> - {conditions.conditionCustomField.properties.customFieldRule === 'valueEquals' && ( - <> - updateConditions('conditionCustomField', { ...conditions.conditionCustomField.properties, customFieldValue: value })} - /> - - )} - - )} - - )} - - {conditions.conditionPeriodDisplay.enable && ( - <> - updateConditions('conditionPeriodDisplay', { ...conditions.conditionPeriodDisplay.properties, periodDisplaySetting: value })} - help={ - conditions.conditionPeriodDisplay.properties.periodDisplaySetting === 'deadline' - ? __('After the specified date, it is hidden.', 'vk-dynamic-if-block') - : conditions.conditionPeriodDisplay.properties.periodDisplaySetting === 'startline' - ? __('After the specified date, it is display.', 'vk-dynamic-if-block') - : conditions.conditionPeriodDisplay.properties.periodDisplaySetting === 'daysSincePublic' - ? __('After the specified number of days, it is hidden.', 'vk-dynamic-if-block') - : __('You can set the deadline or startline to be displayed, as well as the time period.', 'vk-dynamic-if-block') - } - /> - {conditions.conditionPeriodDisplay.properties.periodDisplaySetting !== 'none' && ( - <> - updateConditions('conditionPeriodDisplay', { ...conditions.conditionPeriodDisplay.properties, periodSpecificationMethod: value })} - /> - {conditions.conditionPeriodDisplay.properties.periodSpecificationMethod === 'direct' && ( - updateConditions('conditionPeriodDisplay', { ...conditions.conditionPeriodDisplay.properties, periodDisplayValue: value })} - /> - )} - {conditions.conditionPeriodDisplay.properties.periodSpecificationMethod === 'referCustomField' && ( - <> - updateConditions('conditionPeriodDisplay', { ...conditions.conditionPeriodDisplay.properties, periodReferCustomField: value })} - help={ - conditions.conditionPeriodDisplay.properties.periodDisplaySetting === 'daysSincePublic' - ? __('Save the value of the custom field as an integer.', 'vk-dynamic-if-block') - : __('Save the custom field values as Y-m-d H:i:s.', 'vk-dynamic-if-block') - } - className="vkdif__refer-cf-name" - /> - {!conditions.conditionPeriodDisplay.properties.periodReferCustomField && ( -
- {__('Enter the name of the custom field you wish to reference.', 'vk-dynamic-if-block')} -
- )} - - )} - - )} - - )} - - setAttributes({ exclusion: checked })} - /> - - )} - - ); -}; - -export default ControlsPanel; diff --git a/src/ControlsPanelHeader.js b/src/ControlsPanelHeader.js deleted file mode 100644 index 97f69b5..0000000 --- a/src/ControlsPanelHeader.js +++ /dev/null @@ -1,96 +0,0 @@ -import { __ } from '@wordpress/i18n'; -import { DropdownMenu, MenuItem } from '@wordpress/components'; -import { check, plus, moreVertical } from '@wordpress/icons'; - -const ControlsPanelHeader = ({ attributes, setAttributes }) => { - const conditionItems = [ - { key: 'conditionPageType', label: 'Page Type' }, - { key: 'conditionPostType', label: 'Post Type' }, - { key: 'conditionUserRole', label: 'User Role' }, - { key: 'conditionCustomField', label: 'Custom Field' }, - { key: 'conditionPeriodDisplay', label: 'Period Display' }, - ]; - - const defaultConditions = { - conditionPageType: { - properties: { - ifPageType: "none", - } - }, - conditionPostType: { - properties: { - ifPostType: "none", - } - }, - conditionUserRole: { - properties: { - userRole: [], - } - }, - conditionCustomField: { - properties: { - customFieldName: "", - customFieldRule: "valueExists", - customFieldValue: "", - } - }, - conditionPeriodDisplay: { - properties: { - periodDisplaySetting: "none", - periodSpecificationMethod: "direct", - periodDisplayValue: "", - periodReferCustomField: "", - } - }, - }; - - // 条件の有効/無効を切り替える関数 - const toggleCondition = (key) => { - // 既存の条件をディープコピー - const newConditions = JSON.parse(JSON.stringify(attributes.conditions)); - - // 指定されたキーに対応する条件の`enable`フラグをトグル - newConditions[key].enable = !newConditions[key].enable; - - // もし条件が無効になった場合、プロパティをデフォルトにリセット - if (!newConditions[key].enable) { - newConditions[key].properties = defaultConditions[key].properties; - } - - setAttributes({ conditions: newConditions }); - }; - - // どれかの条件がenable: trueであるかどうかを確認する関数 - const isAnyConditionEnabled = () => { - return conditionItems.some(item => attributes.conditions[item.key].enable); - }; - - return ( -
-

Display Conditions

- - {({ onClose }) => ( - <> - {conditionItems.map((item) => ( - { - toggleCondition(item.key); - onClose(); - }} - icon={attributes.conditions[item.key].enable ? check : null} - > - {item.label} - - ))} - - )} - -
- ); -}; - -export default ControlsPanelHeader; diff --git a/src/block.json b/src/block.json index d0bb066..17fb400 100644 --- a/src/block.json +++ b/src/block.json @@ -5,99 +5,49 @@ "category": "theme", "textdomain": "vk-dynamic-if-block", "attributes": { - "conditions": { - "type": "object", - "properties": { - "conditionPageType": { - "type": "object", - "enable": { - "type": "boolean", - "default": false - }, - "properties": { - "ifPageType": { - "type": "string", - "default": "none" - } - } - }, - "conditionPostType": { - "type": "object", - "enable": { - "type": "boolean", - "default": false - }, - "properties": { - "ifPostType": { - "type": "string", - "default": "none" - } - } - }, - "conditionUserRole": { - "type": "object", - "enable": { - "type": "boolean", - "default": false - }, - "properties": { - "userRole": { - "type": "array", - "default": [] - } - } - }, - "conditionCustomField": { - "type": "object", - "enable": { - "type": "boolean", - "default": false - }, - "properties": { - "customFieldName": { - "type": "string", - "default": "" - }, - "customFieldRule": { - "type": "string", - "default": "valueExists" - }, - "customFieldValue": { - "type": "string", - "default": "" - } - } - }, - "conditionPeriodDisplay": { - "type": "object", - "enable": { - "type": "boolean", - "default": false - }, - "properties": { - "periodDisplaySetting": { - "type": "string", - "default": "none" - }, - "periodSpecificationMethod": { - "type": "string", - "default": "direct" - }, - "periodDisplayValue": { - "type": "string", - "default": "" - }, - "periodReferCustomField": { - "type": "string", - "default": "" - } - } - } - } + "ifPageType": { + "type": "string", + "default": "none" + }, + "ifPostType": { + "type": "string", + "default": "none" + }, + "userRole": { + "type": "array", + "default": [] + }, + "customFieldName": { + "type": "string", + "default": "" + }, + "customFieldRule": { + "type": "string", + "default": "valueExists" + }, + "customFieldValue": { + "type": "string", + "default": "" }, "exclusion": { "type": "boolean", "default": false + }, + "periodDisplaySetting": { + "type": "string", + "default": "none" + }, + "periodSpecificationMethod": { + "type": "string", + "default": "direct" + }, + "periodDisplayValue": { + "type": "string", + "default": "" + }, + "periodReferCustomField": { + "type": "string", + "default": "" } }, "supports": { diff --git a/src/editor.scss b/src/editor.scss index d867bb4..adf23db 100644 --- a/src/editor.scss +++ b/src/editor.scss @@ -22,10 +22,19 @@ margin-bottom: 15px; } -.vkdif .vkdif__refer-cf-name { - margin-bottom: 0; - & .components-base-control__help { +.vkdif { + &.components-panel { + border-bottom: 1px solid #e0e0e0; + } + .components-panel__header > h2 { + margin-bottom: 0; + padding: 16px 0; + } + .vkdif__refer-cf-name { margin-bottom: 0; + .components-base-control__help { + margin-bottom: 0; + } } } @@ -57,44 +66,3 @@ } } } - -/** ============================== -UI・仕様変更用 -============================== */ -.vkdif__controls-panel { - border-top: 1px solid #dddddd; - display: grid; - gap: 16px; - margin-top: -1px; - padding: 16px; - .controls-panel-header { - align-items: center; - display: flex; - flex-direction: row; - gap: calc(8px); - grid-column: 1 / -1; - justify-content: space-between; - width: 100%; - -webkit-box-align: center; - -webkit-box-pack: justify; - - h2 { - font-weight: 500; - margin: 0; - } - - .controls-panel-header__dropdown-menus { - line-height: 0; - margin: -4px 0; - - .components-button { - padding: 0px; - min-width: 24px; - } - - .components-spinner { - margin: 0 4px; - } - } - } -} diff --git a/src/index.js b/src/index.js index 868159b..ba5858d 100644 --- a/src/index.js +++ b/src/index.js @@ -1,9 +1,17 @@ import { __ } from '@wordpress/i18n'; import { registerBlockType } from '@wordpress/blocks'; import { useBlockProps, InnerBlocks, InspectorControls } from '@wordpress/block-editor'; +import { + PanelBody, + SelectControl, + TextControl, + ToggleControl, + CheckboxControl, + BaseControl, + __experimentalNumberControl as NumberControl, +} from '@wordpress/components'; import { ReactComponent as Icon } from './icon.svg'; import transforms from './transforms'; -import ControlsPanel from './ControlsPanel' registerBlockType('vk-blocks/dynamic-if', { apiVersion: 2, @@ -12,70 +20,57 @@ registerBlockType('vk-blocks/dynamic-if', { transforms, category: 'theme', attributes: { - conditions: { - type: "object", - default: { - conditionPageType: { - enable: false, - properties: { - ifPageType: "none", - } - }, - conditionPostType: { - enable: false, - properties: { - ifPostType: "none", - } - }, - conditionUserRole: { - enable: false, - properties: { - userRole: [], - } - }, - conditionCustomField: { - enable: false, - properties: { - customFieldName: "", - customFieldRule: "valueExists", - customFieldValue: "", - } - }, - conditionPeriodDisplay: { - enable: false, - properties: { - periodDisplaySetting: "none", - periodSpecificationMethod: "direct", - periodDisplayValue: "", - periodReferCustomField: "", - } - }, - } + ifPageType: { + type: 'string', + default: 'none', + }, + ifPostType: { + type: 'string', + default: 'none', + }, + userRole: { + type: 'array', + default: [], + }, + customFieldName: { + type: 'string', + "default": "" + }, + customFieldRule: { + type: 'string', + "default": "" + }, + customFieldValue: { + type: 'string', + "default": "" }, exclusion: { - type: "boolean", + type: 'boolian', default: false, }, + periodDisplaySetting: { + type: 'string', + "default": "none" + }, + periodSpecificationMethod: { + type: 'string', + "default": "direct" + }, + periodDisplayValue: { + type: 'string', + "default": "" + }, + periodReferCustomField: { + type: 'string', + "default": "" + }, }, supports: { html: false, innerBlocks: true, }, edit({ attributes, setAttributes }) { - const { - conditions: { - conditionPageType: { enable: enablePageType, properties: { ifPageType } }, - conditionPostType: { enable: enablePostType, properties: { ifPostType } }, - conditionUserRole: { enable: enableUserRole, properties: { userRole } }, - conditionCustomField: { enable: enableCustomField, properties: { customFieldName } }, - conditionPeriodDisplay: { enable: enablePeriodDisplay, properties: { periodDisplaySetting } }, - }, - } = attributes; - - const blockClassName = `vk-dynamic-if-block ifPageType-${ifPageType} ifPostType-${ifPostType}`; - const MY_TEMPLATE = [ - ['core/paragraph', {}], - ]; + const { ifPageType, ifPostType, userRole, customFieldName, customFieldRule, customFieldValue, exclusion, periodDisplaySetting, periodSpecificationMethod, periodDisplayValue, periodReferCustomField } = attributes; const ifPageTypes = [ { value: 'none', label: __('No restriction', 'vk-dynamic-if-block') }, @@ -97,6 +92,11 @@ registerBlockType('vk-blocks/dynamic-if', { { value: 'is_404', label: __('404', 'vk-dynamic-if-block') + ' ( is_404() )' }, ]; + const blockClassName = `vk-dynamic-if-block ifPageType-${ifPageType} ifPostType-${ifPostType}`; + const MY_TEMPLATE = [ + ['core/paragraph', {}], + ]; + const userRolesObj = vk_dynamic_if_block_localize_data.userRoles || {}; const userRoles = Object.keys(userRolesObj).map(key => ({ value: key, @@ -105,13 +105,14 @@ registerBlockType('vk-blocks/dynamic-if', { let labels = []; - if (enablePageType && ifPageType !== "none") { + if (ifPageType !== "none") { labels.push(ifPageType); } - if (enablePostType && ifPostType !== "none") { + + if (ifPostType !== "none") { labels.push(ifPostType); } - if (enableUserRole && userRole.length > 0) { + if (userRole.length > 0) { userRole.forEach((roleValue) => { const roleLabel = userRoles.find((role) => role.value === roleValue); if (roleLabel) { @@ -119,10 +120,12 @@ registerBlockType('vk-blocks/dynamic-if', { } }); } - if (enableCustomField && customFieldName) { + + if (customFieldName) { labels.push(customFieldName); } - if (enablePeriodDisplay && periodDisplaySetting !== "none") { + + if (periodDisplaySetting !== "none") { labels.push(periodDisplaySetting); } @@ -130,15 +133,150 @@ registerBlockType('vk-blocks/dynamic-if', { return (
- -
- -
- {/* setAttributes({ exclusion: checked })} - /> */} + + + setAttributes({ ifPageType: value })} + /> + setAttributes({ ifPostType: value })} + /> + + {userRoles.map((role, index) => { + return ( + { + if (isChecked) { + setAttributes({ userRole: [...userRole, role.value] }); + } else { + setAttributes({ userRole: userRole.filter((r) => r !== role.value) }); + } + }} + /> + ); + })} + + + setAttributes({ customFieldName: value }) + } + /> + {customFieldName && ( + <> + setAttributes({ customFieldRule: value })} + /> + {customFieldRule === 'valueEquals' && ( + <> + + setAttributes({ customFieldValue: value }) + } + /> + + )} + + )} + + setAttributes({ periodDisplaySetting: value })} + help={ + periodDisplaySetting === 'deadline' + ? __('After the specified date, it is hidden.', 'vk-dynamic-if-block') + : periodDisplaySetting === 'startline' + ? __('After the specified date, it is display.', 'vk-dynamic-if-block') + : periodDisplaySetting === 'daysSincePublic' + ? __('After the specified number of days, it is hidden.', 'vk-dynamic-if-block') + : __('You can set the deadline or startline to be displayed, as well as the time period.', 'vk-dynamic-if-block') + } + /> + {periodDisplaySetting !== 'none' && ( + <> + setAttributes({ periodSpecificationMethod: value })} + /> + {periodSpecificationMethod === 'direct' && ( + + setAttributes({ periodDisplayValue: value }) + } + /> + )} + {periodSpecificationMethod === 'referCustomField' && ( + <> + + setAttributes({ periodReferCustomField: value }) + } + help={ + periodDisplaySetting === 'daysSincePublic' + ? __('Save the value of the custom field as an integer.', 'vk-dynamic-if-block') + : __('Save the custom field values as Y-m-d H:i:s.', 'vk-dynamic-if-block') + } + className="vkdif__refer-cf-name" + /> + {!periodReferCustomField && ( +
+ {__('Enter the name of the custom field you wish to reference.', 'vk-dynamic-if-block')} +
+ )} + + )} + + )} + + + setAttributes({ exclusion: checked })} + /> +
{labels_string}
diff --git a/src/index.php b/src/index.php index d4d926e..dea9a50 100644 --- a/src/index.php +++ b/src/index.php @@ -16,52 +16,19 @@ */ function vk_dynamic_if_block_render( $attributes, $content ) { $attributes_default = array( - 'conditions' => array( - 'properties' => array( - 'conditionPageType' => array( - 'enable' => false, - 'properties' => array( - 'ifPageType' => 'none' - ) - ), - 'conditionPostType' => array( - 'enable' => false, - 'properties' => array( - 'ifPostType' => 'none' - ) - ), - 'conditionUserRole' => array( - 'enable' => false, - 'properties' => array( - 'userRole' => array() - ) - ), - 'conditionCustomField' => array( - 'enable' => false, - 'properties' => array( - 'customFieldName' => '', - 'customFieldRule' => 'valueExists', - 'customFieldValue' => '' - ) - ), - 'conditionPeriodDisplay' => array( - 'enable' => false, - 'properties' => array( - 'periodDisplaySetting' => 'none', - 'periodSpecificationMethod' => 'direct', - 'periodDisplayValue' => '', - 'periodReferCustomField' => '' - ) - ), - ), - ), - 'exclusion' => false + 'ifPageType' => 'none', + 'ifPostType' => 'none', + 'userRole' => array(), + 'customFieldName' => '', + 'customFieldRule' => 'valueExists', + 'customFieldValue' => '', + 'exclusion' => false, + 'periodDisplaySetting' => 'none', + 'periodSpecificationMethod' => 'direct', + 'periodDisplayValue' => '', + 'periodReferCustomField' => '', ); - - $attributes = array_merge($attributes_default, $attributes); - - // var_dump($attributes); - + $attributes = array_merge( $attributes_default, $attributes ); $display = false; @@ -69,26 +36,24 @@ function vk_dynamic_if_block_render( $attributes, $content ) { $display_by_page_type = false; - $ifPageType = $attributes['conditions']['conditionPageType']['properties']['ifPageType']; - if ( - is_front_page() && 'is_front_page' === $ifPageType || - is_single() && 'is_single' === $ifPageType || - is_page() && 'is_page' === $ifPageType || - is_singular() && 'is_singular' === $ifPageType || - is_home() && ! is_front_page() && 'is_home' === $ifPageType || - is_post_type_archive() && 'is_post_type_archive' === $ifPageType || - is_category() && 'is_category' === $ifPageType || - is_tag() && 'is_tag' === $ifPageType || - is_tax() && 'is_tax' === $ifPageType || - is_year() && 'is_year' === $ifPageType || - is_month() && 'is_month' === $ifPageType || - is_date() && 'is_date' === $ifPageType || - is_author() && 'is_author' === $ifPageType || - is_search() && 'is_search' === $ifPageType || - is_404() && 'is_404' === $ifPageType || - is_archive() && 'is_archive' === $ifPageType || - 'none' === $ifPageType + is_front_page() && 'is_front_page' === $attributes['ifPageType'] || + is_single() && 'is_single' === $attributes['ifPageType'] || + is_page() && 'is_page' === $attributes['ifPageType'] || + is_singular() && 'is_singular' === $attributes['ifPageType'] || + is_home() && ! is_front_page() && 'is_home' === $attributes['ifPageType'] || + is_post_type_archive() && 'is_post_type_archive' === $attributes['ifPageType'] || + is_category() && 'is_category' === $attributes['ifPageType'] || + is_tag() && 'is_tag' === $attributes['ifPageType'] || + is_tax() && 'is_tax' === $attributes['ifPageType'] || + is_year() && 'is_year' === $attributes['ifPageType'] || + is_month() && 'is_month' === $attributes['ifPageType'] || + is_date() && 'is_date' === $attributes['ifPageType'] || + is_author() && 'is_author' === $attributes['ifPageType'] || + is_search() && 'is_search' === $attributes['ifPageType'] || + is_404() && 'is_404' === $attributes['ifPageType'] || + is_archive() && 'is_archive' === $attributes['ifPageType'] || + 'none' === $attributes['ifPageType'] ) { $display_by_page_type = true; } @@ -106,11 +71,9 @@ function vk_dynamic_if_block_render( $attributes, $content ) { $post_type_slug = get_post_type(); } - $ifPostType = $attributes['conditions']['conditionPostType']['properties']['ifPostType']; - - if ( 'none' === $ifPostType ) { + if ( 'none' === $attributes['ifPostType'] ) { $display_by_post_type = true; - } elseif ( $post_type_slug === $ifPostType ) { + } elseif ( $post_type_slug === $attributes['ifPostType'] ) { $display_by_post_type = true; } else { $display_by_post_type = false; @@ -120,8 +83,6 @@ function vk_dynamic_if_block_render( $attributes, $content ) { $display_by_user_role = false; - $userRole = $attributes['conditions']['conditionUserRole']['properties']['userRole']; - // PHPUnit用のユーザーロール情報がある場合はそれを設定. if ( ! empty( $attributes['test_user_roles'] ) ) { $user_roles = $attributes['test_user_roles']; @@ -130,13 +91,14 @@ function vk_dynamic_if_block_render( $attributes, $content ) { $user_roles = (array) $current_user->roles; } - if ( ! isset( $userRole ) || empty( $userRole ) ) { + if ( ! isset( $attributes['userRole'] ) || empty( $attributes['userRole'] ) ) { $display_by_user_role = true; } else { if ( is_user_logged_in() || $user_roles ) { + // Check if any of the user's roles match the selected roles. foreach ( $user_roles as $role ) { - if ( in_array( $role, $userRole ) ) { + if ( in_array( $role, $attributes['userRole'] ) ) { $display_by_user_role = true; break; } @@ -150,21 +112,20 @@ function vk_dynamic_if_block_render( $attributes, $content ) { $display_by_custom_field = false; - $conditionCustomField = $attributes['conditions']['conditionCustomField']['properties']; - - if ( ! $conditionCustomField['customFieldName'] ) { + if ( ! $attributes['customFieldName'] ) { $display_by_custom_field = true; - } elseif ( $conditionCustomField['customFieldName'] ) { + } elseif ( $attributes['customFieldName'] ) { + if ( get_the_ID() ) { - $get_value = get_post_meta( get_the_ID(), $conditionCustomField['customFieldName'], true ); - if ( 'valueExists' === $conditionCustomField['customFieldRule'] || empty( $conditionCustomField['customFieldRule'] ) ) { + $get_value = get_post_meta( get_the_ID(), $attributes['customFieldName'], true ); + if ( 'valueExists' === $attributes['customFieldRule'] || empty( $attributes['customFieldRule'] ) ) { if ( $get_value || '0' === $get_value ) { $display_by_custom_field = true; } else { $display_by_custom_field = false; } - } elseif ( 'valueEquals' === $conditionCustomField['customFieldRule'] ) { - if ( $get_value === $conditionCustomField['customFieldValue'] ) { + } elseif ( 'valueEquals' === $attributes['customFieldRule'] ) { + if ( $get_value === $attributes['customFieldValue'] ) { $display_by_custom_field = true; } else { $display_by_custom_field = false; @@ -177,109 +138,140 @@ function vk_dynamic_if_block_render( $attributes, $content ) { $display_by_period = false; - $conditionPeriodDisplay = $attributes['conditions']['conditionPeriodDisplay']['properties']; - - $periodDisplaySetting = $conditionPeriodDisplay['periodDisplaySetting']; - $periodSpecificationMethod = $conditionPeriodDisplay['periodSpecificationMethod']; - $periodDisplayValue = $conditionPeriodDisplay['periodDisplayValue']; - $periodReferCustomField = $conditionPeriodDisplay['periodReferCustomField']; - - if ( 'none' === $periodDisplaySetting ) { + if ( 'none' === $attributes['periodDisplaySetting'] ) { $display_by_period = true; - } elseif ( 'deadline' === $periodDisplaySetting ) { - if ( 'direct' === $periodSpecificationMethod ) { + } elseif ( 'deadline' === $attributes['periodDisplaySetting'] ) { + if ( 'direct' === $attributes['periodSpecificationMethod'] ) { - // Adjust time if no specific time is set - if ($periodDisplayValue === date('Y-m-d', strtotime($periodDisplayValue))) { - $periodDisplayValue .= ' 23:59'; + // 時間指定がない場合(日付までで時間が入力されていない場合)に時間を自動指定. + if ( $attributes['periodDisplayValue'] === date( 'Y-m-d', strtotime( $attributes['periodDisplayValue'] ) ) ) { + $attributes['periodDisplayValue'] .= ' 23:59'; } - // Ensure the date format is consistent - if ($periodDisplayValue !== date('Y-m-d H:i', strtotime($periodDisplayValue))) { - $periodDisplayValue = date('Y-m-d H:i', strtotime($periodDisplayValue)); + // 日付のフォーマットを Y-m-d H:i に指定. + if ( $attributes['periodDisplayValue'] !== date( 'Y-m-d H:i', strtotime( $attributes['periodDisplayValue'] ) ) ) { + $attributes['periodDisplayValue'] = date( 'Y-m-d H:i', strtotime( $attributes['periodDisplayValue'] ) ); } - if ($periodDisplayValue > current_time('Y-m-d H:i')) { + if ( $attributes['periodDisplayValue'] > current_time( 'Y-m-d H:i' ) ) { $display_by_period = true; } else { $display_by_period = false; } - } elseif ('referCustomField' === $periodSpecificationMethod) { - $get_refer_value = get_post_meta(get_the_ID(), $periodReferCustomField, true); - $check_date_ymd = DateTime::createFromFormat('Y-m-d', $get_refer_value); - $check_date_ymd_hi = DateTime::createFromFormat('Y-m-d H:i', $get_refer_value); - $check_date_ymd_his = DateTime::createFromFormat('Y-m-d H:i:s', $get_refer_value); - - if ($check_date_ymd || $check_date_ymd_hi || $check_date_ymd_his) { - if ($check_date_ymd) { - $get_refer_value .= ' 23:59:59'; - } - if ($check_date_ymd_hi) { - $get_refer_value .= ':59'; - } - if ($get_refer_value > current_time('Y-m-d H:i:s')) { - $display_by_period = true; + } elseif ( 'referCustomField' === $attributes['periodSpecificationMethod'] ) { + if ( ! empty( $attributes['periodReferCustomField'] ) ) { + $get_refer_value = get_post_meta( get_the_ID(), $attributes['periodReferCustomField'], true ); + + // Check if $get_refer_value matches the date format. + $check_date_ymd = DateTime::createFromFormat( 'Y-m-d', $get_refer_value ); + $check_date_ymd_hi = DateTime::createFromFormat( 'Y-m-d H:i', $get_refer_value ); + $check_date_ymd_his = DateTime::createFromFormat( 'Y-m-d H:i:s', $get_refer_value ); + + if ( $check_date_ymd || $check_date_ymd_hi || $check_date_ymd_his ) { + + if ( $check_date_ymd ) { + // If it's only 'Y-m-d' format, append the time as 23:59. + $get_refer_value .= ' 23:59:59'; + } + + if ( $check_date_ymd_hi ) { + // If it's only 'Y-m-d H:s' format, append the time as 23:59:59. + $get_refer_value .= ':59'; + } + + if ( $get_refer_value > current_time( 'Y-m-d H:i:s' ) ) { + $display_by_period = true; + } else { + $display_by_period = false; + } } else { - $display_by_period = false; + // This means the value doesn't match either date formats + $display_by_period = true; } } else { $display_by_period = true; } } - } elseif ('startline' === $periodDisplaySetting) { - if ('direct' === $periodSpecificationMethod) { - if ($periodDisplayValue === date('Y-m-d', strtotime($periodDisplayValue))) { - $periodDisplayValue .= ' 00:00'; + } elseif ( 'startline' === $attributes['periodDisplaySetting'] ) { + if ( 'direct' === $attributes['periodSpecificationMethod'] ) { + + // 時間指定がない場合に時間を自動指定. + if ( $attributes['periodDisplayValue'] === date( 'Y-m-d', strtotime( $attributes['periodDisplayValue'] ) ) ) { + $attributes['periodDisplayValue'] .= ' 00:00'; } - if ($periodDisplayValue !== date('Y-m-d H:i', strtotime($periodDisplayValue))) { - $periodDisplayValue = date('Y-m-d H:i', strtotime($periodDisplayValue)); + + // 日付のフォーマットを Y-m-d H:i に指定. + if ( $attributes['periodDisplayValue'] !== date( 'Y-m-d H:i', strtotime( $attributes['periodDisplayValue'] ) ) ) { + $attributes['periodDisplayValue'] = date( 'Y-m-d H:i', strtotime( $attributes['periodDisplayValue'] ) ); } - if ($periodDisplayValue <= current_time('Y-m-d H:i')) { + + if ( $attributes['periodDisplayValue'] <= current_time( 'Y-m-d H:i' ) ) { $display_by_period = true; } else { $display_by_period = false; } - } elseif ('referCustomField' === $periodSpecificationMethod) { - $get_refer_value = get_post_meta(get_the_ID(), $periodReferCustomField, true); - $check_date_ymd = DateTime::createFromFormat('Y-m-d', $get_refer_value); - $check_date_ymd_hi = DateTime::createFromFormat('Y-m-d H:i', $get_refer_value); - $check_date_ymd_his = DateTime::createFromFormat('Y-m-d H:i:s', $get_refer_value); - - if ($check_date_ymd || $check_date_ymd_hi || $check_date_ymd_his) { - if ($check_date_ymd) { - $get_refer_value .= ' 00:00:00'; - } - if ($check_date_ymd_hi) { - $get_refer_value .= ':00'; - } - if ($get_refer_value <= current_time('Y-m-d H:i:s')) { - $display_by_period = true; + } elseif ( 'referCustomField' === $attributes['periodSpecificationMethod'] ) { + if ( ! empty( $attributes['periodReferCustomField'] ) ) { + $get_refer_value = get_post_meta( get_the_ID(), $attributes['periodReferCustomField'], true ); + + // Check if $get_refer_value matches the date format. + $check_date_ymd = DateTime::createFromFormat( 'Y-m-d', $get_refer_value ); + $check_date_ymd_hi = DateTime::createFromFormat( 'Y-m-d H:i', $get_refer_value ); + $check_date_ymd_his = DateTime::createFromFormat( 'Y-m-d H:i:s', $get_refer_value ); + + if ( $check_date_ymd || $check_date_ymd_hi || $check_date_ymd_his ) { + + if ( $check_date_ymd ) { + // If it's only 'Y-m-d' format, append the time as 00:00:00. + $get_refer_value .= ' 00:00:00'; + } + + if ( $check_date_ymd_hi ) { + // If it's only 'Y-m-d H:i' format, append the time as 00:00:00. + $get_refer_value .= ':00'; + } + + if ( $get_refer_value <= current_time( 'Y-m-d H:i:s' ) ) { + $display_by_period = true; + } else { + $display_by_period = false; + } } else { - $display_by_period = false; + // This means the value doesn't match either date formats. + $display_by_period = true; } } else { $display_by_period = true; } } - } elseif ('daysSincePublic' === $periodDisplaySetting) { - if ('direct' === $periodSpecificationMethod) { - $days_since_public = intval($periodDisplayValue); - $post_publish_date = get_post_time('U', true, get_the_ID()); - $current_time = current_time('timestamp'); - if ($current_time >= $post_publish_date + ($days_since_public * 86400)) { + } elseif ( 'daysSincePublic' === $attributes['periodDisplaySetting'] ) { + if ( 'direct' === $attributes['periodSpecificationMethod'] ) { + $days_since_public = intval( $attributes['periodDisplayValue'] ); + $post_publish_date = get_post_time( 'U', true, get_the_ID() ); + $current_time = current_time( 'timestamp' ); + + if ( $current_time >= $post_publish_date + ( $days_since_public * 86400 ) ) { $display_by_period = false; } else { $display_by_period = true; } - } elseif ('referCustomField' === $periodSpecificationMethod) { - $get_refer_value = get_post_meta(get_the_ID(), $periodReferCustomField, true); - if (is_numeric($get_refer_value)) { - $days_since_public = intval($get_refer_value); - $post_publish_date = get_post_time('U', true, get_the_ID()); - $current_time = current_time('timestamp'); - if ($current_time >= $post_publish_date + ($days_since_public * 86400)) { - $display_by_period = false; + } elseif ( 'referCustomField' === $attributes['periodSpecificationMethod'] ) { + if ( ! empty( $attributes['periodReferCustomField'] ) ) { + $get_refer_value = get_post_meta( get_the_ID(), $attributes['periodReferCustomField'], true ); + + // Check if $get_refer_value is numeric. + if ( is_numeric( $get_refer_value ) ) { + $days_since_public = intval( $get_refer_value ); + $post_publish_date = get_post_time( 'U', true, get_the_ID() ); + $current_time = current_time( 'timestamp' ); + + if ( $current_time >= $post_publish_date + ( $days_since_public * 86400 ) ) { + $display_by_period = false; + } else { + $display_by_period = true; + } } else { + // This means the value is not numeric. $display_by_period = true; } } else { From 54048b9f61a90ff493efeabf2c26a87fc0e1d977 Mon Sep 17 00:00:00 2001 From: osmdik Date: Mon, 2 Oct 2023 15:09:05 +0900 Subject: [PATCH 3/7] fix : ui --- src/index.js | 268 +++++++++++++++++++++++++++------------------------ 1 file changed, 140 insertions(+), 128 deletions(-) diff --git a/src/index.js b/src/index.js index ba5858d..10d5bcc 100644 --- a/src/index.js +++ b/src/index.js @@ -2,6 +2,7 @@ import { __ } from '@wordpress/i18n'; import { registerBlockType } from '@wordpress/blocks'; import { useBlockProps, InnerBlocks, InspectorControls } from '@wordpress/block-editor'; import { + Panel, PanelBody, SelectControl, TextControl, @@ -134,149 +135,160 @@ registerBlockType('vk-blocks/dynamic-if', { return (
- - setAttributes({ ifPageType: value })} - /> - setAttributes({ ifPostType: value })} - /> - - {userRoles.map((role, index) => { - return ( - { - if (isChecked) { - setAttributes({ userRole: [...userRole, role.value] }); - } else { - setAttributes({ userRole: userRole.filter((r) => r !== role.value) }); - } - }} - /> - ); - })} - - - setAttributes({ customFieldName: value }) - } - /> - {customFieldName && ( - <> + + + setAttributes({ ifPageType: value })} + /> + + setAttributes({ customFieldRule: value })} + label={__('Post Type', 'vk-dynamic-if-block')} + value={ifPostType} + options={vk_dynamic_if_block_localize_data.postTypeSelectOptions} + onChange={(value) => setAttributes({ ifPostType: value })} + /> + + + + {userRoles.map((role, index) => { + return ( + { + if (isChecked) { + setAttributes({ userRole: [...userRole, role.value] }); + } else { + setAttributes({ userRole: userRole.filter((r) => r !== role.value) }); + } + }} + /> + ); + })} + + + + + setAttributes({ customFieldName: value }) + } /> - {customFieldRule === 'valueEquals' && ( + {customFieldName && ( <> - - setAttributes({ customFieldValue: value }) - } + setAttributes({ customFieldRule: value })} /> + {customFieldRule === 'valueEquals' && ( + <> + + setAttributes({ customFieldValue: value }) + } + /> + + )} )} - - )} - - setAttributes({ periodDisplaySetting: value })} - help={ - periodDisplaySetting === 'deadline' - ? __('After the specified date, it is hidden.', 'vk-dynamic-if-block') - : periodDisplaySetting === 'startline' - ? __('After the specified date, it is display.', 'vk-dynamic-if-block') - : periodDisplaySetting === 'daysSincePublic' - ? __('After the specified number of days, it is hidden.', 'vk-dynamic-if-block') - : __('You can set the deadline or startline to be displayed, as well as the time period.', 'vk-dynamic-if-block') - } - /> - {periodDisplaySetting !== 'none' && ( - <> + + + setAttributes({ periodSpecificationMethod: value })} + onChange={(value) => setAttributes({ periodDisplaySetting: value })} + help={ + periodDisplaySetting === 'deadline' + ? __('After the specified date, it is hidden.', 'vk-dynamic-if-block') + : periodDisplaySetting === 'startline' + ? __('After the specified date, it is display.', 'vk-dynamic-if-block') + : periodDisplaySetting === 'daysSincePublic' + ? __('After the specified number of days, it is hidden.', 'vk-dynamic-if-block') + : __('You can set the deadline or startline to be displayed, as well as the time period.', 'vk-dynamic-if-block') + } /> - {periodSpecificationMethod === 'direct' && ( - - setAttributes({ periodDisplayValue: value }) - } - /> - )} - {periodSpecificationMethod === 'referCustomField' && ( + {periodDisplaySetting !== 'none' && ( <> - - setAttributes({ periodReferCustomField: value }) - } - help={ - periodDisplaySetting === 'daysSincePublic' - ? __('Save the value of the custom field as an integer.', 'vk-dynamic-if-block') - : __('Save the custom field values as Y-m-d H:i:s.', 'vk-dynamic-if-block') - } - className="vkdif__refer-cf-name" + setAttributes({ periodSpecificationMethod: value })} /> - {!periodReferCustomField && ( -
- {__('Enter the name of the custom field you wish to reference.', 'vk-dynamic-if-block')} -
+ {periodSpecificationMethod === 'direct' && ( + + setAttributes({ periodDisplayValue: value }) + } + /> + )} + {periodSpecificationMethod === 'referCustomField' && ( + <> + + setAttributes({ periodReferCustomField: value }) + } + help={ + periodDisplaySetting === 'daysSincePublic' + ? __('Save the value of the custom field as an integer.', 'vk-dynamic-if-block') + : __('Save the custom field values as Y-m-d H:i:s.', 'vk-dynamic-if-block') + } + className="vkdif__refer-cf-name" + /> + {!periodReferCustomField && ( +
+ {__('Enter the name of the custom field you wish to reference.', 'vk-dynamic-if-block')} +
+ )} + )} )} - - )} - - - setAttributes({ exclusion: checked })} - /> - + + + + setAttributes({ exclusion: checked })} + /> + +
{labels_string}
From 18f57894379da982b25ce1ddbb3af733c65e791c Mon Sep 17 00:00:00 2001 From: osmdik Date: Tue, 3 Oct 2023 11:04:03 +0900 Subject: [PATCH 4/7] change : option selection method --- package-lock.json | 29 ++-- package.json | 1 + src/block.json | 8 +- src/index.js | 339 ++++++++++++++++++++++++++-------------------- src/index.php | 94 ++++++++----- 5 files changed, 275 insertions(+), 196 deletions(-) diff --git a/package-lock.json b/package-lock.json index e02abab..baca884 100644 --- a/package-lock.json +++ b/package-lock.json @@ -13,6 +13,7 @@ "@wordpress/icons": "^9.31.0" }, "devDependencies": { + "@wordpress/element": "^5.19.0", "@wordpress/scripts": "^26.1.0", "npm-run-all": "^4.1.5", "postcss-cli": "^8.3.1", @@ -4027,14 +4028,14 @@ } }, "node_modules/@wordpress/element": { - "version": "5.17.0", - "resolved": "https://registry.npmjs.org/@wordpress/element/-/element-5.17.0.tgz", - "integrity": "sha512-sVjVWlKnpzTM4kfwfTgT9TtCcqqb3MqII9cLzM3DCVDFIUrudEUlbqX9lUCnnSfWCjoQ/YPaWg4LikKrRVmPQw==", + "version": "5.19.0", + "resolved": "https://registry.npmjs.org/@wordpress/element/-/element-5.19.0.tgz", + "integrity": "sha512-uTRrt6zrtdXT5DkffvKSLoCw0aLOHHbV4dDnh6NNR4n2roxhPK7MQRUpybVfuzyvCTIzKPI/0E3q87AWshePNg==", "dependencies": { "@babel/runtime": "^7.16.0", "@types/react": "^18.0.21", "@types/react-dom": "^18.0.6", - "@wordpress/escape-html": "^2.40.0", + "@wordpress/escape-html": "^2.42.0", "change-case": "^4.1.2", "is-plain-object": "^5.0.0", "react": "^18.2.0", @@ -4067,9 +4068,9 @@ } }, "node_modules/@wordpress/escape-html": { - "version": "2.40.0", - "resolved": "https://registry.npmjs.org/@wordpress/escape-html/-/escape-html-2.40.0.tgz", - "integrity": "sha512-hWbtydaYHud/qbXauCNR1h5pfmXJQwzdKfdQUMqEjms2sqm2nQQXGxi/t8CLc2HjrNenzHqOZaonfQ/nx+1l1A==", + "version": "2.42.0", + "resolved": "https://registry.npmjs.org/@wordpress/escape-html/-/escape-html-2.42.0.tgz", + "integrity": "sha512-hC/SfA3mrLEL1QiXEp+yEb7BhgqUkmYnXnuuuGD/xxazPVdMoW80gNxeFYnVQrNnc48EC7JbWGlTuB93D2EeMw==", "dependencies": { "@babel/runtime": "^7.16.0" }, @@ -20160,14 +20161,14 @@ } }, "@wordpress/element": { - "version": "5.17.0", - "resolved": "https://registry.npmjs.org/@wordpress/element/-/element-5.17.0.tgz", - "integrity": "sha512-sVjVWlKnpzTM4kfwfTgT9TtCcqqb3MqII9cLzM3DCVDFIUrudEUlbqX9lUCnnSfWCjoQ/YPaWg4LikKrRVmPQw==", + "version": "5.19.0", + "resolved": "https://registry.npmjs.org/@wordpress/element/-/element-5.19.0.tgz", + "integrity": "sha512-uTRrt6zrtdXT5DkffvKSLoCw0aLOHHbV4dDnh6NNR4n2roxhPK7MQRUpybVfuzyvCTIzKPI/0E3q87AWshePNg==", "requires": { "@babel/runtime": "^7.16.0", "@types/react": "^18.0.21", "@types/react-dom": "^18.0.6", - "@wordpress/escape-html": "^2.40.0", + "@wordpress/escape-html": "^2.42.0", "change-case": "^4.1.2", "is-plain-object": "^5.0.0", "react": "^18.2.0", @@ -20194,9 +20195,9 @@ } }, "@wordpress/escape-html": { - "version": "2.40.0", - "resolved": "https://registry.npmjs.org/@wordpress/escape-html/-/escape-html-2.40.0.tgz", - "integrity": "sha512-hWbtydaYHud/qbXauCNR1h5pfmXJQwzdKfdQUMqEjms2sqm2nQQXGxi/t8CLc2HjrNenzHqOZaonfQ/nx+1l1A==", + "version": "2.42.0", + "resolved": "https://registry.npmjs.org/@wordpress/escape-html/-/escape-html-2.42.0.tgz", + "integrity": "sha512-hC/SfA3mrLEL1QiXEp+yEb7BhgqUkmYnXnuuuGD/xxazPVdMoW80gNxeFYnVQrNnc48EC7JbWGlTuB93D2EeMw==", "requires": { "@babel/runtime": "^7.16.0" } diff --git a/package.json b/package.json index bf2a63c..d6a4dff 100644 --- a/package.json +++ b/package.json @@ -29,6 +29,7 @@ "@wordpress/icons": "^9.31.0" }, "devDependencies": { + "@wordpress/element": "^5.19.0", "@wordpress/scripts": "^26.1.0", "npm-run-all": "^4.1.5", "postcss-cli": "^8.3.1", diff --git a/src/block.json b/src/block.json index 17fb400..ade47d0 100644 --- a/src/block.json +++ b/src/block.json @@ -6,12 +6,12 @@ "textdomain": "vk-dynamic-if-block", "attributes": { "ifPageType": { - "type": "string", - "default": "none" + "type": "array", + "default": [] }, "ifPostType": { - "type": "string", - "default": "none" + "type": "array", + "default": [] }, "userRole": { "type": "array", diff --git a/src/index.js b/src/index.js index 10d5bcc..d26447b 100644 --- a/src/index.js +++ b/src/index.js @@ -11,6 +11,7 @@ import { BaseControl, __experimentalNumberControl as NumberControl, } from '@wordpress/components'; +import { useEffect } from '@wordpress/element'; import { ReactComponent as Icon } from './icon.svg'; import transforms from './transforms'; @@ -22,12 +23,12 @@ registerBlockType('vk-blocks/dynamic-if', { category: 'theme', attributes: { ifPageType: { - type: 'string', - default: 'none', + type: 'array', + default: [], }, ifPostType: { - type: 'string', - default: 'none', + type: 'array', + default: [], }, userRole: { type: 'array', @@ -74,7 +75,6 @@ registerBlockType('vk-blocks/dynamic-if', { const { ifPageType, ifPostType, userRole, customFieldName, customFieldRule, customFieldValue, exclusion, periodDisplaySetting, periodSpecificationMethod, periodDisplayValue, periodReferCustomField } = attributes; const ifPageTypes = [ - { value: 'none', label: __('No restriction', 'vk-dynamic-if-block') }, { value: 'is_front_page', label: __('Front Page', 'vk-dynamic-if-block') + ' ( is_front_page() )' }, { value: 'is_single', label: __('Single', 'vk-dynamic-if-block') + ' ( is_single() )' }, { value: 'is_page', label: __('Page', 'vk-dynamic-if-block') + ' ( is_page() )' }, @@ -106,12 +106,21 @@ registerBlockType('vk-blocks/dynamic-if', { let labels = []; - if (ifPageType !== "none") { - labels.push(ifPageType); + if (ifPageType.length > 0) { + ifPageType.forEach((pageTypeValue) => { + const pageTypeLabel = ifPageTypes.find((pageType) => pageType.value === pageTypeValue); + if (pageTypeLabel) { + labels.push(pageTypeLabel.value); + } + }); } - - if (ifPostType !== "none") { - labels.push(ifPostType); + if (ifPostType.length > 0) { + ifPostType.forEach((postTypeValue) => { + const postTypeLabel = vk_dynamic_if_block_localize_data.postTypeSelectOptions.find((postType) => postType.value === postTypeValue); + if (postTypeLabel) { + labels.push(postTypeLabel.value); + } + }); } if (userRole.length > 0) { userRole.forEach((roleValue) => { @@ -135,160 +144,196 @@ registerBlockType('vk-blocks/dynamic-if', { return (
- - - setAttributes({ ifPageType: value })} - /> - - - setAttributes({ ifPostType: value })} - /> - - - - {userRoles.map((role, index) => { - return ( - { - if (isChecked) { - setAttributes({ userRole: [...userRole, role.value] }); - } else { - setAttributes({ userRole: userRole.filter((r) => r !== role.value) }); - } - }} + + + + {ifPageTypes.map((pageType, index) => { + return ( + { + if (isChecked) { + setAttributes({ ifPageType: [...ifPageType, pageType.value] }); + } else { + setAttributes({ ifPageType: ifPageType.filter((v) => v !== pageType.value) }); + } + }} + /> + ); + })} + + + + + {vk_dynamic_if_block_localize_data.postTypeSelectOptions.map((postType, index) => { + return ( + { + if (isChecked) { + setAttributes({ ifPostType: [...ifPostType, postType.value] }); + } else { + setAttributes({ ifPostType: ifPostType.filter((v) => v !== postType.value) }); + } + }} + /> + ); + })} + + + + + {userRoles.map((role, index) => { + return ( + { + if (isChecked) { + setAttributes({ userRole: [...userRole, role.value] }); + } else { + setAttributes({ userRole: userRole.filter((r) => r !== role.value) }); + } + }} + /> + ); + })} + + + + + setAttributes({ customFieldName: value }) + } + /> + {customFieldName && ( + <> + setAttributes({ customFieldRule: value })} + /> + {customFieldRule === 'valueEquals' && ( + <> + + setAttributes({ customFieldValue: value }) + } /> - ); - })} - - - - - setAttributes({ customFieldName: value }) + + )} + + )} + + + + setAttributes({ periodDisplaySetting: value })} + help={ + periodDisplaySetting === 'deadline' + ? __('After the specified date, it is hidden.', 'vk-dynamic-if-block') + : periodDisplaySetting === 'startline' + ? __('After the specified date, it is display.', 'vk-dynamic-if-block') + : periodDisplaySetting === 'daysSincePublic' + ? __('After the specified number of days, it is hidden.', 'vk-dynamic-if-block') + : __('You can set the deadline or startline to be displayed, as well as the time period.', 'vk-dynamic-if-block') } /> - {customFieldName && ( + {periodDisplaySetting !== 'none' && ( <> setAttributes({ customFieldRule: value })} + onChange={(value) => setAttributes({ periodSpecificationMethod: value })} /> - {customFieldRule === 'valueEquals' && ( + {periodSpecificationMethod === 'direct' && ( + + setAttributes({ periodDisplayValue: value }) + } + /> + )} + {periodSpecificationMethod === 'referCustomField' && ( <> - setAttributes({ customFieldValue: value }) + setAttributes({ periodReferCustomField: value }) + } + help={ + periodDisplaySetting === 'daysSincePublic' + ? __('Save the value of the custom field as an integer.', 'vk-dynamic-if-block') + : __('Save the custom field values as Y-m-d H:i:s.', 'vk-dynamic-if-block') } + className="vkdif__refer-cf-name" /> + {!periodReferCustomField && ( +
+ {__('Enter the name of the custom field you wish to reference.', 'vk-dynamic-if-block')} +
+ )} )} )} - - - - setAttributes({ periodDisplaySetting: value })} - help={ - periodDisplaySetting === 'deadline' - ? __('After the specified date, it is hidden.', 'vk-dynamic-if-block') - : periodDisplaySetting === 'startline' - ? __('After the specified date, it is display.', 'vk-dynamic-if-block') - : periodDisplaySetting === 'daysSincePublic' - ? __('After the specified number of days, it is hidden.', 'vk-dynamic-if-block') - : __('You can set the deadline or startline to be displayed, as well as the time period.', 'vk-dynamic-if-block') - } - /> - {periodDisplaySetting !== 'none' && ( - <> - setAttributes({ periodSpecificationMethod: value })} - /> - {periodSpecificationMethod === 'direct' && ( - - setAttributes({ periodDisplayValue: value }) - } - /> - )} - {periodSpecificationMethod === 'referCustomField' && ( - <> - - setAttributes({ periodReferCustomField: value }) - } - help={ - periodDisplaySetting === 'daysSincePublic' - ? __('Save the value of the custom field as an integer.', 'vk-dynamic-if-block') - : __('Save the custom field values as Y-m-d H:i:s.', 'vk-dynamic-if-block') - } - className="vkdif__refer-cf-name" - /> - {!periodReferCustomField && ( -
- {__('Enter the name of the custom field you wish to reference.', 'vk-dynamic-if-block')} -
- )} - - )} - - )} - - - - setAttributes({ exclusion: checked })} - /> - - + + + + setAttributes({ exclusion: checked })} + /> + +
{labels_string}
diff --git a/src/index.php b/src/index.php index dea9a50..8dd53ed 100644 --- a/src/index.php +++ b/src/index.php @@ -16,8 +16,8 @@ */ function vk_dynamic_if_block_render( $attributes, $content ) { $attributes_default = array( - 'ifPageType' => 'none', - 'ifPostType' => 'none', + 'ifPageType' => array(), + 'ifPostType' => array(), 'userRole' => array(), 'customFieldName' => '', 'customFieldRule' => 'valueExists', @@ -36,28 +36,58 @@ function vk_dynamic_if_block_render( $attributes, $content ) { $display_by_page_type = false; - if ( - is_front_page() && 'is_front_page' === $attributes['ifPageType'] || - is_single() && 'is_single' === $attributes['ifPageType'] || - is_page() && 'is_page' === $attributes['ifPageType'] || - is_singular() && 'is_singular' === $attributes['ifPageType'] || - is_home() && ! is_front_page() && 'is_home' === $attributes['ifPageType'] || - is_post_type_archive() && 'is_post_type_archive' === $attributes['ifPageType'] || - is_category() && 'is_category' === $attributes['ifPageType'] || - is_tag() && 'is_tag' === $attributes['ifPageType'] || - is_tax() && 'is_tax' === $attributes['ifPageType'] || - is_year() && 'is_year' === $attributes['ifPageType'] || - is_month() && 'is_month' === $attributes['ifPageType'] || - is_date() && 'is_date' === $attributes['ifPageType'] || - is_author() && 'is_author' === $attributes['ifPageType'] || - is_search() && 'is_search' === $attributes['ifPageType'] || - is_404() && 'is_404' === $attributes['ifPageType'] || - is_archive() && 'is_archive' === $attributes['ifPageType'] || - 'none' === $attributes['ifPageType'] - ) { + $current_page_type = ''; + + if ( is_front_page() ) { + $current_page_type = 'is_front_page'; + } elseif ( is_single() ) { + $current_page_type = 'is_single'; + } elseif ( is_page() ) { + $current_page_type = 'is_page'; + } elseif ( is_singular() ) { + $current_page_type = 'is_singular'; + } elseif ( is_home() && ! is_front_page() ) { + $current_page_type = 'is_home'; + } elseif ( is_post_type_archive() ) { + $current_page_type = 'is_post_type_archive'; + } elseif ( is_category() ) { + $current_page_type = 'is_category'; + } elseif ( is_tag() ) { + $current_page_type = 'is_tag'; + } elseif ( is_tax() ) { + $current_page_type = 'is_tax'; + } elseif ( is_year() ) { + $current_page_type = 'is_year'; + } elseif ( is_month() ) { + $current_page_type = 'is_month'; + } elseif ( is_date() ) { + $current_page_type = 'is_date'; + } elseif ( is_author() ) { + $current_page_type = 'is_author'; + } elseif ( is_archive() ) { + $current_page_type = 'is_archive'; + } elseif ( is_search() ) { + $current_page_type = 'is_search'; + } elseif ( is_404() ) { + $current_page_type = 'is_404'; + } + + if (!is_array($attributes['ifPageType'])) { + $attributes['ifPageType'] = array($attributes['ifPageType']); + } + + if ( ! isset( $attributes['ifPageType'] ) || empty( $attributes['ifPageType'] ) ) { $display_by_page_type = true; + // var_dump($attributes); + } else { + if ( in_array( $current_page_type, $attributes['ifPageType'] ) ) { + $display_by_page_type = true; + } else { + $display_by_page_type = false; + } } + // Post Type Condition Check //////////////////////////////////. $display_by_post_type = false; @@ -71,12 +101,19 @@ function vk_dynamic_if_block_render( $attributes, $content ) { $post_type_slug = get_post_type(); } - if ( 'none' === $attributes['ifPostType'] ) { - $display_by_post_type = true; - } elseif ( $post_type_slug === $attributes['ifPostType'] ) { + if (!is_array($attributes['ifPostType'])) { + $attributes['ifPostType'] = array($attributes['ifPostType']); + } + if (!isset($attributes['ifPostType']) || empty($attributes['ifPostType'])) { $display_by_post_type = true; } else { - $display_by_post_type = false; + if ( in_array('none', $attributes['ifPostType']) ) { + $display_by_post_type = true; + } elseif ( in_array($post_type_slug, $attributes['ifPostType']) ) { + $display_by_post_type = true; + } else { + $display_by_post_type = false; + } } // User Role Condition Check //////////////////////////////////. @@ -320,12 +357,7 @@ function get_user_roles() { function vk_dynamic_if_block_set_localize_script() { - $post_type_select_options = array( - array( - 'label' => __( 'No restriction', 'vk-dynamic-if-block' ), - 'value' => 'none', - ), - ); + $post_type_select_options = array(); // Default Post Type. $post_types_all = array( From 7ad7a550475babf922880a3b590b5c0ed35c793d Mon Sep 17 00:00:00 2001 From: osmdik Date: Wed, 4 Oct 2023 10:16:08 +0900 Subject: [PATCH 5/7] fix --- src/index.js | 20 ++++++++++++ src/index.php | 87 +++++++++++++++++---------------------------------- 2 files changed, 48 insertions(+), 59 deletions(-) diff --git a/src/index.js b/src/index.js index d26447b..7826ab6 100644 --- a/src/index.js +++ b/src/index.js @@ -98,6 +98,26 @@ registerBlockType('vk-blocks/dynamic-if', { ['core/paragraph', {}], ]; + // // 前バージョンとの互換処理 + // useEffect(() => { + // if ( + // ifPageType !== undefined && + // ifPageType !== null && + // ifPageType !== 'none' && + // !Array.isArray(ifPageType) + // ) { + // setAttributes({ ifPageType: [ifPageType] }); + // } + // if ( + // ifPostType !== undefined && + // ifPostType !== null && + // ifPostType !== 'none' && + // !Array.isArray(ifPostType) + // ) { + // setAttributes({ ifPostType: [ifPostType] }); + // } + // }) + const userRolesObj = vk_dynamic_if_block_localize_data.userRoles || {}; const userRoles = Object.keys(userRolesObj).map(key => ({ value: key, diff --git a/src/index.php b/src/index.php index 8dd53ed..b8c86d9 100644 --- a/src/index.php +++ b/src/index.php @@ -35,57 +35,37 @@ function vk_dynamic_if_block_render( $attributes, $content ) { // Page Type Condition Check //////////////////////////////////. $display_by_page_type = false; - - $current_page_type = ''; - - if ( is_front_page() ) { - $current_page_type = 'is_front_page'; - } elseif ( is_single() ) { - $current_page_type = 'is_single'; - } elseif ( is_page() ) { - $current_page_type = 'is_page'; - } elseif ( is_singular() ) { - $current_page_type = 'is_singular'; - } elseif ( is_home() && ! is_front_page() ) { - $current_page_type = 'is_home'; - } elseif ( is_post_type_archive() ) { - $current_page_type = 'is_post_type_archive'; - } elseif ( is_category() ) { - $current_page_type = 'is_category'; - } elseif ( is_tag() ) { - $current_page_type = 'is_tag'; - } elseif ( is_tax() ) { - $current_page_type = 'is_tax'; - } elseif ( is_year() ) { - $current_page_type = 'is_year'; - } elseif ( is_month() ) { - $current_page_type = 'is_month'; - } elseif ( is_date() ) { - $current_page_type = 'is_date'; - } elseif ( is_author() ) { - $current_page_type = 'is_author'; - } elseif ( is_archive() ) { - $current_page_type = 'is_archive'; - } elseif ( is_search() ) { - $current_page_type = 'is_search'; - } elseif ( is_404() ) { - $current_page_type = 'is_404'; + $current_page_types = []; + + $page_types = array( + 'is_front_page' => is_front_page(), + 'is_single' => is_single(), + 'is_page' => is_page(), + 'is_singular' => is_singular(), + 'is_home' => is_home() && ! is_front_page(), + 'is_post_type_archive' => is_post_type_archive(), + 'is_category' => is_category(), + 'is_tag' => is_tag(), + 'is_tax' => is_tax(), + 'is_year' => is_year(), + 'is_month' => is_month(), + 'is_date' => is_date(), + 'is_author' => is_author(), + 'is_archive' => is_archive(), + 'is_search' => is_search(), + 'is_404' => is_404(), + ); + foreach ($page_types as $type => $condition) { + if ($condition) { + $current_page_types[] = $type; + } } if (!is_array($attributes['ifPageType'])) { $attributes['ifPageType'] = array($attributes['ifPageType']); } - if ( ! isset( $attributes['ifPageType'] ) || empty( $attributes['ifPageType'] ) ) { - $display_by_page_type = true; - // var_dump($attributes); - } else { - if ( in_array( $current_page_type, $attributes['ifPageType'] ) ) { - $display_by_page_type = true; - } else { - $display_by_page_type = false; - } - } + $display_by_page_type = empty($attributes['ifPageType']) || in_array('none', $attributes['ifPageType']) || array_intersect($current_page_types, $attributes['ifPageType']); // Post Type Condition Check //////////////////////////////////. @@ -101,20 +81,9 @@ function vk_dynamic_if_block_render( $attributes, $content ) { $post_type_slug = get_post_type(); } - if (!is_array($attributes['ifPostType'])) { - $attributes['ifPostType'] = array($attributes['ifPostType']); - } - if (!isset($attributes['ifPostType']) || empty($attributes['ifPostType'])) { - $display_by_post_type = true; - } else { - if ( in_array('none', $attributes['ifPostType']) ) { - $display_by_post_type = true; - } elseif ( in_array($post_type_slug, $attributes['ifPostType']) ) { - $display_by_post_type = true; - } else { - $display_by_post_type = false; - } - } + $attributes['ifPostType'] = is_array($attributes['ifPostType']) ? $attributes['ifPostType'] : array($attributes['ifPostType']); + + $display_by_post_type = empty($attributes['ifPostType']) || in_array('none', $attributes['ifPostType']) || in_array($post_type_slug, $attributes['ifPostType']); // User Role Condition Check //////////////////////////////////. From 8691ddd68d30cb98d3e578722941abe521f6e25f Mon Sep 17 00:00:00 2001 From: osmdik Date: Thu, 5 Oct 2023 10:07:39 +0900 Subject: [PATCH 6/7] fix : deprecated --- src/index.js | 43 ++++++++++++++++++++++++------------------- 1 file changed, 24 insertions(+), 19 deletions(-) diff --git a/src/index.js b/src/index.js index 7826ab6..6e4aad5 100644 --- a/src/index.js +++ b/src/index.js @@ -98,25 +98,30 @@ registerBlockType('vk-blocks/dynamic-if', { ['core/paragraph', {}], ]; - // // 前バージョンとの互換処理 - // useEffect(() => { - // if ( - // ifPageType !== undefined && - // ifPageType !== null && - // ifPageType !== 'none' && - // !Array.isArray(ifPageType) - // ) { - // setAttributes({ ifPageType: [ifPageType] }); - // } - // if ( - // ifPostType !== undefined && - // ifPostType !== null && - // ifPostType !== 'none' && - // !Array.isArray(ifPostType) - // ) { - // setAttributes({ ifPostType: [ifPostType] }); - // } - // }) + // 前バージョンとの互換処理 + useEffect(() => { + // ifPageTypeの互換性処理 + if ( + ifPageType !== undefined && + ifPageType !== null && + ifPageType !== 'none' && + typeof ifPageType === 'string' + ) { + console.log('action'); + setAttributes({ ifPageType: [ifPageType] }); + } + + // ifPostTypeの互換性処理 + if ( + ifPostType !== undefined && + ifPostType !== null && + ifPostType !== 'none' && + typeof ifPostType === 'string' + ) { + console.log('action'); + setAttributes({ ifPostType: [ifPostType] }); + } + }, []); const userRolesObj = vk_dynamic_if_block_localize_data.userRoles || {}; const userRoles = Object.keys(userRolesObj).map(key => ({ From f539797c2a116cf10a9cfc27d71fc192604888cd Mon Sep 17 00:00:00 2001 From: osmdik Date: Thu, 5 Oct 2023 10:10:06 +0900 Subject: [PATCH 7/7] fix --- src/index.js | 2 -- 1 file changed, 2 deletions(-) diff --git a/src/index.js b/src/index.js index 6e4aad5..c2db57e 100644 --- a/src/index.js +++ b/src/index.js @@ -107,7 +107,6 @@ registerBlockType('vk-blocks/dynamic-if', { ifPageType !== 'none' && typeof ifPageType === 'string' ) { - console.log('action'); setAttributes({ ifPageType: [ifPageType] }); } @@ -118,7 +117,6 @@ registerBlockType('vk-blocks/dynamic-if', { ifPostType !== 'none' && typeof ifPostType === 'string' ) { - console.log('action'); setAttributes({ ifPostType: [ifPostType] }); } }, []);