CSU Library Website Customization

Documentation of CSU Primo and LibGuides customization

Preparing Resources Excel Files

Problem Description

Colorado State University has Fort Collins and Pueblo campuses. To save money we pay for one Alma license. In Primo New UI, each campus had a Back Office, so we could add Resource Recommender files to our own Primo instance. After we migrated to Primo VE, we manage all campuses' interface under Alma/Discovery. We could use different views to customize looks and etc. However, in Discovery Resource Recommender set up is outside of the view set up section. That means only one Resource Recommender can be activated and all campuses will see it.

Original Excel Files

When we were using Primo New UI, each campus has their own Resource Recommender Excel files.

CSU Fort Collins' recommended resources (Scroll to the bottom of this section to download the sample Excel files, those will be uploaded to Primo VE.)

CSU Pueblo's recommended resources

Prepare Excel Files for Primo VE

Step 1. Add campus prefix to names and key columns

We don't not need to add prefixes manually. We can use Excel built-in function to do so.

Add two empty columns behind the name columns

Move cursor to cell C3 and type ="(CSUP) "&B2. This formula adds string (CSUP) in front of the text in cell B2.

Highlight cell C2 and drag the + sign on the right lower corner to the last cell of this column. Now all cells has value of B column with prefix (CSUP). When you dozens or hundreds rows, this come handy.

You can't delete column B yet because all entries in column C are based on cells in Column B. If the reference column B is deleted, column C will contains error messages. What you need to do is highlight the entire column C, copy, then select Column D, paste special - Value. Now you can delete column B and C. Make sure you add "name" to the top of the newly created column, otherwise VE won't like it.

Results

Use the same strategy to add prefix csup_ to all key entries. Technically we don't need to do add prefixes to keys but just in case both campuses uses the same key. This is just for avoiding unnecessary errors before you have to debug them. For keys, it is best just use letter and underscores, no special characters.

Do the same for all recommended resources files. For us, we have suggested resources, libguides, and librarians.

Step 2. Combine files from both campuses.

Just copy and paste to merge one campus' file to the other one's. Combined suggested resources file for us.

How the Customized Resource Recommender Work

The source code was borrowed from St. Olaf and Carleton Libraries. The source code from this site does not work for me so I had to modify a little. I also received help from Wei Xuan from University of Manitoba Libraries. He helped me to find out what the meaning of the following two variables those are essential to understand how the code work.

vm.parentCtrl.previewResources
vm.parentCtrl.recommendedResources;

Inspect Source Code

Step 1: Load the page, inspect source code

Step 2: Click console tab and type angular.reloadWithDebugInfo(). You will see the javscript source code running behind the scene.

Customized Source code for Resource Recommender

app.controller('prmResourceRecommenderAfterController', ['angularLoad', function(angularLoad) {
var vm = this;
var schoolName = '(CC)';
var resourceName = '';
var i = 0;
var j = 0;
var k = 0;
var count = 0;
var start = false;
vm.$doCheck = function() {
var resourceArray = vm.parentCtrl.previewResources;
var resourceArray2 = vm.parentCtrl.recommendedResources;
if (resourceArray) {
for (i = 0; i < resourceArray.length; i = i + 1) {
if (resourceArray[i].name.includes(schoolName)) {
resourceArray.splice(i,1);

} else {
resourceArray[i].name = resourceArray[i].name.replace('$StO$', ''); } }

for (j = 0; j < resourceArray2.length; j = j + 1) {
if (resourceArray2[j].name.includes(schoolName)) {

resourceArray2.splice(j,1);
} else { resourceArray2[j].name = resourceArray2[j].name.replace('$StO$', ''); }}

if (resourceArray.length < resourceArray2.length) {
for (j = 0; j < resourceArray2.length; j++) {
for (k = 0; k < resourceArray.length; k++) {
if ( resourceArray[j] == resourceArray2[k] ) {
start = true; } }
count++;
if (count == 1 && start == false && resourceArray.length < 3) {
resourceArray.push(resourceArray2[j]);
}
start = false;
count = 0;
} } } }; }]);

