Skip to content

Instantly share code, notes, and snippets.

@barnabyalter
Last active August 29, 2015 14:24
Show Gist options
  • Save barnabyalter/e5e1388b225c5337f4e5 to your computer and use it in GitHub Desktop.
Save barnabyalter/e5e1388b225c5337f4e5 to your computer and use it in GitHub Desktop.
Library Hours

Library Hours

Gives us a Grid view for a the hours for all the libraries and departments. The grid can be made for a weekly view or the monthly view. Buttons are provided to show other months or weeks. LibCal Provides us the code for these widgets. But the one thing different about these widgets is that the CSS also needs to be copied in to our site not like the other widgets by LibCal.

API Output

Option: JavaScript

Example
Code

Where iid is the calendar ID

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.js"></script> 
<link href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet"> 
<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script> 
<script src="//maps.google.com/maps/api/js?sensor=false"></script>
<script src="//api3.libcal.com/js/hours_full.js?002"></script> 
<div id="Hours"></div> 
<script>
$(function(){ 
var hours = new $.LibCalHoursFull( $("#hours"), { iid: 1287, months: 3 }); 
});
</script> 
<div id="hours"></div>
Screenshot

Styling options

The CSS that is generated can be tweaked to suit our needs so we don't have to change it in LibCal. Here is an example of the output CSS: https://gist.github.com/barnabyalter/8c4a67eb179385ae7fe2

Related Links

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment