xref: /plugin/combo/resources/snippet/js/metadata.js (revision c3437056399326d621a01da73b649707fbb0ae69)
1/* global combo */
2// noinspection JSUnresolvedVariable
3
4window.addEventListener("DOMContentLoaded", function () {
5
6
7        /**
8         *
9         * @type ComboModal modalManager
10         */
11        async function openMetaViewer(modalViewer, modalManager, pageId) {
12
13
14            if (modalViewer.wasBuild()) {
15                modalViewer.show();
16                return;
17            }
18
19            const viewerCallEndpoint = "combo-meta-viewer";
20            let viewerCall = combo
21                .createDokuRequest(viewerCallEndpoint)
22                .setProperty("id", pageId)
23            let jsonFormMeta = await viewerCall.getJson();
24
25
26            let formViewerId = combo.toHtmlId(`combo-metadata-viewer-form-${pageId}`);
27            let formHtmlElement = combo.createFormFromJson(formViewerId, jsonFormMeta).toHtmlElement();
28
29            /**
30             * Submit Button
31             */
32            let submitButton = document.createElement("button");
33            submitButton.classList.add("btn", "btn-primary");
34            submitButton.setAttribute("type", "submit");
35            submitButton.setAttribute("form", formHtmlElement.id);
36            submitButton.innerText = "Submit";
37            submitButton.addEventListener("click", async function (event) {
38                event.preventDefault();
39                let formData = new FormData(formHtmlElement);
40                let response = await combo.createDokuRequest(viewerCallEndpoint)
41                    .setMethod("post")
42                    .sendFormDataAsJson(formData);
43                modalViewer.reset();
44                modalManager.reset();
45                await processResponse(response, () => openMetaViewer(modalViewer, modalManager, pageId));
46            });
47            modalViewer
48                .setCallBackOnClose(() => openMetadataManager(pageId))
49                .setHeader("Metadata Viewer")
50                .addBody(`<p>The metadata viewer shows you the content of the metadata file (ie all metadata managed by ComboStrap or not):</p>`)
51                .addBody(formHtmlElement)
52                .addFooterCloseButton()
53                .addFooterButton(submitButton)
54                .show();
55
56
57        }
58
59
60        const metaManagerCall = "combo-meta-manager";
61
62        /**
63         *
64         * @param {Response} response
65         * @param {function} callBack
66         * @return {Promise<void>}
67         */
68        async function processResponse(response, callBack) {
69            let modalMessage = [];
70            if (response.status !== 200) {
71                modalMessage.push(`Error, unable to save. (return code: ${response.status})`);
72            }
73            try {
74                let json = await response.json();
75                if (json !== null) {
76                    if (json.hasOwnProperty("message")) {
77                        let jsonMessage = json["message"];
78                        if (Array.isArray(jsonMessage)) {
79                            modalMessage = modalMessage.concat(jsonMessage);
80                        } else {
81                            modalMessage.push(jsonMessage)
82                        }
83                    }
84                }
85            } catch (/** @type Error */ e) {
86                modalMessage.push(e.message)
87            }
88
89            combo.createTemporaryModal()
90                .setCallBackOnClose(callBack)
91                .centered()
92                .addBody(modalMessage.join("<br>"))
93                .show();
94        }
95
96        let openMetadataManager = async function (pageId) {
97
98
99            /**
100             * The manager modal root
101             * (used in button)
102             */
103            let modalManagerId = combo.toHtmlId(`combo-meta-manager-page-${pageId}`);
104            let managerModal = combo.getOrCreateModal(modalManagerId)
105            if (managerModal.wasBuild()) {
106                managerModal.show();
107                return;
108            }
109
110            /**
111             * The viewer
112             * We create it here because it needs to be reset if there is a submit on the manager.
113             */
114            let modalViewerId = combo.toHtmlId(`combo-metadata-viewer-modal-${pageId}`);
115            let modalViewer = combo.getOrCreateModal(modalViewerId);
116
117            /**
118             * Creating the form
119             */
120            let formMetadata = await combo
121                .createDokuRequest(metaManagerCall)
122                .setProperty("id", pageId)
123                .getJson();
124            /**
125             * Add the page runtime cache metadata field
126             */
127            let cachePageInfo = document.querySelector('script[type="application/combo+cache+json"]');
128            if (cachePageInfo !== null) {
129                let cachePageJsonString = cachePageInfo
130                    .innerText
131                    .trim()
132                    .slice("/*<![CDATA[*/".length)
133                    .slice(0, -("/*!]]>*/".length));
134                let cachePageJson = JSON.parse(cachePageJsonString);
135                for (let slot in cachePageJson) {
136                    if (!cachePageJson.hasOwnProperty(slot)) {
137                        continue;
138                    }
139
140                    let formatResults = cachePageJson[slot];
141                    for (let formatResult in formatResults) {
142                        if (!formatResults.hasOwnProperty(formatResult)) {
143                            continue;
144                        }
145                        let name = `cache_slot_${slot}_${formatResult}`;
146                        let result = formatResults[formatResult];
147                        let styledFormatResult;
148                        if (formatResult === "i") {
149                            styledFormatResult = "Parse Instructions"
150                        } else {
151                            styledFormatResult = formatResult.charAt(0).toUpperCase() + formatResult.slice(1);
152                        }
153                        let hit = result["result"];
154                        formMetadata["fields"][name] =
155                            combo.createFormMetaField(name)
156                                .setMutable(false)
157                                .setLabel(`Cache Hit for ${styledFormatResult} (${slot})`)
158                                .setType("boolean")
159                                .setUrl("https://combostrap.com/page/cache")
160                                .setDescription(`${styledFormatResult} Slot Cache Information for the slot (${slot}) - (File cache time ${result["mtime"]})`)
161                                .setTab("cache")
162                                .addValue(hit,true)
163                                .toJavascriptObject();
164                    }
165                }
166            }
167            let formId = combo.toHtmlId(`${modalManagerId}-form`);
168            let form = combo.createFormFromJson(formId, formMetadata);
169            let htmlFormElement = form.toHtmlElement();
170
171
172            /**
173             * Viewer Button
174             */
175            let viewerButton = document.createElement("button");
176            viewerButton.classList.add("btn", "btn-link", "text-primary", "text-decoration-bone", "fs-6", "text-muted");
177            viewerButton.style.setProperty("font-weight", "300");
178            viewerButton.textContent = "Open Metadata Viewer";
179            viewerButton.addEventListener("click", async function () {
180                managerModal.dismissHide();
181                await openMetaViewer(modalViewer, managerModal, pageId);
182            });
183
184            /**
185             * Submit Button
186             */
187            let submitButton = document.createElement("button");
188            submitButton.classList.add("btn", "btn-primary");
189            submitButton.setAttribute("type", "submit");
190            submitButton.setAttribute("form", formId);
191            submitButton.innerText = "Submit";
192            submitButton.addEventListener("click", async function (event) {
193                event.preventDefault();
194                let formData = new FormData(htmlFormElement);
195                let response = await combo.createDokuRequest(metaManagerCall)
196                    .setMethod("post")
197                    .sendFormDataAsJson(formData);
198                managerModal.reset();
199                modalViewer.reset();
200                await processResponse(response, () => openMetadataManager(pageId));
201            })
202
203            /**
204             * The modal
205             */
206            managerModal
207                .resetIfBuild()
208                .setHeader(`Metadata Manager for Page (${pageId})`)
209                .addBody(htmlFormElement)
210                .addFooterButton(viewerButton)
211                .addFooterCloseButton()
212                .addFooterButton(submitButton)
213                .show();
214
215        }
216
217        document.querySelectorAll(".combo_metadata_item").forEach((metadataControlItem) => {
218
219            metadataControlItem.addEventListener("click", function (event) {
220                event.preventDefault();
221                void openMetadataManager(JSINFO.id)
222                    .catch(e => {
223                        if (e instanceof Error) {
224                            console.error(e.stack)
225                        } else {
226                            console.error(e.toString())
227                        }
228                    });
229            });
230
231        });
232    }
233)
234;
235
236