app.component('prmResourceRecommenderAfter', {
bindings: {
parentCtrl: '<'
},
controller: 'prmResourceRecommenderAfterController'
});

Step 3: Stop the debugger and the page will load again. Click the Elements tab select the `prmResourceRecommenderAfter` , Click Console tab and run angular.element($0).scope().$ctrl

You will see what was included in each list.

previewResource Array generates this box on the brief results page

recommendedResource generates the pop up window. If this array has 3 or less items, the pop up window won't show.

CSU Javascript Fix

For some reason, St. Olaf and Carleton Libraries code does not work for us. I had to add condition to check both CSUFC and CSUP entries. The following code is for Colorado State University Fort Collins campus.

app.controller('prmResourceRecommenderAfterController', ['angularLoad', function(angularLoad) {

var vm = this;

var schoolName1 = '(CSUFC)'; // For Fort Collins campus. The (CSUFC) is the prefix in the name column.

var schoolName2 = '(CSUP)'; // For Pueblo campus. (CSUP) is the prefix in the name column.

var i = 0;

var j = 0;

var k = 0;

var count = 0;

var start = false;

vm.$doCheck = function() {

// vm.parentCtrl.previewResources: previewResources are the returned resources listed on the brief result page, max 3 resources.

var resourceArray = vm.parentCtrl.previewResources;

// vm.parentCtrl.recommendedResources: If the recommened resources is more than 3, the "see all # suggested resources" will list all resources.

var resourceArray2 = vm.parentCtrl.recommendedResources;

if (resourceArray) {

for (i = 0; i < resourceArray.length; i = i + 1) {

//If a returned entry in the resourceArray has prefix in (CSUFC), delete the (CSUFC) prefix and display the entry.

if (resourceArray[i].name.includes(schoolName1)) {

resourceArray[i].name = resourceArray[i].name.replace('$CSUFC$', '');

}

else if(resourceArray[i].name.includes(schoolName2)) {

//If the array has an entry with (CSUP) prefix in the name field, delete this entry from the previewResources array. An example would be both campuses has recommended resources for search term art. There are total 5 entries in this list initially. After the loop, 3 entries from Pueblo will be deleted and only two entries from Fort Collins are left to be displayed.

// Fort Collins search for art exmple.

// Pueblo search for art example

resourceArray.splice(i,1); // Removes the current array item in the array, which is an entry belong to another campus.

}

else { // do nothing. Actually the code never gets here. }

}

// Use the same strategy to work through recommendedResources array to filter out entries belong to another campus.

for (j = 0; j < resourceArray2.length; j = j + 1) {

if (resourceArray2[j].name.includes(schoolName1)) {

resourceArray2[j].name = resourceArray2[j].name.replace('$CSUFC$', '');

}

else if(resourceArray2[j].name.includes(schoolName2)) {

resourceArray2.splice(j,1); }

else { //do nothing } }

if (resourceArray.length < resourceArray2.length) {

for (j = 0; j < resourceArray2.length; j++) {

for (k = 0; k < resourceArray.length; k++) {

if ( resourceArray[j] == resourceArray2[k] ) {

start = true;

} }

count++;

if (count == 1 && start == false && resourceArray.length < 3) {

resourceArray.push(resourceArray2[j]);

}

start = false;

count = 0;

} } } };

}]);

app.component('prmResourceRecommenderAfter', {

bindings: {

parentCtrl: '<'

controller: 'prmResourceRecommenderAfterController'

});

Examples

Both campuses has recommended resources for the search term art

CSU Fort Collins recommended resources for art

December 2020 New Release Fixed the Problem

2020 December release fixed the problem so I removed the JS code from custom.js file. Each resource can be assigned to one or more views in VE Admin interface or can just add them to the new view field in the Excel file.