Ich habe eine Theme-Komponente entwickelt, die es ermöglicht, Beiträge im Frontend für nicht angemeldete Benutzer auszublenden. Natürlich können Personen mit reicher Entwicklungserfahrung sie leicht direkt aus dem Backend abrufen.
Ich habe diese Komponente noch nicht verpackt, daher bitte ich Sie, den folgenden Code direkt zu verwenden.
Head-Tag:
<script type="text/discourse-plugin" version="1.6.0">
const user = api.getCurrentUser();
const I18n = require("I18n");
const pid = "post_hider"
const tl4_css = `
.d-editor-preview [data-theme-hide] {
background: var(--tertiary);
color: var(--secondary);
border-top: 2px solid var(--secondary);
position: sticky;
top: 0;
height: 30px;
display: flex;
align-items: center;
justify-content: center;
}
.d-editor-preview [data-theme-hide]::before {
content: "This post is hidden";
}
`
api.addPostClassesCallback((attrs) => {
if (attrs?.cooked?.includes(`<div data-theme-hide="true">`)) {
return ["lycoris-hiddened"];
} else {
return [];
}
});
if (!user) {
api.decorateCookedElement((el, helper) => {
function hide_post() {
setTimeout( () => {
try {
document.querySelector(`[data-post-id="${helper?.widget?.attrs?.id}"]`)?.parentElement?.remove();
} catch (err) {
console.log(el);
console.log(err);
}
}, 1000);
}
if (el?.querySelector(`[data-theme-hide="true"]`)) {
el.innerHTML = `<p>This post is hidden</p>`;
hide_post();
}
}, {
id: pid,
afterAdopt: true,
onlyStream: true,
});
} else if (user?.trust_level == 4) {
const s = document.createElement("style");
s.innerHTML = tl4_css;
document.body.appendChild(s);
api.decorateCookedElement((el, helper) => {
if (el?.querySelector(`[data-theme-hide="true"]`)) {
el.innerHTML = `<div class="d-wrap" data-wrap="tips" data-type="warn"><p>Der Beitrag wurde so eingestellt, dass er für nicht angemeldete Community-Mitglieder ausgeblendet wird</p> </div> ` + el.innerHTML;
}
}, {
id: pid,
afterAdopt: true,
onlyStream: true,
});
if (!I18n.translations[I18n.currentLocale()].js.composer) {
I18n.translations[I18n.currentLocale()].js.composer = {};
}
I18n.translations[I18n.currentLocale()].js.composer.hide_text = " ";
I18n.translations[I18n.currentLocale()].js.composer.make_hide = "Hide this post";
api.modifyClass("controller:composer", {
pluginId: pid,
actions: {
insertHide() {
this.get("toolbarEvent").applySurround(
`<div data-theme-hide="true">`,
`</div>\n`,
"hide_text"
);
},
},
});
api.addToolbarPopupMenuOptionsCallback(() => {
return {
action: "insertHide",
icon: "far-eye-slash",
label: "composer.make_hide",
};
});
}
</script>
CSS
.anon .lycoris-hiddened {
display: none;
.post-info.edits {
display: none;
}
}