Forum Discussion

bhupen's avatar
bhupen
Advisor
11 years ago

Show Icon on thread resonse or created by specific role

Hi Guys.


I have a requirement:
When a thread has a response, or is started by someone with the role of
- "DigitalPlatforms Support" or - "Administrator" Please display an icon next to the thread display when viewing a board:

Can anyone help me to implement this functionality?

Regards

  • VarunLuthra's avatar
    VarunLuthra
    Advisor
    11 years ago
    Hi @bhupen, such posts are helpful for other developers, please mark the appropriate reply as the solution so other people can get to know which post was the solution. Might help someone in someways.
  • bhupen's avatar
    bhupen
    Advisor
    11 years ago

    Requirement:

     

    When a thread has a response, or is started by someone with the role of - "DigitalPlatforms Support"  or  - "Administrator" 
    then we need to display an icon next to the thread display when viewing a board:
    As an example, please see the following mock-up: https://playstation.box.com/s/wf8t6e7y69rvj63n194l  

     

    We want to implement it on all the listing of threads on a boards  

     

    E.g. We want  it on URL :  http://community.us.playstation.com/t5/PlayStation-General/bd-p/10031

     

    • VarunLuthra's avatar
      VarunLuthra
      Advisor
      11 years ago

      Hi bhupen - The icon which you are referring to is the user role icon, and by default, it shows up along with the user name, i.e. in the Author row. I checked and noted that these default icons are hidden via CSS in PlayStation Community, using display:none;

       

      CSS to be used to display them back again:

       

      .messageAuthorColumn .UserName.lia-user-name img.lia-user-rank-icon-left {
    display: block;
    margin-left: -81px !important;
}

       Now, as you want to display this only for 2 roles, i.e. "DigitalPlatforms Support"  or  - "Administrator", so this can be done via jQuery:

       

      ForDigitalPlatforms Support:

      <img class="lia-user-rank-icon-left" title="DigitalPlatforms Support" alt="DigitalPlatforms Support" id="display_9" src="http://community.us.playstation.com/t5/image/serverpage/image-id/213315i52E5BF6439205975/image-size/large/is-moderation-mode/true?v=mpbl-1&amp;px=600">

      For SMSCS:
      <img class="lia-user-rank-icon-left" title="Administrator" alt="Administrator" id="display_7" src="http://community.us.playstation.com/t5/image/serverpage/image-id/213313i3C90E5E52BF684C6/image-size/large/is-moderation-mode/true?v=mpbl-1&amp;px=600">

       

      So, you get to this node using jQuery, and the read the title attribute using .attr, and hide the icons which are not one of these 2.

       

      <script>
       $(".thread-list .lia-list-row .messageAuthorColumn").each(function(){
       
      var getRole = $(this).find('.lia-user-rank-icon-left').attr('title');

      if(getRole != "PlayStation MVP" || getRole !="Administrator"){
           $(this).find('.lia-user-rank-left-icon').hide();
      }
      });
       </script>

       

      I hope this helps.

      • bhupen's avatar
        bhupen
        Advisor
        11 years ago

        Hi VarunLuthra  Thank you so much for this help and giving your precious time into it.

        I did display back the icon on listing but somehow Iam not able to show desired icon on "DigitalPlatforms Support" or
        - "Administrator". Icon is displaying for all.  Iam sure Iam missing something somewhere. Can you please have a look and suggest me the right steps.

        I would like to display icon only on two roles."DigitalPlatforms Support" or - "Administrator" not for other.

         

        Steps I followed:

        1. Made a Digitalplatforms role in backend.

        2. Put the following code in header section "Page Head Content" and "Page Header". I tried to put code on both section at a time because its not working in any place. First I put the code in "Page Head Content" and later on "Page Header".

         

        <script>
        $(".thread-list .lia-list-row .messageAuthorColumn").each(function(){
         
        var getRole = $(this).find('.lia-user-rank-icon-left').attr('title');

        if(getRole != "DigitalPlatforms" || getRole !="Administrator"){
             $(this).find('.lia-user-rank-left-icon').hide();
        }
        });
        </script>
        <script>
        <img class="lia-user-rank-icon-left" title="DigitalPlatforms Support" alt="DigitalPlatforms Support" id="display_9" src="http://stage.community.us.playstation.com/html/assets/true.png" >

        <img class="lia-user-rank-icon-left" title="Administrator" alt="Administrator" id="display_7" src="http://stage.community.us.playstation.com/html/assets/true.png" >
        </script>

         

        Help is appreciated.

         

        Thanks & Regards