add onesearch to prototype 3

This commit is contained in:
Mark Eaton
2021-02-25 13:23:45 -05:00
parent 6d9c7eadd5
commit a05b42da38
2 changed files with 154 additions and 10 deletions
+67 -7
View File
@@ -7,7 +7,7 @@ body {
/* style navbar */
.navbar-default {
background-color: #bbb;
background-color: #ccc;
border: none;
font-size: 1.4em;
color: #111;
@@ -27,10 +27,26 @@ body {
/* style jumbotron */
.jumbotron {
color: white;
background-color: #003466;
border-radius: 0px !important;
.onesearch-jumbotron {
text-align: center;
margin-top: 45px;
}
#onesearch-header {
color: #003466;
}
.zero-margin {
margin-left: -2px;
margin-right: -2px;
}
#dropdownMenu1 {
border-radius: 0px;
}
a.searchmenu {
color: #111;
}
/* style link list */
@@ -41,13 +57,15 @@ body {
/* style for nav by the jumbotron */
.nav-by-jumbotron {
margin-top: -6px;
margin-bottom: 40px;
}
.nav-divs-by-jumbotron {
background-color: #bbb;
text-align: center;
padding: 8px;
padding: 6px;
margin: 6px 0px;
color: #111;
background-color: #ccc;
}
.nav-divs-by-jumbotron>h2 {
@@ -168,6 +186,10 @@ img {
max-width: 300px;
}
.yamm4 {
max-width: 450px;
}
/*!
* Yamm!3 - Yet another megamenu for Bootstrap 3
* http://geedmo.github.com/yamm3
@@ -225,6 +247,44 @@ window.onload = function () {
};
</script>
<!-- script to make OneSearch dropdown work -->
<script type="text/javascript">
function customizeSearch(facet) {
// re-render the dropdown menu with the current pick
document.getElementById('dropdownMenu1').innerHTML = facet + ' <span class="caret"></span>';
// reset any previously selected facets
document.querySelectorAll('.deleteWithDropdownChange').forEach(e => e.remove());
document.getElementById("formToAppendInputsTo").setAttribute("action", "https://cuny-kb.primo.exlibrisgroup.com/discovery/search");
document.getElementById("tabSetting").setAttribute("value", "Everything");
// add the facet that matches the user's dropdown selection
if (facet === "Books") {
document.getElementById("formToAppendInputsTo").insertAdjacentHTML('afterbegin', '<input name="facet" value="rtype,include,books" type="hidden" class="deleteWithDropdownChange" />');
} else if (facet === "Articles") {
document.getElementById("formToAppendInputsTo").insertAdjacentHTML('afterbegin', '<input name="mfacet" value="rtype,include,articles,1" type="hidden" class="deleteWithDropdownChange"/><input name="mfacet" value="rtype,include,newspaper_articles,1" type="hidden" class="deleteWithDropdownChange" />');
} else if (facet === "Videos") {
document.getElementById("formToAppendInputsTo").insertAdjacentHTML('afterbegin', '<input name="facet" value="rtype,include,videos" type="hidden" class="deleteWithDropdownChange" />');
} else if (facet === "Journals") {
document.getElementById("formToAppendInputsTo").setAttribute('action', 'https://onesearch.cuny.edu/discovery/jsearch');
document.getElementById("tabSetting").setAttribute("value", "jsearch_slot");
} else if (facet === "Newspapers") {
document.getElementById("formToAppendInputsTo").setAttribute('action', 'https://onesearch.cuny.edu/discovery/npsearch');
} else {
console.log("no match")
};
};
</script>
<!-- OneSearch widget script from OLS. Used without modification -->
<script type="text/javascript">
function addPrimoQuery() {
document.getElementById("primoQuery").value = "any,contains," + document.getElementById("primoQueryTemp").value.replace(/[,]/g, " ");
/* If you changed the form name at the top, change it below to match */
document.forms["searchPrimoForm1"].submit();
}
</script>
<!-- Load bootstrap accessibility libraries (https://github.com/paypal/bootstrap-accessibility-plugin) -->
<link rel="stylesheet" type="text/css" href="//libapps.s3.amazonaws.com/sites/2365/include/bootstrap-accessibility.min.css">
<script type="text/javascript" src="//libapps.s3.amazonaws.com/sites/2365/include/bootstrap-accessibility.min.js"></script>
+87 -3
View File
@@ -178,9 +178,93 @@
<div class="container">
<div class="row">
<div class="col-sm-8">
<div class="jumbotron">
<h1 class="display-4">OneSearch goes here</h1>
</div>
<form class="form-inline yamm onesearch-jumbotron" name="searchPrimoForm1" role="search" method="get" action="https://cuny-kb.primo.exlibrisgroup.com/discovery/search" onsubmit="addPrimoQuery();" enctype="application/x-www-form-urlencoded; charset=utf-8" id="formToAppendInputsTo">
<!-- default is "everything" option suggested from OLS widget builder -->
<input name="vid" value="01CUNY_KB:CUNY_KB" type="hidden" />
<input name="tab" value="Everything" type="hidden" id="tabSetting" />
<input name="search_scope" value="MyInst_and_CI" type="hidden" />
<input name="mode" value="basic" type="hidden" />
<input name="highlight" value="true" type="hidden" />
<input name="displayMode" value="full" type="hidden" />
<input name="bulkSize" value="10" type="hidden" />
<input name="dum" value="true" type="hidden" />
<input name="displayField" value="all" type="hidden" />
<input name="pcAvailabiltyMode" value="false" type="hidden" />
<input name="query" id="primoQuery" type="hidden" />
<h1 id="onesearch-header">OneSearch</h1>
<div class="form-group">
<div class="dropdown input-group zero-margin">
<button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
Define Your Search
<span class="caret"></span>
</button>
<ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
<li>
<div class="yamm-content yamm4">
<div class="row">
<a class="searchmenu" onclick="customizeSearch('Books')">
<div class="col-xs-12">
<strong>Books</strong>
<p class="faux-card">Find print books and ebooks using OneSearch</p>
</div>
</a>
<a class="searchmenu" onclick="customizeSearch('Articles')">
<div class="col-xs-12">
<strong>Articles</strong>
<p class="faux-card">Find articles in journals, newspapers and magazines</p>
</div>
</a>
<a class="searchmenu" onclick="customizeSearch('Videos')">
<div class="col-xs-12">
<strong>Videos</strong>
<p class="faux-card">Find DVDs and streaming videos</p>
</div>
</a>
<a class="searchmenu" onclick="customizeSearch('Everything')">
<div class="col-xs-12">
<strong>Everything</strong>
<p class="faux-card">Search for all using OneSearch</p>
</div>
</a>
<a href="https://kbcc.cuny.libguides.com/az.php" class="searchmenu" onclick="customizeSearch('Databases')">
<div class="col-xs-12">
<strong>Databases</strong>
<p class="faux-card">Find A to Z list and find databases by subject</p>
</div>
</a>
<a class="searchmenu" onclick="customizeSearch('Journals')">
<div class="col-xs-12">
<strong>Journals</strong>
<p class="faux-card">Find specific scholarly journals (peer reviewed)</p>
</div>
</a>
<a class="searchmenu" onclick="customizeSearch('Newspapers')">
<div class="col-xs-12">
<strong>Newspapers and magazines</strong>
<p class="faux-card">Find specific newspapers and magazines</p>
</div>
</a>
<a href="https://kbcc.cuny.libguides.com/er.php?b=c" class="searchmenu" onclick="customizeSearch('Reserves')">
<div class="col-xs-12">
<strong>Course reserves</strong>
<p class="faux-card">Find materials for your classes</p>
</div>
</a>
</div>
</div>
<li>
</ul>
</div>
<label class="sr-only" for="primoQueryTemp">Search terms</label>
<div class="input-group zero-margin">
<input type="text" class="form-control" name="queryTemp" id="primoQueryTemp" type="search" value="" placeholder="Enter search term here">
</div>
<div class="input-group zero-margin">
<input type="submit" class="btn btn-default form-control" value="Search" type="submit" onclick="addPrimoQuery();" />
</div>
</div>
</form>
</div>
<div class="col-sm-4">
<div class="nav-by-jumbotron">