Canvas Style Guide - Permanence?

Jump to solution
kevinw
Community Contributor

For those of you who do not know, canvas has an entire style guide full of neat little things you can add to your course. I wish I had found this sooner, so enjoy. 

Now my question is how much of this will still be relevant on a permanent basis? We know that soon the tabs feature will be unavailable, yet that doesn't reflect on the style guide. 

I only ask because I don't want to go through the pain of doing these things to our content only if they are going to be rendered useless in the near future. 

Labels (1)
1 Solution
James
Community Champion

If I would have known you had seen the other post, I could have saved myself some typing Smiley Happy

enhanceable_content is a class that people could apply to their user content and then Canvas would automatically attempt to add some jQuery UI magic to it. That is what is disappearing in the short term (I don't know how short, short is, except that accordions are gone). jQuery UI is still around and if you add unless the local Canvas Admins add some custom JavaScript to their pages to make it happen for their users.

That said, Canvas has not yet removed the jQuery UI accordion widget from production. So, if you were to go to a page that had used the undocumented accordion feature, it would not show up as an accordion. But if you opened a browser console window (F12) and pasted this code in there, then the accordion would magically be there.

$('.enhanceable_content.accordion').accordion();

This also still works in the beta instance (at least as of July 6, 2017). I imagine at some point that Canvas will remove the accordion widget from their jQuery UI, but perhaps they won't until they completely remove jQuery UI. From their perspective, the behavior was undocumented and so they are free to change it at any time, but they've been giving us the heads-up for months that it's coming down the line.

There is nothing to keep you from writing your own custom JavaScript that looks for the .enhanceable_content class and acts on it in the way that Canvas previously did. However, that will mean loading jQuery UI at some point or things will stop working.


The other alternative is to find a different, preferably smaller, library that will do the things that you need it to do and load that. I've seen CSS-only solutions for tabs, so it might not even require any JavaScript at all. But that might also mean that you have to change the way that you create the tabs in the first place.

I think what Canvas expects is that each school to decide what items they are going to support and maintain. Then they find out the best way to do it and do it as a customization on their end without relying on undocumented behavior from Canvas to do it. They provide this information to their designers and faculty and have them create pages that way.

In other words, if you want to use enhanced things like accordions, tabs, sortables, etc., then you need to build it.

Obviously, we would all rather have something be done for us rather than having to do it ourselves. We would rather have a well-tested design in place that looks and feels like Canvas than have to come up with our own approach.

From Canvas' perspective, though, what they are removing is an undocumented feature. You weren't relying on what Canvas officially conveyed about the enhanceable_content because they didn't officially communicate anything. What you're talking about is the Style Guide, which may have been a "we have this, why not make it available?" thing rather than an official -- as in the Community Canvas Guides -- communication.

Few people who are freaking out about this are doing what the Style Guide says about tab navigation. What they're doing is using the enhanceable_content class that people in the Community have been pushing as a way to accomplish this. If they were using the Style Guide, they would see that there are two parts to the Tabs. There is the code that goes into the HTML and the code that needs placed into JavaScript.

$("#styleguide-tabs-demo-regular").tabs()

That code applies the tabs() through jQuery and it uses the jQueryUI. That's what's going to have to change at some point if people don't load their own jQuery UI or add different jQuery plugin to do tabs. There are a lot of ones to choose from, although jQuery UI made it nice because there was a consistent look and feel to it.

Let's look at the final question:

So my post is more geared at the point "Yeah I can add this stuff now and it will be cool. But what am I going to have to go through later, if and when these things aren't functional anymore"

I think the answer is that if you haven't relied on the enhanceable_content class, then don't start now. Find your own way of adding tabs or sliders or accordions or anything else that you want to add to your website and add it yourself instead of relying on Canvas to do it for you. If you have already started using the enhanceable_content automagic, then start making plans to do something else.

View solution in original post