إضافة زر تسجيل الخروج إلى القائمة العلوية

لدي عميل يمتلك مجتمعًا يستخدم أعضاؤه غالبًا أجهزة كمبيوتر ذات وصول عام؛ وفي اختباراتاتهم، وجدوا أن العديد من المستخدمين يجدون صعوبة في العثور على رابط تسجيل الخروج في قائمة الهامبرغر. للأسف، لا أعتقد أن هناك طريقة جيدة لتعليمهم جميعًا استخدام \u003ckbd\u003eZZ\u003c/kbd\u003e.

لذلك: أحاول إضافة زر \u003ckbd\u003elogout\u003c/kbd\u003e إلى القائمة العلوية.

يبدو أنه يجب أن أتمكن من استخدام (Superseded) Add a "+ New Topic" button on every page لإنشاء موضوع جديد لتسجيل الخروج بدلاً من ذلك، وأنه من السهل تغيير هذا createTopic إلى logout ثم ينتهي الأمر.

https://github.com/discourse/discourse-new-topic-button-theme-component/blob/master/common/header.html#L39

لقد بحثت لمدة ساعة تقريبًا ولا أستطيع تحديد ذلك تمامًا.

4 إعجابات

I’ll happily use what you come up with,

could you mimic the home button api function?

image

<script type="text/discourse-plugin" version="0.4">
  api.changeWidgetSetting('home-logo', 'href' , 'xxx')
</script>
إعجاب واحد (1)

I’ve got the button OK, it’s the logout API that I can’t find.

3 إعجابات

sorry, I do like the plan and hoped I could help, what does the $0 refer to and is it part of document.querySelector that may help?

image

إعجاب واحد (1)

I got it! I won’t promise that it’ll work for you, but this might do it for you.

This is common/header.html

<script type="text/discourse-plugin" version="0.8">    
    const { iconNode } = require("discourse-common/lib/icon-library");
    const { logout } = require("discourse/lib/logout");

    api.decorateWidget("header-buttons:before", helper => {
        if (!Discourse.User.current()) return;
        currentUser = Discourse.User.current();


        let container = api.container,
        logout_text = 'Log Out', // button text!
        logout_title = 'Log Out',
        logout_icon = 'sign-out-alt',
        logout_button_class = "btn btn-default btn btn-icon-text",
        logout_button_helper = "button#logout",
        logout_label_helper = "span.d-button-label",
        composerModal = require("discourse/models/composer").default,
        composerController = container.lookup("controller:composer");

        const myLogout = function () {
            if (currentUser) {
                currentUser.destroySession();
            }
        };
 

        let currentUser = Discourse.User.current();
        let currentUsername = Discourse.User.current().username;
        return helper.h("span.header-links", [

        helper.h(
            logout_button_helper,
            {
              className: logout_button_class,
              title: logout_title,
              onclick: myLogout
            },
            [iconNode(logout_icon), helper.h(logout_label_helper, logout_text)]
          )        
      ])
    });
    </script>
14 إعجابًا

WTH Jay,

I put that script in and got a

Summary

a working button!
image

I’ll need to tune the look a bit but it works, great job!

Thanks for sharing :sunglasses:

4 إعجابات

Hello Jay,
your code works like a charm!
I have a custom menu below the standard header. How can I relocate this button there? Screenshot by Lightshot
in order to create my custom navigation, I added HTML to section common -> header

thanks in advance

إعجاب واحد (1)

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.