Skip to content

Instantly share code, notes, and snippets.

@jrmeyerhofer
Created November 12, 2016 15:38
Show Gist options
  • Save jrmeyerhofer/1997657b37e49bc30e6c4bcbbd03311e to your computer and use it in GitHub Desktop.
Save jrmeyerhofer/1997657b37e49bc30e6c4bcbbd03311e to your computer and use it in GitHub Desktop.
Final Macalester New Title page HTML http://www.macalester.edu/library/new/index.html
<script src="list.min.js"></script>
<script src="list.pagination.min.js"></script>
<style>
.pagination li {
display:inline-block;
padding:5px;
}
.active a {
font-weight: bold;
text-decoration: none;
pointer-events: none;
cursor: default;
color: #EA6506;
}
</style>
<div id="new-arrival-list">
<p>
<form class="inline-form">
<!-- label class="control-label" for="select_element_h">Search for a Title or Author:</label>
<input type="text" onfocus="clearForm();" style="width:50%;" placeholder="Search for a Title, Author, or Department..." class="search" />
<br / -->
<label class="control-label" for="select_element_h">Select a department:</label>
<select name="fund" class="fund" id="fund" onfocus="clearForm();" onchange="listObj.search(this.value, ['dept']);">
<option name="all" value="all">Select a department...</option>
<option name="bame" value="American Studies">American Studies</option>
<option name="bant" value="Anthropology">Anthropology</option>
<option name="bart" value="Art">Art</option>
<option name="balc" value="Asian Languages and Cultures">Asian Languages and Cultures</option>
<!-- option name="bbio" value="Biology">Biology</option -->
<option name="bche" value="Chemistry">Chemistry</option>
<option name="bcla" value="Classics">Classics</option>
<option name="bdan" value="Dance">Dance</option>
<!-- option name="beco" value="Economics">Economics</option -->
<option name="bedu" value="Education">Education</option>
<option name="beng" value="English">English</option>
<option name="benv" value="Environmental Studies">Environmental Studies</option>
<option name="bfre" value="French">French</option>
<option name="bgeg" value="Geography">Geography</option>
<!-- option name="bgel" value="Geology">Geology</option -->
<option name="bger" value="German">German</option>
<option name="bspa" value="Hispanic Studies">Hispanic Studies</option>
<option name="bhis" value="History">History</option>
<option name="bint" value="International Studies">International Studies</option>
<!-- option name="blat" value="Latin American Studies">Latin American Studies</option -->
<option name="blin" value="Linguistics">Linguistics</option>
<option name="bmat" value="Mathematics and Computer Science">Mathematics and Computer Science</option>
<option name="bhum" value="Media and Cultural Studies">Media and Cultural Studies</option>
<option name="bmus" value="Music">Music</option>
<!-- option name="bneu" value="Neuroscience">Neuroscience</option -->
<option name="bphi" value="Philosophy">Philosophy</option>
<option name="bphy" value="Physics">Physics</option>
<option name="bpol" value="Political Science">Political Science</option>
<!-- option name="bpsy" value="Psychology">Psychology</option -->
<option name="brel" value="Religious Studies">Religious Studies</option>
<option name="brus" value="Russian">Russian</option>
<option name="bsoc" value="Sociology">Sociology</option>
<option name="bthe" value="Theater">Theater</option>
<option name="bwom" value="Woman/Gender Studies">Woman/Gender Studies</option>
</select>
<br/><label class="control-label" for="select_element_h">or Select a Format:</label>
<button class="button" type="reset" onClick="formatSearch('Video_DVD');">DVD</button>&nbsp;&nbsp;<button class="button" type="reset" onClick="formatSearch('Book');">Book</button>&nbsp;&nbsp;<button class="button" type="reset" onClick="formatSearch('Book_Digital');">eBook</button>&nbsp;&nbsp;<button class="button" type="reset" onClick="formatSearch('Music_CD');">CD</button>
&nbsp;&nbsp;&nbsp;&nbsp;
<button class="button orange-button icon-to-right icon-refresh" type="reset" onClick="clearForm();">Reset</button>
</form>
</p>
<hr>
<ul class="newsListing list clearfix">
#dotParse("/library/new/new_arrival_list.vtl")
</ul>
<h3><ul class="pagination"></ul></h3>
</div>
<script>
var paginationOptions = {
name: "pagination",
paginationClass: "pagination",
innerWindow: 2,
outerWindow: 2,
left: 1,
right: 1
};
var listOptions = {
valueNames: [ 'name', 'dept', 'type' ],
page: 8,
plugins: [
ListPagination(paginationOptions)
]
};
var listObj = new List('new-arrival-list', listOptions);
//added for URL parm passing of department
//ex: http://www.macalester.edu/library/new/index.html?dept=American%20Studies
//ex: http://www.macalester.edu/library/new/index.html?dept=Chemistry
var urlDept = getQueryVariable("dept")
if (urlDept != "") {
listObj.search(urlDept, ['dept']);
$('select').val(urlDept);
}
function clearForm() {
listObj.search();
$('select').val('all');
$('input:text').val('');
}
function formatSearch(p1) {
clearForm();
listObj.search(p1, ['type']);
}
function getQueryVariable(variable) {
var query = window.location.search.substring(1)
var vars = query.split("?");
for (var i=0;i<vars.length;i++) {
var pair = vars[i].split("=")
if(pair[0] == variable){
if(pair[1].indexOf('%20') != -1){
console.log(pair[1].indexOf('%20'))
var fullName = pair[1].split('%20')
console.log(fullName)
return fullName[0] + ' ' + fullName[1]
}
else {
return pair[1];
}
}
}
return(false)
}
</script>
<p style="font-size:small;">The New Arrival page displays the new items from <a href="http://www.macalester.edu/">Macalester’s</a> <a href="http://www.macalester.edu/library/">DeWitt Wallace Library</a> for the 2016-17 academic year. Powered by <a href="http://www.listjs.com/">List.js</a> with images provided by <a href="https://www.oclc.org">OCLC</a>.
</p>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment