blocks
2 years ago
plugins
2 years ago
shared
2 years ago
store
2 years ago
blocks.js
5 years ago
util.js
4 years ago
blocks.js
151 lines
| 1 | /** |
| 2 | * Dynamically locate, load & register all Editor Blocks & Plugins. |
| 3 | */ |
| 4 | const { registerBlockType, unregisterBlockType } = wp.blocks; |
| 5 | const { registerPlugin, unregisterPlugin } = wp.plugins; |
| 6 | const { select, dispatch } = wp.data; |
| 7 | const { render } = wp.element; |
| 8 | |
| 9 | import store from "./store/player"; |
| 10 | |
| 11 | import "@/admin/blocks/shared/styles/gutenberg/index.scss"; |
| 12 | import ProUpgradeModal from "./shared/ProUpgradeModal"; |
| 13 | |
| 14 | /** |
| 15 | * No-op function for use as a default argument value. |
| 16 | * |
| 17 | * @returns null |
| 18 | */ |
| 19 | const noop = () => null; |
| 20 | |
| 21 | /** |
| 22 | * Require a set of modules and configure them for hot module replacement. |
| 23 | * |
| 24 | * The first argument should be a function returning a `require.context()` |
| 25 | * call. All modules loaded from this context are cached, and on each rebuild |
| 26 | * the incoming updated modules are checked against the cache. Updated modules |
| 27 | * which already exist in the cache are unregistered with the provided function, |
| 28 | * then any incoming (new or updated) modules will be registered. |
| 29 | * |
| 30 | * @param {Function} getContext Execute and return a `require.context()` call. |
| 31 | * @param {Function} register Function to register accepted modules. |
| 32 | * @param {Function} unregister Function to unregister replaced modules. |
| 33 | * @param {Function} [before] Function to run before updating moules. |
| 34 | * @param {Function} [after] Function to run after updating moules. |
| 35 | */ |
| 36 | const autoload = ({ |
| 37 | getContext, |
| 38 | register, |
| 39 | unregister, |
| 40 | before = noop, |
| 41 | after = noop, |
| 42 | }) => { |
| 43 | const cache = {}; |
| 44 | const loadModules = () => { |
| 45 | before(); |
| 46 | |
| 47 | const context = getContext(); |
| 48 | const changedNames = []; |
| 49 | context.keys().forEach((key) => { |
| 50 | const module = context(key); |
| 51 | if (module === cache[key]) { |
| 52 | // Module unchanged: no further action needed. |
| 53 | return; |
| 54 | } |
| 55 | if (cache[key]) { |
| 56 | // Module changed, and prior copy detected: unregister old module. |
| 57 | unregister(cache[key]); |
| 58 | } |
| 59 | // Register new module and update cache. |
| 60 | register(module); |
| 61 | changedNames.push(module.name); |
| 62 | cache[key] = module; |
| 63 | }); |
| 64 | |
| 65 | after(changedNames); |
| 66 | |
| 67 | // Return the context for HMR initialization. |
| 68 | return context; |
| 69 | }; |
| 70 | |
| 71 | const context = loadModules(); |
| 72 | |
| 73 | if (module.hot) { |
| 74 | module.hot.accept(context.id, loadModules); |
| 75 | } |
| 76 | }; |
| 77 | |
| 78 | // Maintain the selected block ID across HMR updates. |
| 79 | let selectedBlockId = null; |
| 80 | const storeSelectedBlock = () => { |
| 81 | selectedBlockId = select("core/editor").getSelectedBlockClientId(); |
| 82 | dispatch("core/editor").clearSelectedBlock(); |
| 83 | }; |
| 84 | const refreshAllBlocks = (changedNames = []) => { |
| 85 | // Refresh all blocks by iteratively selecting each one. |
| 86 | select("core/editor") |
| 87 | .getBlocks() |
| 88 | .forEach(({ name, clientId }) => { |
| 89 | if (changedNames.includes(name)) { |
| 90 | dispatch("core/editor").selectBlock(clientId); |
| 91 | } |
| 92 | }); |
| 93 | // Reselect whatever was selected in the beginning. |
| 94 | if (selectedBlockId) { |
| 95 | dispatch("core/editor").selectBlock(selectedBlockId); |
| 96 | } else { |
| 97 | dispatch("core/editor").clearSelectedBlock(); |
| 98 | } |
| 99 | selectedBlockId = null; |
| 100 | }; |
| 101 | |
| 102 | // Load all block index files. |
| 103 | autoload({ |
| 104 | getContext: () => require.context("./blocks", true, /index\.js$/), |
| 105 | register: ({ name, options }) => { |
| 106 | if (prestoPlayer?.isPremium) { |
| 107 | registerBlockType(name, options); |
| 108 | } else if (!options.premium) { |
| 109 | registerBlockType(name, options); |
| 110 | } |
| 111 | }, |
| 112 | unregister: ({ name }) => unregisterBlockType(name), |
| 113 | before: storeSelectedBlock, |
| 114 | after: refreshAllBlocks, |
| 115 | }); |
| 116 | |
| 117 | // Load all plugin files. |
| 118 | autoload({ |
| 119 | getContext: () => require.context("./plugins", true, /index\.js$/), |
| 120 | register: ({ name, options }) => registerPlugin(name, options), |
| 121 | unregister: ({ name }) => unregisterPlugin(name), |
| 122 | }); |
| 123 | |
| 124 | jQuery("body").append('<div id="presto-plugin-app"></div>'); |
| 125 | render(<ProUpgradeModal />, document.getElementById("presto-plugin-app")); |
| 126 | |
| 127 | // fetch settings |
| 128 | dispatch("presto-player/player").fetchOptions(); |
| 129 | |
| 130 | let saving = false; |
| 131 | // save the settings on post save, just in case they miss the button |
| 132 | wp.data.subscribe(function () { |
| 133 | var isSavingPost = wp.data.select("core/editor").isSavingPost(); |
| 134 | var isAutosavingPost = wp.data.select("core/editor").isAutosavingPost(); |
| 135 | |
| 136 | if (isSavingPost && !isAutosavingPost) { |
| 137 | if (saving) { |
| 138 | return; |
| 139 | } |
| 140 | saving = true; |
| 141 | let { brandingReducer } = store.getState(); |
| 142 | dispatch("presto-player/player") |
| 143 | .saveOptions({ |
| 144 | branding: brandingReducer, |
| 145 | }) |
| 146 | .then(() => { |
| 147 | saving = false; |
| 148 | }); |
| 149 | } |
| 150 | }); |
| 151 |