The ability to create a new community profile is temporarily unavailable. We're on it!

cancel
Showing results for 
Show  only  | Search instead for 
Did you mean: 
kimhuang
Community Participant

Rename Big Blue Button (or Adobe Connect) back to Conferences after deployment on 8-4-21

Jump to solution

Here is the code snippet which we intend to use:

$(".conferences").html("Conferences");
 
Including this piece of code in Custom Java Script file by 
(Admin privilage->Themes->upload->viewfile->open text editor->include the above line->save->back to Themes Editor->select the saved Java Script file->preview->save the theme-> done)
 
It is a System-Wide change, will affect the navigation bar for every course.
 
Just a FYI. Welcome any comment.
 
Best,
-Kim
0 Kudos
1 Solution

Accepted Solutions
kimhuang
Community Participant

Here is the final version that I used:

(function(){
const conferences = document.querySelector('#section-tabs .conferences');
if (conferences.title === "Disabled. Not visible to students") {
conferences.innerHTML = 'Conferences<i class="nav-icon icon-off" aria-hidden="true" role="presentation"></i></a>';
} else {
conferences.innerHTML = 'Conferences';
}
})();

View solution in original post

5 Replies
James
Community Champion

Thanks for sharing this, Kim ( @kimhuang ).

I haven't checked every page within Canvas to see if the conferences class is used anywhere else. Because of that, and because the conferences class might be used somewhere else now or in the future, I like to make the CSS selector a little more specific.

Using "#section-tabs .conferences" as the CSS selector would be more specific and make sure that it doesn't unexpectedly change something else.

If someone wants a pure-JavaScript (instead of jQuery) approach to do this, here is an equivalent function.

(function(){
  const conferences = document.querySelector('#section-tabs .conferences');
  if (conferences) {
    conferences.innerText = 'Conferences';
  }
})();

 

There is an issue with this approach to changing text. It does not take into consideration the language of the user or course. If someone selected Spanish, they would still see "Conferences." Unfortunately, Canvas doesn't expose their i18n function anymore (I would love to be corrected on that statement), so there's not an easy solution that considers language unless you want to write your own.

kimhuang
Community Participant

Thanks so much, @James. Your solution is more elegant and safe! Appreciate your input.

kimhuang
Community Participant

Here is the final version that I used:

(function(){
const conferences = document.querySelector('#section-tabs .conferences');
if (conferences.title === "Disabled. Not visible to students") {
conferences.innerHTML = 'Conferences<i class="nav-icon icon-off" aria-hidden="true" role="presentation"></i></a>';
} else {
conferences.innerHTML = 'Conferences';
}
})();

View solution in original post

James
Community Champion

@kimhuang 

When I was looking at my course menu for the new term, I noticed there are several things disabled that I don't use at all: outcomes, announcements, collaborations, and conferences. Conferences is the most offensive, but looking through items you know you don't need is unnecessary.

I wrote this tweak that should be modified by anyone wanting to put it into a userscript. I don't know if it's suitable for inclusion in the global theme because some people might use them without displaying to the students.

What it does is to hide the item completely rather than change the text.

(function(){
  if (/^\/courses\/\d+/.test(window.location.pathname) && !document.body.classList.contains('full-width')) {
    // Modify the tabs line for the items you don't want to show when unused
    const tabs = 'announcements,collaborations,conferences,outcomes'.split(',');
    const items = document.querySelectorAll('ul#section-tabs li.section.section-hidden');
    items.forEach(e => {
      const classes = e.querySelector('a').classList;
      const matching = tabs.filter(c => classes.contains(c));
      if (matching.length > 0) {
        e.style.display = 'none';
      }
    });
  }
})();

It only affects items that are hidden, so if you use announcements in your class, it will still show.

Again, this may not be for everyone and there could be other items that go into the tabs list for other people, but I thought I'd throw it out there.

kimhuang
Community Participant

@James This is very nice, thanks so much for sharing. I can foresee the request to hide the item completely if it is not used in the course. I have not written any userscript for any user of Canvas, however I will dig into it to prepare for the future.  Thanks again for your excellent contribution.