عرض HTML مخصص في العنوان لأعضاء مجموعة معينة

مرحبًا يا عائلة Discourse! آمل أن يكون هناك حل سهل لهذا الأمر! أشعر أن الإجابة تكمن في استخدام بعض كود JavaScript.

لدينا 4 أزرار في قسم “بعد الرأس” في إعدادات CSS/HTML الخاصة بالإدارة.

نود أن تكون بعض الأزرار مرئية فقط لأعضاء مجموعات محددة، بينما تكون باقي الأزرار مرئية لجميع المستخدمين.

على سبيل المثال: لنفترض أننا نريد أن تكون تلك الأزرار الأربعة الرئيسية متاحة للجميع، ولكننا نريد زرًا آخر يظهر فقط لأعضاء مجموعة معينة.

لا أملك خبرة في JavaScript، لذا إذا كان الأمر بسيطًا جدًا، وساعدني أحدكم بتزويدي بقطعة كود أو شيء مشابه، فسأكون ممتنًا جدًا :folded_hands:

وجدت هذه المقالة التي تبدو مشابهة جدًا، لمنصة Zendesk، لكنني أعتقد أن هذا هو نوع الوظيفة التي نبحث عنها!

<div id="after-header">محتوى</div>
<script type="text/discourse-plugin" version="0.8">
    api.onPageChange(() => {
        let currentUser = api.getCurrentUser();
        var groups = currentUser.groups;
        const isInGroup1 = groups.some(g => g.name === 'group1');
        const isInGroup2 = groups.some(g => g.name === 'group2');
        const isInGroup3 = groups.some(g => g.name === 'group3');
        if (isInGroup1) { 
            $("#after-header").addClass("group1");
         }
        if (isInGroup2) { 
            $("#after-header").addClass("group2");
         }
        if (isInGroup3) { 
            $("#after-header").addClass("group3");
         }         
    });
</script>
.button-a,
.button-b {
    display: none;
}
#after-header.group1 .button-a {
    display: block
}
#after-header.group2 .button-b {
    display: block
}

يبدو أن الأمر يعمل أيضًا إذا قمت باستبدال
api.onPageChange(() => {
بـ
$( document ).ready(function() {
وعندها لن يتم تحميل السكربت في كل صفحة، لكنني لا أعرف أبدًا على وجه اليقين أين أحتاج إلى استخدام api.onPageChange(() => {.

إذا قمت بتثبيت هذا المكون، فسيتم إضافة جميع مجموعات المستخدم الحالي كفئات في جسم الصفحة، مما يسهل إجراء تغييرات إضافية باستخدام CSS فقط.

هاها، كان هذا الشيء التالي الذي كنت سأحاول فهمه

مرحباً،

لقد كنت أبحث عن شيء مشابه، ولكن مع استثناء بعض المجموعات، لذلك جربت ChatGPT، وكانت الإجابة:

لإنشاء سمة HTML في Discourse تقوم بتشغيل نص برمجي يستثني مجموعات معينة، ستحتاج إلى استخدام خيارات تخصيص السمات في Discourse مع JavaScript للتعامل مع استثناءات المجموعات. يوفر Discourse api.getCurrentUser() لاسترداد تفاصيل المستخدم، بما في ذلك مجموعاته، والتي يمكن أن تكون مفيدة لتشغيل النص البرمجي الخاص بك بشكل شرطي.

إليك مثال لكيفية تنفيذ ذلك في قسم </head> من السمة أو المكون الخاص بك:

<script type="text/discourse-plugin" version="0.8">
    api.onPageChange(() => {
        // استرداد تفاصيل المستخدم الحالي
        const currentUser = api.getCurrentUser();

        if (currentUser) {
            // قائمة بأسماء المجموعات التي تريد استبعادها من تنفيذ النص البرمجي
            const excludedGroups = ['group1', 'group2'];

            // الحصول على مجموعات المستخدم
            const userGroups = currentUser.groups.map(group => group.name);

            // التحقق مما إذا كان المستخدم ينتمي إلى أي مجموعة مستبعدة
            const isExcluded = excludedGroups.some(group => userGroups.includes(group));

            if (!isExcluded) {
                // منطق النص البرمجي المخصص الخاص بك هنا
                console.log('يتم تنفيذ النص البرمجي لهذا المستخدم.');
                // مثال: تشغيل أي منطق مخصص للمستخدمين غير المستبعدين
                // customScriptFunction();
            } else {
                console.log('المستخدم في مجموعة مستبعدة، لم يتم تنفيذ النص البرمجي.');
            }
        }
    });
</script>

شرح:

  1. api.onPageChange(): يقوم بتشغيل النص البرمجي في كل مرة تتغير فيها الصفحة.
  2. api.getCurrentUser(): يجلب تفاصيل المستخدم المسجل دخوله حاليًا.
  3. excludedGroups: قم بإدراج المجموعات التي تريد استبعادها.
  4. userGroups.includes(group): يتحقق مما إذا كان المستخدم ينتمي إلى أي مجموعة مستبعدة.
  5. التنفيذ الشرطي للنص البرمجي: سيتم تشغيل النص البرمجي فقط إذا لم يكن المستخدم جزءًا من أي مجموعة مستبعدة.

يمكنك استبدال customScriptFunction(); بأي نص برمجي تحتاجه. أخبرني إذا كنت بحاجة إلى أي تعديلات إضافية!

أعني، عقلي منفجر تمامًا من هذا :exploding_head:. لم أجربه بعد، ولكن هل رمز ChatGPT صحيح؟