CuBoulder / express_mono

Monolithic Express Profile - contains all bundles
GNU General Public License v2.0
1 stars 2 forks source link

Burning Glass widgets #635

Open kevincrafts opened 4 years ago

kevincrafts commented 4 years ago

From a recent web support request:

Hello! I'm working with Career Services who has contracted with a third-party called Burning Glass. Part of the package of what we receive from them is the ability to put widgets into our web pages to help students connect the skills they are learning in their academics and co-curriculars with potential career paths.

For this, they have said that we will need to be able to put a 'code snippet' onto the pages of our website. Here's a brief overview that was sent to us from Burning Glass:

Program Page Codes

You will add a code snippet to each page where the program page widget needs to appear. Each program in the application has its own Program Code, which dictates the program outcomes that appear in the widget. The program Code number in the snippet must match the program page where the iframe is embedded. The list of codes for all of your programs is in the table, where you can choose to copy the code on its own and add it to the snippet, or copy the entire snippet with the correct program code included.

I think this may be what they are talking about: https://www.burning-glass.com/products/career-insight - there isn't a lot of information or any documentation of this publicly available.

jwfuller commented 4 years ago

User wants to embed 3rd party code, specific to client

jwfuller commented 4 years ago

From @kevincrafts

<div id="ci"></div>
<script src="https://careerinsight.burning-glass.com/enroll/scripts/cienroll.js"></script>
<script>
document.body.onload = function() {
var props = {
accessCode: 'f399bb8',
programCode: 'b1bb493e',
elementId: 'ci'
}
openCI(props);
}
</script>
kevincrafts commented 4 years ago
<div id="ci"></div>
<script src="https://careerinsight.burning-glass.com/enroll/scripts/cienroll.js"></script>
<script>
document.body.onload = function() {
var props = {
accessCode: 'f399bb8',
programCode: 'cb676fc8',
elementId: 'ci'
}
openCI(props);
}
</script>
kevincrafts commented 4 years ago

So I confirmed with the department that each code snippet is program specific. There will need to be a different snippet for each academic program on campus - over 100.

However, they are going to pilot with only a few departments this year, so depending on which departments those are will define how many code snippets will be required. Once the pilot is done they want every academic department to use it.

kevincrafts commented 4 years ago

I'm also concerned with accessibility - I can already see some color contrast issues (they do have a high contrast toggle) but I think we should have the accessibility lab look at this as well.

Screen Shot 2020-08-19 at 8.48.29 AM.png

kevincrafts commented 4 years ago

Confirmed this has gone through an accessibility review and passed. #101106 for reference

jwfuller commented 4 years ago

@kevincrafts and I discussed implementing this via Full HTML blocks for the 6 site pilot. If the pilot is a success, we want to implement this as part of a 2nd party content bundle that can be expanded to handle other types of JS driven content

AlanBCole commented 3 years ago

@kevincrafts In the javascript includes pr #727 there are two ways to 'include' javascript includes (sorry). Which one is best for this: via context or block placement?

jwfuller commented 3 years ago

For this widget, I think context since it should be applied at the bottom of the page like Google Analytics