Implement WorldCat button for zero-result searches

Created by

Jeremy McWilliams, Lewis & Clark College

Description

This customization enables you to add a button to the new Primo UI that will send the user’s search to Worldcat if their Primo search returns zero results.

System components

Package Manager/PBO, Javascript

Skill set requirements

PBO, Javascript

Implementation steps

This can be accomplished two ways: in a Primo Back Office code table, or using the Package Manager.

Primo Back Office Code table method

No records found message in Primo.
  1. Navigate to FE Code Table-> Front End -> Error Message->default.nui.noresults.description
  2. In the description field, place the following code, replacing your Worldcat URL with the bolded text below:

    There are no results matching your search "{{term}}". <a href="https://watzek.on.worldcat.org/search?queryString={{term}}" onmouseover='this.style.textDecoration="none"'> <button class="md-raised md-button md-primoExplore-theme md-ink-ripple" type="button" ng-transclude="" aria-label="Search WorldCat" style='margin-left:0;margin-right:0;'> <img src="custom/LCC_NEWUI/img/worldcat-logo.png" width="22" height="22" alt="worldcat-logo" style="vertical-align:middle;"> Search WorldCat</button> </a>
  3. Save the entry, and then deploy the code table

Package Manager method

0 Results message in Primo
  1. Open custom.js in your local package
  2. Insert the following code, replacing the link in quotes with your custom WorldCat instance (e.g. https://watzek.on.worldcat.org) and the sentence in quotes with the text you’d like to appear when the button is shown. Note: in custom.js, this must be pasted after the following line:
    var app = angular.module(‘viewCustom’, [‘angularLoad’]);

    function addWorldcatButton(opts){
     app.component('prmSearchResultListAfter', {
     require: {
     prmSearchCtrl: '^prmSearch' },
     controller: 'worldcatButtonController',
     template: `<md-card class="default-card _md zero-margin md-primoExplore-theme" ng-hide="getZeroResults()"> <md-card-title>` + opts.title + `</md-card-title> <md-card-content> <md-button class="md-raised" ng-click="searchWorldCat()"> <img src="https://cdn.rawgit.com/Alliance-PCJWG/primo-explore-worldcat-button/7ee112df/img/worldcat-logo.png" width="22" height="22" alt="worldcat-logo" style="vertical-align:middle;"> Search WorldCat </md-button> </md-card-content> </md-card>` })


    .controller('worldcatButtonController', ['$scope', '$mdDialog',
    function($scope, $mdDialog) {
     var vm = this;
     vm.$onInit = function() {
     $scope.wcBase = opts.link;
     $scope.$prmSearchCtrl = vm.prmSearchCtrl;
     $scope.getZeroResults = function() {
     if ($scope.$prmSearchCtrl.searchService.searchDone && $scope.$prmSearchCtrl.searchService.searchStateService.resultObject.info) { $scope.searchTerm = $scope.$prmSearchCtrl.searchService.searchFieldsService.mainSearch; return ($scope.$prmSearchCtrl.searchService.searchStateService.resultObject.info.total !== 0); } }; $scope.searchWorldCat = function() { window.open(($scope.wcBase + "search?databaseList=&queryString=" + $scope.searchTerm), '_blank'); }; }; }]); }


    addWorldcatButton({
     title: 'Your search returned zero results, but more might be available by searching WorldCat.',
    link: 'https://yourworldcaturl.worldcat.org/'
    });
  3. Zip and load your local package to the Primo Back Office
  4. Deploy your view