Revert pluginAPI method addition
This reverts commitecede62825. Revert "WIP: Testing Issue" This reverts commit2a0bc9b1c7. Revert "DEV: Add buttons to api array" This reverts commit46c95cf3fc. Revert "DEV: Add a pluginAPI method for adding table wrapper buttons" This reverts commit7dae39d797.
This commit is contained in:
Keegan George
parent
2a0bc9b1c7
commit
2a4b4fda90
@ -10,32 +10,13 @@ import { withPluginApi } from "discourse/lib/plugin-api";
|
||||
import { create } from "virtual-dom";
|
||||
import showModal from "discourse/lib/show-modal";
|
||||
|
||||
export function createTableWrapperButton(label, icon, classes, event) {
|
||||
const openPopupBtn = document.createElement("button");
|
||||
const defaultClasses = [
|
||||
"open-popup-link",
|
||||
"btn-default",
|
||||
"btn",
|
||||
"btn-icon-text",
|
||||
];
|
||||
openPopupBtn.classList.add(...defaultClasses);
|
||||
openPopupBtn.classList.add(...classes);
|
||||
const expandIcon = create(iconNode(icon));
|
||||
const openPopupText = document.createTextNode(I18n.t(label));
|
||||
openPopupBtn.append(expandIcon, openPopupText);
|
||||
openPopupBtn.addEventListener("click", event, false);
|
||||
return openPopupBtn;
|
||||
}
|
||||
|
||||
export const apiExtraTableWrapperButtons = [];
|
||||
|
||||
export default {
|
||||
name: "post-decorations",
|
||||
initialize(container) {
|
||||
withPluginApi("0.1", (api) => {
|
||||
const siteSettings = container.lookup("service:site-settings");
|
||||
const session = container.lookup("service:session");
|
||||
// const site = container.lookup("service:site");
|
||||
const site = container.lookup("service:site");
|
||||
api.decorateCookedElement(
|
||||
(elem) => {
|
||||
return highlightSyntax(elem, siteSettings, session);
|
||||
@ -154,7 +135,25 @@ export default {
|
||||
{ id: "discourse-video-codecs" }
|
||||
);
|
||||
|
||||
// eslint-disable-next-line no-unused-vars
|
||||
function _createButton() {
|
||||
const openPopupBtn = document.createElement("button");
|
||||
openPopupBtn.classList.add(
|
||||
"open-popup-link",
|
||||
"btn-default",
|
||||
"btn",
|
||||
"btn-icon-text",
|
||||
"btn-expand-table"
|
||||
);
|
||||
const expandIcon = create(
|
||||
iconNode("discourse-expand", { class: "expand-table-icon" })
|
||||
);
|
||||
const openPopupText = document.createTextNode(
|
||||
I18n.t("fullscreen_table.expand_btn")
|
||||
);
|
||||
openPopupBtn.append(expandIcon, openPopupText);
|
||||
return openPopupBtn;
|
||||
}
|
||||
|
||||
function isOverflown({ clientWidth, scrollWidth }) {
|
||||
return scrollWidth > clientWidth;
|
||||
}
|
||||
@ -167,42 +166,26 @@ export default {
|
||||
}
|
||||
|
||||
function generatePopups(tables) {
|
||||
tables.forEach((table, index) => {
|
||||
const tableButtons = generateButtons(table);
|
||||
|
||||
if (tableButtons.length === 0) {
|
||||
tables.forEach((table) => {
|
||||
if (!isOverflown(table.parentNode)) {
|
||||
return;
|
||||
}
|
||||
|
||||
table.parentNode.setAttribute("data-table-id", index);
|
||||
if (site.isMobileDevice) {
|
||||
return;
|
||||
}
|
||||
|
||||
const popupBtn = _createButton();
|
||||
table.parentNode.classList.add("fullscreen-table-wrapper");
|
||||
// Create a button wrapper for case of multiple buttons (i.e. table builder extension)
|
||||
const buttonWrapper = document.createElement("div");
|
||||
buttonWrapper.classList.add("fullscreen-table-wrapper-buttons");
|
||||
// eslint-disable-next-line no-console
|
||||
console.log(index, buttonWrapper, table, tableButtons);
|
||||
buttonWrapper.append(...tableButtons);
|
||||
buttonWrapper.append(popupBtn);
|
||||
popupBtn.addEventListener("click", generateModal, false);
|
||||
table.parentNode.insertBefore(buttonWrapper, table);
|
||||
});
|
||||
}
|
||||
|
||||
// eslint-disable-next-line no-unused-vars
|
||||
function generateButtons(table) {
|
||||
const buttons = [];
|
||||
|
||||
// if (isOverflown(table.parentNode) && !site.isMobileDevice) { // temporarily disabled
|
||||
const expandButton = createTableWrapperButton(
|
||||
"fullscreen_table.expand_btn",
|
||||
"discourse-expand",
|
||||
["btn-expand-table"],
|
||||
generateModal
|
||||
);
|
||||
buttons.push(expandButton);
|
||||
// }
|
||||
|
||||
buttons.push(...apiExtraTableWrapperButtons);
|
||||
return buttons;
|
||||
}
|
||||
|
||||
api.decorateCookedElement(
|
||||
(post) => {
|
||||
schedule("afterRender", () => {
|
||||
@ -215,16 +198,6 @@ export default {
|
||||
id: "fullscreen-table",
|
||||
}
|
||||
);
|
||||
|
||||
// * TEMP for testing
|
||||
api.addTableWrapperButton(
|
||||
"drafts.label",
|
||||
"pencil-alt",
|
||||
["btn-test-table"],
|
||||
() =>
|
||||
// eslint-disable-next-line no-console
|
||||
console.log("clicked edit table")
|
||||
);
|
||||
});
|
||||
},
|
||||
};
|
||||
|
||||
@ -105,16 +105,12 @@ import { registerNotificationTypeRenderer } from "discourse/lib/notification-typ
|
||||
import { registerUserMenuTab } from "discourse/lib/user-menu/tab";
|
||||
import { registerModelTransformer } from "discourse/lib/model-transformers";
|
||||
import { registerHashtagSearchParam } from "discourse/lib/hashtag-autocomplete";
|
||||
import {
|
||||
apiExtraTableWrapperButtons,
|
||||
createTableWrapperButton,
|
||||
} from "discourse/initializers/post-decorations";
|
||||
|
||||
// If you add any methods to the API ensure you bump up the version number
|
||||
// based on Semantic Versioning 2.0.0. Please update the changelog at
|
||||
// docs/CHANGELOG-JAVASCRIPT-PLUGIN-API.md whenever you change the version
|
||||
// using the format described at https://keepachangelog.com/en/1.0.0/.
|
||||
const PLUGIN_API_VERSION = "1.5.0";
|
||||
const PLUGIN_API_VERSION = "1.4.0";
|
||||
|
||||
// This helper prevents us from applying the same `modifyClass` over and over in test mode.
|
||||
function canModify(klass, type, resolverName, changes) {
|
||||
@ -2018,31 +2014,6 @@ class PluginApi {
|
||||
registerHashtagSearchParam(param, context, priority) {
|
||||
registerHashtagSearchParam(param, context, priority);
|
||||
}
|
||||
|
||||
/**
|
||||
* Add a new button to be overlaid ontop of a table appearing in a post.
|
||||
* On wider tables the button will be appending along with the Expand table button.
|
||||
*
|
||||
* Example usage:
|
||||
*
|
||||
* api.addTableWrapperButton(
|
||||
* themePrefix("discourse_table_builder.edit.btn_edit"),
|
||||
* "pencil-alt",
|
||||
* ["btn-edit-table"],
|
||||
* generateModalEvent
|
||||
* );
|
||||
*
|
||||
* @param {string} label - An i18n key for the button label
|
||||
* @param {icon} icon - An icon name from fontawesome
|
||||
* @param {array} classes - An array of strings to be added as classes to the button
|
||||
* @param {function} event - A function that returns an event to be dispatched when the button is clicked
|
||||
*
|
||||
*/
|
||||
addTableWrapperButton(label, icon, classes, event) {
|
||||
apiExtraTableWrapperButtons.push(
|
||||
createTableWrapperButton(label, icon, classes, event)
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
// from http://stackoverflow.com/questions/6832596/how-to-compare-software-version-number-using-js-only-number
|
||||
|
||||
@ -7,12 +7,6 @@ in this file.
|
||||
The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
|
||||
and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
|
||||
|
||||
## [1.5.0] - 2022-11-01
|
||||
|
||||
### Added
|
||||
|
||||
- Adds `addTableWrapperButton`, which allows users to register a button that appears on top of posts with markdown tables. The button will appear on hover over a table that appears in a post. If the post's table is a very wide table, the button will be appended next to the Expand Table button.
|
||||
|
||||
## [1.4.0] - 2022-09-27
|
||||
|
||||
### Added
|
||||
|
||||
Reference in New Issue
Block a user